/* BASIC css start */
@import url('https://fonts.googleapis.com/css2?family=Marcellus&display=swap');

/* page-body */
#productPlan .page-body .visual { margin-top:30px }
#productPlan .page-body .pick { margin-top:30px; text-align:center }
#productPlan .page-body .pick select { width:588px; height:38px; font-size:15px; color:#555; text-align:center }
#productPlan .page-body .clst { zoom: 1; overflow: hidden; margin-top: 10px; padding: 10px 7px 7px; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; }
#productPlan .page-body .clst li { float: left; margin-right: 15px; padding-left: 10px; background: url(/images/d3/modern_simple/common/bull_h2_sqr_gray.gif) no-repeat 0 45%; }
#productPlan .page-body .clst li a { display: block; white-space: nowrap; }
#productPlan .page-body .p-hd { position: relative; margin-top: 70px; padding: 0 10px 5px; border-bottom: 2px solid #5c5c5c; }
#productPlan .page-body .p-hd.mt-35 { margin-top: 35px; }
#productPlan .page-body .p-hd h3 { color: #5c5c5c; font-size: 14px; font-weight: bold; letter-spacing: -1px; }
#productPlan .page-body .p-hd .top { position: absolute; top: 0; right: 5px; color: #5c5c5c; }
#productPlan .page-body .plst { zoom: 1; overflow: hidden; margin: 25px auto 0; }


#productPlan .page-body .item-wrap .main_icons { position:relative; }
#content .page-hd h2{ text-align: center;}


/* 기획전 공통 */
.displaynone {display: none!important;}
.promotion_wrap { width: 900px; margin: 0 auto 80px; font-size: 0; line-height: 0; }
.promotion_wrap a { display: inline-block; width: 100%; }
.promotion_wrap img { width: 100%; display: inline-block; }
.promotion_wrap .wd50 { width: 50%; }
.promotion_wrap .wd33 { width: 33.33%; }

.prmWrap .tab-nav {margin: 80px 0 0 0;}
.prmWrap .tab-nav ul { display: flex; justify-content: center; }
.prmWrap .tab-nav li { flex: 1; font-size: 28px; font-weight: 500; color: #a2a2a2; background: #f9f9f9; padding: 40px 0; text-align: center; }
.prmWrap .tab-nav li.active { color: #000; background: #fff;}


.prmWrap .tab-content .con { display: none; }
.prmWrap .tab-content .con.active { display: block; }


/* 이벤트 탭 */
#productPlan .item-wrap {overflow:visible; padding: 0 80px;}
#productPlan .item-wrap .item-cont .item-list {margin-bottom: 30px;}
#productPlan .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; flex-wrap: nowrap;}
.item-wrap .swiper-button-next {right:-73px;}
.item-wrap .swiper-button-next::after {display:none;}
.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%; 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;}


/* 사이즈 안내 */
.prmWrap .size_title { font-size: 32px; font-weight: 500; margin: 80px 0 0 0;}
.prmWrap .steps {padding: 120px 0 40px 0;}
.prmWrap .steps .step_title span{ display: block; margin: 0 0 24px 0; font-family: "Marcellus", serif; color: #BF214B; font-size: 28px; font-weight: 500;}
.prmWrap .steps .step_title p{font-size: 28px; font-weight: 500;}

.prmWrap .steps .tab-nav {margin: 80px 0 32px 0;}
.prmWrap .steps .tab-nav ul.nav_ver01 {width: 500px; margin: 0 auto; background: #d9d9d9; padding: 8px; border-radius: 80px; overflow: hidden;}
.prmWrap .steps .tab-nav ul.nav_ver01 li{font-size: 24px; font-weight: 500; background: #d9d9d9; border-radius: 80px; padding: 20px 0;}
.prmWrap .steps .tab-nav ul.nav_ver01 li.active { color: #000; background: #fff;}

.prmWrap .slide_wrap {margin: 0 0 24px 0;}
.prmWrap .slide_wrap .text_box{ text-align: left; padding: 32px 24px; border: 1px solid #eee;}
.prmWrap .slide_wrap .text_box p:first-child {display: flex; align-items: center; font-weight: 500; font-size: 22px; margin: 0 0 16px 0;}
.prmWrap .slide_wrap .text_box p .number{background: #000000; color: #ffffff; padding: 2px 6px; border-radius: 50%; margin-right: 8px; font-size: 14px;}
.prmWrap .add_info{ text-align: left; font-size: 16px; font-weight: 400; color: #525252; line-height: 24px;}

.prmWrap .steps .swiper-button-next{top:71%; right:32px; width:auto}
.prmWrap .steps .swiper-button-next::after{font-size:22px; color:#000000;}

.prmWrap .mid_info{ padding: 24px 40px; background: #e2e2e2; text-align: left; font-size: 16px; font-weight: 400;}

.prmWrap .steps .info_con{ padding: 16px; border: 1px solid #eee; border-radius: 15px;}
.prmWrap .steps .info_con figure{overflow: hidden; margin: 0 0 8px 0;}    
.prmWrap .steps .info_con figcaption{text-align: left; padding: 24px 0;}
.prmWrap .steps .info_con figcaption .text_top{margin: 0 0 24px 0;}

.prmWrap .step_three{margin: 0 0 80px 0;}
.prmWrap .step_three .step_title{margin: 0 0 80px 0;}


/* 올바른 착용 방법 */
.prmWrap .step { padding: 100px 0; }
.prmWrap .step .progress_tit{font-family: "Marcellus", serif;}
.prmWrap .step .swiper-pagination { bottom: auto; top: 12px; }

.prmWrap .step .swiper-pagination-bullet { position: relative; width: 50px; height: 50px; color: #a2a2a2; background: #f2f2f2; opacity: 1; line-height: 49px; font-size: 20px; font-weight: 400; border: 2px solid #f2f2f2; }
.prmWrap .step .swiper-pagination-bullet:not(.swiper-pagination-bullet.on ~ .swiper-pagination-bullet):not(.swiper-pagination-bullet.on) { color: #BF214B; background: #ffffff; border: 2px solid #BF214B;}

.prmWrap .step .swiper-pagination-bullet.on { color: #ffffff; background: #BF214B; position: relative; border: 2px solid #BF214B;}
.prmWrap .step .swiper-pagination-bullet.on::after { content: ""; position: absolute; width: 70px; height: 70px; background: #BF214B; opacity: 0.2; top: 50%; left: 50%; 
                                                      transform: translate(-50%, -50%); z-index: -1; border-radius: 50%; }
.prmWrap .step .swiper-pagination-bullet:not(:last-child)::before { content: ""; position: absolute; top: 50%; left: 110%; height: 0; width: 32px; border: 1px dashed #a2a2a2;}
.prmWrap .step .swiper-pagination-bullet:not(:last-child){margin-right:40px;}

.prmWrap .step .swiper-button-next{top:75.5%; right:32px; width:auto}
.prmWrap .step .swiper-button-next::after{font-size:22px; color:#000000;}


/* BASIC css end */