@charset "utf-8";
:root {
    --sat: env(safe-area-inset-top);
}
/*@import url(//fonts.googleapis.com/css?family=Roboto:300,400,500,700);*/
/*@font-face { */
/*  font-family: 'Roboto ,'Noto Sans KR'; */
/*  font-style: normal; */
/*  font-weight: 100; */
/*  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'), */
/*      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'), */
/*      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype'); */
/*} */
/*@font-face { */
/*  font-family: 'Roboto ,'Noto Sans KR'; */
/*  font-style: normal; */
/*  font-weight: 300; */
/*  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'), */
/*      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'), */
/*      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype'); */
/*} */
/*@font-face { */
/*  font-family: 'Roboto ,'Noto Sans KR'; */
/*  font-style: normal; */
/*  font-weight: 400; */
/*  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'), */
/*        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'), */
/*        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype'); */
/* } */
/*@font-face { */
/*  font-family: 'Roboto ,'Noto Sans KR'; */
/*  font-style: normal; */
/*  font-weight: 500; */
/*  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'), */
/*        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'), */
/*        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype'); */
/* } */
/*@font-face { */
/*  font-family: 'Roboto ,'Noto Sans KR'; */
/*  font-style: normal; */
/*  font-weight: 700; */
/*  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'), */
/*        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'), */
/*        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype'); */
/* } */
/*@font-face { */
/*  font-family: 'Roboto ,'Noto Sans KR'; */
/*  font-style: normal; */
/*  font-weight: 900; */
/*  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'), */
/*        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'), */
/*        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype'); */
/* } */





#doc {box-sizing: border-box; position:relative;z-index:8999;opacity:1; overflow-x: hidden;
    padding-bottom: 14.4vw;
}
/*#doc {position:relative;min-width:360px; z-index:8999;opacity:0;-webkit-transition: opacity 0.45s ease-in-out;-moz-transition: opacity 0.45s ease-in-out;-o-transition: opacity 0.45s ease-in-out;transition: opacity 0.45s ease-in-out; overflow: hidden;}*/
#doc.show{opacity:1; min-height: 100vh;}
#doc.pop-open{position:absolute; left:-9999em; width:100%; top:0; height:100%; overflow:hidden; padding-bottom: 0;}
/*#doc.iosX{border: 2px solid red; box-sizing: border-box;}*/
/*#doc.bye{border: 2px solid blue; box-sizing: border-box;}*/
@media only screen and (max-width: 500px) {
    #doc {padding-bottom: 72px;
    }

}
@media only screen and (max-width:360px){
    #doc {min-width: 320px !important; }
    #doc.pop-open{padding-bottom: 0;}
}

html{
    box-sizing: border-box; background: transparent !important;
}
body{ background: transparent !important; box-sizing: border-box; overflow-x: hidden;}
body::-webkit-scrollbar {
    display: none !important;
    -webkit-appearance: none !important;
}
html::-webkit-scrollbar {
    display: none !important;
    -webkit-appearance: none !important;
}
#doc::-webkit-scrollbar {
    display: none !important;
    -webkit-appearance: none !important;
}
#container-wrap::-webkit-scrollbar {
    display: none !important;
    -webkit-appearance: none !important;
}
#contents::-webkit-scrollbar {
    display: none !important;
    -webkit-appearance: none !important;
}

/*=======================================================
  css default
=========================================================*/
.div-cont {position:relative;text-align:left;box-sizing:border-box;}
/*.div-cont:after {clear:both;content:"";display:block;}*/

.body-slide-wr {position:relative;width:100%;transition:margin 0.3s ease;}
.body-slider-ovclick{position:fixed;z-index:2600;width:100%;height:100%;left:0;top:0;background:rgba(0,0,0,0.65);cursor:pointer }
.header-slider-ovclick{ position:fixed; z-index:2000; width:100%; height:100%; left:100%; top:0; background:rgba(0,0,0,0.55); cursor:pointer; opacity:0;transition: opacity 0.4s linear;}
.header-slider-ovclick.active{left:0 ; opacity:1}


/*=======================================================
    z-index dafault
=========================================================*/


#container-wrap .setting-info::after{content:''; width: 100%; height: 100%; background: rgba(18, 18, 18, .75) ; display: block; position: absolute; top: 0; left: 0; z-index: -1;}
#container-wrap .setting-info::before{content: ''; width: 100%; height: 100%; background: #121212;
    position: absolute; top: 0; left: 0; z-index: -1;}
#header-wrap.login ~ #container-wrap .setting-info::before{background: url(../_Img/Content/setting-bg.png) no-repeat fixed;  display: block; background-size: 100% auto;}
.header-bg.no-bg.no-sub-bg::after{background: rgba(18, 18, 18, 1) !important;}

.setting-info.profile{width: 100%; box-sizing: border-box; padding: 11.2vw 0 7vw !important; display: flex; color: #fff; position: relative;}
.setting-info.profile .img{ width: 22vw; height: 22vw; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%; }
.setting-info.profile .img img{width: 100%; height: 100%; object-fit: cover;}
.setting-info.profile .txt{display: flex; flex-wrap: wrap; align-items: center; align-content: center; padding: 0 3vw; box-sizing: border-box; width: calc(100% - 6vw - 22vw);}
.setting-info.profile .txt h2{ font-size: 5.8vw; width: 100%; line-height: 1.36; margin-bottom: 1vw;}
.setting-info.profile .txt p{font-size: 3.2vw; display: inline-block; font-weight: 300; margin-right: 3.2vw; letter-spacing: -0.03em; line-height: 1.33;}
.setting-info.profile .txt p span{font-weight: 500; letter-spacing: 0 !important;}
.setting-info .txt ~ .bt-next {bottom: 11vw; width: 8vw; height: 5vw; display: block; position: absolute; right: 6vw; transform:scaleX(-1);padding-top:4vw;}
.setting-info .txt ~ .bt-next i{display: block; width: 30%; height: 0.4vw; background-color: #e5e5e5;}
.setting-info .txt ~ .bt-next i:nth-child(2n){ width: 95%; box-sizing: border-box; margin: 0.4vw auto; }
.setting-info .txt ~ .bt-next i:first-child{ transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); }
.setting-info .txt ~ .bt-next i:last-child{ transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); }
.setting-cont{width: 100%; padding: 5.6vw 3.2vw 7vw; box-sizing: border-box; display: flex; align-items: center; height: 16vw;}

.header-bg ~ #container-wrap{margin-top: 0 !important;}
.header-bg.no-bg #header-wrap.fix{background: #fff;}
#header .if-profile .nick{font-size: 3.6vw; letter-spacing: 0;}
#header .nick.small{font-size: 3.6vw; letter-spacing: 0;}
.header-bg.no-bg #header .if-profile .nick {color: #fff;}
.header-bg.no-bg.fix #header .if-profile .nick {color: #000;}

@media only screen and (max-width:500px){
    .setting-info.profile{ padding: 0 16px; }
    .header-bg{ height: 220px; padding-top: 50px;}

    .setting-info.profile{ box-sizing: border-box; padding: 56px 0 35px !important;}
    .setting-info.profile .img { width: 80px; height: 80px; }
    .setting-info.profile .txt{ padding: 0 12px; box-sizing: border-box; width: calc(100% - 92px);}
    .setting-info.profile .txt h2{ font-size: 22px; margin-bottom: 4px;}
    .setting-info.profile .txt p{ font-size: 12px; margin-right:12px; }
    .setting-info.profile .txt ~ .bt-next {width: 30px; height: 20px;  right: 28px; bottom: 55px;}
    .setting-info.profile .txt ~ .bt-next i {height: 1px;}
    .setting-info.profile .txt ~ .bt-next i:nth-child(2n) { margin: 2px auto; }
    #header .if-profile .nick{font-size: 18px; }
    .header-bg .profile-clearfix{height: 36px;}
    .setting-cont{width: 100%; padding: 28px 16px 35px; height: 80px;}
    #header .nick.small{font-size:18px;}
}


#container-wrap{position:relative;z-index:1056;  box-sizing: border-box; }



