Newer
Older
mi3-cafe / home.css
@みのさんじょー みのさんじょー on 16 Sep 2022 1 KB henko
*{
    box-sizing: inherit;
}

body{
    background-color: #fbe6ef;
    color: #ffffff;
    display: block;
}


/*ヘッダー*/
header{
    font-size: 400;
    margin: auto;
    width: 100%;
}

header h1{
    text-align: center;
}

.nav .iroiro ul{
    display: flex;
    list-style: none;
}

.nav .iroiro li{
    width: 10%;
}

/*メイン部分*/
.main{
    margin: auto;
    max-width: 100%;
}

/*写真+説明 1セット*/
.intro{
    position: relative;
}

.intro .yoko{
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /*flex 中央揃え*/
    list-style: none;
    padding: 0 30px;
    text-align: center;
    min-width: 784px; /*これ以上小さくならない*/
}

.set{
    margin: 0 1% 25px;
    position: relative;
    width: 23%;
}

.intro_img{
    position: relative;
}

.intro_img figure{
    position: relative;
}

.intro_img img{
    left: 0;
    top: 0;
}

.intro_place{
    background-color: #fcfdfe;
    border-radius: 10px;
    color: #8b4513;
    left: 30px;
    position: absolute;
    text-align: center;
    top: 25px;
    width: 150px;
}

.intro_text{
    left: 0;
    text-align: center;
    top: 206px;
}

.key{
    position: relative;
}

.word{
    display: flex;
    flex-wrap: wrap;
    list-style: none;
}

.key .word li{
    text-align: center;
}

/*画面サイズが480px以下の場合適用*/
/*
@media screen (max-width:480px) {
    
}
*/