@charset "UTF-8";

.intro{position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.top-img{-webkit-box-ordinal-group: 1;order: 0;width: 100%;background: url("../../images/dr-cosme/kbeaute/top-sp.jpg") no-repeat center;background-size: cover;padding-bottom: 81vw;margin-bottom: 7vw;position: relative;z-index: -2;}
.intro-ttl{-webkit-box-ordinal-group: 1;order: 1;position: relative;width: 86vw;margin: 0 auto;}
.intro-ttl .en{color: var(--gold);font-family: "Marcellus";font-weight: 400;letter-spacing: 0.08em;display: block;font-size: 11vw;margin-bottom: 4vw;}
.intro-ttl .mini{display: block;color: #6c6554;font-weight: bold;font-size: 5vw;margin-bottom: 4vw;}
.intro-ttl .jp{display: block;font-family: var(--mincho);font-weight: 600;line-height: 1.5;font-size: 6.5vw;}
.deco{position: absolute;z-index: -1;width: 50vw;right: -9vw;bottom: 25vw;}

.second-text{width: 86vw;}

.concept{margin-bottom: 10vw;}
.concept .midashi02{display: -webkit-box;display: -webkit-flex;display: flex;-webkit-align-items: baseline;align-items: baseline;margin-bottom: 3vw;}
.concept .midashi02 .en{font-size: 7vw;}
.concept .midashi02 .jp{font-size: 3.6vw;top: -2px;position: relative;-webkit-align-items: baseline;align-items: baseline;}
.concept img{width: 100%;margin-bottom: 6vw;}
.concept .catch{font-family: var(--mincho);font-weight: 600;line-height: 1.5;font-size: 5.2vw;}
.concept ul{background: #ebe5c8;padding: 6vw;margin-bottom: 4vw;}
.concept li{border-bottom: 1px dashed #d4c6b0;font-weight: bold;line-height: 1.4; text-indent: -1.5em; padding:0 0 3vw 1.5em;margin-bottom: 3vw;font-size: 3.6vw;}
.concept li:last-child{border-bottom: none;padding-bottom: 0;margin-bottom: 0;}
.concept li span{font-family: "Marcellus";font-weight: 400;color: var(--gold); font-size: 120%;margin-right: 2vw;}
.concept .text{color: #6c6554;font-weight: bold;}

.about-list{margin-bottom: 12vw;}
.about-list li{background: #fff;padding: 4vw;margin-bottom: 4vw;}
.about-list dt{background: #ebe5c8;text-align: center;font-weight: bold;padding: 2vw 0;margin-bottom: 3vw;}
.about-list dd{line-height: 1.5;text-align: center;}
.about-list p{font-family: var(--mincho);font-size: 4.5vw;}

.item-set .midashi01{margin-bottom: 8vw;}
.item-set .midashi01 .jp{color: var(--black);letter-spacing: 0.06em;}
.item-list{display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: justify;justify-content: space-between;}
.item-list li{width: 48%;text-align: center;margin-bottom: 5vw;}
.item-list li img{width: 100%;margin-bottom: 4vw;}
.item-list .name{font-family: var(--mincho);font-weight: 600;font-size: 4vw;margin-bottom: 3vw;}
.item-list .type{text-align: center;margin-bottom: 3vw;font-size: 3.5vw;}
.item-list .type span{color: #fff;background: var(--gold);padding: 2vw 3vw;border-radius: 50vw;}
.item-list .price{font-weight: bold;letter-spacing: 0.03em;font-size: 3.6vw;}
.item-list .tax{font-size: 80%;}
.item-set>p{text-align: center;font-family: var(--mincho);font-weight: 600;font-size: 4.5vw;}


/* =============================================
pc
================================================*/
@media screen and (min-width: 736px) {
    
.intro{margin-bottom: 60px;}
.intro-ttl .en{font-size: 60px;margin-bottom: 35px;}
.intro-ttl .mini{font-size: 22px;margin-bottom: 30px;}
.intro-ttl .jp{font-size: 34px;line-height: 1.7;}
.deco{width: 466px;right: unset;bottom: -200px;left: calc(50% - 860px);}

.concept{margin-bottom: 80px;}
.concept .midashi02{margin-bottom: 20px;}
.concept .midashi02 .en{font-size: 37px;}
.concept .midashi02 .jp{font-size: 16px;}
.concept img{width: 50%; margin: 0 auto 6vw;}
.concept .catch{font-size: 26px;margin-bottom: 20px;}
.concept ul{padding: 20px;margin-bottom: 20px;}
.concept li{padding:0 0 15px 1.5em;margin-bottom: 15px;font-size: 16px;}
.concept li span{margin-right: 10px;}
.concept .text{font-size: 18px;margin-bottom: 0;}

.about-list{margin-bottom: 80px;}
.about-list .midashi03{padding: 15px 0;margin-bottom: 40px;}
.about-list ul{display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;justify-content: space-between;margin-bottom: 40px;}
.about-list li{margin-bottom: 0;width: 31.5%;padding: 20px;}
.about-list dt{padding: 10px 0;margin-bottom: 20px;}
.about-list p{font-size: 20px;text-align: center;}

.item-set .midashi01{margin-bottom: 50px;}
.item-set .midashi01 .jp{font-size: 18px; letter-spacing: 0.08em;}
.item-list li{width: 24%;max-width: 260px; margin-bottom: 30px;}
.item-list li img{margin-bottom: 20px;}
.item-list .name{font-size: 18px;margin-bottom: 15px;}
.item-list .type{margin-bottom: 15px;font-size: 15px;}
.item-list .type span{padding: 8px 15px;}
.item-list .price{font-size: 16px;}
.item-set>p{font-size: 24px;}
    
}



@media screen and (min-width: 900px) {
    
.intro{-webkit-box-align: center;align-items: center;}
.top-img{-webkit-box-ordinal-group: 1;order: 1;width: 53%;background: url("../../images/dr-cosme/kbeaute/top.jpg") no-repeat center left;background-size: cover;padding-bottom: 500px;margin-bottom: 0;}
.intro-ttl{-webkit-box-ordinal-group: 1;order: 0;width: auto;margin: 0 5% 0 auto;}
    
}


@media screen and (min-width: 1200px) {
    
.concept{display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;justify-content: space-between;-webkit-box-align: center;align-items: center;}
.concept img{width: clamp(300px,48%,600px); margin: 0;}
.concept .txt{width: 49%;}
    
}



/* retina用 ----------------------------------------------- */ 
@media screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 736px) and (min-resolution: 2dppx) {
    
.top-img{background: url("../../images/dr-cosme/kbeaute/top@2x.jpg") no-repeat center left;background-size: cover;}

}