/*=======================================================
    #header-wrap
=========================================================*/
#header-wrap{position:fixed;z-index:5002; left:0; width:100%; top:0; transition: top 0.3s linear, visibility 0.1s ease-in-out; box-sizing: border-box; }
/*#header-wrap{left:0; width:100%; top:0; min-width:360px; -webkit-transition: top 0.3s linear;-moz-transition: top 0.3s linear;-o-transition: top 0.3s linear;transition: top 0.3s linear;}*/
#header-wrap.no-head #header{height:auto; display:none;}
#header-wrap.no-head2 #header{height:auto; display:none;}
#header{position:relative; height: 10vw;}
#header::after{width:20000px;height:100%; position:absolute; left:50%;margin-left:-10000px; top:0;background: transparent; display:block; content:"";z-index:-1; padding: inherit; box-sizing: border-box;}
.fix #header:after, #header-wrap.bd #header:after{/*border-bottom:1px solid #efefef;*/ background:#fff;}
#header-wrap.shop_filter #header:after{border-bottom:1px solid #efefef;}
#header-wrap.fix.ani{ padding: 0 !important;}
#header-wrap.fix.ani2{ padding: 0 !important;}
#header-wrap.ani.bg #header::after{ background:#fff; }
#header-wrap.ani2.bg #header::after{ background:#fff; }
#header-wrap.bg.map #header::after{ background:#fff; }
.fix #header:after, #header-wrap.border #header:after{border-bottom:0.2vw solid #f5f5f5;background:#fff;}
.fix.shop #header:after{border-bottom: 0;}
#header-wrap.bd.no-border #header:after{border-bottom:1px solid transparent;}
/*#header-wrap.bd.no-border.login #header{padding-top: 6vw;}*/
.no-bg #header::after{background:transparent;}
.no-bg.fix #header::after{background:transparent;}
.no-bg.fix.ani #header::after{background:#fff;}
.no-bg.fix.ani2 #header::after{background:#fff;}
#header-wrap.ani.hide{top: -10vw;}
#header-wrap.ani2.hide{top: -10vw;}
#doc.iosX #header-wrap.fix.ani{padding: calc(env(safe-area-inset-top) - 2vw) 0 0 0 !important;}
#doc.iosX #header-wrap.fix.ani2{padding: calc(env(safe-area-inset-top) - 2vw) 0 0 0 !important;}
#doc.iosX #header-wrap.sub-fix { padding: calc(env(safe-area-inset-top) - 2vw ) 0 0 0 !important; background: #fff;}
#doc.iosX #header-wrap.layer {padding: calc(env(safe-area-inset-top) - 2vw) 0 0 0 !important; box-sizing: border-box; background: #fff; }
#doc.iosX #header-wrap.ani.bg {padding: calc(env(safe-area-inset-top) - 2vw) 0 0 0 !important; box-sizing: border-box; background: #fff;}
#doc.iosX #header-wrap.ani2.bg {padding: calc(env(safe-area-inset-top) - 2vw) 0 0 0 !important; box-sizing: border-box; background: #fff;}
#doc.iosX #header-wrap.ani-layer.no-bg{padding: calc(env(safe-area-inset-top) - 2vw) 0 0 0 !important;}
#doc.iosX #header-wrap.ani-layer.no-bg.fix.ani {padding: calc(env(safe-area-inset-top) - 2vw) 0 0 0 !important; box-sizing: border-box; background: #fff;}
#doc.iosX #header-wrap.ani-layer.no-bg.fix.ani2 {padding: calc(env(safe-area-inset-top) - 2vw) 0 0 0 !important; box-sizing: border-box; background: #fff; z-index: 5004;}
#doc.iosX #header-wrap.ani-layer.no-bg.fix.ani2.hide #header > * {display: none; font-size: 0; opacity: 0;}
#doc.iosX #header-wrap.ani.hide{top: calc(0vw - env(safe-area-inset-top)) !important; }
#doc.iosX #header-wrap.ani2.hide{top: calc(0vw - env(safe-area-inset-top)) !important; }
#doc.iosX #header-wrap.ani.hide > *:not(.fix_snb) {opacity: 0; visibility: hidden;}
#doc.iosX #header-wrap.ani2.hide > *:not(.fix_snb) {opacity: 0; visibility: hidden;}
#doc.ios #header-wrap.fix.ani{padding: calc(constant(safe-area-inset-top)) 0 0 0 !important; padding: calc(env(safe-area-inset-top)) 0 0 0 !important;}
#doc.ios #header-wrap.fix.ani2{padding: calc(constant(safe-area-inset-top)) 0 0 0 !important; padding: calc(env(safe-area-inset-top)) 0 0 0 !important;}
#doc.ios #header-wrap.sub-fix { padding: calc(constant(safe-area-inset-top)) 0 0 0 !important; padding: calc(env(safe-area-inset-top)) 0 0 0 !important; background: #fff;}
#doc.ios #header-wrap.layer {padding: calc(constant(safe-area-inset-top)) 0 0 0 !important; padding: calc(env(safe-area-inset-top)) 0 0 0 !important; background: #fff; }
#doc.ios #header-wrap.ani.bg {padding: calc(constant(safe-area-inset-top)) 0 0 0 !important; padding: calc(env(safe-area-inset-top)) 0 0 0 !important; background: #fff;}
#doc.ios #header-wrap.ani2.bg {padding: calc(constant(safe-area-inset-top)) 0 0 0 !important; padding: calc(env(safe-area-inset-top)) 0 0 0 !important; background: #fff;}
#doc.ios #header-wrap.ani-layer.no-bg{padding: calc(constant(safe-area-inset-top)) 0 0 0 !important; padding: calc(env(safe-area-inset-top)) 0 0 0 !important; }
#doc.ios #header-wrap.ani-layer.no-bg.fix.ani {padding: calc(constant(safe-area-inset-top)) 0 0 0 !important; padding: calc(env(safe-area-inset-top)) 0 0 0 !important; box-sizing: border-box; background: #fff; }
#doc.ios #header-wrap.ani-layer.no-bg.fix.ani2 {padding: calc(constant(safe-area-inset-top)) 0 0 0 !important; padding: calc(env(safe-area-inset-top)) 0 0 0 !important; box-sizing: border-box; background: #fff; }
#doc.ios #header-wrap.ani.hide{padding-bottom: constant(safe-area-inset-top); padding-bottom: env(safe-area-inset-top);}
#doc.ios #header-wrap.ani2.hide{padding-bottom: constant(safe-area-inset-top); padding-bottom: env(safe-area-inset-top);}
#doc.ios #header-wrap.ani.hide > *:not(.fix_snb) {opacity: 0; visibility: hidden;}
#doc.ios #header-wrap.ani2.hide > *:not(.fix_snb) {opacity: 0; visibility: hidden;}

#doc.iosX #header-wrap.ani.hide + #doc.iosX #container-wrap.shop {padding: calc(constant(safe-area-inset-top) + 8vw) 0 0 0 !important padding: calc(env(safe-area-inset-top) + 8vw) 0 0 0 !important;}
#doc.iosX #header-wrap.ani2.hide + #doc.iosX #container-wrap.shop {padding: calc(constant(safe-area-inset-top) + 8vw) 0 0 0 !important padding: calc(env(safe-area-inset-top) + 8vw) 0 0 0 !important;}
#doc.ios #header-wrap.ani.hide + #doc.ios #container-wrap.shop {padding: calc(constant(safe-area-inset-top)) 0 0 0 !important; padding: calc(env(safe-area-inset-top)) 0 0 0 !important;}
#doc.ios #header-wrap.ani2.hide + #doc.ios #container-wrap.shop {padding: calc(constant(safe-area-inset-top)) 0 0 0 !important; padding: calc(env(safe-area-inset-top)) 0 0 0 !important;}
@media only screen and (max-width: 500px) {
    #doc.iosX #header-wrap.ani.hide + #doc.iosX #container-wrap.shop {padding: calc(constant(safe-area-inset-top) + 40px) 0 0 0 !important; padding: calc(env(safe-area-inset-top) + 40px) 0 0 0 !important;}
    #doc.iosX #header-wrap.ani2.hide + #doc.iosX #container-wrap.shop {padding: calc(constant(safe-area-inset-top) + 40px) 0 0 0 !important; padding: calc(env(safe-area-inset-top) + 40px) 0 0 0 !important;}
}



#header .is-hidden.active{display: none !important;}
#header .if-profile{width: 100%; height: 100%; justify-content: flex-start; align-items: center; padding: 0 3.2vw; display: none; box-sizing: border-box; background: #fff;}
#header .if-profile.center{justify-content: center; text-align: center;}
#header .if-profile.show{display: flex;}
#header .if-profile .img{display: inline-block; width: 5.2vw; height: 5.2vw; overflow: hidden; border-radius: 50%; margin-right: 1.6vw;}
#header .if-profile .img img {display: inline-block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}
#header .if-profile h2 {position: initial; padding: 0 !important; transform: initial !important; display: inline-block; width: auto;}
#header h2 {font-size:3.4vw; color:#000; letter-spacing:-0.03em; font-weight:700; line-height:1.2em; position:absolute; left:50%; top:50%;
    display: inline-block !important; box-sizing:border-box; padding:0 3vw;text-align:center;-webkit-transform: translate(-50%, -50%);
    white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 70%;}
#header h2.nick {text-align:left;font-size:4vw;}
#header-wrap.fix .nick {color: #000 !important;}

#header .bt-prev{position:absolute; left:3vw; top:50%;width:6vw;height:6vw; background:url(../_Img/Layout/bt-prev.png) no-repeat left center; background-size:40% auto;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}
#header .bt-prev.white{background:url(../_Img/Layout/bt-prevw.svg) no-repeat left center; }
#header .bt-close{position:absolute; left:3vw; top:50%;width:6vw;height:6vw; background:url(../_Img/Layout/bt-close.png) no-repeat left center; background-size:55% auto;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}

