@charset "utf-8"; #wrap .ly_wrap{width:100%;} /*─────────────────────────────────────────────────────────── 레이아웃 ───────────────────────────────────────────────────────────*/ body {width:100%; height:auto; -webkit-overflow-scrolling:touch;} address, em {font-style:normal;} div, p, th, td, strong, span, ul, li, ol, dt, dd {white-space:normal;word-break:keep-all;word-wrap:break-word;} form legend{display:none;} #layerDim{position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 200;background:rgba(0,0,0, 0.5);} /* clear type */ .clear, .after_div {*zoom:1;} .clear:after, .after_div:after {content:"";display:block;clear:both;} .fl {float:left;} .fr {float:right;} .clear_fl {clear:both;float:left;} /* display type */ .db {display:block;} .dn {display:none;} .di {display:inline-block;} .dt {display:table;} .dr {display:table-row;} .dc {display:table-cell;} /* hidden type */ .blind {width:0;height:0;text-indent:-9999999px} .opacityhidden {opacity:0;} .blind_dn {display:none !important;}/* pg 심사때문에 가려야하는 영역에서만 사용할 것. 모바일에서 display:none !important 사용 금지. */ /* position type */ .relative {position:relative;} .absolute {position:absolute;} .dis_table {display:table;table-layout:fixed;width:100%;margin:0 auto;border-collapse:collapse;} .dis_tablecell {display:table-cell;vertical-align:middle;box-sizing:border-box;border-collapse:collapse;} /*** align type ***/ .ta_left {text-align:left !important;} .ta_center {text-align:center !important;} .ta_right {text-align:right !important;} .va_top {vertical-align:top !important;} .va_middle {vertical-align:middle !important;} .va_bottom {vertical-align:bottom !important;} /* 일반 - 375 */ .w_custom {padding-left:15px;padding-right:15px;width:100%;box-sizing:border-box;margin-left:auto;margin-right:auto;} #wrap {min-width:320px; width:100%; height:100%; -webkit-overflow-scrolling:touch;overflow:hidden;box-sizing:border-box;} .ly_wrap {overflow:hidden; overflow-y:scroll; -webkit-overflow-scrolling:touch;} .ly_pop {overflow-x: hidden !important;} #wrap .content_box{float:none;position: relative;} #frmWritePassword{position: relative;z-index:210;} @media only screen and (max-width:320px) { .w_custom {padding-left:10px;padding-right:10px;} } /*─────────────────────────────────────────────────────────── 상단 outline/header ───────────────────────────────────────────────────────────*/ /* 상단 일반 */ /* 일반 - 375 */ .slick-track, .slick-slide {outline:0;} #header_wrap {position:relative;z-index:15;transition:background 0.3s;} #header_wrap header {width:100%;min-width:320px;background:#fff;z-index:300;position:sticky;left:0;top:0;margin:0 auto;transition:background 0.3s;} #header_wrap header .hd_relative {position:relative;z-index:1;width:100%;margin:0;background:#fff;box-sizing:border-box;border-bottom:1px solid #ddd;} #header_wrap header .hd_relative.bd_none{border:none;} #header_wrap header .header_box {border:0;} #header_wrap header .header_box .hd_con1 {position:relative;z-index:1;width:100%;margin:0;padding:0;text-align:center;} #header_wrap header .header_box .h_logo {padding:23px 0 9px;line-height:20px;width:auto;display:inline-block;vertical-align:top;margin:0 auto;box-sizing:border-box;text-align:center;} #header_wrap header .header_box .h_logo a {font-size:0;line-height:0;} #header_wrap header .header_box .h_logo img {width:auto;height:20px;} #header_wrap header .header_box .left_menu, #header_wrap header .header_box .right_menu {position:absolute;} #header_wrap header .header_box .left_menu {left:0;top:8px;} #header_wrap header .header_box .right_menu {right:0;top:0;} #header_wrap header .header_box .side_menu {padding:15px;box-sizing:border-box;margin:0 auto;vertical-align:top;outline:0;border:0;background:none;display:inline-block;} #header_wrap header .header_box .side_menu span {width:25px;height:20px;background:url('../img/da_image/icon_cate.png')no-repeat center;background-size:100%;display:inline-block;font-size:0;vertical-align:top;} #header_wrap header .header_box .side_menu.on span{background:url('../img/da_image/btn_close.png')no-repeat center;background-size:15px auto;} #header_wrap header .header_box .right_menu > div {padding:5px;padding-left:11px;width:56px;height:50px;background-image:url('../img/da_image/bg_hd_brand.png');background-repeat:no-repeat;background-position:100% 0%;background-size:100% !important;box-sizing:border-box;text-align:right;} #header_wrap header .header_box .right_menu > div > a {padding:12px 0;width:40px;height:40px;border-radius:100%;font-size:11px;letter-spacing:-0.33px;line-height:1em;font-weight:500;text-align:center;display:inline-block;background:#1b253c;color:#fff;box-sizing:border-box;margin:0 auto;vertical-align:top;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;} #header_wrap header .header_box .right_menu > div > a > span {border-top:3px solid transparent;border-right:3px solid #30ccb4;border-bottom:3px solid transparent;transform:translate(-0%, -0%) rotate(180deg);width:0;height:0;display:block;margin:4px auto 0;vertical-align:top;} #header_wrap header .header_box .hd_con2 {} #header_wrap header .header_box .hd_con2 .hd_lnb {display:block;} #header_wrap header .hd_lnb {vertical-align:top;font-size:0;text-align:center;width:100%;position: relative;} #header_wrap header .hd_lnb li {padding:0;width:auto;vertical-align:top;box-sizing:border-box;display:inline-block;} #header_wrap header .hd_lnb li span {line-height:16px;padding:10px 10px 11px;font-size:14px;letter-spacing:0.02em;box-sizing:border-box;vertical-align:top;font-weight:400;color:#333;display:inline-block;font-family:'Jomolhari','Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;position:relative;z-index:1;cursor:pointer;} #header_wrap header .hd_lnb > li > span:before {width:0;height:2px;background:#000;left:50%;bottom:0;transform:translateX(-50%);display:inline-block;content:"";position:absolute;} #header_wrap header .hd_lnb > li.on {} #header_wrap header .hd_lnb li.on a {} #header_wrap header .hd_lnb > li.on > span:before {width: calc(100% - 20px);} #header_wrap header .hd_lnb .sub_lnb_dep2{display: none;position: absolute;top:100%;background:#f5f5f5;width:100%;left:0;box-sizing:border-box;padding:0 15px;overflow-x:auto;white-space:nowrap;} #header_wrap header .hd_lnb > li.lnb_on .sub_lnb_dep2{display:block;} #header_wrap header .hd_lnb > li .sub_lnb_dep2 li{position: relative;} #header_wrap header .hd_lnb > li .sub_lnb_dep2 li + li{margin-left:12px;} #header_wrap header .hd_lnb > li .sub_lnb_dep2 li + li:before{width:3px;height:3px;content:"";background:#ddd;box-sizing:border-box;border-radius:100%;display:inline-block;vertical-align:middle;position: absolute;left:-7px;top:16px;} #header_wrap header .hd_lnb > li .sub_lnb_dep2 li a{font-size:13px;color:#666;font-weight:400;font-family:'Jomolhari','Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;line-height:35px;} #header_wrap header .hd_lnb > li .sub_lnb_dep2 li.on a{color:#333;} /* 이전으로 */ .sub_top {position:relative;padding:0 45px;border-top:1px solid #eee;background:#fff;} .sub_top .sub_top_left {position:absolute; top:0; left:0;} .sub_top h2 {overflow:hidden;display:block;width:100%;padding:11px 0;white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:500;line-height:15px;color:#333;text-align:center;font-family:'Roboto','Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} /* 목록가기 글쓰기 위치 */.sub_top .sub_top_right2 {position:absolute;top:5px;right:5px;} /* 네비게이터 */ .navi_g {background:#fff;border-top:1px solid #eee;} .navi_g ul {padding:6px 10px;font-size:0;} .navi_g ul li {display:inline-block;font-size:12px;text-indent:17px;background:url('../img/icon/icon_arrow_next.png') no-repeat 5px center;background-size:7px 11px;} .navi_g ul li:nth-child(1) {text-indent:0;background:none;} .navi_g ul li a {font-size:12px;text-indent:15px;} /*#header_wrap {} #header_wrap header { width:100%; min-width:320px; background:#fff; z-index:300;} #header_wrap header.h_on {position:fixed; top:0; left:0;} #header_wrap header .header_box {border-bottom:1px solid #cbcbcb;} #header_wrap header .header_box .h_logo {width:110px; padding:15px 0 15px 0; margin:0 auto; line-height:0; text-align:center;} #header_wrap header .header_box .h_logo a {font-size:0; line-height:0; } #header_wrap header .header_box .h_logo img {width:100%;} #header_wrap header .header_box .left_menu {position:absolute; top:0; left:5px; display:table;} #header_wrap header .header_box .left_menu li {display:table-cell; vertical-align:top;} #header_wrap header .header_box .right_menu {position:absolute; top:0; right:5px; display:table;} #header_wrap header .header_box .right_menu li {position:relative; display:table-cell; vertical-align:top;} #header_wrap header .header_box .side_menu {display:inline-block; padding:16px 7px 15px 7px; vertical-align:top;} #header_wrap header .header_box .side_menu span {display:inline-block; width:20px; height:15px; font-size:0; background:url('../img/icon/icon_menu.png') no-repeat center; background-size:100%; vertical-align:top;} #header_wrap header .header_box .top_search {display:inline-block; padding:15px 7px 15px 7px; vertical-align:top; background:none; border:none;} #header_wrap header .header_box .top_search span {display:inline-block; width:18px; height:17px; font-size:0; background:url('../img/icon/icon_search.png') no-repeat center; background-size:100%; vertical-align:top;} #header_wrap header .header_box .mypage {display:inline-block; padding:14px 7px 14px 7px;} #header_wrap header .header_box .mypage span {display:inline-block; width:21px; height:21px; font-size:0; background:url('../img/icon/icon_mypage.png') no-repeat center; background-size:100%; vertical-align:top;} #header_wrap header .header_box .cart {display:inline-block; padding:15px 7px 14px 7px;} #header_wrap header .header_box .cart span {display:inline-block; width:20px; height:21px; font-size:0; background:url('../img/icon/icon_cart.png') no-repeat center; background-size:100%; vertical-align:top;} #header_wrap header .header_box .cart_count {position:absolute; top:8px; right:0; display:block; padding:3px 6px 1px 6px; line-height:15px; border-radius:100%; color:#fff; background:#275b4e; vertical-align:middle; font-size:12px;} */ @media only screen and (max-width:350px) { #header_wrap header .hd_lnb li span{font-size:13px;} } @media only screen and (max-width:330px) { #header_wrap header .hd_lnb li span{padding:10px 8px 11px;} } /* 카테고리 */ /* 일반 - 375 */ #wrap nav {display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:1001;box-sizing:border-box;border-top:1px solid #ddd;} #wrap nav .bg {display:none; position:absolute; top:0; left:0; width:100%; height:100%; background:transparent; z-index:1001;} #wrap nav .nav_bg_box {position:relative;} #wrap nav .nav_bg_box .nav_box {position:fixed; top:67px; left:0; width:100%; height:calc(100% - 67px); margin:0 0 0 -100%; background:#fff; z-index:1001;} #wrap nav .nav_bg_box .nav_box .nav_iscroll_box {position:relative; overflow: hidden; width:100%; height:100%;} #wrap nav .nav_bg_box .nav_box .nav_iscroll_box {position:absolute; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0);} #header_wrap header .header_box .hd_search_wrap {} #header_wrap header .header_box .hd_search_wrap ._header_search .layer_search_box {background:#fff;padding:7px 15px 11px;box-sizing:border-box;width:100%;} #header_wrap header .header_box .hd_search_wrap ._header_search .layer_search_box dl {padding:10px 50px 10px 15px;height:40px;border-radius:40px;width:100%;box-sizing:border-box;margin:0;background:#f5f5f5;} #header_wrap header .header_box .hd_search_wrap ._header_search .layer_search_box dl dd .keyword_box input {font-size:13px;color:#888;width:100%;height:20px;line-height:20px;border:0;background:none;padding:0 30px 0 0;text-indent:0;} #header_wrap header .header_box .hd_search_wrap ._header_search .layer_search_box dl dd .keyword_box input::-webkit-input-placeholder {font-size:13px;color:#888;font-weight:400;line-height:20px;} #header_wrap header .header_box .hd_search_wrap ._header_search .layer_search_box dl dd .keyword_box input::-moz-placeholder {font-size:13px;color:#888;font-weight:400;line-height:20px;} #header_wrap header .header_box .hd_search_wrap ._header_search .layer_search_box dl dd .keyword_box input:-ms-input-placeholder {font-size:13px;color:#888;font-weight:400;line-height:20px;} #header_wrap header .header_box .hd_search_wrap .h_search_btn {width:30px;height:20px;line-height:20px;right:30px;top:17px;border:0;background:url(../img/da_image/btn_search.png) no-repeat 50% 50%;background-size:20px 20px;font-size:0;} #header_wrap header .header_box .hd_search_wrap ._header_search .layer_search_box dl dd .keyword_box button, #header_wrap header .header_box .hd_search_wrap .h_search_close_btn.ly_btn_close, #header_wrap header .header_box .hd_search_wrap ._header_search .layer_search_content {display:none !important;} /* 다국어 선택 */ .nav_language {display:table; position:relative; width:100%; background:#f3f3f3; } .nav_language .tit {display:table-cell; width:30%; font-size:15px; padding:13px 15px 13px 15px; color:#262626; font-weight:bold; box-sizing:border-box;} .nav_language .language_box {display:table-cell; width:70%; box-sizing:border-box;} /*로그인박스*/ .nav_login_box{box-sizing:border-box;width:100%;padding:25px 15px 20px 15px;border-bottom:12px solid #eee;} .nav_login_box .login_txt{} .nav_login_box .login_txt:after{clear:both;content:"";display: block;} .nav_login_box .login_txt p{font-size:16px;color:#333;font-weight:300;letter-spacing:-0.07em;line-height:21px;display: inline-block;float:left;vertical-align: top;max-width:75%;} .nav_login_box .login_txt p strong{font-weight:500;} .nav_login_box .login_txt p span{display:block;font-size:14px;color:#888;font-weight:300;letter-spacing:-0.07em;margin-top:6px;} .nav_login_box .login_txt a{display: inline-block;float: right;vertical-align: top;position: relative;box-sizing:border-box;} .nav_login_box .login_txt a:before{width:100%;height:6px;content:"";background:#275b4e;opacity:0.15;z-index:-1;position: absolute;left:0;bottom:2px;} .nav_login_box .login_txt a span{display:inline-block;font-size:14px;color:#275b4e;font-weight:500;position: relative;padding-left:18px;letter-spacing:-0.07em;} .nav_login_box .login_txt a.link_join span:before{width:10px;height:1px;content:"";background:#275b4e;position: absolute;left:0;top:10px;} .nav_login_box .login_txt a.link_join span:after{width:1px;height:10px;content:"";background:#275b4e;position: absolute;left:5px;top:6px;} .nav_login_box .login_txt a.link_mypage span{padding:0 15px 0 0;} .nav_login_box .login_txt a.link_mypage span:before{width:4px;height:1px;content:"";background:#275b4e;position: absolute;right:3px;top:43%;transform:rotate(45deg);} .nav_login_box .login_txt a.link_mypage span:after{width:4px;height:1px;content:"";background:#275b4e;position: absolute;right:3px;top:57%;transform:rotate(-45deg);} .login_btn_box{width:100%;font-size:0;margin-top:16px;} .login_btn_box .btn_self_go.btn_go{width:calc(50% - 5px);height:50px;line-height:48px;font-size:15px;} .login_btn_box .btn_self_go.btn_go:nth-child(2){margin-left:10px;} .nav_login_box .nav_search_box{width:100%;font-size:0;margin-top:20px;} .nav_login_box .nav_search_box:after{clear:both;content:"";display: block;} .nav_login_box .nav_search_box .nav_search_wrap{display: inline-block;vertical-align: top;width:62.32%;} .nav_login_box .nav_search_box ._header_search .layer_search_box{background:#fff;} .nav_login_box .nav_search_box ._header_search .layer_search_box dl{padding:0;} .nav_login_box .nav_search_box ._header_search .layer_search_box dl dd .keyword_box input{border:1px solid #333;border-width:0 0 1px 0;height:50px;line-height:50px;font-size:15px;color:#333;font-weight:400;padding-right:50px;background:#fff;} .nav_login_box .nav_search_box .h_search_btn{right:0;top:3px;width:25px;height:47px;background:url('../img/da_image/icon_nav_search.png')no-repeat center;background-size:auto 18px;border:none;font-size:0;} .nav_login_box .nav_search_box .nav_order_easy{display: inline-block;float: right;width:33.33%;} .nav_login_box .nav_search_box .nav_order_easy a{display: block;width:100%;height:50px;line-height:48px;box-sizing:border-box;border:1px solid #1b253c;background:#1b253c;text-align:center;font-size:15px;color:#fff;font-weight:400;letter-spacing:-0.9px;} /*카테고리*/ .nav_category{margin-top:40px;} .nav_category .cate_tab{width:100%;font-size:0;position: relative;} .nav_category .cate_tab li{display: inline-block;width:33.3333%;box-sizing:border-box;background:#fff;border:1px solid #ddd;border-width:1px 0 1px 0;vertical-align:top;cursor:pointer;} .nav_category .cate_tab li span{text-align:center;display:block;box-sizing:border-box;font-size:15px;color:#888;font-weight:300;letter-spacing:-1px;line-height:48px;position: relative;} .nav_category .cate_tab li span:before{display: none;content:"";width: 0px;height: 0px;border-top:8px solid #275b4e;border-bottom:none;border-right:8px solid transparent;border-left:8px solid transparent;position: absolute;left:50%;bottom:-8px;transform:translate(-50%);z-index:10;} .nav_category .cate_list{margin-top:-1px;} .nav_category .category_menu{width:100%;font-size:0;position: relative;} .nav_category .category_menu > li .sub_category_menu{display:none;background:#f5f5f5;box-sizing:border-box;padding:30px 15px 6px 15px;font-size:0;margin-top:1px;} .nav_category .category_menu > li .sub_category_menu li{text-align: center;display: inline-block;margin:0 0 17px 15px;width:calc(25% - 11.25px);box-sizing:border-box;vertical-align: top;} .nav_category .category_menu > li .sub_category_menu li:nth-of-type(4n+1){margin-left:0;} .nav_category .category_menu > li .sub_category_menu li a{font-size:14px;color:#777;font-weight:400;letter-spacing:-1.2px;font-family:'Noto Sans KR';display:block;padding-top:83px;box-sizing:border-box;} .nav_category .category_menu > li .sub_category_menu li.cd_num002010 a {white-space:normal;word-break:keep-all;word-wrap:break-word;}/*padding-left:13.5px;padding-right:13.5px;*/ .nav_category .category_menu > li .sub_category_menu li.view_all a{background:url('../img/da_image/icon_all.png')no-repeat center top;background-size:100%;} .nav_category .category_menu > li.line_c .sub_category_menu{text-align: center;} /*on*/ .nav_category .cate_tab li.on{background:#275b4e;border:1px solid #275b4e;border-width:1px 0 1px 0;z-index:5;} .nav_category .cate_tab li.on > span{color:#fff;font-weight:400;box-shadow: 5.5px 9.5px 14px -3px rgba(0, 0, 0, 0.21);} .nav_category .cate_tab li.on > span:before{display: block;} .nav_category .category_menu > li.on .sub_category_menu{display:block;} /*전체제품*/ nav .prd_link{width:100%;box-sizing:border-box;border-bottom:1px solid #ddd;font-size:0;} nav .prd_link > div{display: inline-block;width:50%;box-sizing:border-box;position: relative;} nav .prd_link > div:nth-child(2):before{width:1px;height:15px;content:"";background:#ddd;position: absolute;left:0;top:50%;transform:translateY(-50%);} nav .prd_link a{font-size:16px;color:#333;font-weight:400;letter-spacing:-1.5px;display: block;height:55px;line-height:54px;font-family:'Noto Sans KR';} nav .prd_link .btn_review_more a span{padding-right:28px;} nav .prd_link .btn_review_more a span:before{top:18px;} nav .prd_link .btn_review_more a span:after {border-color:#777;} /*서브 카테고리 메뉴*/ .nav_sub_cate{width:100%;font-size:0;box-sizing:border-box;padding:0 25px;margin-top:20px;} .nav_sub_cate > li{} .nav_sub_cate > li > span{display: block;width:100%;font-size:17px;color:#333;font-weight:400;letter-spacing:-1.02px;line-height:55px;font-family:'Jomolhari','Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;position: relative;} .nav_sub_cate > li > span:before, .nav_sub_cate > li > span:after{width:7px;height:1px;content:"";background:#555;position: absolute;top:28px;} .nav_sub_cate > li > span:before{right:10px;transform:rotate(-45deg);} .nav_sub_cate > li > span:after{right:15px;transform:rotate(-135deg);} .nav_sub_cate > li .sub_cate1{box-sizing:border-box;border-top:1px solid #ddd;display: none;padding:5px 0 0 10px;} .nav_sub_cate > li .sub_cate1 li a{font-size:15px;color:#888;font-weight:400;letter-spacing:-0.9px;line-height:45px;font-family:'Noto Sans KR';display: block;width:100%;} /*on*/ .nav_sub_cate > li span.on{color:#275b4e;} .nav_sub_cate > li > span.on:before, .nav_sub_cate > li > span.on:after{background:#275b4e;} .nav_sub_cate > li > span.on:before{transform:rotate(45deg);} .nav_sub_cate > li > span.on:after{transform:rotate(135deg);} /*1분 진단 결과*/ .nav_self_test{margin-top:17px;font-size:0;box-sizing:border-box;padding-bottom:25px;border-bottom:12px solid #eee;} .nav_self_test p{width:100%;background:#275b4e;font-size:15px;color:#fff;font-weight:400;letter-spacing:-0.9px;font-family:'Noto Sans KR';text-align: center;padding:11.25px 0;} .nav_self_test > div{display: inline-block;width:50%;box-sizing:border-box;margin-top:25px;text-align: center;position: relative;} .nav_self_test .mystore:before{width:1px;height:100%;content:"";background:#ddd;position: absolute;left:0;top:0;} .nav_self_test > div a{display: block;width:100%;height:100%;box-sizing:border-box;font-size:15px;color:#333;font-weight:400;letter-spacing:-1.5px;line-height:1;padding-top:66px;} .nav_self_test .result_self a{background:url('../img/da_image/icon_result.png')no-repeat center top;background-size: auto 55px;} .nav_self_test .mystore a{background:url('../img/da_image/icon_mystore.png')no-repeat center top;background-size: auto 55px;} /*sns*/ .nav_sns{width:100%;box-sizing:border-box;padding:32px 0;} .nav_sns ul{width:100%;font-size:0;text-align: center;} .nav_sns ul li{display: inline-block;box-sizing:border-box;vertical-align: top;} .nav_sns ul li + li{margin-left:20px;} @media only screen and (max-width:340px) { .nav_self_test p{font-size:13px;} } @media only screen and (max-width:320px) { } /* 고정메뉴 */ /* 일반 - 375 */ #quick_wrap {position:fixed;left:0;bottom:0;width:100%;margin:0 auto;z-index:15;} #quick_wrap .quick_menu {height:69px;padding:9px 0 0;background:url(../img/da_image/bg_fixed_menu.png) no-repeat 50% 100%;background-size:100% 69px;font-size:0;vertical-align:top;position:relative;z-index:15;width:100%;margin:0;box-sizing:border-box;} #quick_wrap .quick_menu dt {position:absolute;left:50%;bottom:18px;width:60px;height:60px;border-radius:60px;transform:translateX(-50%);z-index:5;} #quick_wrap .quick_menu dd {height:60px;text-align:center;position:relative;z-index:1;width:100%;font-size:0;vertical-align:top;} #quick_wrap .quick_menu dt a {width:60px;height:60px;border-radius:60px;position:absolute;left:0;top:0;z-index:2;display:block;box-shadow:-2px -2px 10px rgba(0,0,0,0.15);} #quick_wrap .quick_menu dt strong {width:60px;height:60px;border-radius:60px;color:#fff;font-size:14px;font-weight:500;line-height:16px;padding:12px 0 16px;letter-spacing:-0.56px;display:inline-block;text-align:center;background: rgb(49,208,179);background: linear-gradient(90deg, rgba(49,208,179,1) 0%, rgba(28,110,194,1) 100%);box-sizing:border-box;} #quick_wrap .quick_menu dd {} #quick_wrap .quick_menu dd ul {font-size:0;vertical-align:top;} #quick_wrap .quick_menu dd ul li {width:20%;padding:10px 0 7px;display:inline-block;vertical-align:top;text-align:center;box-sizing:border-box;position:relative;z-index:1;} #quick_wrap .quick_menu dd ul li:nth-of-type(1) {} #quick_wrap .quick_menu dd ul li:nth-of-type(2) {} #quick_wrap .quick_menu dd ul li:nth-of-type(3) {width:40%;padding-left:20%;} #quick_wrap .quick_menu dd ul li:nth-of-type(4) {} #quick_wrap .quick_menu dd ul li a, #quick_wrap .quick_menu dd ul li span, #quick_wrap .quick_menu dd ul li em {display:inline-block;margin:0 auto;padding:0;} #quick_wrap .quick_menu dd ul li a {position:absolute;left:0;top:0;width:100%;height:100%;z-index:3;} #quick_wrap .quick_menu dd ul li:nth-of-type(3) a {right:0;left:auto;width:50%;} #quick_wrap .quick_menu dd ul li span {height:25px;margin-bottom:2px;width:100%;position:relative;z-index:1;} #quick_wrap .quick_menu dd ul li span img {width:auto;height:23px;} #quick_wrap .quick_menu dd ul li:nth-of-type(1) span img {height:25px;} #quick_wrap .quick_menu dd ul li:nth-of-type(4) span img {height:22px;margin-top:2px;} #quick_wrap .quick_menu dd ul li span em {left:50%;min-width:15px;height:15px;line-height:14px;padding:1px 2px 0;border-radius:15px;font-size:12px;font-weight:500;letter-spacing:-0.36px;top:0;transform:translateX(8px);color:#fff;background:#1673d7;width:auto;text-align:center;box-sizing:border-box;vertical-align:top;position:absolute;font-family: 'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} #quick_wrap .quick_menu dd ul li span em {padding-left:4px;padding-right:4px;letter-spacing:-0.6px;padding-top:0;line-height:14px;} #quick_wrap .quick_menu dd ul li em {font-size:13px;line-height:21px;color:#333;} @media only screen and (max-width:360px) { #quick_wrap .quick_menu {height:67px;background-size:100% 67px;} #quick_wrap .quick_menu dt, #quick_wrap .quick_menu dd, #quick_wrap .quick_menu dt a, #quick_wrap .quick_menu dt strong {height:58px;} #quick_wrap .quick_menu dt, #quick_wrap .quick_menu dt a, #quick_wrap .quick_menu dt strong {width:58px;height:58px;border-radius:58px;} #quick_wrap .quick_menu dt strong {padding:11px 0 15px;} #quick_wrap .quick_menu dd ul li {padding:9px 0 7px;} #quick_wrap .quick_menu dd ul li span {margin-bottom:3px;} } @media only screen and (max-width:340px) { #quick_wrap .quick_menu {height:62px;padding:8px 0 0;background-size:100% 62px;} #quick_wrap .quick_menu dt {bottom:15px;} #quick_wrap .quick_menu dt, #quick_wrap .quick_menu dd, #quick_wrap .quick_menu dt a, #quick_wrap .quick_menu dt strong {height:56px;} #quick_wrap .quick_menu dt, #quick_wrap .quick_menu dt a, #quick_wrap .quick_menu dt strong {width:56px;height:56px;border-radius:56px;} #quick_wrap .quick_menu dt strong {font-size:13px;line-height:16px;padding:10px 0 14px;} #quick_wrap .quick_menu dd ul li {padding:8px 0 7px;} #quick_wrap .quick_menu dd ul li span {height:24px;margin-bottom:2px;} #quick_wrap .quick_menu dd ul li span img {height:23px;} #quick_wrap .quick_menu dd ul li:nth-of-type(1) span img {height:24px;} #quick_wrap .quick_menu dd ul li:nth-of-type(4) span img {height:21px;margin-top:2px;} #quick_wrap .quick_menu dd ul li span em {font-size:11px;} #quick_wrap .quick_menu dd ul li em {font-size:13px;line-height:20px;} } @media only screen and (max-width:320px) { #quick_wrap .quick_menu {height:60px;padding:7px 0 0;background-size:100% 60px;} #quick_wrap .quick_menu dt, #quick_wrap .quick_menu dd, #quick_wrap .quick_menu dt a, #quick_wrap .quick_menu dt strong {height:54px;} #quick_wrap .quick_menu dt, #quick_wrap .quick_menu dt a, #quick_wrap .quick_menu dt strong {width:54px;height:54px;border-radius:54px;} #quick_wrap .quick_menu dt strong {padding:10px 0 12px;} #quick_wrap .quick_menu dd ul li span {height:23px;} #quick_wrap .quick_menu dd ul li span img {height:22px;} #quick_wrap .quick_menu dd ul li:nth-of-type(1) span img {height:23px;} #quick_wrap .quick_menu dd ul li:nth-of-type(4) span img {height:20px;} } /*─────────────────────────────────────────────────────────── 하단 outline/footer ───────────────────────────────────────────────────────────*/ /* 일반 - 375 */ #footer_wrap {border:0;margin:0;padding:100px 0 0;width:100%;box-sizing:border-box;position: relative;z-index:2;} #footer {background:#27282c;border:0;margin:0;padding:0;width:100%;box-sizing:border-box;position:relative;z-index:1;} .ft_go_btn {position:fixed;right:10px;bottom:65px;z-index:10;} .ft_go_btn a {height:40px;line-height:30px;padding:10px 0 0;width:40px;border-radius:100%;color:#555;background:#fff;border:1px solid #ddd;display:inline-block;text-align:Center;margin:0 auto;position:relative;z-index:1;box-sizing:border-box;font-size:14px;box-shadow:3px 3px 3px rgba(0, 0, 0, 0.15);} .ft_go_btn a:before {width:7px;height:7px;border-width:1px 1px 0 0;border-style:solid;border-color:#555;position:absolute;left:50%;top:9px;transform:translateX(-50%) rotate(-45deg);display:inline-block;content:"";} .ft_go_btn.ft_cart{bottom:100px;} #footer .ft_menu {padding:0;border-bottom:1px #333 solid;box-sizing:border-box;vertical-align:top;text-align:center;font-size:0;} #footer .ft_menu li {width:22.32%;font-size:14px;line-height:1em;padding:1.5em 0;display:inline-block;vertical-align:top;} #footer .ft_menu li:nth-of-type(3) {width:33%;} #footer .ft_menu li a {color:#aaa;font-size:inherit;line-height:inherit;vertical-align:top;} #footer .ft_menu li a.privacy {color:#fff;} #footer .ft_menu li + li {} #footer .ft_cs {padding-top:15px;padding-bottom:15px;} #footer .ft_cs .ft_link_mystore{width:100%;height:50px;text-align:center;background:linear-gradient(120deg, rgba(30,106,184,1) 0%, rgba(71,208,185,1) 90%);margin-bottom:15px;} #footer .ft_cs .ft_link_mystore a{display:block;width:100%;height:100%;line-height:50px;font-size:16px;color:#fff;font-weight:500;} #footer .ft_cs .ft_mail {padding:20px 15px;background:#33353a;text-align:center;} #footer .ft_cs .ft_mail li {} #footer .ft_cs .ft_mail li + li {} #footer .ft_cs .ft_mail li dl {} #footer .ft_cs .ft_mail li dt, #footer .ft_cs .ft_mail li dd {text-align:center;display:block;margin:0 auto;padding:0;} #footer .ft_cs .ft_mail li dt {padding-bottom:12px;font-size:17px;line-height:1em;color:#ddd;font-family: 'Jeju Myeongjo', serif;} #footer .ft_cs .ft_mail li dt a{font-size:inherit;color:inherit;font-weight:inherit;line-height:inherit;font-family:inherit;display: inline-block;position: relative;box-sizing:border-box;padding-right:25px;} #footer .ft_cs .ft_mail li dt a.cs_more:before, #footer .ft_cs .ft_mail li dt a.cs_more:after{content: "";display: inline-block;position: absolute;margin: 0;padding: 0;box-sizing: border-box;transition: all 0.3s;} #footer .ft_cs .ft_mail li dt a.cs_more:before{width: 18px;height: 18px;border-radius: 18px;background: rgba(245, 245, 245, 0.6);z-index: 1;right: 0;top: 0;} #footer .ft_cs .ft_mail li dt a.cs_more:after{width: 5px;height: 5px;transform: translate(0, -2px) rotate(45deg);right: 7px;border-width: 1px 1px 0 0;border-style: solid;border-color: #777;top: 50%;box-sizing: border-box;z-index: 2;} #footer .ft_cs .ft_mail li + li dt {padding-top:24px;padding-bottom:6px;} #footer .ft_cs .ft_mail li dd {} #footer .ft_cs .ft_mail li dd p {font-size:13px;line-height:20px;color:#fff;} #footer .ft_cs .ft_mail li dd p span {font-size:inherit;line-height:inherit;color:inherit;font-weight:300;display:inline-block;vertical-align:top;} #footer .ft_cs .ft_mail li dd a {font-size:14px;line-height:20px;color:#fff;} #footer .ft_address {text-align:center;padding:0 0 15px;} #footer .ft_address span, #footer .ft_address em {font-size:14px;line-height:21px;color:#aaa;display:inline-block;vertical-align:top;font-weight:300;} #footer .ft_address span {color:#fff;} #footer .ft_address em {} #footer .ft_address em + span {margin-left:10px;} #footer address {font-size:13px;font-weight:300;line-height:14px;color: rgba(119, 119, 119, 0.8);text-align:center;} #footer .ft_sns {padding:25px 15px;text-align:center;} #footer .ft_sns li {display:inline-block;vertical-align:top;} #footer .ft_sns li:nth-of-type(3){margin-top:2px;} #footer .ft_sns li + li {margin-left:17px;} #footer .ft_sns li a {vertical-align:top;} #footer .ft_sns li img {width:auto;height:21px;vertical-align:top;} #footer .ft_sns li:nth-of-type(2) img {height:19px;} #footer .ft_sns li:nth-of-type(3) img {height:17px;} #footer .ft_button_box {padding:0 15px 38px 15px;} #footer .ft_button_box a {height:45px;font-size:15px;font-weight:300;line-height:43px;color:#ddd;border:solid 1px #55585e;background:none;width:100%;text-align:center;box-sizing:border-box;display:inline-block;} #footer .shortcut {text-align:center; background:#2f2f2f;} #footer .shortcut a {display:block; padding:12px 0 12px 0;} #footer .shortcut a span {position:relative; display:inline-block; color:#e0e0e0; height:36px; line-height:36px; padding:0 0 0 46px; background-size:36px; background-repeat:no-repeat;} #footer .shortcut a span em {color:#ff353b; font-style:normal;} /* 브랜드 검색 버튼 */ .btn_nav_brand_search {position:relative; display:block; padding-left:15px; margin:8px 8px 0 8px;height:46px; line-height:46px; color:#1c1c1c; font-size:16px; font-weight:bold; letter-spacing:-1px; border:1px solid #e6e6e6;} .btn_nav_brand_search:after {position:absolute; top:17px; right:17px; display:inline-block; content:''; width:6.5px; height:12px; background:url('../img/icon/icon_brand_arrow.png') no-repeat 0 0; background-size:6.5px 12px;} /* 증명 마크 로고 영역 */ .foot_certify{padding:15px;text-align:center;box-sizing:border-box;vertical-align:top;} .foot_certify span{display:inline-block;margin-left:-4px;vertical-align:top;} .foot_certify span:first-child{margin-left:0;} .foot_certify img{height:45px; margin:0 7px 15px;} @media only screen and (max-width:360px) { } @media only screen and (max-width:320px) { } /*─────────────────────────────────────────────────────────── 상품진열영역 goods/list ───────────────────────────────────────────────────────────*/ /* 기본형 */ #wrap .goods_list {padding:0;} #wrap .goods_prd_item11 {width:100%;} #wrap .gd_line1 {width:100%;margin-left:0;margin-right:0;} #wrap .gd_line2 {width: calc(100% + 15px);margin-left: -7.5px;margin-right: -7.5px;/* padding: 0 7.5px; */} #wrap .gd_line3 {width: calc(100% + 30px);margin-left:-15px;margin-right:-15px;} #wrap .gd_line4 {width: calc(100% + 30px);margin-left:-15px;margin-right:-15px;} #wrap .goods_list_cont ul li {margin:0;} #wrap .item_cont{padding:0 10px;margin-bottom:62px;text-align:left;color:#1c1c1c;position:relative;z-index:1;} #wrap .gd_line2 .item_cont{padding: 0 7.5px;margin-bottom:35px;} #wrap .gd_line3 .item_cont{padding:0 15px;margin-bottom:31px;} #wrap .gd_line4 .item_cont{padding:0 15px;margin-bottom:30px;} #wrap .icon_time_sale{position:absolute;top:0;left:0;text-align:left;} #wrap .item_photo_box{width:100%;height:0;padding:0;padding-top:122%;display:inline-block !important;overflow:hidden;position:relative;z-index:1;text-align:center;border:0;vertical-align:middle;box-sizing:border-box;} #wrap .item_photo_box > a img {width:100%;display: block;position: absolute;z-index: 1;left: 50% !important;top: 50% !important;transform: translate(-50%, -50%);height: auto;width: auto;max-width: 100%;width: 100%;} #wrap .item_photo_box > a img.middle {display:block;position:absolute;z-index:1;left: 50%;top:50%;transform:translate(-50%, -50%);height:auto;width:auto;max-width:100%;width: 100%;} #wrap .item_photo_box .soldout_img {position:absolute; top:0; left:0; display:block; font-size:0; width:100%; height:100%; z-index:10; background-size:100%; background-position:center; background-repeat:no-repeat;} #wrap .item_photo_box .timesale_img {position:absolute; bottom:0; left:0; width:100%; padding:10px 0 10px 0; background:rgba(0,0,0,.5); z-index:10; color:#ffffff; font-size:12px; text-align:center; box-sizing:border-box;} #wrap .item_photo_box .timesale_img img {width:15px; margin:0 3px 0 0; vertical-align:top;} #wrap .item_photo_box .coupon_img {position:absolute; top:0; right:0; z-index:1;} #wrap .item_photo_box .coupon_img img {width:34px;} #wrap .item_photo_box .add_currency {color:#717171; font-size:12px; font-weight:normal; text-align:right;} #wrap .item_info_cont{padding:15px 0 0 0;font-size:12px;display:block;text-align:left;vertical-align:middle;position:relative;z-index:2;box-sizing:border-box;} #wrap .item_info_cont > a {position:absolute;left:0;top:0;width:100%;height: calc(100% - 72px);display:inline-block;z-index:2;} #wrap .item_tit_box{padding:0;margin:0;overflow:hidden;text-overflow:ellipsis;} #wrap .item_tit_box .item_brand, #wrap .item_tit_box .item_name, #wrap .item_tit_box .item_name_explain {font-size:13px;letter-spacing:-0.65px;font-weight:300;line-height:18px;height:18px;color:#777;white-space:nowrap;word-break:break-all;overflow:hidden;text-overflow:ellipsis;margin:0;padding:0;text-align:left;vertical-align:top;display:block;} #wrap .item_tit_box .item_brand{} #wrap .item_tit_box .item_name{font-size:15px;font-weight:400;line-height:22px;height:22px;color:#333;letter-spacing: -0.75px;word-break:keep-all;} #wrap .item_tit_box .item_name_explain{margin-top:6px;line-height:18px;height:auto;max-height:36px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;} #wrap .item_money_box{margin: 23px 0 0;padding:0;line-height:20px;font-size:15px;letter-spacing:-0.45px;} #wrap .item_money_box span.del, #wrap .item_money_box .item_price, #wrap .item_money_box .item_sale {line-height:inherit;font-size:inherit;display:inline-block;vertical-align:top;margin:0;padding:0;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} #wrap .item_money_box em.won {font-size:12px;letter-spacing:-0.36px;font-weight:inherit;color:inherit;line-height:inherit;display:inline-block;vertical-align:top;margin:0;padding:0;font-style:normal;font-family:'Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} #wrap .item_money_box span.del {margin-left:10px;padding:0 1px;font-size:13px;letter-spacing:-0.65px;font-weight:400;color:#aaa;position:relative;z-index:1;} #wrap .item_money_box span.del:before {width:100%;height:1px;background:#aaa;top:50%;left:0;display:inline-block;position:absolute;content:"";} #wrap .item_money_box span.del .won {} #wrap .item_money_box .item_price {font-weight:500;color:#333;/*font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;*/} #wrap .item_money_box .item_price .won {} #wrap .item_money_box .item_price .won.opt_volume {margin:0 0 0 5px;} #wrap .item_money_box .item_sale {} #wrap .item_money_box .item_price .time_sale_cost{display:inline-block; padding:7px 0 5px 20px; font-size:16px; background:url('../img/icon/goods_icon/icon_time_sale_cost.png') no-repeat left 7px;} #wrap .item_money_box .item_price .time_sale_cost_r{display:inline-block; padding-top:5px; font-size:16px;} #wrap .item_money_box .item_price .time_sale_text{display:inline-block; padding:7px 0 5px 20px; font-size:11px; background:url('../img/icon/goods_icon/icon_time_sale_cost.png') no-repeat left 7px; color:#888888} #wrap .item_money_box .item_sale .icon_item_coupon{margin:10px 0 0 0;} #wrap .item_money_box .item_sale .icon_item_coupon img{vertical-align:middle;} #wrap .item_money_box .item_mileage{display:block; padding:5px 0 5px 0; line-height:1.5; background:none;} #wrap .item_money_box .item_mileage img{vertical-align:middle;} #wrap .item_money_box .soldout_img {display:none;vertical-align:middle;} #wrap .item_number_box{font-size:11px; color:#a8a8a8;} #wrap .item_number_box .num_model{display:block;} #wrap .item_number_box .num_code{display:block;} #wrap .item_icon_box{margin: 10px 0 0;line-height:16px;min-height:16px;padding:0;font-size:0;vertical-align:top;} #wrap .item_icon_box:empty {min-height:auto;margin:0;} #wrap .item_icon_box img{display:inline-block;vertical-align:top;padding:0;margin:0;width:auto;height:auto;max-height:16px;} #wrap .item_icon_box img + img {margin-left:4px;} #wrap .item_link.btn_area {padding:16px 0 0 0;font-size:0;margin:0;vertical-align:middle;font-size:0;} #wrap .item_link.btn_area li {display:inline-block;padding:0;margin:0;vertical-align:middle;} #wrap .item_link.btn_area li + li {margin-left:12px;} #wrap .item_link.btn_area li input[type="button"], #wrap .item_link.btn_area li a {width:22px;height:19px;line-height:17px;font-size:0 !important;padding:0 !important;margin:0 !important;border:0 !important;outline:0 !important;background-color:inherit !important;background-repeat:no-repeat !important;background-position:50% 50% !important;font-size:0;box-sizing:border-box;} /* 위시리스트 */#wrap .related_wish_btn {width:17px;background-image:url('../img/da_image/icon_basket_get.png');background-size:19px auto;} /* 장바구니 */#wrap .related_cart_btn {width:20px;background-image:url('../img/da_image/icon_basket_cart.png');background-size:22px auto;} /*구매하기 */#wrap .related_buy_btn {background-image:url('../img/da_image/icon_basket_buy.png');background-size:22px auto;} #wrap .item_photo_box .item_link{height:40px;line-height:40px;bottom:20px;width: calc(100% - 40px);left:50%;transform:translateX(-50%);position:absolute;text-align:center;z-index:10;background:none;vertical-align:top;font-size:0;} #wrap .btn_basket_go, #wrap .btn_basket_get, #wrap .btn_basket_cart {width:40px;height:40px;line-height:40px;border-radius:40px;background:rgba(22, 30, 37, 0.5);margin:0;margin-left:5px;display:inline-block;vertical-align:top;padding:0;box-sizing:border-box;outline:0;border:0;text-align:Center;position:relative;z-index:1;overflow:hidden;white-space:nowrap;transition:all 0.3s;} /* #wrap .btn_basket_go:hover, #wrap .btn_basket_get:hover, #wrap .btn_basket_cart:hover {background:rgba(22, 30, 37, 0.8);} */ #wrap .btn_basket_go span, #wrap .btn_basket_get span, #wrap .btn_basket_cart span {font-size:15px;letter-spacing:-0.75px;font-weight:400;color:#fff;display:inline-block;height:inherit;line-height:inherit;border-radius:inherit;vertical-align:top;margin:0 auto;padding:0;box-sizing:border-box;position:relative;z-index:2;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} #wrap .btn_basket_get span img, #wrap .btn_basket_cart span img {margin:0;margin-top:12px;display:inline-block;vertical-align:top;padding:0;} #wrap .btn_basket_cart span img {margin-left:-2px;} #wrap .btn_basket_go {width: calc(100% - 90px) !important;margin-left:0;} #wrap .btn_basket_go img {display:none;} #wrap .btn_basket_get {} #wrap .btn_basket_get span{} #wrap .btn_basket_cart{} #wrap .btn_basket_cart span{} /* 분류 추천 */ #wrap .best_item_view .gd_sld {width:100%;margin:0 0 45px;} #wrap .best_item_view .gd_sld .item_cont {padding:0;margin:0;} #wrap .best_item_view .gd_sld .slick-slide {position:relative;} #wrap .best_item_view .item_photo_box{padding-top: 122%;} #wrap .best_item_view .item_photo_box .item_link {width:50px;height:auto;line-height:50px;bottom:auto;top:30px;left:auto;right:30px;transform: translateX(0);} #wrap .best_item_view .btn_basket_go, #wrap .best_item_view .btn_basket_get, #wrap .best_item_view .btn_basket_cart {width:50px;height:50px;line-height:50px;border-radius:50px;margin-left:0;margin-top:10px;} #wrap .best_item_view .btn_basket_get span img, #wrap .best_item_view .btn_basket_cart span img, #wrap .best_item_view .btn_basket_go img {margin-top:17px;} #wrap .best_item_view .btn_basket_go {width:50px;} #wrap .best_item_view .btn_basket_go img {display:inline-block;} #wrap .best_item_view .btn_basket_go span {display:none;} #wrap .best_item_view .item_info_cont{padding: 20px;position:absolute;left:50%;transform:translateX(-50%);background: rgba(255, 255, 255, 0.6);} #wrap .best_item_view .item_info_cont > a {height:100%;} #wrap .best_item_view .gd_sld .item_info_cont{bottom:26px;width: calc(100% - 30px);text-align:left;} #wrap .best_item_view .gd_line3 .item_info_cont{bottom:15px;width: calc(100% - 30px);} #wrap .best_item_view .gd_line4 .item_info_cont{bottom:15px;width: calc(100% - 30px);} #wrap .best_item_view .item_tit_box .item_name{font-size: 18px;font-weight:500;line-height: 18px;height:27px;letter-spacing: -1.25px;text-align:left !important;} #wrap .best_item_view .item_tit_box .item_name_explain {margin-top: 3px;color:#555;font-size: 15px;line-height: 21px;max-height: 40px;letter-spacing: -0.75px;} #wrap .best_item_view .item_money_box{line-height:22px;margin-top: 15px;font-size: 17px;letter-spacing:-0.4px;} #wrap .best_item_view .item_money_box .item_price {font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif !important;} #wrap .best_item_view .item_money_box em.won {font-size: 13px;font-weight:400;letter-spacing:-0.32px;} #wrap .best_item_view .item_icon_box {display:none;} #wrap .best_item_view .item_link.btn_area {position:absolute;top:15px;right:15px;padding:0;width:40px;z-index:1;} #wrap .best_item_view .item_link.btn_area li {width:40px;height:40px;border-radius:100%;display:block;background:rgba(22,30,37,0.5);position: relative;} #wrap .best_item_view .item_link.btn_area li + li {margin:10px 0 0;} #wrap .best_item_view .item_link.btn_area li input[type="button"], #wrap .best_item_view .item_link.btn_area li a {background-color: transparent !important;top: 50%;left: 50%;position: absolute;transform: translate(-50%,-50%);} #wrap .best_item_view .item_link.btn_area li .related_buy_btn {background-image:url('../img/da_image/icon_basket_buy_ov.png');background-size:16px auto;} #wrap .best_item_view .item_link.btn_area li .related_cart_btn {background-image:url('../img/da_image/icon_basket_cart_ov.png');background-size:16px auto;} #wrap .best_item_view .item_link.btn_area li .related_wish_btn {background-image:url('../img/da_image/icon_basket_get_ov.png');background-size:15px auto;} #wrap .best_item_view .slick-dots {width:100%;position:absolute;text-align:center;bottom:12px;} #wrap .best_item_view .slick-dots li {display:inline-block;} #wrap .best_item_view .slick-dots li + li {margin-left:10px;} #wrap .best_item_view .slick-dots li button {width:4px;height:4px;border-radius:100%;background:#cccccc;opacity:0.8;border:0;padding:0;} #wrap .best_item_view .slick-dots li.slick-active button {width:6px;height:6px;background:#333333;opacity:1;} /* 분류기본형 */ #wrap .goods_list {} #wrap .goods_list .item_info_cont {text-align:center;} #wrap .goods_list .item_info_cont .item_tit_box .item_name {font-size:16px;letter-spacing:-0.8px;text-align:center;} #wrap .goods_list .item_info_cont .item_tit_box .item_name_explain {font-size:14px;line-height:21px;letter-spacing:-0.7px;max-height:40px;} #wrap .goods_list .item_info_cont .item_tit_box .item_name_explain br{display: none;} #wrap .goods_list .item_info_cont .item_money_box {font-size:16px;margin-top:13px;} #wrap .goods_list .item_info_cont .item_money_box .item_price {letter-spacing:-0.48px;font-family:'Roboto','Noto Sans KR';} #wrap .goods_list .item_info_cont .item_money_box span.del {font-size:14px;letter-spacing:-0.7px;} #wrap .goods_list .btn_box {padding:10px 0;} /* 메인 탭형 */ #wrap .main_tab_wrap .item_cont{padding:0 8px 44px;margin-bottom:0;} #wrap .main_tab_wrap .item_photo_box{padding-top:122.3%;} #wrap .main_tab_wrap .item_info_cont{padding-top:17px;text-align: center;} #wrap .main_tab_wrap .item_tit_box .item_name{font-size:16px;font-weight:500;line-height:20px;height:20px;letter-spacing: -0.8px;text-align: center;} #wrap .main_tab_wrap .item_tit_box .item_name_explain {margin-top:10px;color:#555;text-align: center;} #wrap .main_tab_wrap .item_money_box{line-height:18px;margin-top:18px;font-size:16px;letter-spacing:-0.48px;} #wrap .main_tab_wrap .item_money_box em.won {font-size:12px;letter-spacing:-0.36px;} #wrap .main_tab_wrap .item_money_box span.del {margin-left:8px;padding:0 1px;font-size:14px;letter-spacing:-0.7px;} #wrap .main_tab_wrap .item_money_box span.del em.won {letter-spacing:-0.6px;} #wrap .main_tab_wrap .item_money_box .item_price + .soldout_img {margin-left:8px;} #wrap .main_tab_wrap .item_money_box .soldout_img + span.del {margin-left:0;display:none;} #wrap .main_tab_wrap .item_link.btn_area {padding-top:24px;} /* 메인 추천 */ #wrap .main_recommend_wrap .item_cont{padding:0;margin:0;width:100%;display:table;table-layout:fixed;} #wrap .main_recommend_wrap .item_cont .item_photo_box, #wrap .main_recommend_wrap .item_cont .item_info_cont {display:table-cell !important;vertical-align:middle;box-sizing:border-box;} #wrap .main_recommend_wrap .item_photo_box {padding-top:0;height:auto;width:46.4%;} #wrap .main_recommend_wrap .item_cont .item_info_cont {padding-top:69px;padding-bottom:23px;padding-left:20px;padding-right:15px;height:225px;width:auto;vertical-align:top;} #wrap .main_recommend_wrap .item_tit_box .item_name {font-size:15px;font-weight:400;line-height:22px;height:22px;color:#333;letter-spacing: -0.75px;} #wrap .main_recommend_wrap .item_tit_box .item_name_explain {font-size:13px;letter-spacing:-0.65px;font-weight:300;line-height:18px;margin-top:6px;height:auto;max-height:36px;} #wrap .main_recommend_wrap .item_money_box{margin-top:17px;line-height:20px;font-size:15px;letter-spacing:-0.45px;} #wrap .main_recommend_wrap .item_money_box .soldout_img {display:inline-block;} #wrap .main_recommend_wrap .item_icon_box {display:none;} #wrap .main_recommend_wrap .item_money_box em.won {font-size:12px;letter-spacing:-0.36px;} #wrap .main_recommend_wrap .item_money_box span.del {margin-left:10px;padding:0 1px;font-size:13px;letter-spacing:-0.65px;} #wrap .main_recommend_wrap .item_money_box .item_price + .soldout_img {margin-left:10px;} #wrap .main_recommend_wrap .item_money_box .soldout_img + span.del {margin-left:0;display:none;} #wrap .main_recommend_wrap .rcmd_slide .slick-arrow {width:40px;height:40px;top: 50%;background: none;position:absolute;transform: translateY(-75%);z-index:6;font-size:0;display:inline-block;vertical-align:top;margin:0;padding:0;border:0;border-radius:100%;outline:0;font-size:0;opacity:1;transition:all 0.3s;} #wrap .main_recommend_wrap .rcmd_slide .slick-arrow:before {width:8px;height:8px;border-width: 1px 1px 0 0;left:50%;top:50%;position:absolute;border-style:solid;box-sizing:border-box;border-color: #aaa;display:inline-block;content:"";} #wrap .main_recommend_wrap .rcmd_slide .slick-arrow.slick-prev {left:-8px;} #wrap .main_recommend_wrap .rcmd_slide .slick-arrow.slick-next {right:-8px;} #wrap .main_recommend_wrap .rcmd_slide .slick-arrow.slick-prev:before {transform:translate(-25%, -50%) rotate(-135deg);} #wrap .main_recommend_wrap .rcmd_slide .slick-arrow.slick-next:before {transform:translate(-75%, -50%) rotate(45deg);} #wrap .main_recommend_wrap .rcmd_slide .slick-arrow.slick-disabled {opacity:0;cursor:inherit;} /* 리스트형 goods/list/list_02.html (pc 리스트그룹형과 동일) */ #wrap .goods_prd_item {padding:0;margin:0;border:0;vertical-align:top;width:100%;} #wrap .goods_prd_item + .goods_prd_item {margin-top:44px;} #wrap .goods_prd_item .goods_prd_img {display:table-cell;width:110px;vertical-align:top;text-align:center;} #wrap .goods_prd_item .goods_prd_img .img_box {position:relative;} #wrap .goods_prd_item .goods_prd_img .img_box .img {font-size:0;line-height:0;} #wrap .goods_prd_item .goods_prd_img .img_box .img img {width:100%;height:auto;border:0;box-sizing:border-box;} #wrap .goods_prd_item .goods_prd_content {padding:0 0 0 15px;display:table-cell;vertical-align:top;width:auto;text-align:left;} #wrap .goods_prd_item .goods_prd_content a {} #wrap .goods_prd_item .goods_prd_content .goods_prd_icon {font-size:16px;} #wrap .goods_prd_item .goods_prd_content .goods_prd_soldout {padding:2px 0 2px 0;} #wrap .goods_prd_item .goods_prd_content .goods_prd_soldout img {height:18px;} #wrap .goods_prd_item .goods_prd_content .goods_info_list {} #wrap .goods_prd_item .goods_prd_content .goods_info_list li {font-size:14px;font-weight:300;letter-spacing:-0.7px;color:#666;padding:0;margin:0;word-break:break-all;} #wrap .goods_prd_item .goods_prd_content .goods_info_list li.item_tag {font-size:0;vertical-align:top;width:calc(100% + 6px);margin-left:-6px;} #wrap .goods_prd_item .goods_prd_content .goods_info_list li.item_tag span {font-size:14px;line-height:18px;letter-spacing:inherit;color:#333;font-weight:400;display:inline-block;padding:0 1px;position:relative;z-index:1;vertical-align:top;margin:0 6px 6px 6px;} #wrap .goods_prd_item .goods_prd_content .goods_info_list li.item_tag span:before {height:5px;width:100%;z-index:-1;position:absolute;left:0;bottom:0;opacity:0.2;display:inline-block;content:"";} #wrap .goods_prd_item .goods_prd_content .goods_info_list li.item_name{font-size:20px;line-height:27px;height:auto;max-height:54px;color:#222;letter-spacing: -1.0px;font-weight:400;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;overflow:hidden;text-overflow:ellipsis;word-break:keep-all;margin-top:4px;} /* #wrap .goods_prd_item .goods_prd_content .goods_info_list li.item_tag + .item_name {margin-top:10px;} */ #wrap .goods_prd_item .goods_prd_content .goods_info_list li.item_name + .item_name_explain {margin-top:9px;} #wrap .goods_prd_item .soldout_img {position:absolute; top:0; left:0; display:block; font-size:0; width:100%; height:100%; z-index:10; background-size:60%; background-position:center; background-repeat:no-repeat;opacity:0.5;} #wrap .goods_prd_item .timesale_img {position:absolute; bottom:0; left:0; width:100%; padding:10px 0 10px 0; background:rgba(0,0,0,.5); z-index:10; color:#ffffff; font-size:12px; text-align:center;} #wrap .goods_prd_item .timesale_img img {width:15px; margin:0 3px 0 0; vertical-align:top; } #wrap .goods_prd_item .coupon_img {position:absolute; top:0; right:0; z-index:1;} #wrap .goods_prd_item .coupon_img img {width:34px;} #wrap .goods_prd_item .add_currency {color:#717171; font-size:12px; font-weight:normal; text-align:right;} /* 베스트 */ #wrap .sale_tab_wrap .goods_prd_item {} #wrap .sale_tab_wrap .goods_prd_item:after {clear:both;content:"";display:block;} #wrap .sale_tab_wrap .goods_prd_item .goods_prd_img, #wrap .sale_tab_wrap .goods_prd_item .goods_prd_content {display:block;box-sizing:border-box;} #wrap .sale_tab_wrap .goods_prd_item .goods_prd_img, #wrap .sale_tab_wrap .goods_prd_item .goods_prd_content {float:left;} #wrap .sale_tab_wrap .goods_prd_item:nth-of-type(even) .goods_prd_img {float:right;} #wrap .sale_tab_wrap .goods_prd_item .goods_prd_content {width: calc(100% - 110px);} #wrap .sale_tab_wrap .goods_prd_item:nth-of-type(even) .goods_prd_content {padding-left:0;padding-right:15px;text-align:right;} #wrap .sale_tab_wrap .goods_prd_item .goods_prd_content .goods_info_list {text-align:left;} #wrap .sale_tab_wrap .goods_prd_item:nth-of-type(even) .goods_prd_content .goods_info_list {text-align:right;} #wrap .sale_tab_wrap .goods_prd_item .goods_prd_content .goods_info_list li.item_tag.tag_loss span:before {background-color:#495590;}/*탈모*/ #wrap .sale_tab_wrap .goods_prd_item .goods_prd_content .goods_info_list li.item_tag.tag_dry span:before {background-color:#3b9998;}/*건성*/ #wrap .sale_tab_wrap .goods_prd_item .goods_prd_content .goods_info_list li.item_tag.tag_nutri span:before {background-color:#ddd;opacity:1;}/*영양*/ #wrap .sale_tab_wrap .goods_prd_item .goods_prd_content .goods_info_list li.item_tag.tag_oily span:before {background-color:#c6d1bd;opacity:0.5;}/*지성*/ #wrap .sale_tab_wrap .goods_prd_item .goods_prd_content .goods_info_list .item_gd_eventsale {display:block;} #wrap .sale_tab_wrap .goods_prd_item .goods_prd_content .goods_info_list li.item_money_box, #wrap .sale_tab_wrap .goods_prd_item .goods_prd_soldout {display:none;} #wrap .sale_tab_wrap .goods_info_list .item_volume {margin:10px 0 0;padding:0;font-size:0;vertical-align:top;text-align:inherit;} #wrap .sale_tab_wrap .goods_info_list .item_volume > li {vertical-align:top;margin:0;padding:0 0 0 8px;position:relative;z-index:1;display:block;text-align:inherit;line-height:24px;} #wrap .sale_tab_wrap .goods_info_list .item_volume > li + li {} #wrap .sale_tab_wrap .goods_info_list .item_volume > li:before {background:#aaa;width:3px;height:3px;border-radius:100%;margin:11px 3px 11px 0;display:inline-block;content:"";vertical-align:top;} #wrap .sale_tab_wrap .goods_prd_item:nth-of-type(even) .goods_info_list .item_volume > li:before {} #wrap .sale_tab_wrap .goods_info_list .item_volume li span, #wrap .sale_tab_wrap .goods_info_list .item_volume li strong, #wrap .sale_tab_wrap .goods_info_list .item_volume li em {line-height:25px;font-weight:400;display:inline-block;vertical-align:top;margin:0;padding:0;} #wrap .sale_tab_wrap .goods_info_list .item_volume li span {margin-right:11px;font-size:14px;color:#555;font-family: 'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} #wrap .sale_tab_wrap .goods_info_list .item_volume li strong {font-size:16px;font-weight:500;letter-spacing:-0.3px;color:#1b253c;font-family: 'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} #wrap .sale_tab_wrap .goods_info_list .item_volume li em {font-size:12px;letter-spacing:-0.24px;color:#333;} #wrap .sale_tab_wrap .goods_prd_item .btn_go.btn_self_go {margin:15px auto 0;width:140px;font-size:15px;font-weight:500;display:inline-block !important;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;letter-spacing:0;} @media only screen and (max-width:360px) { } @media only screen and (max-width:320px) { #wrap .goods_prd_item .goods_prd_content {padding-left:10px;} #wrap .sale_tab_wrap .goods_prd_item:nth-of-type(even) .goods_prd_content {padding-right:10px;} #wrap .item_cont{padding:0 10px;} #wrap .gd_line2 {width: calc(100% + 10px);margin-left:-5px;margin-right:-5px;} #wrap .gd_line2 .item_cont{padding: 0 5px;} } /*─────────────────────────────────────────────────────────── 메인 main/index ───────────────────────────────────────────────────────────*/ /* 일반 - 375 */ /* 타이틀 그라데이션 */ h3.title_gr {letter-spacing:-1.0px;font-size:30px;line-height:34px;font-weight:500;font-style:italic;margin:0 auto;padding:0;text-align:center;display:block;user-select: none;font-family:'Trirong','Jeju Myeongjo',serif;} h3.title_gr span {font-size:inherit;line-height:inherit;font-weight:inherit;background: linear-gradient(120deg, rgba(29,111,194,1) 35%, rgba(71,208,185,1) 70%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;font-family:inherit;} .main_video_wrap h3.title_gr {letter-spacing:-1.0px;line-height:34px;text-align:center;box-sizing:border-box;} p.title_tag {font-size:16px;font-weight:400;color:#222;line-height:22px;margin-bottom:17px;font-family:'Jeju Myeongjo',serif;} p.title_tag span {font-size:inherit;line-height:inherit;font-weight:inherit;font-family:inherit;display:inline-block;} p.title_tag span + span {margin-left:15px;} p.title_txt {font-size:14px;line-height:20px;font-weight:400;color:#333;margin:0 auto;padding:0;text-align:center;display:block;font-family:'Jeju Myeongjo',serif;} h3.title_gr + p.title_txt {margin-top:16px;} /* 메인 비주얼 */ .main_visual_wrap {position:relative;z-index:1;} .main_visual .slide_cut {position:relative;z-index:1;outline:0;text-align:center;outline:0;} .main_visual .slide_cut img {width:100%;height:auto;vertical-align:top;} .main_visual_wrap .slideController {height:2px;line-height:2px;bottom:20px;padding:0;font-size:0;transform:translateX(-50%);width:56%;position:absolute;z-index:3;left:50%;text-align:left;} .main_visual_wrap .slideController > span {display:none !important;font-size:16px;letter-spacing:-0.32px;color:#fff;height:inherit;line-height:inherit;vertical-align:top;font-family: 'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .main_visual_wrap .slideController > span.slideCountItem {opacity:1;} .main_visual_wrap .slideController > span.slideCountAll {opacity:0.5;} .main_visual_wrap .slideController .progress {margin:0px;width:100%;height:2px;font-size:0;border-radius:0;overflow:hidden;background: rgba(255, 255, 255, 0.5);background-image: linear-gradient(to right, #fff, #fff);background-repeat:no-repeat;background-size:0 100%;display:inline-block !important;vertical-align:top;position:static;bottom:0;left:0;transition: background-size .4s ease-in-out;} .main_visual_wrap .slideController .progress > span {display:inline-block;height:2px;margin:0;padding:0;} .main_visual_wrap .slideController .progress > span.sr-only {background: rgba(255, 255, 255, 1);opacity:1;transition:all 0.3s;position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0;} .main_visual_wrap .slideController .slick-arrow {display:none !important;width:22px;border-radius:22px;background: rgba(255, 255, 255, 0.5);outline:0;border:0;height:inherit;line-height:inherit;vertical-align:top;position:relative;z-index:1;left:auto;right:auto;top:0;transform:translate(0, 0);margin:0;} .main_visual_wrap .slideController .slick-arrow:before {width:5px;height:5px;border-width:2px 2px 0 0;border-style:solid;border-color:#777;box-sizing:border-box;position:absolute;left:50%;top:50%;background:none;display:inline-block;content:"";} .main_visual_wrap .slideController .slick-arrow.on {background: rgba(255, 255, 255, 1);} .main_visual_wrap .slideController .slick-arrow.slick-prev {margin-left:20px;} .main_visual_wrap .slideController .slick-arrow.slick-next {margin-left:10px;} .main_visual_wrap .slideController .slick-arrow.slick-prev:before {transform:translate(-50%, -50%) rotate(-135deg);} .main_visual_wrap .slideController .slick-arrow.slick-next:before {transform:translate(-50%, -50%) rotate(45deg);} /* 베스트 프로덕트 */ .main_tab_wrap {padding-top:42px;position:static;text-align:center;} .main_tab_wrap h3 {} .main_tab_wrap .gd_tab_txt {padding-top:20px;padding-bottom:14px;padding-left:15px;padding-right:15px;box-sizing:border-box;text-align:center;vertical-align:top;margin:0 auto;} .main_tab_wrap .gd_tab_txt li {font-size:15px;font-weight:400;line-height:35px;border-radius:35px;letter-spacing:-0.75px;color:#888;margin:0;padding:0;text-align:center;display:inline-block;vertical-align:top;box-sizing:border-box;cursor:pointer;} .main_tab_wrap .gd_tab_txt li + li {margin-left:10px;} .main_tab_wrap .gd_tab_txt li span {line-height:35px;padding:0 20px;border-radius:35px;background:#eee;font-size:inherit;color:inherit;font-weight:inherit;display:inline-block;vertical-align:top;box-sizing:border-box;position:relative;z-index:1;} .main_tab_wrap .gd_tab_txt li.on {color:#222;} .main_tab_wrap .gd_tab_txt li.on span {background:#2d3348;color:#fff;} .main_tab_wrap .gd_tab_txt li.on span:after {border-top:4px solid transparent;border-right:4px solid #2d3348;border-bottom:4px solid transparent;transform:translateX(-50%) rotate(-90deg);left:50%;bottom:-6px;position:absolute;width:0px;height:0px;display:inline-block;content:"";} .main_tab_wrap .clear {position:relative;} .main_tab_wrap .clear > .tab_bnr {left:0;top:84px;width:100%;text-align:center;vertical-align:top;overflow:hidden;position:absolute;z-index:1;} .main_tab_wrap .clear > .tab_bnr .slick-dots {left:15px;bottom:50px;text-align:left;display:inline-block;width:auto;margin:0;font-size:0;vertical-align:top;z-index:5;position:absolute;} .main_tab_wrap .clear > .tab_bnr .slick-dots li, .main_tab_wrap .clear > .tab_bnr .slick-dots button {font-size:0;margin:0;padding:0;border:0;outline:0;display:inline-block;vertical-align:top;opacity:1;transition:all 0.3s;} .main_tab_wrap .clear > .tab_bnr .slick-dots li {width:6px;height:6px;line-height:6px;position:relative;z-index:1;} .main_tab_wrap .clear > .tab_bnr .slick-dots li + li {margin-left:10px;} .main_tab_wrap .clear > .tab_bnr .slick-dots li button {width:6px;height:6px;border-radius:100%;background:#ccc;opacity:1;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%) scale(0.65, 0.65);} .main_tab_wrap .clear > .tab_bnr .slick-dots li.slick-active {} .main_tab_wrap .clear > .tab_bnr .slick-dots li.slick-active button {transform:translate(-50%, -50%) scale(1, 1);background:#fff;opacity:1;} .main_tab_wrap .clear > .gd_tab_wrap {width:1030px;float:right;margin:0;} .main_tab_wrap .gd_tab_wrap {margin:0 auto;} .main_tab_wrap .gd_tab_wrap .gd_tab_box {width:100%;margin:0 auto;padding:0;height:0;overflow:hidden;} .main_tab_wrap .gd_tab_wrap .gd_tab_box.on {height:auto;overflow:inherit;} .main_tab_wrap .gd_sm_tab {padding:0;text-align:center;vertical-align:top;margin:0 auto;width:auto;max-width:100%;text-align:center;display:inline-block;box-sizing:border-box;font-size:0;} .main_tab_wrap #gd01 .gd_sm_tab {max-width:340px;} .main_tab_wrap #gd02 .gd_sm_tab {max-width:310px;} .main_tab_wrap .gd_sm_tab li {font-size:14px;line-height:30px;letter-spacing:-0.7px;font-weight:300;color:#888;margin:0 8px 6px 8px;padding:0;text-align:center;display:inline-block;vertical-align:top;box-sizing:border-box;cursor:pointer;} /* .main_tab_wrap .gd_sm_tab li + li {margin-left:16px;} */ /* .main_tab_wrap #gd01 .gd_sm_tab li:nth-of-type(3n + 1) {margin-left:0;} .main_tab_wrap #gd02 .gd_sm_tab li:nth-of-type(4n + 1) {margin-left:0;} */ .main_tab_wrap .gd_sm_tab li span {line-height:28px;padding:0 2px 2px;font-size:inherit;color:inherit;font-weight:inherit;display:inline-block;vertical-align:top;box-sizing:border-box;position:relative;z-index:1;} .main_tab_wrap .gd_sm_tab li.on {color:#222;font-weight:500;} .main_tab_wrap .gd_sm_tab li.on span {} .main_tab_wrap .gd_sm_tab li.on span:before {height:2px;background:#000;width:100%;position:absolute;left:0;bottom:0;display:inline-block;content:"";} .main_tab_wrap .sm_tab_wrap {padding:12px 0 0;margin:0 auto;position: relative;z-index:1;} .main_tab_wrap .sm_tab_wrap .sm_tab_box {width:100%;margin:0 auto;padding:0;height:0;overflow:hidden;} .main_tab_wrap .sm_tab_wrap .sm_tab_box.on {height:auto;overflow:inherit;} .main_tab_wrap .tab_box_clear {} .main_tab_wrap .tab_bnr {width:100%;text-align:center;vertical-align:top;} .main_tab_wrap .tab_bnr img {width:auto;height:auto;max-width:100%;vertical-align:top;} .main_tab_wrap .tab_pr_slide_wrap {width: calc(100% - 15px);padding:15px 0 0 0;margin:-35px 0 0 15px;position:relative;z-index:1;box-sizing:border-box;background:#fff;} .main_tab_wrap .tab_pr_slide {width:100%;padding:0;margin:0;box-sizing:border-box;} .main_tab_wrap .tab_pr_slide .slick-list {padding-left:8px;padding-right:8px;box-sizing:border-box;} .main_tab_wrap .tab_pr_slide .slide_cut {} .main_tab_wrap .tab_pr_slide .item_photo_box {} .main_tab_wrap .tab_pr_slide .item_info_cont {} .main_tab_wrap .slide_cut {text-align:center;outline:0;} .main_tab_wrap .btn_review_more {margin-top:22px;} /* 스크롤바 */ #wrap .main_tab_wrap .progress {background-color:#ddd;background-image: linear-gradient(to right, #333, #333);background-repeat: no-repeat;background-size:0 100%;transition: background-size .4s ease-in-out;width: calc(100% - 30px);height:2px;border-radius:0;display:block;overflow:hidden;margin:0 auto;} #wrap .main_tab_wrap .sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip: rect(51,51,51,0);border:0;} /* 두피테스트 */ .main_oneTest_wrap {margin:0;} .main_oneTest_wrap .oneTest_start {padding:49px 0 0;position:relative;z-index:1;} .oneTest_start .start_wrpper {padding:44px 15px 0;position:relative;z-index:2;background:url(../img/da_image/bg_onetest_start.jpg) no-repeat 50% 0;background-size:cover;text-align:center;box-sizing:border-box;} .oneTest_start .start_txt {width:100%;text-align:center;} .oneTest_start .start_txt:after {transform:translate(0, 100%) scale(1, 1);background: linear-gradient(0deg, #222, #555);background-size:100% 300%;animation: gradient 3s linear infinite;height:55px;width:1px;left:50%;position:absolute;bottom:-25px;display:inline-block;content:"";} .oneTest_start .start_txt h3, .oneTest_start .start_txt p, .oneTest_start .start_txt .btn_start {margin:0;padding:0;box-sizing:border-box;text-align:center;vertical-align:top;} .oneTest_start .start_txt h3, .oneTest_start .start_txt p {display:block;} .oneTest_start .start_txt h3 {font-size:27px;line-height:33px;letter-spacing:-1.35px;font-weight:300;color:#222;} .oneTest_start .start_txt h3 strong {font-size:inherit;font-weight:700;color:inherit;line-height:inherit;} .oneTest_start .start_txt p {margin-top:12px;margin-bottom:275px;font-size:14px;letter-spacing:-0.7px;font-weight:300;line-height:21px;color:#555;} .oneTest_start .start_txt p span.count_num {font-size:inherit;font-weight:700;color:#222;line-height:inherit;} .oneTest_start .start_txt .btn_start {width:120px;height:40px;border-radius:40px;line-height:38px;border:1px #222 solid;font-size:15px;letter-spacing:-0.75px;font-weight:400;background:#222;color:#fff;margin:0 auto;position:relative;z-index:1;overflow:hidden;display:inline-block;} .oneTest_start .start_txt .btn_start:before {width:0;background:#fff;height:100%;z-index:1;position:absolute;display:inline-block;content:"";left:0;top:0;transition:all 0.3s;} .oneTest_start .start_txt .btn_start span {display:inline-block;font-size:inherit;font-weight:inherit;color:inherit;height:48px;line-height:inherit;border-radius:inherit;width:100%;position:relative;z-index:2;} @keyframes gradient { 0% {transform:translate(0, 100%) scale(1, 1);background-position:0% 0%;} 50% {transform:translate(0, 100%) scale(1, 1.1);background-position:0% 100%;} 100% {transform:translate(0, 100%) scale(1, 1);background-position:0% 0%;} } .main_oneTest_wrap .oneTest_txt {font-size:15px;letter-spacing: -0.75px;font-weight:300;color:#222;line-height:22px;padding:103px 0 0;text-align:center;} .oneTest_txt strong {font-weight:700;font-size:inherit;line-height:inherit;color:inherit;} .oneTest_txt + .oneTest_txt {padding-top:14px;} .oneTest_store {width:100%;margin:0;padding:25px 15px 50px;position:relative;z-index:1;box-sizing:border-box;} .oneTest_store:before {height:160px;width:100%;z-index:1;left:0;bottom:0;background:#f5f5f5;display:inline-block;position:absolute;content:"";} .gd_sale_bnr + .oneTest_store {padding-top:52px;} .gd_sale_bnr + .oneTest_store:after {width:1px;height:55px;background:#282828;left:50%;top:-30px;display:inline-block;content:"";position:absolute;} .gd_sale_bnr + .oneTest_store h3 {margin-bottom:26px;font-size:18px;font-weight:300;letter-spacing:-0.95px;line-height:26px;text-align:center;color:#222;} .gd_sale_bnr + .oneTest_store h3 b {font-size:20px;line-height:26px;font-weight:500;margin-bottom:7px;letter-spacing:-1px;display:inline-block;margin-left:auto;margin-right:auto;position:relative;z-index:1;} .gd_sale_bnr + .oneTest_store h3 b:after {opacity: 0.2;background-color: #bb9284;height:7px;width:100%;bottom:0;left: 0;position: absolute;display: inline-block;content: "";z-index: -1;} .oneTest_store ul {z-index:2;position:relative;margin:0 auto;vertical-align:top;font-size:0;text-align:center;} .oneTest_store li {margin:0;padding:62.1% 0 0;height:0;width: calc(50% - 8px);overflow:hidden;display:inline-block;vertical-align:top;position:relative;z-index:1;} .oneTest_store li + li {margin-left:16px;} .oneTest_store li:nth-of-type(1) {background:url(../img/da_image/bg_onetest01.png) no-repeat 50% 50%;background-size:100%;} .oneTest_store li:nth-of-type(2) {background:url(../img/da_image/bg_onetest02.png) no-repeat 50% 50%;background-size:100%;} .oneTest_store li > a {position:absolute;left:0;top:0;display:block;width:100%;height:100%;z-index:3;} .oneTest_store li .txt {position:absolute;left:50%;top:50%;transform:translate(-50%, -42%);width:100%;z-index:1;transition:all 0.3s;} .oneTest_store li .txt h4, .oneTest_store li .txt p, .oneTest_store li .txt span {color:#fff;} .oneTest_store li .txt h4, .oneTest_store li .txt p {margin:0;padding:0;} .oneTest_store li .txt h4 {} .oneTest_store li .txt h4 strong {margin-top:0;margin-bottom:14px;font-size:23px;line-height:30px;letter-spacing:-1.15px;font-weight:500;display:block;} .oneTest_store li .txt p {margin-bottom:12px;font-size:13px;font-weight:300;line-height:19px;transition:all 0.3s;letter-spacing:-0.95px;} .oneTest_store li .txt p span {font-size:inherit;font-weight:inherit;line-height:inherit;display:block;} .oneTest_store li .txt .btn_review_more {} .oneTest_store li .txt .btn_review_more span {} .oneTest_store li .txt .btn_review_more span:before {background:rgba(255, 255, 255, 0.3);} .oneTest_store li .txt .btn_review_more span:after {border-color:#fff;opacity:0.6;} /* 비디오 슬라이드 */ .main_video_wrapper {padding:51px 15px;background:#efeae7;box-sizing:border-box;width:100%;} .main_video_wrap {padding:0 0 10px;width:100%;} .main_video_slide {overflow:hidden;} .main_video_slide .slide_cut {background:#fff;border:0;margin:0;padding:0;vertical-align:top;font-size:0;box-sizing:border-box;outline:0;} .main_video_wrap .video_txt, .main_video_wrap .video_slide_wrap {display:block;vertical-align:top;padding:0;box-sizing:border-box;} .main_video_wrap .video_txt {width:100%;} .main_video_wrap .video_txt .txt_wrap {position:relative;width:100%;margin:0;padding:0 0 25px;box-sizing:border-box;z-index:3;text-align:center;} .main_video_wrap .video_txt .title_tag {text-align:center;} .main_video_wrap .video_txt .title_tag span {position:relative;z-index:1;padding:0 2px;} .main_video_wrap .video_txt .title_tag span:before {position:absolute;z-index:-1;width:100%;height:7px;background:#d5c6be;opacity:0.6;display:inline-block;content:"";bottom:0;left:0;} .main_video_wrap .video_txt .title_gr {text-align:center;} .main_video_wrap .video_slide_wrap {} .main_video_wrap .video_slide_wrap .video_content {position:relative;z-index:1;overflow:hidden;cursor:pointer;} .main_video_wrap .video_slide_wrap .video_content img {width:auto;height:auto;max-width:100%;vertical-align:top;} .main_tv_layer{position:fixed;top:50%;left:50%;transform:translate(-50%, -50%);z-index:9999;display: none;width:calc(100% - 60px);height:180px;} .main_tv_layer.on{display: block;} .main_tv_layer .tv_layer_box{position: relative;width:100%;height:100%;} .main_tv_layer .layer_close{width:20px;height:20px;position: absolute;top:-33px;right:-20px;cursor:pointer;} .main_tv_layer .layer_close span{display: block;width:100%;height:100%;position: relative;box-sizing:border-box;} .main_tv_layer .layer_close span em{display: inline-block;width:100%;height:2px;background:#fff;position: absolute;top:50%;left:0;} .main_tv_layer .layer_close span em:nth-child(1){transform:rotate(45deg);} .main_tv_layer .layer_close span em:nth-child(2){transform:rotate(-45deg);} .main_tv_layer .iframe_box{position: relative;width:100%;height:100%;} .main_tv_layer .iframe_box iframe{width:100%;height:100%;position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);} /* 추천제품 */ .main_recommend_wrap {width:100%;overflow:hidden;} .recommend_wrap {padding:0;box-sizing:border-box;width:100%;position:relative;z-index:1;} .recommend_wrap h3 {font-size:19px;letter-spacing:-0.76px;font-weight:500;color:#222;line-height:19px;padding:0 0 15px;text-align:left;margin:0 auto;display:inline-block;width: calc(53.6% - 20px);right:0;top:23px;position:absolute;z-index:5;} .recommend_wrap h3:after {width:16px;height:1px;background:#333;position:absolute;left:0;bottom:0;display:inline-block;content:"";} .board_tv .recommend_wrap h3:after{left:19px;} .recommend_wrap .rcmd_slider_wrap {} .recommend_wrap .rcmd_slider {} .recommend_wrap .rcmd_slide {padding-top:0;padding-bottom:26px;box-sizing:border-box;z-index:1;} .recommend_wrap .rcmd_slide .slide_cut {padding:0 24px;box-sizing:border-box;text-align:center;background:#fff;outline:0;} .recommend_wrap .slick-dots {bottom:0;transform:translateX(-50%);text-align:center;left:50%;position:absolute;z-index:3;margin:0 auto;padding:0;font-size:0;} .recommend_wrap .slick-dots li, .recommend_wrap .slick-dots button {font-size:0;margin:0;padding:0;border:0;outline:0;display:inline-block;vertical-align:top;opacity:1;transition:all 0.3s;} .recommend_wrap .slick-dots li {width:6px;height:6px;line-height:6px;position:relative;z-index:1;} .recommend_wrap .slick-dots li + li {margin-left:10px;} .recommend_wrap .slick-dots li button {width:6px;height:6px;border-radius:100%;background:#ccc;opacity:0.8;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%) scale(0.65, 0.65);} .recommend_wrap .slick-dots li.slick-active {} .recommend_wrap .slick-dots li.slick-active button {transform:translate(-50%, -50%) scale(1, 1);background:#333;opacity:1;} .recommend_wrap .rcmd_slide .slick-arrow {width: 7px;height:40px;top: 50%;background: none;position:absolute;transform: translateY(-75%);z-index:6;font-size:0;display:inline-block;vertical-align:top;margin:0;padding:0;border:0;border-radius:100%;outline:0;font-size:0;opacity:1;transition:all 0.3s;} .recommend_wrap .rcmd_slide .slick-arrow:before {width:8px;height:8px;border-width: 1px 1px 0 0;left:50%;top:50%;position:absolute;border-style:solid;box-sizing:border-box;border-color: #aaa;display:inline-block;content:"";} .recommend_wrap .rcmd_slide .slick-arrow.slick-prev {left: 10px;} .recommend_wrap .rcmd_slide .slick-arrow.slick-next {right: 10px;} .recommend_wrap .rcmd_slide .slick-arrow.slick-prev:before {transform:translate(-25%, -50%) rotate(-135deg);} .recommend_wrap .rcmd_slide .slick-arrow.slick-next:before {transform:translate(-75%, -50%) rotate(45deg);} .recommend_wrap .rcmd_slide .slick-arrow.slick-disabled {opacity:0;cursor:inherit;} .recommend_wrap .rcmd_slide .item_cont {} #wrap .recommend_wrap .item_photo_box > a img.middle{transform:translate(-50%, -56%);} /* 배너 */ .main_bnr_wrap {padding-top:40px;padding-bottom:40px;} .main_bnr_wrap ul {font-size:0;vertical-align:top;} .main_bnr_wrap li {vertical-align:top;display:inline-block;vertical-align:top;} .main_bnr_wrap li + li {margin-top:15px;} .main_bnr_wrap a, .main_bnr_wrap img {vertical-align:top;margin:0;padding:0;width:100%;height:auto;} /* 베스트리뷰 */ .main_best_review {padding:48px 0 56px;background:url(../img/da_image/bg_main_review.jpg) no-repeat 50% 50%;background-size:cover;text-align:center;} .main_best_review h3.title_gr + p.title_txt {margin-bottom:28px;} .main_best_review .best_review_slider {} .main_best_review .best_review_slide {margin:0 auto;padding:0 0px;box-sizing:border-box;} .main_best_review .best_review_slide .slick-list {padding-left:52px;padding-right:52px;box-sizing:border-box;} .main_best_review .best_review_slide .slick-arrow {width:34px;height:34px;top: calc(50% - 22px);background:#f5f5f5;position:absolute;z-index:6;font-size:0;display:inline-block;vertical-align:top;margin:0;padding:0;border:0;border-radius:100%;outline:0;font-size:0;opacity:1;transition:all 0.3s;} .main_best_review .best_review_slide .slick-arrow:before {width:8px;height:8px;border-width:1px 1px 0 0;left:50%;top:50%;position:absolute;border-style:solid;box-sizing:border-box;border-color:#555;display:inline-block;content:"";} .main_best_review .best_review_slide .slick-arrow.slick-prev {left:15px;} .main_best_review .best_review_slide .slick-arrow.slick-next {right:15px;} .main_best_review .best_review_slide .slick-arrow.slick-prev:before {transform:translate(-25%, -50%) rotate(-135deg);} .main_best_review .best_review_slide .slick-arrow.slick-next:before {transform:translate(-75%, -50%) rotate(45deg);} .main_best_review .best_review_slide .slick-arrow.slick-disabled {opacity:0;cursor:inherit;} .main_best_review .best_review_slide .slide_cut {padding:0 10px;box-sizing:border-box;position:relative;z-index:1;transition:all 0.3s;outline:0;} .main_best_review .best_review_slide .slide_cut.slick-current {z-index:2;} .main_best_review .best_review_slide .slide_cut:before {left:10px;top:0;width: calc(100% - 20px);height:100%;opacity:1;z-index:2;background:rgba(0, 0, 0, 0.5);display:inline-block;content:"";position:absolute;transition:opacity 0.3s;} .main_best_review .best_review_slide .slide_cut.slick-current:before {height:0;opacity:0;z-index:-1;} .main_best_review .best_review_slide .bbs_content, .main_best_review .best_review_slide .gd_content {background:#fff;overflow:hidden;margin:0 auto;padding:0;width:100%;box-sizing:border-box;position:relative;z-index:1;} .main_best_review .best_review_slide .bbs_content {} .main_best_review .best_review_slide .bbs_content > a {position:absolute;z-index:3;display:inline-block;width:100%;height:100%;} .main_best_review .best_review_slide .bbs_content .thumb {position:relative;z-index:1;width:100%;height:0;padding:0;padding-top: calc(68% + 104px);overflow:hidden;} .main_best_review .best_review_slide .bbs_content .thumb img {width:auto;height:auto;max-width: calc(100% + 2px);min-height: calc(100% + 2px);position:absolute;left:50%;top:50%;transform:translate(-50%, -50%) scale(1, 1);} .main_best_review .best_review_slide .bbs_content .txt {left:50%;bottom:0;width:100%;background: rgba(255, 255, 255, 1);transform:translate(-50%, 0px);padding:15px 15px 18px;box-sizing:border-box;position:absolute;z-index:2;transition:all 0.3s;} .main_best_review .best_review_slide .bbs_content .txt:before {width: calc(100% - 30px);left:50%;transform:translate(-50%, 0px);height:1px;display:inline-block;content:"";position:absolute;bottom:0;background:#ddd;opacity:1;transition:all 0.3s;} .main_best_review .best_review_slide .bbs_content .txt h4, .main_best_review .best_review_slide .bbs_content .txt p {font-weight:400;margin:0 auto 0 0;width:100%;max-width:230px;text-align:left;overflow:hidden;text-overflow:ellipsis;transition:all 0.3s;} .main_best_review .best_review_slide .bbs_content .txt h4 {font-size:14px;line-height:20px;height:20px;letter-spacing:-0.72px;color:#333;white-space:nowrap;font-family:'Jeju Myeongjo',serif;} .main_best_review .best_review_slide .bbs_content .txt p {font-size:12px;line-height:18px;height:54px;margin-top:7px;letter-spacing:-0.48px;font-weight:300;color:#999;white-space:normal;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;word-wrap:break-word;} .main_best_review .best_review_slide .gd_content {padding:15px;} .main_best_review .best_review_slide .gd_content > a {position:absolute;z-index:2;display:inline-block;width:100%;height:100%;left:0;top:0;} .main_best_review .best_review_slide .gd_content .thumb, .main_best_review .best_review_slide .gd_content .txt {vertical-align:middle;display:table-cell;box-sizing:border-box;padding:0;} .main_best_review .best_review_slide .gd_content .thumb {width:55px;height:65px;} .main_best_review .best_review_slide .gd_content .thumb img {width:100%;height:auto;max-height:65px;} .main_best_review .best_review_slide .gd_content .txt {padding-left:10px;text-align:left;} .main_best_review .best_review_slide .gd_content .txt p {} .main_best_review .best_review_slide .gd_content .txt p.goods_tag {font-size:12px;line-height:18px;letter-spacing:-0.6px;} .main_best_review .best_review_slide .gd_content .txt p.goods_tag span {font-size:inherit;line-height:inherit;font-weight:400;color:#666;display:inline-block;vertical-align:top;} .main_best_review .best_review_slide .gd_content .txt p.goods_tag span + span {margin-left:5px;} .main_best_review .best_review_slide .gd_content .txt p.goods_nm {font-size:13px;line-height:20px;height:20px;margin-top:2px;margin-bottom:7px;letter-spacing:-0.65px;font-weight:400;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .main_best_review .best_review_slide .gd_content .txt .goods_go {} .main_best_review .best_review_slide .gd_content .txt .goods_go span {font-size:12px;line-height:18px;letter-spacing:-0.6px;font-weight:400;color:#777;padding-right:10px;display:inline-block;vertical-align:top;position:relative;z-index:1;} .main_best_review .best_review_slide .gd_content .txt .goods_go span:after {width:5px;height:5px;border-width:1px 1px 0 0;border-style:solid;border-color:#999;position:absolute;right:0;top:50%;transform:translate(-0%, -40%) rotate(45deg);display:inline-block;content:"";box-sizing:border-box;} .main_best_review .btn_review_more {padding-top:30px;} /* .main_best_review .btn_review_more a {color:#fff;} */ /*.main_best_review .btn_review_more a span:before {background:rgba(255, 255, 255, 0.3);}*/ /*.main_best_review .btn_review_more a span:after {border-color:#fff;opacity:0.6;}*/ @media only screen and (max-width:360px) { /* 두피테스트 */ .oneTest_store li .txt h4 strong {margin-bottom:13px;font-size:21px;line-height:28px;letter-spacing:-1.1px;} .oneTest_store li .txt p {margin-bottom:11px;font-size:12px;line-height:18px;letter-spacing:-0.9px;} } @media only screen and (max-width:320px) { /* 베스트 프로덕트 */ .main_tab_wrap .gd_tab_txt {padding-top:20px;padding-bottom:14px;padding-left:10px;padding-right:10px;} .main_tab_wrap .gd_tab_txt li {font-size:15px;letter-spacing:-0.75px;} .main_tab_wrap .gd_tab_txt li + li {margin-left:10px;} .main_tab_wrap .gd_tab_txt li span {padding:0 20px;} /* .main_tab_wrap .gd_sm_tab {max-width:280px;} */ .main_tab_wrap #gd02 .gd_sm_tab {max-width:278px;} .main_tab_wrap .gd_sm_tab li {font-size:14px;line-height:30px;letter-spacing:-0.7px;margin:0 5px 6px 5px;} .main_tab_wrap .gd_sm_tab li:nth-of-type(3n + 1) {margin-left:0;} .main_tab_wrap .gd_sm_tab li span {line-height:28px;} .main_tab_wrap .sm_tab_wrap {padding-top:12px;} .main_tab_wrap .tab_pr_slide_wrap {width: calc(100% - 10px);padding-top:10px;margin-top:-28px;margin-left:10px;} .main_tab_wrap .tab_pr_slide .slick-list {padding-left:8px;padding-right:8px;} #wrap .main_tab_wrap .progress {width: calc(100% - 20px);} /* 두피테스트 */ .oneTest_start .start_wrpper {padding:36px 10px 0;} .oneTest_start .start_txt:after {height:55px;bottom:-25px;} .oneTest_start .start_txt h3 {font-size:25px;line-height:31px;letter-spacing:-1.25px;} .oneTest_start .start_txt p {margin-top:11px;margin-bottom:240px;font-size:13px;letter-spacing:-0.65px;line-height:20px;} .oneTest_start .start_txt .btn_start {font-size:14px;letter-spacing:-0.7px;} .main_oneTest_wrap .oneTest_txt {font-size:15px;letter-spacing: -0.75px;line-height:22px;padding-top:103px;} .oneTest_txt + .oneTest_txt {padding-top:14px;} .oneTest_store {padding:25px 10px 50px;} .oneTest_store:before {height:160px;} .oneTest_store li {border-top-left-radius: calc(34% - 4px);border-top-right-radius: calc(34% - 4px);padding-top:62.1%;width: calc(50% - 5px);} .oneTest_store li + li {margin-left:10px;} .oneTest_store li .txt h4 strong {margin-bottom:13px;font-size:21px;line-height:28px;letter-spacing:-1.1px;} .oneTest_store li .txt p {margin-bottom:11px;font-size:11px;line-height:18px;letter-spacing:-0.8px;} /* 배너 */ .main_bnr_wrap li + li {margin-top:10px;} /* 베스트리뷰 */ .main_best_review {padding:48px 0 56px;} .main_best_review h3.title_gr + p.title_txt {margin-bottom:28px;} .main_best_review .best_review_slide .slick-list {padding-left:42px !important;padding-right:42px !important;} .main_best_review .best_review_slide .slick-arrow {top: calc(50% - 20px);} .main_best_review .best_review_slide .slick-arrow.slick-prev {left:10px;} .main_best_review .best_review_slide .slick-arrow.slick-next {right:10px;} .main_best_review .best_review_slide .slide_cut {padding:0 8px;outline:0;} .main_best_review .best_review_slide .slide_cut:before {left:8px;width: calc(100% - 16px);} .main_best_review .best_review_slide .bbs_content .txt {padding:10px 10px 13px;} .main_best_review .best_review_slide .bbs_content .txt:before {width: calc(100% - 20px);} .main_best_review .best_review_slide .gd_content {padding:10px;} } /*─────────────────────────────────────────────────────────── 서브 페이지 ───────────────────────────────────────────────────────────*/ /* 서브 배경 타이틀 */ .sub_bg_title {width:100%;background-repeat:no-repeat !important;background-position:50% 50% !important;height: 150px;margin:0 auto;padding:0;text-align:center;position:relative;z-index:1;background-size:cover;} .sub_bg_title.service_offline_spot {} .sub_bg_title.service_rnd {height:390px;} .sub_bg_title.goods_goods_list, .sub_bg_title.goods_event_sale {height:130px;background-size:cover;} .sub_bg_title .w_custom {max-width: calc(100% - 30px);position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);padding:0;} .sub_bg_title.service_rnd .w_custom {transform:translate(-50%, -66%); padding-left:0; padding-right:0;} .sub_bg_title h2, .sub_bg_title p {text-align:center;color:#fff;display:block;margin:0 auto;padding:0;vertical-align:top;} .sub_bg_title p {font-size: 16px;line-height: 21px;font-weight:300;margin-bottom: 8px;letter-spacing: -0.8px;} .sub_bg_title.service_rnd p {font-size:18px;line-height:1;font-weight:300;margin-bottom:10px;letter-spacing: -1.2px;} .sub_bg_title h2 {font-size: 25px;line-height: 1.16;font-weight:500;letter-spacing: -1.25px;} .sub_bg_title h2 em {font-size:inherit;line-height:inherit;font-weight:inherit;letter-spacing:inherit;font-family:inherit;color:inherit;display:inline-block;vertical-align:top;} .sub_bg_title.service_rnd h2 {font-size:40px;line-height:1;font-weight:500;letter-spacing:-2px;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .sub_bg_title.goods_goods_list h2 {font-size:30px;letter-spacing:18px;line-height:50px;font-weight:400;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;font-style:italic;} .sub_bg_title.goods_event_sale h2 {font-size:15px;line-height:21px;letter-spacing:9px;font-weight:400;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;font-style:italic;} .sub_bg_title.goods_event_sale p {font-size:15px;font-weight:300;line-height:21px;letter-spacing:-0.75px;margin-bottom:0;margin-top:4px;text-align:center;color:#fff;} .sub_bg_title .service_rnd {position:relative;z-index:1;margin:0 auto;display:inline-block;} .sub_bg_title .service_rnd dt, .sub_bg_title.service_rnd dd {color:#fff;text-align:center;vertical-align:top;box-sizing:border-box;margin:0 auto;padding:0;} .sub_bg_title .service_rnd dt {font-size:18px;line-height:26px;font-weight:300; letter-spacing:-0.85px;width:calc(100% - 30px);margin:13px 0 6px 15px;border-top:1px solid rgba(255, 255, 255, 0.2);box-sizing:border-box;padding-top:10px;} .sub_bg_title .service_rnd dd {font-size: 14px;line-height:21px;letter-spacing:-1px;font-weight:300;} .sub_bg_title.goods_benefits_info {height:130px;} .sub_bg_title.goods_benefits_info h2 {color:#333;font-family: 'Jeju Myeongjo', serif;} .sub_bg_title.goods_benefits_info p {font-size:14px;line-height:19px;margin-bottom:0;margin-top:8px;letter-spacing: -0.7px;color:#333;} .sub_bg_title h2.periodical{font-size: 25px;font-family: 'Jeju Myeongjo', serif;color:#333;line-height: 1;letter-spacing: -1.25px;font-weight:normal;margin-bottom: 12px;font-style:normal;} .sub_bg_title p.periodical{font-size: 14px;font-weight:300;color:#333;letter-spacing:-1px;line-height: 1.36;margin-bottom:0;} /* 영상으로보는 웰킨 비주얼 */ .wellkinvideo_visual{position:relative; width:100%; height:505px; background:url('../img/da_image/wellkin_video_bg.jpg') no-repeat center center; background-size:cover;} .wellkinvideo_visual .img_wrap{text-align:center; font-size:0;} .wellkinvideo_visual .img_wrap > h3{font-size: 24.5px;color:#fff;font-family: 'Jeju Myeongjo', serif;font-weight:normal;letter-spacing: -1px;padding: 44px 0 17px;} .wellkinvideo_visual .img_wrap a{position:relative;display:block;height:100%;padding: 15px 12.5px;background:#fff;} .wellkinvideo_visual .img_wrap a:before{position:absolute; content:""; width:50px; height:50px; background:#fff; border-radius:100%; top:50%; left:50%; margin-top:-25px; margin-left:-25px; transition:all 0.4s;} .wellkinvideo_visual .img_wrap a:after{position:absolute; content:""; border:5px solid #fff0; border-bottom:5px solid #222; border-right:5px solid #222; top:48%; left:50%; transform:rotate(-45deg) translate(-50%, -50%); transition:all 0.4s;} .wellkinvideo_visual .img_wrap a img{width:100%; max-height:180px; object-fit:cover;} .wellkinvideo_visual .txt_wrap{width: 100%;margin:0 auto;padding-top: 28px;} .wellkinvideo_visual .txt_wrap > h4{font-size: 20px;font-weight: 400;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;color:#fff;font-style:italic;line-height: 21px;} .wellkinvideo_visual .txt_wrap > h4:after{position:relative;display:block;content:"";width: 100%;height:1px;background:rgba(170,170,170,0.3);margin: 15px 0 16px;z-index:9;} .wellkinvideo_visual .txt_wrap > ul{} .wellkinvideo_visual .txt_wrap > ul li{font-size: 13px;font-weight:300;color:#fff;letter-spacing:-0.8px;line-height: 23px;} .wellkinvideo_visual .txt_wrap > ul li:before{display:inline-block;content:"";background:url('../img/da_image/wellkinvideo_visual_check.png') no-repeat center center;background-size:100%;width: 9.4px;height:8px;margin-right: 7px;margin-bottom: 2px;} /* 공통사용 버튼 */ .btn_center {text-align:center;padding:50px 0 0;width:100%;margin:0 auto;vertical-align:top;} .btn_self_go.btn_go {width:100%;height:45px;border-radius:0;line-height:43px;border-right:1px #444 solid;border-left:1px #aaa solid;border-top:1px #aaa solid;border-bottom:1px #444 solid;font-size:15px;letter-spacing:-0.48px;color:#333;font-weight:500;background:none;margin:0 auto;padding:0;position:relative;z-index:1;display:inline-block;text-align:center;box-sizing:border-box;outline:0;vertical-align:top;cursor:pointer;} .btn_self_go.btn_go:before, .btn_self_go.btn_go:after {width:100%;background: rgb(170,170,170);background: linear-gradient(90deg, rgba(170,170,170,1) 0%, rgba(68,68,68,1) 100%);height:1px;z-index:2;position:absolute;display:inline-block;content:"";left:0;transition:all 0.3s;} .btn_self_go.btn_go:before {top:-1px;} .btn_self_go.btn_go:after {bottom:-1px;} .btn_self_go.btn_go span {display:inline-block;font-size:inherit;font-weight:inherit;color:inherit;line-height:inherit;border-radius:inherit;width:100%;position:relative;z-index:2;box-sizing:border-box;vertical-align:top;} .btn_reversal.btn_go {width:100%;height:45px;border-radius:0;line-height:43px;border-right:1px #fff solid;border-left:1px #888 solid;border-top:1px #888 solid;border-bottom:1px #fff solid;font-size:15px;letter-spacing:-0.48px;color:#fff;font-weight:500;background:none;margin:0 auto;padding:0;position:relative;z-index:1;display:inline-block;text-align:center;box-sizing:border-box;outline:0;vertical-align:top;cursor:pointer;} .btn_reversal.btn_go:before, .btn_reversal.btn_go:after {width:100%;background: rgb(255,255,255);background: linear-gradient(90deg, rgba(136,136,136,1) 0%, rgba(255,255,255,1) 100%);height:1px;z-index:2;position:absolute;display:inline-block;content:"";left:0;transition:all 0.3s;} .btn_reversal.btn_go:before {top:-1px;} .btn_reversal.btn_go:after {bottom:-1px;} .btn_reversal.btn_go span {display:inline-block;font-size:inherit;font-weight:inherit;color:inherit;height:43px;line-height:inherit;border-radius:inherit;width:100%;position:relative;z-index:2;box-sizing:border-box;vertical-align:top;} .btn_self_now.btn_go {width:100%;height:45px;border-radius:0;line-height:43px;border-width:1px;border-style:solid;border-left-color:rgba(39,91,78,0.56);border-top-color:rgba(39,91,78,0);border-right-color:rgba(39,91,78,1);border-bottom-color:rgba(39,91,78,0);font-size:16px;letter-spacing:-0.48px;color:#275b4e;font-weight:500;background:none;margin:0 auto;padding:0;position:relative;z-index:1;display:inline-block;text-align:center;box-sizing:border-box;outline:0;vertical-align:top;cursor:pointer;} .btn_self_now.btn_go:before, .btn_self_now.btn_go:after {width:100%;background: rgb(39,91,78);background: linear-gradient(90deg, rgba(39,91,78,0.56) 0%, rgba(39,91,78,1) 100%);height:1px;z-index:2;position:absolute;display:inline-block;content:"";left:0;transition:all 0.3s;} .btn_self_now.btn_go:before {top:-1px;} .btn_self_now.btn_go:after {bottom:-1px;} .btn_self_now.btn_go span {display:inline-block;font-size:inherit;font-weight:inherit;color:inherit;height:43px;line-height:inherit;border-radius:inherit;width:100%;position:relative;z-index:2;vertical-align:top;} .btn_review_more {text-align:center;display:inline-block;margin:0 auto;} .btn_review_more a {font-size:12px;font-weight:400;color:#333;line-height:18px;height:18px;font-family:'Roboto','Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .btn_review_more a span {padding-right:26px;font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;line-height:inherit;height:inherit;position:relative;z-index:1;vertical-align:top;display:inline-block;} .btn_review_more a span:before, .btn_review_more a span:after {content:"";display:inline-block;position:absolute;margin:0;padding:0;box-sizing:border-box;transition:all 0.3s;} .btn_review_more a span:before {width:18px;height:18px;border-radius:18px;background:rgba(245, 245, 245, 1);z-index:1;right:0;top:0;} /* .btn_review_more a:hover span:before {background:rgba(245, 245, 245, 0.8);} */ .btn_review_more a span:after {width:5px;height:5px;transform:translate(0, -3px) rotate(45deg);right:7px;border-width:1px 1px 0 0;border-style:solid;border-color:#777;top:50%;box-sizing:border-box;z-index:2;}/*width:5px;height:7px;background:url(../img/da_image/btn_arrow_more.svg) no-repeat 50% 50%;background-size:cover;*/ .btn_go.btn_md {height:40px;line-height:38px;font-size:15px;letter-spacing:-0.75px;width:auto;min-width:120px;padding-left:20px;padding-right:20px;} .btn_go.btn_md span {height:38px;} .btn_gd_cart {background:url(../img/da_image/icon_testresult_cart.png) no-repeat 50% 50%;background-size:auto 20px;height:20px;width:24px;margin:0 auto;padding:0;display:inline-block;vertical-align:top;outline:0;border:0;cursor:pointer;} .btn_gd_cart span {display:inline-block;width:24px;height:20px;line-height:20px;overflow:hidden;text-indent:24px;vertical-align:top;display:inline-block;vertical-align:top;} .btn_layer1 span:before, .btn_layer2 span:before, .btn_kakao span:before, .btn_kakao em:before {display:inline-block;content:"";position:absolute;} .btn_layer1 span {padding-left: 30px;} .btn_layer1 span:before {background:url(../img/da_image/icon_reservation2.png) no-repeat 50% 50%;background-size: 19px;width: 20px;height: 20px;left: 27px;top: 15px;} .btn_layer2 span {padding-left: 38px;} .btn_layer2 span:before {background:url(../img/da_image/icon_reservation3.png) no-repeat 50% 50%;background-size: 24px;width: 24px;height: 17px;left: 22px;top: 16px;} .btn_kakao {border:1px #675244 solid;height: 45px;border-radius:0;line-height: 44px;font-size: 15px;letter-spacing: -0.75px;color:#3e2616;font-weight:500;background:none;margin:0 auto;position:relative;z-index:1;display:inline-block;text-align:center;box-sizing:border-box;outline:0;vertical-align:top;cursor:pointer;} .btn_kakao span {padding-left:36px;position: relative;} .btn_kakao span:before {background:url(../img/da_image/icon_reservation4.png) no-repeat 50% 50%;background-size: 22px;width: 22px;height: 21px;left:0px;top:0px;} .btn_kakao em {padding-left: 43px;font-size: 13px;letter-spacing: -0.4px;color:#543520;font-weight:400;display:inline-block;box-sizing:border-box;vertical-align:top;position:relative;z-index:1;} .btn_kakao em:before {background:url(../img/da_image/icon_reservation5.png) no-repeat 50% 50%;background-size: 23px;width: 23px;height: 6px;left: 12px;top: 18px;} .btn_prev_self.btn_go, .btn_next_self.btn_go, .btn_result_self.btn_go {letter-spacing:1.6px;height:46px;line-height:44px;font-size:16px;color:#222;font-weight:600;font-family:'Trirong','Jeju Myeongjo',serif;} .btn_result_self.btn_go {} .btn_result_self.btn_go span:after {font-size:13px;line-height:13px;letter-spacing:0;padding:0 0 6px 40px;height:32px;right:-63px;top:-10px;transform:translateY(0);background:url(../img/da_image/bg_arrow_click.png) no-repeat 0 0;background-size:auto 32px;font-weight:400;content:"Click!";box-sizing:border-box;display:inline-block;position:absolute;z-index:1;color:#4f4f4f;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;transition:all 0.2s;} /* .btn_result_self.btn_go:hover span:after {transform:translateY(-2px);} */ .btn_prev_self.btn_go {width:120px;color:#666;border:1px #bbb solid;} .btn_next_self.btn_go {width:120px;} .btn_custom_sm.btn_gray_small, .btn_custom_sm.btn_point_small, .btn_custom_sm.btn_basic_small {height:30px;line-height:28px;padding:0 12px;font-size:13px;letter-spacing:-0.65px;font-weight:400;border-width:1px;margin:0;border-style:solid;display:inline-block;outline:0;vertical-align:inherit;box-sizing:border-box;} .btn_custom_sm.btn_gray_small span, .btn_custom_sm.btn_point_small span, .btn_custom_sm.btn_basic_small span {font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;line-height:26px;height:26px;outline:0;border:0;margin:0;padding:0;display:inline-block;vertical-align:top;box-sizing:border-box;} .btn_custom_sm.btn_gray_small {background:#fff;border-color:#bbb;color:#666;} .btn_custom_sm.btn_point_small {background:#275b4e;border-color:#275b4e;color:#fff;} .btn_custom_sm.btn_basic_small {background:#fff;border-color:#275b4e;color:#275b4e;} .btn_custom_lg.btn_gray, .btn_custom_lg.btn_point, .btn_custom_lg.btn_basic {height:45px;line-height:23px;padding:10px 15px;font-size:16px;letter-spacing:-0.8px;font-weight:500;border-width:1px;margin:0;border-style:solid;display:inline-block;outline:0;vertical-align:inherit;box-sizing:border-box;} .btn_custom_lg.btn_gray span, .btn_custom_lg.btn_point span, .btn_custom_lg.btn_basic span {font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;line-height:inherit;outline:0;border:0;margin:0;padding:0;display:inline-block;vertical-align:inherit;box-sizing:border-box;} .btn_custom_lg.btn_gray {background:#fff;border-color:#bbb;color:#666;} .btn_custom_lg.btn_point {background:#275b4e;border-color:#275b4e;color:#fff;} .btn_custom_lg.btn_basic {background:#fff;border-color:#275b4e;color:#275b4e;} /*공통상단*/ .sub_line_tit{text-align:center;box-sizing:border-box;padding:0 15px;margin-top:42px;background:#fff;} .sub_line_tit .sub_line_cont{width:100%;margin:0 auto;box-sizing:border-box;border-bottom:1px solid #ddd;} .sub_line_tit .sub_line_cont.bd_none{border:none;} .sub_line_tit .sub_line_cont.w_max{width:100%;} .sub_line_tit h2{font-size:25px;color:#333;font-weight:400;line-height:30px;font-family:'Jomolhari';} .sub_line_tit .sub_line_tab{width:100%;box-sizing:border-box;font-size:0;text-align:center;margin:0 auto;margin-top:22px;} .sub_line_tit .sub_line_tab li{display:inline-block;box-sizing:border-box;position: relative;cursor:pointer;height:100%;font-size:16px;color:#888;font-weight:normal;text-align:center;line-height:40px;font-family:'Jeju Myeongjo', serif;letter-spacing:-0.95px;position: relative;} .sub_line_tit .sub_line_tab li.line_2{width:50%;} .sub_line_tit .sub_line_tab li.line_3{width:33.3333%;} .sub_line_tit .sub_line_tab li.line_4{width:25%;} .sub_line_tit .sub_line_tab li.line_5{width:20%;} .sub_line_tit .sub_line_tab li.line_6{width:16.6666%;} .sub_line_tit .sub_line_tab li:before{width:3px;height:3px;content:"";background:#275b4e;box-sizing:border-box;border-radius:100%;position: absolute;top:1px;left:50%;transform:translate(-50%);display: none;} .sub_line_tit .sub_line_tab li:after{width:100%;height:1px;content:"";background:#333;position: absolute;bottom:-1px;left:0;display: none;} .sub_line_tit .sub_line_tab li a, .sub_line_tit .sub_line_tab li span{display:block;width:100%;height:100%;font-size:16px;color:#888;font-weight:normal;text-align:center;line-height:40px;font-family:'Jeju Myeongjo', serif;letter-spacing:-0.95px;position: relative;} .sub_line_tit .sub_line_tab li.on, .sub_line_tit .sub_line_tab li.on a, .sub_line_tit .sub_line_tab li.on span{color:#222;font-weight:600;} .sub_line_tit .sub_line_tab li.on:before{display: block;} .sub_line_tit .sub_line_tab li.on:after{display: block;} .sub_line_tit.good_regular {padding:0;margin-top:-20px;} .sub_line_tit.good_regular .sub_line_tab {margin-top:50px;} .sub_line_tit.good_regular .sub_line_tab li.line_2:nth-child(1) {width:94px;} .sub_line_tit.good_regular .sub_line_tab li.line_2:nth-child(2) {width:132px;margin-left:15px;} /*웰킨스토리*/ .cs_title.sub_tab_tit{background:#fff;padding:30px 0 20px;border-bottom:12px solid #eee;} .cs_title.sub_tab_tit .sub_cs_tab{margin:0;} .cs_title.sub_tab_tit .sub_cs_tab li a{font-family:'Jomolhari';} @media only screen and (max-width:350px) { .btn_layer1 span:before{left:18px;} .btn_layer2 span:before{left:12px;} } @media only screen and (max-width:320px) { .sub_line_tit .sub_line_tab li a, .sub_line_tit .sub_line_tab li span{font-size:15px;} } /*수량버튼*/ #wrap .goods_qty{width:105px;height:30px;box-sizing:border-box;position:relative;font-size:0;display:inline-block;} #wrap .goods_qty .text{float:none;width:45px;height:30px;display: inline-block;border:1px solid #ccc;border-width:1px 0 1px 0;font-size:15px;color:#333;font-weight:400;font-family: 'Roboto',Malgun Gothic,'맑은 고딕',AppleGothic,Dotum,'돋움',sans-serif;line-height:30px;vertical-align: top;padding:0;box-sizing:border-box;padding-left:18px;} #wrap .goods_qty .goods_cnt{width:30px;height:30px;box-sizing:border-box;border:none;display:inline-block;font-size:0;border:1px solid #ccc;position: relative;background:#fff;padding:0;} #wrap .goods_qty .goods_cnt.down:before{width:14px;height:1px;content:"";background:#333;position: absolute;top:16px;left:9px;} #wrap .goods_qty .goods_cnt.up:before{width:14px;height:1px;content:"";background:#333;position: absolute;top:16px;left:9px;} #wrap .goods_qty .goods_cnt.up:after{width:1px;height:14px;content:"";background:#333;position:absolute;left:16px;top:9px;} /*결제하기 버튼*/ .price_info_box{box-sizing:border-box;background:#f4f2f0;} .price_info_box .price_info{box-sizing:border-box;position:relative;padding:40px 15px 48px 15px;} .price_info_box .price_sum{margin:0;padding:0;border:none;background:#fff;box-sizing:border-box;} .price_info_box .price_sum_cont{float:none;display: block;text-align:left;box-sizing:border-box;padding:20px 20px 20px 20px;text-align: right;} .price_info_box .price_sum_cont .price_sum_list{box-sizing:border-box;} .price_info_box .price_sum_cont .price_sum_list .price_sum_tit{margin-bottom:5px;text-align: left;} .price_info_box .price_sum_cont .price_sum_list .price_sum_tit p{font-size:20px;color:#333;font-weight:600;font-family:'Jeju Myeongjo', serif;letter-spacing:-0.3px;} .price_info_box .price_sum_cont .price_sum_list .price_sum_tit p strong{color:#316356;} .price_info_box .price_sum_cont .price_sum_list dl{display: block;text-align:left;padding:0;box-sizing:border-box;} .price_info_box .price_sum_cont .price_sum_list dl:after{clear:both;content:"";display: block;} .price_info_box .price_sum_cont .price_sum_list dl dt{font-size:15px;color:#777;font-weight:400;line-height:30px;display: inline-block;letter-spacing:-0.64px;} .price_info_box .price_sum_cont .price_sum_list dl dd{display: inline-block;float:right;font-size:16px;color:#333;font-weight:400;line-height:30px;letter-spacing:-0.64px;} .price_info_box .price_sum_cont .price_sum_list dl dd strong{font-size:16px;color:inherit;font-weight:inherit;font-family:'Roboto';} .price_info_box .price_sum_cont .price_sum_list dl dd strong #totalGoodsPrice{font-weight:500;} .price_info_box .price_sum_cont .price_sum_list dl.price_total{border-top:1px solid #333;margin-top:10px;padding-top:10px;} .price_info_box .price_sum_cont .price_sum_list dl.price_total dt{font-size:16px;color:#333;font-weight:400;letter-spacing:-0.8px;line-height:36px;} .price_info_box .price_sum_cont .price_sum_list dl.price_total dd{font-size:16px;color:#1b253c;font-weight:400;letter-spacing:-0.32px;line-height:36px;} .price_info_box .price_sum_cont .price_sum_list dl.price_total dd strong{font-size:23px;color:inherit;line-height:inherit;letter-spacing:-0.56px;font-family:'Jomolhari';font-weight:500;display: inline-block;} .price_info_box .price_sum_cont .tobe_mileage{display: inline-block;font-size:13px;color:#942020;font-weight:400;letter-spacing:-0.05em;;} .price_info_box .price_sum_cont .tobe_txt{text-align:right;font-size:13px;color:#942020;font-weight:400;font-family:'Noto Sans KR';letter-spacing:-0.8px;margin-top:8px;display:inline-block;line-height:1;} .price_info_box .price_agree{margin-top:15px;} .price_info_box .price_agree .inp_chk.inp_custom input{vertical-align: top;} .price_info_box .price_agree .inp_chk.inp_custom label{font-size:15px;color:#555;font-weight:400;line-height:23px;line-height:-1.5px;width:88%;display: inline-block;} .price_info_box .price_agree .inp_chk.inp_custom label strong{color:#942020;font-weight:400;} #wrap .price_info_box .btn_order_box{padding:10px 0 20px 0;position: relative;width:100%;} #wrap .price_info_box .pay_box .payco_box{display: none;} .price_info_box .btn_order_box .btn_right_box{float:none;} .price_info_box .btn_order_box .btn_order{width:100%;height:50px;background:#1b253c;border:1px solid #1b253c;font-size:17px;color:#fff;font-weight:500;font-family:'Trirong', 'Jeju Myeongjo', serif;} /*배송주기선택*/ #wrap .price_info_box .price_sum.delivery_cycle{margin-bottom:10px;} #wrap .price_info_box .price_sum_cont .price_sum_list .price_sum_tit .delivery_period{width:100%;height:45px;line-height:45px;font-size:16px;color:#333;font-weight:400;padding-left:14px;margin-top:8px;border:1px solid #ddd;text-align:center;box-sizing:border-box;padding:0;cursor:auto;} #wrap .price_info_box .delivery_cycle .price_sum_tit span{font-size:14px;color:#942020;font-weight:400;letter-spacing:-1.4px;line-height:23px;display: block;margin:10px 0;} #wrap .price_info_box .delivery_cycle .price_sum_list .delivery_date dl dt, .price_info_box .price_sum_cont .price_sum_list dl dd{line-height:27px;} #wrap .price_info_box .delivery_cycle .price_sum_list .delivery_date dl dt{position: relative;box-sizing:border-box;padding-right:25px;} #wrap .price_info_box .delivery_cycle .price_sum_list .delivery_date dl dt .next_delivery_btn{display:inline-block;cursor:pointer;width:20px;height:20px;background:url('../img/da_image/icon_qmark.png')no-repeat center;padding:0;position: absolute;top:5px;right:0;background-size:auto 20px;} /*레이어*/ #wrap .delivery_cycle .delivery_date dl dt .regular_delivery_layer{position: absolute;box-sizing:border-box;width:290px;top:37px;left:10px;display:none;z-index:10;} #wrap .delivery_cycle .delivery_date dl dt .regular_delivery_layer .layer_box{width:100%;box-sizing:border-box;border:1px solid #333;position:relative;background:#fff;text-align: center;} #wrap .delivery_cycle .delivery_date dl dt .regular_delivery_layer .layer_box:before{width:5px;height:5px;border:1px solid #000;border-width:1px 1px 0 0;transform:rotate(-45deg);content:"";position: absolute;top:-4px;left:100px;background:#fff;} #wrap .delivery_cycle .delivery_date dl dt .regular_delivery_layer .layer_box .layer_close{position: absolute;right:4px;top:4px;cursor:pointer;width:16px;height:16px;} #wrap .delivery_cycle .delivery_date dl dt .regular_delivery_layer .layer_box .layer_close span{display: block;width:100%;height:100%;position: relative;padding:0;} #wrap .delivery_cycle .delivery_date dl dt .regular_delivery_layer .layer_box .layer_close span em{display: inline-block;width:100%;height:1px;background:#000;position: absolute;top:50%;left:0;} #wrap .delivery_cycle .delivery_date dl dt .regular_delivery_layer .layer_box .layer_close span em:nth-child(1){transform:rotate(45deg);} #wrap .delivery_cycle .delivery_date dl dt .regular_delivery_layer .layer_box .layer_close span em:nth-child(2){transform:rotate(-45deg);} .regular_delivery_layer .layer_box .choice_txt{box-sizing:border-box;padding-top:10px;} .regular_delivery_layer .layer_box .choice_txt p{font-size:15px;color:#333;font-weight:400;line-height:21px;background:url('../img/da_image/icon_cal.png')no-repeat center bottom;padding-bottom:48px;background-size:auto 38px;} .regular_delivery_layer .layer_box .change_txt{box-sizing:border-box;background:#f5f5f5;margin-top:14px;padding:16px 0 20px;} .regular_delivery_layer .layer_box .change_txt p{font-size:13px;color:#275b4e;font-weight:400;letter-spacing:-0.75px;} .regular_delivery_layer .layer_box .change_txt p span{display: inline-block;padding:0;font-size:inherit;color:#fff;font-weight:inherit;background:#275b4e;line-height:1;padding:2px 4px 3px;} .regular_delivery_layer .layer_box .change_txt > span{display: block;padding:0;font-size:13px;color:#555;font-weight:400;line-height:19px;letter-spacing:-0.06em;margin-top:2px;} /*fix*/ #wrap .price_info_box .btn_order_box.fix{position:fixed;bottom:0;left:0;z-index:26;padding:0;} .price_info_box .btn_order_box.fix .btn_order{height:60px;} @media only screen and (max-width:350px){ /*배송주기선택 레이어*/ #wrap .delivery_cycle .delivery_date dl dt .regular_delivery_layer{width:270px;} } @media only screen and (max-width:340px){ /*배송주기 선택*/ #wrap .price_info_box .delivery_cycle .price_sum_tit span br{display: none;} } @media only screen and (max-width:330px){ #wrap .delivery_cycle .delivery_date dl dt .regular_delivery_layer{width:250px;} .regular_delivery_layer .layer_box .choice_txt p{font-size:13px;} .regular_delivery_layer .layer_box .change_txt p{font-size:12px;} .regular_delivery_layer .layer_box .change_txt > span{font-size:12px;} } /* 공통사용 스텝 */ .selfstep_ol {margin:0 auto;padding:0;counter-reset:list-number;vertical-align:top;font-size:0;} .selfstep_ol > li {padding: 35px 14px 35px 20px;text-align:center;counter-increment:list-number;position:relative;z-index:1;display:block;vertical-align:top;box-sizing:border-box;width:100%;} .selfstep_ol > li:after {clear:both;content:"";display:block;} .selfstep_ol > li:nth-of-type(1) {padding-top:30px;} .selfstep_ol > li:nth-of-type(3) {padding-bottom:30px;} .selfstep_ol > li > dl:before {content:'STEP 0' counter(list-number);height:1em;line-height:1em;padding:0;font-size:12px;letter-spacing:0;font-weight:500;display:inline-block;color:#4b4c44;text-align:left;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;box-sizing:border-box;z-index:5;} .selfstep_ol > li + li {margin-top:0;border-top:1px #eee solid;} .selfstep_ol > li + li:before {background:#f5f5f5 url(../img/da_image/bg_step_arrow.png) no-repeat 50% 50%;background-size:7px 4px;width:30px;height:30px;border-radius:100%;left:50%;top:0px;transform:translate(-50%, -50%);display:inline-block;content:"";position:absolute;} .selfstep_ol > li img, .selfstep_ol > li .thumb img {width:100%;height:auto;margin:0 auto;} .selfstep_ol > li > p {margin:21px 0 0;font-size:22px;letter-spacing: -1.1px;line-height:30px;color:#08192b;} .selfstep_ol > li > img, .selfstep_ol > li .thumb {width: 45.7%;height:auto;display:inline-block;vertical-align:top;} .selfstep_ol > li dl {margin:0 auto;text-align:left;} .selfstep_ol > li > img + dl, .selfstep_ol > li .thumb + .txt, .selfstep_ol > li > img + p {width: calc(54.1% - 18px);margin-left: 18px;display:inline-block;vertical-align:top;text-align:left;} .selfstep_ol > li dl dt, .selfstep_ol > li dl dd {margin:0;padding:0;vertical-align:top;width: calc(100% + 3px);margin-right:-3px;} .selfstep_ol > li dl dt {margin-top:7px;margin-bottom:10px;font-size:19px;line-height:25px;letter-spacing: -0.95px;font-weight:500;color:#08192b;} .selfstep_ol > li dl dd {font-size:14px;line-height:21px;letter-spacing: -0.8px;color:#444;font-weight:300;} .selfstep_ol > li dl dd .check_ul {max-width:190px;margin:0 auto;padding:15px 0 0;} .selfstep_ol > li dl dd .check_ul li {padding:0 0 0 17px;font-size:inherit;line-height:23px;font-weight:400;color:inherit;position:relative;z-index:1;display:inline-block;} .selfstep_ol > li dl dd .check_ul li:before {left:0;top:7px;width:11px;height:9px;background:url(../img/da_image/icon_ul_check.png) no-repeat 0 0;background-size:auto 9px;display:inline-block;content:"";position:absolute;} .selfstep_ol > li .txt {vertical-align:middle;} .selfstep_ol > li > .txt:before {content:'0' counter(list-number);font-size:20px;line-height:1em;height:1em;letter-spacing:-1px;font-style:italic;font-weight:500;color:#c6c2ba;font-style:italic;font-family:'Trirong','Jeju Myeongjo',serif;display:block;margin:0;padding:0;} .selfstep_ol > li > .txt p {margin-top:10px;font-size:18px;line-height:23px;letter-spacing: -0.9px;color:#333;font-weight:500;} .selfstep_ol > li > .txt .list_check {padding-top:11px;display:inline-block;margin:0;} .selfstep_ol > li .txt > p > span{font-size:12px;font-weight:500;font-family:'Roboto';letter-spacing:0;} /* 공통 input */ input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active{-webkit-box-shadow: 0 0 0 30px white inset !important;} /* RADIO */ .inp_rdo.inp_custom {display:inline-block;padding:5px 0;font-size:16px;line-height:1em;letter-spacing:-0.75px;} .inp_rdo.inp_custom input {display:inline-block;width:17px;height:17px;margin:0 3px 0 0;vertical-align:middle;background:url('../img/da_image/icon_rad_chk.png') no-repeat center;background-size:17px;border:none;} .inp_rdo.inp_custom input:checked {background:url('../img/da_image/icon_rad_chk_on.png') no-repeat center;background-size:17px;} .inp_rdo.inp_custom label {margin:0;font-size:inherit;line-height:inherit;vertical-align:middle;} .inp_rdo.inp_custom label + input {margin-left:15px;} .inp_rdo.inp_custom.choice_m {padding:5px 0 6px;} .inp_rdo.inp_custom.choice_m input {width:27px;height:27px;margin:-5px 5px -6px 0;background:url('../img/da_image/icon_rad_chk_m.png') no-repeat center;background-size:27px;} .inp_rdo.inp_custom.choice_m input:checked {background:url('../img/da_image/icon_rad_chk_m_on.png') no-repeat center;background-size:27px;} .inp_rdo.inp_custom.choice_m label {} .inp_rdo.inp_custom.choice_m label + input {} /* CHECK BOX */ .inp_chk.inp_custom {display:inline-block;padding:0;font-size:16px;line-height:1em;letter-spacing:-0.75px;} .inp_chk.inp_custom input {display:inline-block; width:25px; height:25px; margin:0 5px 0 0; vertical-align:middle; background:url('../img/da_image/input_check_off.png') no-repeat center; background-size:25px; border:none;} .inp_chk.inp_custom input:checked {background:url('../img/da_image/input_check_on.png') no-repeat center; background-size:25px;} .inp_chk.inp_custom label {font-size:inherit;line-height:inherit;color:#666;vertical-align:middle;} .inp_chk.inp_custom label + input {margin-left:15px;} /* SELECT BOX */ #wrap .inp_sel.inp_custom {} #wrap .inp_sel.inp_custom select{width:100%; height:45px; padding:0 33px 0 15px; background:#fff url('../img/da_image/select_arr.png')no-repeat 93% center; background-size:auto 6px; font-size:15px; color:#333; border:1px solid #ccc; box-sizing:border-box; vertical-align:1px;letter-spacing:-0.75px;} #wrap select{box-sizing:border-box;border:1px solid #ddd;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:#fff url('../img/da_image/select_arr.png')no-repeat 93% center;background-size:auto 6px;outline:none;} #wrap select::-ms-expand{display:none;} /* textarea */ textarea{outline:none;} textarea::-webkit-scrollbar, div::-webkit-scrollbar{width: 3px;height: 80px;margin:10px 0;border-radius: 2.5px;background-color:#e6e8ee;} textarea::-webkit-scrollbar-thumb, div::-webkit-scrollbar-thumb{background:#5c6273;border-radius:2.5px;} textarea::-webkit-scrollbar-track, div::-webkit-scrollbar-track{width:5px;background:#e6e8ee;} .form_element.form_custom {display:inline-block;vertical-align:top;margin:0;padding:0;text-align:left;} .form_element.form_custom:after {clear:both;content:"";display:block;} .form_element.form_custom + .form_element.form_custom {margin-left:28px;} .form_element.form_custom {position:relative;z-index:1;} .form_element.form_custom input {height:1px;} .form_element.form_custom label.choice_s, .form_element.form_custom label.choice_m, .form_element.form_custom label.check_s {font-weight:400;color:#333;cursor:pointer;box-sizing:border-box;vertical-align:top;} .form_element.form_custom label.choice_m {height:27px;line-height:23px;font-size:16px;letter-spacing:-0.8px;} .form_element.form_custom label.check_s {font-size:14px;letter-spacing:-0.8px;} .form_element.form_custom label.check_s span {font-size:12px;line-height:18px;letter-spacing:-0.6px;color:#666;font-weight:inherit;} .form_element.form_custom label.choice_s {min-width:20px;padding:0 0 0 34px;background:url('../img/da_image/input_radio_off.png') no-repeat 0 50%;display:inline-block;vertical-align:middle;box-sizing:border-box;background-size:auto 25px;} .form_element.form_custom input:checked + label.choice_s, .form_element.form_custom label.choice_s.on {background:url('../img/da_image/input_radio_on.png') no-repeat 0 0;background-size:auto 25px;} .form_element.form_custom label.choice_m {min-width:27px;padding:0 0 0 35px;background:url('../img/da_image/input_radio_m_off.png') no-repeat 0 50%;display:inline-block;vertical-align:middle;background-size:auto 27px;} span.form_element.form_custom label.choice_s, span.form_element.form_custom label.choice_m {display:table-cell;} .form_element.form_custom input:checked + label.choice_m, .form_element.form_custom label.choice_m.on {background:url('../img/da_image/input_radio_m_on.png') no-repeat 0 0;background-size:auto 27px;} .form_element.form_custom label.check_s {min-width:32px;padding:0 0 0 35px;min-height:25px;background:url('../img/da_image/input_check_off.png') no-repeat 0 0;background-size:auto 25px;} .form_element.form_custom input:checked + label.check_s, .form_element.form_custom label.check_s.on {background:url('../img/da_image/input_check_on.png') no-repeat 0 0;background-size:auto 25px;} textarea.self_inq_area {padding:16px 0 16px 19px;line-height:22px;font-size:16px;letter-spacing:-0.8px;font-weight:400;color:#777;border:1px #ddd solid;display:block;margin:0 auto;width:100%;box-sizing:border-box;height:120px;} textarea.self_inq_area:focus {outline:0;border:1px #ddd solid;border-radius:0;} textarea.self_inq_area:placeholder {font-size:16px;letter-spacing:-0.8px;font-weight:400;color:#777;} textarea.self_inq_area::placeholder {font-size:16px;letter-spacing:-0.8px;font-weight:400;color:#777;} textarea.self_inq_area:-webkit-input-placeholder {font-size:16px;letter-spacing:-0.8px;font-weight:400;color:#777;} textarea.self_inq_area:-ms-input-placeholder {font-size:16px;letter-spacing:-0.8px;font-weight:400;color:#777;} .form_element.form_file {width:90px;height:90px;margin:0;padding:0;position:relative;text-align:center;vertical-align:top;overflow:hidden;} .form_element.form_file + .form_element.form_file {margin-left:20px;} .form_element.form_file .image-box {border:1px #ddd solid;width:100%;height:90px;top:0;left:0;display:inline-block;position:absolute;cursor:pointer;z-index:1;vertical-align:top;overflow:hidden;box-sizing:border-box;} .form_element.form_file .image-box img {height:auto;width:auto;max-width:90px;max-height:90px;display:none;transform:translate(-50%, -50%);position:absolute;left:50%;top:50%;} .form_element.form_file .image-box p {width:90px;height:90px;background:#f5f5f5 url(../img/da_image/icon_input_file.png) no-repeat 50% 50%;position:relative;top:-1px;left:-1px;border:1px #ddd solid;font-size:0;box-sizing:border-box;} .form_element.form_file input[type="file"] {width:100%;height:90px;top:0;left:0;opacity:0;display:inline-block;position:absolute;cursor:pointer;z-index:1;vertical-align:top;} .form_element.form_file input[type="file"] + label {width:100%;height:90px;padding:0;border:1px #ddd solid;font-size:0;background:#f5f5f5 url(../img/da_image/icon_input_file.png) no-repeat 50% 50%;position:relative;z-index:0;display:inline-block;width:100%;box-sizing:border-box;cursor:pointer;vertical-align:top;} /* 공통 checklist */ .list_check {} .list_check li {font-size:13px;line-height:23px;padding:0 0 0 18px;letter-spacing:-0.65px;font-weight:400;color:#444;position:relative;z-index:1;vertical-align:top;} .list_check li a, .list_check li em, .list_check li strong, .list_check li b {font-size:inherit;font-weight:inherit;color:inherit;line-height:inherit;display:inline-block;vertical-align:top;} .list_check li:before {background-image:url(../img/da_image/icon_list_check_bk.png);width:11px;height:9px;left:0;top:7px;display:inline-block;content:"";position:absolute;background-repeat:no-repeat !important;background-position:0 0 !important;background-size:11px auto !important;} /* 공통 토글 */ .navi_step {display:inline-block;vertical-align:top;position:relative;z-index:1;} .navi_step > dt {font-size: 14px;letter-spacing: -0.7px;padding:0 25px 0 4px;line-height:33px;height:34px;color:#555;font-weight:400;border-bottom:1px #555 solid;text-align:left;box-sizing:border-box;position:relative;z-index:2;cursor:pointer;} .navi_step > dt:after {width:9px;height:9px;right:3px;top:50%;transform:translate(-50%, -75%) rotate(135deg);border-color:#555;border-width:1px 1px 0 0;border-style:solid;position:absolute;display:inline-block;content:"";cursor:pointer;} .navi_step > dd {position:absolute;left:0;top:100%;margin-top:-1px;width:100%;text-align:left;z-index:1;height:0;overflow:hidden;} .navi_step > dd > ul {padding:8px 8px;border:1px #555 solid;border-top:0;background:#fff;} .navi_step > dd > ul > li {font-size:13px;letter-spacing:-0.65px;font-weight:400;color:#666;line-height:21px;padding:2px 0;position:relative;z-index:1;} .navi_step > dd > ul > li input[type="radio"] {position:absolute;left:0;top:50%;transform:translateY(-50%);} .navi_step > dd > ul > li input[type="radio"] + label {position:relative;z-index:2;background:#fff;line-height:inherit;font-size:inherit;cursor:pointer;display:inline-block;vertical-align:top;width:100%;} .navi_step.on > dt:after {transform:translate(-50%, -25%) rotate(-45deg);} .navi_step.on > dd {height:auto;overflow:inherit;} .navi_step.on > dd > ul {} .navi_step.on > dd > ul > li {} /* 페이징 */ #wrap .page_btn_box {text-align:center; margin:0;padding:28px 0 0;} #wrap .page_btn_box .page_number {display:inline-block;height:18px;padding:0 30px;color: #aaaaaa;font-size:16px;line-height:18px;vertical-align:middle;letter-spacing:0;font-family: 'Jeju Myeongjo', serif;} #wrap .page_btn_box .page_number strong {color: #356659;} #wrap .page_btn_box .prev_btn {overflow:hidden; display:inline-block; width:10px; height:18px; background:url('../img/da_image/icon_arrow_prev.png') no-repeat 0 0; background-size:10px 18px; font-size:1px; color:transparent; vertical-align: middle; border:none;} #wrap .page_btn_box .next_btn {overflow:hidden; display: inline-block; width: 10px; height:18px; background:url('../img/da_image/icon_arrow_next.png') no-repeat 0 0; background-size: 10px 18px; font-size:1px; color:transparent; vertical-align: middle; border:none;} #wrap .no_list {padding:55px 10px 55px 10px; border-top:0; font-size:12px; text-align:center;} /*전화번호, 휴대폰번호*/ .inp_chk.inp_custom input{border:none !important;} .input_phoneNum{width:28.1%;} .input_phoneNum + span{display:inline-block;width:10px;height:1px;margin: 22px 6px;background:#888;float: left;} @media only screen and (max-width:370px){ .input_phoneNum{width:27.4%;} } @media only screen and (max-width:365px) { .selfstep_ol > li dl dd{font-size:13px;} } @media only screen and (max-width:360px) { .sub_bg_title.service_rnd p, .sub_bg_title .service_rnd dt{font-size:17px;} .sub_bg_title.service_rnd h2{font-size:37px;} .sub_bg_title .service_rnd dd{font-size:13px;} } @media only screen and (max-width:345px){ .sub_bg_title .service_rnd dd{font-size:12px;} } @media only screen and (max-width:340px){ .sub_bg_title .w_custom {max-width: calc(100% - 20px);} .input_phoneNum{width:27%;} } @media only screen and (max-width:325px){ .input_phoneNum{width:26.9%;} } @media only screen and (max-width:320px) { .sub_bg_title.service_rnd p, .sub_bg_title .service_rnd dt{font-size:16px;} .sub_bg_title.service_rnd h2{font-size:35px;} /* RADIO */ .inp_rdo.inp_custom {padding:4px 0;} .inp_rdo.inp_custom input {width:16px;height:16px;margin-right:2px;background-size:16px;} .inp_rdo.inp_custom input:checked {background-size:16px;} .inp_rdo.inp_custom label + input {margin-left:12px;} .inp_rdo.inp_custom.choice_m {padding:4px 0 5px;} .inp_rdo.inp_custom.choice_m input {width:25px;height:25px;margin:-4px 3px -5px 0;background-size:25px;} .inp_rdo.inp_custom.choice_m input:checked {background-size:25px;} /* CHECK BOX */ .inp_chk.inp_custom {} .inp_chk.inp_custom input {width:23px;height:23px;margin-right:3px;background-size:23px;} .inp_chk.inp_custom input:checked {background-size:23px;} .inp_chk.inp_custom label + input {margin-left:12px;} .list_check li {font-size:12px;line-height:21px;padding-left:15px;letter-spacing:-0.6px;} .list_check li:before {width:11px;height:9px;top:6px;} .selfstep_ol > li dl dt {font-size:18px;line-height:23px;letter-spacing: -0.9px;} .selfstep_ol > li dl dd {font-size:12.8px;line-height:20px;letter-spacing:-0.65px;} .selfstep_ol > li dl dd .check_ul li {padding-left:15px;line-height:21px;} .selfstep_ol > li dl dd .check_ul li:before {top:6px;width:11px;height:9px;background-size:auto 9px;} .selfstep_ol > li > img + dl, .selfstep_ol > li .thumb + .txtm, .selfstep_ol > li > img + p {width: calc(54.1% - 10px);margin-left:10px;} .selfstep_ol > li > .txt p {font-size:17px;letter-spacing:-0.85px;} } /*─────────────────────────────────────────────────────────── 상품관련 - goods ───────────────────────────────────────────────────────────*/ /* 장바구니 레이어팝업 goods/layer_option.html */ /* 일반 - 375 *//*height:56vh*/ .ly_pop.ly_pop_gd_custom {height:56vh;border-radius:0;box-shadow:0;width:100%;left:0;right:0;bottom:0;top:auto;position:fixed;background:none;z-index:1001;display: none;-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;backface-visibility: hidden;-webkit-transform: translateX(0%) translateY(0%);-moz-transform: translateX(0%) translateY(0%);-ms-transform: translateX(0%) translateY(0%);transform: translateX(0%) translateY(0%);} .ly_pop.ly_pop_gd_custom.ly_show {display: block;visibility: visible;background:none !important;} .ly_pop.ly_pop_gd_custom .ly_wrap {position:relative;padding:54px 0 0;margin:0;width:100% !important;height:100% !important;}/**/ .ly_pop.ly_pop_gd_custom .close_btn {right:50%;transform:translate(50%, -0%);position:absolute;right:50%;top:1px;} .ly_pop.ly_pop_gd_custom .lys_close_btn {width:104px;height:54px;background: url('../img/da_image/bg_gd_layer_close.png') no-repeat 50% 100%;background-size:100% 100%;} .ly_pop.ly_pop_gd_custom .layer_option {padding-top:24px;border-radius:5px 5px 0 0;box-shadow:0 0 49px 0 rgba(19, 27, 36, 0.33);background:#fff;box-sizing:border-box;}/*height:100% !important;*/ .ly_pop.ly_pop_gd_custom .layer_option .ly_ct2 {}/*height:100% !important;*/ .ly_pop.ly_pop_gd_custom .option_scroll {padding-bottom:65px;box-sizing: border-box;height: 100%;overflow-y: auto;-webkit-overflow-scrolling: touch;} .ly_gd_info {padding:0 15px 20px 15px;box-sizing:border-box;vertical-align:top;} .ly_gd_info .ly_gd_thumb {width:24.6%;float:left;vertical-align:top;text-align:center;position:relative;z-index:1;margin:0;box-sizing:border-box;} .ly_gd_info .ly_gd_thumb a, .ly_gd_info .ly_gd_thumb img {vertical-align:top;margin:0;} .ly_gd_info .ly_gd_thumb a {} .ly_gd_info .ly_gd_thumb img {width:auto;height:auto;max-width:100%;} .ly_gd_info .ly_gd_buytype {width:75.4%;padding-left:15px;float:right;vertical-align:top;text-align:left;box-sizing:border-box;} .ly_gd_info .ly_gd_buytype .ly_gd_sbj {font-size:15px;line-height:1em;height:1em;letter-spacing:-0.75px;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0 0 12px;padding:0;} .ly_gd_info .ly_gd_buytype .ly_gd_desc {font-size:13px;font-weight:300;line-height:1em;height:1em;letter-spacing:-0.65px;color:#777;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0 0 15px;padding:0;display:none !important;} .ly_gd_info .ly_gd_buytype .ly_gd_price {padding:0;} .ly_gd_info .ly_gd_buytype .ly_gd_price dl {font-size:0;vertical-align:top;} .ly_gd_info .ly_gd_buytype .ly_gd_price dl:after {clear:both;content:"";display:block;} .ly_gd_info .ly_gd_buytype .ly_gd_price dl + dl {} .ly_gd_info .ly_gd_buytype .ly_gd_price dt, .ly_gd_info .ly_gd_buytype .ly_gd_price dd {font-size:13px;letter-spacing:-0.65px;line-height:21px;color:#333;text-align:left;vertical-align:top;margin:0;padding:0;display:inline-block;box-sizing:border-box;} .ly_gd_info .ly_gd_buytype .ly_gd_price dt {width:50px;font-weight:300;} .ly_gd_info .ly_gd_buytype .ly_gd_price dd {width: calc(100% - 50px);} .ly_gd_info .ly_gd_buytype .ly_gd_price dd strong{font-weight:inherit;} .ly_gd_info .ly_gd_buytype .ly_gd_type {padding:8px 0 0;} .ly_gd_info .ly_gd_buytype .ly_gd_type li {line-height:27px;vertical-align:top;} .ly_gd_info .ly_gd_buytype .ly_gd_type li span {vertical-align:top;line-height:17px;font-size: 13px;font-weight: 300;letter-spacing: -1.5px;} .ly_gd_info .ly_gd_buytype .ly_gd_type li span label{vertical-align: top;} /*.ly_pop.ly_pop_gd_custom .layer_option padding-bottom:65px;}*/ .ly_pop.ly_pop_gd_custom .layer_option .popup_dn {padding:0;margin:0;} .ly_pop.ly_pop_gd_custom .layer_option .popup_dn .btn_box2 {padding:15px 0 0;margin:0;width:100%;font-size:0;vertical-align:top;background:#fff;} .ly_pop.ly_pop_gd_custom .layer_option .popup_dn .btn_box2 span {margin:0;} .ly_pop.ly_pop_gd_custom .layer_option .detail_apply_btn {height:50px;line-height:20px;padding:15px 0;font-size:18px;font-weight:500;color:#fff;font-family: 'Trirong', 'Jeju Myeongjo',serif;border-width:1px;border-style:solid;display:inline-block;vertical-align:Top;} .ly_pop.ly_pop_gd_custom .layer_option .detail_apply_btn.btn_wid_half {width:50%;} .ly_pop.ly_pop_gd_custom .layer_option .detail_apply_btn.js_btn_add_cart {background:#606367;border-color:#606367;} .ly_pop.ly_pop_gd_custom .layer_option .detail_apply_btn.js_btn_add_order {background:#1b253c;border-color:#1b253c;} .ly_pop.ly_pop_gd_custom .layer_option .detail_apply_btn.js_btn_add_cart.cart_btn {background:#1b253c;border-color:#1b253c;} .ly_pop.ly_pop_gd_custom .layer_option .detail_apply_btn.js_btn_add_cart em {font-size:16px;font-weight:400;font-family:'Jeju Myeongjo',serif;display:inline-block;vertical-align:inherit;padding-right:5px;margin:0;} .ly_pop.ly_pop_gd_custom .layer_option .regular_dn .btn_choice_regular{display: none;} /* 총 합계 */ .ly_pop.ly_pop_gd_custom .ly_repeat_buy {height:0;overflow:hidden;width:100%;padding:0;margin:0;box-sizing:border-box;} .ly_pop.ly_pop_gd_custom .option_total_display_area {} .ly_pop.ly_pop_gd_custom .popup_price {padding-bottom:0;} .ly_pop.ly_pop_gd_custom .total_price_box {padding:18px 0 15px 0;margin:15px auto 0;width: calc(100% - 30px);text-align:right; border-top:1px solid #333;} .ly_pop.ly_pop_gd_custom .total_price_box ul {display:inline-block;} .ly_pop.ly_pop_gd_custom .total_price_box ul li {} .ly_pop.ly_pop_gd_custom .total_price_box ul li dl {display:inline-block; width:100%;text-align:right;} .ly_pop.ly_pop_gd_custom .total_price_box ul li dl dt {display:inline-block; width:auto;padding-right:12px;font-size:14px;font-weight:400 !important;line-height:20px;color:#555;text-align:right; vertical-align:middle;} .ly_pop.ly_pop_gd_custom .total_price_box ul li dl dd {display:inline-block; font-size:0;line-height:20px;text-align:right;vertical-align:middle;} .ly_pop.ly_pop_gd_custom .total_price_box ul li dl dd div {vertical-align:middle;font-size:0;font-weight:500;line-height:20px;color:#1b253c;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;display:inline-block;} .ly_pop.ly_pop_gd_custom .total_price_box ul li dl dd div.total_price {font-size:23px;} .ly_pop.ly_pop_gd_custom .total_price_box ul li dl dd div.total_price b {font-size:15px;font-weight:400;color:#1b253c;font-family: 'Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;display:inline-block;vertical-align:top;line-height:18px;padding-top:2px;} .ly_ct {overflow:hidden; overflow-y:scroll; -webkit-overflow-scrolling:touch; } /* 옵션 선택 */ .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info {padding-top:0;padding-bottom:0;} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt > li:first-child {margin-top:7px;} .ly_pop.ly_pop_gd_custom .option_display_area.order_goods {padding:0 15px;box-sizing:border-box;} .ly_pop.ly_pop_gd_custom .option_total_display_area {} .ly_pop.ly_pop_gd_custom .view_order_goods {position:relative; padding:13px 15px 10px 15px; background:#f2f1ee; border-bottom:0;border-top:1px dotted #ddd;} .ly_pop.ly_pop_gd_custom .view_order_goods:first-child {border-top:0;} .ly_pop.ly_pop_gd_custom .view_order_goods dl {} .ly_pop.ly_pop_gd_custom .view_order_goods dl dt {font-size:14px;font-weight:400;letter-spacing:-0.42px;line-height:1.2em;padding:0 20px 10px 0;vertical-align:top;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd {} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd em {font-style:normal;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info {display:table; width:100%;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .count {display:table-cell; width:105px;padding:0; vertical-align:middle;font-size:0;box-sizing:border-box;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .count button {vertical-align:middle;height:30px;width:30px;display:inline-block;margin:0;background-size:30px !important;border:0;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .count button.detail_down_btn {background: url(../img/da_image/btn_minus.png) no-repeat center;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .count button.detail_up_btn {background: url(../img/da_image/btn_plus.png) no-repeat center;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .count input[type=number] {width:45px;height:30px;font-size:15px;line-height:28px;padding:0 11px;font-weight:400;margin:0;text-align:right;color:#222;vertical-align:middle;box-sizing:border-box;border:1px solid #ddd;border-left:0;border-right:0;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .right {display:table-cell; width:auto; text-align:right; vertical-align:middle;box-sizing:border-box;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .right .btn_wrap {padding:0 5px 0 0;display:inline-block;vertical-align:middle;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .right .btn_wrap ul {text-align:right;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .right .btn_wrap ul li {display:inline-block;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .right .price {padding:0;font-size:18px;line-height:20px;font-weight:500;text-align:right;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;color:#222;vertical-align:middle;display:inline-block;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .right .price:after {content:"원";line-height:18px;padding:1px 0 1px 0;font-size:15px;font-weight:400;color:#222;font-family: 'Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;box-sizing:border-box;display:inline-block;vertical-align:top;} .ly_pop.ly_pop_gd_custom .view_order_goods dl dd .price_info .right .detail_apply_del {top:12px;right:12px;width:20px;height:20px;position:absolute;display:inline-block;font-size:0;background: url(../img/da_image/btn_addgoods_del.png) no-repeat center;background-size:14px;border:none;} /* 세로 스크롤 고정 */ .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info {padding:0 15px;box-sizing:border-box;width:100%;} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt {padding:0;} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt .bn_opt {display:block; position:relative; width:100%; height:40px; border:1px solid #ddd; font-size:14px;letter-spacing:-0.42px;color:#333; text-align:left; text-indent:15px; z-index:100; background:#fff url('../img/da_image/icon_bg_select_gd.png') no-repeat 100% 0; background-size:auto 38px;padding:0;} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt .bn_opt.selected { border:1px solid #ddd;} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt > li {margin-bottom:10px;} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt li .optbx {position:relative; margin:-1px 0 0 0; border:1px solid #ddd; z-index:1; background:#ffffff;} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt li .optbx .optlst {} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt li .optbx .optlst .disabled {color:lightgray !important;} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt li .optbx .optlst li {position:relative; min-height:36px; text-indent:15px; border-bottom:1px solid #ddd; font-weight:300; font-size:14px;letter-spacing:-0.42px;color:#333; line-height:36px; vertical-align:middle;} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt li .optbx .optlst li:last-child {border-bottom:none;} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt li .optbx .optlst li > img {width:34px; height:34px;} .ly_pop.ly_pop_gd_custom .layer_option .ly_buy_info .ly_opt li .optbx .optlst li em {display:block; position:relative; padding:8px 0 7px; color:#555; word-break:break-all; z-index:30;} /* 배송비 */ .layer_option .select_box_view {padding:15px 15px 15px 15px;} .layer_option .select_box_view .bn_opt {display:block; position:relative; width:100%; height:40px; border:1px solid #ddd; font-size:14px;letter-spacing:-0.42px;color:#333; text-align:left; text-indent:15px; z-index:100; background:#fff url('../img/da_image/icon_bg_select_gd.png') no-repeat 100% 0; background-size:auto 38px;padding:0;} .layer_option .select_box_view .bn_opt.selected { border:1px solid #ddd;} .layer_option .select_box_view .optbx {position:relative; margin:-1px 0 0 0; border:1px solid #ddd; z-index:1; background:#ffffff;} .layer_option .select_box_view .optbx .optlst {} .layer_option .select_box_view .optbx .optlst li {position:relative; min-height:36px; text-indent:15px; border-bottom:1px solid #ddd; font-weight:300; font-size:14px;letter-spacing:-0.42px;color:#333; line-height:36px; vertical-align:middle;} .layer_option .select_box_view .optbx .optlst li:last-child {border-bottom:none;} .layer_option .select_box_view .optbx .optlst li > img {width:34px; height:34px;} .layer_option .select_box_view .optbx .optlst li em {display:block; position:relative; padding:8px 0 7px; color:#555; word-break:break-all; z-index:30;} /* 찜리스트 */ .layer_option .btn_wish_box {display:table; width:100%; padding:0 0 4px 0;} .layer_option .btn_wish_box li {display:table-cell; width:50%;vertical-align: top;} .layer_option .btn_wish_box li:nth-child(1) {padding:0 2px 0 0;} .layer_option .btn_wish_box li:nth-child(1) button{height:50px;} /* 멀티옵션 */ .layer_option .ly_buy_info .ly_opt li.multi_option_on {position:absolute; top:15px; left:0; z-index:103; width:calc(100% - 30px); padding:0 15px; background:#fff;} /* 싱글옵션 */ .layer_option .ly_buy_info .ly_opt li.singel_option_on {position:absolute; top:15px; left:0; z-index:103; width:calc(100% - 30px); padding:0 15px; background:#fff;} /* 추가옵션 */ .layer_option .ly_buy_info .ly_opt li.add_option_on {position:absolute; top:15px; left:0; z-index:103; width:calc(100% - 30px); padding:0 15px; background:#fff;} /* 텍스트 입력 필드 */ .layer_option .ly_buy_info .ly_opt li .option_input input {width:100%; height:34px; border:1px solid #ddd; text-indent:10px; box-sizing:border-box;} /* 추가상품 선택 */ .view_order_add_goods {position:relative; margin:15px 0 0 0; padding:5px 0 15px 0; background:#f2f1ee; border-bottom:0;border-top:1px dotted #ddd;} .view_order_add_goods:first-child {border-top:0;} .view_order_add_goods dl {} .view_order_add_goods dl dt {font-size:12px; font-weight:bold; vertical-align:middle;} .view_order_add_goods dl dt div {display:table-cell; vertical-align:middle;} .view_order_add_goods dl dt div.addname {padding:0 0 0 5px;} .view_order_add_goods dl dd {} .view_order_add_goods dl dd em {font-style:normal;} .view_order_add_goods dl dd .price_info {display:table; width:100%;} .view_order_add_goods dl dd .price_info .count {display:table-cell; width:70%;padding:5px 0 0 0; vertical-align:top;} .view_order_add_goods dl dd .price_info .count button {vertical-align:middle;} .view_order_add_goods dl dd .price_info .count input[type=number] {width:44px; height:34px; border:1px solid #c9c9c9; font-weight:bold; text-align:center; vertical-align:middle; box-sizing:border-box;} .view_order_add_goods dl dd .price_info .right {display:table-cell; width:30%; text-align:right; vertical-align:middle;} .view_order_add_goods dl dd .price_info .right .btn_wrap {padding:5px 0 0 0;} .view_order_add_goods dl dd .price_info .right .price {padding:5px 0 0 0; font-size:15px; font-weight:bold; text-align:right;} /* 스크롤 고정 */ .ly_pop.ly_pop_gd_custom .scroll_vertical_fix::-webkit-scrollbar {width:3px;border-radius:2px;background:#e6e8ee;} .ly_pop.ly_pop_gd_custom .scroll_vertical_fix::-webkit-scrollbar-thumb {width:3px;border-radius:2px;background-color:#5c6273;} @media only screen and (max-width:360px) { } @media only screen and (max-width:320px) { } /* 분류 - goods/goods_list */ /* 일반 - 375 */ .list_deps {padding: 12px 0 0;} .list_deps .deps_01 {vertical-align:top;text-align:center;font-size:0;} .list_deps .deps_01 li {font-size: 17px;letter-spacing: -0.85px;line-height: 46px;color:#888;font-weight: 400;vertical-align:top;display:inline-block;margin:0;} .list_deps .deps_01 li + li {margin-left: 36px;} .list_deps .deps_01 li a {font-size:inherit;letter-spacing:inherit;line-height:inherit;color:inherit;font-weight:inherit;vertical-align:top;display:inline-block;position:relative;z-index:1;} .list_deps .deps_01 li.on {color:#222;font-weight:500;} .list_deps .deps_01 li.on a {} .list_deps .deps_01 li.on a:before {width: 3px;height: 3px;border-radius:100%;background:#275b4e;display:inline-block;content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);} .list_deps .deps_sub {padding: 15px 0 0;} .list_deps .deps_sub .deps_02 {text-align:center;vertical-align:top;} .list_deps .deps_sub .deps_02.on {} .list_deps .deps_sub .deps_02 ul {border-radius:24px;padding: 0 10px;box-sizing:border-box;font-size:0;vertical-align:top;display:inline-block;margin:0 auto;} .list_deps .deps_sub .deps_02 ul + ul {margin-top:10px;} .list_deps .deps_sub .deps_02 ul li {font-size: 15px;line-height: 37px;height:40px;padding: 0 12px;border-radius:20px;border-width:1px;border-color:#fff;border-style:solid;letter-spacing:-0.75px;color:#888;font-weight:400;display:inline-block;vertical-align:top;border: 1px solid #cccccc;box-sizing: border-box;margin: 0 5px 10px;} .list_deps .deps_sub .deps_02 ul li + li {} .list_deps .deps_sub .deps_02 ul li a {font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;letter-spacing:inherit;} .list_deps .deps_sub .deps_02 ul li.on {color: #fff;background: #275b4e;border: 0;} .list_deps .deps_sub .deps_02 ul li.on a {} .list_deps .deps_sub .deps_02 ul li.on a span {} .list_deps .deps_sub .deps_02#dep3 ul {border-radius:0;padding:0;border-width:0;} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li {width: 75px;line-height: 20px;height: 126px;padding:0;border-radius:0;border-width:0;margin:0 0 20px;} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li.on {background:none;color:#333;} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li + li {margin-left: 15px;} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li:nth-child(n+5) {} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li .thumb {border-radius:10px;width: 75px;height: 75px;background:#f5f5f5;overflow:hidden;display:block;margin: 0 auto 10px;position:relative;z-index:1;} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li .thumb img {width:100%;} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li.first .thumb img {position:absolute;left:50%;top:50%;transform:translate(-50%, -12px);width: 24px;} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li.on .thumb:before {border-radius:10px;width:100%;height:100%;box-sizing:border-box;border:1px #333 solid;position:absolute;left:0;top:0;content:"";display:inline-block;z-index:2;} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li .thumb + span {width:100%;display:block;margin:0 auto;} .list_toggle {padding: 10px 15px 24px;text-align:right;min-height:33px;vertical-align:top;position:relative;z-index:2;} .list_toggle .navi_step {margin:0 0 0 auto;width:110px;} #wrap .list_toggle .navi_step select {font-size:14px;width:100px;border:0;border-bottom:1px solid #555;padding:5px 0;background-position:right;} .list_toggle + .goods_list_item {z-index:1;padding: 0 15px 60px;} #wrap .best_item_view {margin:0;padding: 0;} .gd_list_title {font-size: 19px;font-weight:500;line-height: 38px;letter-spacing:-1.25px;text-align:left;color:#333;border-bottom:1px #333 solid;margin: 0 0 20px;position:relative;z-index:1;} .goods_list_cont + .gd_list_title {margin-top:22px;} .gd_list_title span {display:inline-block;line-height:inherit;font-size:inherit;font-weight:inherit;color:inherit;vertical-align:top;padding:0 7px 0 0;position:relative;z-index:1;} .gd_list_title span:before {width:100%;height:1px;background:#333;position:absolute;left:0;bottom:0;display:inline-block;content:"";} @media only screen and (max-width:360px) { } @media only screen and (max-width:320px) { .list_deps .deps_sub .deps_02 ul {padding:0 6px;} .list_deps .deps_sub .deps_02 ul li {margin-left:4px;margin-right:4px;margin-bottom:8px;font-size:14px;letter-spacing:-0.7px;} .list_toggle + .goods_list_item {padding-left:10px;padding-right:10px;} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li {margin-bottom:15px;width:67.5px;} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li + li {margin-left:10px;} .goods_list .list_deps .deps_sub .deps_02#dep3 ul li .thumb {width:67.5px;height:67.5px;} } /* 분류 / 정기배송 추천키트 - goods/goods_list */ /* 일반 - 375 */ .periodical_wrap{position:relative;margin-top: 10px;} .periodical_wrap .goods_list_cont{position:relative;} #wrap .goods_list .periodical_wrap .gd_line2 .item_photo_box{display:none !important;} #wrap .goods_list .periodical_wrap .item_info_cont{width: 165px;height: 165px;padding: 20px 22px;text-align: left;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 {width:100%;margin:0;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li{position:relative;width: 100%;display:block;margin-bottom:0;padding-top: 40px;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:before{position:absolute;content:"";width: 165px;height: 165px;top: 40px;left: 0;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li + li {border-top:12px solid #eeeeee;padding-top: 40px;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(1):before{ background:#32396c;opacity:0.08;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(2):before{ background:#f2f6f4;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(3):before{ background:#f2f6f6;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(4):before{ background:#f5f5f5;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(5):before{ background:#f5f5f5;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li .item_cont {position:absolute;padding: 0;} #wrap .goods_list .periodical_wrap .item_info_cont > a{display:none;} #wrap .goods_list .periodical_wrap .item_tit_box {display:inline-block;text-align: left;position: absolute;top: 50%;transform: translateY(-50%);} #wrap .goods_list .periodical_wrap .item_tit_box .item_name{font-size: 23px;font-weight: 500;line-height: 1;height:auto;letter-spacing: -1.15px;color: #333;position: relative;overflow: visible;text-align:left;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li .item_tit_box .item_name:before{display:block; content:""; margin-bottom:12px} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(1) .item_tit_box .item_name {color:#32396c;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(2) .item_tit_box .item_name {color:#38932f;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(3) .item_tit_box .item_name {color:#2b9791;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(4) .item_tit_box .item_name {color:#404f5a;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(5) .item_tit_box .item_name {color:#917a61;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(1) .item_tit_box .item_name:before{background:url('../img/da_image/icon-periodical-01.png') no-repeat center center;background-size: 38px auto;width: 38px;height: 40.5px;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(2) .item_tit_box .item_name:before{background:url('../img/da_image/icon-periodical-02.png') no-repeat center center;background-size: 42px auto;width: 42px;height: 36px;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(3) .item_tit_box .item_name:before{background:url('../img/da_image/icon-periodical-03.png') no-repeat center center;background-size: 42px;width: 43px;height: 37px;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(4) .item_tit_box .item_name:before{background:url('../img/da_image/icon-periodical-04.png') no-repeat center center;background-size: 45px auto;width: 45px;height: 39px;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(5) .item_tit_box .item_name:before{background:url('../img/da_image/icon-periodical-05.png') no-repeat center center;background-size: 47px auto;width: 47px;height: 40px;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li .item_tit_box .item_name span {font-size:inherit;font-weight:inherit;color:inherit;position:relative;z-index:1;display: inline-block;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li .item_tit_box .item_name span:after {content:'';display:block;position:absolute;width:100%;height:7px;bottom: 1px;z-index:-1;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(1) .item_tit_box .item_name span:after {background:#32396c;opacity:0.15;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(2) .item_tit_box .item_name span:after {background:#e6dfd3;opacity:0.8;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(3) .item_tit_box .item_name span:after {background:#2b9791;opacity:0.2;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(4) .item_tit_box .item_name span:after {background:#404f5a;opacity:0.2;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:nth-child(5) .item_tit_box .item_name span:after {background:#5e4c3a;opacity:0.2;} #wrap .goods_list .periodical_wrap .item_tit_box .item_name_explain{margin: 10px 0 0;line-height: 1.4;font-size: 15px;letter-spacing: -0.68px;color: #333;max-height: 90px;font-weight:400;-webkit-line-clamp: 3;} #wrap .goods_list .periodical_wrap .item_tit_box .item_name_explain span br{display: block;} #wrap .goods_list .periodical_wrap .item_info_cont .item_tit_box .item_name_explain span.for_pc {display:none;} #wrap .goods_list .periodical_wrap .item_money_box, #wrap .goods_list .periodical_wrap .item_icon_box, #wrap .goods_list .periodical_wrap .item_link {display:none;} #wrap .goods_list .periodical_wrap .gd_line3 .item_cont{margin-bottom:0;} #wrap .periodical_wrap .periodical_items{width: 100%;display: block;z-index:5;text-align: right;padding-top: 40px;padding: 40px 15px 0;box-sizing: border-box;} #wrap .periodical_wrap .periodical_items.list02{top:865px;} #wrap .periodical_wrap .periodical_items.list03{top:1695px;} #wrap .periodical_wrap .periodical_items.list04{top:2525px;} #wrap .periodical_wrap .periodical_items.list05{top:3365px;} #wrap .periodical_wrap .goods_list_cont .periodical_items .slick-slide{height:0;padding-bottom:160px;position: relative;overflow:hidden;} #wrap .periodical_wrap .goods_list_cont .periodical_items .slick-slide img{width:100%;position: absolute;top:50%;left:50%;transform:translate(-50%, -62%);} #wrap .periodical_wrap .periodical_items .img_wrap{display: inline-block;width: 230px;height: 160px;} #wrap .periodical_wrap .periodical_items .img_wrap li img {width:100%;} #wrap .periodical_wrap .slick-dots{bottom: 10px;position: absolute;left: 50%;transform: translateX(-50%);} #wrap .periodical_wrap .slick-dots li{margin:0;display: inline-block;} #wrap .periodical_wrap .slick-dots li + li{margin-left: 10px;} #wrap .periodical_wrap .slick-dots li button{width:4px;height:4px;background: #fff;opacity: 0.6;border-radius:100%;padding:0;border: 0;font-size: 0;} #wrap .periodical_wrap .slick-dots li.slick-active button{background:#fff;width:8px;height:8px;opacity: 1;} #wrap .periodical_wrap .periodical_items .item_wrap{position:relative;display: block;width: 100%;background:url('../img/da_image/benefits_info_items_explain_bg.jpg') no-repeat center center;text-align:center;padding: 20px 0 40px;box-sizing:border-box;} #wrap .periodical_wrap .periodical_items .item_wrap span.abs{position:absolute;top: -15px;right: 2px;font-family: 'Italianno';font-size: 60px;line-height: 0.47;text-align: right;color: rgba(204, 204, 204, 0.7);} #wrap .periodical_wrap .periodical_items .item_wrap .item_tit h3{font-size: 34px; font-weight: 500; line-height: 0.88; letter-spacing: -1.7px; color: #333; margin-bottom:23px;} #wrap .periodical_wrap .periodical_items .item_wrap .item_tit h3 span{color:#275b4e;} #wrap .periodical_wrap .periodical_items .item_wrap .item_tit p{font-size: 18px; font-weight: 300; line-height: 1.44; letter-spacing: -0.72px; color: #777;} #wrap .periodical_wrap .periodical_items .item_wrap .item_tit p span{position:relative; z-index:1; color:#333;} #wrap .periodical_wrap .periodical_items .item_wrap .item_tit p span:before{position:absolute; content:""; width:100%; height:8px; background:#275b4e; left:0; bottom:1px; opacity:0.15; z-index:-1;} #wrap .periodical_wrap .periodical_items .item_wrap > ul {font-size:0;} #wrap .periodical_wrap .periodical_items .item_wrap > ul > li{width: 100%;display: block;box-sizing:border-box;vertical-align:top;} #wrap .periodical_wrap .periodical_items .item_wrap > ul > li + li{margin-top:15px; } #wrap .periodical_wrap .periodical_items .item_wrap > ul > li label{position:relative;display:inline-block;width: 100%;height: auto;border-radius: 20px;border: solid 1px #ddd;background-color: #fff;padding: 0 15px 20px;box-sizing:border-box;cursor:pointer;box-shadow: 0.75px 1.3px 9px 0 rgba(0, 0, 0, 0.23);} #wrap .periodical_wrap .periodical_items .item_wrap > ul > li label > span{display:block;margin-left:35px;font-size: 17px;font-weight: 500;line-height: 55px;letter-spacing: -0.85px;text-align: left;color: #333;} #wrap .periodical_wrap .periodical_items .item_wrap > ul > li label dl{display: table;width: 100%;border-top:1px solid #ddd;padding-top: 13px;} #wrap .periodical_wrap .periodical_items .item_wrap > ul > li label dt{display: table-cell;font-size: 14px;font-weight: 500;line-height: 1.47;letter-spacing: -0.6px;text-align: left;color: #333;margin-bottom:5px;} #wrap .periodical_wrap .periodical_items .item_wrap > ul > li label dd{display: table-cell;padding-left: 26px;} #wrap .periodical_wrap .periodical_items .item_wrap > ul > li label dd ul li {font-size: 13px;line-height: 21px;letter-spacing: -0.52px;padding-left:8px;text-align: left;color: #777;position:relative;z-index:1;} #wrap .periodical_wrap .periodical_items .item_wrap > ul > li label dd ul li:before {font-size:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;content:"-";display:inline-block;position:absolute;left:0;top:0;} #wrap .periodical_wrap .periodical_items .item_wrap .price_wrap{text-align:left;position:absolute;right: 15px;top:10px;} #wrap .periodical_wrap .periodical_items .item_wrap .price_wrap .list_price{position:relative;font-size: 12px;letter-spacing: -0.7px;color:#aaa;font-weight:400;} #wrap .periodical_wrap .periodical_items .item_wrap .price_wrap .list_price:after{position:absolute; content:""; width:105%; height:2px; background:#bbb; top:50%; margin-top:-1px; left:0; opacity:0.5;} #wrap .periodical_wrap .periodical_items .item_wrap .price_wrap .list_price strong{font-size: 12px;font-weight:400;font-family: 'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} #wrap .periodical_wrap .periodical_items .item_wrap .price_wrap .price{font-size: 15px;font-weight: 400;line-height: 2.36;letter-spacing: -0.75px;text-align: left;color: #333;} #wrap .periodical_wrap .periodical_items .item_wrap .price_wrap .price:before{display:inline-block;content:"";border: 3px solid #fff0;border-top: 3px solid #555;border-right: 3px solid #555;transform:rotate(45deg);margin: 0 10px 1px 9px;} #wrap .periodical_wrap .periodical_items.list05 .item_wrap .price_wrap .price:before{margin: 0 10px 3px 10px;} #wrap .periodical_wrap .periodical_items .item_wrap .price_wrap .price strong{font-size: 16px;font-weight:500;font-family: 'Trirong';letter-spacing: -0.7px;} #wrap .periodical_wrap input[type="radio"]{display:none;} #wrap .periodical_wrap label.check_s {min-width:32px;padding:0 0 3px 35px;min-height:25px;background: url('../img/da_image/input_check_off.png') no-repeat 15px 15px;background-size: 25px auto;} #wrap .periodical_wrap .periodical_items.list05 label.check_s{background:url('../img/da_image/input_check_off.png') no-repeat 15px 15px;background-size: 25px auto;background-color:#fff;} #wrap .periodical_wrap input:checked + label.check_s{background:url('../img/da_image/input_check_on.png') no-repeat 15px 15px;background-size: 25px auto;border:1px solid #275b4e !important;} #wrap .periodical_wrap .periodical_items.list05 input:checked + label.check_s{background:url('../img/da_image/input_check_on.png') no-repeat 15px 15px;background-size: 25px auto;background-color:#fff; border:1px solid #275b4e !important;} #wrap .periodical_wrap .periodical_items .item_wrap .btn_center{font-size:0; padding-top:20px;} #wrap .periodical_wrap .periodical_items .item_wrap .btn_center .btn_go {width:calc(50% - 7px);} #wrap .periodical_wrap .periodical_items .item_wrap .btn_center .regular_delivery_btn{background:#1b253c; color:#fff; border:0; font-family: 'Jeju Myeongjo', serif;} #wrap .periodical_wrap .periodical_items .item_wrap .btn_center .detail_btn{margin-left:10px; font-family: 'Jeju Myeongjo', serif;} /* 레이어팝업 */ .periodical_layer{display:none;} .periodical_layer .layer_con{position:fixed; width:500px; height:331px; background:#fff; top:50%; left:50%; transform:translate(-50%, -50%); z-index:999; padding:50px 0; box-sizing:border-box;} .periodical_layer .layer_con h5{font-size: 18px; line-height: 1.56; letter-spacing: -0.9px; text-align: center; color: #333; font-weight:400; margin-bottom:7px;} .periodical_layer .layer_con h5:before{display:block; content:""; width:75px; height:57px; background:url('../img/da_image/periodical_layer_icon.png') no-repeat center center; margin:0 auto; margin-bottom:25px;} .periodical_layer .layer_con p{font-size: 16px; line-height: 1.63; letter-spacing: -0.8px; text-align: center; color: #777;} .periodical_layer .layer_con .btn_center{font-size:0; padding-top:30px;} .periodical_layer .layer_con .btn_center a{display:inline-block; width:140px; height:56px; line-height:56px; font-size: 18px; font-weight: 500; letter-spacing: -0.9px; text-align: center; color: #333; box-sizing:border-box;} .periodical_layer .layer_con .btn_center .cancel_btn{border-style: solid; border-width: 1px; border-image-source: linear-gradient(to right, #aaa, #444); border-image-slice: 1; background-color: #fff;} .periodical_layer .layer_con .btn_center .ok_btn{border-style: solid; border-width: 1px; border-image-source: linear-gradient(to right, #85a19a, #275b4e); border-image-slice: 1; margin-left:10px; color:#275b4e;} .periodical_layer .layer_bg{position:fixed; width:100%; height:100%; background:#000; opacity:0.5; top:0; left:0; z-index:99} @media only screen and (max-width:370px) { #wrap .periodical_wrap .periodical_items .item_wrap > ul > li label > span{line-height:36px;padding-top:9px;} #wrap .periodical_wrap .periodical_items .item_wrap .price_wrap{position:static;} } @media only screen and (max-width:360px) { #wrap .goods_list .periodical_wrap .item_info_cont{width:160px;height:160px;padding-left:15px;padding-right:15px;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:before {width:160px;height:160px;} #wrap .goods_list .periodical_wrap .item_tit_box .item_name {font-size:22px;letter-spacing:-1.1px;} #wrap .goods_list .periodical_wrap .item_tit_box .item_name_explain {font-size:14px;letter-spacing:-0.7px;} } @media only screen and (max-width:345px) { #wrap .periodical_wrap .periodical_items .img_wrap{width:210px;} } @media only screen and (max-width:340px) { #wrap .periodical_wrap .periodical_items .img_wrap {width:210px;} #wrap .goods_list .periodical_wrap .item_info_cont{width:150px;height:150px;padding-left:10px;padding-right:10px;} #wrap .goods_list .periodical_wrap .goods_list_cont ul.gd_line2 > li:before {width:150px;height:150px;} #wrap .goods_list .periodical_wrap .item_tit_box .item_name {font-size:21px;letter-spacing:-1.05px;} #wrap .goods_list .periodical_wrap .item_tit_box .item_name_explain {font-size:14px;letter-spacing:-0.7px;} } @media only screen and (max-width:320px) { #wrap .periodical_wrap .periodical_items, #wrap .periodical_wrap .periodical_items .item_wrap > ul > li label {padding-left:10px;padding-right:10px;} } /* 맞춤 정기 배송 서비스 - goods/benefits_info */ /* 일반 - 375 */ .benefits_info{} .benefits_info .benefits_tit{text-align:center; padding-top:47px; padding-bottom:31px;} .benefits_info .benefits_tit h4{font-size:24px; font-weight:500; color:#333; letter-spacing:-1.2px; line-height:26px;} .benefits_info .benefits_tit h4 span{position:relative;display:inline-block;z-index: 1;} .benefits_info .benefits_tit h4 span:after{position:absolute;content:"";width: calc(100% + 6px);height:7.5px;background:#275b4e;opacity: 0.15;left:-3px;bottom:-2px;z-index: -1;} .benefits_info .benefits_sec02 .benefits_tit h4 span:after {bottom:1px;} .benefits_info .benefits_tit p{font-size:14px;line-height:18px; font-weight:400; color:#666; letter-spacing:-0.85px; margin-bottom:9px;} /* 정기배송 신청*/ .benefits_sec01{width:100%;background:#f5f5f5 url('../img/da_image/benefits_sec01_bg.jpg') no-repeat center 0;background-size:100% auto; box-sizing:border-box;} .benefits_sec01 .custom_delivery_list{} .benefits_sec01 .custom_delivery_list > ul{width: calc(100% - 30px);border:1px #ddd solid;background:#fff;box-sizing:border-box;box-shadow:3px 5px 9px 0 rgba(0, 0, 0, 0.23);margin:0 auto;} .benefits_sec01 .custom_delivery_list > ul:after {clear:both;content:"";display:block;} .benefits_sec01 .custom_delivery_list > ul li{position:relative;text-align:left;width:100%;background:#fff;} .benefits_sec01 .custom_delivery_list > ul li + li {border-top:1px #ddd solid;} .benefits_sec01 .custom_delivery_list > ul li > div {display:table;table-layout:fixed;width:100%;margin:0;box-sizing:border-box;border-collapse:collapse;} .benefits_sec01 .custom_delivery_list > ul li > div > span, .benefits_sec01 .custom_delivery_list > ul li > div > dl {min-height:123px;text-align:left;box-sizing:border-box;border-collapse:collapse;vertical-align:middle;display:table-cell;} .benefits_sec01 .custom_delivery_list > ul li > div > span {width:30.4%;text-align:center;font-size:0;} .benefits_sec01 .custom_delivery_list > ul li > div > span img {vertical-align:middle;width:51px;height:auto;} .benefits_sec01 .custom_delivery_list > ul li > div > dl {width:auto;padding-top:20px;padding-bottom:20px;} .benefits_sec01 .custom_delivery_list > ul li dt{font-size:16px; font-weight:500; color:#333; letter-spacing:-0.8px; line-height:20px; margin-bottom:6px;position:relative;z-index:1;display:inline-block;} .benefits_sec01 .custom_delivery_list > ul li dt:before {position:absolute;left:-2px;width:calc(100% + 4px);height:5px;background:#5b2d27;opacity:0.15;display:inline-block;content:"";bottom:-1px;z-index:-1;} .benefits_sec01 .custom_delivery_list > ul li dd{font-size:14px; font-weight:400; color:#777; letter-spacing:-0.56px;line-height:20px;display:block;} .benefits_sec01 .custom_delivery_list > ul li dd span{display:block; font-size:13px; font-weight:400; color:#732017; letter-spacing:-0.65px; margin-top:5px;} /* 정기배송 신청방법*/ .benefits_sec01 .howtoapply{padding-top:27px;} .benefits_sec01 .howtoapply .apply_wrap{width:100%;padding:15px 15px 60px; box-sizing:border-box;} .benefits_sec01 .howtoapply .apply_wrap .st_txt{position:absolute; top:-18px; left:50%; margin-left:-38px; display:inline-block; width:76px; height:36px; line-height:36px; font-size:15px; font-weight:400; color:#fff; background:#08544e; text-align:center; border-radius:22.5px; letter-spacing:-0.75px; font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif; font-style:italic;} .benefits_sec01 .howtoapply .apply_wrap .step01{position:relative; width:100%;margin:0 auto 48px;background:#fff; box-shadow:6px 5px 8px 0 rgba(0,0,0,0.23);border:1px #ddd solid;} .benefits_sec01 .howtoapply .apply_wrap .step01 ul{font-size:0; padding:40px 22px 65px;} .benefits_sec01 .howtoapply .apply_wrap .step01 li{position:relative;padding:0;box-sizing:border-box;} .benefits_sec01 .howtoapply .apply_wrap .step01 li + li:before{position:absolute; top:0;left:50%; margin-top:-25px;margin-left:-25px;content:"or"; width:50px; height:50px; background:#eee; border-radius:100%; font-size:20px; font-weight:400; letter-spacing:-1px; text-align:center; font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif; line-height:50px;} .benefits_sec01 .howtoapply .apply_wrap .step01 li + li {margin-top:55px;padding-top:50px;border-top:1px #ddd solid;} .benefits_sec01 .howtoapply .apply_wrap .st_dl{text-align:center;} .benefits_sec01 .howtoapply .apply_wrap .st_dt{font-size:20px;line-height:20px;font-weight:700; color:#333; letter-spacing:-1px; margin-bottom:8px;} .benefits_sec01 .howtoapply .apply_wrap .st_dd{position:relative; font-size:15px;line-height:23px;font-weight:300; color:#555; letter-spacing:-0.75px;} .benefits_sec01 .howtoapply .apply_wrap .st_dd:before{position:absolute; content:""; box-sizing:border-box;} .benefits_sec01 .howtoapply .apply_wrap .st_dd:after{position:absolute; content:""; box-sizing:border-box; box-shadow:4px 2px 12px 0 rgba(0,0,0,0.4);} .benefits_sec01 .howtoapply .apply_wrap .st_dd.st1_img img {width:100%;height:auto;border:3px #08544e solid;box-shadow: 3px 5px 19px 0 rgba(0, 0, 0, 0.43);} .benefits_sec01 .howtoapply .apply_wrap .st_dd.st1_img:before, .benefits_sec01 .howtoapply .apply_wrap .st_dd.st1_img:after {display:none;} .st_dd.st1_img2:after, .st_dd.st2_img:after {width:124px;height:124px;background-size:100% auto !important;border:3px solid #08544e;border-radius:100%;box-sizing:border-box;} .st_dd.st2_img:after, .st_dd.st3_img:after {left: 50%;transform:translateX(-50%);} .st_dd.st3_img:after {background-size:100% auto !important;border:3px solid #08544e;} .st_dd.st1_img2:after{background:url('../img/da_image/benefits_info_step1_img02_01.jpg') no-repeat center center;bottom:-25px;left:15px;} .st_dd.st2_img:after{background:url('../img/da_image/benefits_info_step2_img01_01.jpg') no-repeat center center;bottom:7px;} .st_dd.st3_img:after{width:280px;height:60px;background:url('../img/da_image/benefits_info_step3_img01_01.jpg') no-repeat center center;bottom:1px;} /* .st_dd.st4_img:after{width:142px;height:142px;background:url('../img/da_image/benefits_info_step4_img01_01.jpg') no-repeat center center;top:14px;left:6px;} */ .benefits_sec01 .howtoapply .apply_wrap .remainder_step ul .st_dd{font-weight:400;} .benefits_sec01 .howtoapply .apply_wrap .st_dd span:after{display:inline-block; content:""; background:url('../img/da_image/benefits_info_step_arrow.png') no-repeat center center;background-size:6px auto;width:6px; height:11px; margin:0 12px;} .benefits_sec01 .howtoapply .apply_wrap .st_dd span.end{color:#08544e; font-weight:500;} .benefits_sec01 .howtoapply .apply_wrap .st_dd span.end:after{display:none;} .benefits_sec01 .howtoapply .apply_wrap .st_dd img{margin-top:20px; border:1px solid #eee; box-sizing:border-box; max-width:100%;height:auto;} .benefits_sec01 .howtoapply .apply_wrap .remainder_step{width:100%; margin:0 auto; text-align:center;} .benefits_sec01 .howtoapply .apply_wrap .remainder_step .st_txt{} .benefits_sec01 .howtoapply .apply_wrap .remainder_step .st_txt.end{color:#fcf6cf;} .benefits_sec01 .howtoapply .apply_wrap .remainder_step ul{font-size:0;} .benefits_sec01 .howtoapply .apply_wrap .remainder_step li{padding:42px 22px 36px;position:relative; display:inline-block; width:100%;margin:0 auto;background:#fff;box-shadow:6px 5px 8px 0 rgba(0,0,0,0.23);border:1px #ddd solid;box-sizing:border-box;} .benefits_sec01 .howtoapply .apply_wrap .remainder_step li + li{margin-top:48px;} .benefits_sec01 .howtoapply .apply_wrap .remainder_step li + li:before{position:absolute; content:""; width:16px; height:31px; background:url('../img/da_image/benefits_info_step_arrow_big.png') no-repeat center center; top:0; left:-30px;} /* 두피진단 받기 */ .benefits_sec02{padding:13px 15px 60px;width:100%;box-sizing:border-box;} .benefits_info .benefits_sec02 .benefits_tit {padding-bottom:40px;position:relative;z-index:1;} .benefits_info .benefits_sec02 .benefits_tit:after {width:1px;left:50%;bottom:-11px;height:40px;background:#000;position:absolute;display:inline-block;content:"";} .benefits_info .benefits_sec02 .benefits_tit h4 {line-height:32px;} .benefits_sec02 .under_line:after{z-index:-1;position:absolute; content:""; width:100%; height:8px; background:#eceae7; left:0; bottom:-2px;} .benefits_sec02 h5{position:relative; font-size:20px; font-weight:500; color:#333; letter-spacing:-1px; line-height:20px; margin-bottom:25px;} .benefits_sec02 .txt_wrap > h6{display:inline-block; position:relative; font-size:18px; font-weight:500; color:#333; letter-spacing:-0.9px; line-height:25px; margin-bottom:20px; z-index:1;} .benefits_sec02 .txt_wrap > h6:before {display:block; content:""; width:100%;height:7.5px;background:#eceae7;left:0;position:absolute;bottom:1px;z-index:-1;margin:0;padding:0;} .benefits_sec02 .txt_wrap > p{font-size:15px; font-weight:300; color:#555; letter-spacing:-0.75px; line-height:23px; margin-bottom:21px;} .benefits_sec02 .txt_wrap .btn_self_go.btn_go {width:180px;font-size:15px;letter-spacing:-0.75px;height:50px;line-height:48px;} .benefits_sec02 .txt_wrap .btn_self_go.btn_go span {height:48px;} .benefits_sec02 .img_wrap{position:relative; z-index:1;} .benefits_sec02 .scalp_survey, .benefits_sec02 .kit_reco {width:100%;margin:0 auto;padding:30px 20px;box-shadow: 3px 6px 29px 0 rgba(0, 0, 0, 0.21);background:#fff;box-sizing:border-box;} .benefits_sec02 .scalp_survey .img_wrap, .benefits_sec02 .kit_reco .img_wrap {font-size:0;vertical-align:top;box-sizing:border-box;position:relative;z-index:1;padding-bottom:20px;margin:0 auto 21px;} .benefits_sec02 .scalp_survey .img_wrap > img, .benefits_sec02 .kit_reco .img_wrap > img {width:100%;height:auto;vertical-align:top;} .benefits_sec02 .scalp_survey .img_wrap:after, .benefits_sec02 .kit_reco .img_wrap:after {top:20px;display:inline-block;content:"";position:absolute;z-index:-1;width: calc(100% + 20px);height: calc(100% - 20px);background:#f4f2f0;} .benefits_sec02 .scalp_survey .txt_wrap{} .benefits_sec02 .scalp_survey{margin-bottom:20px;} .benefits_sec02 .scalp_survey .txt_wrap{width: calc(100% + 5px);margin-right:-5px;} .benefits_sec02 .scalp_survey .img_wrap {padding-right:20px;} .benefits_sec02 .scalp_survey .img_wrap:after{left:-20px;} .benefits_sec02 .kit_reco{} .benefits_sec02 .kit_reco .img_wrap{padding-left:20px;} .benefits_sec02 .kit_reco .img_wrap:after{right:-20px;} .benefits_sec02 .kit_reco .img_wrap .icon_wrap{position:absolute; left:0px; top:-14px;width:75px; height:75px; background:#08544e; border-radius:100%; text-align:center; box-shadow:2px 1.7px 0 rgba(0,0,0,0.23);} .benefits_sec02 .kit_reco .img_wrap .icon_wrap span{display:block; padding-top:12px; padding-bottom:4px;height:25px;width:38px;margin:0 auto;vertical-align:top;} .benefits_sec02 .kit_reco .img_wrap .icon_wrap span img {width:100%;height:auto;vertical-align:top;} .benefits_sec02 .kit_reco .img_wrap .icon_wrap p{font-size:11px; font-weight:300; color:#fff; letter-spacing:-0.55px; line-height:14px;} .benefits_sec02 .kit_reco .img_wrap .outline_txt{display:block; position:absolute; font-family:'Italianno'; font-size:40px; letter-spacing:1px; color:#ddd; opacity:0.6; left:-170px; top:60%; transform:translateY(-50%) rotate(-90deg);} .benefits_sec02 .kit_reco .txt_wrap{text-align:right;} /* 정기배송 FAQ */ .benefits_sec03{padding-top:13px;background:url('../img/da_image/benefits_sec03_bg.jpg') no-repeat center 0;background-size:100% auto;width:100%;} .benefits_sec03 .faq_list {padding:0 15px 60px;box-sizing:border-box;} .benefits_sec03 .faq_list ul{width:100%;box-shadow: 3.75px 5.5px 29px 0 rgba(0, 0, 0, 0.21);} .benefits_sec03 .faq_list li{background:#fff;} .benefits_sec03 .faq_list li:nth-child(even){background:#eef2f1;} .benefits_sec03 .faq_list dl{padding:25px 15px 22px;} .benefits_sec03 .faq_list dt{position:relative; font-size:16px; font-weight:500; color:#333; letter-spacing:-0.8px; margin-bottom:10px; padding-left:35px;} .benefits_sec03 .faq_list dt span, .benefits_sec03 .faq_list dd span {position:absolute; display:inline-block; width:25px; height:25px; line-height:25px; font-size:13px; letter-spacing: -0.66px;font-family: 'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif; color:#fff; text-align:center; border-radius:100%;} .benefits_sec03 .faq_list dt span{background:#3c6b5f; margin-right:12px; top:0; left:0;} .benefits_sec03 .faq_list dd{position:relative;font-size:14px;font-weight:400;color:#666;letter-spacing:-0.7px;padding-left:65px;line-height: 20px;} .benefits_sec03 .faq_list dd span{background:#27282c; margin-right:10px; top:0; left:30px;} .benefits_sec03 .faq_list dd span:before{position:absolute; content:""; border:1px solid #fff0; border-left:1px solid #ccc; border-bottom:1px solid #ccc; width:10px; height:10px; left:-20px; top:4px;box-sizing:border-box;} .benefits_sec03 .faq_list .kit_btn.btn_self_go.btn_go {width:100%;margin-top:24px;height:50px;line-height:48px;font-size:15px;letter-spacing:-0.75px;} .benefits_sec03 .faq_list .kit_btn.btn_self_go.btn_go span {height:48px;} .benefits_sec03 .faq_list .kit_btn.btn_self_go.btn_go em {display:inline-block;position:relative;z-index:1;font-size:inherit;letter-spacing:inherit;font-weight:inherit;color:#3c6b5f;background:none;padding:0;} .benefits_sec03 .faq_list .kit_btn.btn_self_go.btn_go em:after{position:absolute; content:""; width:100%; height:1px; background:#3c6b5f; left:0; bottom:15px;} @media only screen and (max-width:360px) { .benefits_sec03{background-size:cover;} } @media only screen and (max-width:320px) { .benefits_sec01 .custom_delivery_list > ul{width: calc(100% - 20px);} .benefits_sec01 .howtoapply .apply_wrap, .benefits_sec02, .benefits_sec03 .faq_list dl {padding-left:10px;padding-right:10px;} .benefits_sec02 .scalp_survey, .benefits_sec02 .kit_reco {padding-left:15px;padding-right:15px;} .benefits_sec02 .scalp_survey .img_wrap, .benefits_sec02 .kit_reco .img_wrap {padding-bottom:15px;} .benefits_sec02 .scalp_survey .img_wrap {padding-right:15px;} .benefits_sec02 .kit_reco .img_wrap {padding-left:15px;} .benefits_sec02 .scalp_survey .img_wrap:after, .benefits_sec02 .kit_reco .img_wrap:after {width: calc(100% + 15px);height: calc(100% - 15px);} .benefits_sec02 .scalp_survey .img_wrap:after {left:-15px;} .benefits_sec02 .kit_reco .img_wrap:after {right:-15px;} .benefits_sec01 .howtoapply .apply_wrap .remainder_step li {padding-left:20px;padding-right:20px;} } /* 베스트 - 기획전 그룹형 */ /* 일반 - 375 */ .gd_sale_tab_wrap {} .sale_tab_list {border-bottom:1px #ddd solid;background:#fff;padding:25px 26px 0;text-align:center;font-size:0;vertical-align:top;box-sizing:border-box;} .sale_tab_list li {width:40.3%;display:inline-block;vertical-align:top;} .sale_tab_list li + li {width:59.7%;} .sale_tab_list li a {font-size:16px;line-height:16px;padding:13px 5px 6px;color:#888;box-sizing:border-box;display:inline-block;vertical-align:top;position:relative;z-index:1;font-family:'Jomolhari';} .sale_tab_list li.on {} .sale_tab_list li.on a {color:#333;} .sale_tab_list li.on a:before, .sale_tab_list li.on a:after {display:inline-block;content:"";position:absolute;left:50%;transform:translateX(-50%);z-index:2;} .sale_tab_list li.on a:before {background:#275b4e;width:3px;height:3px;border-radius:100%;top:0;} .sale_tab_list li.on a:after {background:#333;width:100%;height:1px;bottom:-1px;} .sale_tab_wrap {background:#f5f5f5 url(../img/da_image/bg_event_goods.gif) no-repeat 50% 0;background-size:100% auto;text-align:center;} .sale_tab_wrap > .w_custom {padding-top:50px;padding-bottom:49px;} .sale_tab_wrap .goods_event_sale_cont {padding:0;counter-reset: event-count;} .sale_tab_wrap .goods_event_sale_cont .item-display-wrap {display:none;} .sale_tab_wrap .goods_event_sale_cont .gd_display_list {counter-increment: event-count;padding-left:15px;padding-right:15px;padding-bottom:40px;margin-bottom:20px;box-shadow: 3.25px 5.8px 28px 0 rgba(0, 0, 0, 0.21);background:#fff;box-sizing:border-box;} .sale_tab_wrap .goods_event_sale_cont .gd_list_tit_event {margin:0;padding:0 0 25px;position:relative;z-index:1;border:0;} .sale_tab_wrap .goods_event_sale_cont .goods_list_tit.gd_list_tit_event + .goods_list_cont {margin:0;padding:0 0 120px;} .sale_tab_wrap .goods_event_sale_cont .goods_list_tit.gd_list_tit_event h3 {padding:35px 0 0 31px;line-height:27px;margin:0;text-align:left;position:relative;z-index:1;box-sizing:border-box;} .sale_tab_wrap .goods_event_sale_cont .goods_list_tit.gd_list_tit_event:before {width:100%;height:1px;bottom:48px;left:0;position:absolute;z-index:2;display:inline-block;content:"";} .sale_tab_wrap .goods_event_sale_cont .goods_list:nth-of-type(odd) .goods_list_tit.gd_list_tit_event:before {background: linear-gradient(90deg, rgba(68,68,68,1) 0%, rgba(170,170,170,1) 100%);}/*linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(238,238,238,1) 100%);*/ .sale_tab_wrap .goods_event_sale_cont .goods_list:nth-of-type(even) .goods_list_tit.gd_list_tit_event:before {background: linear-gradient(90deg, rgba(238,238,238,1) 0%, rgba(0,0,0,1) 100%);} .sale_tab_wrap .goods_event_sale_cont .goods_list_tit.gd_list_tit_event h3:after {clear:both;content:"";display:block;} .sale_tab_wrap .goods_event_sale_cont .goods_list_tit h3:before {font-size:19px;font-weight:500;font-style:italic;line-height:inherit;letter-spacing:-0.95px;width:31px;top:35px;margin:0;text-align:left;color:#333;content: "0" counter(event-count);display:inline-block;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;vertical-align:top;position:absolute;left:0;} .sale_tab_wrap .goods_event_sale_cont .goods_list_tit h3 strong {font-size:19px;line-height:27px;letter-spacing:-0.95px;padding:0 0 10px;width:100%;font-weight:400;text-align:left;color:#333;font-family: 'Jeju Myeongjo', serif;display:inline-block;margin:0;position:relative;z-index:1;} .sale_tab_wrap .goods_event_sale_cont .goods_list_tit h3 strong:after {width:20px;background:#333;height:1px;left:0;bottom:0;display:inline-block;content:"";position:absolute;} .sale_tab_wrap .goods_event_sale_cont .js_main_wrap_7_2 .goods_list_tit h3 strong {width:83%;} .sale_tab_wrap .goods_event_sale_cont .goods_list_tit h3 span {padding:15px 0 0;width:calc(100% + 2.5px);text-align:left;display:inline-block;margin:0;vertical-align:top;font-size:0;color:#777;margin-left:-2.5px;} .sale_tab_wrap .goods_event_sale_cont .goods_list_tit h3 span em {height:28px;line-height:28px;padding:0 6px;font-size:15px;letter-spacing:-0.75px;font-weight:300;background:#f5f5f5;display:inline-block;margin:0;vertical-align:top;margin:0 2.5px 5px 2.5px;} #wrap .sale_tab_wrap .goods_event_sale_cont .goods_list .goods_list_cont .item_group_type > ul > li:nth-of-type(odd) {} #wrap .sale_tab_wrap .goods_event_sale_cont .goods_list .goods_list_cont .item_group_type > ul > li:nth-of-type(even) {padding-top:122px;} .gd_sale_bnr {margin-top:60px;margin-bottom:60px;position:relative;z-index:1;text-align:center;position:relative;z-index:1;} .gd_sale_bnr.w_custom {} .gd_sale_bnr > a {position:absolute;left:50%;top:50%;display:block;width:100%;height:100%;z-index:5;transform:translate(-50%, -50%);} .gd_sale_bnr > img{width:100%;} .gd_sale_bnr .txt {width: calc(100% - 40px);text-align:left;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);z-index:3;} .gd_sale_bnr.w_custom > a {width: calc(100% - 30px);} .gd_sale_bnr.w_custom .txt {width: calc(100% - 70px);} .gd_sale_bnr .txt h3, .gd_sale_bnr .txt p {margin:0;padding:0;vertical-align:top;color:#333;} .gd_sale_bnr .txt h3 {font-size:19px;font-weight: 500;line-height:20px;letter-spacing: -0.95px;} .gd_sale_bnr .txt p {margin-top:12px;margin-bottom:16px;font-size:13px;font-weight:300;line-height:20px;letter-spacing:-0.65px;color:#666;} .gd_sale_bnr .txt .btn_review_more {} .gd_sale_bnr .txt .btn_review_more a {font-size:12px;line-height:18px;letter-spacing:0px;color:#555;font-family: 'Roboto','Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .gd_sale_bnr .txt .btn_review_more span {} .gd_sale_bnr .txt .btn_review_more a span:before {background:#fff;opacity:0.5;} .gd_sale_bnr .txt .btn_review_more a span:after {} .gd_sale_bnr .thumb {position:relative;z-index:1;width:100%;vertical-align:top;font-size:0;margin:0 auto;} .gd_sale_bnr.w_custom .thumb {max-width:1200px;} .gd_sale_bnr .thumb img {width:100%;height:auto;vertical-align:top;} .gd_sale_movie {background:url(../img/da_image/bg_event_movie.jpg) no-repeat 50% 50%;background-size:cover;width:100%;margin:0;padding:50px 15px;box-sizing:border-box;} .gd_sale_movie .w_custom {padding-top:20px;padding-bottom:20px;background:#fff;} .gd_sale_movie .embed-container {position:relative;padding:56.3% 0 0 0;height:0;overflow:hidden;width:100%;margin:0 auto;box-sizing:border-box;z-index:1;} .gd_sale_movie .embed-container .btn_play {width:50px;height:50px;border-radius:100%;background:#fff url(../img/da_image/icon_play_arrow.png) no-repeat 50% 50%;background-size:50px auto;position:absolute;left:50%;top:50%;z-index:2;display:inline-block;text-align:center;transform:translate(-50%, -50%);cursor:pointer;} .gd_sale_movie .embed-container iframe, .gd_sale_movie .embed-container object, .gd_sale_movie .embed-container embed {position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:100%;height:100%;} @media only screen and (max-width:360px) { .sale_tab_list {padding-left:22px;padding-right:22px;} } @media only screen and (max-width:320px) { .gd_sale_movie, .sale_tab_wrap .goods_event_sale_cont .gd_display_list {padding-left:10px;padding-right:10px;} .sale_tab_wrap .goods_event_sale_cont .goods_list_tit.gd_list_tit_event h3 {padding-left:25px;} .sale_tab_wrap .goods_event_sale_cont .goods_list_tit h3 span em {font-size:13px;letter-spacing:-0.65px;height:26px;line-height:26px;padding:0 5px;} .gd_sale_bnr {margin-top:60px;margin-bottom:60px;} .gd_sale_bnr > a {width: calc(100% - 20px);} .gd_sale_bnr .txt {width: calc(100% - 50px);} } /* 전체제품 맵 - goods/goods_all */ /* 일반 - 375 */ .gd_all_map {padding-top:46px;margin:0 auto;} .gd_all_map > h3 {font-size:23px;font-weight:500;line-height:31px;letter-spacing:-1.15px;text-align:center;color:#333;} .gd_all_map > h3 b {font-size:inherit;font-weight:inherit;line-height:inherit;color:inherit;display:inline-block;vertical-align:top;position:relative;z-index:1;} .gd_all_map > h3 b:before {opacity:0.2;background-color:#bb9284;height:8px ;width:100%;bottom:0;left:0;position:absolute;display:inline-block;content:"";z-index:-1;} .gd_all_map > p {margin:16px auto 27px;font-size:15px;font-weight:300;line-height:21px;letter-spacing:-0.75px;text-align:center;color:#333;} .all_map_wrap {padding:30px 15px 0;border-top:12px #eee solid;position:relative;z-index:1;box-sizing:border-box;} .map_thaed {padding:0 0 25px;} .map_thaed .map_thead_tr {font-size:0;vertical-align:top;text-align:center;} .map_thaed .map_thead_tr > li {width:27.5%;display:inline-block;vertical-align:top;} .map_thaed .map_thead_tr > li:nth-of-type(2) {width: calc(29% - 5px);} .map_thaed .map_thead_tr > li:nth-of-type(3) {width: calc(17.5% - 5px);} .map_thaed .map_thead_tr > li:nth-of-type(4) {width: calc(26% - 5px);} .map_thaed .map_thead_tr > li + li {margin-left:5px;} .map_thaed .map_thead_tr > li > span {font-size:15px;letter-spacing:-0.75px;line-height:25px;height:35px;border-radius:35px;padding:5px 0;font-weight:400;background:#eee;color:#555;display:inline-block;vertical-align:top;position:relative;z-index:1;box-sizing:border-box;width:100%;} .map_thaed .map_thead_tr > li.on {} .map_thaed .map_thead_tr > li.on > span {background:#2d3348;color:#fff;} .map_thaed .map_thead_tr > li.on > span:before {border-top:4px solid transparent;border-right:4px solid #2d3348;border-bottom:4px solid transparent;transform:translate(-50%, 0) rotate(-90deg);bottom:-6px;width:0;height:0;display:inline-block;content:"";position:absolute;left:50%;} .map_tbody {} .map_tbody > .map_tbody_tr {height:0;overflow:hidden;width:100%;margin:0 auto;padding:0;counter-reset:step-number;} .map_tbody > .map_tbody_tr.on {height:auto;overflow:inherit;} .map_tbody .map_tbody_td {counter-increment:step-number;box-shadow:4px 2px 11px 0 rgba(0, 0, 0, 0.25);background:#fff;border-radius:5px;margin:0 auto;box-sizing:border-box;} .map_tbody .map_tbody_td + .map_tbody_td {margin-top:15px;} .map_tbody .map_tbody_td dt, .map_tbody .map_tbody_td dd {margin:0;padding:0;vertical-align:top;box-sizing:border-box;width:100%;display:block;text-align:center;} .map_tbody .map_tbody_td dt {line-height:27px;padding:14px 0;border-radius:5px 5px 0 0;} .map_tbody .map_tbody_td dt:before, .map_tbody .map_tbody_td dt strong, .map_tbody .map_tbody_td dt span {color:#fff;margin:0;padding:0;display:inline-block;vertical-align:top;box-sizing:border-box;} .map_tbody .map_tbody_td dt:before {content:'Step ' counter(step-number);border-radius:21px;height:21px;line-height:19px;width:55px;font-size:13px;margin-top:3px;margin-bottom:3px;font-weight:300;font-style:italic;border-width:1px;border-color:rgba(255,255,255,0.5);border-style:solid;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;} .map_tbody .map_tbody_td dt strong {font-size:23px;line-height:27px;font-weight:700;letter-spacing:-1.15px;position:relative;z-index:1;margin-left:15px;} .map_tbody .map_tbody_td dt strong:before {height:7px;opacity:0.3;left:-3px;width: calc(100% + 6px);bottom:-1px;background:#fff;display:inline-block;content:"";position:absolute;} .map_tbody .map_tbody_td dt span {font-size:14px;line-height:17px;padding-top:5px;padding-bottom:5px;font-weight:300;letter-spacing:-0.7px;margin-left:17px;} .map_tbody .map_tbody_td.map_lines01 dt {background:#56b87f;}/*스케일링*/ .map_tbody .map_tbody_td.map_lines02 dt {background:#51b7ac;}/*샴푸*/ .map_tbody .map_tbody_td.map_lines03 dt {background:#6ca9c2;}/*스칼프팩*/ .map_tbody .map_tbody_td.map_lines04 dt {background:#da9099;}/*트리트먼트*/ .map_tbody .map_tbody_td.map_lines05 dt {background:#6188b9;}/*토닉*/ .map_tbody .map_tbody_td.map_lines06 dt {background:#c7afa5;}/*앰플*/ .map_tbody .map_tbody_td.map_lines07 dt {background:#89959d;}/*세럼*/ .map_tbody .map_tbody_td.map_lines08 dt {background:#81a5bf;}/*이너케어*/ .map_tbody .map_tbody_td dd {border-radius:0 0 5px 5px;padding:15px;} .map_gd {width:100%;position:relative;z-index:2;margin:0;box-sizing:border-box;cursor:pointer;} .map_gd .map_gd_box {width:100%;display:table;margin:0 auto;border-collapse:collapse;table-layout:fixed;box-sizing:border-box;border:0;} #wrap .map_gd .item_photo_box, #wrap .map_gd .item_info_cont {padding:0;box-sizing:border-box;display:table-cell !important;vertical-align:middle;border-collapse:collapse;} #wrap .map_gd .item_photo_box {width:35%;height:auto;text-align:center;} #wrap .map_gd .item_photo_box > a{display: block;width:100%;height:100%;position: absolute;top:0;left:0;} #wrap .map_gd .item_photo_box img.middle {width:auto;height:auto;max-width:100%;max-height: 150px;margin:0 auto;vertical-align:middle;} #wrap .map_gd .item_info_cont {padding-left:15px;width:auto;text-align:left;} #wrap .map_gd .item_info_cont > a{height:100%;z-index:1;} #wrap .map_gd .item_info_cont .item_tit_box {text-align:left;} #wrap .map_gd .item_info_cont .item_tit_box .item_name {width:100%;margin:0;height:auto;font-weight:500;} #wrap .map_gd .item_info_cont .item_tit_box .item_name em {font-size:17px;line-height:23px;max-height:46px;letter-spacing:-0.85px;color:#333;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;} #wrap .map_gd .item_info_cont .item_tit_box .item_volume {padding:10px 0 36px;font-size:0;vertical-align:top;text-align:left;margin:0;} #wrap .map_gd .item_info_cont .item_tit_box .item_volume li {list-style:none;line-height:20px;padding:3px 0;margin:0;text-align:left;} #wrap .map_gd .item_info_cont .item_tit_box .item_volume li:before {display:none;} #wrap .map_gd .item_info_cont .item_tit_box .item_volume li span, #wrap .map_gd .item_info_cont .item_tit_box .item_volume li strong, #wrap .map_gd .item_info_cont .item_tit_box .item_volume li em {font-weight:400;display:inline-block;vertical-align:top;margin:0;padding:0;} #wrap .map_gd .item_info_cont .item_tit_box .item_volume li span {font-size:14px;line-height:18px;padding-top:2px;color:#555;margin-right:17px;font-family:'Roboto';} #wrap .map_gd .item_info_cont .item_tit_box .item_volume li strong {font-size:16px;line-height:20px;font-weight:500;letter-spacing:-0.48px;color:#333;font-family:'Roboto';} #wrap .map_gd .item_info_cont .item_tit_box .item_volume li em {font-size:12px;line-height:20px;padding-top:0;letter-spacing:-0.36px;} #wrap .map_gd .item_info_cont .item_link {position: relative;z-index:10;} #wrap .map_gd .item_info_cont .item_link span, #wrap .map_gd .item_info_cont .item_link img {display:inline-block;vertical-align:top;} #wrap .map_gd .item_info_cont .item_link > a, #wrap .map_gd .item_info_cont .item_link button {width:auto !important;height:19px;line-height:19px;border-radius:0;text-align:left;vertical-align:top;margin:0;padding:0;background:none;} #wrap .map_gd .item_info_cont .item_link > a span {display:none;} #wrap .map_gd .item_info_cont .item_link > a img, #wrap .map_gd .item_info_cont .item_link > button img {width:auto;vertical-align:top;margin:0 auto;} #wrap .map_gd .item_info_cont .item_link > button.btn_basket_cart {margin-left:15px;margin-right:15px;} #wrap .map_gd .item_info_cont .item_link > a.btn_basket_go img {height:18px;} #wrap .map_gd .item_info_cont .item_link > button.btn_basket_cart img {height:19px;} #wrap .map_gd .item_info_cont .item_link > button.btn_basket_get img {height:16px;margin-top:2px;} @media only screen and (max-width:360px) { } @media only screen and (max-width:320px) { .all_map_wrap {padding-left:10px;padding-right:10px;} #wrap .map_gd .item_info_cont {padding-left:10px;} } /* 검색 - goods/goods_search */ /* 일반 - 375 */ /* ------------- 상품검색 페이지 ------------- */ #wrap .content .board_title.search_title h2{font-family:'Jomolhari';} .goods_search {padding:0 15px;} .goods_search_box{margin:0 0 40px 0;border:0;padding: 20px 15px 20px 15px;background:#f5f5f5;box-sizing:border-box;text-align:left;} /* 결과 내 재검색 */ #wrap .search_again_box{padding: 0;text-align:left;box-sizing:border-box;} #wrap .search_again_box:after {clear:both;content:"";display:block;} #wrap .search_again_box > .form_element{margin:10px 0 0 0;vertical-align:middle;display:inline-block;float: left;} #wrap .search_again_box > .form_element.form_custom label.check_s {font-size: 13px;line-height:23px;padding-left:33px;letter-spacing: -0.65px;color: #666;} #wrap .search_again_box > .clear {font-size:0;vertical-align:top;} #wrap .goods_search_box dl.search_cate_box {text-align:left;font-size:0;vertical-align:top;padding-right: 0;box-sizing:border-box;} #wrap .goods_search_box dl.search_cate_box dt {font-size: 15px;letter-spacing: -0.75px;color:#333;font-weight: 500;line-height: 1;height: auto;display: block;vertical-align:top;margin-bottom: 10px;} #wrap .goods_search_box dl.search_cate_box dd {line-height:50px;height: auto;width: 100%;display: block;vertical-align:top;} #wrap .goods_search_box dl.search_cate_box dd .select_box {margin:0;width: calc(50% - 3px);vertical-align:top;display:inline-block;} #wrap .goods_search_box dl.search_cate_box dd .select_box:nth-of-type(n + 3) {display:none;} #wrap .goods_search_box dl.search_cate_box dd .select_box:nth-of-type(2) {margin-left: 5px;} #wrap .goods_search_box dl.search_cate_box dd .select_box select {line-height: 40px;width:100% !important;background-position: right 15px center;font-size: 14px;letter-spacing: -0.7px;line-height: 43px;padding: 0 33px 0 13px;} #wrap .goods_search_box dl.search_cate_box dd .select_box {} #wrap .goods_search_cont .chosen-container {} #wrap .goods_search_cont .chosen-single {height:42px;color:#555;line-height:22px;padding:9px 0 9px 15px;box-sizing:border-box;} #wrap .goods_search_cont .chosen-single > span {line-height:22px;height:22px;font-size:14px;letter-spacing:-0.7px;color:#555;font-weight:400;margin-right:39px;} #wrap .goods_search_cont .chosen-container-single .chosen-single div {right:8px;} #wrap .goods_search_cont .chosen-container-single .chosen-single div b {background: url(../img/da_image/select_arr_search.gif) no-repeat 0 -4px;} #wrap .goods_search_cont .chosen-container .chosen-drop {} #wrap .goods_search_cont .chosen-container .chosen-results {font-size:16px;letter-spacing:-0.8px;color:#333;font-weight:400;padding-bottom:8px;} #wrap .goods_search_cont .chosen-container .chosen-results li {line-height:20px;} #wrap .goods_search_cont .goods_search_box .chosen-single {height:50px;color:#333;line-height:30px;padding-left:19px;} #wrap .goods_search_cont .goods_search_box .chosen-single > span {line-height:30px;height:30px;font-size:16px;letter-spacing:-0.8px;color:#333;} #wrap .goods_search_cont .goods_search_box .chosen-container-single .chosen-single div {right:13px;} #wrap .goods_search_cont .goods_search_box .chosen-container-single .chosen-single div b {background-position:0 0;} #wrap .search_again_box .keyword-div {margin-left: 0;margin-bottom: 15px;} #wrap .search_again_box .keyword-div select {width: 92px;font-size: 14px;background-position: right 15px center;padding: 0 33px 0 13px;} #wrap .search_again_box .keyword-div .keyword_input {width: calc(100% - 97px);height: 45px;font-size: 14px;line-height: 45px;letter-spacing: -0.7px;color: #999;font-weight:400;padding: 6px 13px;text-align:left;border:1px #ccc solid;background:#fff;box-sizing: border-box;margin: 0;vertical-align: top;margin-left: 5px;} #wrap .search_again_box .keyword-div .keyword_input:placeholder {font-size:14px;letter-spacing:-0.7px;font-weight:400;color:#999;} #wrap .search_again_box .keyword-div .keyword_input::placeholder {font-size:14px;letter-spacing:-0.7px;font-weight:400;color:#999;} #wrap .search_again_box .keyword-div .keyword_input:-webkit-input-placeholder {font-size:14px;letter-spacing:-0.7px;font-weight:400;color:#999;} #wrap .search_again_box .keyword-div .keyword_input:-ms-input-placeholder {font-size:14px;letter-spacing:-0.7px;font-weight:400;color:#999;} #wrap .search_again_box .btn_goods_search {width: 100%;height: 50px;padding: 0;line-height: 50px;text-align:center;border:0;background:#275b4e;margin: 0;box-sizing:border-box;} #wrap .search_again_box .btn_goods_search em {display:inline-block;padding:0 0 0 28px;line-height: 48px;font-size: 15px;font-weight: 400;letter-spacing: -0.75px;color:#fff;margin:0 auto;vertical-align:top;background: url(../img/da_image/icon_search.png) no-repeat 0 15px;background-size: 19px auto;font-family: 'Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} /* 인기 검색어 */ #wrap .search_hot_list{padding:10px 0 10px 0; font-size:0; text-align:center; border-top:1px solid #dbdbdb;} #wrap .search_hot_list .search_hot_tit{display:inline-block; margin:0 10px 0 0; padding:3px 5px 5px 5px; color:#ffffff; font-size:11px; background:#999999; line-height:1;} #wrap .search_hot_list ul{display:inline-block; font-size:12px;} #wrap .search_hot_list ul li{display:inline-block;vertical-align:middle;} #wrap .search_hot_list ul li a{display:block; height:11px; padding:0 5px 0 5px; border-left:1px solid #cccccc;} #wrap .search_hot_list ul li a span{position:relative; top:-5px;} /* #wrap .search_hot_list ul li a span:hover{border-bottom:1px solid #333333;} */ #wrap .search_hot_list ul li:first-child a{border-left:none 0;} #wrap .search_again_box .chosen-container{font-size:12px; text-align:left;} #wrap .search_again_box .keyword_input{width:230px;} /* 검색결과 텍스트 */ #wrap .search_text_result{display:block;text-align:center;padding: 0 0 20px 0;font-size: 17px;line-height: 1.06;letter-spacing: -0.85px;font-weight: 300;margin:0 auto;color:#333;font-family:'Noto Sans KR';} #wrap .search_text_result p{font-size:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;} #wrap .search_text_result p strong {font-size:inherit;font-weight:500;letter-spacing:inherit;line-height:inherit;color:#333} #wrap .search_text_result .paycosearch-banner {display:inline-block;float:none;padding-top:2px;} /* 페이코 배너 */ #wrap .goods_search .tit .payco_banner {position:absolute; top:22px; right:10px;} #wrap .goods_search .tit .payco_banner img {} #wrap .goods_search .goods_search_category {} #wrap .goods_search .goods_search_category ul {font-size:0;} #wrap .goods_search .goods_search_category ul li {display:inline-block; vertical-align:top; } #wrap .goods_search .goods_search_category ul li a {display:inline-block; padding:5px 8px 5px 8px; font-size:14px;} #wrap .goods_search .goods_search_category ul li.selected a {font-weight:bold; } #wrap .goods_search .goods_search_content {} #wrap .goods_search .goods_search_content .goods_top_box {padding: 20px 0;background: #fff;border-top: 1px solid #333;} #wrap .goods_search .goods_search_content .goods_top_box .goods_arr_box {display:table; width:100%; } #wrap .goods_search .goods_search_content .goods_top_box .goods_arr_box .prd_num {font-size:15px;line-height:40px;font-weight:400;color:#444;letter-spacing:-0.75px;} #wrap .goods_search .goods_search_content .goods_top_box .goods_arr_box .prd_num span {font-size:inherit;font-weight:500;color:#275b4e;line-height:inherit;} #wrap .goods_search .goods_search_content .goods_top_box .goods_arr_box .goods_sort {display:table-cell;width: 125px;vertical-align:middle;} #wrap .goods_search .goods_search_content .goods_top_box .goods_arr_box .goods_sort .inp_sel {width: 125px;} #wrap .goods_search .goods_search_content .goods_top_box .goods_arr_box .goods_sort .inp_sel select {height:40px;line-height: 39px;background: #fff url('../img/da_image/select_arr.png')no-repeat right 15px center;background-size: auto 6px;font-size: 14px;} #wrap .goods_search .goods_search_content .goods_top_box .goods_arr_box .goods_view_type {display:table-cell; width:50%; text-align:right; vertical-align:middle;} #wrap .goods_search .goods_search_content .goods_top_box .goods_arr_box .goods_view_type ul {font-size:0; text-align:right;} #wrap .goods_search .goods_search_content .goods_top_box .goods_arr_box .goods_view_type ul li {display:inline-block; padding:0 0 0 4px;} #wrap .goods_search .goods_search_content .goods_top_box .goods_arr_box .goods_view_type ul li button {display:inline-block; width:31px; height:31px; font-size:0; border:1px solid #cfcfcf;} #wrap .goods_search .item_info_cont {text-align:center;} #wrap .goods_search .item_money_box {margin-top:15px;} #wrap .goods_search .item_tit_box .item_brand, #wrap .goods_search .item_tit_box .item_name, #wrap .goods_search .item_tit_box .item_name_explain {text-align:center;} #wrap .goods_search .btn_box {padding:0;} @media only screen and (max-width:360px) { } @media only screen and (max-width:320px) { .goods_search, .goods_search_box {padding-left:10px;padding-right:10px;} } /* 상세 - goods/goods_view */ /* 일반 - 375 */ #wrap .goods_view .detail_tab_info{display: none;} #wrap .goods_view .cont_detail{padding:0;width:100%;box-sizing:border-box;} #wrap .goods_view_image_slider .slick-dots{position: absolute;bottom:16px;width:100%;text-align: center;} #wrap .goods_view_image_slider .slick-dots li{margin:0 5px;} #wrap .goods_view_image_slider .slick-dots li button{width:4px;height:4px;box-sizing:border-box;border-radius:100%;background:#ccc;opacity:0.8;} #wrap .goods_view_image_slider .slick-dots li.slick-active button{width:6px;height:6px;background:#fff;opacity:1;} #wrap .detail_info{width:100%;box-sizing:border-box;padding:20px 15px;} #wrap .detail_info_top{padding:0 0 17px 0;box-sizing:border-box;border-bottom:1px solid #ddd;} #wrap .detail_info_top .prd_icon{width:calc(100% + 5px);margin-left:-5px;font-size:0;box-sizing:border-box;} #wrap .detail_info_top .prd_icon img{display: inline-block;vertical-align: top;margin:0 2.5px 3px 2.5px;width:auto;height:20px;} /* #wrap .detail_info_top .prd_icon img + img{margin-left:5px;} */ #wrap .goods_view .detail_info h3{font-size:24px;color:#222;font-weight:500;letter-spacing:-0.05em;margin-top:5px;} #wrap .detail_info_top .prd_eng_nm{font-size:14px;color:#888;font-weight:400;font-family:'Roboto';} #wrap .detail_info_top .prd_tag{font-size:0;width:calc(100% + 10px);margin-left:-10px;margin-top:10px;} #wrap .detail_info_top .prd_tag li{display: inline-block;margin:0 10px 5px 10px;} #wrap .detail_info_top .prd_tag li span{display: inline-block;font-size:14px;color:#000;font-weight:400;letter-spacing:-1.4px;font-family:'Noto Sans KR';position: relative;} #wrap .detail_info_top .prd_tag li span:before{width:100%;height:6px;content:"";position: absolute;bottom:2px;left:0;z-index:-1;} #wrap .detail_info_top .prd_tag.tag_line1 li span:before{background:#d7e4db;}/*인퓨어*/ #wrap .detail_info_top .prd_tag.tag_line2 li span:before{background:#d8e6e6;}/*하이퍼*/ #wrap .detail_info_top .prd_tag.tag_line3 li span:before{background:#dde0e9;}/*모인*/ #wrap .detail_info_top .prd_tag.tag_line4 li span:before{background:#eedcda;}/*뉴트리티브*/ #wrap .detail_info_top .prd_tag.tag_line5 li span:before{background:#e0e4e7;}/*리페러티브*/ #wrap .detail_info_top .prd_tag.tag_line6 li span:before{background:#eee9e3;}/*미라클*/ #wrap .detail_info_top .prd_tag.tag_line7 li span:before{background:#3f2175;opacity:0.15;}/*스페셜*/ #wrap .detail_info_top .short_des{font-size:15px;color:#777;font-weight:400;letter-spacing:-1px;line-height:23px;margin-top:8px;} #wrap .detail_info_top .short_des.goods_regular h3{display: none;} #wrap .goods_view .detail_info .detail_sub_info{box-sizing:border-box;border:none;padding:20px 0 20px 0;} #wrap .goods_view .detail_info .detail_sub_info dl{padding:0;} #wrap .goods_view .detail_info .detail_sub_info dl dt{font-size:15px;color:#777;font-weight:400;letter-spacing:-1px;width:20%;} #wrap .goods_view .detail_info .detail_sub_info dl dd{font-size:15px;color:#444;font-weight:400;letter-spacing:-1px;line-height:32px;font-family:'Noto Sans KR';} #wrap .goods_view .detail_info .detail_sub_info dl dd .price{font-size:23px;color:#1b253c;font-weight:600;letter-spacing:-0.92px;font-family:'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;} #wrap .goods_view .detail_info .detail_sub_info dl dd .won{font-size:14px;color:#333;font-weight:400;letter-spacing:-0.59px;font-family:'Noto Sans KR';} #wrap .goods_view .detail_info .detail_sub_info dl dd .won2 + .coupon_price {color:#777;} #wrap .goods_view .detail_info .detail_sub_info dl dd .total_benefit_mileage{font-size:inherit;color:inherit;font-weight:inherit;font-family:inherit;} #wrap .goods_view .share_btn_box{border:none;} #wrap .goods_view .share_btn_box ul{display: block;width:100%;font-size:0;text-align: center;} #wrap .goods_view .share_btn_box ul li{display: inline-block;background:none;width:calc(50% - 7.5px);box-sizing:border-box;border:1px solid #ccc;height:45px;line-height:43px;} #wrap .goods_view .share_btn_box ul li.d_wish{margin-left:15px;} #wrap .goods_view .share_btn_box ul li button{padding:0;display: block;width:100%;height:100%;font-size:15px;color:#777;font-weight:400;letter-spacing:-1px;box-sizing:border-box;padding-left:28px;} #wrap .goods_view .share_btn_box ul li.d_share button{background:url('../img/da_image/icon_share.png')no-repeat 29% center;background-size:auto 18px;} #wrap .goods_view .share_btn_box ul li.d_wish button{background:url('../img/da_image/icon_wish.png')no-repeat 32% center;background-size:auto 16px;} #wrap .goods_view_bnr{width:100%;box-sizing:border-box;margin-top:20px;} #wrap .goods_view_bnr a{display: block;width:100%;height:100%;} #wrap .goods_view_bnr img{width:100%;} /*상세 탭*/ #wrap .goods_view .detail_btm_tab_menu_box{border-top:12px solid #eee;height:62px;border-bottom:none;} #wrap .goods_view .detail_btm_tab_menu_box .detail_btm_tab_menu ul{width:100%;margin:0;} #wrap .goods_view .detail_btm_tab_menu_box .detail_btm_tab_menu ul li{width:20%;border-bottom:1px solid #ddd;} #wrap .goods_view .detail_btm_tab_menu_box .detail_btm_tab_menu ul li a{padding:0;font-size:14px;color:#888;font-weight:normal;line-height:18px;letter-spacing:-1.4px;font-family:'Jeju Myeongjo', serif;;} #wrap .goods_view .detail_btm_tab_menu_box .detail_btm_tab_menu ul li a span{font-size:inherit;color:inherit;font-size:12px;} #wrap .goods_view .detail_btm_tab_menu_box .detail_btm_tab_menu ul li.selected{border-bottom:1px solid #000;} #wrap .goods_view .detail_btm_tab_menu_box .detail_btm_tab_menu ul li.selected a{color:#222;font-weight:600;} #wrap .goods_view .detail_btm_tab_menu_box .detail_btm_tab_menu ul li.selected a span{color:#275b4e;} #wrap .goods_view .detail_info_box.js_goods_info {padding:0;width:100%;margin:0;} #wrap .goods_view .detail_info_box.js_goods_info .js_goods_description {padding:0;margin:0;width:100%;overflow:hidden;} #wrap .goods_view .detail_info_box.js_goods_info .js_goods_detail_infotext{padding-top:0;padding-bottom:0;} #wrap .goods_view .detail_info_box.js_goods_info .js_goods_detail_infotext img{max-width:100% !important;} /*상품리뷰*/ #wrap .js_goods_info .plus_review_container .plus_review_top_box{padding:10px 0;background:#f2f3f3;} #wrap .plus_review_container .plus_review_top_box dl{vertical-align: middle;} #wrap .plus_review_container .plus_review_top_box dl dt, #wrap .plus_review_container .plus_review_top_box dl dd{font-family:'Jomolhari', 'Noto Sans KR',sans-serif;} #wrap .plus_review_container .plus_review_top_box dl dd{font-size:14px;color:#00293a;} #wrap .plus_reivew_write_btn{background:#00293a;border-radius:25px;font-size:13px;} #wrap .plus_review_container .plus_reivew_contents_box .plus_reivew_contents{font-size:13px;color:#777;line-height:1.6;letter-spacing:-0.5px;} #wrap .plus_review_container .plus_reivew_contents_box .plus_reivew_contents a{text-decoration: none;display: inline-block;font-size: 11px;padding: 1px 10px;border-radius: 25px;background: #00293a;color: white;margin: 0 0 3px 3px;} #wrap .plus_review_container .plus_review_info span{font-family:'Jomolhari', 'Noto Sans KR',sans-serif;} #wrap .js_board_goodsreview_view{padding:0;display: block;width:calc(100% - 20px);margin-left:10px;margin-bottom:30px;height:45px;line-height:43px;box-sizing:border-box;border:1px solid #00293a;margin-top:15px;font-size:16px;color:#00293a;font-weight:500;text-align: center;} /*상품후기*/ .goods_qna_txt{margin:5px 0 18px;} .goods_qna_txt p{font-size:14px;color:#888;font-weight:400;letter-spacing:-0.04em;line-height:21px;font-family:'Noto Sans KR';} .goods_qna_txt p + p{margin-top:8px;} .goods_qna_txt p strong{font-size:inherit;color:#333;font-weight:inherit;letter-spacing:inherit;line-height:inherit;font-family:inherit;} #wrap .detail_board_box .item_list_head .item_list_write_box{padding:0 15px 20px 15px;box-sizing:border-box;border-bottom:1px solid #ddd;} #wrap .goods_board_qa_list li{padding: 20px 15px;box-sizing:border-box;border-bottom:1px solid #ddd;} #wrap .goods_board_qa_list li .item_list_summary .board_left .author_box{font-size:0;} #wrap .goods_board_qa_list li .item_list_summary .board_left .author_box .ico_ans{font-size:13px;font-weight:400;letter-spacing:-1.3px;border-radius:0;box-sizing:border-box;height:24px;line-height:22px;padding:0 6px;} #wrap .goods_board_qa_list li .item_list_summary .board_left .author_box .ico_ans1{background:#fff;border:1px solid #333;color:#333;} #wrap .goods_board_qa_list li .item_list_summary .board_left .author_box .ico_ans3{background:#275b4e;border:1px solid #275b4e;color:#fff;} #wrap .goods_board_qa_list li .item_list_summary .board_left .author_box .name{display: inline-block;font-size:13px;color:#444;font-weight:400;letter-spacing:-0.78px;line-height:22px;margin-left:10px;} #wrap .goods_board_qa_list li .item_list_summary .board_left .author_box .date:before{width:1px;height:10px;content:"";background:#ccc;display: inline-block;vertical-align:middle;margin:-5px 7px 0 10px;} #wrap .goods_board_qa_list li .item_list_summary .board_left .author_box .date{font-size:13px;color:#999;font-weight:400;letter-spacing:-0.78px;line-height:22px;font-family:'Jomolhari', 'Noto Sans KR', serif;} #wrap .goods_board_qa_list li .item_list_summary .board_left .title a{font-size:14px;color:#444;font-weight:400;letter-spacing:-0.84px;line-height:21px;} #wrap .goods_board_view .contents_holder{font-size:14px;} #wrap .goods_board_qa_list li .item_list_summary .board_left{width:93%;} #wrap .detail_write_more_btn{background:url('../img/da_image/arr_gray_down.png')no-repeat center;background-size:auto 9px;} #wrap .detail_write_more_btn_on{background:url('../img/da_image/arr_gray_up.png')no-repeat center;background-size:auto 9px;} #wrap .js_board_goodsqa_more{font-size:15px;color:#333;font-weight:400;letter-spacing:-1px;font-family:'Jomolhari', 'Noto Sans KR',sans-serif;padding:15px;} #wrap .js_board_goodsqa_more span{display:inline;} /*상품안내*/ #wrap .goods_guide_list{width:100%;font-size:0;box-sizing:border-box;padding:20px 15px;} #wrap .goods_guide_list > li > dl > dt{font-size:16px;color:#333;font-weight:400;border-bottom:1px solid #333;margin-bottom:15px;padding-bottom:10px;background:url('../img/da_image/regular_arr_down.png')no-repeat right 8px;background-size:auto 9px;cursor:pointer;} #wrap .goods_guide_list > li > dl > dt.on{background:url('../img/da_image/regular_arr_up.png')no-repeat right 7px;background-size:auto 9px;} #wrap .goods_guide_list > li > dl > dd{display:none;} #wrap .goods_guide_list > li > dl dd{font-size:14px;color:#666;font-weight:400;letter-spacing:-0.84px;line-height:23px;margin-bottom:20px;} #wrap .goods_guide_list .left_table_type{margin-bottom:10px;} #wrap .goods_guide_list .left_table_type th{font-size:14px;color:#222;font-weight:500;border:1px solid #ddd;background:#f5f5f5;padding:5px;} #wrap .goods_guide_list .left_table_type td{font-size:12px;color:#333;font-weight:400;border:1px solid #ddd;padding:5px;} /*버튼*/ #wrap .detail_buy{border:none;box-shadow:0 0 49px 0 rgba(19, 27, 36, 0.33);box-sizing:border-box;border-radius:10px 10px 0 0;} #wrap .detail_buy .js_payco_btn{display: none;} #wrap .detail_buy .detail_buy_top_btn .detail_open_close{top:-68px;margin:0;transform:translate(-50%);} #wrap .detail_buy .detail_buy_top_btn .detail_open_close a{background:url('../img/da_image/btn_detail_buy.png')no-repeat center;width:150px;height:56px;background-size:auto 100%;} #wrap .detail_buy .detail_buy_top_btn .detail_open_close.on a{background:url('../img/da_image/btn_detail_buy_on.png')no-repeat center;background-size:auto 100%;} #wrap .detail_buy .detail_prd_btn{padding:15px 15px 15px 15px;} #wrap .detail_buy .detail_prd_btn ul{display: block;width:100%;font-size:0;} #wrap .detail_buy .detail_prd_btn ul li{display: inline-block;padding:0;vertical-align: top;} #wrap .detail_buy .detail_prd_btn ul li.prd_no_buy{width:100%;} #wrap .detail_buy .detail_prd_btn ul li.prd_no_buy .detail_prd_no_btn{background:#666;border:1px solid #666;} #wrap .detail_buy .detail_prd_btn ul li a{height:50px;line-height:48px;box-sizing:border-box;font-size:18px;color:#fff;font-weight:500;padding:0;font-family:'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;width:100%;display: block;} #wrap .detail_buy .detail_prd_btn ul li.order_btn_li{width:52.18%;} #wrap .detail_buy .detail_prd_btn ul li .detail_order_btn, #wrap .detail_buy .detail_prd_btn ul li .js_btn_add_order{background:#1b253c;border:1px solid #1b253c;} #wrap .detail_buy .detail_prd_btn ul li.cart_btn_li{margin:0 7.5px;width:29%;} #wrap .detail_buy .detail_prd_btn ul li .detail_cart_btn, #wrap .detail_buy .detail_prd_btn ul li .js_btn_add_cart{background:#606367;border:1px solid #606367;} #wrap .detail_buy .detail_prd_btn ul li.gift_btn_li{width:14.4%;} #wrap .detail_buy .detail_prd_btn ul li .detail_gift_btn{background:#fff;border:1px solid #1b253c;font-size:0;background:url('../img/da_image/icon_gift.png')no-repeat center;line-height:initial;background-size:auto 24px;} #wrap .detail_buy .detail_prd_btn ul .regular_btn_li{width:100%;text-align: center;} #wrap .detail_buy .detail_prd_btn ul .regular_btn_li a{background:#1b253c;border:1px solid #1b253c;} #wrap .detail_buy .btn_choice_regular{display: none;} /*레이어 옵션*/ .detail_buy .layer_option .js_option_scroll{overflow-y:auto !important;} .detail_buy .layer_option .buy_type{width:100%;box-sizing:border-box;padding:0 15px;margin-top:16px;} .detail_buy .layer_option .buy_type dl dt, .detail_buy .layer_option .buy_type dl dd{display: inline-block;box-sizing:border-box;vertical-align: top;} .detail_buy .layer_option .buy_type dl dt{font-size:15px;color:#333;font-weight:400;line-height:27px;margin-right:36px;} .detail_buy .layer_option .buy_type dl dd .inp_rdo.inp_custom{font-size:13px;} .detail_buy .layer_option .buy_type dl dd .inp_rdo.inp_custom span{color:#872828;} .detail_buy .layer_option .ly_one_buy{margin-top:15px;} .detail_buy .layer_option .ly_buy_info {padding:0 15px;box-sizing:border-box;width:100%;} .detail_buy .layer_option .ly_buy_info .ly_opt {padding:0;} .detail_buy .layer_option .ly_buy_info .ly_opt li.singel_option_on{width:100%;position:static;padding:0;} .detail_buy .layer_option .ly_buy_info .ly_opt .bn_opt {display:block; position:relative; width:100%; height:40px; border:1px solid #ddd; font-size:14px;letter-spacing:-0.42px;color:#333; text-align:left; text-indent:15px; z-index:100; background:#fff url('../img/da_image/icon_bg_select_gd.png') no-repeat 100% 0; background-size:auto 38px;padding:0;} .detail_buy .layer_option .ly_buy_info .ly_opt .bn_opt.selected { border:1px solid #ddd;} .detail_buy .layer_option .ly_buy_info .ly_opt > li {margin-bottom:10px;} .detail_buy .layer_option .ly_buy_info .ly_opt li .optbx {position:relative; margin:-1px 0 0 0; border:1px solid #ddd; z-index:1; background:#ffffff;} .detail_buy .layer_option .ly_buy_info .ly_opt li .optbx .optlst {} .detail_buy .layer_option .ly_buy_info .ly_opt li .optbx .optlst .disabled {color:lightgray !important;} .detail_buy .layer_option .ly_buy_info .ly_opt li .optbx .optlst li {position:relative; min-height:36px; text-indent:15px; border-bottom:1px solid #ddd; font-weight:300; font-size:14px;letter-spacing:-0.42px;color:#333; line-height:36px; vertical-align:middle;} .detail_buy .layer_option .ly_buy_info .ly_opt li .optbx .optlst li:last-child {border-bottom:none;} .detail_buy .layer_option .ly_buy_info .ly_opt li .optbx .optlst li > img {width:34px; height:34px;} .detail_buy .layer_option .ly_buy_info .ly_opt li .optbx .optlst li em {display:block; position:relative; padding:8px 0 7px; color:#555; word-break:break-all; z-index:30;} /* 옵션 선택 */ .detail_buy .layer_option .ly_buy_info {padding-top:0;padding-bottom:0;} .detail_buy .layer_option .ly_buy_info .ly_opt > li:first-child {margin-top:7px;} .detail_buy .option_display_area.order_goods {padding:0 15px;box-sizing:border-box;} .detail_buy .option_total_display_area {} .detail_buy .view_order_goods {position:relative; padding:13px 15px 10px 15px; background:#f2f1ee; border-bottom:0;border-top:1px dotted #ddd;} .detail_buy .view_order_goods:first-child {border-top:0;} .detail_buy .view_order_goods dl {} .detail_buy .view_order_goods dl dt {font-size:14px;font-weight:400;letter-spacing:-0.42px;line-height:1.2em;padding:0 20px 10px 0;vertical-align:top;} .detail_buy .view_order_goods dl dd {} .detail_buy .view_order_goods dl dd em {font-style:normal;} .detail_buy .view_order_goods dl dd .price_info {display:table; width:100%;} .detail_buy .view_order_goods dl dd .price_info .count {display:table-cell; width:105px;padding:0; vertical-align:middle;font-size:0;box-sizing:border-box;} .detail_buy .view_order_goods dl dd .price_info .count button {vertical-align:middle;height:30px;width:30px;display:inline-block;margin:0;background-size:30px !important;border:0;} .detail_buy .view_order_goods dl dd .price_info .count button.detail_down_btn {background: url(../img/da_image/btn_minus.png) no-repeat center;} .detail_buy .view_order_goods dl dd .price_info .count button.detail_up_btn {background: url(../img/da_image/btn_plus.png) no-repeat center;} .detail_buy .view_order_goods dl dd .price_info .count input[type=number] {width:45px;height:30px;font-size:15px;line-height:28px;padding:0 11px;font-weight:400;margin:0;text-align:right;color:#222;vertical-align:middle;box-sizing:border-box;border:1px solid #ddd;border-left:0;border-right:0;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;} .detail_buy .view_order_goods dl dd .price_info .right {display:table-cell; width:auto; text-align:right; vertical-align:middle;box-sizing:border-box;} .detail_buy .view_order_goods dl dd .price_info .right .btn_wrap {padding:0 5px 0 0;display:inline-block;vertical-align:middle;} .detail_buy .view_order_goods dl dd .price_info .right .btn_wrap ul {text-align:right;} .detail_buy .view_order_goods dl dd .price_info .right .btn_wrap ul li {display:inline-block;} .detail_buy .view_order_goods dl dd .price_info .right .price {padding:0;font-size:18px;line-height:20px;font-weight:500;text-align:right;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;color:#222;vertical-align:middle;display:inline-block;} .detail_buy .view_order_goods dl dd .price_info .right .price:after {content:"원";line-height:18px;padding:1px 0 1px 0;font-size:15px;font-weight:400;color:#222;font-family: 'Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;box-sizing:border-box;display:inline-block;vertical-align:top;} .detail_buy .view_order_goods dl dd .price_info .right .detail_apply_del {top:12px;right:12px;width:20px;height:20px;position:absolute;display:inline-block;font-size:0;background: url(../img/da_image/btn_addgoods_del.png) no-repeat center;background-size:14px;border:none;} /* 총 합계 */ .detail_buy .ly_repeat_buy {height:0;overflow:hidden;width:100%;padding:0;margin:0;box-sizing:border-box;} .detail_buy .option_total_display_area {} .detail_buy .popup_price {padding-bottom:0;} .detail_buy .total_price_box {padding:18px 0 15px 0;margin:15px auto 0;width: calc(100% - 30px);text-align:right; border-top:1px solid #333;} .detail_buy .total_price_box ul {display:inline-block;} .detail_buy .total_price_box ul li {} .detail_buy .total_price_box ul li dl {display:inline-block; width:100%;text-align:right;} .detail_buy .total_price_box ul li dl dt {display:inline-block; width:auto;padding-right:12px;font-size:14px;font-weight:400 !important;line-height:20px;color:#555;text-align:right; vertical-align:middle;} .detail_buy .total_price_box ul li dl dd {display:inline-block; font-size:0;line-height:20px;text-align:right;vertical-align:middle;} .detail_buy .total_price_box ul li dl dd div {vertical-align:middle;font-size:0;font-weight:500;line-height:20px;color:#1b253c;font-family: 'Trirong', 'Jeju Myeongjo', 'Noto Sans KR', serif;display:inline-block;} .detail_buy .total_price_box ul li dl dd div.total_price {font-size:23px;} .detail_buy .total_price_box ul li dl dd div.total_price b {font-size:15px;font-weight:400;color:#1b253c;font-family: 'Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;display:inline-block;vertical-align:top;line-height:18px;padding-top:2px;} .ly_ct {overflow:hidden; overflow-y:scroll; -webkit-overflow-scrolling:touch; } @media only screen and (max-width:370px){ #wrap .detail_buy .detail_prd_btn ul li.order_btn_li{width:52%;} #wrap .detail_buy .detail_prd_btn ul li.gift_btn_li{width:14%;} } @media only screen and (max-width:340px){ .detail_buy .layer_option .buy_type dl dt{margin-right:25px;} #wrap .detail_buy .detail_prd_btn ul li.order_btn_li{width:51%;} } @media only screen and (max-width:325px){ .detail_buy .layer_option .buy_type dl dd .inp_rdo.inp_custom label + input{margin-left:10px;} } /*─────────────────────────────────────────────────────────── 1분 두피진단 ───────────────────────────────────────────────────────────*/ /*** 1분 두피진단 인트로 - goods/self_intro.html ***/ /* 일반 - 375 */ .selfintro_sec01 {padding-left:10px;padding-right:10px;padding-top:45px;padding-bottom:102px;background:url(../img/da_image/bg_minute1_intro.gif) no-repeat 50% 50%;background-size:cover;box-sizing:border-box;position:relative;z-index:1;} .selfintro_sec01 .w_custom {} .selfintro_sec01 .txt_box, .selfintro_sec01 .thumb_box {display:inline-block;box-sizing:border-box;} .selfintro_sec01 .txt_box {width:100%;position:relative;z-index:2;} .selfintro_sec01 .txt_box .txt_box_info {margin-top:-44px;} .selfintro_sec01 .txt_box h3 {text-align:left;margin:0;padding:0;} .selfintro_sec01 .txt_box h3 em, .selfintro_sec01 .txt_box h3 strong {color:#222;font-size:30px;line-height:42px;letter-spacing:-1.5px;display:block;vertical-align:top;margin:0 auto;padding:0;} .selfintro_sec01 .txt_box h3 em {font-weight:300;} .selfintro_sec01 .txt_box h3 strong {font-weight:500;} .selfintro_sec01 .txt_box p {font-size:16px;line-height:24px;padding:10px 0 20px;letter-spacing:-0.8px;font-weight:300;color:#444;position:relative;z-index:1;margin:0;} .selfintro_sec01 .txt_box p:after {width:25px;height:1px;background:#000;left:0;bottom:0;display:inline-block;content:"";position:absolute;} .selfintro_sec01 .txt_box dl {margin:24px 0 40px;padding:0;font-size:0;vertical-align:top;} .selfintro_sec01 .txt_box dt, .selfintro_sec01 .txt_box dd {display:block;vertical-align:top;margin:0;padding:0;text-align:left;box-sizing:border-box;} .selfintro_sec01 .txt_box dt {font-size:14px;line-height:14px;padding:0 0 17px 0;letter-spacing:-0.7px;font-weight:500;color:#333;} .selfintro_sec01 .txt_box dd {} .selfintro_sec01 .txt_box dd strong, .selfintro_sec01 .txt_box dd em {display:inline-block;vertical-align:top;margin:0;padding:0;} .selfintro_sec01 .txt_box dd strong {line-height:25px;height:25px;color:#333;font-size:25px;letter-spacing:-1.25px;font-weight:700;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .selfintro_sec01 .txt_box dd em {line-height:20px;color:#333;font-size:15px;font-weight:300;margin-top:5px;letter-spacing:-0.75px;} .selfintro_sec01 .txt_box .btn_custom_lg.btn_point{box-shadow:4px 6px 17px 0 rgba(0, 0, 0, 0.33);padding:10px 12px;} .selfintro_sec01 .txt_box a.btn_go {} .selfintro_sec01 .thumb_box {width:68.13%;height:0;padding:71.06vw 0 0;overflow:hidden;background:url(../img/da_image/img_minute1_intro.png) no-repeat 50% 50%;background-size:100% auto;position:absolute;bottom:30px;right:-9.46%;z-index:1;} .selfintro_sec01 .txt_box p[data-aos].aos-animate {transition-delay:0.4s;} .selfintro_sec01 .txt_box dl[data-aos].aos-animate {transition-delay:0.6s;} .selfintro_sec01 .txt_box a.btn_go[data-aos].aos-animate {transition-delay:0.8s;} .selfintro_sec01 .thumb_box[data-aos].aos-animate {transition-delay:0.6s;} .selfintro_sec02 {padding-top:54px;padding-bottom:62px;background:url(../img/da_image/bg_minute1_why.gif) no-repeat 50% 50%;background-size:cover;} .selfintro_sec02 .w_custom {width: calc(100% - 30px);padding-left:0 !important;padding-right:0 !important;display:block;margin:0 auto;box-sizing:border-box;box-shadow: 3px 5px 15px 0 rgba(0, 0, 0, 0.21);} .selfintro_sec02 .thumb_box, .selfintro_sec02 .txt_box {width:100%;display:block;vertical-align:middle;box-sizing:border-box;text-align:left;} .selfintro_sec02 .thumb_box {font-size:0;vertical-align:top;} .selfintro_sec02 .thumb_box img {width:100%;height:auto;vertical-align:top;} .selfintro_sec02 h3 {text-align:center;margin:0;padding:0 0 25px;} .selfintro_sec02 h3 em, .selfintro_sec02 h3 span, .selfintro_sec02 h3 strong {display:block;vertical-align:top;margin:0 auto;padding:0;} .selfintro_sec02 h3 strong b {font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;line-height:inherit;letter-spacing:inherit;display:inline-block;vertical-align:top;margin:0;padding:0;position:relative;z-index:1;box-sizing:border-box;} .selfintro_sec02 h3 em {font-size:35px;font-weight:400;color:#d5d5d5;letter-spacing:-1.75px;font-family:'Trirong','Jeju Myeongjo',serif;font-style:italic;} .selfintro_sec02 h3 span {margin-top:10px;color:#08192b;font-size:20px;line-height:20px;font-weight:300;letter-spacing:-1px;} .selfintro_sec02 h3 strong {margin-top:8px;color:#333;font-size:25px;line-height:27px;font-weight:500;letter-spacing:-1.25px;} .selfintro_sec02 h3 strong b:after {height:8px;bottom:-2px;width: calc(100% + 6px);left:-3px;background:#927433;opacity:0.15;position:absolute;display:inline-block;content:"";z-index:-1;} .selfintro_sec02 .txt_box {padding:20px;padding-bottom:16px;background:#fff;} .selfintro_sec02 .txt_box p {padding:0;margin:0;font-size:15px;line-height:21px;letter-spacing: -0.75px;font-weight:300;color:#777;} .selfintro_sec02 .txt_box p em, .selfintro_sec02 .txt_box p strong {display:block;margin:0;padding:0;vertical-align:top;line-height:inherit;font-weight:inherit;} .selfintro_sec02 .txt_box p em {font-size:19px;line-height:19px;letter-spacing: -0.95px;color:#333;font-family: 'Jeju Myeongjo', serif;} .selfintro_sec02 .txt_box p strong {margin:15px 0 13px;font-size:16px;line-height:23px;letter-spacing: -0.8px;color:#444;font-weight:400;} .selfintro_sec02 .txt_box h3 span[data-aos].aos-animate {transition-delay:0.2s;} .selfintro_sec02 .txt_box h3 strong[data-aos].aos-animate {transition-delay:0.4s;} .selfintro_sec02 .txt_box p[data-aos].aos-animate {transition-delay:0.6s;} .selfintro_sec03 {padding-top:60px;padding-bottom:60px;background:#ebe9e7;} .selfintro_sec03 .selftype_ul {margin:0 auto;vertical-align:top;font-size:0;} .selfintro_sec03 .selftype_ul .slick-list {padding:0 92px 21px 8px;box-sizing:border-box;} .selfintro_sec03 .selftype_ul li {padding:0 8px;margin:0;box-sizing:border-box;text-align:center;display:inline-block;vertical-align:top;position:relative;z-index:1;} .selfintro_sec03 .selftype_ul li img {margin:0 auto;width:100%;height:auto;} .selfintro_sec03 .selftype_ul li dl {margin:0 auto;padding:0;position:absolute;left:50%;top:32px;width: calc(100% - 66px);transform:translateX(-50%);z-index:2;} .selfintro_sec03 .selftype_ul li dl dt, .selfintro_sec03 .selftype_ul li dl dd {color:#fff;font-weight:400;margin:0;padding:0;vertical-align:top;text-align:left;} .selfintro_sec03 .selftype_ul li dl dt {margin:0 0 14px;font-size:25px;line-height:32px;letter-spacing:-1.25px;font-family: 'Jeju Myeongjo', serif;} .selfintro_sec03 .selftype_ul li dl dd {font-size:16px;line-height:21px;letter-spacing:-0.8px;font-weight:300;} .selfintro_sec03 .selftype_ul li:nth-of-type(2) dd[data-aos].aos-animate {transition-delay:0.2s;} .selfintro_sec03 .slick-dots {bottom:0;transform:translateX(-50%);text-align:center;left:50%;position:absolute;z-index:3;margin:0 auto;padding:0;font-size:0;} .selfintro_sec03 .slick-dots li, .selfintro_sec03 .slick-dots button {font-size:0;margin:0;padding:0;border:0;outline:0;display:inline-block;vertical-align:top;opacity:1;transition:all 0.3s;} .selfintro_sec03 .slick-dots li {width:6px;height:6px;line-height:6px;position:relative;z-index:1;} .selfintro_sec03 .slick-dots li + li {margin-left:10px;} .selfintro_sec03 .slick-dots li button {width:6px;height:6px;border-radius:100%;background:#ccc;opacity:0.8;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%) scale(0.65, 0.65);} .selfintro_sec03 .slick-dots li.slick-active {} .selfintro_sec03 .slick-dots li.slick-active button {transform:translate(-50%, -50%) scale(1, 1);background:#333;opacity:1;} .selfintro_sec04 {padding-top:60px;padding-bottom:106px;text-align:center;} .selfintro_sec04 .w_custom {text-align:center;box-shadow:4px 6px 28px 0 rgba(0, 0, 0, 0.21);width: calc(100% - 30px);padding-left:0 !important;padding-right:0 !important;margin:0 auto;} .selfintro_sec04 h3 {text-align:center;margin:0;padding:0 0 30px;} .selfintro_sec04 h3 em, .selfintro_sec04 h3 strong {display:block;vertical-align:top;margin:0 auto;padding:0;} .selfintro_sec04 h3 em b, .selfintro_sec04 h3 strong b {font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;line-height:inherit;letter-spacing:inherit;display:inline-block;vertical-align:top;margin:0;padding:0;position:relative;z-index:1;box-sizing:border-box;} .selfintro_sec04 h3 em {color:#08192b;font-size:17px;line-height:18px;font-weight:300;letter-spacing:-0.85px;} .selfintro_sec04 h3 strong {margin-top:13px;color:#333;font-size:24px;line-height:28px;font-weight:500;letter-spacing:-1.2px;} .selfintro_sec04 h3 em b:after, .selfintro_sec04 h3 strong b:after {bottom:0;position:absolute;display:inline-block;content:"";z-index:-1;} .selfintro_sec04 h3 em b:after {height:1px;width:100%;left:0;background:#444;} .selfintro_sec04 h3 strong b:after {height:8px;bottom:-1px;width: calc(100% + 12px);left:-6px;background:#bb9284;opacity:0.2;} .selfintro_sec04 .selfstep_ol {} .selfintro_sec04 .selfstep_ol > li:before {color:#4b4c44;} .selfintro_sec04 a.btn_go {width:170px;margin:30px auto 0;} @media only screen and (max-width:360px) { } @media only screen and (max-width:320px) { .selfintro_sec02 .txt_box {padding-left:15px;padding-right:15px;} .selfintro_sec02 .txt_box p {font-size:13px;line-height:20px;letter-spacing: -0.65px;} .selfintro_sec02 .txt_box p strong {font-size:15px;letter-spacing:-0.75px;} .selfintro_sec03 .selftype_ul .slick-list {padding-right:86px;padding-left:5px;} .selfintro_sec03 .selftype_ul li {padding:0 5px;} .selfintro_sec03 .selftype_ul li dl {width: calc(100% - 52px);} .selfintro_sec04 .w_custom {width: calc(100% - 20px);} .selfintro_sec04 h3 strong b:after {width: calc(100% + 4px);left:-2px;} .selfstep_ol > li {padding-left:10px;padding-right:10px;} .selfstep_ol > li > img + dl {width: calc(54.1% - 10px);margin-left:10px;} .selfstep_ol > li dl dt {font-size:18px;letter-spacing:-0.9px;line-height:23px;} } /*** 1분 두피진단 인트로2 - goods/self_index.html ***/ /* 일반 - 375 */ #wrap .selftest_popup {} #wrap .selftest_popup .ly_head {height:50px;border-bottom:1px solid #eee;} #wrap .selftest_popup .ly_head .h_tit {font-size:19px;line-height:48px;font-weight:500;color:#333;letter-spacing:-0.9px;} #wrap .selftest_popup .ly_head .ly_btn_prev {width:50px;height:50px;position:absolute;top:0;left:0;background:url('../img/da_image/icon_prev.png') no-repeat center left 15px;background-size:25px auto;border:0;font-size:0;} #wrap .selftest_popup .selftest_cont {padding:23px 15px;box-sizing:border-box;} #wrap .selftest_popup .selftest_cont .self_tit {font-size:22px;line-height:1.45;font-weight:300;color:#222;letter-spacing: -1.3px;} #wrap .selftest_popup .selftest_cont .self_tit strong {font-size:inherit;line-height:inherit;font-weight:500;color:inherit;letter-spacing:inherit;position:relative;} #wrap .selftest_popup .selftest_cont .self_tit strong:before {content:'';display:block;position:absolute;width:100%;height:8px;background:#bb9284;opacity:0.2;bottom:0;left:50%;transform:translateX(-50%);z-index:-1;} #wrap .selftest_popup .selftest_cont .self_wrap {margin:26px 0 0;overflow:visible;} #wrap .selftest_popup .selftest_cont .self_wrap ul {} #wrap .selftest_popup .selftest_cont .self_wrap ul li {width:84.06%;border:1px solid;padding: 23px 18px 20px;border-radius:5px;box-sizing:border-box;} #wrap .selftest_popup .selftest_cont .self_wrap ul li .txt_box {margin-bottom:20px;} #wrap .selftest_popup .selftest_cont .self_wrap ul li .txt_box h2 {font-size:21px;line-height:1;font-weight:500;color:#333;letter-spacing: -1.04px;} #wrap .selftest_popup .selftest_cont .self_wrap ul li .txt_box p {font-size:15px;line-height:1.53;font-weight:300;color:#333;letter-spacing: -0.85px;padding-top:10px;} #wrap .selftest_popup .selftest_cont.free_discout_con .self_wrap ul li .img_box {width:100%;position: relative;height:0;padding-bottom:63.5%;position: relative;overflow:hidden;} #wrap .selftest_popup .selftest_cont .self_wrap ul li .img_box img{width:100%;} #wrap .selftest_popup .selftest_cont.free_discout_con .self_wrap ul li .img_box img {width:100%;position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);} #wrap .selftest_popup .selftest_cont .self_wrap ul li .btn_box {margin:16px 0 0;} #wrap .selftest_popup .selftest_cont .self_wrap ul li .btn_box .btn_go {height:50px;letter-spacing:-0.8px;} #wrap .selftest_popup .selftest_cont .self_wrap ul li .btn_box .btn_go span {height:inherit;line-height:46px;} #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(1) {border-color:#c2cfdc;background:#e4eff6;} #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(1) .btn_box .btn_go.btn_self_go {background:#fff;border-top:1px solid #c6d4de;border-right:1px solid #c2cfdc;border-bottom:1px solid #c2cfdc;border-left:1px solid #c6d4de;} #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(1) .btn_box .btn_go.btn_self_go:before, #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(1) .btn_box .btn_go.btn_self_go:after {background:linear-gradient(90deg, #c6d4de 0%, #c2cfdc 100%);} #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(2) {border-color:#c2dcc6;background:#e5f0e5;} #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(2) .btn_box .btn_go.btn_self_go {background:#fff;border-top:1px solid #d2e4d5;border-right:1px solid #c2dcc6;border-bottom:1px solid #c2dcc6;border-left:1px solid #d2e4d5;} #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(2) .btn_box .btn_go.btn_self_go:before, #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(2) .btn_box .btn_go.btn_self_go:after {background:linear-gradient(90deg, #d2e4d5 0%, #c2dcc6 100%);} #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(3) {border-color:#e8d8c0;background:#f2ece4;} #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(3) .btn_box .btn_go.btn_self_go {background:#fff;border-top:1px solid #dfd9d1;border-right:1px solid #e8d8c0;border-bottom:1px solid #e8d8c0;border-left:1px solid #dfd9d1;} #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(3) .btn_box .btn_go.btn_self_go:before, #wrap .selftest_popup .selftest_cont .self_wrap ul li:nth-child(3) .btn_box .btn_go.btn_self_go:after {background:linear-gradient(90deg, #dfd9d1 0%, #e8d8c0 100%);} #wrap .selftest_popup .selftest_cont .self_wrap .sld_txt {text-align:center;height:21px;font-size:13px;line-height:21px;font-weight:400;color:#777;letter-spacing:-0.6px;margin:22px 0 0;} #wrap .selftest_popup .selftest_cont .self_wrap .sld_txt span {padding:1px 0 1px 38px;background:url('../img/da_image/icon_swiper.png') no-repeat center left;background-size:auto 21px;letter-spacing:-0.85px;} @media only screen and (max-width:320px) { #wrap .selftest_popup .selftest_cont .self_tit {font-size:20px;letter-spacing:-1px;} #wrap .selftest_popup .selftest_cont .self_wrap ul li {padding-left:15px;padding-right:15px;} #wrap .selftest_popup .selftest_cont .self_wrap ul li .txt_box p {font-size:14px;letter-spacing:-0.7px;} } /*** 1분 두피진단 테스트 - goods/self_test.html ***/ /* 일반 - 375 */ .self_title {font-size:28px;line-height:28px;padding:47px 0 24px;letter-spacing: -1.4px;font-weight:400;user-select: none;text-align:center;font-family: 'Jeju Myeongjo', serif;} .self_title span {font-size:inherit;line-height:inherit;font-weight:inherit;background: linear-gradient(120deg, rgba(102,102,102,1) 35%, rgba(51,51,51,1) 70%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;font-family:inherit;} .selftest_step {width:100%;padding:0 15px 20px;box-sizing:border-box;counter-reset:test-number;vertical-align:top;background:#fff;text-align:center;position:relative;z-index:2;} .selftest_step ol {margin:0 auto;vertical-align:top;font-size:0;} .selftest_step li {width:30px;counter-increment:test-number;display:inline-block;vertical-align:top;position:relative;z-index:1;text-align:left;vertical-align:top;font-size:0;} .selftest_step li + li {margin-left:5px;} .selftest_step li:before {content:'0' counter(test-number);font-size:15px;line-height:30px;width:30px;height:30px;letter-spacing:-0.75px;font-weight:400;border-radius:100%;color:#aaa;background:#eee;font-family:'Trirong','Jeju Myeongjo',serif;display:inline-block;text-align:center;vertical-align:top;} .selftest_step li strong {font-size:16px;line-height:30px;letter-spacing:-0.8px;padding:0 0 0 5px;margin:0;font-weight:400;color:#222;display:none;vertical-align:top;} .selftest_step li.on {z-index:2;width: calc(100% - 210px);} .selftest_step li.on:before {color:#fff;background:#275b4e;} .selftest_step li.on strong {display:inline-block;} .selftest_step li.prev:before {font-size:0;background:#eee url(../img/da_image/icon_check_arrow_gr.png) no-repeat 50% 50%;background-size:15px 12px;} .selftest_step li .speech_bubble {width:115px;height:30px;border-radius:30px;line-height:18px;top:40px;left:-40px;padding:5px 5px;font-size:12px;letter-spacing:0;box-shadow:3px 3px 0 rgba(220, 219, 218, 1);animation: bubble 0.6s alternate infinite;font-weight:400;color:#275b4e;text-align:center;border:1px #ccc solid;background:#fff;position:absolute;vertical-align:top;box-sizing:border-box;display:none;} .selftest_step li .speech_bubble:before {right:20px;top:-9px;background:url(../img/da_image/bg_speech_bubble.png) no-repeat 0 0;background-size:cover;width:10px;height:9px;position:absolute;display:inline-block;content:"";} .selftest_step li .speech_bubble span {padding:0;line-height:18px;width:100%;font-size:inherit;font-weight:inherit;color:inherit;text-align:center;display:inline-block;position:relative;z-index:1;vertical-align:top;} .selftest_step li:nth-of-type(n + 5) .speech_bubble {left:auto;} .selftest_step li:nth-of-type(n + 4) .speech_bubble:before {right:auto;left:16px;transform: scaleX(-1);filter: fliph;} .selftest_step li:nth-of-type(4) .speech_bubble {width:190px;left:20px;} .selftest_step li:nth-of-type(5) .speech_bubble {width:190px;right:-65px;} .selftest_step li:nth-of-type(6) .speech_bubble {width:115px;right:0;} .selftest_step li.on .speech_bubble {display:block;} @keyframes bubble{ 0% {top:40px;} 100%{top:38px;} } .selftest_qa_wrap {padding:40px 0 42px;margin:0;background:url(../img/da_image/bg_selftes.jpg) no-repeat 50% 0;background-size:100% auto;position:relative;z-index:1;} .selftest_qa_wrap:before {height:10px;left:0;top:0;width:100%;background: rgb(0,0,0);background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.19) 100%);display:inline-block;content:"";position:absolute;} .selftest_qa_wrap > .w_custom{text-align:center;} .selftest_qa_wrap .selftest_qa_box {height:auto;width:100%;overflow:hidden;position:relative;z-index:1;} .selftest_qa_box .selftest_qa_group {transition:transform 0.3s;} .selftest_qa_box .selftest_qa_list {width:100%;height:auto;margin:0 auto;box-sizing:border-box;overflow:hidden;} .selftest_qa_box .selftest_qa_list li {text-align:left;font-size:0;vertical-align:top;box-sizing:border-box;} .selftest_qa_box .selftest_qa_list li + li {margin-top:30px;} .selftest_qa_box .selftest_qa_list li .step_number {height:30px;border-radius:30px;width:55px;font-size:14px;line-height:21px;letter-spacing:-0.7px;padding:5px;margin:0 9px 0 0;font-weight:400;color:#fff;background:#27282c;text-align:center;display:inline-block;vertical-align:top;box-sizing:border-box;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .selftest_qa_box .selftest_qa_list li dl {width:100%;display:inline-block;vertical-align:top;text-align:center;} .selftest_qa_box .selftest_qa_list.qa_list_yes li dl {} .selftest_qa_box .selftest_qa_list li dt {margin:0 0 15px;min-height:30px;line-height:30px;padding:0;font-size:17px;letter-spacing:-0.85px;font-weight:400;color:#333;box-sizing:border-box;text-align:center;} .selftest_qa_box .selftest_qa_list li dt p {max-width: calc(100% - 64px);min-height:30px;padding:3px 0;font-size:inherit;line-height:24px;color:inherit;display:inline-block;vertical-align:middle;text-align:left;} .selftest_qa_box .selftest_qa_list li dt p span {font-size:15px;letter-spacing:-0.75px;display:inline-block;line-height:inherit;margin:0;padding:0;vertical-align:top;} .selftest_qa_box .selftest_qa_list li dt p span.quiz-text {font-size:17px;letter-spacing:-0.85px;} .selftest_qa_box .selftest_qa_list li dt p.liner2, .selftest_qa_box .selftest_qa_list.qa_list18 li dt p {padding:0;} .selftest_qa_box .selftest_qa_list li dd {min-height:27px;margin-bottom:2px;} .selftest_qa_box .selftest_qa_list:last-child li {text-align:center;} .selftest_qa_box .selftest_qa_list:last-child li dd {width:100%;} .selftest_qa_box .selftest_qa_list:last-child li:before {content:'마지막 질문 입니다!';font-size:13px;height:39px;width:128px;line-height:13px;letter-spacing:-0.52px;padding:10px 0 16px 9px;margin:0 auto 6px;text-align:left;background:url(../img/da_image/bg_selftest_last.png) no-repeat 0 0;background-size:100%;box-sizing:border-box;font-weight:400;color:#222;display:block;} .selftest_qa_box .selftest_qa_list li dd p {} .selftest_qa_box .selftest_qa_list li dd p + p {margin-top:15px;} .selftest_qa_box .selftest_qa_list li dd input.self_inq_txt {width:auto;min-width:300px;padding:11px 15px;font-size:15px;line-height:21px;height:45px;border-radius:45px;letter-spacing:-0.75px;font-weight:400;color:#444;border:1px #ccc solid;background:#fff;box-sizing:border-box;vertical-align:top;} .selftest_qa_box .selftest_qa_list li dd input.self_inq_txt + label {width:0;height:0;font-size:0;display:inline-block;vertical-align:top;} .selftest_qa_list li dd.element_img {text-align:center;width:100%;} .selftest_qa_list li dd.element_img.element_num3 {} .selftest_qa_list li dd.element_img .form_element {width:100%;position:relative;z-index:1;} .selftest_qa_list li dd.element_img .form_element:after {clear:both;content:"";display:block;} .selftest_qa_list li dd.element_img .form_element.form_custom + .form_element.form_custom {margin-top:15px;margin-left:0;} .selftest_qa_list li dd.element_img .form_element.form_custom label.choice_m {padding-left:45px;} .selftest_qa_list li dd.element_img .form_element.form_custom label.choice_m {display:block;width:100%;padding-left: calc(43.5% + 15px);padding-top:38px;background-position-x: calc(46.8% + 15px) !important;background-position-y: 0 !important;height:100%;position:absolute;left:0;top:0;box-sizing:border-box;z-index:5;} .selftest_qa_list li dd .form_element .choice_thumb {display:inline-block;vertical-align:top;margin:0 auto 0 0;width:43.5%;position:relative;z-index:1;border-radius:5px;overflow:hidden;} .selftest_qa_list li dd .form_element .choice_thumb + input {float:right;} .selftest_qa_list li dd .form_element .choice_thumb img {vertical-align:top;margin:0 auto;transition:all 0.3s;z-index:1;width:100%;height:auto;} .selftest_qa_list li dd .form_element .choice_thumb:before {border-radius:5px;border:1px #333 solid;display:inline-block;position:absolute;content:"";top:0;left:0;opacity:0;width:100%;height:100%;z-index:2;box-sizing:border-box;transition:all 0.3s;} .selftest_qa_list li dd .form_element input:checked + label + .choice_thumb img {opacity:1;} .selftest_qa_list li dd .form_element input:checked + label + .choice_thumb:before {opacity:1;} .selftest_qa_list li dd .form_thumb {display:block;margin:25px auto 0;text-align:center;width:66.67%;} .selftest_qa_list li dd .form_thumb img {width:100%;height:auto;} .selftest_qa_list li dd.element_block {text-align:left;} .selftest_qa_list li dd.element_block .form_element {width: calc(20% - 16px);text-align:center;} .selftest_qa_list li dd.element_block .form_element + .form_element {margin-left:20px;} .selftest_qa_list li dd.element_block .form_element:nth-of-type(n + 6) {margin-top:20px;} .selftest_qa_list li dd.element_block .form_element:nth-of-type(5n + 1) {margin-left:0px;} .selftest_qa_list li dd.element_block .form_element label.check_s {font-size:16px;line-height:23px;font-weight:400;color:#333;letter-spacing:-0.8px;padding:46px 5px 14px 5px;height:100px;border:1px #ddd solid;background:#fff url('../img/da_image/input_check_off.png') no-repeat 50% 15px;background-size:26px 26px;border-radius:5px;width:100%;box-sizing:border-box;vertical-align:middle;} .selftest_qa_list li dd.element_block .form_element input:checked + label.check_s, .selftest_qa_list li dd.element_block .form_element label.check_s.on {border:1px #275b4e solid;background:#fff url('../img/da_image/input_check_on.png') no-repeat 50% 15px;background-size:26px 26px;} .selftest_qa_list li dd.element_block .form_element label.check_s span {display:block;vertical-align:middle;} .selftest_qa_list li dd.element_block.block_num3 {text-align:left;padding-top:10px;box-sizing:border-box;} .selftest_qa_list li dd.element_block.block_num3 .form_element {width: calc(50% - 5px);text-align:center;} .selftest_qa_list li dd.element_block.block_num3 .form_element + .form_element {margin-left:10px;} .selftest_qa_list li dd.element_block.block_num3 .form_element:nth-of-type(n + 3) {margin-top:10px;} .selftest_qa_list li dd.element_block.block_num3 .form_element:nth-of-type(2n + 1) {margin-left:0px;} .selftest_qa_list li dd.element_allcheck {text-align:left;} .selftest_qa_list li dd.element_allcheck.check_num2 .form_element {width: calc(50% - 14px);} .selftest_qa_list li dd.element_allcheck.check_num2 .form_element:nth-of-type(n + 3) {margin-top:18px;} .selftest_qa_list li dd.element_allcheck.check_num2 .form_element:nth-of-type(2n + 1) {margin-left:0;} .selftest_qa_list li dd.element_allcheck.check_num3 .form_element {width: calc(33.32% - 19px);} .selftest_qa_list li dd.element_allcheck.check_num3 .form_element:nth-of-type(n + 4) {margin-top:18px;} .selftest_qa_list li dd.element_allcheck.check_num3 .form_element:nth-of-type(3n + 1) {margin-left:0;} .selftest_qa_wrap .selftest_btn_wrap {font-size:0;padding-top:30px;} .selftest_qa_wrap .selftest_btn_wrap .btn_go {display:none;letter-spacing:1.6px;height:50px;} .selftest_qa_wrap .selftest_btn_wrap .btn_go.on {display:inline-block;} .selftest_qa_wrap .selftest_btn_wrap .btn_go.btn_result_self {width:200px;} .selftest_qa_wrap .selftest_btn_wrap button.btn_go + button.btn_go {margin-left:10px;} /* 개별 커스텀 */ .selftest_qa_box .selftest_qa_list.qa_list1 {max-width:100%;} /* .selftest_qa_box .selftest_qa_list.qa_list21, .selftest_qa_box .selftest_qa_list.qa_list22 {padding-top:30px;} */ .selftest_qa_box .selftest_qa_list.qa_list1 li dl {text-align:left;} .selftest_qa_box .selftest_qa_list.qa_list1 li dt {margin-bottom:10px;text-align:left;} .selftest_qa_box .selftest_qa_list.qa_list1 li dt p span {margin-top:-1px;} .selftest_qa_box .selftest_qa_list.qa_list1 li dt p span.quiz-text {margin-top:0;} .selftest_qa_box .selftest_qa_list.qa_list1 li + li {margin-top:40px;} .selftest_qa_box .selftest_qa_list.qa_list1 li + li dt {margin-bottom:15px;} .selftest_qa_box .selftest_qa_list.qa_list1 li + li + li {margin-top:40px;margin-bottom:0;} .selftest_qa_box .selftest_qa_list.qa_list1 li dd {padding-left:51px;box-sizing:border-box;} .selftest_qa_box .selftest_qa_list.qa_list1 li:first-child dd input.self_inq_txt {min-width:200px;width:100%;} .selftest_qa_box .selftest_qa_list li dd .form_element.form_custom label {font-size:15px;letter-spacing:-0.75px;} .selftest_qa_box .selftest_qa_list.qa_list_yes .form_element.form_custom + .form_element.form_custom {margin-left:23px;} .selftest_qa_box .selftest_qa_list.qa_list_yes li dt {margin-bottom:20px;} .selftest_qa_box .selftest_qa_list.qa_list6 + .selftest_qa_list li dd .form_element.form_custom + .form_element.form_custom label {padding-right:1px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element label.check_s, .selftest_qa_list.qa_list22 li dd.element_block .form_element label.check_s {line-height:20px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element label.check_s {height:120px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(1) label.check_s{padding-top:58px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(3) label.check_s, .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(4) label.check_s {height:140px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(n + 5) label.check_s {height:100px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(n + 5) label.check_s, .selftest_qa_list.qa_list22 li dd.element_block .form_element:nth-of-type(6) label.check_s, .selftest_qa_list.qa_list23 li dd.element_block .form_element:nth-of-type(1) label.check_s, .selftest_qa_list.qa_list23 li dd.element_block .form_element:nth-of-type(8) label.check_s, .selftest_qa_list.qa_list23 li dd.element_block .form_element:nth-of-type(9) label.check_s {padding-top:54px;} .selftest_qa_list.qa_list22 li dd.element_block .form_element:nth-of-type(1) label.check_s, .selftest_qa_list.qa_list22 li dd.element_block .form_element:nth-of-type(3) label.check_s{padding-left:18px;padding-right:18px;} .selftest_qa_list.qa_list22 li dd.element_block .form_element:nth-of-type(5) label.check_s{padding-top:55px;} /*.selftest_qa_list li dd.element_block .form_element:nth-of-type(1) label.check_s, .selftest_qa_list li dd.element_block .form_element:nth-of-type(8) label.check_s, .selftest_qa_list li dd.element_block .form_element:nth-of-type(9) label.check_s {padding-top:60px;} .selftest_qa_box .selftest_qa_list.qa_list21 li dd .form_element.form_custom:nth-of-type(1) label, .selftest_qa_box .selftest_qa_list.qa_list21 li dd .form_element.form_custom:nth-of-type(5) label, .selftest_qa_box .selftest_qa_list.qa_list21 li dd .form_element.form_custom:nth-of-type(6) label {padding-top:65px;}*/ .selftest_qa_list.qa_list_yes li dd .form_thumb {margin-top:25px;overflow:hidden;font-size:0;vertical-align:top;height:0;padding:170px 0 0;position:relative;z-index:1;} .selftest_qa_list.qa_list_yes li dd .form_thumb img {vertical-align:top;width:100%;height:auto;position:absolute;left:0;top:0;} @media only screen and (max-width:370px) { .selftest_qa_wrap {background-size:cover;} .selftest_step, .selftest_qa_wrap .w_custom, .selftest_qa_box .selftest_qa_list li dd input.self_inq_txt {padding-left:10px;padding-right:10px;} .selftest_step li {width:25px;line-height:25px;} .selftest_step li:before {width:25px;height:25px;line-height:25px;font-size:14px;letter-spacing:-0.7px;} .selftest_step li.on {width: calc(100% - 180px);} .selftest_step li strong {font-size:15px;letter-spacing:-0.75px;line-height:25px;} .selftest_qa_list li dd.element_img .form_element.form_custom label.choice_m {padding-left: calc(43.5% + 10px);background-position-x: calc(46.8% + 10px) !important;padding-top:34px;line-height:21px;} .selftest_qa_box .selftest_qa_list li dt, .selftest_qa_box .selftest_qa_list li dt p span.quiz-text {font-size:16px;letter-spacing:-0.8px;} .selftest_qa_box .selftest_qa_list li .step_number {width:46px;margin-right:5px;font-size:14px;letter-spacing:-0.7px;} .selftest_qa_box .selftest_qa_list li dt p {max-width: calc(100% - 51px);} .selftest_qa_box .selftest_qa_list li dt p span, .selftest_qa_box .selftest_qa_list li dd input.self_inq_txt {font-size:14px;letter-spacing:-0.7px;} .selftest_qa_box .selftest_qa_list.qa_list1 li dd .form_element.form_custom + .form_element.form_custom {margin-left:20px;} .selftest_qa_list li dd.element_block.block_num3 {padding-top:5px;} .selftest_qa_list li dd.element_block.block_num3 .form_element {width: calc(50% - 4px);} .selftest_qa_list li dd.element_block.block_num3 .form_element + .form_element {margin-left:8px;} .selftest_qa_list li dd.element_block.block_num3 .form_element:nth-of-type(n + 3) {margin-top:8px;} .selftest_qa_list li dd.element_block.block_num3 .form_element:nth-of-type(2n + 1) {margin-left:0px;} .selftest_qa_box .selftest_qa_list.qa_list_yes .form_element.form_custom {padding-right:1px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element label.check_s, .selftest_qa_list.qa_list22 li dd.element_block .form_element label.check_s {line-height:19px;} .selftest_qa_list li dd.element_block .form_element label.check_s {padding-left:2px;padding-right:2px;padding-top:42px;padding-bottom:10px;background-position:50% 12px;background-size:26px 26px;height:96px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element label.check_s {height:113px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(3) label.check_s, .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(4) label.check_s {height:134px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(n + 5) label.check_s {height:96px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(n + 5) label.check_s, .selftest_qa_list.qa_list22 li dd.element_block .form_element:nth-of-type(6) label.check_s, .selftest_qa_list.qa_list23 li dd.element_block .form_element:nth-of-type(1) label.check_s, .selftest_qa_list.qa_list23 li dd.element_block .form_element:nth-of-type(8) label.check_s, .selftest_qa_list.qa_list23 li dd.element_block .form_element:nth-of-type(9) label.check_s {padding-top:51px;} .selftest_qa_list.qa_list22 li dd.element_block .form_element:nth-of-type(5) label.check_s{padding-top:51px;} } @media only screen and (max-width:330px) { .selftest_qa_box .selftest_qa_list li dt, .selftest_qa_box .selftest_qa_list li dt p span.quiz-text {font-size:15px;letter-spacing:-0.75px;} .selftest_qa_box .selftest_qa_list li .step_number {width:43px;margin-right:5px;font-size:13px;letter-spacing:-0.65px;} .selftest_qa_box .selftest_qa_list li dt p {max-width: calc(100% - 48px);} .selftest_qa_box .selftest_qa_list li dt p span, .selftest_qa_box .selftest_qa_list li dd input.self_inq_txt {font-size:13px;letter-spacing:-0.65px;} .selftest_qa_box .selftest_qa_list li dd .form_element.form_custom label {font-size:14px;letter-spacing:-0.7px;} .selftest_qa_box .selftest_qa_list.qa_list1 li dd .form_element.form_custom + .form_element.form_custom {margin-left:16px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element label.check_s, .selftest_qa_list.qa_list22 li dd.element_block .form_element label.check_s {line-height:18px;} .selftest_qa_list li dd.element_block .form_element label.check_s {padding-top:42px;padding-bottom:10px;background-position:50% 12px;background-size:24px 24px;height:94px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element label.check_s {height:110px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(3) label.check_s, .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(4) label.check_s {height:130px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(n + 5) label.check_s {height:94px;} .selftest_qa_list.qa_list21 li dd.element_block .form_element:nth-of-type(n + 5) label.check_s, .selftest_qa_list.qa_list22 li dd.element_block .form_element:nth-of-type(6) label.check_s, .selftest_qa_list.qa_list23 li dd.element_block .form_element:nth-of-type(1) label.check_s, .selftest_qa_list.qa_list23 li dd.element_block .form_element:nth-of-type(8) label.check_s, .selftest_qa_list.qa_list23 li dd.element_block .form_element:nth-of-type(9) label.check_s {padding-top:51px;} } /*** 1분 두피진단 로딩 - goods/self_loading.html ***/ /* 일반 - 375 */ .self_ing_layer {width:100%;height:480px;background:url(../img/da_image/bg_ing_layer.gif) no-repeat 50% 0;background-size:cover;z-index:5;text-align:center;margin:0;padding:0;position:relative;} .self_ing_layer .ing_layer_wrap {position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);height:340px;width:100%;margin:0 auto;padding:0;} .ing_layer_wrap .ing_layer_box {} .ing_layer_box h2 {font-size:23px;letter-spacing: -1.15px;font-weight:400;color:#333;line-height:30px;padding:20px 0 12px;} .ing_layer_box p {font-size:15px;line-height:23px;letter-spacing: -0.75px;font-weight:300;color:#666;text-align:center;margin:0 auto;padding:0;} .ing_layer_box p span {font-size:inherit;line-height:inherit;display:inline-block;vertical-align:top;margin:0 auto;padding:0 3px;position:relative;z-index:1;} .ing_layer_box p span:before {bottom:4px;left:0;background:#666;height:1px;width:100%;display:inline-block;content:"";position:absolute;} .ing_layer_box svg {stroke-dasharray:300;transition: all .8s ease-in-out;} .ing_layer_box .donut {} .ing_layer_box .svg-item {width:204px;height:204px;font-size: 16px;margin: 0 auto;border:1px #ccc dashed;padding:19px;border-radius:204px;animation: donutfade 1s;box-sizing:border-box;position:relative;z-index:1;} .ing_layer_box .svg-item svg {position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);} .ing_layer_box .donut-ring {stroke: #eee;} .ing_layer_box .donut-segment {transform-origin: center;animation: donut1 3s;position:relative;z-index:1;} .ing_layer_box .donut-segment:after {display:inline-block;content:"";width:10px;background:#444;height:10px;position:absolute;right:0;top:0;} .ing_layer_box .donut-percent {animation: donutfadelong 1s;} .ing_layer_box .donut-text {fill: #2371c3;font-weight:500;font-family:'Roboto','Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .ing_layer_box .donut-percent {font-size:0.57em;line-height:0.57em;letter-spacing:-0.5px;font-family:inherit;color:inherit;} .ing_layer_box .donut-percent tspan {font-size:inherit;line-height:inherit;letter-spacing:inherit;font-family:inherit;color:inherit;} .ing_layer_box .donut-percent tspan + tspan {font-size:0.59em;font-weight:700;font-family:inherit;color:inherit;} .ing_layer_box .donut-data {font-size: 0.12em;line-height: 1;transform: translateY(0.5em);text-align: center;text-anchor: middle;color:#666;fill: #666;animation: donutfadelong 1s;} .ing_layer_box .svg-item {display:inline-block;} @keyframes donutfade { 0% {opacity: .2;} 100% {opacity: 1;} } @keyframes donutfadelong { 0% {opacity: 0;} 100% {opacity: 1;} } @keyframes donut1 { 0% {stroke-dasharray: 0, 100;} 100% {stroke-dasharray: 100, 0;} } @media only screen and (max-width:360px) { .self_ing_layer .ing_layer_wrap {height:332px;} .ing_layer_box h2 {font-size:22px;letter-spacing: -1.1px;line-height:28px;padding-top:17px;padding-bottom:10px;} .ing_layer_box p {font-size:14px;line-height:22px;letter-spacing: -0.7px;} } @media only screen and (max-width:330px) { .self_ing_layer .ing_layer_wrap {height:328px;} .ing_layer_box h2 {font-size:21px;letter-spacing: -1.05px;line-height:27px;padding-top:17px;padding-bottom:10px;} .ing_layer_box p {font-size:13px;line-height:21px;letter-spacing: -0.65px;} } /*** 1분 두피진단 결과 - goods/self_result.html && mypage/self_result.html ***/ /* 일반 - 375 */ .self_quick {width:60px;height:60px;position:fixed;z-index:10;left:15px;bottom:87px;margin:0;padding:0;border-radius:60px;box-shadow:0 0 6px rgba(0, 0, 0, 0.19);} .self_quick.on {width:265px;} .self_quick .self_caution {height:60px;width:74px;border-radius:60px;padding:0;position:absolute;left:0;top:0;z-index:1;overflow:hidden;box-sizing:border-box;} .self_quick.on .self_caution {width:265px;opacity:1;} .self_quick .self_caution .caution_box {padding:7px 10px 8px 74px;border-radius:60px;height:60px;box-sizing:border-box;position:relative;z-index:1;background:none;transition:background 0.3s;} .self_quick.on .self_caution .caution_box {background:#fff;transition:background 0.3s;} /* .self_quick .self_caution .caution_box:before {width:5px;height:9px;right:10px;top:50%;margin-top:-5px;background:url(../img/da_image/quick_minute1_arrow.png) no-repeat 50% 50%;background-size:100% 100%;display:inline-block;content:"";position:absolute;} */ .self_quick .self_caution .caution_box p {font-size:11px;line-height:15px;letter-spacing:-0.55px;font-weight:400;color:#666;} .self_quick .self_caution .caution_box p strong {color:#bb3c30;font-weight:500;line-height:inherit;font-size:inherit;} /* .self_quick .self_caution .caution_box a {line-height:23px;font-size:15px;letter-spacing:-0.75px;font-weight:400;color:#333;display:inline-block;vertical-align:top;margin:8px auto 0 0;} .self_quick .self_caution .caution_box a span {padding:0 12px 0 0;display:inline-block;line-height:inherit;font-size:inherit;font-weight:inherit;color:inherit;vertical-align:top;position:relative;z-index:1;} .self_quick .self_caution .caution_box a span:before, .self_quick .self_caution .caution_box a span:after {right:0;position:absolute;display:inline-block;content:"";} .self_quick .self_caution .caution_box a span:before {width:100%;height:1px;background:#333;top:18px;} .self_quick .self_caution .caution_box a span:after {width:5px;height:5px;border-width:1px 1px 0 0;box-sizing:border-box;border-color:#333;border-style:solid;transform:translate(-3px, -50%) rotate(45deg);top:47%;} */ .self_quick .self_img {height:60px;width:60px;border-radius:60px;background:url(../img/da_image/quick_minute1.png) no-repeat 0 0;background-size:100% auto;position:relative;z-index:2;} .self_quick .caution_login{width:20px;height:100%;right:-20px;top:0;background:url(../img/da_image/quick_minute1_arrow.png) no-repeat 50% 50%;background-size: auto 9px;display: inline-block;position: absolute;font-size:0;margin:0;z-index:1;} .self_quick.on .caution_login{right:0;} .self_result_sec01 {padding-top:40px;padding-bottom:20px;background:#fff;} .self_result_my .self_result_sec01 {padding-top:20px;} .self_result_sec01 .w_custom {padding:10px;min-height:300px;box-shadow:12.5px 21.5px 49px 0 rgba(0, 0, 0, 0.19);border:solid 1px #ddd;background-color:#eee;width: calc(100% - 30px);box-sizing:border-box;position:relative;z-index:1;} .self_result_sec01 .w_custom:before {height:36px;background:url(../img/da_image/bg_testresult_chart_hd.png) no-repeat 50% 0;background-size:auto 36px;top:6px;width: calc(100% - 20px);left:50%;transform:translateX(-50%);display:inline-block;content:"";position:absolute;z-index:5;margin:0;padding:0;} .sec01_inner {background:#fff;padding-top:43px;padding-bottom:34px;} .self_test_date {left:50px;top:45px;font-size:17px;line-height:22px;text-align:left;color:#888;font-family: 'Roboto';position:absolute;} .self_result_sec01 h2 {padding:0 0 32px;margin:0 auto;text-align:center;} .self_result_sec01 h2 em {font-size:23px;letter-spacing:0px;height:23px;line-height:23px;margin:0 auto 15px;font-weight:400;color:#ddd;font-style:italic;padding:0;display:block;font-family:'Trirong','Jeju Myeongjo',serif;} .self_result_sec01 h2 strong {font-size:23px;line-height:28px;letter-spacing:-1.15px;font-weight:500;color:#333;padding:0;margin:0 auto;display:block;position:relative;z-index:1;vertical-align:top;width:calc(100% - 30px);line-height:25px;} .self_result_sec01 h2 strong span {line-height:28px;text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;display:inline-block;vertical-align:top;} /*.self_result_sec01 h2 strong:before {left:0;bottom:-5px;height:1px;width:100%;background:#333;position:absolute;display:inline-block;content:"";}*/ .self_result_sec01 h2 strong span b {color:#1c6cc2;font-size:inherit;font-weight:inherit;}/*line-height:inherit;display:inline-block;vertical-align:top;*/ .self_result_sec01 .w_custom .sec01_inner > div {margin:0 auto;padding:0;text-align:center;box-sizing:border-box;} .self_result_sec01 .graph_sec01 {} .graph_sec01 .sec01_graph_inner {width:100%;padding:0 15px;box-sizing:border-box;text-align:center;} .graph_sec01 .sec01_graph_inner + .sec01_graph_inner {padding-bottom:46px;} /* 지수별 색상 */ .progress_donut.fill_0 div, .progress_donut.fill_0 .donut_inner em, .progress-bar.fill_0 .bar_gauge, .fill_0 .progress-fill, .bar_number.fill_0 + em, .fill_title dd span.fill_0 {background:#82d2cb;color:#82d2cb;}/* 20이하-유지 */ .progress_donut.fill_20 div, .progress_donut.fill_20 .donut_inner em, .progress-bar.fill_20 .bar_gauge, .fill_20 .progress-fill, .bar_number.fill_20 + em, .fill_title dd span.fill_20 {background:#82c4d2;color:#82c4d2;}/* 40이하-관심 */ .progress_donut.fill_40 div, .progress_donut.fill_40 .donut_inner em, .progress-bar.fill_40 .bar_gauge, .fill_40 .progress-fill, .bar_number.fill_40 + em, .fill_title dd span.fill_40 {background:#edc207;color:#edc207;}/* 60이하-경계 */ .progress_donut.fill_60 div, .progress_donut.fill_60 .donut_inner em, .progress-bar.fill_60 .bar_gauge, .fill_60 .progress-fill, .bar_number.fill_60 + em, .fill_title dd span.fill_60 {background:#ff8854;color:#ff8854;}/* 80이하-주의 */ .progress_donut.fill_80 div, .progress_donut.fill_80 .donut_inner em, .progress-bar.fill_80 .bar_gauge, .fill_80 .progress-fill, .bar_number.fill_80 + em, .fill_title dd span.fill_80 {background:#e25948;color:#e25948;}/* 90이하-위험 */ .progress_donut.fill_100 div, .progress_donut.fill_100 .donut_inner em, .progress-bar.fill_100 .bar_gauge, .fill_100 .progress-fill, .bar_number.fill_100 + em, .fill_title dd span.fill_100 {background:#c13944;color:#c13944;}/* 100-고위험 */ .progress_donut {width:170px;height:170px;border-radius:50%;position:relative;z-index:1;margin:0 auto;display:inline-block;overflow:hidden;background:#eee;} .progress_donut div {left:85px;top:0px;width:2px;height:85px;transform-origin:0px 85px;background:#e25948;position:absolute;display:none;} .progress_value {transform:lotate(0deg);} .progress_donut .donut_inner {left:18px;top:18px;width:135px;height:135px;border-radius:100%;padding:37px 10px 0;box-shadow:1px 2px 8px 0 rgba(0, 0, 0, 0.28);font-size:45px;line-height:33px;letter-spacing:-0.8px;font-weight:400;color:#333;position:absolute;display:inline-block;margin:0 auto;text-align:center;z-index:10;background:#fff;box-sizing:border-box;} .progress_donut .donut_inner span, .progress_donut .donut_inner em {font-weight:inherit;color:inherit;display:block;vertical-align:top;margin:0 auto;padding:0;background:none !important;} .progress_donut .donut_inner span {margin-bottom:14px;letter-spacing:-2.25px;font-size:inherit;line-height:inherit;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .progress_donut .donut_inner em {line-height:16px;font-size:16px;letter-spacing:-0.8px;} .graph_sec01 .member_info {} .graph_sec01 .member_info ul {padding:30px 0 15px;margin-bottom:20px;border-bottom:1px #333 solid;font-size:0;vertical-align:top;} .graph_sec01 .member_info li {line-height:14px;vertical-align:top;display:inline-block;margin:0;padding:0;position:relative;z-index:1;} .graph_sec01 .member_info li + li {padding-left:33px;} .graph_sec01 .member_info li + li:before {width:1px;height:10px;left:16px;top:2px;margin:0;background:#ddd;display:inline-block;vertical-align:top;content:"";position:absolute;} .graph_sec01 .member_info li dl {line-height:inherit;vertical-align:top;font-size:0;} .graph_sec01 .member_info li dl dt, .graph_sec01 .member_info li dl dd {font-size:14px;letter-spacing:-0.7px;line-height:inherit;vertical-align:top;color:#333;display:inline-block;} .graph_sec01 .member_info li dl dt {padding-right:13px;font-weight:500;} .graph_sec01 .member_info li dl dd {font-weight:300;} .graph_sec01 .member_info + h3 {font-size:18px;line-height:18px;margin-bottom:23px;letter-spacing:-0.9px;font-weight:300;color:#333;vertical-align:top;} .graph_sec01 .member_info + h3 span {font-size:14px;line-height:14px;margin-bottom:14px;letter-spacing: -0.7px;font-weight:300;color:#333;vertical-align:top;display:inline-block;} .graph_sec01 .member_info + h3 strong {font-size:inherit;line-height:inherit;font-weight:700;color:inherit;} .graph_sec01 .member_info + h3 strong b {font-size:inherit;line-height:inherit;font-weight:700;color:inherit;} .graph_sec01 .member_info + h3 em {font-size:inherit;line-height:inherit;font-weight:700;background:none !important;} .graph_sec01 .member_info + h3 strong + em {margin-left:5px;} .graph_sec01 .gradation_bar_wrap {width: calc(100% + 25px);margin-left:-15px;margin-right:-10px;position:relative;z-index:1;} .graph_sec01 .gradation_bar_wrap:before {border-radius:10px;width: calc(100% - 41px);left: 20px;right:45px;top:2px;height:10px;position:absolute;display:inline-block;content:"";background: rgb(195,230,221);background: linear-gradient(90deg, rgba(195,230,221,1) 0%, rgba(130,210,203,1) 20%, rgba(253,207,8,1) 40%, rgba(255,136,84,1) 60%, rgba(226,89,72,1) 80%, rgba(193,57,68,1) 100%);z-index:-1;} .graph_sec01 .gradation_bar_wrap .bar_graph_wrap {width: calc(100% - 40px);height:10px;border-radius:10px;top:2px;right:20px;overflow:hidden;position:absolute;z-index:1;margin:0 auto;padding:0;font-size:0;background:none;border:0;} .graph_sec01 .gradation_bar_wrap .bar_graph_dim {/* padding-left:5px; */right:0;top:0;height:10px;border-radius:10px;position:absolute;display:inline-block;background:#eee;} .graph_sec01 .gradation_bar_wrap ul {width:100%;font-size:0;vertical-align:top;position:relative;z-index:1;} .graph_sec01 .gradation_bar_wrap ul li {width:16.66%;margin:0;padding:0;vertical-align:top;display:inline-block;position:relative;z-index:1;} .graph_sec01 .gradation_bar_wrap ul li span {font-size:12px;line-height:12px;letter-spacing:-0.6px;font-weight:300;color:#999;display:inline-block;vertical-align:top;margin:0 auto;padding:23px 0 0;} .graph_sec01 .gradation_bar_wrap ul li.on span {font-weight:500;color:#333;} .graph_sec01 .gradation_bar_wrap ul li + li {} .graph_sec01 .gradation_bar_wrap ul li span:before, .graph_sec01 .gradation_bar_wrap ul li span:after {transform:translateX(-50%);border-radius:100%;overflow:hidden;display:inline-block;content:"";position:absolute;left:50%;} .graph_sec01 .gradation_bar_wrap ul li span:before {width:14px;height:14px;background:#fff;z-index:1;top:0;} .graph_sec01 .gradation_bar_wrap ul li span:after {width:10px;height:10px;z-index:2;top:2px;} .graph_sec01 .gradation_bar_wrap ul li:nth-of-type(1) span:after {background:#c3e6dd;} .graph_sec01 .gradation_bar_wrap ul li:nth-of-type(2) span:after {background:#82d2cb;} .graph_sec01 .gradation_bar_wrap ul li:nth-of-type(3) span:after {background:#fdcf08;} .graph_sec01 .gradation_bar_wrap ul li:nth-of-type(4) span:after {background:#ff8854;} .graph_sec01 .gradation_bar_wrap ul li:nth-of-type(5) span:after {background:#e25948;} .graph_sec01 .gradation_bar_wrap ul li:nth-of-type(6) span:after {background:#c13944;} .graph_sec01 .gradation_bar_wrap ul li.non span:after, .graph_sec01 .gradation_bar_wrap ul li.non + li span:after, .graph_sec01 .gradation_bar_wrap ul li.non + li + li span:after, .graph_sec01 .gradation_bar_wrap ul li.non + li + li + li span:after, .graph_sec01 .gradation_bar_wrap ul li.non + li + li + li + li span:after {background:#ddd !important;} .self_result_sec01 .graph_sec02 {padding:20px 15px 14px 10px !important;background:#606572;position:relative;z-index:1;} .graph_sec02:before {left:50%;top:0;height:16px;width:44px;transform:translate(-50%, -100%);position:absolute;display:inline-block;content:"";background:url(../img/da_image/bg_bargraph.png) no-repeat 50% 50%;background-size:cover;} .graph_sec02 h3 {font-size:13px;line-height:13px;margin-bottom:13px;letter-spacing: -0.65px;text-align:center;color:#fff;font-weight:400;} .graph_sec02 .bar_graph_wrap {height:152px;} .graph_sec02 .bar_graph_num {width:15px;padding-right:4px;box-sizing:border-box;text-align:right;float:left;} .graph_sec02 .bar_graph_num ul {} .graph_sec02 .bar_graph_num li {font-size:10px;height:10px;line-height:10px;letter-spacing:-0.5px;margin:0;padding:0;margin-top:5px;text-align:right;font-weight:400;display:block;color:#fff;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .graph_sec02 .bar_graph_num li + li {margin-top:8px;} .graph_sec02 .bar_graph_box {width: calc(100% - 15px);float:left;} .bar_graph_box .vertical {padding-top:10px;padding-left:2px;padding-right:2px;position:relative;box-sizing:border-box;z-index:1;} .bar_graph_box .vertical:after {clear:both;content:"";display:block;} .bar_graph_box .vertical:before {height:100px;z-index:-2;background:#fff;width:100%;display:inline-block;content:"";position:absolute;left:0;top:0;} .bar_graph_box .vertical .vertical_liner {width:100%;height:1px;position:absolute;left:0;z-index:-1;background:#ddd;} .bar_graph_box .vertical .vertical_liner:nth-of-type(1) {top:10px;} .bar_graph_box .vertical .vertical_liner:nth-of-type(2) {top:28px;} .bar_graph_box .vertical .vertical_liner:nth-of-type(3) {top:46px;} .bar_graph_box .vertical .vertical_liner:nth-of-type(4) {top:64px;} .bar_graph_box .vertical .vertical_liner:nth-of-type(5) {top:82px;} .bar_graph_box .vertical .progress-bar {height:90px;width:14.28%;float:left;text-align:center;} .bar_graph_box .vertical .progress-bar .bar_tag {font-size:11px;line-height:14px;letter-spacing:-0.55px;padding:10px 0 6px;height:37px;box-sizing:border-box;vertical-align:top;margin:0 auto;display:block;color:#fff;font-weight:300;text-align:center;} .bar_graph_box .vertical .progress-bar:nth-last-of-type(1) .bar_tag, .bar_graph_box .vertical .progress-bar:nth-last-of-type(2) .bar_tag {padding-top:3px;} .bar_graph_box .vertical .progress-bar .bar_gauge {font-size:10px;letter-spacing:-0.5px;height:15px;line-height:13px;border-radius:15px;padding:0 4px 2px 2px;min-width:30px;box-sizing:border-box;vertical-align:top;margin:0 auto;display:inline-block;color:#fff;text-align:center;font-weight:300;} .bar_graph_box .vertical .progress-track {width:12px;height:90px;position:relative;z-index:1;background:none;margin:0 auto;} .bar_graph_box .vertical .progress-fill {height:50%;width:100%;position:relative;font-size:0;line-height:0;} .self_result_sec01 .graph_sec03 {text-align:center;} .self_result_sec01 .graph_sec03 #myChart{position: relative;margin-top:-33px;} .self_result_sec01 .graph_sec03 #myChart:before{width: 50px;height:50px;position: absolute;top:0;left:0;background:#fff;content:"";z-index:10;} .graph_sec03 h3 {padding:40px 0 14px;border-bottom:1px #ddd solid;text-align:center;vertical-align:top;margin:0 auto;width: calc(100% - 30px);} .graph_sec03 h3 em, .graph_sec03 h3 strong {margin:0;padding:0;display:block;vertical-align:top;} .graph_sec03 h3 em {line-height:17px;margin-bottom:13px;font-size:17px;letter-spacing:-0.85px;font-weight:500;color:#333;} .graph_sec03 h3 strong {font-size:28px;line-height:28px;letter-spacing:-1.4px;font-weight:700;color:#2371c3;} .graph_sec03 p {padding-top:16px;line-height:23px;font-size:17px;letter-spacing:-0.85px;font-weight:500;color:#333;text-align:center;vertical-align:top;position: relative;z-index:2;} .graph_sec03 p strong {color:#2371c3;font-size:inherit;line-height:inherit;font-weight:inherit;display:inline-block;vertical-align:top;} .graph_sec03 .thumb {text-align:center;padding:0 5px;box-sizing:border-box;width:100%;} .graph_sec03 .thumb img {width:auto;max-width:100%;height:auto;} .graph_sec03 #myChart-menu-area{display: none;} .self_result_sec01 .graph_sec04 {padding-top:58px;text-align:center;} .graph_sec04 h3 {font-size:19px;padding:0 20px;border-radius:40px;height:40px;line-height:38px;letter-spacing:-0.95px;margin:0 auto -33px;font-weight:700;border:0;vertical-align:top;background:#27282c;color:#fff;display:inline-block;box-sizing:border-box;} .sec04_inner {} .graph_sec04 .graph_type_col {vertical-align:top;font-size:0;} .graph_sec04 .slick-list {padding-left:8px;padding-right:113px;box-sizing:border-box;padding-bottom: 58px;} .graph_sec04 li.slick-slide {padding: 58px 8px 0;box-sizing:border-box;display:inline-block;vertical-align:top;position:relative;z-index:1;background:none;} .graph_sec04 li.slick-slide > dl {background-color:#fff;background-repeat:no-repeat !important;background-position:50% 25px !important;background-size:auto 43px;padding:89px 0 0;border:1px #ddd solid;box-shadow:5px 9px 49px 0 rgba(0, 0, 0, 0.19);box-sizing:border-box;margin:0 auto;width:100%;overflow:hidden;} .graph_sec04 li.slick-slide > dl > dt, .graph_sec04 li.slick-slide > dl > dd {box-sizing:border-box;margin:0 auto;padding:0;vertical-align:top;} .graph_sec04 li.slick-slide > dl > dt {font-size:21px;line-height:21px;padding:18px 0;margin-bottom:20px;letter-spacing:-1.05px;font-weight:400;color:#333;font-family: 'Jeju Myeongjo', serif;position:relative;z-index:1;} .graph_sec04 li.slick-slide > dl > dt:before {font-size:80px;height:57px;line-height:57px;letter-spacing:-4px;margin:0 auto;padding:0;top:0;left:50%;transform:translateX(-50%);font-weight:700;color:#deeaf6;opacity:0.8;position:absolute;display:inline-block;text-align:center;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;vertical-align:top;z-index:-1;} .graph_sec04 li.slick-slide.graph_type_d > dl > dt:before {content:"D";} .graph_sec04 li.slick-slide.graph_type_hl > dl > dt:before {content:"HL";} .graph_sec04 li.slick-slide.graph_type_o > dl > dt:before {content:"O";} .graph_sec04 li.slick-slide.graph_type_s > dl > dt:before {content:"S";} .graph_sec04 li.slick-slide > dl > dd {background:#f5f5f5;padding:16px 6px 18px;box-sizing:border-box;} .graph_sec04 li.slick-slide > dl > dd .liname_01{width:100%;height:66px;box-sizing:border-box;position: relative;} .graph_sec04 li.slick-slide > dl > dd .liname_01 p{position: absolute;top:50%;transform:translateY(-50%);} .graph_sec04 li.slick-slide > dl > dd p {font-size:15px;line-height:22px;letter-spacing: -0.75px;font-weight:300;color:#333;margin:0 auto;padding:0;vertical-align:top;width:100%;} .graph_sec04 li.slick-slide > dl > dd > p {font-size:17px;line-height:23px;letter-spacing:-0.85px;margin-top:8px;font-weight:400;color:#2371c3;height:46px;} .graph_sec04 .slick-dots {bottom: 32px;transform:translateX(-50%);text-align:center;left:50%;position:absolute;z-index:3;margin:0 auto;padding:0;font-size:0;} .graph_sec04 .slick-dots li, .gd_solution .slick-dots button {font-size:0;margin:0;padding:0;border:0;outline:0;display:inline-block;vertical-align:top;opacity:1;transition:all 0.3s;} .graph_sec04 .slick-dots li {width:6px;height:6px;line-height:6px;position:relative;z-index:1;} .graph_sec04 .slick-dots li + li {margin-left:10px;} .graph_sec04 .slick-dots li button {width:6px;height:6px;border-radius:100%;background:#ccc;opacity:0.8;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%) scale(0.65, 0.65);padding: 0;transition: all 0.3s;} .graph_sec04 .slick-dots li.slick-active {} .graph_sec04 .slick-dots li.slick-active button {transform:translate(-50%, -50%) scale(1, 1);background:#333;opacity:1;} .self_result_sec02 {} .self_result_sec02 .w_custom:nth-of-type(1) {padding-top:40px;padding-bottom:41px;background:#fefefe url(../img/da_image/bg_testresult_goods.jpg) no-repeat 50% 6%;background-size:100% auto;} .self_result_sec02 .w_custom:nth-of-type(2) {padding-top:37px;padding-bottom:60px;background:#fff url(../img/da_image/bg_testresult_goods2.jpg) no-repeat 50% 15px;background-size:100% auto;} .self_result_sec02 .w_custom:nth-of-type(1) h3 {font-size:20px;line-height:28px;letter-spacing: -1px;font-weight:400;color:#333;padding-top:64px;padding-bottom:26px;position:relative;z-index:1;text-align:center;} .self_result_sec02 .w_custom:nth-of-type(1) h3:before, .self_result_sec02 .w_custom:nth-of-type(1) h3:after {display:inline-block;content:"";position:absolute;left:50%;transform:translateX(-50%);} .self_result_sec02 .w_custom:nth-of-type(1) h3:before {width:50px;height:50px;top:0;border-radius:100%;background:#4d545b;z-index:1;} .self_result_sec02 .w_custom:nth-of-type(1) h3:after {width:21px;height:21px;top:14.5px;background:url(../img/da_image/icon_result_title_plus.png) no-repeat 50% 50%;background-size:cover;z-index:2;} .self_result_sec02 .w_custom:nth-of-type(1) h3 strong {font-weight:700;font-size:inherit;line-height:inherit;color:inherit;display:inline-block;vertical-align:top;} .self_result_sec02 .w_custom:nth-of-type(1) h3 em {font-size:inherit;line-height:inherit;color:inherit;font-weight:inherit;position:relative;z-index:1;display:inline-block;vertical-align:top;} .self_result_sec02 .w_custom:nth-of-type(1) h3 em:before {bottom:4px;width:100%;height:1px;background:#333;display:inline-block;content:"";position:absolute;left:0;} .self_result_sec02 .btn_center {padding-top:5px;text-align:center;font-size:0;} .self_result_sec02 .btn_center .btn_go {width: calc(50% - 5px);letter-spacing:-0.75px;font-weight:400;} .self_result_sec02 .btn_center .btn_go + .btn_go {margin-left:10px;} .self_result_sec02 .w_custom:nth-of-type(2) h3 {font-size:18px;line-height:20px;letter-spacing: -0.8px;font-weight:500;color:#333;padding-bottom:20px;text-align:center;} .self_result_sec02 .w_custom:nth-of-type(2) h3 strong {font-size:inherit;line-height:inherit;color:inherit;font-weight:inherit;display:inline-block;vertical-align:top;} .self_result_sec02 .w_custom:nth-of-type(2) h3 b {font-size:inherit;line-height:inherit;color:inherit;font-weight:inherit;display:inline-block;vertical-align:top;position:relative;z-index:1;} .self_result_sec02 .w_custom:nth-of-type(2) h3 b:before {bottom:0;height:6px;background:#d2e2f2;width:100%;left:0;z-index:-1;display:inline-block;position:absolute;content:"";} .self_result_sec02 .result_gd_sec {} .self_result_sec02 .result_gd_sec > li {padding:0 0 15px;margin:0;} .self_result_sec02 .result_gd_sec > li + li {} .self_result_sec02 .result_gd_sec > li > dl {border-radius:4px 4px 0 0;overflow:hidden;} .self_result_sec02 .result_gd_sec > li > dl > dt, .self_result_sec02 .result_gd_sec > li > dl > dd {box-sizing:border-box;padding:0;margin:0;} .self_result_sec02 .result_gd_sec > li > dl > dt {padding:8px 15px 7px;height:45px;line-height:30px;border-radius:4px 4px 0 0;margin:0;vertical-align:top;text-align:center;overflow:hidden;} .self_result_sec02 .result_gd_sec > li.gd_sec_shampoo > dl {background:#2371c3;} .self_result_sec02 .result_gd_sec > li.gd_sec_nutrition > dl {background:#565b6a;} .self_result_sec02 .result_gd_sec > li > dl > dt img, .self_result_sec02 .result_gd_sec > li > dl > dt span, .self_result_sec02 .result_gd_sec > li > dl > dt strong {color:#fff;display:inline-block;vertical-align:top;margin:0;padding:0;} .self_result_sec02 .result_gd_sec > li > dl > dt img {width:auto;height:30px;} .self_result_sec02 .result_gd_sec > li > dl > dt span {margin-left:10px;margin-right:10px;font-size:13px;letter-spacing:-0.65px;font-weight:400;line-height:17px;padding:6px 0 7px;} .self_result_sec02 .result_gd_sec > li > dl > dt strong {font-size:17px;font-weight:500;line-height:17px;letter-spacing:-0.85px;padding:6px 0 7px;} .self_result_sec02 .result_gd_sec > li > dl > dd {padding:15px 0 17px;border:1px #ccc solid;border-top:0;border-radius:0;background:#fff;overflow:hidden;text-align:left;} .self_result_sec02 .result_gd_sec > li > dl > dd .gd_solution {} .self_result_sec02 .result_gd_sec > li > dl > dd .gd_solution ul {overflow:hidden;transition:all 0.5s;padding:0;width:100%;margin:0;vertical-align:top;font-size:0;} .gd_solution .gd_solution_slide {} .gd_solution .gd_solution_slide .slick-list {box-sizing:border-box;padding-left:8px;padding-right:60px;} .gd_solution .gd_solution_slide .slick-slide {padding:0 8px;box-sizing:border-box;} .gd_solution .slick-dots {bottom:0;transform:translateX(-50%);text-align:center;left:50%;position:absolute;z-index:3;margin:0 auto;padding:0;font-size:0;} .gd_solution .slick-dots li, .gd_solution .slick-dots button {font-size:0;margin:0;padding:0;border:0;outline:0;display:inline-block;vertical-align:top;opacity:1;transition:all 0.3s;} .gd_solution .slick-dots li {width:6px;height:6px;line-height:6px;position:relative;z-index:1;} .gd_solution .slick-dots li + li {margin-left:10px;} .gd_solution .slick-dots li button {width:6px;height:6px;border-radius:100%;background:#ccc;opacity:0.8;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%) scale(0.65, 0.65);} .gd_solution .slick-dots li.slick-active {} .gd_solution .slick-dots li.slick-active button {transform:translate(-50%, -50%) scale(1, 1);background:#333;opacity:1;} .gd_solution .gd_solution_slide .slick-arrow {width:7px;height:24px;bottom:-6px;background: none;position:absolute;transform: translateY(0);z-index:6;font-size:0;display:inline-block;vertical-align:top;margin:0;padding:0;border:0;border-radius:100%;outline:0;font-size:0;opacity:1;transition:all 0.3s;} .gd_solution .gd_solution_slide .slick-arrow:before {width:8px;height:8px;border-width: 1px 1px 0 0;left:50%;top:50%;position:absolute;border-style:solid;box-sizing:border-box;border-color:#666;display:inline-block;content:"";} .gd_solution .gd_solution_slide .slick-arrow.slick-prev {left: 10px;} .gd_solution .gd_solution_slide .slick-arrow.slick-next {right: 10px;} .gd_solution .gd_solution_slide .slick-arrow.slick-prev:before {transform:translate(-25%, -50%) rotate(-135deg);} .gd_solution .gd_solution_slide .slick-arrow.slick-next:before {transform:translate(-75%, -50%) rotate(45deg);} .gd_solution .gd_solution_slide .slick-arrow.slick-disabled {opacity:0;cursor:inherit;} .gd_box {display:table;table-layout:fixed;margin:0 auto;width:100%;border-collapse:collapse;box-sizing:border-box;} .gd_box .thumb, .gd_box .txt {padding:0 0 32px 0;vertical-align:middle;border-collapse:collapse;box-sizing:border-box;display:table-cell;} .gd_box .thumb {width:33.2%;text-align:center;} .gd_box .thumb img {width:100%;height:auto;vertical-align:middle;} .gd_box .txt {width:auto;padding-left:20px;} .gd_box .txt .form_element.form_custom {position:relative;z-index:2;display:block;width:100%;height:25px;overflow:inherit;} .gd_box .txt .form_element.form_custom label {width:100%;min-height:25px;height:114px;left:0;top:0;background-position:0 0 !important;z-index:5;position:absolute;font-size:0;} .gd_box .txt h4, .gd_box .txt p{overflow:hidden;text-overflow:ellipsis;} .gd_box .txt h4 {font-size:16px;line-height:20px;height:20px;letter-spacing:-0.8px;margin-top:11px;margin-bottom:6px;font-weight:400;color:#333;white-space:nowrap;} .gd_box .txt p {font-size:14px;line-height:21px;height:42px;letter-spacing:-0.7px;margin-bottom:16px;font-weight:300;color:#777;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;} .gd_box .txt .btn_review_more {} .gd_box .txt .btn_gd_cart {margin-left:17px;} .self_result_sec02 .result_gd_sec > li > dl > dd .gd_solution .gd_more {display:block;height:53px;padding:15px 0;border:0;outline:0;border-top:1px #eee solid;font-size:15px;line-height:22px;letter-spacing:-0.75px;color:#444;text-align:center;cursor:pointer;width:100%;margin:0;margin-top:20px;box-sizing:border-box;vertical-align:top;} .self_result_sec02 .result_gd_sec > li > dl > dd .gd_solution .gd_more.on {display:block;} .self_result_sec02 .result_gd_sec > li > dl > dd .gd_solution .gd_more span {padding:0 28px 0 0;margin:0;font-size:inherit;line-height:inherit;color:inherit;display:inline-block;vertical-align:top;position:relative;z-index:1;} .self_result_sec02 .result_gd_sec > li > dl > dd .gd_solution .gd_more span:after {width:6px;height:6px;right:2px;top:50%;transform:translateY(-25%) rotate(-45deg);border-width:1px 1px 0 0;border-style:solid;border-color:#333;box-sizing:border-box;position:absolute;display:inline-block;content:"";} .self_result_sec02 .result_gd_sec > li > dl > dd .gd_solution .gd_more.on span:after {transform:translateY(-75%) rotate(135deg);} .self_result_sec02 .result_gd_toggle {} .self_result_sec02 .result_gd_toggle > ul {border:1px #333 solid;background:#fff;width:100%;box-sizing:border-box;margin:0;padding:0;} .self_result_sec02 .result_gd_toggle > ul > li {} .self_result_sec02 .result_gd_toggle > ul > li + li {border-top:1px #ddd solid;} .self_result_sec02 .result_gd_toggle > ul > li > dl {} .self_result_sec02 .result_gd_toggle > ul > li.on > dl {} .self_result_sec02 .result_gd_toggle > ul > li > dl > dt, .self_result_sec02 .result_gd_toggle > ul > li > dl > dd {border:0;box-sizing:border-box;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dt {padding:15px 41px 15px 15px;line-height:15px;cursor:pointer;position:relative;z-index:1;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dt:before {width:11px;height:6px;right:15px;top:50%;transform:translateY(-50%) rotate(-180deg);background:url(../img/da_image/icon_gd_toggle.png) no-repeat 50% 50%;background-size:100% 100%;display:inline-block;content:"";position:absolute;} .self_result_sec02 .result_gd_toggle > ul > li.on > dl > dt {border-bottom:1px #ddd solid;} .self_result_sec02 .result_gd_toggle > ul > li.on > dl > dt:before {transform:translateY(-50%) rotate(0deg)} .self_result_sec02 .result_gd_toggle > ul > li > dl > dt strong, .self_result_sec02 .result_gd_toggle > ul > li > dl > dt em {min-width:initial;padding:0;margin:0;line-height:inherit;display:inline-block;vertical-align:top;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dt strong {font-size:15px;letter-spacing: -0.75px;padding:0 10px 0 0;font-weight:500;color:#2371c3;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dt em {font-size:13px;letter-spacing:-0.65px;font-weight:400;color:#333;max-width: calc(100% - 130px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}/**/ .self_result_sec02 .result_gd_toggle > ul > li > dl > dd {height:0;overflow:hidden;width:100%;margin:0;padding:0 15px;position:relative;z-index:1;} .self_result_sec02 .result_gd_toggle > ul > li.on > dl > dd {height:auto;overflow:inherit;padding-top:15px;padding-bottom:33px;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dd .txt {width:64.3%;float:left;text-align:left;position:relative;z-index:2;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dd .txt p {width:100%;margin:0 auto 21px 0;padding:0;font-size:13px;line-height:21px;letter-spacing:-0.65px;font-weight:300;color:#555;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dd .txt .btn_review_more {margin-top:1px;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dd .txt .btn_review_more + .btn_gd_cart {margin-left:14px;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dd .thumb {width:21%;text-align:center;vertical-align:top;float:right;position:static;right:0;bottom:15px;z-index:1;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dd .thumb img {width:100%;height:auto;vertical-align:top;} .self_result_sec03 {background:url(../img/da_image/bg_testresult_mail.jpg) no-repeat 50% 50%;background-size:cover;} .self_result_sec03 .w_custom {text-align:center;padding-top:29px;padding-bottom:30px;} .self_result_sec03 legend {display:none;} .self_result_sec03 h3 {padding-left:28px;font-size:15px;line-height:15px;letter-spacing: -0.75px;background:url(../img/da_image/icon_testresult_mail.png) no-repeat 0 50%;background-size:auto 12px;font-weight:300;color:#fff;display:inline-block;margin:0 auto;} .self_result_sec03 input[type="text"] {width:89.85%;height:45px;line-height:45px;font-size:14px;letter-spacing:-0.7px;font-weight:300;color:#333;margin-top:19px;margin-bottom:25px;margin-left:auto;margin-right:auto;text-align:center;display:block;outline:0;border:0;} .self_result_sec03 input[type="text"]:placeholder {font-size:14px;letter-spacing:-0.7px;font-weight:300;color:#888;} .self_result_sec03 input[type="text"]::placeholder {font-size:14px;letter-spacing:-0.7px;font-weight:300;color:#888;} .self_result_sec03 input[type="text"]:-webkit-input-placeholder {font-size:14px;letter-spacing:-0.7px;font-weight:300;color:#888;} .self_result_sec03 input[type="text"]:-ms-input-placeholder {font-size:14px;letter-spacing:-0.7px;font-weight:400;color:#888;} .self_result_sec03 .btn_go {width:167px;letter-spacing:-0.75px;font-weight:400;} .self_result_sec04 {background:#f0efed;padding-bottom:50px;} .self_result_sec04 h3 {font-size:17px;line-height:28px;font-weight:300;letter-spacing:-0.85px;padding-top:35px;padding-bottom:26px;color:#333;vertical-align:top;width:100%;background:#fff;text-align:center;position:relative;z-index:1;} .self_result_sec04 h3:before {height:40px;bottom:-22px;background:#ccc;width:1px;position:absolute;left:50%;display:inline-block;content:"";} .self_result_sec04 h3 em, .self_result_sec04 h3 strong, .self_result_sec04 h3 b {font-size:inherit;line-height:inherit;color:inherit;display:inline-block;vertical-align:top;} .self_result_sec04 h3 em {font-size:60px;line-height:51px;height:51px;margin-bottom:-14px;letter-spacing:0;font-weight:400;color:#333;opacity:0.1;display:block;font-family: 'Italianno', cursive;} .self_result_sec04 h3 strong {font-weight:700;letter-spacing:-1.4px;} .self_result_sec04 h3 b {position:relative;z-index:1;font-weight:700;} .self_result_sec04 h3 b:before {height:5px;bottom:4px;background:#d7d3c8;width: calc(100% + 6px);position:absolute;left:-3px;display:inline-block;content:"";z-index:-1;} .self_result_sec04 .w_custom {margin-top:30px;margin-left:15px;margin-right:15px;width: calc(100% - 30px);padding-left:0 !important;padding-right:0 !important;box-shadow: 4.6px 3px 17.5px 0 rgba(0, 0, 0, 0.16);} .self_result_sec04 .life_style_wrap {padding-left:15px;padding-right:15px;width:100%;padding-bottom:30px;padding-bottom:30px;background:#f0efed;text-align:center;box-sizing:border-box;} .self_result_sec04 .life_style_wrap .txt {} .self_result_sec04 .life_style_wrap .txt p {font-size:20px;line-height:28px;padding-top:25px;padding-bottom:25px;letter-spacing:-1.0px;font-weight:300;color:#333;position:relative;z-index:1;} .self_result_sec04 .life_style_wrap .txt p strong {font-size:inherit;line-height:inherit;font-weight:500;color:inherit;display:inline-block;vertical-align:top;} .self_result_sec04 .life_style_wrap .txt p span {font-size:14px;line-height:16px;margin-top:17px;letter-spacing:-0.7px;font-weight:400;color:#908372;display:inline-block;vertical-align:top;} .self_result_sec04 .life_style_wrap .txt p b {font-size:inherit;line-height:inherit;font-weight:500;color:inherit;display:inline-block;vertical-align:top;position:relative;z-index:1;} .self_result_sec04 .life_style_wrap .txt p b:before {height:8px;bottom:1px;background:#d7d3c8;width:100%;position:absolute;left:0;display:inline-block;content:"";z-index:-1;} .self_result_sec04 .life_style_wrap .txt .btn_go.btn_self_go {width:160px;letter-spacing:1.5px;font-weight:500;font-family:'Trirong','Jeju Myeongjo',serif;} .self_result_sec04 .life_style_wrap .thumb {padding-top:20px;vertical-align:top;} .self_result_sec04 .life_style_wrap .thumb img {vertical-align:top;width:63.495%;height:auto;margin:0 auto;} .self_result_sec04 ol {font-size:0;vertical-align:top;background:#fff;width:100%;box-sizing:border-box;} .self_result_sec04 .selfstep_ol > li {text-align:left;} .self_result_sec04 .selfstep_ol > li > .txt {position:absolute;right:0;top:50%;transform:translateY(-50%);} .self_result_sec04 .selfstep_ol > li:nth-of-type(1) {padding-top:20px;} .self_result_sec04 .selfstep_ol > li:nth-of-type(1) > .txt {top: calc(50% - 8px);} .self_result_sec04 .selfstep_ol > li:nth-of-type(3) {padding-bottom:20px;} .self_result_sec04 .selfstep_ol > li:nth-of-type(3) > .txt {top: calc(50% + 8px);} .self_result_sec05 {} .self_result_sec05 .w_custom {padding-top:50px;padding-bottom:60px;text-align:center;} .self_result_sec05 .w_custom p {color:#222;margin:0 auto;padding:0;text-align:center;vertical-align:top;} .self_result_sec05 .w_custom p:first-child {font-size:16px;font-weight:400;line-height:18px;position:relative;z-index:1;display:inline-block;letter-spacing: -0.8px;} .self_result_sec05 .w_custom p:first-child:before {bottom:0;left:0;width:100%;height:1px;background:#222;display:inline-block;content:"";position:absolute;} .self_result_sec05 .w_custom p:nth-of-type(2) {font-size:20px;line-height:28px;padding-top:16px;padding-bottom:26px;letter-spacing:-1.0px;font-weight:300;} .self_result_sec05 .w_custom p strong {font-size:inherit;font-weight:500;color:inherit;line-height:inherit;} .self_result_sec05 .w_custom ul.clear {} .self_result_sec05 .w_custom ul.clear li {font-size:0;vertical-align:top;} .self_result_sec05 .w_custom ul.clear li + li {margin-top:15px;} .self_result_sec05 .w_custom ul.clear li img {vertical-align:top;width:100%;height:auto;} .self_result_sec06 {padding-top:29px;padding-bottom:24px;background:#28413b;margin-bottom:55px;} .sub_content + .self_result_sec06 {margin-top:60px;} .self_result_sec06 .w_custom {} .self_result_sec06 .w_custom dl {width:85.65%;display:block;box-sizing:border-box;margin:0 auto;} .self_result_sec06 .w_custom dt, .self_result_sec06 .w_custom dd {padding:0;color:#fff;display:block;vertical-align:middle;box-sizing:border-box;text-align:left;} .self_result_sec06 .w_custom dt {font-size:15px;line-height:1em;padding-left:37.96%;letter-spacing: -0.75px;min-height:45px;background:url(../img/da_image/icon_result_next.png) no-repeat 15.25% 50%;background-size:47px auto;} .self_result_sec06 .w_custom dt strong {padding:0;padding-top:8px;font-size:30px;line-height:1em;letter-spacing:-1.5px;font-weight:700;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;display:inline-block;vertical-align:middle;} .self_result_sec06 .w_custom dd {padding-top:17px;} .self_result_sec06 .w_custom dd ul {} .self_result_sec06 .list_check li {color:#fff;letter-spacing: -0.8px;} .self_result_sec06 .list_check li:before {background-image:url(../img/da_image/icon_list_check_wh.png);} .self_result_sec06 .list_check li a {color:#fff600;} .self_result_my .self_result_sec02 .w_custom:nth-of-type(2) {padding-bottom:30px;} .self_result_my + .btn_center {padding:0 0 15px;} .self_result_my + .btn_center .btn_go {max-width:160px;} /* 두피진단 수치 */ .fill_title {text-align:center;margin:0;padding:0;display:inline-block;vertical-align:inherit;font-size:0;} .fill_title dt, .fill_title dd {margin:0;padding:0;display:inline-block;vertical-align:inherit;min-height:25px;line-height:25px;} .fill_title dt {font-size:15px;letter-spacing:-0.75px;font-weight:500;color:#333;} .fill_title dd {padding-left:9px;} .fill_title dd span {height:25px;border-radius:12.5px;min-width:50px;font-size:13px;font-weight:400;letter-spacing:-0.65px;padding:0 8px;text-align:center;color:#fff !important;display:inline-block;vertical-align:inherit;box-sizing:border-box;} @media only screen and (max-width:360px) { .self_result_sec01 .w_custom {padding:8px;} .self_result_sec01 h2 em {font-size:22px;height:22px;line-height:22px;} .self_result_sec01 h2 strong {font-size:22px;line-height:24px;letter-spacing:-1.1px;} .self_result_sec01 .graph_sec02 {padding-left:10px !important;padding-right:10px !important;} .graph_sec03 h3 em {line-height:16px;font-size:16px;letter-spacing:-0.8px;} .graph_sec03 h3 strong {font-size:26px;line-height:26px;letter-spacing:-1.3px;} .graph_sec03 p {line-height:22px;font-size:16px;letter-spacing:-0.8px;} .graph_sec04 .slick-list {padding-right:94px;} .graph_sec04 li.slick-slide > dl > dd p {font-size:14px;line-height:21px;letter-spacing:-0.7px;height:42px;} .graph_sec04 li.slick-slide > dl > dd p + p {font-size:16px;line-height:22px;letter-spacing:-0.8px;} .self_result_sec02 .w_custom:nth-of-type(1) h3 {font-size:19px;line-height:26px;letter-spacing:-0.95px;} .gd_solution .gd_solution_slide .slick-list {padding-right:52px;} .gd_box .txt {padding-left:15px;} .self_result_sec04 .life_style_wrap .txt p {font-size:19px;letter-spacing:-0.95px;line-height:27px;} .self_result_sec06 .w_custom dl {width:98%;} } @media only screen and (max-width:350px) { .graph_sec04 li.slick-slide > dl > dd .liname_01{height:60px;} .graph_sec04 li.slick-slide > dl > dd p{font-size:13px;} } @media only screen and (max-width:335px) { .gd_box .txt .btn_gd_cart{margin-left:10px;} } @media only screen and (max-width:320px) { .self_quick {left:10px;} .graph_sec01 .sec01_graph_inner, .self_result_sec02 .result_gd_toggle > ul > li.on > dl > dd, .self_result_sec04 .life_style_wrap {padding-left:10px;padding-right:10px;} .self_result_sec01 .graph_sec02 {padding-left:7px !important;padding-right:7px !important;} .self_result_sec01 .w_custom, .graph_sec03 h3, .self_result_sec04 .w_custom {width: calc(100% - 20px);} .self_result_sec01 .w_custom {padding:6px;} .self_result_sec01 h2 em {font-size:21px;height:21px;line-height:21px;} .self_result_sec01 h2 strong {font-size:21px;line-height:22px;letter-spacing:-1.05px;} .graph_sec01 .gradation_bar_wrap .bar_graph_wrap {width: calc(100% - 38px);} .graph_sec03 h3 em {line-height:15px;font-size:15px;letter-spacing:-0.75px;} .graph_sec03 h3 strong {font-size:25px;line-height:25px;letter-spacing:-1.25px;} .graph_sec03 p {line-height:21px;font-size:15px;letter-spacing:-0.75px;} .self_result_sec04 .w_custom {margin-left:10px;margin-right:10px;} .graph_sec04 .slick-list {padding-left:5px;padding-right:84px;} .graph_sec04 li.slick-slide {padding-left:5px;padding-right:5px;} .graph_sec04 li.slick-slide > dl > dd {padding-left:4px;padding-right:4px;} .self_result_sec02 .w_custom:nth-of-type(1) h3 {font-size:18px;line-height:25px;letter-spacing:-0.9px;} .gd_box .txt {padding-left:10px;} .gd_solution .gd_solution_slide .slick-list {padding-left:5px;padding-right:48px;} .gd_solution .gd_solution_slide .slick-slide {padding-left:5px;padding-right:5px;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dt {padding-left:10px;} .self_result_sec02 .result_gd_toggle > ul > li > dl > dt strong {padding-right:6px;} .self_result_sec04 .life_style_wrap .txt p {font-size:18px;letter-spacing:-0.9px;line-height:26px;} .self_result_sec04 .life_style_wrap .txt p span {font-size:13px;letter-spacing:-0.65px;} .self_result_sec06 .w_custom dl {width:90%;} } /*** 온라인상담 인트로 - service/online_intro.html ***/ /* 일반 - 375 */ .onintro_sec01 .btn_self_go.btn_go, .onintro_sec02 .btn_self_go.btn_go, .onintro_sec03 .btn_self_go.btn_go{width:170px; font-size:15px; letter-spacing:-1px;} .onintro_sec01 {background:#f0ede9;padding-top: 38px;padding-bottom: 60px;} .onintro_sec01 .w_custom {text-align:center;} .onintro_sec01 h3 {} .onintro_sec01 h3 strong {font-size: 23px;letter-spacing: -1.4px;line-height: 32px;font-weight:500;display:block;vertical-align:top;margin:0 auto;padding:0;} .onintro_sec01 h3 strong b {font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;line-height:inherit;letter-spacing:inherit;display:inline-block;vertical-align:top;margin:0;padding:0;position:relative;z-index:1;box-sizing:border-box;letter-spacing: -1.4px;} .onintro_sec01 h3 strong b:after {height:11px;bottom:2px;width: calc(100% + 4px);left:0;background:#bb9284;opacity:0.2;position:absolute;display:inline-block;content:"";z-index:-1;} .onintro_sec01 p {margin-top: 12px;font-size: 14px;line-height: 20px;font-weight:400;color:#333;letter-spacing: -1px;} .onintro_sec01 img {margin-top: 25px;margin-bottom: 20px; max-width: 100%;} .onintro_sec01 p[data-aos].aos-animate {transition-delay:0.1s;} .onintro_sec01 img[data-aos].aos-animate {transition-delay:0.2s;} .onintro_sec02 {position:relative;z-index:1;} .onintro_sec02 .w_custom {text-align:center;padding-top: 60px;padding-bottom:60px;max-width:1200px;} .onintro_info {width:100%;margin:0;display: block;box-sizing:border-box;box-shadow: 3.25px 5.65px 28.5px 0 rgba(0, 0, 0, 0.21);padding: 22px 20px 27px 20px;} .onintro_info + .onintro_info {margin-top:20px;} .onintro_info .info_txt, .onintro_info .info_thumb {display: block;vertical-align:middle;box-sizing:border-box;} .onintro_info .info_txt {text-align:left;width:auto;} .onintro_info:nth-of-type(even) .info_txt {} .onintro_info .info_txt dt, .onintro_info .info_txt dd {} .onintro_info .info_txt dt {line-height: 32px;font-size: 20px;font-weight:500;color:#333;letter-spacing: -1px;} .onintro_info .info_txt dt b {font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;line-height:inherit;letter-spacing:inherit;display:inline-block;vertical-align:top;margin:0;padding:0;position:relative;z-index:1;box-sizing:border-box;} .onintro_info .info_txt dt b:after {height: 8px;bottom: 3px;width: calc(100% + 2px);left:-1px;background:#bb9284;opacity:0.2;position:absolute;display:inline-block;content:"";z-index:-1;} .onintro_info .info_txt dd {padding-top: 24px;font-size: 14px;line-height: 21px;font-weight:300;color:#333;letter-spacing: -0.9px;} .onintro_info .info_thumb {position:relative;z-index:1;padding-left:45px;padding-bottom:15px;margin-top: 22px;font-size:0;vertical-align:top;} .onintro_info .info_thumb:before {width: calc(100% + 20px);height: calc(100% - 15px);left:0;bottom: -10px;position:absolute;background:#f5f5f5;display:inline-block;content:"";z-index:-1;} .onintro_info:nth-of-type(even) .info_thumb {padding-left: 0;padding-right:45px;} .onintro_info:nth-of-type(even) .info_thumb:before {left:auto;right:0;} .onintro_info .info_thumb img {width:100%;height:auto;vertical-align:top;} .onintro_info .info_thumb span {top: calc(50% - 8px);transform: translateY(-50%) rotate(90deg);font-size: 13px;line-height:14px;height:14px;width:59.02%;letter-spacing:0;font-weight:300;color:#888;font-style:italic;display:inline-block;position:absolute;z-index:1;font-family:'Trirong','Jeju Myeongjo',serif;box-sizing:border-box;text-align:left;} .onintro_info:nth-of-type(odd) .info_thumb span {text-align:right;left: -23%;} .onintro_info:nth-of-type(even) .info_thumb span {right: -22.5%;text-align:right;} .onintro_info .info_thumb span:before {width: calc(38% - 15px);height:1px;background:#888;left:0;top:6px;display:inline-block;position:absolute;content:"";} .onintro_info:nth-of-type(odd) .info_thumb span:before {width: calc(44% - 15px);} .onintro_sec02 .onintro_info dd[data-aos].aos-animate {transition-delay:0.2s;} .onintro_sec03 {padding-top: 55px;padding-bottom:100px;text-align:center;background: #f5f5f5;} .onintro_sec03 h3 {margin-bottom:25px;} .onintro_sec03 h3 em {margin:0;font-size: 15px;line-height: 22px;color:#333;font-weight:300;font-style:italic;font-family:'Trirong','Jeju Myeongjo',serif;display:inline-block;} .onintro_sec03 h3 strong {font-size:40px;line-height:52px;letter-spacing: -1.75px;display:block;vertical-align:top;margin:0 auto;padding:0;font-family:'Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .onintro_sec02 + .onintro_sec03 h3 em {} .onintro_sec02 + .onintro_sec03 h3 strong {font-size: 24px;line-height:42px;font-weight:500;} .onintro_sec02 + .onintro_sec03 h3 strong b {font-size:inherit;font-weight:inherit;} .onintro_sec03 h3 strong b {font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;line-height:inherit;letter-spacing:inherit;display:inline-block;vertical-align:top;margin:0;padding:0;position:relative;z-index:1;box-sizing:border-box;} .onintro_sec03 h3 strong b:after {height:11px;width: calc(100% + 2px);left: 0;background:#bb9284;opacity:0.2;bottom: 5px;position:absolute;display:inline-block;content:"";z-index:-1;} .onintro_sec03 .selfstep_ol{background:#fff; margin-bottom:30px; box-shadow: 3.25px 5.65px 28.5px 0 rgba(0, 0, 0, 0.21);} .onintro_sec03 .selfstep_ol > li{text-align:left;} .onintro_sec03 .selfstep_ol > li .thumb, .onintro_sec03 .selfstep_ol > li .txt {border-collapse:collapse;display:table-cell;vertical-align:middle;} .onintro_sec03 .selfstep_ol > li .thumb {} .onintro_sec03 .selfstep_ol > li .txt {width:auto;} .onintro_sec03 .selfstep_ol > li .txt p{font-size:19px;line-height:23px;font-weight:500;letter-spacing:-0.95px;padding-left:15px;margin-top:-8px;} @media only screen and (max-width:360px) { .onintro_sec01 h3 strong {font-size:21px;letter-spacing:-1.3px;line-height:30px;} .onintro_sec03 .selfstep_ol > li > p{font-size:17px;} .onintro_info {padding-left:15px;padding-right:15px;} .onintro_info .info_thumb {padding-left:40px;} .onintro_info .info_thumb:before {width: calc(100% + 15px);} .onintro_info:nth-of-type(odd) .info_thumb span {left:-23%;} .onintro_info:nth-of-type(even) .info_thumb span {right:-22.5%;} .onintro_info .info_txt dd {font-size:13px;line-height:20px;letter-spacing:-0.8px;} .onintro_sec03 .selfstep_ol > li .txt p{font-size:18px;line-height:22px;letter-spacing:-0.9px;margin-top:-7px;} } @media only screen and (max-width:340px) { } @media only screen and (max-width:320px) { .onintro_sec01 h3 strong{line-height:30px;} .onintro_sec01 p, .onintro_info .info_txt dd{font-size:13px;} .onintro_info .info_txt dt{font-size:19px;} .onintro_sec02 + .onintro_sec03 h3 strong{font-size:21px;} .onintro_info {padding-left:10px;padding-right:10px;} .onintro_info .info_thumb {padding-left:35px;} .onintro_info .info_thumb span{width:150px;} .onintro_info:nth-of-type(odd) .info_thumb span:before{width:40px;} .onintro_info .info_thumb span:before{width:30px;} .onintro_sec03 .selfstep_ol > li .txt p{font-size:17px;line-height:21px;letter-spacing:-0.85px;margin-top:-6px;padding-left:10px;} } .layer_service_ready .pop_box{width:calc(100% - 32.5px);border:1px solid #333;box-shadow:0 0 38px rgba(0,0,0,0.21);} .layer_service_ready .pop_service_ready{background:url('../img/da_image/icon_service_ready.png')no-repeat center top;padding-top:59px;background-size:auto 46px;} .layer_service_ready a{display: block;width:100%;height:100%;} .layer_service_ready .ready_tit{font-size:16px;color:#333;font-weight:400;line-height:20px;} .layer_service_ready .ready_tit strong{font-weight:500;color:#275b4e;} .layer_service_ready .ready_cont{font-size:13px;color:#777;font-weight:400;line-height:20px;margin-top:9px;} .layer_service_ready .ready_cont span{display:block;color:#999;} /*** 오프라인 인트로 & 지점안내 - service/offline_intro.html & service/offline_spot.html ***/ /* pc 일반 */ .offintro_sec01 {background:#f0ede9;padding-top:70px;padding-bottom:72px;} .offintro_sec01 .w_custom {text-align:center;max-width:1200px;} .offintro_sec01 h3 {} .offintro_sec01 h3 strong {font-size:40px;letter-spacing: -2px;line-height:52px;font-weight:500;display:block;vertical-align:top;margin:0 auto;padding:0;} .offintro_sec01 h3 strong b {font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;line-height:inherit;letter-spacing:inherit;display:inline-block;vertical-align:top;margin:0;padding:0;position:relative;z-index:1;box-sizing:border-box;} .offintro_sec01 h3 strong b:after {height:11px;bottom:-1px;width: calc(100% + 12px);left:-6px;background:#e5dbd5;bottom:0;position:absolute;display:inline-block;content:"";z-index:-1;} .offintro_sec01 p {margin-top:22px;font-size:20px;line-height:30px;letter-spacing:-1px;font-weight:400;color:#333;} .offintro_sec01 .thumb {padding:36px 0 55px;position:relative;z-index:1;text-align:center;} .offintro_sec01 .thumb div + div {position:absolute;left:0;bottom:0;} .offintro_sec01 p[data-aos].aos-animate {transition-delay:0.2s;} .offintro_sec01 img[data-aos].aos-animate {transition-delay:0.3s;} .offintro_sec02 {padding-bottom:80px;position:relative;z-index:1;} .offintro_sec01 + .offintro_sec02 {padding-bottom:40px;} .off_sort_wrap {font-size:0;vertical-align:top;position:relative;z-index:3;margin-top:-22px;} .off_sort_wrap form {} .off_sort_wrap legend {display:none;} .off_sort_wrap select {width:50%;height:45px;font-size:15px;line-height:44px;font-weight:400;/* color:#333; */letter-spacing:-0.75px;padding-left:13px;box-sizing:border-box;border: 1px solid #ccc !important;box-shadow: 6px 6px 10px rgba(0,0,0,0.1);} .off_sort_wrap select option[selected]{background:#275b4e;color:#fff;} #wrap #offLayerchkArea select, #wrap .chosen-container + select + .chosen-container, #wrap #offLayerchkArea .chosen-container {margin-left:-1px;width:calc(50% + 1px);} #wrap .off_sort_wrap .chosen-single {padding-left:19px;height:60px;font-size:16px;letter-spacing:-0.8px;font-weight:400;color:#333;} #wrap .off_sort_wrap .chosen-single > span {line-height:58px;} #wrap .off_sort_wrap .chosen-container-single .chosen-single div {width:28px;right:7px;} #wrap .off_sort_wrap .chosen-container-single .chosen-single div b {width:17px;background-position:0 17px;} .off_sort_wrap input[type="text"] {width: calc(100% - 45px);height: 45px;line-height:24px;padding: 7px 14px;font-size: 15px;letter-spacing: -0.75px;font-weight:400;color:#333;box-sizing:border-box;border:1px #ccc solid;border-right:0;margin-top: 5px;box-shadow: 6px 6px 10px rgba(0,0,0,0.1);} .off_sort_wrap input[type="text"]:placeholder {font-size:15px;font-weight:400;color:#777;letter-spacing:-0.75px;} .off_sort_wrap input[type="text"]::placeholder {font-size:15px;font-weight:400;color:#777;letter-spacing:-0.75px;} .off_sort_wrap input[type="text"]:-webkit-input-placeholder {font-size:15px;font-weight:400;color:#777;letter-spacing:-0.75px;} .off_sort_wrap input[type="text"]:-ms-input-placeholder {font-size:15px;font-weight:400;color:#777;letter-spacing:-0.75px;} .off_sort_wrap .sort_search {width: 45px;height: 45px;outline:0;border:0;background:#27282c url(../img/da_image/icon_area_search.png) no-repeat 50% 50%;background-size: 18px auto;font-size:0;vertical-align:top;margin-top: 5px;box-shadow: 6px 6px 10px rgba(0,0,0,0.1);} .off_slide_wrap{width:100%;box-sizing:border-box;} .off_slide_wrap ul li img{width:100%;} .off_slide_wrap ul .slick-dots{width:100%;box-sizing:border-box;font-size:0;text-align:center;margin-top:15px;margin-bottom:40px;} .off_slide_wrap ul .slick-dots li{display: inline-block;box-sizing:border-box;margin:0 5px;width:4px;height:4px;} .off_slide_wrap ul .slick-dots li button{width:100%;height:100%;box-sizing:border-box;border-radius:100%;background:#aaa;padding:0;} .off_slide_wrap ul .slick-dots li.slick-active{width:6px;height:6px;} .off_slide_wrap ul .slick-dots li.slick-active button{background:#333;} .off_list_wrap {} .off_list_wrap .off_slide_ul .slick-list li{position: relative;width:100%;padding-bottom:25.74%;} .off_list_wrap .off_slide_ul .slick-list li a{display: block;width:100%;height:100%;position: absolute;top:0;left:0;} .off_list_wrap .off_count {font-size:15px;line-height:1;font-weight:400;color:#444;margin-top:25px;letter-spacing:-0.75px;margin-bottom:15px;} .off_list_wrap .off_count strong {font-size:inherit;line-height:inherit;font-weight:500;color:#275b4e;} .off_list_wrap > ul {/*padding-top:30px;*/} .off_list_wrap > ul > li {position:relative;z-index:1;background:#fff;} .off_list_wrap > ul > li:before {border:1px #ddd solid;left:0;top:0;display:inline-block;content:"";background:none;position:absolute;width:100%;height:100%;z-index:-1;box-sizing:border-box;} .off_list_wrap > ul > li + li {margin-top:20px;} .off_list_wrap > ul > li.on + li {margin-top:50px;} .off_list_wrap > ul > li > a.btn_detail_area {position:absolute;left:0;top:0;display:block;z-index:3;width:100%;height:100%;} .off_list_wrap {width:100%;margin:0 auto;z-index:2;position:relative;} .off_list_wrap .thumb, .off_list_wrap .txt, .off_list_wrap .go_reservatation {vertical-align:middle;box-sizing:border-box;border-collapse:collapse;text-align:left;} .off_list_wrap .thumb, .off_list_wrap .txt {position:static;z-index:3;} .off_list_wrap .thumb {width: 100%;text-align:center;} .off_list_wrap .thumb > a.btn_detail_area {position:absolute;left:0;top:0;display:block;z-index:3;width:100%;height:100%;border:0;box-sizing:border-box;} /* .off_list_wrap > ul > li:hover .thumb > a.btn_detail_area {border:1px #333 solid;border-right:0;} */ .off_list_wrap .thumb > div {position:relative;z-index:1;} .off_list_wrap .thumb img {width:auto;max-width:100%;height:auto;max-height:220px;vertical-align:middle;margin-top:-1px;margin-bottom:-1px;} .off_list_wrap .thumb_sld .slick-dots {width:100%;position:absolute;text-align:center;bottom:-21px;height: 6px;} .off_list_wrap .thumb_sld .slick-dots li {display:inline-block;height: 6px;vertical-align: top;} .off_list_wrap .thumb_sld .slick-dots li + li {margin-left:10px;} .off_list_wrap .thumb_sld .slick-dots li button {width:4px;height:4px;border-radius:100%;background:#cccccc;opacity:0.8;border:0;padding:0;font-size:0;vertical-align: top;margin-top: 1px;} .off_list_wrap .thumb_sld .slick-dots li.slick-active button {width:6px;height:6px;background:#333333;opacity:1;margin-top: 0;} .off_list_wrap .txt {width:auto;padding: 20px 20px 14px;box-sizing: border-box;} .off_list_wrap .txt > a.btn_detail_area {position:absolute;left:0;top:0;display:block;z-index:3;width:100%;height:100%;box-sizing:border-box;} .off_list_txt h3 {font-size:0;vertical-align:top;} .off_list_txt h3 strong {font-size: 19px;line-height: 1;letter-spacing: -0.95px;font-weight:500;color:#333;padding: 0 0 0 17px;position:relative;z-index:1;display:inline-block;vertical-align:top;margin-right:4px;margin-bottom:10px;} .off_list_txt h3 strong:before {display:inline-block;content:"";width: 10px;height: 2px;background:#176fcf;position:absolute;left:0;top: 10px;} .off_list_txt h3 .icon_type1, .off_list_txt h3 .icon_type2 {font-size:13px;padding: 0 5px;line-height:18px;height:20px;border-radius:2px;border-width:1px;letter-spacing:-0.65px;font-weight:400;border-style:solid;text-align:Center;box-sizing:border-box;display:inline-block;vertical-align:top;} .off_list_txt h3 .icon_type1 {border-color:#24486e;background:#24486e;color:#fff;} .off_list_txt h3 .icon_type2 {border-color:#333;background:#fff;color:#333;margin-left:5px;} .off_list_txt h3 strong + .icon_type1, .off_list_txt h3 strong + .icon_type2 {margin-left: 5px;} .off_list_txt h3 .btn_detail_area {line-height:22px;margin:5px 0;font-size:16px;letter-spacing:-0.8px;font-weight:400;color:#444;padding:0 15px;display:inline-block;vertical-align:top;position:relative;z-index:1;cursor:pointer;} .off_list_txt h3 .btn_detail_area:after {display:inline-block;content:"";width:5px;height:5px;border:1px #777 solid;border-left:0;border-bottom:0;position:absolute;right:1px;top:54%;transform:translateY(-50%) rotate(45deg);} .off_list_txt ul {padding:0;} .off_list_txt ul li {font-size: 15px;line-height: 21px;letter-spacing: -0.75px;font-weight:400;color:#555;position:relative;z-index:1;padding: 0 0 0 10px;} .off_list_txt ul li:before {width: 3px;height: 3px;background:#ccc;border-radius:100%;position:absolute;left:0;top:13px;display:inline-block;content:"";} .off_list_txt ul li dl {padding: 3px 0;line-height: 21px;vertical-align:top;width:100%;margin:0;} .off_list_txt ul li dt, .off_list_txt ul li dd {line-height:inherit;font-size:inherit;color:inherit;font-weight:inherit;vertical-align:top;display:inline-block;margin:0;padding:0;} .off_list_txt ul li dt {display: inline-block;} .off_list_txt ul li dt:after{content:":";line-height:inherit;font-size:inherit;color:inherit;font-weight:inherit;vertical-align:top;display:inline-block;margin:0 2px;} .off_list_txt ul li dd {max-width:85%;} .off_list_txt ul li dd span{display:inline;word-break:keep-all;} .off_list_wrap .go_reservatation {width: 100%;text-align:center;} .off_list_wrap .go_reservatation .btn_now_reservation {width: 100%;height: 50px;font-size: 16px;font-weight:400;line-height: 50px;letter-spacing: -1px;text-align:center;color:#fff;background-color:#275b4e;cursor:pointer;outline:0;border:0;display:inline-block;box-sizing:border-box;} .off_list_wrap .go_reservatation .btn_now_reservation span {background-image:url(../img/da_image/icon_reservation.png);background-repeat:no-repeat;background-position:center left;background-size:auto 20px;font-size:inherit;font-weight:inherit;color:inherit;padding-left:32px;} .offintro_sec01 + .offintro_sec02 .off_list_wrap .go_reservatation .btn_now_reservation {font-size:20px;} .off_list_wrap .pagination{width:100%;font-size:0;text-align: center;margin-top:30px;} .off_list_wrap .pagination li{margin:0 5px;display: inline-block;box-sizing:border-box;} .off_list_wrap .pagination li span, .off_list_wrap .pagination li a{font-family:'Trirong',sans-serif;font-size:17px;color:#c2c4c5;background:transparent;border-radius:0;display: inline-block;height:20px;line-height:20px;} .off_list_wrap .pagination li.on span{color:#275b4e;border-bottom:2px solid #275b4e;} .off_list_wrap .pagination li.btn_page a{font-size:15px;} .off_list_layer {position:fixed;left:0;top:0;z-index:-1;width: 100%;height:0;text-align:Center;box-sizing:border-box;background:#fff;overflow:hidden;} .off_list_layer.on {z-index:1002;height: 100%;} .off_layer_wrap {box-sizing:border-box;position:relative;z-index:1;margin:0;} .off_layer_wrap:before {width: 100%;background: #fff;left:0;top:0;height:100%;position:absolute;z-index:-1;display:inline-block;content:"";} .off_layer_scroll {height: 100vh;padding: 0 15px;overflow:visible;} .off_layer_scroll .swiper-wrapper {position: relative;width: 100%;z-index: 1;box-sizing: content-box;display: block;} .off_layer_scroll .swiper-wrapper .swiper-slide {vertical-align:top;font-size:0;padding-bottom: 160px;} .off_layer_scroll .swiper-wrapper .swiper-slide:after {clear:both;content:"";display:block;} .off_layer_scroll .swiper-slide {lex-shrink: 0;width: 100%;position: relative;transition-property: transform;height:auto;} .off_list_layer .swiper-scrollbar {position:absolute;right: 5px;top: 50px;width: 3px;border-radius:5px;height: calc(100vh - 250px);background:rgba(230, 232, 238, 1);z-index:10;} .off_list_layer .swiper-scrollbar-drag {background:rgba(92, 98, 115, 1);} .off_layer_top {} .off_layer_top:before {content:'';display:block;position:absolute;width: calc(100% + 30px);margin-left: -15px;height:170px;background:#f2efed;top:0;left:0;z-index:-1;} .off_layer_top h3 {font-size:16px;line-height:1;font-weight:500;color:#333;letter-spacing:-0.8px;padding:16px 0 23px;} .off_layer_top .layer_closed {position:absolute;width:60px;height:60px;right: -23px;top: -7px;cursor:pointer;font-size:0;z-index: 1;} .off_layer_top .layer_closed:before, .off_layer_wrap .layer_closed:after {width:20px;height:1px;background:#333;display:inline-block;content:"";position:absolute;left:50%;top:50%;} .off_layer_top .layer_closed:before {transform:translate(-50%, -50%) rotate(45deg);} .off_layer_top .layer_closed:after {transform:translate(-50%, -50%) rotate(-45deg);} .layer_thumb, .layer_info {vertical-align:top;display:inline-block;} .layer_thumb {width: 100%;height: 230px;padding:0;box-shadow: 0 7px 16px rgba(0,0,0,0.3);} .layer_thumb img{width:100%;} .layer_thumb .layer_slider {vertical-align:top;height: 230px;overflow:hidden;} .layer_thumb .layer_slider .slick-arrow {height: 30px;width: 30px;border-radius:100%;background: rgba(245, 245, 245, 0.8);position:absolute;top:50%;transform:translateY(-50%);z-index: 10;border: 0;} /* .layer_thumb .layer_slider .slick-arrow:hover {background: rgba(245, 245, 245, 0.9);} */ .layer_thumb .layer_slider .slick-arrow:before {width: 8px;height: 8px;left:50%;top:50%;border-color:#555;border-width:1px;border-style:solid;border-left:0;border-bottom:0;display:inline-block;vertical-align:top;content:"";position:absolute;box-sizing:border-box;} .layer_thumb .layer_slider .slick-prev {left: 4px;} .layer_thumb .layer_slider .slick-next {right: 4px;} .layer_thumb .layer_slider .slick-prev:before {transform:translate(-25%, -50%) rotate(-135deg);} .layer_thumb .layer_slider .slick-next:before {transform:translate(-75%, -50%) rotate(45deg);} .layer_thumb .layer_slider .slide_cut {background:#fff;position:relative;z-index:1;overflow:hidden;height: 230px;outline:0;} .layer_thumb .layer_slider .slide_cut img {position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:100%;min-width:100%;max-width:initial;} .layer_thumb .layer_slider img {vertical-align:top;} .layer_info .layer_bnr {margin: 15px 0 0;font-size:0;vertical-align:top;} .layer_info .layer_bnr img {vertical-align:top;width:100%;} .layer_info .layer_bnr a + a {margin-top: 10px;display:block;} .layer_info .layer_bnr .slide_cut {width:100%;height:130px;position:relative;z-index:1;overflow:hidden;outline:0;} .layer_info .layer_bnr .slide_cut + .slide_cut {margin-top:10px;} .layer_info .layer_bnr .slide_cut img {position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:auto;min-width:100%;min-height:130px;max-width:initial;} .layer_info {width: 100%;padding-top: 25px;} .layer_info .info_txt {text-align:left;padding:0 0 20px;} .layer_info .off_list_txt {} .layer_info .off_list_txt ul {padding-top: 9px;} .layer_info .info_map_wrap {width:100%;height:180px;position:relative;z-index:1;overflow:hidden;} .layer_info .info_map_wrap iframe, .layer_info .info_map_wrap .root_daum_roughmap {position:absolute;left:-1px;top:-1px;width: calc(100% + 2px);height: calc(100% + 2px);} #wrap .info_btn_wrap {position:fixed;width:100%;bottom:0;padding: 15px;font-size:0;z-index: 10;box-sizing: border-box;box-shadow: -4.4px -9px 32px 0 rgba(0, 0, 0, 0.21);background: #fff;} #wrap .info_btn_wrap .btn_go {width: calc(50% - 5px);font-size: 15px;letter-spacing: -0.75px;line-height:41px;} #wrap .info_btn_wrap .btn_go + .btn_go {margin-left:10px;} #wrap .info_btn_wrap .btn_kakao {width:100%;margin-top:10px;line-height:41px;cursor:auto;} #wrap .info_btn_wrap .btn_go span{height:100%;line-height:48px;;} #layerDim {background:rgba(0, 0, 0, 0.5);} @media only screen and (max-width:360px){ /* .off_list_txt ul li dd{max-width:75%;} */ .off_list_txt ul li.weekend_hour dd{width:60%;} } @media only screen and (max-width:350px){ .off_list_txt ul li.weekend_hour dd{width:58%;} } @media only screen and (max-width:340px){ .off_list_txt h3 strong{font-size:17px;} .off_list_txt h3 .icon_type1, .off_list_txt h3 .icon_type2{font-size:11px;} } @media only screen and (max-width:335px){ .off_list_txt ul li.weekend_hour dd{width:56%;} } @media only screen and (max-width:330px){ .off_list_txt ul li.weekend_hour dd{width:54%;} } /*** 온라인상담 체크 - service/online_check.html ***/ /* 일반 - 375 */ .oncheck_wrap {background:#f0ede9;padding-top: 38px;padding-bottom:55px;text-align:center;} .oncheck_wrap .w_custom {max-width:920px;} .oncheck_wrap h3 {line-height: 32px;font-size: 24px;letter-spacing: -1.4px;font-weight:300;color:#333;} .oncheck_wrap h3 strong {font-size:inherit;line-height:inherit;font-weight:500;color:inherit;display:block;margin:0;padding:0;} .oncheck_wrap h3 strong b {font-size:inherit;font-weight:inherit;color:inherit;font-family:inherit;line-height:inherit;letter-spacing:inherit;display:inline-block;vertical-align:top;margin:0;padding:0;position:relative;z-index:1;box-sizing:border-box;} .oncheck_wrap h3 strong b:after {height: 8px;bottom: 2px;width: calc(100% + 6px);left: -3px;background:#e5dbd5;position:absolute;display:inline-block;content:"";z-index:-1;} .oncheck_wrap .oncheck_list {padding-top: 33px;font-size:0;vertical-align:top;} .oncheck_wrap .oncheck_list li {width:calc(100% / 2 - 8px); max-width:165px;padding:0 0;box-sizing:border-box;display:inline-block;vertical-align:top;} .oncheck_wrap .oncheck_list li + li{margin-left:16px;} .oncheck_box {height: 235px; max-height:235px; max-width:165px;background:url(../img/da_image/bg_paper.png) no-repeat 50% 0;width:100%;margin:0 auto;padding:0;position:relative;z-index:1;background-size: cover;} .oncheck_box:before {background:url(../img/da_image/bg_tape.png) no-repeat 50% 0;position:absolute;left:50%;top: -8px;transform:translateX(-50%);display:inline-block;content:"";z-index:5;width: 47.5px;height: 17.5px;background-size: 100%;} .oncheck_box dl {} .oncheck_box dt {padding: 61px 0 8px;vertical-align:top;} .oncheck_box dt strong {height:26px;line-height:25px;font-size: 17px;letter-spacing: -1px;font-weight:500;box-sizing:border-box;display:inline-block;vertical-align:top;margin:0 auto;text-decoration:underline;} .oncheck_box dt:before {top: 24px;line-height:36px;height:36px;font-size: 30px;font-weight:700;color: #d9d9d9;display:inline-block;text-align:center;position:absolute;left:50%;transform:translateX(-50%);font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .oncheck_list li:nth-of-type(1) .oncheck_box dt:before {content:"X";} .oncheck_list li:nth-of-type(2) .oncheck_box dt:before {content:"O";} .oncheck_box dd {} .oncheck_box dd p {margin-bottom: 13px;font-size: 12px;line-height: 17px;letter-spacing:-0.85px;font-weight:400;color:#666;} .oncheck_box dd .btn_self_go.btn_go {width: 145px;font-weight: 500;font-size: 14px;height: 40px;line-height: 38px;letter-spacing: -1px;} .on_check_layer {position:fixed;left:50%;top:50%;transform:translate(-50%, -50%);z-index:-1;width: 100%;height:0;text-align:Center;box-sizing:border-box;overflow:hidden;} .on_check_layer.on {z-index:1002;height:auto;overflow:inherit;} .check_layer_wrap {width: 100%;padding: 0;box-sizing:border-box;position:relative;z-index:1;margin:0;} .check_layer_wrap .layer_closed {position:absolute;width:40px;height:40px;right:0;top:0;cursor:pointer;font-size:0;z-index:5;} .check_layer_wrap .layer_closed:before, .check_layer_wrap .layer_closed:after {width:24px;height:1px;background:#000;display:inline-block;content:"";position:absolute;left:50%;top:50%;} .check_layer_wrap .layer_closed:before {transform:translate(-50%, -50%) rotate(45deg);} .check_layer_wrap .layer_closed:after {transform:translate(-50%, -50%) rotate(-45deg);} .check_layer_scroll {width: 100%;padding: 36px 10px 25px 20px;margin:0;background:#fff;box-sizing:border-box;} .check_layer_scroll .check_table_title {font-size: 15px;font-weight: 400;line-height: 21px;text-align:center;margin-bottom:15px;position:relative;z-index:1;letter-spacing: -0.9px;color: #333;} .check_layer_scroll .check_swiper{max-height:272px;padding-right:10px;} .check_layer_scroll .check_swiper .swiper-scrollbar{background:#e6e8ee;border-radius:2.5px;box-sizing:border-box;width:3px;right:0;} .check_layer_scroll .check_swiper .swiper-scrollbar .swiper-scrollbar-drag{background:#5c6273;border-radius:2.5px;} .check_layer_scroll .check_list_box {width:100%;margin:0;padding:0;} .check_layer_scroll .check_list_box ul {font-size:0;vertical-align:top;text-align:center;} .check_layer_scroll .check_list_box li {margin:0;padding: 5px 0;height: 45px;border-radius:60px;width:100%;text-align:left;display:block;} .check_layer_scroll .check_list_box li .form_element.form_custom {padding:0;height: 45px;border-radius: 50px;margin:0;width:100%;display:inline-block;box-sizing:border-box;} #wrap .check_layer_scroll .check_list_box li .form_element.form_custom label.choice_m {padding: 9px 11px 9px 42px;background-position:11px 50%;height: 45px;line-height:25px;border-radius:60px;border:1px #ddd solid;width:100%;display:inline-block;font-size: 14px;} #wrap .check_layer_scroll .check_list_box li .form_element.form_custom input:checked + label.choice_m {border:1px #275b4e solid;background-position:11px 50% ;} .check_layer_scroll .btn_center {padding-top: 15px;} .check_layer_scroll .btn_center .btn_go.btn_self_go {width: 130px;height: 45px;line-height: 43px;font-size: 15px;font-weight: 400;} .check_layer_scroll .reservation_table_title .prev {} .oncheck_wrap .oncheck_list li[data-aos].aos-animate {transition-delay:0.2s;} .oncheck_wrap .oncheck_list li:nth-of-type(2) [data-aos].aos-animate {transition-delay:0.3s;} @media only screen and (max-width:320px) { .oncheck_wrap h3{font-size:21px; line-height:28px;} .oncheck_box dt strong{font-size:15px;} .oncheck_box dd .btn_self_go.btn_go{width:120px; font-size:12.5px;} .check_layer_scroll .check_table_title{font-size:14px;} .oncheck_wrap .oncheck_list li + li{margin-left:10px;} } /*** 상담 예약 - service/online_reservation.html & service/offline_reservation.html ***/ /* 일반 - 375 */ .reservation_title {padding-top:29px;padding-bottom:25px;font-size:24px;line-height:32px;letter-spacing:-1.2px;font-weight:500;color:#333;text-align:center;} .reservation_title + .w_custom {max-width:1200px;} .reservation_step_tit{text-align:center;padding-bottom: 20px;border-bottom: 1px solid #333;margin-bottom: 20px;} .reservation_step_tit > span{font-family: 'Trirong';font-size: 16px;font-style: italic;line-height: 16px;color: #777;display:block;margin-bottom: 20px;} .reservation_step_tit > h3{position:relative;font-size: 20px;font-weight: 500;line-height: 16px;letter-spacing: -1px;color: #333;display:inline-block;z-index:1;margin-bottom: 17px;} .reservation_step_tit > h3:after{position:absolute; content:''; width:calc(100% + 4px); height:6px; background:#dfe5e4; left:0; bottom:-4px; z-index:-1;} .reservation_step_tit > p{font-size: 15px;line-height: 16px;letter-spacing: -0.75px;color: #555;} .reservation_step_tit > p em {font-size:inherit;font-weight:500;color:#333;} .reservation_caution {padding: 17px 20px 16px;background:#f5f5f5;text-align:left;box-sizing:border-box;width:100%;} .reservation_caution dl {font-size:0;vertical-align:top;} .reservation_caution dt, .reservation_caution dd {font-size: 16px;line-height:23px;letter-spacing:-0.8px;font-weight: 500;color:#333;display:inline-block;vertical-align:top;} .reservation_caution dd:before {margin: 7px 12px 4px;height: 10px;background:#ccc;width:1px;display:inline-block;content:"";vertical-align:top;} .reservation_caution dt {font-weight:500;} .reservation_caution p {padding: 6px 0 0;font-size: 14px;line-height: 21px;letter-spacing:-0.7px;font-weight:400;color:#555;} .reservation_form + .reservation_caution {margin-top:19px;border:1px #ddd solid;padding:24px 30px 22px;} .reservation_form + .reservation_caution dt, .reservation_form + .reservation_caution dd {vertical-align:middle;line-height:26px;} .reservation_form + .reservation_caution dt {width:138px;font-size:18px;font-weight:500;letter-spacing: -0.9px;} .reservation_form + .reservation_caution dd {} .reservation_form + .reservation_caution dd:before {display:none;} .reservation_form + .reservation_caution dd p {padding-top:0;} .reservation_center {font-size:16px;font-weight:400;letter-spacing: -0.8px;color:#333;text-align:Center;line-height:23px;padding:20px 0 0;margin-bottom:-29px;} .reservation_center + .btn_center .btn_self_go.btn_go {width:170px; height:45px; line-height:41px; font-size:15px;letter-spacing:-0.75px;} .reservation_table_title {margin:0 0 16px;font-size:21px;line-height:28px;letter-spacing:-1.05px;font-weight:500;color:#333;text-align:left;padding:0;} .reservation_form {border:0;counter-reset:q-number;} .reservation_form > li {counter-increment:q-number;border:0;border-bottom:1px #ddd solid;box-sizing:border-box;} .reservation_form > li + li {} .reservation_form > li > dl {padding:24px 0 24px;} .reservation_form > li:first-child > dl{padding-top:5px;} .reservation_form > li > dl:after {clear:both;content:"";display:block;} .reservation_form > li > dl > dt, .reservation_form > li > dl > dd {min-height:auto;margin:0;padding:0;float:none;font-weight:400;vertical-align:top;box-sizing:border-box;white-space:normal;word-break:keep-all;word-wrap:break-word;width:100%;} .reservation_form > li > dl > dt {width:100%;font-size:16px;color:#222;line-height:24px;letter-spacing:-0.8px;font-weight:500;margin-bottom:15px;padding-bottom:3px;padding-top:3px;min-height:30px;position:relative;z-index:1;} .reservation_form > li:nth-of-type(-n + 5) > dl > dt {padding-left:63px;} .reservation_form > li:nth-of-type(-n + 5) > dl > dt:before {content:'Q. 0' counter(q-number);font-size:14px;font-weight:300;width:55px;height:30px;line-height:32px;border-radius:30px;letter-spacing:-0.7px;display:inline-block;text-align:center;color:#fff;background:#27282c;font-family:'Roboto';position:absolute;left:0;top:0;} .reservation_form > li:nth-of-type(2) > dl > dt, .reservation_form > li:nth-of-type(2) > dl > dd {width:100%;float:none;} .reservation_form > li:nth-of-type(2) > dl > dt {margin-bottom:10px;} .reservation_form > li:nth-of-type(3) > dl > dt {margin-bottom:9px;padding-top:0;} .reservation_form.form_type2 > li:nth-of-type(1) > dl > dt {margin-bottom:14px;padding-top:0;} .reservation_form.form_type2 > li:nth-of-type(2) > dl > dt {margin-bottom:10px;} .reservation_form > li:nth-of-type(4) > dl > dd {margin-top:5px;} .reservation_form > li:nth-of-type(6) > dl{padding:16px 0 20px;} .reservation_form > li:nth-of-type(6) > dl > dt{font-weight:400;margin-bottom:12px;} .reservation_form > li > dl > dd {font-size:16px;letter-spacing:-0.8px;color:#666;vertical-align:middle;} .reservation_form > li > dl > dd .form_element.form_custom label.check_s {font-size:16px;letter-spacing:-0.8px;color:#666;} .reservation_form .form_element.form_custom + .form_element.form_custom {margin-left:21px;} .reservation_form .form_element.form_custom label.choice_m{padding:0 0 0 34px; font-size:16px; height:26.5px;} .reservation_form .element_check .form_element.form_custom{margin-right:14px;} .reservation_form .element_check .form_element.form_custom:last-child{margin-right:0;} .reservation_form .element_check .form_element.form_custom + .form_element.form_custom {margin-left: 0;} .reservation_form .form_element.form_custom label.check_s {margin-top:5px;margin-bottom:7px;padding-left: 32px;} .reservation_form > li:nth-of-type(5) > dl > dd textarea {margin-top:10px; padding:7px 14px; height:100px;} .reservation_form > li:nth-of-type(5) > dl > dd textarea.self_inq_area:placeholder {font-size:15px;letter-spacing:-0.8px;font-weight:400;color:#777;} .reservation_form > li:nth-of-type(5) > dl > dd textarea.self_inq_area::placeholder {font-size:15px;letter-spacing:-0.8px;font-weight:400;color:#777;} .reservation_form > li:nth-of-type(5) > dl > dd textarea.self_inq_area:-webkit-input-placeholder {font-size:15px;letter-spacing:-0.8px;font-weight:400;color:#777;} .reservation_form > li:nth-of-type(5) > dl > dd textarea.self_inq_area:-ms-input-placeholder {font-size:15px;letter-spacing:-0.8px;font-weight:400;color:#777;} .reservation_form.form_type2 .element_check .form_element.form_custom{margin-right:0; width:32%; margin-bottom:3px;} .reservation_form_table {border-collapse:collapse;border:0;width:100%;margin:0 auto;table-layout:fixed;} .reservation_form_table th, .reservation_form_table td {padding:17px 0;font-size:17px;letter-spacing:-0.85px;font-weight:400;color:#333;line-height:25px;border-bottom:1px #ddd solid;text-align:center;box-sizing:border-box;border-collapse:collapse;vertical-align:top;min-height:60px;} .reservation_form_table tr th + th, .reservation_form_table tr td + td, .reservation_form_table tr th + td {border-left:1px #ddd solid;} .reservation_form_table thead th {border-top:1px #ddd solid;padding:10px 0;} .reservation_form_table tbody th {background:#f5f5f5;} .reservation_form_table td {} .reservation_form_table td .form_element.form_custom {vertical-align:top;} .reservation_form .reservation_form_table td .form_element.form_custom {width:100%;} .reservation_form .reservation_form_table td .form_element.form_custom label.check_s {background-position:50% 50%;font-size:0;min-width:25px;width:100%;padding-left:25px;min-height:25px;margin-top:0;margin-bottom:0;} .reservation_form_list{padding-top:5px;} .reservation_form_list > li{margin-bottom:20px;} .reservation_form_list > li:last-child{margin-bottom:3px;} .reservation_form_list .reservation_form_list_dl{width:100%; box-sizing:border-box;} .reservation_form_list .reservation_form_list_dl > dt{width:100%; height:45px; line-height:45px; text-align:center; background:#aaa; color:#fff; font-weight:400; font-size:17px; letter-spacing:-0.85px;} .reservation_form_list li:nth-child(3) .reservation_form_list_dl > dt{background:#999;} .reservation_form_list li:nth-child(4) .reservation_form_list_dl > dt{background:#666;} .reservation_form_list li:nth-child(5) .reservation_form_list_dl > dt{background:#555;} .reservation_form_list li:nth-child(6) .reservation_form_list_dl > dt{background:#444;} .reservation_form_list li:nth-child(7) .reservation_form_list_dl > dt{background:#333;} .reservation_form_list li:nth-child(8) .reservation_form_list_dl > dt{background:#222;} .reservation_form_list .reservation_form_list_dl > dd{border:1px solid #ddd; border-top:0; padding:15px 14px 0; box-sizing:border-box; background:#f5f5f5;} .reservation_form_list .reservation_form_list_dl > dd > ul{font-size:0;} .reservation_form_list .reservation_form_list_dl > dd > ul > li{display:inline-block; width:calc(100% / 2 - 7.5px); margin-right:15px; margin-bottom:15px;} .reservation_form_list .reservation_form_list_dl > dd > ul > li:nth-child(even){margin-right:0;} .reservation_form_list .reservation_form_list_dl .form_element.form_custom label.check_s{padding-left:0; margin:0;} .reservation_form_list .reservation_form_list_dl > dd > ul > li .form_element.form_custom label.check_s span{display:block; padding-left:32px; padding-bottom:10px;min-height:25px;line-height:25px;font-size:16px; letter-spacing:-0.8px; color:#444;} .reservation_form_list .reservation_form_list_dl > dd > ul > li .form_element.form_custom label.check_s em{display:block;} .reservation_form_list .reservation_form_list_dl > dd > ul > li .form_element.form_custom label.check_s em img{max-width:100%;} .reservation_form.form_type2 {} .reservation_form.form_type2 > li {padding-bottom:15px;} .reservation_form.form_type2 > li + li {padding-top:19px; padding-bottom:25px;} .reservation_form.form_type2 > li > dl {padding:0;} .reservation_form.form_type2 > li > dl > dd.element_check {padding:0;border:0;} .reservation_form.form_type2 > li:nth-child(2) > dl > dd{padding-top:10px;} .reservation_form.form_type2 textarea.self_inq_area{padding:9px 15px 13px; height:100px;font-size:15px;letter-spacing:-0.75px;width:100%;box-sizing:border-box;} .reservation_form.form_type2 textarea.self_inq_area:placeholder {font-size:15px;letter-spacing:-0.75px;font-weight:400;color:#777;} .reservation_form.form_type2 textarea.self_inq_area::placeholder {font-size:15px;letter-spacing:-0.75px;font-weight:400;color:#777;} .reservation_form.form_type2 textarea.self_inq_area:-webkit-input-placeholder {font-size:15px;letter-spacing:-0.75px;font-weight:400;color:#777;} .reservation_form.form_type2 textarea.self_inq_area:-ms-input-placeholder {font-size:15px;letter-spacing:-0.75px;font-weight:400;color:#777;} .list_dot {} .reservation_form > li > dl > dd .list_dot {padding: 12px 0 2px;} .list_dot > li {font-size: 14px;letter-spacing: -0.8px;font-weight:400;color:#777;line-height:20px;position:relative;z-index:1;padding:0 0 0 7px;margin:0;} .list_dot > li.list_caution{color:#942020;} .list_dot > li:before {width:3px;height:3px;background:#aaa;border-radius:100%;left:0;top:9px;display:inline-block;content:"";position:absolute;} .list_dot > li + li {margin-top:5px;} .off_list_txt > .list_dot > li + li {margin-top:0;} .reservation_choice {padding:0 0 97px;text-align:left;} .reservation_choice {/* padding-top:40px; */padding-bottom:40px;} .reservation_choice .reservation_left{width:100%; height:0; margin:0; padding:0; overflow:hidden;} .reservation_choice .on .reservation_left {padding: 23px 0 14px;border:1px #ddd solid;width:100%;box-sizing:border-box;margin-top:20px; height:100%;} .calendar_wrap {width:100%;margin:0 auto;} .calendar_a {text-align:center;} .calendar_a .cal_head {font-size: 20px;line-height:20px;letter-spacing: -1px;margin: 0 auto 3px;padding:0;width: calc(100% - 30px);font-weight:400;color:#333;position:relative;text-align:center;display:block;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .calendar_a .cal_head:after {clear:both;content:"";display:block;} .calendar_a .cal_head .tit {font-size:inherit;line-height:inherit;font-weight:500;color:inherit;display:inline-block;font-family: 'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .calendar_a .cal_head .btn_contol {width:34px;height:34px;line-height:34px;text-indent:34px;border-radius:100%;background:#eee;overflow:hidden;display:inline-block;position:relative;z-index:1;top: -8px;} .calendar_a .cal_head .btn_contol:before {width:7px;height:7px;border-width:1px 1px 0 0;border-style:solid;border-color:#888;background:none;display:inline-block;content:"";position:absolute;left:50%;top:50%;} /* .calendar_a .cal_head .btn_contol:hover:before {border-color:#333;} */ .calendar_a .cal_head .btn_contol.prev {float:left;} .calendar_a .cal_head .btn_contol.next {float:right;} .calendar_a .cal_head .btn_contol.prev:before {transform:translate(-25%, -50%) rotate(-135deg);} .calendar_a .cal_head .btn_contol.next:before {transform:translate(-75%, -50%) rotate(45deg);} .calendar_a .board {} .calendar_a .board table {width:100%;} .calendar_a .board thead th, .calendar_a .board thead td {padding:0;font-weight:400;text-align:center;border-collapse:collapse;box-sizing:border-box;vertical-align:middle;border:0;font-family:'Roboto','Noto Sans KR',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .calendar_a .board thead th {width:14.28%;font-size:15px;line-height:30px;letter-spacing:-0.22px;padding:0;color:#333;} .calendar_a .board thead th.sun{color:#ee0000;} .calendar_a .board tbody td {height:38px;font-size:15px;letter-spacing:-0.15px;} .calendar_a .board tbody td strong {font-family:inherit;font-size:inherit;font-weight:inherit;color:inherit;} .calendar_a .board tbody td .date_box {position:relative;z-index:1;cursor:pointer;} .calendar_a .board tbody td .date_box.non {cursor:default;} .calendar_a .board tbody td .date_box:before {height:36px;width:36px;border-radius:100%;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);content:"";display:inline-block;z-index:-1;} .calendar_a .board tbody td .date_box.sel:before {background:#275b4e;box-shadow:2px 2px 5px rgba(0, 0, 0, 0.33);} .calendar_a .board tbody td .date_box .date {color:#222;font-size:inherit;line-height:36px;height:36px;margin:0;padding:0;font-family:inherit;font-weight:inherit;display:block;z-index:5;font-family: 'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .calendar_a .board tbody td .date_box.sel .date {color:#fff;} .calendar_a .board tbody td .date_box.non .date {color:#aaa;} #wrap .calendar_a .board tbody tr td:nth-child(1) strong{color:#ee0000;} #wrap .calendar_a .board tbody tr td:nth-child(1) .date_box.non strong{opacity:0.5;} #wrap .calendar_a .board tbody tr td:nth-child(1) .date_box.sel .date{color:#fff;} .reservation_choice .reservation_right {width:100%; background:#eee; padding-bottom:12px;} .reservation_choice .reservation_right .w_custom{background:#fff; padding-bottom:40px;} .reservation_spot {padding:21px 15px 21px;box-sizing:border-box;background:#36373d;} .reservation_spot dl {font-size:0;vertical-align:top;display: block;width:100%;} .reservation_spot dt, .reservation_spot dd {text-align:left;vertical-align:top;box-sizing:border-box;margin:0;padding:0;display:inline-block;} .reservation_spot dt {line-height:16px;font-size:18px;font-weight:400;color:#fff;padding-left:10px;position:relative;z-index:1;letter-spacing:-0.9px; margin-bottom:15px;width:44.05%;} .reservation_spot dt:before {width:3px;height:3px;left:0;top:7px;border-radius:100%;background:#fff;position:absolute;display:inline-block;content:"";} .reservation_spot dd {width: 100%; padding-left:15px;} .reservation_spot dd span, .reservation_spot dd .spot_change {height:40px;display:inline-block;box-sizing:border-box;vertical-align:top;outline:0;text-align:Center;font-weight:400;} #wrap .reservation_spot dd select.spot_area{padding:0 12px;width:calc(50% - 5px);border:1px #929396 solid;line-height:38px;border-radius:40px;color:#fff;font-size:15px;letter-spacing:-0.75px; text-align:left; background:#36373d url('../img/da_image/select_arr_white.png')no-repeat 90% center; background-size:auto 6px; } #wrap .reservation_spot dd select.spot_area:foucs{outline:none;} #wrap .reservation_spot .spot_sel_area{padding:0 12px;width:calc(50% - 5px);border:1px #929396 solid;line-height:38px;border-radius:40px;color:#fff;font-size:15px;letter-spacing:-0.75px; text-align:center;display: inline-block;box-sizing:border-box;} #wrap .reservation_spot .spot_sel_area + .spot_sel_area{margin-left:10px;} .reservation_spot dd select.spot_area + select.spot_area {margin-left:10px;} .reservation_spot dd .spot_change {cursor:pointer;line-height:40px;} .reservation_spot dd .spot_change span {padding:0 18px;font-size:16px;letter-spacing:-0.8px;color:#ddd;position:relative;z-index:1;line-height:inherit;} .reservation_spot dd .spot_change span:after {position:absolute;right:0;top:52%;transform:translate(-50%, -50%) rotate(45deg);width:5px;height:5px;border-width:1px 1px 0 0;border-style:solid;border-color:#777;display:inline-block;content:"";} .reservation_spot dd p {padding-top:12px;line-height:21px;font-size:13px;font-weight:400;color:#ddd;letter-spacing:-0.75px;opacity:0.8;} .reservation_spot.spot_2 {padding:17.5px 17px 19.5px;background:#fff; display:table; width:100%;} .reservation_spot.spot_2 + .reservation_spot.spot_2 {border-top:1px #ddd solid;} .reservation_spot.spot_2 dt {line-height:1;font-size:18px;letter-spacing:-1px;color:#222;/* width:137px; */ margin-bottom:0; vertical-align:middle;} .reservation_spot.spot_2 dt:before {background:#333;top:7px;} .reservation_spot.spot_2 dd {line-height:1;font-size:16px;letter-spacing:-0.85px;color:#942020; padding-left:0; vertical-align:middle;text-align:left;width:55%;} .reservation_spot.spot_2:first-child {background:#36373d; margin-top:15px;} .reservation_spot.spot_2:first-child dt, .reservation_spot.spot_2:first-child dd {color:#fff;} .reservation_spot.spot_2:first-child dd{font-weight:300;} .reservation_spot.spot_2:first-child dt:before {background:#fff;} .reservation_spot.spot_2:nth-of-type(3) dl {cursor:pointer;} .reservation_date {margin:29px 0 0; background:#eee; padding-bottom:12.5px;} .reservation_date .w_custom{background:#fff; padding-bottom:40px;} .reservation_date > dl {} .reservation_date > dl > dt, .reservation_date > dl > dd {text-align:left;vertical-align:top;box-sizing:border-box;margin:0;padding:0;} .reservation_date > dl > dt {line-height:28px;font-size:21px;letter-spacing:-1.05px;font-weight:500;color:#333;padding-left:45px;position:relative;z-index:1;} .reservation_date > dl > dt:before {width:3px;height:3px;left:30px;top:13px;border-radius:100%;background:#333;position:absolute;display:inline-block;content:"";} .reservation_date > dl > dd {padding:13px 30px 0;} .reservation_date > dl > dd p {padding-bottom:17px;padding-left:15px;line-height:21px;font-size:15px;font-weight:400;color:#888;letter-spacing:-0.75px;} .date_selected_list {width:100%;} .date_selected_list li {position:relative;z-index:1;} .date_selected_list li + li {margin-top:10px;} .date_selected_list li dl.date_selected {} .date_selected_list li dl.date_selected dt, .date_selected_list li dl.date_selected dd {height:30px;font-weight:400;text-align:left;vertical-align:top;box-sizing:border-box;margin:0;padding:0;display:inline-block;} .date_selected_list li dl.date_selected dt {font-size:15px;line-height:28px;letter-spacing:-0.75px;border:1px #ddd solid;border-radius:35px;color:#333;width:70px;text-align:center;cursor:pointer;} .date_selected_list li dl.date_selected dd {font-size:16px;line-height:30px;letter-spacing:-0.8px;color:#942020;padding-left:10px;} .date_selected_list li dl.date_selected dd.btn_date_reset {padding:0 12px;font-size:13px;letter-spacing:-0.65px;font-weight:400;color: #275b4e;margin-left:16px;} .date_select_layer {padding:0;width:100%;margin:0;height:0;overflow:hidden;} .on .date_select_layer {padding:20px 0 15px;width:100%;height:auto;overflow:inherit;} .reservation_spot.spot_2 + .reservation_spot.spot_2.on .date_select_layer {width: calc(100% + 30px);margin-left:-15px;margin-right:-15px} .date_select_layer .select_layer_box {padding: 15px 20px;width:100%;box-sizing:border-box;text-align:left;vertical-align:top;background:#f5f5f5;position:relative;z-index:1;margin-top:20px;} .date_select_layer .select_layer_box:before {width:0;height:0;border-bottom:10px solid #f5f5f5;border-left:10px solid transparent;border-right:10px solid transparent;position:absolute;left:58px;top:0;transform:translate(-50%, -100%);display:inline-block;content:"";} .reservation_spot.spot_2 + .reservation_spot.spot_2 .date_select_layer .select_layer_box:before {left:76px;} .date_select_layer .select_layer_box > dl {} .date_select_layer .select_layer_box > dl:after {clear:both;content:"";display:block;} .date_select_layer .select_layer_box > dl + dl {} .date_select_layer .select_layer_box > dl > dt, .date_select_layer .select_layer_box > dl > dd {float:left;} .date_select_layer .select_layer_box > dl > dt {font-size: 15px;letter-spacing:-0.75px;color:#333;font-weight:400;height:40px;line-height:40px;width: 38px;} .reservation_spot.spot_2 + .reservation_spot.spot_2 .date_select_layer .select_layer_box > dl > dt {padding-left:0;} .reservation_spot.spot_2 + .reservation_spot.spot_2 .date_select_layer .select_layer_box > dl > dt:before {display:none;} .date_select_layer .select_layer_box > dl > dd {width: calc(100% - 37.5px);margin-right:-2.5px;} .date_select_layer .select_layer_box > dl > dd ul {width:100%;font-size:0;vertical-align:top;text-align:left;} .date_select_layer .select_layer_box > dl > dd li {padding: 2.5px;width:25%;margin:0;display:inline-block;vertical-align:top;box-sizing:border-box;text-align:center;} .date_select_layer .select_layer_box > dl > dd li span {width:100%;height: 35px;line-height: 25px;padding:5px;font-size: 13px;border:1px #333 solid;background:#fff;color:#333;margin:0;display:inline-block;vertical-align:top;box-sizing:border-box;cursor:pointer;font-family:'Roboto',-apple-system,BlinkMacSystemFont,helvetica,Apple SD Gothic Neo,sans-serif;} .date_select_layer .select_layer_box > dl > dd li.on span {border:1px #275b4e solid;background:#275b4e;color:#fff;} .date_select_layer .select_layer_box > dl > dd li.non span{border:1px #ddd solid;background:#eee;color:#999;cursor:default;} .off_spot_layer {position:fixed;left:50%;top:50%;transform:translate(-50%, -50%);z-index:-1;width:750px;height:0;text-align:Center;box-sizing:border-box;overflow:hidden;} .off_spot_layer.on {z-index:1002;height:auto;overflow:inherit;} .spot_layer_wrap {width:750px;padding:0 50px 0 0;box-sizing:border-box;position:relative;z-index:1;margin:0;} .spot_layer_wrap .layer_closed {position:absolute;width:40px;height:40px;right:0;top:0;cursor:pointer;font-size:0;z-index:5;} .spot_layer_wrap .layer_closed:before, .spot_layer_wrap .layer_closed:after {width:24px;height:1px;background:#fff;display:inline-block;content:"";position:absolute;left:50%;top:50%;} .spot_layer_wrap .layer_closed:before {transform:translate(-50%, -50%) rotate(45deg);} .spot_layer_wrap .layer_closed:after {transform:translate(-50%, -50%) rotate(-45deg);} .spot_layer_scroll {width:700px;padding:36px 25px 39px;margin:0;background:#fff;box-sizing:border-box;} .spot_layer_scroll .reservation_table_title {font-size:26px;letter-spacing:-1.3px;font-weight:500;line-height:32px;text-align:center;margin-bottom:21px;position:relative;z-index:1;} .spot_layer_scroll .reservation_table_title .prev {width:32px;height:32px;line-height:32px;text-indent:32px;overflow:hidden;position:absolute;left:0;top:50%;cursor:pointer;transform:translateY(-50%);display:none;} .spot_layer_scroll .reservation_table_title .prev.on {display:block;} .spot_layer_scroll .reservation_table_title .prev:before {left:50%;top:50%;transform:translate(-50%, -50%) rotate(-135deg);width:15px;height:15px;border-width:1px 1px 0 0;border-color:#222;box-sizing:border-box;border-style:solid;position:absolute;display:inline-block;content:"";} .spot_layer_scroll .spot_list_box {width:100%;margin:0;padding:0;height:0;overflow:hidden;} .spot_layer_scroll .spot_list_box.on {height:auto;overflow:inherit;} .spot_layer_scroll .spot_list_box ul {font-size:0;vertical-align:top;text-align:center;} .spot_layer_scroll .spot_list_box li {margin:0;padding:5px;height:60px;border-radius:60px;width: calc(33.32% - 10px);text-align:left;display:inline-block;} .spot_layer_scroll .spot_list_box li .form_element.form_custom {padding:0;height:60px;border-radius:60px;margin:0;width:100%;display:inline-block;box-sizing:border-box;} .spot_layer_scroll .spot_list_box li .form_element.form_custom label {padding:17px 19px 16px 64px;background-position:19px 50% !important;height:60px;line-height:25px;border-radius:60px;border:1px #ddd solid;width:100%;display:inline-block;} .spot_layer_scroll .spot_list_box li .form_element.form_custom input:checked + label {border:1px #275b4e solid;background-position:19px 50% !important;} .reservation_form .form_element.form_file{width:60px; height:60px;} .reservation_form .form_element.form_file .image-box{height:60px;} .reservation_form .form_element.form_file .image-box p{width:60px; height:60px; background-size:15px;} .reservation_form .form_element.form_file + .form_element.form_file{margin-left:7px;} .btn_center.reservation{padding-top:30px;} .btn_center.reservation .btn_go.btn_self_go{width:170px; height:45px; line-height:43px; font-size:15px;} .reservation_center + .btn_center {padding-bottom:100px;} .spot_layer_scroll .btn_center {padding-top:24px;} .spot_layer_scroll .btn_center .btn_go.btn_self_go {width:160px;} .spot_layer_scroll .reservation_table_title .prev {} @media only screen and (max-width:360px) { .reservation_form > li:nth-of-type(-n + 5) > dl > dt {padding-left:57px;} .reservation_form > li:nth-of-type(-n + 5) > dl > dt:before {width:49px;} .reservation_form.form_type2 .element_check .form_element.form_custom {width: calc(50% - 2px);} } @media only screen and (max-width:350px) { .date_selected_list li dl.date_selected dd{font-size:14px;} } @media only screen and (max-width:320px) { .reservation_spot, .date_select_layer .select_layer_box, .reservation_caution, .reservation_form.form_type2 textarea.self_inq_area {padding-left:10px;padding-right:10px;} .reservation_title{font-size:21px;letter-spacing:-1.05px;} .reservation_step_tit > p{font-size:14px;letter-spacing:-0.7px;} .reservation_caution{padding-top:17px;padding-bottom:16px;} .reservation_caution dt, .reservation_caution dd{font-size:15px;letter-spacing:-0.75px;} .reservation_spot dt, .reservation_spot.spot_2 dt{font-size:17px;letter-spacing:-0.85px;} .reservation_spot.spot_2 dd{font-size:15px;letter-spacing:-0.75px;} #wrap .reservation_spot dd select.spot_area{min-width:120px; line-height:35px;} .reservation_form > li > dl > dt {font-size:15px;line-height:22px;letter-spacing:-0.75px;padding-bottom:4px;padding-top:4px;} .reservation_form > li:nth-of-type(-n + 5) > dl > dt {padding-left:44px;} .reservation_form > li:nth-of-type(-n + 5) > dl > dt:before {width:40px;font-size:13px;letter-spacing:-0.65px;} .reservation_form > li > dl > dd .form_element.form_custom label.check_s{font-size:15px;letter-spacing:-0.75px;} .reservation_form_list .reservation_form_list_dl > dt{height:40px; line-height:38px; font-size:16px;letter-spacing:-0.8px;} .reservation_form_list .reservation_form_list_dl > dd > ul > li .form_element.form_custom label.check_s span{font-size:15px;letter-spacing:-0.75px;} .reservation_form > li > dl > dt, .reservation_form.form_type2 > li > dl > dt{font-size:15px; letter-spacing:-1px;letter-spacing:-0.75px;} .reservation_center{font-size:15px;letter-spacing:-0.75px;} } /*** 상담 완료 - service/online_end.html & service/offline_end.html ***/ /* 일반 - 375 */ .reservation_end {max-width:1200px;text-align:center;} .reservation_end .end_box {background:#f5f5f5;padding: 109px 0 40px;position:relative;z-index:1;margin-bottom:54px;} .reservation_end .end_box:before {top: 40px;left:50%;width: 50px;height: 50px;background:url(../img/da_image/icon_check_end.png) no-repeat 50% 50%;background-size: 100%;display:inline-block;content:"";position:absolute;transform:translateX(-50%);} .reservation_end .end_box p {font-size: 15px;line-height: 23px;letter-spacing: -0.75px;color:#555;font-weight:400;} .reservation_end .end_box p strong {font-size: 19px;line-height: 28px;letter-spacing: -0.95px;font-weight:500;color: #333;} .reservation_end .end_box dl, .reservation_end .end_box .offline_end {vertical-align:top;font-size:0;padding: 15px 0 10px;} .reservation_end .end_box .offline_end, .reservation_end .end_box dt, .reservation_end .end_box dd {line-height:23px;font-size: 15px;letter-spacing:-0.75px;font-weight: 500;color: #1370d1;display:inline-block;vertical-align:top;} .reservation_end .end_box .offline_end dt, .reservation_end .end_box .offline_end dd {font-size: 16px;letter-spacing:-1px;color:#1370d1;} .reservation_end .end_box .offline_end dt.branch_name{margin-bottom:15px;} .reservation_end .end_box .offline_end dt.branch_time:after{content:":";font-size:16px;letter-spacing:-1px;color:#1370d1;display: inline-block;vertical-align: middle;margin:0 5px;} .reservation_end .end_box dt {} .reservation_end .end_box dd {} .reservation_end .end_box dd:before {width:1px;height:10px;margin:8px 10px 0;background:#ccc;display:inline-block;content:"";vertical-align:top;} .reservation_end .end_box .offline_end dd:before {display:none;} .reservation_end .end_box .btn_go.btn_self_go {margin-top:24px;width:170px;font-size:15px;letter-spacing:-0.75px;} .reservation_end_caution {padding-bottom: 80px;} .reservation_end_caution .end_caution {text-align:center;position:relative;z-index:1;} .reservation_end_caution .end_caution:before {top: -63px;height: 50px;width:1px;background:#000;left:50%;position:absolute;display:inline-block;content:"";} .reservation_end_caution .end_caution p {padding: 0 0 22px;font-size: 15px;letter-spacing:-0.85px;line-height: 23px;text-align:center;font-weight:400;color: #555;margin-top: -10px;} .reservation_end_caution .end_caution p strong {display:block;padding-bottom: 2px;font-size: 16px;line-height:28px;letter-spacing: -1px;font-weight:500;color:#333;} .reservation_end_caution .end_caution .btn_go {display:block;width: 170px;font-size: 15px;} .reservation_end_caution .end_caution .btn_go + .btn_go {margin-top: 10px;} .selfintro_sec04 h3 strong[data-aos].aos-animate {transition-delay:0.2s;} @media only screen and (max-width:320px) { } /* @@@ 정리대상 - 추후 위치 옮겨야함 @@@*/ /* @@ custom_b.css 소스 @@ */ /* @@ custom_c.css 소스 @@ */ #wrap #container .mypage_mystore .mystore_info_box{margin-top:15px;} #wrap .membership .mem_sec01 .rank_graph .vip_zone{width:33.9%;}