/* **SUB LAYOUT** */ .main-foot.copyright-container .biz-info span:last-child a, .site-footer .biz-info span:last-child a { color: #17a2b8} .skiptranslate {display:none;} .txt_option{display: inline-block;padding-right: 5px; color: #17a2b8; letter-spacing: -.08em;} .txt_event{display: inline-block;padding-right: 5px; color: #fd5412; letter-spacing: -.08em;} body.sub-content .sub-nav + .sub-page { padding-top: 0} .lang_menu.mobile { display: none} .site-nav .gnb_login, .site-nav .nav_m, .search_sec { display: none} .site-nav > ul > li.mn_search {margin-left: 5px; display: none} .site-nav > ul > li.nav_signature > a { box-shadow: 0 0 0 2px #fff inset !important; padding-right: 15px; padding-left: 15px; border-radius: 25px; opacity: 1 !important; } .site-nav #navigation.nav07 > li:first-child a {box-shadow: none; } .site-nav > ul > li.nav_event > a { background-color: #ff9107; padding-right: 35px; padding-left: 35px; border-radius: 25px; opacity: 1 !important; color: #fff !important} .site-nav > ul > li.nav_event .badge { display: none} body.sub-content section.sub-nav { padding-bottom:50px; } @media (min-width: 1200px){ .header-brand .logo { margin-left: 0} } .btn_cart, .btn_bell { position: absolute; top: 2.5rem; border: none; background: none; padding: 4px 10px 4px 2px} .btn_cart {right: 9rem;} .btn_bell {right: 9rem;} .btn_cart i, .btn_bell i { font-size: 1.2em; color: #fff} .btn_cart span.bedge, .btn_bell span.bedge {position: absolute;padding: 1px 4px;border:none;border-radius: 50em;font-size: 10px;line-height: 1.1em;background-color: #ff9107;color: #fff;bottom: 14px;left: 17px;font-weight: 700; font-family: "Lato",'Noto Sans KR',"Apple SD Gothic","dotum",Tahoma, sans-serif;} button.btn_cart span.bedge:empty, button.btn_bell span.bedge:empty { display: none;} body.layout-mobile .site-nav > ul > li.mn_search { margin-right: 85px;} .snbList ul{display:flex; align-items: center; justify-content: space-between; flex-wrap: wrap; position:relative;width:100%;list-style:none; border:1px solid #17a2b8; border-bottom:none;overflow: hidden} .snbList li{text-align:center;flex-grow: 1;} .snbList li a{display:block;height:60px;line-height:60px;background:rgba(3, 158, 190, 0.7);font-weight:400;font-size:1rem;color:#fff;letter-spacing:-0.05em;} .snbList li.on a{background:#fff;color:#333; font-weight: 500} .snbList.col3 li {width: calc(100% / 3);} .snbList.col4 li {width: calc(100% / 4);} .snbList.col5 li {width: calc(100% / 5);} @media only screen and (max-width: 1200px) and (max-height: 768px){ body.layout-mobile .site-footer { padding: 1.5rem 0;} body.layout-mobile .site-container { } } @media only screen and (max-width: 1470px){ .header-content-light .logo-light, .header-content-light .logo-dark { margin: 0 auto} .snbList li a { font-size: .9em} } @media only screen and (max-width: 1200px){ body .site-container {padding-bottom: 50px;} body.sub-content.layout-mobile .site-container {} .site-nav #navigation > li.nav_signature > a { box-shadow: none; padding-right: 12px; padding-left: 12px; border-radius:0; font-weight: 700; color: #0232b4 !important} .site-nav #navigation.nav07 > li:first-child > a {font-weight: 500;color: #111 !important} .site-nav > ul > li.nav_event > a { background-color: #fff; padding-right: 12px; padding-left: 12px; border-radius: 0; font-weight: 700; color: #ff9107 !important} .site-nav > ul > li.nav_event .badge { display: block; display: inline-block} .header-brand .logo { position: absolute; left: 15px; text-align: center; margin-left: 0;top: 50%; margin-top: -15px; } body.layout-mobile .btn_cart {} body.layout-mobile .lang_menu.mobile + .btn_cart {} body.layout-mobile .lang_menu.mobile {position: absolute;right: 43px; display: block} body.layout-mobile .lang_menu.mobile button {font-size: 12px; } body.layout-mobile .lang_menu.mobile button > span:first-child {width: 20px;height: 20px} body.layout-mobile .lang_menu.mobile ul { border:1px solid #ddd ; right: inherit; left:0 !important } body.layout-mobile .lang_menu.mobile > button {line-height: 1} body.layout-mobile .lang_menu.mobile > button > span {width: 22px !important;height: 22px !important;} .copyright-container .foot-nav a:after { background-color: rgba(0,0,0,.2);} a.backtotop { bottom: 10rem;} .site-nav .nav_m { display: block; overflow: hidden;padding: 15px 15px 0px 0;border-bottom: 1px solid #ddd;background: #efefef;} .site-nav .nav_m > a{ float: left;width: calc(33.3% - 15px);word-break: break-word;padding: 20px 0 20px 45px;margin: 0 0 15px 15px; background: #fff; color: #333; position: relative; font-size: 13px; font-weight: 500} .site-nav .nav_m > a:before, .site-nav .nav_m > a:after {content:"\e649";display: block; position:absolute; top:50%; width:24px; height:24px; line-height: 24px; font-family: 'themify'; margin-top: -11px} .site-nav .nav_m > a:before {left:15px; border-radius: 50%; background-color: #18abc1; color: #fff; text-align: center} .site-nav .nav_m > a:after { right: 0px; color: #888} .site-nav .nav_m > a:nth-child(1)::before {content:"\e719"} .site-nav .nav_m > a:nth-child(2)::before {content:"\e6cd"} .site-nav .nav_m > a:nth-child(3)::before {content:"\e6d4"} .site-nav .nav_m > a:nth-child(4)::before {content:"\e693"} /* 모바일 로긴버튼 추가 20211102 */ .site-nav .gnb_login {display: block; overflow: hidden; text-align: center;} .site-nav .gnb_login li { float: left; width: 50%;margin: 0; border: none;} .site-nav .gnb_login li a {display: block; font-size: .952em; color: #fff; line-height: 45px; background: #18abc1;padding: 0} .site-nav .gnb_login li a:hover {color: #fff;} .site-nav .gnb_login li a:after { display: none} .site-nav .gnb_login li+li a {background: #282828;} body.sub-content .sub-page { padding-top: 3em;} body.sub-content section.sub-nav { padding-bottom: 30px; margin-top: -45px;} .snbList li a {height:45px;line-height:45px;} .snbList ul{border-width: 0 1px 0 0; border-color: #dfdfdf; background-color: #f1f1f1;} .snbList li{flex: 1 1 30%; border-bottom:1px solid #dfdfdf;border-right:none; position: relative} .snbList li:before { content: ""; display: block; width: 1px; height: 100%;background-color:#dfdfdf; position: absolute; left: 0; top:0} .snbList li.hidden:nth-child(1) + li.on:before, .snbList li.on:nth-child(1):before, .snbList li:nth-child(1):before {display: none !important} /* 20230414 수정 .snbList li:nth-child(3n+1) {width:33.4% !important; border-right:1px solid #dfdfdf;border-left:1px solid #dfdfdf;} .snbList li.on:nth-child(3n+1) {border-left-color:#18abc1;} .snbList li.on:nth-child(3n+3) {border-right-color:#18abc1;} .snbList.col4 li:nth-child(2n+1) {border-left:1px solid #dfdfdf;} .snbList.col4 li:nth-child(3n+1) {border-left:none;} .snbList.col4 li.on:nth-child(2n+1) {border-left-color:#18abc1;} .snbList.col4 li.on:nth-child(2n+2) {border-right-color:#18abc1;} .snbList.col5 li:nth-child(3n+1) {border-left:none;} .snbList.col5 li.on:nth-child(3n+1) {border-left-color:#18abc1;} .snbList.col5 li.on:nth-child(3n+2) {border-right-color:#18abc1;}*/ .snbList li a {background:#fff;color:#333; } .snbList li.on {background:#18abc1;color:#fff;} .snbList li.on a{ background-color: transparent;color:#fff} /* 메뉴바 검색 */ .search_sec { display:none; margin: 10px 0;} .search_box { position: relative; padding-right: 50px} .search_box input { width: 100%; height: 40px; font-size: 14px; padding-left: 10px; border-radius: 3px 0 0 3px; border: 1px solid #ddd} .search_box button { position: absolute; right: 0; top:0; width: 52px; height: 40px; border-radius: 0 3px 3px 0; letter-spacing: -999px; font-size: 0; background-image: url("/images/common/search_w.svg"); background-position: 50% 50%; background-repeat: no-repeat; background-size: 20px auto; border: none} .site-nav > ul {margin-right:0} .site-nav > ul > li.mn_search { display: none} .btn_cart, .btn_bell { position: absolute; top:10px; width: 35px} .btn_cart {right:75px; } .btn_bell {right:110px; } .btn_cart i, .btn_bell i { font-size:1.3125em; color:#5f5f5f} .btn_cart i.ico, .btn_bell i.ico {} .btn_cart span.bedge, .btn_bell span.bedge {bottom: 14px;} } @media only screen and (max-width: 900px){ body.sub-content .sub-page {padding-top: 2.5rem; padding-bottom: 2.5rem;} } @media only screen and (max-width: 768px){ body.sub-content .sub-page {padding-top: 1.5rem; padding-bottom: 1.5rem;} body.layout-mobile .site-footer { padding: 1rem 0; } body.sub-content.layout-mobile .site-footer {margin-bottom: 0px} body.sub-content.layout-mobile .site-container { padding-bottom:45px } body.sub-content.layout-mobile .site-footer { padding: 1.2em 0 3em;background-color: #f6f6f6;} body.sub-content section.sub-nav { margin-top: -35px;} a.backtotop { bottom: 4.5rem;} .snbList li a {font-size:12px;height: 35px; line-height: 35px;} .site-nav .nav_m {padding: 10px 10px 0px 0;} .site-nav .nav_m > a{ width: calc(33.3% - 5px);padding: 15px 0 15px 35px;margin: 0 0 10px 5px; font-size: 11px; } .site-nav .nav_m > a:before, .site-nav .nav_m > a:after { width:20px; height:20px; line-height: 20px; margin-top: -10px} .site-nav .nav_m > a:before {left:10px;} .site-nav .nav_m > a:after { display: none} } @media only screen and (max-width: 320px){ body.sub-content section.sub-nav { margin-top: -30px;} .snbList li a {height: 30px; line-height: 30px;} } /* sub page common */ .ttl-guide{ line-height: 1.5} .ttl-guide span.small { line-height: 1.5; display: block; font-weight: 300; margin-top: 10px} .top-line { border-top: 1px solid #e9e9e9; padding-top: 3em;clear: both;margin-top: 50px;} h3.box-h3 {font-size: 2em; font-weight: 700; margin-bottom: 1.5em;text-align: center} h3.box-h3 span {font-size: .6em;font-weight: 400; display: block; margin: 0 10px; color:#18abc1} h3.box-h3 span:before,h3.box-h3 span:after { content: ""; display: inline-block; width: 5px; height: 5px; vertical-align: middle; margin: 0 10px 2px; background-color:#18abc1; border-radius: 50% } @media only screen and (max-width: 768px){ h3.box-h3 {font-size: 1.6em;} h3.box-h3 span:before,h3.box-h3 span:after { width: 3px; height: 3px; margin: 0 5px 1px; } } /* 리즈온클리닉 소개*/ .box_intro { margin-top: 2em} .box_intro .img { float: right; width:470px;} .box_intro .ttl { font-size: 2.5em; font-weight: 700;line-height: 1.2; color: #2d2d2d;font-family:'Lato'; } .box_intro .subTxt {font-size: 1.5em; line-height: 1.3; font-weight: 500; color: #666; margin-top: 2rem} .box_intro .subTxt strong {font-weight: 700; color:#18abc1} .box_gallery { margin-top: 3em} .box_gallery .slick-dots { margin-top: 1em;} .slider.slick_gallery .slick-slide {padding: 0.3em; } .slider.slick_gallery .slick-slide > div {border-radius: 2%; overflow: hidden; } @media only screen and (max-width: 986px){ .box_intro { text-align: center} .box_intro .img { float: none; width:100%} .box_intro .ttl { width: 80%; margin: -50px auto 0; font-size: 2em; position: relative; background-color: #fff; padding: 20px 0 15px; } } @media only screen and (max-width: 480px){ .box_intro .ttl { font-size: 1.5em; padding: 10px 0; } .box_intro .subTxt {font-size: 1em; margin-top: 1rem; line-height: 1.5; clear: both;} .box_gallery .slick-dots { margin-top:0} } /* 시술전후 */ #bnf_wrap {max-width: 900px;margin:0 auto;padding-bottom:30px;background:#ffffff;position:relative;} #bnf_wrap > h4 {text-align: center; font-size: 1.5rem; font-weight: 500; line-height: 1.3; color: #111;} #bnf_wrap .subject {font-size: 1.3em;line-height: 1.3em;font-weight:500;color: #333;letter-spacing:-1px;text-align:center; padding-bottom: .3em; } #bnf_wrap .subject:before { display: none} #bnf_wrap .subject + p { text-align: center; color: #777; line-height: 1} #bnf_wrap .subject + p small {font-size: 80%;} #bnf_wrap .view_box {max-width: 890px;margin: 10px auto 2em;padding:0 0 45px;overflow:hidden;position:relative;} #bnf_wrap .view_box .btnarea {width:100%;position:absolute;bottom: 0;left:0;height:35px;text-align:center; z-index: 100} #bnf_wrap .view_box .btnarea .btn {text-align:center; display:inline-block; } #bnf_wrap .view_box .btnarea .btn li {text-align:center; display: inline; float:left; cursor: pointer;margin: 0 3px;} #bnf_wrap .view_box .btnarea .btn li span { display:block; width:13px; height:13px;background: #cdcdcd; border-radius:50%; letter-spacing:-200px; overflow:hidden; font-size:0} #bnf_wrap .view_box .btnarea .btn li.active span {background: #18abc1;} #bnf_wrap .view_box p {top:214px; left:50%; margin-left:-38px; position:absolute; z-index:100;} #bnf_wrap .view_box .img {position: relative;z-index: 1} #bnf_wrap .view_box .img li { display:none} #bnf_wrap .view_box .img li.active { display:block} #bnf_wrap .view_box .img li i {display: block;width: 49.5%;float: left;border-radius: 10px;overflow: hidden;position: relative;text-align: center; background-color: #333} #bnf_wrap .view_box .img li i:after{content: "";position: absolute;right: 10px;top: 10px;background: url(/images/common/ci.svg) no-repeat 50% 50%;background-size: 100%;width: 50px;height: 50px;} #bnf_wrap .view_box .img li i img {height: auto;width: 100%;} #bnf_wrap .view_box .img li i.before {margin-right: 1%;} #bnf_wrap .view_box .img li i.after { } #bnf_wrap .view_box .img li span {position: absolute;width: 49.5%;bottom: -2.5em;margin: 0;text-align: center;color: #8f8f8f;z-index:100;font-size: 1em;font-weight: 500; line-height: 2em;border-radius: 0 0 10px 10px; background-color: rgb(0 0 0 / 0%);} #bnf_wrap .view_box .img li span.before { left:0; } #bnf_wrap .view_box .img li span.after { left: 50.5%; } #bnf_wrap .list_box {position:relative;padding: 0 30px;} #bnf_wrap .list_box .sum {margin:0 auto;} #bnf_wrap .list_box .sum li {width:25%;float:left;margin:0 0 25px 0;cursor:pointer;padding: 0 7px;text-align:center; position: relative} #bnf_wrap .list_box .sum li i {background-color:#ddd;display: block;width: 49.5%;float: left;border-radius: 3px;overflow: hidden;position: relative;text-align: center;} #bnf_wrap .list_box .sum li i img { height: auto;width: 100%;filter: blur(7px);} #bnf_wrap .list_box .sum li i.before {margin-right: 1%;} #bnf_wrap .list_box .sum li img {display:block;opacity: .5;} #bnf_wrap .list_box .sum li.on img {opacity: 1;} #bnf_wrap .list_box .sum li p {font-size:13px;color:#707173;letter-spacing:-1px;text-align:center;padding-top: 5px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;clear: both;} #bnf_wrap .list_box .next, #bnf_wrap .list_box .prev {top:50%;position:absolute;z-index:200;cursor:pointer;margin-top: -46px;} #bnf_wrap .list_box .next {right:0;} #bnf_wrap .list_box .prev {left:0;} #bnf_wrap .view_box .bnaDesc {position: absolute;width: 100%;bottom: 55px;margin: 0;text-align: center;color: #fff;z-index:100;} #bnf_wrap .view_box .bnaDesc li {width: 50%;font-size: 1em;font-weight: 500;float: left;text-align: center;} #bnf_wrap .view_box .bnaDesc li:nth-child(3) {position: relative;width: auto;margin: 15px auto;float: none;display: inline-block;clear: both;} /* 시술전후- 로그인 */ /*#bnf_wrap.login_before .list_box .sum li:before{position: absolute;top: 0;left: 7px;z-index: 2;width: calc(100% - 14px);height: 100%;background: url(/images/member/login_box_list.png) no-repeat top center;content: '';background-size: 100% auto;padding: 0 7px;}*/ #bnf_wrap .btn_login { display: none} #bnf_wrap.login_before .btn_login {display: block;overflow: hidden;position: absolute;top: 0;left: 0;z-index: 500;width: 100%;height: calc(100% - 45px);text-indent: -9999px; border: none;border-radius: 10px;background:rgba(0,0,0,.5) url(/images/member/login_box.png) no-repeat 50% top; background-size: auto 100%;} .view_list #bnf_wrap { margin-top: .5em} .view_list #bnf_wrap > h4 { text-align: left; float: left;font-size: 1.15em;line-height: 1.875rem;} .view_list #bnf_wrap > h4 + p {float: right} .view_list #bnf_wrap #div_view { clear: both} @media only screen and (max-width: 991px){ #bnf_wrap.login_before .btn_login {height: calc(100% - 40px);} } @media only screen and (max-width: 768px){ #bnf_wrap .list_box {padding: 0 20px;} #bnf_wrap .list_box .sum li {width:50%;margin: 0 0 15px 0;padding: 0 3px;} #bnf_wrap .list_box .next,#bnf_wrap .list_box .prev {width:12px;margin-top: -32px;} #bnf_wrap .view_box {padding:0 0 40px;margin: 10px auto 1em;} #bnf_wrap .view_box .btnarea .btn li span {width:10px; height:10px;} #bnf_wrap .list_box .sum li p {font-size:12px;} #bnf_wrap .view_box .bnaDesc {bottom: 45px; } #bnf_wrap .view_box .bnaDesc li {font-size:.85em} #bnf_wrap.login_before .list_box .sum li:before{ left: 3px;width: calc(100% - 6px);} #bnf_wrap .view_box .img li i:after{right: 5px;top: 5px;width: 30px;height: 30px;} } /* @media only screen and (max-width: 767px){ #bnf_wrap .view_box .img li i { height: 202px;} #bnf_wrap .list_box .sum li i { height: 91px;} } @media only screen and (max-width: 450px){ #bnf_wrap .view_box .img li i { height: 166px;} #bnf_wrap .list_box .sum li i { height: 72px;} #bnf_wrap .view_box .img li span {font-size:11px;} } @media only screen and (max-width: 414px){ #bnf_wrap .view_box .img li i { height: 152px;} #bnf_wrap .list_box .sum li i { height: 66px;} } @media only screen and (max-width: 375px){ #bnf_wrap .view_box .img li i { height: 138px;} #bnf_wrap .list_box .sum li i { height: 58px;} } @media only screen and (max-width: 360px){ #bnf_wrap .view_box .img li i { height: 130px;} #bnf_wrap .list_box .sum li i { height: 55px;} } @media only screen and (max-width: 320px){ #bnf_wrap .subject {font-size: 1.2em;line-height: 1.2em;} #bnf_wrap .view_box .img li i { height: 116px; } #bnf_wrap .list_box .sum li i { height: 47px;} } @media only screen and (max-width: 280px){ #bnf_wrap .view_box .img li i { height: 100px; } #bnf_wrap .list_box .sum li i { height: 39px;} } */ /* 의료진/스텝소개 */ .box_profile > div { overflow: hidden} .box_profile > div p img { max-width: 100%} .staff_box { text-align: center;} .staff_box > li {display: inline-block;width:22%;/* float:left; */margin-bottom: 0px;margin-left: 3.7%;} .staff_box > li:nth-child(4n+1) {margin-left:0px;} .staff_box .staff_box_img { box-shadow: 0px 5px 15px rgba(0,0,0,.1); overflow:hidden;} .staff_box .staff_box_name {text-align: center;margin: .7em 0px 1em;letter-spacing: 5px;font-size: 1.25em;} .staff_box .staff_box_name span {min-height: 40px;font-size: .75em;line-height: 1.3;letter-spacing:-1px;display: block;margin: 5px 0 0 -5px;color: #777;font-weight: 400;} @media only screen and (max-width: 768px){ .staff_box > li {width:47%;margin-bottom: 0px;margin: 0 1.5% !important;/* float: left; */} .staff_box > li:nth-child(2n+1) {margin-left:0px !important;} .staff_box .staff_box_img { box-shadow: 0px 5px 10px rgba(0,0,0,.1);} .staff_box .staff_box_name {font-size: 1em;letter-spacing: 0;margin: .5em 0px 0;} .staff_box .staff_box_name span { margin:5px 0 0 -5px;font-size:12px} } /* 오시는길 */ .box_location { display: flex; overflow: hidden} .box_location > div {width: 50%; display: flex; margin: 0} .box_location > div:nth-child(2n+1) { margin-right: 0%;} .box_location > div#map {border:none;margin: 0;background-color: #ddd;position: relative;overflow: hidden; padding: 0 } .box_location > div#map .root_daum_roughmap {width: 100%;} .box_location > div#map .root_daum_roughmap .cont { display: none} .box_location > div dd.linkBtn a.btn {width: 24%;font-size: 1em; line-height: 2em; float: left} /* SparkwebCloud 20250613. Apple Maps 추가로 width 수정 */ .box_location > div dd.linkBtn a.btn:last-child { margin-left: 2%} .root_daum_roughmap .wrap_controllers { display: none} @media only screen and (max-width: 1024px){ .box_location { display: block} .box_location > div {width: 100%; height: inherit;padding: 0; border: none; } .box_location > div#map {height: 300px; margin-bottom: 15px} .box_location > div dt { display: none} } /* 공통검색창 **/ .popPrice{display:none;} .popPriceCont .priceCont{height:485px;} .popPriceCont .contInput{display: flex; padding: 35px 30px 20px; position: relative;} .popPriceCont .contInput::after{content:''; width:1020px; height:1px; background:#7b7b7b; position: absolute; bottom:0; left:50%; transform: translateX(-50%);} .popPriceCont .contIcon{width:35px; height:35px; background: url("/images/common/i_search.png") no-repeat; background-position: -38px -148px;text-indent:-10000px} .popPriceCont .contText{width: 100%; border: 0px; padding: 0px 25px; font-size:20px;} .popPriceCont .contText:focus { outline: none;} .popPriceCont .contClose{width:35px; height:35px; background: url("/images/common/i_close.png") no-repeat; background-position: 50%; cursor: pointer;} .popPriceCont .contList{height: 395px; padding: 0px 30px 0px; overflow-y: auto;} .popPriceCont .contList ul{width: 1020px;} .popPriceCont .contList li{padding:30px 0px 30px; border-top:1px solid #e4e4e4; cursor: pointer;line-height: 1.2;} .popPriceCont .contList li:first-child{border-top:0px;} .popPriceCont .contList li.noneSearch{text-align: center; font-size: 24px; cursor: auto;} .popPriceCont .contList li.noneSearch span{margin-right: 5px; font-size: 24px; color: #ff172d;} .popPriceCont .contList li .tit{color: #000;font-weight: 500;} .popPriceCont .contList li .tit span{color: #ff172d;} .popPriceCont .contList li .cont{font-size: 14px; margin-top: 8px; color: #636363;} .popPriceCont .contList li .cont span{color: #ff172d;font-size: 14px;} /*////////// 가격 //////////*/ body.sub-content .page-price section.sub-title { padding-bottom: 7rem;} /* 시술가격 - 리스트 */ .priceList { overflow: hidden; clear: both; display: flex;flex-wrap: wrap;} .priceList > li {position: relative; height: 150px; float: left; display: flex; border: 1px solid #dfdfdf; padding:10px 20px; background: #fff; margin-bottom: 20px; cursor: pointer; border-radius: 5px;} .priceList > li:last-child {margin-bottom: 20px !important;} .priceList > li:hover, .priceList > li.on {border: 1px solid #000; box-shadow: 0 3px 7px rgba(0,0,0,.2)} .priceList.viewLink > li { padding-right: 50px} .priceList.viewLink > li:after { content: ""; display: block; position: absolute; right: 20px; top:0; height: 100%; width: 15px; background:url("/images/common/right_arrow2.svg") no-repeat 50% 50%; background-size: 100%; opacity: .3; transition: all .3s;} .priceList.viewLink > li:hover:after {opacity: .7; right: 10px;} /*.priceList > li {width:23.5%;;margin-left:2%; } .priceList > li:nth-child(4n+1) {margin-left:0%;}*/ .priceList > li {width:49%;margin-left:2%; } .priceList > li:nth-child(2n+1) {margin-left:0%;} .priceList > li .price_box { align-self:center;} .priceList > li .price_icon {margin-bottom: 5px;} .priceList > li .price_tit {font-size: 1.3em; font-weight: 500; line-height:1.2} .priceList > li .price_tit small {font-size: 1em;font-weight: 500; letter-spacing: -.08em} .priceList > li .price_cont {font-size:0.92em; padding-top:10px;line-height:1.25em; font-weight: 400; color: #888; /* overflow: hidden; display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; min-height: 35px; text-overflow: ellipsis; height: 45px;*/} .priceList > li .price_cont +.price_cont {padding-top:3px;} .priceList > li .price_price { display: inline-block;font-size: 1.3em; padding-top: 7px; font-weight: 700;align-self: center; color:#fd7e27;font-family: "Lato",'Noto Sans KR',"Apple SD Gothic","dotum",Tahoma, sans-serif} .priceList > li .price_ex { display: inline-block; font-size:0.9375em; padding-top: 10px; font-weight: 400;align-self: center; color:#bbb; margin-left: 5px; font-family: pretendard, sans-serif;} .priceList > li .price_ex span:first-child {text-decoration: line-through;} .priceList > li .price_ex .discount { display: inline-block;font-weight: 700; letter-spacing: -0.1em;} .priceList > li .price_list_date{margin: 20px 0 0; font-size: 14px; line-height:1;font-weight: 500;color: #17a2b8;position: relative; padding-left: 20px} .priceList > li .price_list_date> div{font-size: 0.9375em; margin: 4px 0 0;font-weight: 400; word-break: keep-all;line-height: 1.3;} .priceList > li .price_list_date:after { content: "\e6b6";position: absolute; left:0px; top:0; width: 25px; height: 20px; font-family: 'themify'; font-size: 15px} .boxSize ul.price_btn { position: absolute; right: 20px; top:50%; margin-top: -62.5px;} .boxSize ul.price_btn > li {width: 60px} .boxSize ul.price_btn > li:first-child { margin-bottom: 5px} .boxSize ul.price_btn > li a {display: block; height: 60px; line-height: 60px; text-align: center; background-color: #000; border-radius: 50%; color: #fff} .boxSize ul.price_btn > li:first-child a {} /*////////// 함께하면 좋은 시술 수정-20220926 //////////*/ .priceList.viewItem > li {padding:0; overflow: hidden;height: inherit; width: 48%; margin-left: 2%} .priceList.viewItem > li:nth-child(2n+1) {margin-left: 0%;} .view-item{display:block; height:100%; min-height:inherit; border:0px solid #ddd; border-radius:0; background:#fff; box-sizing:border-box;text-align: center; margin: 0;letter-spacing:-1px;padding:0px 0 .5em; position: relative;font-size:1em; width: 100%; } .view-item:hover { cursor: pointer; border-color:#000; box-shadow: 0px 5px 10px rgba(0,0,0,.2); transition: all 500ms;} .view-item > a { display: block; width: 100%; height: 100%} .view-item > a > div {margin: 0 20px} .view-item .badge-cont{ position: absolute; left:0; top:0; margin: 0; z-index: 10} .view-item .badge-cont .badge {border-radius:0; vertical-align: top;} .view-item .event-pic { position: relative;padding-bottom: 60%;padding-top: 0;height: 0;overflow: hidden;background: #f6f6f6 url("../images/common/blank_event.png") no-repeat 50% 50%; background-size: 100%; margin: 0 } .view-item .event-pic:after {content: "";position: absolute;left: 15px;top: 15px;background: url(/images/common/ci.svg) no-repeat 50% 50%;background-size: 100%;width: 50px;height: 50px;} .view-item .event-pic img {position:absolute;top:0;left:0;width:100%;height:100%;transition: 0.4s all ease; -webkit-transition: 0.4s all ease; -moz-transition: 0.4s all ease; -ms-transition: 0.4s all ease; -o-transition: 0.4s all ease;} .view-item .event-pic:hover .cover {display:block;position:absolute;top:0;left:0; background:#f6f6f6;opacity:0.6; filter:Alpha(opacity=60); width:100%;height:100%;} .view-item .event-pic:hover img{-ms-transform: scale(1.2); -webkit-transform: scale(1.2); transform: scale(1.2);} .view-item .event-group {display:inline-block; min-width:120px; font-weight:700; padding:0 2rem; margin:1rem 0 .3rem; background:#fff; border-radius:15px;font-size: 0.8125em; border: 1px solid #18abc1; color: #18abc1; } .view-item .event-day { font-size: 0.875em; color: #666 ;} .view-item .event-tit {line-height:1.2; font-weight: 600; font-size:1.0625em;margin:1rem .5rem .5rem; color: #333 ;text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} .view-item .event-subject { font-size: 0.9375em; color: #333} .view-item .price-box {margin:0; letter-spacing:-1px;font-family: 'Lato', sans-serif;} .view-item .price-box > div { display: inline-block; margin: 5px 2px 0;} .view-item .price-box .prid-price { color: #a7a7a7; text-decoration: line-through; font-size: 0.875em; } .view-item .price-box .event-price {font-size:1.1em; font-weight: 700 ;color: #ff8907} .view-item .event-txt { color:#888; line-height: 1.3; font-size: 0.9375em; clear: both; height: 38px; margin: 0 1rem} .view-item .event-group:empty {border:none} .view-item .event-group:empty + .event-tit { margin-top: -.7rem} /* 202006 추가 2종류 가격표기 */ .view-item .price-box dl {display: inline-block; margin:0; font-size: 0.9375em} .view-item .price-box dl:first-child { margin-right: 7px} .view-item .price-box dt {font-size: 0.9375em;float: left; color: #333} .view-item .price-box dd {float: right; margin: 0} .view-item .price-box dl div { display: inline-block; text-align: right; padding-left: 5px;} .view-item .price-box dl div.prid_price { line-height: 1} /* 검색 **/ .price_search {width: 500px; margin: 1.5em auto 0; position: relative} .price_search input.search_input {width: 100%;padding: 0 60px 0 20px;margin: 0;border:none; background-color:#fff; border-radius: 30px; height: 50px; line-height: 50px} .price_search .search_bn { position: absolute; right:0px; top:0; width: 60px; height: 100%; text-align: center;padding:0;background:url("/images/common/i_search.svg") no-repeat 50% 50%; background-size: auto 50%;border-radius:0;cursor: pointer; border: none; text-indent: -9999px ; font-size: 0; opacity: .8} .noSearch { text-align: center; padding: 4em 0 6em; font-size: 1.25em;} .noSearch:before { content: ""; display: block; height: 100px; background: url("/images/common/search_file.svg") no-repeat 50% 50%; background-size: contain; margin-bottom: 1.5em; opacity: .3} .noSearch strong {color: #ff8809;} /* .viewCont .priceList > li {width:49%;margin-left:2%; } .viewCont .priceList > li:nth-child(3n+1) {margin-left:2%;} .viewCont .priceList > li:nth-child(2n+1) {margin-left:0%;} */ @media only screen and (max-width: 1470px){ .priceList > li {} .priceList > li {width:49%;margin-left:2%; } .priceList > li:nth-child(3n+1) {margin-left:2%;} .priceList > li:nth-child(2n+1) {margin-left:0%;} } @media only screen and (max-width: 1024px){ .viewCont .priceList > li .price_cont, .priceList > li .price_ex { padding-top: 5px;} } @media only screen and (max-width: 900px){ body.sub-content .page-price section.sub-title { padding-top: 2rem; padding-bottom: 4rem;} .price_search { width: 100%; margin: 1em auto 0;} .price_search input.search_input{border-radius: 20px; height: 40px; line-height: 40px; font-size: 14px} .priceList > li {width:49% !important ;margin-left:2% !important;height: 135px; } .priceList > li:nth-child(4n+1), .priceList > li:nth-child(3n+1) {margin-left:2% !important;} .priceList > li:nth-child(2n+1) {margin-left:0% !important;} } @media only screen and (max-width: 740px){ .priceList > li {width:100% !important;margin-left:0 !important;height:inherit !important;padding: 20px 15px; margin-bottom: 10px; } .priceList > li:nth-child(4n+1), .priceList > li:nth-child(3n+1) {margin-left:0 !important;} .priceList > li .price_tit {font-size: 1.1875em;} .priceList > li .price_cont {padding-top: 5px;} .priceList > li .price_price {font-size: 1.3125em;} .priceList.viewLink > li { padding-right: 30px} .priceList.viewLink > li:after { right: 15px; width: 15px; background-size: 100%; opacity: .3; } .priceList.viewLink > li:hover:after {right: 5px;} } @media only screen and (max-width: 640px){ .noSearch {padding: 1em 0 4em; font-size: 1em;} .noSearch:before {height: 60px;} } /* 시술가격 - 보기 */ body.sub-content .page-price-view section.sub-nav, body.sub-content .page-price-view section.sub-page{padding-bottom: 0;} body.sub-content .page-price .container.content_view {position: relative; padding-top: 3em; padding-bottom: 0} .viewSubTit, .viewCont { padding-right: 500px} .viewPrice{float: right; width: 450px;overflow: hidden;} .viewPrice .viewPriceBox { width: 450px;height: 100%;position: absolute;background: #f9f9f9;overflow: hidden; padding: 40px 0 30px;top: 0;} .prodList {padding: 0px 30px;position: relative;} .prodList{ overflow-y: auto; /* 수직 스크롤바 표시 */} .prodList::-webkit-scrollbar { width: 6px; /* 스크롤바 너비 */} .prodList::-webkit-scrollbar-thumb { background-color: #acb0b5; /* 스크롤바 색상 */ border-radius: 3px; /* 스크롤바 모서리 반경 */} .prodList::-webkit-scrollbar-track { background-color: #acb0b554; /* 스크롤바 트랙 색상 */} .viewPrice .viewPriceBox .prodList > di {padding: 0px 30px;position: relative;overflow: overlay;} .viewPrice .viewPriceBox.fixed { position: fixed; top:0px;} .viewPrice .viewPriceBox.fixed.bottom {height: calc(100% - 158px);} .viewSubTit { position: relative; margin-bottom: 1em; overflow: hidden} .viewSubTit .location { right: 430px; float: right; padding-left: 10px; } .viewSubTit h3 { font-weight: 500; color: #111; font-size: 1.5em; margin-bottom: .3em; letter-spacing: -1.2px;} .viewSubTit h3 > em {font-style: normal;font-weight: 400;} .viewSubTit h3 > p {font-family: 'Lato','Noto Sans KR';font-size: .6em;font-weight: 500; } .viewSubTit p {margin-bottom: 0; line-height: 1.5;color: #566474c7;} .viewSubTit a.kakaoShare { display: none;position: absolute; right: 0; top:0; line-height: 24px; font-size: 10px; color: #402d33; padding: 0 10px 0 30px; border-radius: 12px; background-color: #fff200; font-weight: 500} .viewSubTit a.kakaoShare:before { content: ""; display: inline-block; background: url("/images/common/kakao.svg") no-repeat 0 0; width: 37px; height: 30px; background-size: auto 100%; position: absolute; left: -3px; top:-1px} .viewCont { } /* 이미지 썸넬적용-20200622 */ .viewCont .view_img {position: relative; overflow: hidden; width: 100%;} .viewCont .view_img img { width: 100%} .viewCont .view_img:before { content:""; display:block; position:absolute; left:5%; top:10%; width:90%; height:80%; margin:0 auto; background-color: rgba(0,0,0,.3);/*backdrop-filter: blur(1px);*/;backdrop-filter: contrast(115%);} .viewCont .view_img p { position:absolute; width:80%; height: 65%; text-align:center; left:10%; top:25%; z-index: 2; color: #fff; font-size: 1.2em; line-height: 1.3 } .viewCont .view_img p strong { display:block; font-size:2em; font-weight:700; margin-top:.2em} .viewCont .view_img p:before {content:""; display:block; width: 100%; height:40% ; background:url("/images/common/simbol.svg") no-repeat 50% 50%; background-size: auto; margin-bottom: 15px } .viewCont .view_video {position: relative; max-width: 100%; padding-bottom: 56.25%; height: 0;} .viewCont .view_video iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} .viewCont .view_list { margin-top: 3em; clear: both} .viewCont .view_list:first-child{ margin-top: 1em; } .viewCont .view_list:last-child {border-bottom: none; margin-bottom: 2em;} .viewCont .view_list > dt { font-size:1.25em; font-weight: 600;color: #333; border-bottom: 1px solid #ccc; padding-bottom: 10px; margin-bottom: 15px; overflow: hidden} .viewCont .view_list > dt span {color: #fd7e27} .viewCont .view_list > dt i {color: #8E8E8E; font-size: 12px; display: inline-block;font-weight: 400; font-style: normal; float: right} .viewCont .view_list > dd { color: #666; overflow: hidden; letter-spacing: -1px} .viewCont .view_list > dd.subject { font-weight: 500; font-size: 1.125em; margin-bottom: .5em; color: #444} .viewCont .view_list > dd.htag { font-size: .938em; color: #6eb8c3} .viewCont .view_list .priceList > li .price_tit { color: #444} .viewCont .view_list h4 { font-size: 1em;padding-left: 20px; font-weight: 500; position: relative; color: #333} .viewCont .view_list h4:before {content: ''; position: absolute;top: 10px;width: 10px;height: 10px;background: #fff;border: 3px solid #18abc1;border-radius: 50%;left: 5px;} .viewCont .view_list .table-wrap {margin: 5px 0 10px;} .viewCont .view_list .table-wrap table th {padding: 10px 6px;} .viewCont .view_list .table-wrap table tbody th {background: #fff;} .viewCont .view_list .table-wrap table tbody td {padding: 10px 6px;} .viewCont .view_list .table-wrap table tbody .point th {color: #941a1a;background-color: #fff9f5;} .viewCont .view_list .table-wrap table tbody .point td {color: #c12e2e;background-color: #fff9f5;} .viewCont .view_list.tb > dt { padding: 0; margin: 0; border: none} .viewCont .view_list .icoList > li {position: relative; min-height: 100px; display: flex; align-items: flex-start; gap:10px} .viewCont .view_list .icoList > li strong { color: #18abc1} .viewCont .view_list .icoList > li i { display: block; width: 80px; height: 80px; text-align: center; line-height: 80px; border: 1px solid #18abc1; border-radius: 50%; font-size: 1.8em; color: #18abc1; } .viewCont .view_list .icoList > li p { flex:1; margin: 0.5em 0;} /* 프로그램구성 추가.2021.01.16 */ .box_program { overflow: hidden; border: 1px solid #c8d3ed; border-radius: 5px; padding: 1em;margin-bottom: 0.5em;background-color: #f8fbff;} .box_program > dt { font-weight: 500; color:#6446c1;} .box_program > dd { margin: 0;letter-spacing: -.015em;} .box_program > dd + dt {margin-top: 10px} .box_program > dd.ex { font-weight: 400; color:#a4a6a9; font-size: .87em ; line-height: 1.3em; margin-top: 2px} .box_program > dd.ex2 { font-weight: 400; color:#777; font-size: .87em ; line-height: 1.3em; margin-top: 6px; border-top: 1px dotted #ddd; padding-top: 10px;} .box_program > dd.point { font-weight: 400; color:#8a0a9f; font-size: .87em ; line-height: 1.3em; margin-top: 2px} .box_program > dd.cont {line-height: 1.4;margin: .4em 0 0;display: flex;align-items: flex-start;} .box_program > dd strong {display: block;margin: 2px 5px 0 0;border: 1px solid #6446c1;color: #6446c1;border-radius: 10px;padding: 0 5px;font-size: .85em;min-width: 40px;text-align: center;} .box_program > dd ul { display: table; width: 100%} .box_program > dd ul li {padding:0 0 5px 0} .box_program > dd ul li strong { display: table-cell; padding-right: 5px; min-width: 30px} .box_program > dd ul li span {display: table-cell} /* 프로그램구성 추가.2024.07.30 */ .box_img {} .box_line { border:1px solid #eee; margin-bottom:.5em} .viewPrice dt {font-size:1.125em; font-weight: 500; border-bottom: 1px solid #000; padding-bottom: 10px; margin-bottom: 10px} .viewPrice dt:after {content: '*VAT별도';font-size: 12px; display: inline-block; float: right;color: #999;line-height: 1.7;} .viewPrice dt.no_vat:after { display: none} .viewPrice dd { margin-bottom: 2em} .viewPrice .btn_area {padding: 0 30px 2em;} .viewPrice .btn_area button {border: 1px solid;} .priceList_sort > li { border-bottom: 1px solid #eee; padding: 13px 0 ; position: relative; overflow: hidden; clear: both; display: flex; justify-content: space-between} .priceList_sort > li > input[type="checkbox"] { visibility: hidden; display: none;} .priceList_sort > li > label { display: block; position: relative; cursor: pointer;padding-left: 35px;margin: 0;line-height: 20px;transition: color .3s ease-out;/* float: left; width:calc(100% - 3.5em);*/} .priceList_sort > li > label:before { content: "\e60d";font-family: 'themify'; font-size: 14px; position: absolute;top: 0px;left: 0;display: inline-block;width: 25px;height: 25px; line-height: 25px; border-radius: 3px;background-color: #fff;border: 1px solid #ccc; text-align: center; color: #a2a2a2} .priceList_sort > li > input[type="checkbox"]:checked ~ label:before {color: #fff;background-color: #18abc1;border: 1px solid #18abc1;} .priceList_sort > li div.price_tit { font-size: 0.935em} .priceList_sort > li div.price_tit > p {font-size: .852em;color: #55afbd;line-height: 1.2;padding-top: 3px;} .priceList_sort > li div.item_price {min-width: 3.9em; height: 100%; line-height: 1.2; text-align: right;float: left; font-family: "Lato",'Noto Sans KR',"Apple SD Gothic","dotum",Tahoma, sans-serif; color: #777} .priceList_sort > li div.item_price span.price_price { display:block;vertical-align: middle} .priceList_sort > li div.item_price .price_eprice {font-weight: 600; color: #fe8502; font-size: 1.063em} .priceList_sort > li div.item_price .price_ex { display: block;font-size: 13px; color: #757575;opacity: 0.7;font-family: pretendard, sans-serif; } .priceList_sort > li div.item_price .price_ex > span:first-child { text-decoration: line-through} .priceList_sort > li div.item_price .price_ex > span.discount {display: inline-block; font-weight: 700; letter-spacing: -0.1em;} .priceList_sort.event_sort > li {min-height: 56px} .picSet { overflow: hidden; clear: both; display: flex;} .picSet p { position: relative; overflow: hidden; float: left; margin: 0 } .picSet p + p {margin-left: 10px} .picSet p:after { content: ""; position: absolute; right: 10px; top: 10px; background:url("/images/common/ci.svg") no-repeat 50% 50%; background-size: 100%; width: 30px; height: 30px} .picSet p span { font-size: 13px; color: #fff; position: absolute; left: 10px; bottom: 10px; letter-spacing: -0.03em;} .picSet p i { font-size: .825em; color: #444; text-align: center; letter-spacing: -0.03em; display: block; padding: 3px 0; background-color: #f5f5f7;font-style: normal} dd > .box-qna{border-top:none;padding: 0;} dd > .box-qna > li .answer {margin-left: 0px;} dd > .box-qna > li .answer > b:first-child { display: none} @media only screen and (max-width: 768px){ .picSet {display: block;} .picSet p { float: none;margin: 0 0 15px 0;} .picSet p + p {margin-left: 0px;} .picSet p:last-child {margin-bottom: 0} .viewCont .view_list .icoList > li i {width: 70px;height: 70px;line-height: 70px;} .viewCont .view_list .icoList > li { font-size: 13px} } /* @media only screen and (min-width: 2000px){ .viewSubTit, .viewCont { padding-right: 550px;} .viewPrice{width: 500px;} .viewPrice .viewPriceBox { width: 500px;} .viewCont .view_img p { font-size: 1em;} }*/ @media only screen and (max-width: 1600px){ .viewCont .view_img p {font-size: 1.15em;} } @media only screen and (max-width: 1500px){ .viewSubTit h3 {font-size: 1.4em;} .viewSubTit, .viewCont { padding-right: 380px;} .viewPrice{width: 350px;} .viewPrice .viewPriceBox { width: 350px;} .viewCont .priceList > li .price_tit { font-size: 1.15em;} .viewCont .priceList > li .price_cont {font-size: 0.9375em} .viewCont .priceList > li .price_price {font-size: 1.15em} .viewCont .priceList.viewLink > li {padding-right: 40px;} .viewCont .priceList.viewLink > li:after { right: 15px;} .viewCont .priceList.viewLink > li:hover:after { right: 5px;} .viewCont .view_img:before { background-position: 50% 15%; background-size: auto 35%} .viewCont .view_img p { font-size: 1em; } .viewCont .view_img p strong {font-size: 1.6em; margin-top: 0} .prodList { padding: 0 20px; } } @media only screen and (max-width: 1200px){ body.sub-content .page-price-view section.sub-page{ padding-top: 0em;} .viewSubTit,.viewCont { padding-right:0} .viewCont .view_list > dt{ font-size: 1.15em; } .viewSubTit h3 { padding-right:80px ;} .event_cont .viewSubTit h3 { padding-right:0px } .viewSubTit a.kakaoShare { display:block} .viewSubTit .location {right: 0px; display:none} .viewPrice{float:none; width:inherit; margin-bottom: 2em} .viewPrice .viewPriceBox { width:inherit;height:inherit;position: relative;padding: 0; background: none } .viewPrice .viewPriceBox.fixed { position: relative; top:inherit;} .viewPrice .viewPriceBox.fixed.bottom {height: 100%} .prodList { padding: 0; margin-bottom: 0} /*.viewPrice dt {padding: 10px;border-top: 1px solid #000;margin-bottom: 0px;} .viewPrice dd {padding: 0 10px;margin-bottom: 1em;}*/ .prodList dl { margin-bottom: 0} .viewPrice dt { padding: 8px 0; border-top: 1px solid #000; font-size: 1em; margin-bottom: 0} .viewPrice dd { margin-bottom: 0em;} .viewPrice .btn_area {padding:0; background-color: #fff; position: fixed; left: 0; bottom: 0; width: 100%; z-index: 6500; } .viewPrice .btn_area button {background-color: #18abc1; border-color:#0aa2b9; border-radius: 0; font-weight: 700; font-size:16px; padding: 0; line-height: 50px; margin: 0} .viewPrice .btn_area button:hover,.viewPrice .btn_area button:focus, .viewPrice .btn_area button:active {background-color: #0aa2b9 !important; border-color:#07899c !important} .priceList_sort.event_sort > li {min-height: inherit;padding: 10px 0;} .priceList_sort > li > label:before {top: -3px;} .priceList_sort > li div.item_price del.price_ex { font-size: 12px; } .viewCont .view_list h4:before{top: 5px;} /**/ .viewPrice.viewEventPrice {position: fixed; left: 0; bottom: 51px; width: 100%; z-index: 6500; padding-bottom: 52px; margin-bottom: 0 ;} .viewPrice.viewEventPrice .prodScroll .prodList { display: none} .viewPrice.on {padding-top: 20px; border-top: 1px solid #000} .viewPrice.on .prodScroll .prodList { display: block} .viewCont .view_img p { font-size: 1.2em; width: 80%;left: 10%;} .viewCont .view_img p strong { margin-top: .3em} } @media only screen and (max-width: 990px){ .viewCont .view_img p {font-size: 1em;} .viewCont .view_img p strong { margin-top: .2em} } @media only screen and (max-width: 576px){ body.sub-content .page-price .container.content_view {padding-top: 2em;} .viewCont {position: relative; left: -15px; width: calc( 100% + 30px );} .viewPrice dt {padding: 8px 10px;font-size: 1em;} .viewPrice dt:after {font-size: 10px;margin-top: 2px;} .viewCont .view_img + .view_list, .viewCont .view_video + .view_list{margin-top: 0;border-top:none} .viewCont .view_list { border-top: 15px solid #f2f2f2; border-bottom: 1px solid #ddd; margin-top: 0;margin-bottom: 0;} .viewCont .view_list > dt{ padding: 13px 15px 0 15px; font-size: 1.063em; border-top: 1px solid #ddd;border-bottom: none;} .viewCont .view_list > dt i { float: none; display: block; margin-top: 3px; font-size: 11px; letter-spacing: -1px} .viewCont .view_list > dd{ margin-right: 15px; margin-left: 15px;} .viewCont .view_list > dd.subject {font-size: 1.05em;} .viewCont .view_img p { font-size: 1em; } .viewCont .view_img p strong { margin-top: 0em} } @media only screen and (max-width: 450px){ .viewSubTit h3 {font-size: 1.3em;margin-bottom: .5em;} .viewSubTit p {font-size: 12px;} /*.viewPrice{ padding-bottom: 47px;} .viewPrice .prodList {height: 158px;}*/ .viewPrice dt {bottom: 205px;} .viewPrice .btn_area button {line-height: 45px;} .viewCont .view_img p { font-size: .85em; } } /* ** 시술상세 - 하단 셀렉트박스 **/ .selectList { position: fixed; bottom: 0; left: 0; width: 100%; padding: 0;min-height: 55px; background: #f8f8f8; border-top: 1px solid #888; cursor: pointer; z-index: 6100;} /*.selectList::before {content: ''; position: absolute; top: -15px; left: 50%; transform: translateX(-50%); width: 105px; height: 15px; background: url("/images/common/btn_bg.png") no-repeat 50% 0; background-size: auto 15px} .selectList::after {content: ''; position: absolute; top: -15px; left: 50%; transform: translateX(-50%) rotate(180deg); width: 32px; height: 19px; background: url("/images/common/i_price2.png") no-repeat 50% 50%;background-size: auto 10px} .selectList.action::after {transform: translateX(-50%) rotate(0);} */ .selectList_upBtn { display: block;position: absolute; top: -24px; left: 50%; transform: translateX(-50%); width: 255px; height: 25px; background: url("/images/common/btn_bg2.png") no-repeat 50% 0; background-size: auto 25px; text-align: center} .selectList_upBtn:after {content: ''; display: inline-block; transform: translateX(-50%) rotate(180deg); width: 30px; height: 19px; background: url("/images/common/i_price3.png") no-repeat 50% 50%;background-size: auto 8px; position: relative; left: 10px; top:4px} .selectList_upBtn:before {content: '시술선택'; display: inline-block;font-size: 13px; color: #555;font-weight: 500;} .selectList.action .selectList_upBtn:after{transform: translateX(-50%) rotate(0);} .selectList.action .selectList_upBtn:before {content: '닫기'; } .selectList > div { display: none} .selectList > div.selectListBtn { display: block} .selectTit{margin: 5px 0 0px; padding: 7px 5px; overflow: hidden; border: 1px solid #ff9107; background: #fff url("/images/common/i_arrow_event.png") no-repeat 100% 50%; cursor: pointer;} .selectBox {display:none; position:absolute; width: 100%; max-height: 120px; border-width: 0 1px 1px; border-style: solid; border-color: #ff9107; background: #fff; box-sizing: border-box; overflow: auto;} .selectBox li {position:relative; padding: 7px 10px; border-top: 1px solid #ddd; cursor: pointer; font-size:0.9375em } .selectBox li:first-child {border-top: none;} .selectBoxTit{padding:0 100px 0 0;} .selectBoxPrice{position:absolute; top:50%; right:20px; width:100px; text-align:right; transform:translateY(-50%); background:#fff;} .selectBoxPrice span{font-size:inherit; color:#ff162c; margin-right:4px;} .selectListBtn {margin:0; } .selectListBtn div {position: absolute; bottom:5px; left:5px; padding:0; border-radius:5px;line-height:40px; text-align: center;cursor: pointer;font-size:1em; font-weight: 400;} .selectListBtn div.sBtn1, .selectListBtn div.sBtn2 {width: calc(100% - 10px);} .selectListBtn div.sBtn3, .selectListBtn div.sBtn4 {width: calc(50% - 10px);} .selectListBtn div.sBtn1, .selectListBtn div.sBtn3 {left:5px;} .selectListBtn div.sBtn1, .selectListBtn div.sBtn3 {color: #000; background: #fff; border: 1px solid #d5d5d5;} .selectListBtn div.sBtn2, .selectListBtn div.sBtn4 { left: 50%; color: #fff; background: #18abc1; border: 1px solid #17a2b8;} .selectListBtn div.sBtn3, .selectListBtn div.sBtn4{display:none;} .selectListChk ul {overflow:hidden; padding: 1px 0px;} .selectListChk ul li {float:left; width: calc(50% - 20px);font-size: 14px} .selectListChk ul li:first-child {width: calc(50% + 20px);} .on.selectListBox .selectBox{display:block; z-index:40;} .on .selectTit::before{transition: transform .5s;transform: rotate(180deg);} .action.selectList { padding: 20px 5px 60px 5px; min-height: 320px;bottom: 51px;} .action .selectListArrow::before{transition: transform .5s;transform:translate(-50%, 0) rotate(0deg);} .action .selectListBtn{} .action .selectListBtn .sBtn1, .action .selectListBtn .sBtn2{display:block;} .action .selectListBtn .sBtn3, .action .selectListBtn .sBtn4{display:none;} .action .selectListTit{display:block; margin:10px 0 0; font-weight: 500} .action .selectListTit span { font-size: 11px; color: #888; float: right;font-weight: 300} .action .selectListBox{display:block; position:relative;} .action .selectListChk{display:block;} .action .selectListChk input[type="checkbox"].option-input{top: 0px;} .action .selMoList {display:block; min-height: 105px; margin-top: 10px} .action .selMoList > div:first-child{margin-top: 0px;} .action .selMoItem {overflow: hidden; margin-top: 5px;} .action .selMoItem .selMoItemTit {float:left; width: calc(100% - 45px); padding: 7px 5px; border: 1px solid #ddd; background: #fff;} .action .selMoItem .selMoItemTit > span {} .action .selMoItem .selMoItemDT {float:left; width:calc(100% - 80px);} .action .selMoItem .selMoItemPrice {float: right; color: #ff9107; font-weight: 500} .action .selMoItem .selMoItemPrice::after{content:'원'; color: #333; margin-left: 3px;font-weight: 300; font-size: 0.875em} .action .selMoItem .selMoItemDel {float:right; width:41px; height:41px; background: #fff; border: 1px solid #ddd; text-align: center} .action .selMoItem .selMoItemDel:before {content:"\e646"; font-family: 'themify'; line-height: 40px} @media only screen and (max-width: 768px){ .action.selectList {padding: 15px 5px 50px 5px;min-height: 300px;} .selectTit {padding: 8px;font-size: 13px;} .selectBox{max-height: 115px;} .selectBox li {font-size: 13px;padding: 5px 10px;} .selectBoxTit { padding: 0 80px 0 0;} .selectBoxPrice { right: 10px;width: 75px;} .action .selMoItem .selMoItemTit { padding: 5px 10px; line-height: 23px; width: calc(100% - 40px);} .action .selMoItem .selMoItemDT {font-size: 13px;} .action .selMoItem .selMoItemDel { width: 35px;height: 35px;} .action .selMoItem .selMoItemDel:before {line-height: 35px} .selectListBtn div {line-height: 43px; font-size: 14px} } @media only screen and (max-width: 450px){ .action.selectList {padding: 15px 5px 50px 5px;} } @media only screen and (max-width: 320px){ .selectListChk ul li {float:none; width: 100% !important; font-size: 13px; } } /* ** 시술설명 **/ .process { position: relative; padding: 10px 5px;} .process .step_list:after { content: ""; height: 55px; border-bottom: 1px solid #ccc; display: block; left: 5px; position: relative} .process .step_list { display: table; width: 100%} .process .step_list > li {position: relative; display: table-cell;} .process .step_list > li, .process .time_txt { width: 90px; height: 90px; vertical-align: middle; text-align: center; line-height: 1.2;font-size: .95em; } .process .step_list > li:after { content: ""; display: block; width:100px;height: 100px; position: absolute; left: -5px; top:-5px; border-radius: 50%;border: 1px solid #ccc;} .process .time_txt { width: 100px; height: 100px; background-color:#888; color: #fff; position: absolute; right: 0; top:5px;border-radius: 50%;} .process .time_txt::before{content: "\e6c6"; display: block; text-align: center; font-family: 'themify'; font-size: 1.6em; padding: 20px 0 5px} .dot-list > li { padding-left: 20px} .dot-list > li::before {width: 5px; height: 5px; background: #18abc1; border-radius: 50%; left: 5px} .check-list > li {padding-left: 20px;} ol.numList { list-style: decimal; padding-left:20px;} ol.numList > li{ padding-left:0; margin-bottom: 10px} ol.num-list > li { position: relative;margin-bottom: 8px ; color:#696969; text-align: left !important;min-height: 21px;padding: 0px 0 0 25px;} ol.num-list > li:before {content: "1";color: #18abc1;font-weight:700;text-align: center;width: 20px;position: absolute;left: 0;top:0;} li::marker{ font-size: 0;color: transparent;} ol.num-list > li:first-child:before{content: "01";} ol.num-list > li:nth-child(2):before {content: "02";} ol.num-list > li:nth-child(3):before {content: "03";} ol.num-list > li:nth-child(4):before {content: "04";} ol.num-list > li:nth-child(5):before {content: "05";} ol.num-list > li:nth-child(6):before {content: "06";} ol.num-list > li:nth-child(7):before {content: "07";} ol.num-list > li:nth-child(8):before {content: "08";} ol.num-list > li:nth-child(9):before {content: "09";} ol.num-list > li:nth-child(10):before {content: "10";} ol.num-list > li:nth-child(11):before {content: "11";} ol.num-list > li:nth-child(12):before {content: "12";} ol.num-list > li:nth-child(13):before {content: "13";} ol.num-list > li:nth-child(14):before {content: "14";} @media only screen and (max-width: 1350px){ .process .step_list > li{ width: 80px; height: 80px; } .process .step_list > li:after {width: 90px; height: 90px;} .process .time_txt { width: 90px; height: 90px; } .process .step_list:after { height: 40px; } .process .time_txt:before{font-size: 25px; padding: 15px 0 5px} } @media only screen and (max-width:768px){ .process { padding-top: 100px} .process .step_list { width: inherit; margin: 0 auto; display: block; text-align: center} .process .step_list > li{ width: inherit; height:inherit; font-size: 14px;display: inline-block; padding:0 } .process .step_list > li br, .process .step_list > li:after { display: none} .process .step_list > li:before {width: inherit; height: inherit;display: inline-block; border: none; content: "→"; left: inherit; top:inherit; position: relative; padding: 0 5px; color: #9B9B9B} .process .step_list > li:first-child:before { display: none} .process .time_txt { width: 80px; height: 80px; } .process .step_list:after { display: none} .process .time_txt{right: 50%;margin-right: -35px;} } @media only screen and (max-width: 320px){ .viewCont .view_list > dd.process { padding-top: 90px; margin-right: 5px; margin-left: 5px;} .process .step_list > li{ font-size: 12px } .process .time_txt {width: 70px; height: 70px;font-size: 12px} .process .time_txt:before {padding: 10px 0 3px; } } /* 이벤트가격 - 보기 */ .price_price span, .price_eprice span { font-size: .8em; font-weight: 400} .content_view > h4 {line-height: 1.5rem;font-weight:500; color:#111;} .content_view > h4 small {font-size: 80%; color:#777; font-weight:400} .content_view > h4 i { border:1px solid #18abc1; border-radius:50%; text-align:center; width:25px; height:25px; line-height:23px; display:inline-block; margin-right: 5px;vertical-align: middle;color: #18abc1;background-color: #fff; font-size: .852em;position: relative; top: -2px;} .event_cont {clear: both; margin-top: 2em;} .event_cont .viewSubTit h3 { border-top: 1px solid #ccc} .event_cont .priceList { margin-top: 1em} .priceList.priceListBtn > li { padding-top: 2rem; padding-bottom: 3.7rem;height:auto; overflow: hidden} .priceList.priceListBtn > li .price_price { color: #333; } .priceList.priceListBtn > li .btn_box { position: absolute; left: 0; bottom: 0; width: 100%; } .priceList.priceListBtn > li .price_box { align-self: auto;} .priceList.priceListBtn > li .btn_box .btn-sm { float: left; width: 50%; border: none; background-color: #f9f9f9; border-radius: 0;font-weight: 700;line-height: 2rem; color: #777} .priceList.priceListBtn > li .btn_box .btn-sm:last-child { border-left: 1px solid #eee; color: #fd7e27;} .priceList.priceListBtn > li .badge-cont { position: absolute; margin-bottom:0; top:0; height: 5px} .priceList.priceListBtn > li .badge-cont .badge {border-radius: 0px;} .content_view > div.event_cont:first-child {margin-top: 0em !important;} .content_view > div.event_cont:first-child .viewSubTit h3 {padding-top: 0; border-top:none} /* priceSingle - 20200629 */ .priceSingle .priceList.priceListBtn > li {width: 100% !important;margin-left: 0 !important;padding-right:100px ;padding-top:1.5rem;} .priceSingle .priceList.priceListBtn > li .price_price { position: absolute; right: 20px; top:1.5rem} .priceSingle .priceList.priceListBtn > li .price_ex { position: absolute; right: 20px; top:2.5rem} @media only screen and (max-width: 1800px){ .event_cont .priceList > li {width:49%;margin-left:2%; } .event_cont .priceList > li:nth-child(3n+1) {margin-left:2%;} .event_cont .priceList > li:nth-child(2n+1) {margin-left:0%;} } @media only screen and (max-width: 1200px){ body.event-content .quickmenu {} body.event-content .viewPrice { position: fixed;z-index: 6000;left:0;bottom: 0;width: 100%;background-color: #1f1f1f; display: none} .priceList.priceListBtn > li {/*height: 180px;*/padding-top: 1.5rem;padding-bottom: 3rem;} } @media only screen and (max-width: 740px){ .priceList.priceListBtn > li {padding-top: 1rem;padding-bottom: 3rem;} .priceList.priceListBtn > li .badge-cont { position: relative; top:-5px; height: inherit;} .priceList.priceListBtn > li .badge-cont:empty { display: none} .priceList.priceListBtn > li .btn_box .btn-sm {line-height: 1.6rem;font-size: 13px;} .event_cont .priceList > li:nth-child(3n+1) {margin-left:0% !important;} } @media only screen and (max-width: 576px){ .event_cont .priceList { padding-right: 15px; padding-left: 15px} .event_cont + .event_cont .viewSubTit {position: relative;left: -15px;width: calc( 100% + 30px );border-top: 15px solid #f2f2f2;padding: 0.7em 1em;} .event_cont + .event_cont .viewSubTit h3, .event_cont + .event_cont .viewSubTit p {} } /* 예약변경/취소 */ .aC_mess { font-weight: 300;font-size: 0.875rem; line-height: 1.4; letter-spacing: -0.03em; overflow: hidden; margin-bottom: 1.5rem !important;} .line-list > li {font-size: 1em;padding-left: 15px;text-indent: -10px;margin-bottom: 3px;} .aC_phoneBox { position: relative} .aC_phoneBox .btn{ position: absolute; right: 0; top:0; width: 110px; border-radius:0 0.25rem 0.25rem 0; padding-left: 0; padding-right: 0; text-align: center; font-size: 0.875em; background-color: #eee !important; border-color: #3a3a3b #3a3a3b #3a3a3b #ccc !important} .aC_phoneBox .btn:hover, .aC_phoneBox .btn:focus {background-color: #9DA2A7 !important; border-color: #3a3a3b #3a3a3b #3a3a3b #9DA2A7; color: #fff !important} .Reservation-form .required { margin-left:0} .aC_cBcount { font-size:0.9375em; position: relative; top:-.5rem; display: table; width: 100%} .aC_text { font-size: 13px; padding:0;color: #ffc107; font-weight: 300; line-height: 1.3 ;} .aC_text p { margin-bottom: 10px} .aC_numBox { position: relative} .aC_numBox input { padding-right: 50px} .aC_numBox .aC_timer{ width: 50px; text-align: center; color: #ff5845; position: absolute; right: 0; top:0; height: calc(1.5em + 1.25rem + 3px);padding: 0.4375rem 0; font-size: 0.875rem; line-height: 1.75rem; font-weight: 500} @media only screen and (max-width: 740px){ .aC_phoneBox .btn { width: 85px;} .aC_mess { border-radius: 5px; background-color:rgba(0,0,0,.5); padding: 1.2em .8em 1.2em .7em;margin-bottom: 1.2rem !important; font-size: 13px } } /* 고객의견 */ .type_check > li { float: left; margin-right: 15px; margin-bottom: 10px} /* 장바구니 */ body.sub-content .page-cart section.sub-title {padding-bottom: 6rem;} body.sub-content .page-cart .sub-page { padding-top: 0px} @media only screen and (max-width: 900px){ body.sub-content .page-cart section.sub-title {padding-bottom: 3rem;} } /* 예약확인 */ body.sub-content .page-reserve section.sub-title {padding-bottom: 6rem;} body.sub-content .page-reserve .sub-page { } @media only screen and (max-width: 900px){ body.sub-content .page-reserve section.sub-title {padding-bottom: 3rem;} } /* ** CART **/ .cartLoad {opacity:0; position: fixed; top: calc(50% - 125px);; left:calc(50% - 125px); width:250px; height:250px; z-index:-1;} .cartLoad.on{opacity:1; -webkit-animation: loadCart 1.5s ease-in-out both; animation: loadCart 1.5s ease-in-out both; z-index:500;} .cartLoad img {width:100%;} @media only screen and (max-width: 764px){ .cartLoad {top: calc(50% - 75px); left:calc(50% - 75px);; width:150px; height:150px;} } /* gnb_area */ .gnb_area {position: fixed;left: 0;top: 10px;width: 100%;/*background-color:rgb(0 0 0 / 40%);*/height: 35px;padding: 0 7rem;font-size: 13px; z-index: 9998;} body.sub-content .site-header, body.sub-content .gnb_area{position: absolute;} .gnb_area_wrap { float: right; } .gnb_area .right { position: relative; float: right;display: inline-flex; align-items: center;} .btn_cart_top, .btn_login {position: relative;font-size: 90%;color: #7B7B7B; overflow: visible; margin: 0; padding: .45rem .6rem; background: none; font-weight: 400; line-height: 1.5; border-width: 1px; border-style: solid; border-color: transparent; text-align: center; white-space: nowrap; cursor: pointer; outline: none; } .ico_member {display: inline-block;width: 16px;height: 16px;margin-right: 3px;padding: 0;font-size: 10px;position: relative;top: -2px;} .btn_login{color: #ccc !important;} .btn_cart_top:after, .btn_login:after{ content: '';position: absolute;top: 50%;width: 1px;height: 1em;margin-top: -0.4em;background-color:rgb(255 255 255 / 10%); right: -0.5px;} .cart_txt { display: inline-block; padding-right: 1.2rem;color: #ccc; margin-right: 3px;} .btn_cart_top .edge { position: absolute; padding: 1px 5px; border: 2px solid #ff9107; border-radius: 50em; font-size: 8.5pt; line-height: 1em; background-color: #ff9107; color: #fff;bottom: 7px; right: 0.75em;} .network_menu {position:relative; min-width:155px;display: inline-block;} .network_menu > a {display:block; position:relative; padding-left:10px; padding-right:25px;color:#ccc !important; line-height:35px; text-decoration: none !important} .network_menu > a i {position:absolute; top:0%; right:0; width:20px; line-height: 35px;color:#ccc} .network_menu.on > a { background-color: #000} .network_menu ul {display:none; position:absolute; top:35px; left:0; width:100%; padding:5px 0; font-size:13px; color:#666; line-height:25px; background:rgb(0 0 0 / 80%);} .network_menu ul a, .network_menu ul span {display:block; padding-left:15px;color: #999;} .lang_menu {position:relative;display: inline-block;z-index: 999;} .lang_menu button { border: none;background: transparent; } .lang_menu > button {display:block; font-size:12px; color:#ccc !important; text-decoration: none !important;display: flex; align-items: center; gap:5px} .lang_menu > button span:last-child { display: none} .lang_menu li button { text-decoration: none; display: flex; align-items: center; gap:5px} .lang_menu li button:hover { color: #000; text-decoration: underline;} .lang_menu button > span:first-child { width: 18px; height: 18px; border: 1px solid #ddd; display: inline-block;border-radius: 5px;line-height: 1;text-indent: -9999px;} .lang_menu button span.ico_kr { background:#fff url("/images/common/lang_ko.png") no-repeat 50% 50%; background-size: 90%; } .lang_menu button span.ico_jp { background:#fff url("/images/common/lang_jp.svg") no-repeat 50% 50%; background-size: 100%; } .lang_menu button span.ico_ch { background:#f42525 url("/images/common/lang_ch.svg") no-repeat 0 50% ;background-size: cover;} .lang_menu button span.ico_tai { background:#f42525 url("/images/common/lang_taiwan.svg") no-repeat 0 50% ;background-size:cover;} .lang_menu button span.ico_en { background:#fff url("/images/common/lang_en.svg") no-repeat 0 50% ;background-size: cover;} .lang_menu ul {display:none; position:absolute; top:30px; right: 0; min-width: 120px; padding: 10px;font-size:13px; color:#666; line-height:25px; background:#fff; border-radius: 6px; border: 1px solid #33333317;} .lang_menu ul li {} .lang_menu.on ul {display:block; } body.ui-dark .lang_menu > button {color: #666 !important;} @media (min-width: 1200px){ .site-header {padding-top: 3rem;} body.ui-dark .site-header {padding-top: 2.5rem;color: #666;} body.ui-dark .gnb_area { /*border-bottom: 1px solid #eee*/} body.ui-dark .gnb_area .cart_txt, body.ui-dark .gnb_area .btn_cart_top, body.ui-dark .gnb_area .btn_login, body.ui-dark .gnb_area .network_menu > a {color: #666 !important; font-weight: 500 } body.ui-dark .gnb_area .btn_cart_top:after, body.ui-dark .gnb_area .btn_login:after {background-color: rgb(0 0 0 / 10%);} body.ui-dark .gnb_area .network_menu > a i {color: #878484;} body.ui-dark .gnb_area .network_menu.on > a { background-color:transparent} body.ui-dark .gnb_area .network_menu ul {display:none; top:34px;background:#fff; border: 1px solid #ddd; font-size:12px;font-weight: 500} body.ui-dark .gnb_area .network_menu ul a, body.ui-dark .gnb_area .network_menu ul span {padding-left:15px;color: #333;} } .btn_cart { display: none;} @media only screen and (max-width: 1200px){ .gnb_area { display: none} .btn_cart { display: block;} } /*doctor-schdule-wrapper */ .doctor-schdule-wrapper {border-top: 2px solid #000;} .doctor-schdule-wrapper > p { text-align: center; margin: 1em} .doctor-schdule-area { position: relative; padding-left: 225px; border-bottom: 1px solid #666; } .doctor-schdule-area .doctor-information { position: absolute; top: 0; left: 0; width: 215px; padding: 10px; text-align: center; } .doctor-information:after { content: ""; clear: both; display: block; } .doctor-information .picR { width: 120px; height: 120px; margin: 0 auto 5px; overflow: hidden; border-radius: 50%; position: relative; } .doctor-information .picR img { max-width: 100%} .doctor-information p { color: #999999; font-weight: 300; font-size: .9em; line-height: 22px; } .doctor-information p strong { color: #363636; font-weight: 600; font-size: 1.3em; } .circle { color: #18abc1; font-size: 1.2em; display: block;font-weight: 700; } .table-schadule01 { border-left: 1px solid #c2c2c2 } .table-schadule01 table { border-collapse: collapse; } .table-schadule01 table thead th { text-align: center; height: 57px; line-height: 57px; border-bottom: 1px solid #c6c6c7; border-left: 1px solid #c6c6c7; font-size: 1em; color: #4a4a4a; background-color: #f0f0f5; } .table-schadule01 table thead th:first-child { border-left: 0; } .table-schadule01 table tbody th { text-align: center; vertical-align: middle; height: 57px; border-top: 1px solid #c2c2c2; background: #f0f0f5; font-size: 13px; color: #4a4a4a; font-weight: 400; line-height: 1.5; } .table-schadule01 table tbody td { text-align: center; vertical-align: middle; height: 42px; color: #767676; border-top: 1px solid #c2c2c2; border-left: 1px solid #c6c6c7; font-size: .75em;font-weight: 500; line-height: 1.5; } .table-schadule01 table tbody td.off {background: #fbececd4 url("/images/common/bg_off_pc.svg") no-repeat 50% 50%; background-size: cover} @media only screen and (max-width: 1024px){ .table-schadule01 table tbody td.off {background: #fbececd4 url("/images/common/bg_off.svg") no-repeat 50% 50%; background-size: cover} } @media only screen and (max-width: 768px){ .doctor-schdule-area {padding-left: 100px;} .doctor-schdule-area .doctor-information { width: 100px;} .doctor-information .picR {width: 75px; height: 75px;;} .doctor-information p strong {display: block;} .table-schadule01 table thead th {height: 45px;line-height: 45px;} .table-schadule01 table tbody th {height: 45px;} .doctor-information p {line-height: 1.3em;} } .icoList {} .icoList > li {padding: 0 10px 10px 100px; position: relative; min-height: 90px} .icoList > li strong { color: #18abc1} .icoList > li i { display: block; width: 80px; height: 80px; text-align: center; position: absolute; left:0; top:10 ;line-height: 1.4;} .col_blue { color: #17a2b8;} strong {font-family: 'Lato','Noto Sans KR','Apple SD Gothic','dotum',Tahoma, sans-serif; font-weight: 500} @media only screen and (max-width: 640px) { .icoList > li {float: none; width: 100%; padding-right: 0} }