#header .bt-set{position:absolute; left:3vw; top:50%;width:6vw;height:6vw; background:url(../_Img/Layout/bt-set.png) no-repeat left center; background-size:91% auto;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}

/*#header .bt-search{position:absolute; right:11vw; top:50%;width:6vw;height:6vw; background:url(../_Img/Layout/bt-search.png) no-repeat center center; background-size:91% auto;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}*/
#header .bt-search{position:absolute; right:3vw; top: calc(50% - 0.2vw);width:5.2vw; height:5.2vw;
    background:url(../_Img/Layout/search-renew.png) no-repeat center center; background-size: 100% auto;
    transform: translateY(-50%);}
#header .bt-basket{position:absolute; right:3vw; top:50%;width:6vw;height:6vw; background:url(../_Img/Layout/bt-basket.png) no-repeat center center; background-size:91% auto;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}
#header .bt-basket.white{background:url(../_Img/Layout/bt-basketw.png) no-repeat center center; background-size:91% auto;}
#header .bt-basket.active:after{width: 4vw;height: 4vw;border-radius:100%;background:#BB5920; position:absolute; right:-1vw; top:-1vw; display:block;content:""; z-index: 998;}
#header .bt-basket .num{position: absolute;  color: #fff; font-weight: bold; font-size: 2vw; text-align: center; z-index: 999; left: calc(100% - 1.5vw); top: 0vw;}

#header .bt-search.white{background-image:url(../_Img/Layout/search-renew-w.png) !important;}
/*#header .bt-basket.white{background-image:url(../_Img/Layout/bt-basketw.png) !important;}*/

#header .bt-like{position:absolute;width:6vw;height:6vw;right:12.52vw;top:52%;display:inline-block;vertical-align:top;background:url(../_Img/Sub/ico-like.png) no-repeat center center; background-size:auto 90%;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}
#header .bt-like.active { background-image:url(../_Img/Sub/ico-likeo.png)}
#header .bt-link{position:absolute;width:6vw;height:6vw; right:3vw; top:50%;display:inline-block;vertical-align:top;background:url(../_Img/Sub/ico-link.png) no-repeat center center; background-size:auto 90%;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}

#header .bt-follow{position:Absolute; right:3vw; top:50%; line-height:6vw; padding:0 2vw;  font-size:2.6vw; font-weight:500; color:#fff; letter-spacing:-0.03em; border-radius:1vw ;border:1px solid #BB5920;background:#BB5920; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}
#header .bt-following{position:Absolute; right:3vw; top:50%; line-height:6vw; padding:0 2vw;  font-size:2.6vw; font-weight:500; color:#121212; letter-spacing:-0.03em;border:1px solid #d9d9d9; border-radius:1vw ;background:#fff; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}

#header .bt-modify{position:absolute; right:11vw; top:50%;width:6vw;height:6vw; background:url(../_Img/Layout/bt-modify.png) no-repeat center center; background-size:91% auto;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}
#header .bt-mnall{position:absolute; right:3vw; top:50%;width:6vw;height:6vw; background:url(../_Img/Layout/bt-mnall.png) no-repeat center center; background-size:65% auto;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}

#header .bt-rtxt{position:absolute; right:3vw; font-size:3.2vw; line-height:6vw; font-weight:500; color:#BB5920; top:50%;height:6vw; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}
#header .bt-ltxt{position:absolute; left:3vw; font-size:3.2vw; line-height:6vw; font-weight:500; color:#121212; top:50%;height:6vw; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}


#header .bt-alarm{position:absolute; right:12.4vw; top:50%; width: 5.2vw; height: 5.2vw; background:url(../_Img/Layout/alarm-renew.png) no-repeat center center;
    background-size: 100% auto;transform: translateY(-50%);}
#header .bt-alarm.active:after{width:1.2vw;height:1.2vw;border-radius:100%;background:#BB5920; position:absolute; right:0; top:0; display:block;content:""}


#header .bt-rtxt span{display: none;}
#header .bt-rtxt span.show{display: block;}

.fix #header .bt-search.white{background-image:url(../_Img/Layout/search-renew.png) !important;}
.fix #header .bt-basket.white{background:url(../_Img/Layout/bt-basket.png) no-repeat !important; background-size: 91% auto !important;}
.fix #header .bt-prev.white{background:url(../_Img/Layout/bt-prev.png) no-repeat !important; background-size: 40% auto !important;}
#header h2.white {font-size: 3.6vw; font-weight: bold; color: #000; opacity: 0;}
.fix #header h2.white {opacity: 1;}
@media only screen and (max-width: 500px) {
    #header h2.white {font-size: 18px;}
}

#header .bt-more{ position: absolute; top: 50%; right: 20vw; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%);}
.bt-more{display: flex;}
.bt-more i {display: block; width: 1vw; height: 1vw; background: #000; border-radius:0.5vw ; -webkit-border-radius:0.5vw ; -moz-border-radius:0.5vw ; -ms-border-radius:0.5vw ; -o-border-radius:0.5vw ; margin-left: 1vw;}

#header .bt-fr-toggle {width: 15.6vw; height: 6.8vw; border: 0.2vw solid #E5E5E5; box-sizing: border-box; border-radius: 3.4vw; background: #fff; position: absolute;
    right: 12.8vw; top: 50%; transform:translateY(-50%); display: flex; justify-content: flex-start; align-items: center; padding: 0 2.6vw;}
#header .bt-fr-toggle span.select {font-size: 2.6vw; font-weight: 500; color: #121212; letter-spacing: -0.066vw; }
#header .bt-fr-toggle span.select + i.down {display: block; width: 2.2vw; height: 2.8vw; background: url(/Pobls_/_Img/Layout/bt-toggle-down.png) 50% 50% no-repeat;
    background-size: 2.2vw auto; position: absolute; top: 50%; right: 2.26vw; transform: translateY(-50%); }
#header .select-container {position: absolute; bottom: -16.8vw; right: 4.4vw; width: 24vw; height: 17.2vw; border-radius: 1.4vw; border: 0.2vw solid #D9D9D9;
    box-sizing: border-box; background: #fff; box-shadow: 0px 0.6vw 1.2vw #0000001A; display: none;}
#header .select-container ul {width: 100%;  height: 100%;}
#header .select-container ul li{width: 100%; height: 50%;}
#header .select-container ul li a{position: relative; display: flex; width: 100%; height: 100%; justify-content: flex-start; align-items: center;
    padding:0 0 0 3.2vw; box-sizing: border-box; font-size: 2.8vw; color: #121212; font-weight: 500;}
#header .select-container ul li:first-child a {border-bottom: 0.2vw solid #F0F0F0;}
#header .select-container ul li.on i {display: block; width: 2.2vw; height: 2.4vw; background: url(/Pobls_/_Img/Layout/bt-fr-check.svg) 50% 50% no-repeat;
    background-size: 2.2vw auto; position: absolute; right: 3.2vw; top: 50%; transform:translateY(-50%); }

#header #logo{position: absolute; left:3vw; top:50%; transform: translateY(-50%); width:13vw; height:3vw;}
#header #logo.off{display: none;}
#header #logo a{display:block; height:5vw;background:url(../_Img/logo-over.png) no-repeat left center; background-size:100% auto;}
#header #logo.white a{background: url(../_Img/logo.png) no-repeat left center; background-size:100% auto;}
.fix #header #logo.white a{background: url(../_Img/logo-over.png) no-repeat left center; background-size:100% auto;}
#header .top-search{position:relative;height:11vw; padding-right:12vw; padding-left:3vw;}
#header .top-search .field{padding:1.5vw 0;position:relative;}
#header .top-search .field .chk-input{width:100%; }
#header .top-search .field .chk-input input{background:#f0f0f0; height:8vw; padding-left:9vw; border:none; border-radius:9vw;}
#header .top-search .field .enter{width:9vw;height:8vw; position:absolute; left:0; top:1.5vw;background:url(../_Img/Layout/bt-search.png) no-repeat center center; background-size:50% auto; border:none; opacity:0.5}
#header .top-search .close{position:absolute;right:3vw; top:1.5vw; line-height:8vw; letter-spacing:-0.03em; font-size:3.2vw; color:#121212; font-weight:500;}
#header .profile{width: 100%; display: flex; justify-content: center; height: 100%; align-items: center;}
#header .profile .img{ width: 6.93vw; height: 6.93vw; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%; overflow: hidden; }
#header .profile .img img{width: 100%; height: auto; object-fit: cover;}
#header .profile h2{ font-size: 4.8vw; width: auto; position: static; top: auto; left: auto; transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none;  margin-left: 2.13vw;}

#header-wrap.shop-main {border-bottom: 0.2vw solid #F0F0F0; box-sizing: border-box;}
#header-wrap.shop-main #header .top-search  {height: 10vw;}
#header-wrap.shop-main #header .top-search .field {padding: 1.5vw 0 0; box-sizing: border-box;}
#header-wrap.shop-main #header .top-search .field .enter { top: 1.2vw;}

