/* BASIC css start */
#content{padding-top:48px;}

/* ÇÁ·Î¸ð¼Ç Å¸ÀÌÆ² */
#productPlan .page-hd{position:relative; margin-bottom:32px; display:flex; align-items: center; justify-content: space-between;}
#productPlan .page-hd h2{font-size:28px; line-height:34px; font-weight:500;}
#productPlan .page-hd span,
#productPlan .page-hd span a{color: #929292; text-transform: capitalize; vertical-align:top; display:inline; font-size:12px;}


/* ·£µù */
#productPlan .page-body .visual { margin-top: 30px;padding-bottom: 0;}
#productPlan .page-body .visual .prdWrap img:not(.wd50){width:100%;}
#productPlan .page-body .visual .prdWrap a:not(.wd50),
#productPlan .page-body .visual .prdWrap a:not(.wd50) img{display: block; width:100%}
#productPlan .page-body .visual .prdWrap img:not(.wd50){width:100%;}
#productPlan .page-body .visual .prd_tab, .loginCoupon{ cursor: pointer;}

/* -------------------------------------------------------------------------------- */
/* »ó´Ü ÇÃ·ÎÆÃ ÅÇ */
.menuBtn{display:flex; cursor: pointer;}
.menuBtn.hidden{display:none;}