@media only screen and (max-width:500px){
    #header-wrap{ }
    #header-wrap.ani.hide{top: -50px;}
    #header-wrap.ani2.hide{top: -50px;}
    .fix #header:after, #header-wrap.border #header:after{border-bottom:1px solid #F5F5F5;}
    .fix.shop #header:after{border-bottom:0;}
    #header{height: 50px;}
    #header h2{font-size:17px;padding:0 15px;}
    #header h2.nick{font-size:20px;}
    #header .if-profile{padding: 0 16px;}
    #header .if-profile .img{width: 26px; height: 26px; margin-right: 8px;}
    #header #logo{left:16px; width:65px; height:25px;}
    #header #logo a{display:block; height:25px}
    #header .bt-prev{left:16px; width:30px;height:30px; }
    #header .bt-close{left:16px; width:30px;height:30px; }
    #header .bt-set{left:16px; width:30px;height:30px; }

    /*#header .bt-search{right:55px; width:30px;height:30px; }*/
    #header .bt-search{right:16px; width:26px;height:26px; top: calc(50% - 1px); }



    #header .bt-basket{right:16px; width:30px;height:30px; }
    #header .bt-basket.active:after{width: 20px;height:20px; right:-5px; top:-5px;}
    #header .bt-basket .num { font-size: 10px; left: calc(100% - 7.5px); top: -6px;}

    #header .bt-like{right:60px;width:30px;height:30px;}
    #header .bt-link{right:15px;width:30px;height:30px;}

    #header .bt-follow{right:16px;line-height:30px; padding:0 10px;font-size:13px;border-radius:5px}
    #header .bt-following{right:16px;line-height:30px; padding:0 10px;font-size:13px;border-radius:5px}

    #header .bt-modify{right:55px; width:30px;height:30px; }
    #header .bt-mnall{right:16px; width:30px;height:30px; }

    #header .bt-rtxt{font-size:16px; right:16px; height:30px; line-height:30px;}
    #header .bt-ltxt{font-size:16px; left:16px; height:30px; line-height:30px;}

    #header .bt-alarm{right:62px; width: 26px;height: 26px; }
    #header .bt-alarm.active:after{width:6px;height:6px; right:0; top:0;}

    #header .bt-more{right: 100px;}
    .bt-more i {width: 3px; height: 3px; border-radius:1.5px; -webkit-border-radius:1.5px; -moz-border-radius:1.5px; -ms-border-radius:1.5px; -o-border-radius:1.5px; }

    #header .bt-fr-toggle {width: 78px; height: 34px; border: 1px solid #E5E5E5; border-radius: 17px; right: 64px; padding: 0 13px;}
    #header .bt-fr-toggle span.select {font-size: 13px; letter-spacing: -0.33px;}
    #header .bt-fr-toggle span.select + i.down {width: 11px; height: 14px; background-size: 11px auto; right: 13px;}

    #header .select-container {bottom: -84px; right: 22px; width: 120px; height: 86px; border-radius: 7px; border: 1px solid #D9D9D9; box-shadow: 0px 3px 6px #0000001A;}
    #header .select-container ul li a{padding:0 0 0 16px; font-size: 14px; }
    #header .select-container ul li:first-child a {border-bottom: 1px solid #F0F0F0;}
    #header .select-container ul li.on i {width: 11px; height: 12px;background-size: 11px auto; right: 16px;}

    #header .top-search{height:55px; padding-right:60px; padding-left:15px;}
    #header .top-search .field{padding:7.5px 0;}
    #header .top-search .field .chk-input input{height:40px; padding-left:45px; border-radius:45px;}
    #header .top-search .field .enter{width:45px;height:40px; left:0; top:7.5px}
    #header .top-search .close{right:15px; top:7.5px; line-height:40px; font-size:16px;}


    #header-wrap.shop-main {border-bottom: 1px solid #F0F0F0;}
    #header-wrap.shop-main #header .top-search {height: 50px;}
    #header-wrap.shop-main #header .top-search .field {padding: 7px 0 0;}
    #header-wrap.shop-main #header .top-search .field .enter {top: 6px;}


    #header .profile h2{padding: 0;}
    /*#header-wrap.bd.no-border.login #header{padding-top: 30px;}*/

    #doc.iosX #header-wrap.fix.ani{padding: calc(env(safe-area-inset-top) - 10px) 0 0 0 !important;}
    #doc.iosX #header-wrap.fix.ani2{padding: calc(env(safe-area-inset-top) - 10px) 0 0 0 !important;}
    #doc.iosX #header-wrap.sub-fix { padding: calc(env(safe-area-inset-top) - 10px ) 0 0 0 !important; }
    #doc.iosX #header-wrap.layer {padding: calc(env(safe-area-inset-top) - 10px) 0 0 0 !important;}
    #doc.iosX #header-wrap.ani.bg {padding: calc(env(safe-area-inset-top) - 10px) 0 0 0 !important;}
    #doc.iosX #header-wrap.ani2.bg {padding: calc(env(safe-area-inset-top) - 10px) 0 0 0 !important;}
    #doc.iosX #header-wrap.ani-layer.no-bg {padding: calc(env(safe-area-inset-top) - 10px) 0 0 0 !important;}
    #doc.iosX #header-wrap.ani-layer.no-bg.fix.ani {padding: calc(env(safe-area-inset-top) - 10px) 0 0 0 !important;}
    #doc.iosX #header-wrap.ani-layer.no-bg.fix.ani2 {padding: calc(env(safe-area-inset-top) - 10px) 0 0 0 !important;}
    #doc.iosX #header-wrap.ani.hide{top: calc(0px - env(safe-area-inset-top)) !important; }
    #doc.iosX #header-wrap.ani2.hide{top: calc(0px - env(safe-area-inset-top)) !important; }
    #doc.ios #header-wrap.ani.hide{ }
    #doc.ios #header-wrap.ani2.hide{ }


}


#header-wrap.layer.address_header {position: relative !important; }
#header-wrap.layer.address_header header {position: relative !important; }



/* ======================================================
   #container-wrap
=========================================================*/
#container-wrap{position:relative;
    box-sizing: border-box;
    background: #fff;
    /*overflow-x: hidden;*/
}
.dim{

}
.dim::after{
    content: '';
    display: block;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.7);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9997;
}
/*#container-wrap:after{display:block;content:"";clear:both}*/

.sub #container-wrap, .home #container-wrap{margin-top:10vw;}
.sub #container-wrap.shop {margin-top: 30.4vw;}
.sub #container-wrap.shop.depth2 {margin-top: 20.2vw;}
.sub #container-wrap.shop.depth1 {margin-top:10vw;}

.ios.sub #container-wrap, .ios.home #container-wrap{margin-top:calc(10vw + constant(safe-area-inset-top)) !important; margin-top:calc(10vw + env(safe-area-inset-top)) !important;}
.ios.sub #container-wrap.shop {margin-top:calc(30.4vw + constant(safe-area-inset-top)) !important; margin-top:calc(30.4vw + env(safe-area-inset-top)) !important;}
.ios.sub #container-wrap.shop.depth2 {margin-top:calc(20.2vw + constant(safe-area-inset-top)) !important; margin-top:calc(20.2vw + env(safe-area-inset-top)) !important;}
.ios.sub #container-wrap.shop.depth1 {margin-top:calc(10vw + constant(safe-area-inset-top)) !important; margin-top:calc(10vw + env(safe-area-inset-top)) !important;}

.iosX.sub #container-wrap, .iosX.home #container-wrap{margin-top:calc(env(safe-area-inset-top) + 8vw) !important;}
.iosX.sub #container-wrap.shop{margin-top:calc(env(safe-area-inset-top) + 28.4vw) !important;}
.iosX.sub #container-wrap.shop.depth2{margin-top:calc(env(safe-area-inset-top) + 18.2vw) !important;}
.iosX.sub #container-wrap.shop.depth1{margin-top:calc(env(safe-area-inset-top) + 8vw) !important;}

.ios.sub #container-wrap.no-mgt, .ios.home #container-wrap.no-mgt{margin-top:constant(safe-area-inset-top) !important;
    margin-top:calc(env(safe-area-inset-top)) !important;}
.iosX.sub #container-wrap.no-mgt, .iosX.home #container-wrap.no-mgt {margin-top:calc(env(safe-area-inset-top)) !important;}
.ios.full.home #container-wrap, .ios.full.home #container-wrap.no-mgt{margin-top:0 !important;}
.sub #container-wrap #contents{
    padding: 4vw;
    overflow-x: hidden;
}
.sub #container-wrap #contents.no-pad{padding:0 4vw;}
.sub #container-wrap #contents.no-p{padding:0;}
.sub #container-wrap #contents.p3{padding:4vw 3.2vw;}

.sub .bt-plus{
    width: 6vw; height: 6vw;
    background:url(../_Img/Layout/bt-plus.png) no-repeat center center; background-size:65% auto;
}
.sub .bt-add{
    width: 16vw;
    height: 16vw;
    position: fixed;
    bottom: 22vw;
    background:url(../_Img/Layout/bt-add.svg) no-repeat;
    background-position: center 30%;
    right: 3vw;
    z-index:101;
}

i.ver{width: 4.4vw; height: 4.4vw; background: url(../_Img/Layout/ver.svg) 50% 50% no-repeat; background-size: 4.4vw auto; margin: 0; padding: 0; display: inline-block; position: relative; top: 0.6vw; left: 0.4vw;}
i.ver.small{width: 3.4vw; height:3.4vw; background: url(../_Img/Layout/small_ver.svg) 50% 50% no-repeat; background-size: 3.4vw auto; margin: 0; padding: 0; left: 0;}

@media only screen and (max-width:500px){
    .sub #container-wrap, .home #container-wrap{margin-top:50px !important;}
    .sub #container-wrap.shop {margin-top: 152px !important;}
    .sub #container-wrap.shop.depth2 {margin-top: 101px !important;}
    .sub #container-wrap.shop.depth1 {margin-top:50px !important;}

    .ios.sub #container-wrap, .ios.home #container-wrap{margin-top:calc(50px + constant(safe-area-inset-top)) !important; margin-top:calc(50px + env(safe-area-inset-top)) !important;}
    .ios.sub #container-wrap.shop {margin-top:calc(152px + constant(safe-area-inset-top)) !important; margin-top:calc(152px + env(safe-area-inset-top)) !important;}
    .ios.sub #container-wrap.shop.depth2 {margin-top:calc(101px + constant(safe-area-inset-top)) !important; margin-top:calc(101px + env(safe-area-inset-top)) !important;}

    .iosX.sub #container-wrap, .iosX.home #container-wrap{margin-top:calc(env(safe-area-inset-top) + 40px) !important;}
    .iosX.sub #container-wrap.shop{margin-top:calc(env(safe-area-inset-top) + 142px) !important;}
    .iosX.sub #container-wrap.shop.depth2{margin-top:calc(env(safe-area-inset-top) + 91px) !important;}
    .iosX.sub #container-wrap.shop.depth1{margin-top:calc(env(safe-area-inset-top) + 40px) !important;}

    .ios.sub #container-wrap.no-mgt, .ios.home #container-wrap.no-mgt{margin-top:constant(safe-area-inset-top) !important; margin-top:calc(env(safe-area-inset-top)) !important;}
    .iosX.sub #container-wrap.no-mgt, .iosX.home #container-wrap.no-mgt{margin-top:calc(env(safe-area-inset-top)) !important;}
    .ios.full.home #container-wrap, .ios.full.home #container-wrap.no-mgt{margin-top:0 !important;}
    .iosX.full.home #container-wrap, .iosX.full.home #container-wrap.no-mgt{margin-top:0 !important;}
    .sub #container-wrap #contents{
        padding:20px;
    }
    .sub #container-wrap #contents.no-pad{padding:0 20px;}
    .sub #container-wrap #contents.p3{padding: 20px 16px;}
    i.ver{width: 22px; height: 22px; background-size: 22px auto; top: 3px; left: 2px;}
    i.ver.middle{width: 19px; height: 19px; background-size: 19px auto;top: 4px;}
    i.ver.small{width: 17px; height: 17px; background-size: 17px auto; top: 4px;left: 0;}
    .sub .bt-plus{width: 30px; height: 30px;}
    .sub .bt-add{width: 56px; height:56px; bottom: 80px; right: 15px;}
    #container-wrap.no-mgt{margin-top:0 !important;}

    #header-wrap.shop.hide + #container-wrap.shop{padding-top: 50px; box-sizing: border-box;}
    /*header snb 의 높이만큼*/
}
#container-wrap.no-mgt {box-sizing: border-box; margin-top: 0 !important;}
#doc.iosX.home #container-wrap.no-mgt {box-sizing: border-box; margin-top: 0 !important;}
#doc.ios.home #container-wrap.no-mgt {box-sizing: border-box; margin-top: 0 !important;}
/* =====================================
#footer-wrap
===================================== */
#footer-wrap{position: fixed;z-index: 5008;
    /*height: 13.6vw;*/
    box-sizing: border-box;
    bottom: 0; left: 0; width: 100%; background: #fafafa;
    padding: 3vw 2vw;
    transition-delay: initial !important;
    transition: none !important;
}
#footer-wrap .fix{}
#footer-wrap.hide{bottom: -13.6vw; }
#footer-wrap.no-bg{background: transparent;}
#footer{box-sizing: border-box;}
#doc.iosX #footer-wrap { padding: 2.8vw 2vw 6.8vw; box-sizing: border-box;}
#doc.ios #footer-wrap{padding: 3vw 2vw; box-sizing: border-box;}
@media only screen and (max-width: 500px) {
    #footer-wrap{
        /*height: 83px;*/
        padding: 15px 10px;
        /*padding: 15px 10px calc(constant(safe-area-inset-bottom) + 15px) 10px;*/
        /*padding: 15px 10px calc(env(safe-area-inset-bottom) + 15px) 10px;*/
    }
    #footer-wrap .fix{}
    #footer-wrap.hide{bottom: -68px; }
    #doc.iosX #footer-wrap {padding: 12px 10px 34px;}
    #doc.ios #footer-wrap {padding: 12px 10px;}
}
/*#footer-wrap {display:block; }*/
/*#footer.hide{left:-9999em;position:absolute; bottom:0;}*/


#fnb{position:relative;}
#fnb .fix{width:100%;}
/*#fnb .fix{position:fixed; left:0; bottom:0 ; width:100%; min-width:360px;background:#fafafa; padding:3vw 2vw 2vw 2vw; box-sizing:border-box;-webkit-transition: bottom 0.3s linear;-moz-transition: bottom 0.3s linear;-o-transition: bottom 0.3s linear;transition: bottom 0.3s linear;}*/

#fnb .fix ul{display: flex; width: 100%; justify-content: space-between;}
/*#fnb .fix ul:after{display:block; content:"";clear:both}*/
#fnb .fix li{float:left; flex: 1; max-width: 14.2vw;}
#fnb .fix li a{position:relative;display:block;text-align:center;padding-top:6vw; font-weight:500; font-size:2vw;line-height:1.2em;color:#808080;text-transform:uppercase}
#fnb .fix li a:before{width:5vw;height:5vw; position:absolute; left:50%; top:0; display:block; content:""; background-size:100% auto !important;-webkit-transform: translateX(-50%); -moz-transform: translateX(-50%);-ms-transform: translateX(-50%); -o-transform:  translateX(-50%);transform: translateX(-50%);}
#fnb .fix li a span {font: inherit;}
#fnb .fix li.active a{color:#000; font-weight: 900}

#fnb .fix li.home a:before{background:url(../_Img/Layout/fnb-ico01.svg) no-repeat center top}
#fnb .fix li.shop a:before{background:url(../_Img/Layout/fnb-ico05.svg) no-repeat center top}
#fnb .fix li.discover a:before{background:url(../_Img/Layout/fnb-ico02.svg) no-repeat center top}
#fnb .fix li.friends a:before{background:url(../_Img/Layout/fnb-ico03.svg) no-repeat center top}
#fnb .fix li.my a:before{background:url(../_Img/Layout/fnb-ico04.svg) no-repeat center top}

#fnb .fix li.home.active a:before{background:url(../_Img/Layout/f_fnb-ico01.svg?v=1) no-repeat center top}
#fnb .fix li.shop.active a:before{background:url(../_Img/Layout/f_fnb-ico05.svg) no-repeat center top}
#fnb .fix li.discover.active a:before{background:url(../_Img/Layout/f_fnb-ico02.svg?v=1) no-repeat center top}
#fnb .fix li.friends.active a:before{background:url(../_Img/Layout/f_fnb-ico03.svg?v=1) no-repeat center top}
#fnb .fix li.my.active a:before{background:url(../_Img/Layout/f_fnb-ico04.svg?v=1) no-repeat center top}
@media only screen and (max-width:500px){
    #fnb .fix{}
    #fnb .fix li{max-width: 72px;}
    #fnb .fix li a{font-size:10px; padding-top:30px;}
    #fnb .fix li a:before{width:26px;height:26px;}
}