/* ÇÏ´Ü ÇÃ·ÎÆÃ */
.floating_box{ position: fixed; z-index: 1; top: 8%; left: 50%; width: 500px; transform: translate(-50%, 0); display: none; gap: 8px; align-items: center; background: #DB7445; padding: 12px 16px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15); }
.floating_box p{font-size: 18px;}
.floating_box span{color:#ffffff; font-size: 18px; font-weight: 400;}
.floating_box .close{display:block; margin: 0 0 0 auto; width:25px !important;}


/* ½º¿ÍÀÌÆÛ */
.swiper19{position: relative; width:100%; overflow:hidden;}
.swiper19 .swiper-wrapper{position:absolute; top:25%;}
.swiper19 .swiper-button-next::after, .swiper19 .swiper-button-prev::after{color:#000000}


.gamtan_swiper {background: #544639;}
.gamtan_swiper :is(.swiper-button-next, .swiper-button-prev){color:#d1d1d1;}
.gamtan_swiper .swiper-button-next{right:24px;}
.gamtan_swiper .swiper-button-prev{left:24px;}

.thumbnail_slide > .thumb-list{position:relative;}
.thumbnail_slide > .thumb-list .swiper-pagination{display: flex; top: 0; width: 88%; left: 5.5%; justify-content: space-between; padding-bottom:30px;}
.thumbnail_slide > .thumb-list .swiper-pagination img{width:23% !important; border-radius:0; height:auto; margin:0;}

.junior_swiper{position: relative; overflow: hidden; -ms-overflow-style: none;}
.junior_swiper :is(.swiper-button-next, .swiper-button-prev){ color: #a7a7a7; top: 40%;  z-index:10;}
.junior_swiper .swiper-button-next:after, .junior_swiper .swiper-button-prev:after{font-size: 35px;}
.junior_swiper::-webkit-scrollbar{ display:none;}

.swiper01 .swiper-button-next::after,
.swiper01 .swiper-button-prev::after{color:#2781A3;}

/* ÇÃ·ÎÆÃ ³×ºñ */
.floating_nav{overflow:auto; background:#fff; z-index:99;}
.floating_nav ul{width:100%; display:flex; justify-content: center; margin:0 auto;}
.floating_nav ul li{width:100%; padding:16px 18px; margin-right:1px; position:relative; font-size:20px; color:#999; cursor:pointer; line-height:26px;}
.floating_nav ul li span{display:block; font-size:18px;}
.floating_nav ul li::after{content:''; display:block; position:absolute; left:100%; top:50%; transform:translateY(-50%); width:1px; height:14px; background:#979797;}
.floating_nav ul li:last-child::after{display:none;}
.floating_nav ul li.active{color:#333}

.floating_nav.gamtan_gnb{background:#000; white-space: nowrap;}
.floating_nav.gamtan_gnb ul{gap: 40px;}
.floating_nav.gamtan_gnb ul li{width:auto; color:#999999;}
.floating_nav.gamtan_gnb ul li span {color:#999999;}
.floating_nav.gamtan_gnb ul li:not(:last-child)::after{content:''; display:block; position:absolute; left:auto; right: -30px; top:50%; transform:translateY(-50%); width:1px; height:14px; background:#979797;}
.floating_nav.gamtan_gnb ul li.active{color:#fff}
.floating_nav.gamtan_gnb ul li.active span{color:#333333}
/* -------------------------------------------------------------------------------- */
/* ¾ÆÄÚµð¾ð */
.accordionBox{display:none;}

/* -------------------------------------------------------------------------------- */
/* Å¸ÀÌ¸Ó */
#timer19{ width: 100%; text-align: center; position: relative;}

#HourCountdown19 { 
    font-family:'SpoqaHanSansNeo-Regular'; 
    position:absolute;transform:translateY(-50%); display: flex; justify-content: space-between;  
    text-align:center;line-height:1; letter-spacing:1.5px;
    
    width:52.5%; bottom: 31%; left:23.2%; 
}
/*#HourCountdown19 span{ width:100%; display:inline-block; font-size: 55px; font-weight:600; color: #fff; text-align:right; }*/
#HourCountdown19 span{ display:inline-block; font-size: 46px; font-weight:600; color: #fff; text-align:center;
    /* ¼ýÀÚ Èçµé¸² ¹æÁö */
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum"; }
#HourCountdown19 .timerText {font-weight:400; text-align:left; color: #fff; font-size:38px;}

#timer19.blur{ width: 100%; text-align: center; position: relative;}
#timer19.blur .timer-box{position:fixed; bottom:0; left:50%; transform:translateX(-50%); width:737px;  background: rgba(12, 46, 86, 0.50); backdrop-filter: blur(26px); padding: 32px 46px; text-align:left;}
#timer19.blur .timer-box #HourCountdown19{position:unset; transform:unset;}
#timer19.blur .timer-box > span{color:#fff; display:block; font-size:24px; padding-top:6px; line-height:1;}
#timer19.blur .timer-box > span:last-child{padding:12px 18px; background:#fff; color:#22446C; position:absolute; right:46px; top:50%; transform:translateY(-50%); line-height:1;}

#floating_timer { 
     font-family:'SpoqaHanSansNeo-Regular' !important; 
     display: flex; text-align:center; font-weight: 500; letter-spacing: 1px; gap:4px;
}
#floating_timer span{ width: 100%; display: block; font-size: 18px; font-weight:600; color: #ffffff; }

#timer32{ width: 100%; text-align: center; position: relative;}
#HourCountdown32 { 
    font-family:'SpoqaHanSansNeo-Regular'; 
    position:absolute;transform:translateY(-50%); display: flex; justify-content: space-between;  
    text-align:center;line-height:1; letter-spacing:-1.5px;
  
    width:52.5%; bottom: 31%; left:23.2%; 
}
#HourCountdown32 span{ font-size: 46px; color: #ffffff; font-weight:500; text-align:center; white-space:nowrap; }
#HourCountdown32 .timerText {font-weight:400; text-align:left; color: #fff; font-size:38px;}

#timer32.blur{ width: 100%; text-align: center; position: relative;}
#timer32.blur .timer-box{position:fixed; bottom:0; left:50%;transform:translateX(-50%); width:737px;  background: rgba(12, 46, 86, 0.50); backdrop-filter: blur(26px); padding: 32px 46px; text-align:left;}
#timer32.blur .timer-box #HourCountdown32{position:unset; transform:unset;}
#timer32.blur .timer-box > span{color:#fff; display:block; font-size:24px; padding-top:6px; line-height:1;}
#timer32.blur .timer-box > span:last-child{padding:12px 18px; background:#fff; color:#22446C; position:absolute; right:46px; top:50%; transform:translateY(-50%); line-height:1;}

#timer24{ width: 100%; text-align: center; position: relative;}
#HourCountdown24 { 
    font-family:'SpoqaHanSansNeo-Regular'; 
    position:absolute;transform:translateY(-50%); display: flex; justify-content: space-between;  
    text-align:center;line-height:1; letter-spacing:-1.5px;
  
    width: 86%; bottom: 22%; left: 7%;   
}
#HourCountdown24 span{ width:100%; font-size: 60px; color: #FF6200; font-weight:500; text-align:center; white-space:nowrap; }

/* -------------------------------------------------------------------------------- */

/* ÀÌº¥Æ® ÅÇ */
.displaynone {display: none!important;}
.eventPage .item-wrap {overflow:visible;}
.eventPage .item-wrap .item-cont .item-list {margin-bottom: 30px;}
.eventPage .item-wrap .item-cont .item-list:last-child {margin-right:0 !important;}

.item-wrap .swiper { margin-bottom:140px; border-top: 2px solid #E5E5E5; overflow:visible; padding-top:67px;}
.item-wrap .swiper:first-child {margin-top:24px; }
.item-wrap .swiper [class^='mySwiper'] {overflow:hidden;}
.item-cont.swiper-wrapper {display:flex;}
.item-wrap .swiper-button-next {right:-73px;}
.item-wrap .swiper-button-next:after {content:url(/design/justmysize/img/arrow_next.svg);}
.item-wrap .swiper-button-prev {left:-30px;display:none;}
.item-wrap .swiper-button-lock {display:block;}

.eventTab_wrap{padding:26px 0;}
.eventTab_wrap .eventTab {text-align: left;width: 100%;margin: auto;}
.eventTab_wrap .eventTab p {display: inline-block;padding: 12px 22px;border: 1px solid #D6D6D6;border-radius: 5px;color: #545454;font-size: 20px;font-weight: 300;margin-right: 13px;cursor: pointer;background-color: #fff;}
.eventTab_wrap .eventTab p.on {font-weight: 600;color: #F06D48;border: 2px solid #F06D48;}
.eventTab_wrap .eventTab p span {font-weight: 300;padding: 0 0.123em;}

.plan_title_name { text-align: left;margin-bottom:50px;}
.plan_title_name .event_title {font-size:24px;font-weight:700;color:#414141;letter-spacing: -0.01em;}
.plan_title_name .event_subTitle {font-size:24px;font-weight:500;color:#414141;}
.plan_title_name .event_subTitle::before {content:'|';padding:0 15px;}
.plan_title_name .event_description {font-size:20px;font-weight:400;color:#898989;margin-top:23px;letter-spacing:0;}

.swiper-horizontal>.swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-horizontal {width: 100% !important;background-color: #F0F0F0 !important;left: 0 !important;bottom:0 !important;}
.swiper-scrollbar-drag {background-color: #F06D48 !important;height: 6px !important;}

.page-body center {margin-bottom:100px;}
.eventTab_wrap.scroll {position: fixed;top: 67px;left:50%; width: 100%; max-width: 1920px; min-width: 1280px; margin: 0 auto; padding: 26px 80px;background-color: #fff;z-index: 1000; border-bottom:1px solid rgb(221, 221, 221); transform:translateX(-50%);}
.prd-info, .item-wrap .item-cont .item-list .prd-name a, .item-wrap .item-cont .item-list .prd-price{font-family: "Pretendard", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}


/* ÁÖ´Ï¾îºê¶ó */
.prdWrap.juniorPromotion{margin-bottom:50px;}
.eventTab_wrap.junior .eventTab{text-align:center;}
.eventTab_wrap.junior .eventTab p{width:200px !important; text-align:center; border-radius:35px; padding:17px 17px; font-size:25px;}
.eventTab_wrap.junior .eventTab p.on{background:#F69155; border-color:#F69155; color:white;}
.prdWrap > p{font-size:2.8rem; margin-top:30px; line-height:1.5}

/* ÅÇ */
.prd_tab{display:flex; width:100%;}
.prd_tab li img{display:none !important;}
.prd_tab li img.on{display:block !important;}
.tab-con{display:none;}
.tab-con.on{display:flex; flex-wrap: wrap;}

.text_tab>*{flex : 1;}
.text_tab li{line-height: 22px; padding: 24px 0; font-size: 16px; font-weight: 400; background: #ffffff; color: #999999;}
.text_tab li.on{color: #493A3A; border-bottom: 6px solid #493A3A;}
.text_tab li span{display: block; font-size: 20px; font-weight: 500; color: #999999;}
.text_tab li.on span {color: #493A3A;}

.text_tab.green li.on{color: #3D6F53; background: #F1F8EB; border-bottom: 6px solid #3D6F53;}
.text_tab.green li.on span {color: #3D6F53;}

.text_tab.pink li.on{color: #DA4D36; background: #FFF3F3; border-bottom: 6px solid #DA4D36;}
.text_tab.pink li.on span {color: #DA4D36;}

.text_tab.orange li.on{color: #E76616; background: #FFF6F0; border-bottom: 6px solid #E76616;}
.text_tab.orange li.on span {color: #E76616;}

.text_tab.beige li.on{color: #624E39; background: #FCE9C8; border-bottom: 6px solid #624E39;}
.text_tab.beige li.on span {color: #624E39;}

.text_tab.brown li.on{color: #624439; background: #FCDEC8; border-bottom: 6px solid #624439;}
.text_tab.brown li.on span {color: #624439;}

.text_tab.blue li.on{color: #3E9ABD; background: #F0F6F9; border-bottom: 6px solid #3E9ABD;}
.text_tab.blue li.on span {color: #3E9ABD;}

.text_tab.purple li.on{color: #754A8C; background: #F8E9FF; border-bottom: 6px solid #754A8C;}
.text_tab.purple li.on span {color: #754A8C;}

.text_tab.red li.on{color: #F97A0F; background: #FAECDD; border-bottom: 6px solid #F97A0F;}
.text_tab.red li.on span {color: #F97A0F;}

.text_tab.yellow li.on{color: #D08E00; background: #FFF6E0; border-bottom: 6px solid #D08E00;}
.text_tab.yellow li.on span {color: #D08E00;}

.text_tab.lightbrown li.on{color: #BB830A; background: #F9F4EA; border-bottom: 6px solid #BB830A;}
.text_tab.lightbrown li.on span {color: #BB830A;}

.inner_tab .tab{display:flex;}
.inner_tab .tab li img{display:none !important;}
.inner_tab .tab li img.on{display:block !important;}
.inner_tab .con{display:none;}
.inner_tab .con.on{display:flex; flex-wrap: wrap;}


/* -------------------------------------------------------------------------------- */
/* ÇÏ´Ü Áø¿­»óÇ° */
.inner{padding:0 80px;}
.prdWrap.inner_m{width: 737px !important;}
.item-wrap .item-cont{display:flex; padding-bottom:56px;}
.item-wrap .item-cont li{display:block; width:calc((100% - 72px)/4); margin-bottom:40px; margin-right:24px;}
.item-wrap .item-cont li:nth-child(4n){margin-right:0;}
.item-wrap .item-cont li a{display:block; position:relative;}
.item-wrap .item-cont li a .number{position:absolute; top:0; left:0; display:block; width:24px; height:24px; text-align:center; font-size:14px; font-weight:500; line-height:24px; color:#fff; background:#000;}
.item-wrap .item-cont li figure img{width:100%; border:solid 1px #F6F6F6;} 
.item-wrap .item-cont li figure .list_shoppingInfo{padding-top:16px;}
.item-wrap .item-cont li figure .list_shoppingInfo .listName{font-size:16px; font-weight:500; line-height:19px; color:#333; padding-bottom:4px;}
.item-wrap .item-cont li figure .list_shoppingInfo .listDiscount{font-size:14px; font-weight:500; line-height:17px; color:#BFBFBF; padding-bottom;2px; text-decoration:line-through;}
.item-wrap .item-cont li figure .list_shoppingInfo .c-sale{display:flex;}
.item-wrap .item-cont li figure .list_shoppingInfo .c-sale > div{margin-right:4px;}
.item-wrap .item-cont li figure .list_shoppingInfo .c-sale > div,
.item-wrap .item-cont li figure .list_shoppingInfo .c-sale > div strong{font-size:18px; font-weight:700; line-height:22px; color:#F06D48;}
.item-wrap .item-cont li figure .list_shoppingInfo .c-sale .listPrice strong{font-size:18px; font-weight:700; line-height:22px; color:#242424;}
.item-wrap .item-cont li figure .list_shoppingInfo .prd-ico .MK-product-icons{display:flex;}
.item-wrap .item-cont li figure .list_shoppingInfo .prd-ico .MK-product-icons img{margin-bottom:10px; height:21px !important; width:auto; box-sizing:content-box;}
.item-wrap .item-cont li figure .list_shoppingInfo .c-prd-etc{margin-top:10px; display:flex;}
.item-wrap .item-cont li figure .list_shoppingInfo .c-prd-etc .c-review{margin-right:8px; font-size:12px; font-weight:500; line-height:14px; color:#999999;}
.item-wrap .item-cont li figure .list_shoppingInfo .c-prd-etc .c-color{font-size:12px; font-weight:500; line-height:14px; color:#999999;}


.item-wrap .swiper .item-cont .none-data{margin:0 auto;}
.item-wrap .swiper .item-cont .none-data i{font-size:4em;}
.item-wrap .swiper .item-cont .none-data p{font-size:2em; margin-top:1.4em}


.float_text{ position: absolute; top: -50%; left: 50%; width: 145px; height: 50px; font-size: 24px; background: #232323; transform:translate(-50%,0);
             display: flex; color: #ffffff; align-items: center; justify-content: center; border-radius: 45px; animation: joinAni .6s infinite alternate;}
.float_text::after {content:""; position: absolute; bottom: -10px; left: 50%; width: 20px; height: 20px; background: #232323; transform:translate(-50%,0) rotate(45deg);}

@keyframes joinAni {
    0% {
        margin-top: 0px;
    }

    100% {
        margin-top: 5px;
    }
}
/* BASIC css end */