.main-visual-container{width: 100%; position: relative; margin-bottom: 8.8vw; }
.main-visual-container ul{width: 100%;}
.main-visual-container li{width: 100%;}
.main-visual-container li .img{overflow: hidden; width: 100%; padding-bottom: 120%; box-sizing: border-box; position: relative;}
.main-visual-container li img{width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0;}
.main-visual-container li .txt{width: 100%; text-align: center; padding: 2.8vw 6vw 0; box-sizing: border-box;}
.main-visual-container li .txt h3, .main-visual-container li .txt p{width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.main-visual-container li .txt h3{font-size: 3.6vw; color: #121212; letter-spacing: -0.045em; line-height: 1.5;}
.main-visual-container li .txt p {font-size: 2.6vw; color: #666; letter-spacing: -0.03em; line-height: 1.53; margin: 1.4vw 0 0;}
.main-visual-container li .txt span{display: inline-block; position: relative; padding-right: 2.8vw; color: #999;  box-sizing: border-box;}
.main-visual-container li .txt span::after{content: ''; display: inline-block; width: .4vw; height: .4vw; border-radius: .2vw; background: #999; position: absolute; top: 50%; right: 1.2vw; transform: translateY(-50%); }
.main-visual-container li .txt span:last-child{letter-spacing: -0.03em; line-height: 1.53; padding-right: 0 !important; }
.main-visual-container li .txt span:last-child::after{content: initial !important;}
@media only screen and (max-width:500px) {
    .main-visual-container {margin-bottom: 44px;}
    .main-visual-container li {}
    .main-visual-container li .img{}
    .main-visual-container li .txt{padding: 14px 30px 0;}
    .main-visual-container li .txt h3{font-size: 18px; font-weight: 500;}
    .main-visual-container li .txt p{font-size: 13px; margin: 7px 0 0;}
    .main-visual-container li .txt span{font-size: 13px !important; padding-right: 14px;}
    .main-visual-container li .txt span::after{width: 2px; height: 2px; right: 6px; border-radius: 1px;}
}

.time-caption { position: absolute; bottom: 17.8vw; left: 6vw; color: #fff; font-size: 2.8vw; letter-spacing: 0; line-height: 1.4; }
/*.time-caption + input[type=range] { position: absolute; bottom: 23vw; left:20vw; color: #fff; font-size: 3vw; letter-spacing: -0.038em; line-height: 1.4; }*/
.mscrollbar { position:absolute; bottom: 25vw; left: 50%; transform: translateX(-50%); width: 30vw; height: 0.4vw;
    line-height: 0; overflow: hidden; border-radius: 0.2vw; box-sizing: border-box; background: rgba(255, 255, 255, 0.25); }
.mscrollbar .handle { height: 100%; background: #fff; cursor: pointer; position: absolute; top: 0; left: 0;}
.t-scrollbar { position:relative; width: calc(100% - 12vw); height: 0.4vw; line-height: 0; overflow: hidden; margin: 0 6vw 8vw;
    border-radius: 0.2vw; box-sizing: border-box; background: #e5e5e5; }
.t-scrollbar .handle{background: #121212; width: 100%; height: 100%; cursor: pointer;}
.w-scrollbar { position:relative; width: calc(100% - 8vw); height: 0.4vw;
    line-height: 0; overflow: hidden; margin: 0 6vw 8vw 2vw;
    border-radius: 0.2vw; box-sizing: border-box; background: #e5e5e5; }
.w-scrollbar .handle{background: #121212; height: 100%; cursor: pointer;}
@media only screen and (max-width:500px){
    .time-caption { left: 30px; bottom: 89px; font-size: 14px; }
    /*.time-caption + input[type=range]{ left: 30px; bottom: 115px; font-size: 15px; }*/
    .mscrollbar { height: 2px; width: 150px; bottom: 125px; border-right: 1px; }
    .t-scrollbar{width: calc(100% - 60px); margin: 0 30px 40px; height: 2px;}
    .w-scrollbar{width: calc(100% - 40px); margin: 0 30px 40px 10px; height: 2px;}
}

.main-visual-container .scroll_range { position:absolute; bottom:19.4vw; left: 50%; transform: translateX(-50%); width: 30vw; height: 0.4vw;
    line-height: 0; overflow: hidden; border-radius: 0.2vw; box-sizing: border-box; background: rgba(255, 255, 255, 0.25); border: none !important;}
.main-visual-container .scroll_range span { background: #fff !important; height: 100% !important; margin: 0 !important; top: 0 !important;
    border: none !important; display: block;}

@media only screen and (max-width:500px) {
    .main-visual-container .scroll_range { height: 2px; width: 150px; bottom: 97px; }
    .main-visual-container .scrollbar span { }
}



.btn-plus{width: 11vw; height: 11vw; background: #121212; border-radius: 50%; display: block; position: fixed; bottom: 20.6vw; right: 4vw; z-index: 5002;}
.btn-plus::after{content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url('../_Img/Sub/ico-add.png') center center no-repeat;
    background-size: 100% auto; width: 3vw; height: 3vw; border-radius: inherit;
}
#doc.iosX .btn-plus{bottom: calc(env(safe-area-inset-bottom) + 16.6vw); z-index: 5002;}

.tab-gradient::after{content: ''; position: absolute; right: 0; bottom: 3px; width: 50px; height: 36px; background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));}

@media only screen and (max-width:500px) {
    .btn-plus{width: 54px; height: 54px; bottom: 103px; right: 20px;}
    .btn-plus::after{width: 15px; height: 15px;}
    #doc.iosX .btn-plus{bottom: 140px;}

}


.spacer{margin-top: 17vw;}
@media only screen and (max-width:500px) {
    .spacer{margin-top: 85px;}
}

.css-grw-1{width: 100%; background: linear-gradient(30deg, rgba(0, 0, 0, 1), rgba(255, 255, 255, 1)); opacity: 0.3;}
div.overVisible {
    z-index: 9999 !important;
    overflow: visible !important;
}

.discover-wrap.detail.space .inner{padding:0 3.2vw; box-sizing: border-box; background: #fff; z-index: 58; }
.discover-wrap.detail.space .inner.bottom{padding:0 3.2vw 8vw; box-sizing: border-box;}
.discover-wrap.detail.space .inner.left{padding:0 0 0 4vw;}
.discover-wrap.detail.space .inner.top{padding: 6vw 3.2vw 0 4vw;}
@media only screen and (max-width:500px) {
    .discover-wrap.detail.space .inner{padding: 0 20px;}
    .discover-wrap.detail.space .inner.bottom{padding: 0 20px 40px;}
    .discover-wrap.detail.space .inner.left{padding: 0 0 0 20px;}
    .discover-wrap.detail.space .inner.top{padding: 30px 16px 0 20px;}
}

.alarm-wrap .list li {display: flex; margin: 0 0 4vw; align-items: center;}
.alarm-wrap .list li .left-side {width: 9.2vw; height: 9.2vw; min-width: 9.2vw; min-height: 9.2vw;}
.alarm-wrap .list li .left-side .img{width: 100%; height: 100%; min-width: 100%; min-height: 100%; box-sizing: border-box; border-radius: 100%; border: 1px solid #d9d9d9; position: relative; overflow: hidden;}
.alarm-wrap .list li .left-side.people{position: relative;}
.alarm-wrap .list li .left-side.people .img.fir{position: absolute; top: 0; left: 0; width: 6.4vw; height: 6.4vw; min-width: 6.4vw; min-height: 6.4vw; border: 0.2vw solid #D9D9D9; box-sizing: border-box;}
.alarm-wrap .list li .left-side.people .img.las{position: absolute; bottom: 0; right: 0; width: 6.4vw; height: 6.4vw; min-width: 6.4vw; min-height: 6.4vw;  border: 0.2vw solid #D9D9D9; box-sizing: border-box;}
.alarm-wrap .list li .left-side .img img{width: 100%; /*height: auto;*/height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block;}
.alarm-wrap .list li .right-side {padding: 0 0 0 2.4vw; box-sizing: border-box;}
.alarm-wrap .list li .right-side .img {width:  8.4vw; height: 8.4vw; min-width: 9.2vw; min-height: 9.2vw; box-sizing: border-box; position: relative; overflow: hidden;}
.alarm-wrap .list li .right-side .img img{width: 100%; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block;}
.alarm-wrap .list li .alarm-content {width: calc(100% - 22.4vw); margin: 0 0 0 2.4vw; font-size: 2.8vw; letter-spacing: -0.035rem;
    line-height: 1.214; color:#121212; font-weight: 400; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; height:6.8vw;}
.alarm-wrap .list li .alarm-content span {font-size: 2.2vw; color: #999;}
.alarm-wrap .list li .alarm-content b, .alarm-wrap .list li .alarm-content strong {font-weight: 500;}
.alarm-wrap .list li.follow .alarm-content {width: calc(100% - 25.2vw); padding: 0 2.4vw 0 0; box-sizing: border-box;}
.alarm-wrap .list li.follow .bt-follow{display: block; text-align: center; width: 11.2vw; font-size:2.6vw; font-weight:500; color:#fff; letter-spacing:-0.03em; border-radius:1vw ;border:1px solid #BB5920; background:#BB5920; padding: 1vw; box-sizing: border-box;}
.alarm-wrap .list li.follow .bt-following{display: block; text-align: center; width: 11.2vw; font-size:2.6vw; font-weight:500; color:#121212; letter-spacing:-0.03em; border:1px solid #d9d9d9; border-radius:1vw; background:#fff; padding: 1vw; box-sizing: border-box;}
.alarm-wrap .list li.notice .alarm-content {width: calc(100% - 11.6vw); padding: 0 2.4vw 0 0; box-sizing: border-box; }

@media only screen and (max-width: 500px) {
    .alarm-wrap .list li {margin: 0 0 20px;}
    .alarm-wrap .list li .left-side {width: 48px; height: 48px; min-width: 48px; min-height: 48px;}
    .alarm-wrap .list li .left-side .img{width: 100%; height: 100%; min-width: 100%; min-height: 100%;}
    .alarm-wrap .list li .left-side.people .img.fir{width: 32px; height:32px; min-width: 32px; min-height: 32px; border: 1px solid #d9d9d9;}
    .alarm-wrap .list li .left-side.people .img.las{width: 32px; height:32px; min-width: 32px; min-height: 32px; border: 1px solid #d9d9d9;}
    .alarm-wrap .list li .right-side {padding: 0 0 0 12px;}
    .alarm-wrap .list li .right-side .img{width: 42px; height: 42px; min-width: 42px; min-height: 42px;}
    .alarm-wrap .list li .alarm-content{margin: 0 0 0 12px; width: calc(100% - 112px); font-size: 14px; height: 34px;}
    .alarm-wrap .list li .alarm-content span {font-size: 11px;}
    .alarm-wrap .list li.follow .alarm-content {width: calc(100% - 126px); padding: 0 12px 0 0;}
    .alarm-wrap .list li.follow .bt-follow{width: 56px; font-size:13px;border-radius:5px; padding: 5px;}
    .alarm-wrap .list li.follow .bt-following{width: 56px; font-size:13px;border-radius:5px; padding: 5px;}
    .alarm-wrap .list li.notice .alarm-content { width: calc(100% - 58px); padding: 0 12px 0 0;}

}

/*#doc.iosX .your-div{padding:calc(env(safe-area-inset-top) - 2vw ) 0 0 !important; width: 100%; box-sizing: border-box; }*/
/*#doc.iosX .your-div2{padding:calc(env(safe-area-inset-top) - 4vw ) 0 0 !important; width: 100%; box-sizing: border-box; }*/
/*#doc.iosX .your-div3{padding:calc(env(safe-area-inset-top) - 8vw ) 0 0 !important; width: 100%; box-sizing: border-box; }*/
#doc.iosX .mypage-wrap.follow .list li {}
#doc.iosX .mypage-wrap.follow .list.article {padding: 0 0 calc(env(safe-area-inset-bottom) - 8vw )!important; width: 100%; box-sizing: border-box;}
#doc.iosX .mypage-wrap.follow .list.article li:last-child{margin-bottom: 0 !important;}
@media only screen and (max-width: 500px) {
    /*#doc.iosX .your-div{padding:calc(env(safe-area-inset-top) - 10px ) 0 0 !important;  }*/
    /*#doc.iosX .your-div2{padding:calc(env(safe-area-inset-top) - 20px ) 0 0 !important;  }*/
    /*#doc.iosX .your-div3{padding:calc(env(safe-area-inset-top) - 40px ) 0 0 !important;  }*/
    #doc.iosX .mypage-wrap.follow .list.article {padding: 0 0 calc(env(safe-area-inset-bottom) - 40px )!important; }
    #doc.iosX .mypage-wrap.follow .list.article li:last-child{margin-bottom: 0 !important;}

}


.overlay__view{width: 100%; position: fixed; bottom: 0; left: 0; z-index: 9000; padding-bottom: calc(100% / 375 * 260); box-sizing: border-box;}
.overlay__view::after{content: ''; position: absolute; background: rgba(0, 0, 0, 0.85); width: 100%; height: 100%; z-index: 9009;}
.overlay__layer {position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 9010;}
.overlay__layer .app_info_wrap {position: relative; width: 100%; height: 100%; padding: 0 6vw; box-sizing: border-box;}
.overlay__layer .app_info_wrap .logo{position: absolute; top: -8vw; left: 50%; transform: translateX(-50%); width: 16vw; height: 16vw; background: #fff; border-radius: 4vw;}
.overlay__layer .app_info_wrap .logo img{display: block; width: 100%; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.overlay__layer .app_info_wrap h3{width: 100%; font-size: 3.6vw; color: #fff; font-weight: 300; letter-spacing: -0.09vw; line-height: 1.5; text-align: center; word-break: break-word; padding: 12.4vw 0 0; max-width: 58vw; box-sizing: border-box; margin: 0 auto;}
.overlay__layer .app_info_wrap h3 b{font-weight: 400;}
.overlay__layer .app_info_wrap p {width: 100%; margin-top: 6vw; height: 9.6vw; background: #bb5920; border-radius: 33vw; text-align: center; }
.overlay__layer .app_info_wrap p a{display: block; width: 100%; height: 100%; color: #fff; text-align: center; line-height: 9.6vw; font-size: 3vw; letter-spacing: -0.076vw; font-weight: 400;}
.overlay__layer .app_info_wrap span {display: block; margin: 4vw 0; font-size: 2.6vw; color: #ccc; letter-spacing: -0.066vw; line-height: 1.53; text-align: center;}

@media only screen and (max-width: 500px) {
    .overlay__view {min-height: 260px;}
    .overlay__layer .app_info_wrap{ padding: 0 30px; }
    .overlay__layer .app_info_wrap .logo{position: absolute; top: -40px; left: 50%; transform: translateX(-50%); width: 80px; height: 80px; border-radius: 20px;}
    .overlay__layer .app_info_wrap h3{font-size: 18px; letter-spacing: -0.45px; padding: 62px 0 0; max-width: 290px;}
    .overlay__layer .app_info_wrap p {margin-top: 30px; height: 48px; border-radius: 165px;}
    .overlay__layer .app_info_wrap p a {line-height: 48px; font-size: 15px; letter-spacing: -0.38px;}
    .overlay__layer .app_info_wrap span{margin: 20px 0; font-size: 13px; letter-spacing: -0.33px; }

}




.develop_area a {color:#fff;display: flex; justify-content: center; align-items: center; width: 100%; height: 240px; background: blue; font-size: 24px; text-align: center;}
.nextSub {
    box-sizing: border-box !important;
}
.mt60 {
    /*margin-top: calc(12vw - env(safe-area-inset-top) + 0vw);*/
}

#subtab.sticky + .nextSub {
    padding-top: 17.8vw !important;
}
#doc.iosX #subtab.sticky + .nextSub {
    padding-top: 15.8vw !important;
}
#doc.ios #subtab.sticky + .nextSub {
}
@media only screen and (max-width: 500px) {
    .mt60 {
        /*margin-top: calc(60px - env(safe-area-inset-top) + 0px);*/
    }
    #subtab.sticky + .nextSub {
        padding-top: 89px !important;
    }
    #doc.iosX #subtab.sticky + .nextSub {
        padding-top: 79px !important;
    }
    #doc.ios #subtab.sticky + .nextSub {
    }
}


.rate {justify-content: flex-start; align-items: center; display: flex;}
.rate i{display: block; width: 2vw; height: 2vw; background: url(/Pobls_/_Img/Shop/rate.svg) 50% 50% no-repeat; background-size:100% auto; margin: 0 0.6vw 0 0; flex: none;}

.rate.rate1 i:first-child {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}
.rate.rate2 i:first-child {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}
.rate.rate3 i:first-child {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}
.rate.rate4 i:first-child {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}
.rate.rate5 i:first-child {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}

.rate.rate2 i:nth-child(2) {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}
.rate.rate3 i:nth-child(2) {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}
.rate.rate4 i:nth-child(2) {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}
.rate.rate5 i:nth-child(2) {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}

.rate.rate3 i:nth-child(3) {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}
.rate.rate4 i:nth-child(3) {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}
.rate.rate5 i:nth-child(3) {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}

.rate.rate4 i:nth-child(4) {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}
.rate.rate5 i:nth-child(4) {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}

.rate.rate5 i:nth-child(5) {background: url(/Pobls_/_Img/Shop/rate_active.svg) 50% 50% no-repeat; background-size:100% auto;}


.r-rate.rate.rate1 i:first-child {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}
.r-rate.rate.rate2 i:first-child {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}
.r-rate.rate.rate3 i:first-child {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}
.r-rate.rate.rate4 i:first-child {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}
.r-rate.rate.rate5 i:first-child {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}

.r-rate.rate.rate2 i:nth-child(2) {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}
.r-rate.rate.rate3 i:nth-child(2) {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}
.r-rate.rate.rate4 i:nth-child(2) {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}
.r-rate.rate.rate5 i:nth-child(2) {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}

.r-rate.rate.rate3 i:nth-child(3) {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}
.r-rate.rate.rate4 i:nth-child(3) {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}
.r-rate.rate.rate5 i:nth-child(3) {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}

.r-rate.rate.rate4 i:nth-child(4) {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}
.r-rate.rate.rate5 i:nth-child(4) {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}

.r-rate.rate.rate5 i:nth-child(5) {background: url(/Pobls_/_Img/Shop/rate_active2.svg) 50% 50% no-repeat; background-size:100% auto;}




@media only screen and (max-width: 500px) {
    .rate i {width: 10px; height: 10px; margin: 0 3px 0 0;}
}


.button-loading {width: 4.8vw; height: 4.8vw; margin: 0 2vw 0 0;}
.button-loading img {display: block; width: 100%; height: 100%; }


@media only screen and (max-width: 500px) {
    .button-loading {width: 24px; height: 24px; margin: 0 10px 0 0;}
}


.radio-box {display: flex; justify-content: flex-start; align-items: center; height: 5.2vw; margin: 0 0 3vw;}
.radio-box input[type=radio] {padding: 0; margin: 0; width: 0; height: 0;}
.radio-box input[type=radio] + label {color: #999; position: relative; padding: 0 0 0 6.8vw; font-size: 2.8vw; font-weight: 500; letter-spacing: -0.035em; line-height: 2.6vw;}
.radio-box input[type=radio] + label::before {content: ''; display: block; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 5.2vw; height: 5.2vw; background: url(/Pobls_/_Img/Shop/delivery_radio.svg) 50% 50% no-repeat; background-size: 100% auto;}
.radio-box input[type=radio] + label span.checked {color: #999999;}
.radio-box input[type=radio]:checked + label {color: #121212; }
.radio-box input[type=radio]:checked + label::before {background: url(/Pobls_/_Img/Shop/delivery_radio_checked.svg) 50% 50% no-repeat; background-size: 100% auto;}

@media only screen and (max-width: 500px) {
    .radio-box {height: 26px; margin: 0 0 15px;}
    .radio-box input[type=radio] {}
    .radio-box input[type=radio] + label {padding: 0 0 0 34px; font-size: 14px; line-height: 18px;}
    .radio-box input[type=radio] + label::before {width: 26px; height: 26px;}
    .radio-box input[type=radio]:checked + label::before {}


}


.chk-rounded-box {display: flex; justify-content: flex-start; align-items: center; height: 5.2vw; margin: 0 0 4.8vw;}
.chk-rounded-box input[type=checkbox] {padding: 0; margin: 0; width: 0; height: 0;}
.chk-rounded-box input[type=checkbox] + label {color: #999; position: relative; padding: 0 0 0 6.8vw; font-size: 2.8vw; font-weight: 500; letter-spacing: -0.035em; line-height: 2.6vw;}
.chk-rounded-box input[type=checkbox] + label h4 {font-weight: 500;}
.chk-rounded-box input[type=checkbox] + label::before {content: ''; display: block; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 5.2vw; height: 5.2vw; background: url(/Pobls_/_Img/Shop/delivery_radio.svg) 50% 50% no-repeat; background-size: 100% auto;}
.chk-rounded-box input[type=checkbox] + label span.checked {color: #999999;}
.chk-rounded-box input[type=checkbox]:checked + label {color: #121212; }
.chk-rounded-box input[type=checkbox]:checked + label::before {background: url(/Pobls_/_Img/Shop/delivery_radio_checked.svg) 50% 50% no-repeat; background-size: 100% auto;}
.chk-rounded-box.color1 input[type=checkbox]:checked + label {color: #BB5920;}
.chk-rounded-box.color1 input[type=checkbox]:checked + label::before {background: url(/Pobls_/_Img/Shop/delivery_radio_checked_color1.svg) 50% 50% no-repeat; background-size: 100% auto;}


@media only screen and (max-width: 500px) {
    .chk-rounded-box {height: 26px; margin: 0 0 24px;}
    .chk-rounded-box input[type=checkbox] {}
    .chk-rounded-box input[type=checkbox] + label {padding: 0 0 0 34px; font-size: 14px; line-height: 18px;}
    .chk-rounded-box input[type=checkbox] + label::before {width: 26px; height: 26px;}
    .chk-rounded-box input[type=checkbox]:checked + label::before {}


}

.sub-header {background: #fff; text-align: center; padding: 1.4vw 0 2.4vw; border-bottom: 0.2vw solid #F0F0F0; box-sizing: border-box;}
.sub-header h3 {font-size: 3vw; font-weight: 600; color: #000; line-height: 4vw;}

@media only screen and (max-width: 500px) {
    .sub-header {padding: 7px 0 12px; border-bottom: 1px solid #F0F0F0;}
    .sub-header h3 {font-size: 15px; line-height: 20px;}

}

.photo-profile {border: 0.2vw solid #D9D9D9; border-radius: 50%; overflow: hidden; width: 5.2vw; height: 5.2vw; position: absolute; right: 16px; top: 50%;
    transform: translateY(-50%); box-sizing: border-box; }
.photo-profile img {display: block; width: 100%; height: 100%;}


@media only screen and (max-width: 500px) {
    .photo-profile {width: 26px; height: 26px; border: 1px solid #D9D9D9;}
}


i.membership-ico {width: 4.8vw; height: 4.8vw; border-radius: 50%; display: inline-block; }
i.membership-ico.B {background: url(/Pobls_/_Img/Shop/rank-b.svg) 50% 50% no-repeat; background-size: 100% auto;}
i.membership-ico.P {background: url(/Pobls_/_Img/Shop/rank-p.svg) 50% 50% no-repeat; background-size: 100% auto;}
i.membership-ico.O {background: url(/Pobls_/_Img/Shop/rank-o.svg) 50% 50% no-repeat; background-size: 100% auto;}
i.membership-ico.L {background: url(/Pobls_/_Img/Shop/rank-l.svg) 50% 50% no-repeat; background-size: 100% auto;}
i.membership-ico.S {background: url(/Pobls_/_Img/Shop/rank-s.svg) 50% 50% no-repeat; background-size: 100% auto;}




i.membership-ico.P + span {color: #777A7F;}
i.membership-ico.O + span {color: #121212;}
i.membership-ico.B + span {color: #B3924D;}
i.membership-ico.L + span {color: #CF4139;}
i.membership-ico.S + span {color: #7639AB;}


@media only screen and (max-width: 500px) {
    i.membership-ico {width: 24px; height: 24px;}
}

.brand.fix_snb {position: sticky; top: 0; left: 0; width: 100%; z-index: 5005;}
.iosX .brand.fix_snb {top: calc(constant(safe-area-inset-top) - 2vw); top: calc(env(safe-area-inset-top) - 2vw); }
.ios .brand.fix_snb {top: calc(constant(safe-area-inset-top) + 0vw); top: calc(env(safe-area-inset-top) + 0vw);}


@media only screen and (max-width: 500px) {
    .iosX .brand.fix_snb {top: calc(constant(safe-area-inset-top) - 10px); top: calc(env(safe-area-inset-top) - 10px);}
    .ios .brand.fix_snb {top: calc(constant(safe-area-inset-top) + 0px); top: calc(env(safe-area-inset-top) + 0px);}

}

#container-wrap.shop_main {padding: 0 0 12vw; box-sizing: border-box; margin: 20.8vw 0 0 !important;}
.ios.sub #container-wrap.shop_main {margin-top:calc(20.8vw + constant(safe-area-inset-top)) !important; margin-top:calc(20.8vw + env(safe-area-inset-top)) !important;}
.iosX.sub #container-wrap.shop_main{padding: 0 0 calc(env(safe-area-inset-bottom) + 8.6vw); margin-top:calc(env(safe-area-inset-top) + 18.8vw) !important;}

@media only screen and (max-width: 500px) {
    #container-wrap.shop_main {padding: 0 0 60px; margin: 104px 0 0 !important;}
    .ios.sub  #container-wrap.shop_main {margin-top:calc(104px + constant(safe-area-inset-top)) !important; margin-top:calc(104px + env(safe-area-inset-top)) !important;}
    .iosX.sub #container-wrap.shop_main{padding: 0 0 calc(env(safe-area-inset-bottom) + 43px); margin-top:calc(env(safe-area-inset-top) + 94px) !important;}

}



.shop #header .bt-search {right: 12.4vw;}
.discover-header #header .bt-search {right: 12.4vw;}
.shopDetail #header .bt-search {right: 12.4vw;}
.bbs-header #header .bt-search {right: 12.4vw;}
.myPage #header .bt-alarm {right: 12.4vw;}
.myPage #header .bt-search {right: 21.4vw; }
.main-header #header .bt-alarm {right: 12.4vw;}
.main-header #header .bt-search {right: 21.4vw; }

@media all and (max-width: 500px) {
    .shop #header .bt-search {right: 62px;}
    .discover-header #header .bt-search {right: 62px;}
    .shopDetail #header .bt-search {right: 62px;}
    .bbs-header #header .bt-search {right: 62px;}
    .myPage #header .bt-alarm {right: 62px;}
    .myPage #header .bt-search {right: 107px; }
    .main-header #header .bt-alarm {right: 62px;}
    .main-header #header .bt-search {right: 107px; }
}
