/* ===== @import 는 규칙보다 앞에 와야 유효하다 (번들 최상단으로 승격) ===== */ @import url('/assets/img/youlbit/swf/css/base.css'); @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css'); @import url('https://webfontworld.github.io/pretendard/Pretendard.css'); @import url('https://fonts.googleapis.com/css2?family=Black+Han+Sans&family=Marcellus&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200..900&display=swap'); @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css'); @import url('/assets/img/youlbit/swf/css/font.css'); /* ===== /assets/inc/main.css ===== */ * {margin: 0; padding: 0;} html {width: 100%; min-width: 320px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif;} body {margin: 0; padding: 0; font-size: 100%; text-align: center; background: #FFFFFF; SCROLLBAR-FACE-color: #cfcfcf; SCROLLBAR-SHADOW-color: #595959; SCROLLBAR-3DLIGHT-color: #595959; SCROLLBAR-ARROW-color: #ffffff; SCROLLBAR-DARKSHADOW-color: #ffffff; SCROLLBAR-BASE-color: #cfcfcf; } body.no_scroll {position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden;} img {margin: 0; padding: 0; border: 0; vertical-align: top;} a {border: 0; font-size: 14px; text-decoration: none; color: #787878;} div {font-size: 14px;} nav {clear: both;} caption {display: none;} fieldset {border: 0;} ol, ul, li {margin: 0; padding: 0; list-style: none;} select, input {font-size: 1.00em; line-height: 150%; color: #000000;} address {line-height: 180%; font-style: normal;} address strong {font-weight: bold;} em {font-style: normal;} button {border: none; background: none; cursor: pointer;} hr, legend {display: none;} h1, h2, h3, h4, h5, h6 {margin: 0; padding: 0; font-size: 14px; font-weight: normal;} p, form, input, ul, li, dl, dt, dd {margin: 0; padding: 0;} th, td, textarea {font-size: 14px; line-height: 180%;} canvas, summary {display: block;} #content_wrap_main {position: relative; width: 370px; height: 570px; margin: 0 auto; padding: 38px 0 0 600px; text-align: left;} #footer_wrap {position: relative; width: 100%; height: 85px;} #topmenu {position: relative; width: 970px; height: 85px; margin: 0 auto; text-align: left;} #topmenu h1 {position: absolute; margin: 29px 0 0 10px;} #topmenu .global_menu {position: absolute; top: 14px; right: 0; padding-right: 30px; overflow: hidden;} #topmenu .global_menu a {margin-left: -1px; padding: 0 3px 0 6px;} #topmenu .main_menu {position: absolute; top: 29px; left: 214px; width: 727px; height: 56px; padding: 5px 0 0 29px; vertical-align: top;} #topmenu .main_menu a {display: inline-block; vertical-align: top;} #topmenu .main_menu .fst {width: 139px;} #topmenu .main_menu .snd {width: 186px;} #topmenu .main_menu .trd {width: 135px;} #topmenu .main_menu .fth {width: 143px;} #topmenu .main_menu .last {width: 74px;} #topmenu .sub_menu {position: absolute; top: 60px; left: 244px; height: 22px; padding: 0 11px 0 0; background: #2ba7dc;} #topmenu .sub_menu a {position: relative; display: inline-block; margin: 5px 0 0; padding: 0 0 0 9px; vertical-align: top;} #topmenu .company {top: 60px; left: 244px;} #topmenu .business {top: 60px; left: 384px;} #topmenu .products {top: 60px; left: 562px;} #topmenu .customer {top: 60px; left: 697px;} #topmenu .recruit {top: 60px; left: 765px;} .main_banner {width: 360px; height: 78px; margin: 27px 0 0;} .module_link {width: 360px; height: 131px; margin: 26px 0 0; padding: 18px 0 0;} .module_link ul {padding: 0 0 0 17px; list-style: none;} .module_link ul li {float: left; width: 85px; text-align: center;} .content_footer {position: relative; width: 970px; margin: 0 auto; text-align: left; vertical-align: top;} .content_footer .footer_logo {position: relative; top: 18px;} .content_footer .personal_link {position: relative; top: -22px; left: 149px;} .content_footer .address {position: relative; top: -11px; left: 149px;} .content_footer .family_site {position: absolute; right: 0; margin: -55px 0 0;} .content_footer .famliy_site_link {position: absolute; right: 0; width: 126px; margin: -33px 0 0; border: 1px solid #efefef;} .content_footer .famliy_site_link a {display: inline-block; width: 126px; text-decoration: none;} .content_footer .famliy_site_link a:hover {background: #efefef;} #wrap {position: relative; width: 100%; min-width: 320px; margin: 0 auto; text-align: left;} #bg_mask {position: fixed; top: 0; left: 0; z-index: 111111; display: block; width: 100%; height: 100%; background: #000; opacity: .6; filter: alpha(opacity='60');} #top_container_bg {position: absolute; z-index: 8001; width: 100%; margin: 0 auto;} #top_container {position: relative; width: 100%; max-width: 1120px; height: 40px; margin: 0 auto;} #logo {position: absolute; top: 20px; left: 20px; width: 165px; height: 60px; z-index: 9999;} #main_container {position: relative; width: 100%; margin: 0 auto; overflow: hidden;} #sub_container {position: relative; width: 100%; margin: 0 auto; overflow: hidden;} #head_top {width: 95%; margin: 0 auto; padding-bottom: 30px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 15px; font-weight: 400; line-height: 120%; letter-spacing: -1px; text-align: center; color: rgba(0, 0, 0, .6);} #head_title {position: absolute; top: 50%;left: 50%; z-index: 999; width: 400px; margin-top: -30px; margin-left: -200px; text-align: center; color: #fff;} #sub_container #head_title {position: absolute; top: 50%; left: 50%; z-index: 999; width: 400px; margin-top: -30px; margin-left: -200px; text-align: center; color: #fff;} #sub_container .head_1 {font-size: 12px; font-weight: 500;} #sub_container .head_2 {font-size: 35px; font-weight: 500;} .head_1 {font-family: 'Helvetica Neue', Arial, sans-serif, '나눔명조', Nanum Myeongjo, '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 15px; font-weight: 300; line-height: 120%; color: rgba(255, 255, 255, 0.8);} .head_2 {padding-top: 10px; padding-bottom: 5px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 50px; font-weight: 500; line-height: 120%; color: rgba(255, 255, 255, 1);} .head_2 span {font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-weight: 100; color: rgba(255, 255, 255, 1);} .head_3 {font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 15px; font-weight: 500; line-height: 120%; color: rgba(255, 255, 255, 0.8);} #mob_menu {display: none; cursor: pointer;} #menu {position: absolute; clear: both; z-index: 9000; width: 100%; height: 50px; padding-top: 20px; background: url('/assets/img/youlbit/top_bg.png') center top repeat-x; overflow: hidden;} #menu #menu_wrap {width: 100%; max-width: 1120px; margin: 0 auto;} #menu>#menu_wrap>ul {float: right; width: 100%; max-width: 830px;} #menu>#menu_wrap>ul:after {content: ""; clear: both; display: block;} #menu>#menu_wrap>ul>li {position: relative; float: left; width: 16.66%; padding-top: 0; padding-bottom: 20px;} #menu>#menu_wrap>ul>li>a {display: block; padding: 3px 0; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 17px; font-weight: 500; letter-spacing: -1px; text-align: center; text-decoration: none; color: rgba(255, 255, 255, 0.9);} #menu>#menu_wrap>ul>li>a.on {color: #000; background: #FEDA0C;} #menu>#menu_wrap>ul>li>a.mob {display: none;} #menu>#menu_wrap>ul>li>a.pc {display: block;} #menu ul li.main_menu {position: relative;} #menu ul li.main_menu ul {position: absolute; top: 50px; width: 100%; height: 100px;} #menu ul li ul li a {display: block; margin-left: 1px; padding: 5px 0; font-family: '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 13px; font-weight: 600; text-align: center; text-decoration: none; color: rgba(255, 255, 255, 0.8);} #menu ul li ul li a:hover {text-decoration: underline; color: rgba(255, 255, 255, 1);} #menu ul li a.pc .menu_line {display: block; width: 0; height: 1px; margin: 18px auto 0; background: #9C9C9C;} #menu #submenu_1, #menu #submenu_2, #menu #submenu_3, #menu #submenu_4, #menu #submenu_5, #menu #submenu_6 {width: 100%;} a.more_btn {display: block; width: 150px; margin: 20px auto; padding: 10px; font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif; font-size: 16px; font-weight: 700; text-align: center; color: #A5936F; border: 1px solid transparent; border-radius: 300px; background-color: white; transition: all 0.35s; -webkit-transition: all 0.35s; -moz-transition: all 0.35s; -o-transition: all 0.35s;} a.more_btn:hover {text-decoration: none; color: #222222;} a i.fa {color: #BCBCBC;} a:hover i.fa {color: #888888;} #sns_bottom {float: left;} #sns_bottom li {float: left; margin-right: 10px;} #mob_gnb {display: none; margin-top: 30px;} #mob_gnb ul {text-align: center; overflow: hidden;} #mob_gnb ul li {display: inline-block; width: 40%; list-style: none;} #mob_gnb ul li.end {background: none;} #mob_gnb ul li a {display: block; padding: 5px 10px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 13px; font-weight: 500; letter-spacing: -1px; text-align: center; text-decoration: none; border: 1px solid #B3B3B3; background: #333;} #mob_gnb ul li a:hover {color: #FFF; background: #767676;} #gnb {position: absolute; top: 5px; right: 10px; z-index: 9999;} #gnb ul {text-align: center; overflow: hidden;} #gnb ul li {display: inline-block; list-style: none;} #gnb ul li a {display: block; padding: 5px 10px; font-family: verdana, arial, helvetica, sans-serif; font-size: 9px; font-weight: bold; text-align: center; text-decoration: none; color: #B2B2B2; background: url('/assets/img/youlbit/bullet.gif') left center no-repeat;} #gnb ul li a:hover {color: #CBCBCB;} #main_quick {position: relative; display: flex; flex-direction: row; justify-content: space-between; align-items: center; flex-wrap: wrap; width: 100%; max-width: 1120px; margin: 0 auto; text-align: center; overflow: hidden;} #main_quick a {float: left; display: block; width: 33.3333%; line-height: 120%; transition: all ease .3s; -moz-transition: all ease .3s; -webkit-transition: all ease .3s; -o-transition: all ease .3s;} #main_quick div {padding-top: 30px; padding-bottom: 30px;} #main_quick .quick_01 {background: #209A9F;} #main_quick .quick_02 {background: #727272;} #main_quick .quick_03 {background: #209A9F;} #main_quick .quick_04 {background: #727272;} #main_quick .quick_05 {background: #209A9F;} #main_quick .quick_06 {background: #727272;} #main_quick h3 {margin: 15px auto; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 22px; color: rgba(255, 255, 255, 0.8);} #main_quick p {margin: 15px auto; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 14px; color: rgba(255, 255, 255, 0.5);} #main_quick a i.fa {color: rgba(255, 255, 255, 0.6);} #main_quick a:hover i.fa {color: #FFD800;} #main_quick_bg {position: relative; z-index: 10; width: 100%; margin: -40px auto 20px;} .h_line {display: block; width: 50px; height: 1px; margin: 0 auto 10px; background: #333;} #main_body {width: 100%; max-width: 1100px; margin: 20px auto 0; overflow: hidden;} #main_body_bg {width: 100%; padding-top: 40px; padding-bottom: 40px; background: #FFFFFF; overflow: hidden;} #main_left {float: left; width: 32%; overflow: hidden;} #main_right {float: right; width: 63%; overflow: hidden;} #notice {float: left; width: 100%;} #notice dt {margin-bottom: 10px; border-bottom: 1px solid #EBEBEB; overflow: hidden;} #contact_ban {float: left; width: 43%; margin-top: 10px; text-align: left;} #contact_ban dl {padding-top: 10px; padding-right: 30px;} #contact_ban dt {margin-bottom: 10px; font-size: 20px; font-weight: bold; color: #525252;} #contact_ban dd {font-size: 12px; font-weight: 400; color: #6D6D6D;} #contact_ban dd.talk_bg {margin-top: 5px; padding: 0 0 0 10px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 15px; font-weight: 500; color: #666666; background: #F7F7F7;} #contact_ban dd span.phone_no {margin-top: 10px; margin-bottom: 5px; font-size: 29px; font-weight: 700; letter-spacing: -0.025em; color: #525252;} #contact_ban dd span.bank_no {display: inline-block; margin-top: 8px; font-size: 16px; font-weight: 500; line-height: 100%; letter-spacing: -0.025em; color: #3B1F1B;} #qna {float: right; width: 52%;} #qna dt {margin-bottom: 10px; border-bottom: 1px solid #EBEBEB; overflow: hidden;} #main_contact {width: 100%; max-width: 1100px; margin: 10px auto; padding-top: 10px; padding-bottom: 35px; text-align: center;} #main_contact h2 {margin: 0 auto 10px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 35px; font-weight: 400; letter-spacing: -1px; color: #111;} #main_contact p {margin: 20px auto 10px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 15px; color: #858585;} #main_product_gallery {clear: both; width: 100%; max-width: 1100px; margin: 0 auto 30px; text-align: center;} #main_product_gallery p {margin: 20px auto 10px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 15px; font-weight: 400; color: rgba(255, 255, 255, 0.8);} #main_product_gallery dt {margin-bottom: 30px; border-bottom: 1px solid #EBEBEB; overflow: hidden;} #main_portfolio {clear: both; width: 100%; max-width: 1100px; margin: 0 auto 30px; text-align: center;} #main_portfolio p {margin: 20px auto 10px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 15px; font-weight: 400; color: rgba(255, 255, 255, 0.8);} #main_portfolio dt {margin-bottom: 30px; border-bottom: 1px solid #EBEBEB; overflow: hidden;} span.board_title {float: left; display: block; margin: 20px auto 0; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 20px; font-weight: 500; letter-spacing: -0.025em; color: #333333; border-bottom: 1px solid #333333;} span.more {float: right; display: block; margin: 20px auto 0; font-weight: 400; letter-spacing: -0.025em;} span.more a {font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 15px; color: #666666;} #footer {clear: both; width: 100%; margin: 20px auto 0; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; background: #f7f7f7;} #foot_company {float: left; margin-right: 40px; font-size: 12px;} #foot_customer {float: left; margin-right: 40px; font-size: 12px;} #bottom {width: 100%; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;} #bottom ul {width: 360px; margin: 0 auto; overflow: hidden;} #bottom ul li {float: left; background: url('/assets/img/youlbit/bottom_line.gif') center right no-repeat;} #bottom ul li.end {background: none; } #bottom ul li a {display: block; padding: 8px; font-size: 12px; font-weight: 400; letter-spacing: -0.025em; color: #9A9A9A;} #bottom_info {width: 100%; max-width: 990px; margin: 0 auto; overflow: hidden;} #bottom_info h4 {padding: 15px 0 10px; font-family: verdana, arial, helvetica, sans-serif; font-size: 12px; font-weight: bold; letter-spacing: 0; color: #9A9A9A;} #bottom2 {clear: both; width: 100%; padding: 20px 0; font-weight: 400; letter-spacing: -0.025em; line-height: 150%; color: #9A9A9A;} #copy {clear: both; padding: 15px 0; font-size: 12px; font-weight: 400; letter-spacing: -0.025em; text-align: center; color: #9A9A9A; border-top: 1px solid #ddd;} #sub_body {max-width: 1120px; width: 100%; margin: 45px auto;} #contentsArea {position: relative; width: 100%;} #contentsArea #title_bg {position: relative; max-width: 500px; height: 135px; margin: 0 auto 20px;} #contentsArea #title {clear: both; width: 100%; margin: 0 auto; padding-top: 30px; padding-bottom: 0; font-family: 'Pretendard'; font-size: 40px; font-weight: bold; letter-spacing: -1.5px; text-align: center; color: #515151;} #contentsArea #sub_menu {display: none;} #contentsArea .left_title {display: none;} #sub_menu {position: relative; height: 40px; background-color: #DDDDDD; transition: all ease .3s; -moz-transition: all ease .3s; -webkit-transition: all ease .3s; -o-transition: all ease .3s;} #sub_menu ul {display: flex; flex-direction: row; justify-content: space-between; align-items: center; flex-wrap: wrap; width: 100%; max-width: 600px; margin: 0 auto; text-align: center;} #sub_menu ul.sub_1 li {width: 100%;} #sub_menu ul.sub_2 li {width: 50%;} #sub_menu ul.sub_3 li {width: 33.333%;} #sub_menu ul.sub_4 li {width: 25%;} #sub_menu a {display: block; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 14px; font-weight: 600; line-height: 40px; text-align: center; text-decoration: none; color: #555555;} #sub_menu a:hover {color: #333333; background-color: #FFFFFF;} #sub_menu a.on {color: #333333; background-color: #FFFFFF;} #left_ban {width: 95%; margin: 50px auto;} #left_ban ul li.first_menu {margin-top: 5px; font-size: 16px; font-weight: 500;} #left_ban ul li {font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 12px; color: #565656;} .left_title {display: block; width: 100%; padding: 12px 0 12px 10px; font-family: '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif, verdana, arial, helvetica, sans-serif; font-size: 20px; font-weight: 600; color: #333333; border-top: 1px solid #3A3A3A; border-bottom: 1px solid #3A3A3A; background: url('/assets/img/youlbit/left_title_bg.gif') no-repeat right center;} .left_ban_title {display: block; width: 100%; padding: 5px 0; font-family: '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif, verdana, arial, helvetica, sans-serif; font-size: 14px; font-weight: bold; border-bottom: 1px solid #bbbbbb;} .left_align {float: left;} .cont {width: 95%; margin: 20px auto 30px; padding: 5px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 14px; color: #5C5C5C; overflow: hidden;} .cont.com_history {text-align: left;} .cont.s_body {max-width: 600px; margin: 0 auto;} .center {text-align: center;} #gallery {clear: both; padding-top: 17px;} .bold {font-weight: bold;} .orange {color: #F78D1E;} .green {color: #669900;} .loc_title {padding-top: 15px; border-bottom: 1px solid #DED9C7;} .expl {margin-top: 15px; margin-bottom: 40px;} .med_title {font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 16px; font-weight: 500; line-height: 180%; letter-spacing: -0.025em;} .eng {font-family: 'helvetica', 'Open Sans', arial, sans-serif;} .eng_num {letter-spacing: 0;} cite {font-family: "arial", "돋움"; font-style: normal; line-height: 150%;} article#sub_contents p {margin-bottom: 10px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 14px; font-weight: 400; line-height: 1.8em; letter-spacing: -0.025em; color: #5F5F5F;} article#sub_contents figure.img_left {float: left; width: 35%; margin-right: 40px;} article#sub_contents figure.img_right {float: right; width: 35%; margin-left: 40px;} article#sub_contents figure.img_center {width: 100%;} article#sub_contents figure img {max-width: 100%;} article#sub_contents h2 {margin-top: 5px; margin-bottom: 25px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 23px; font-weight: 700; line-height: 120%; letter-spacing: -0.05em; color: #333;} article#sub_contents>ul {margin: 0 auto; padding-top: 20px;} article#sub_contents ul li ul {margin-left: 101px; background: url('/assets/img/youlbit/history/line_bg.gif') repeat-y left top;} article#sub_contents ul li ul li {padding: 10px;} article#sub_contents .year {display: block; width: 110px; font-family: '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif, verdana, arial, helvetica, sans-serif; font-size: 40px; letter-spacing: -0.1em; color: #5F5F5F; background: url('/assets/img/youlbit/history/line_mid.gif') no-repeat right center;} article#sub_contents .month {margin-right: 10px; font-family: 'Noto Sans KR', '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 13px; font-weight: bold; letter-spacing: -0.05em; color: #5F5F5F;} .member_txt input[name=addr] {width: 100%;} .member_txt input[name=addr2] {width: 100%;} .member_txt input[name=member_img] {width: 100%;} .row {width: 100%; margin-bottom: 25px; overflow: hidden;} .cateform {color: #666666; border: 1px solid #D4D4D4;} .keywordform {width: 95%; color: #666666; border: 1px solid #D4D4D4;} .talk img {vertical-align: middle;} @media screen and (max-width:1000px) { #sub_body {clear: both; width: 100%;} td.att_title {min-width: 45px;} td.formmail_title_bgcolor {min-width: 50px;} } @media screen and (max-width: 991px) { #logo {position: relative; top: 5px; left: 0; float: none; z-index: 8888; margin: 0 auto;} #top_container_bg {margin: 0 auto;} #top_container {position: relative; width: 100%; max-width: 990px; height: 80px; margin: 0 auto; padding-top: 10px;} #main_container {margin-top: 0px;} #sub_container {margin-top: 0px;} #sub_container #head_title {display: none;} #main_body {width: 95%;} #main_body_bg {padding-top: 0; padding-bottom: 20px;} #left {display: none;} #contentsArea {float: none; width: 98%; margin: 0 auto;} #main_left {float: none; width: 100%; border-right: none;} #main_right {float: none; width: 100%; padding-top: 20px;} #main_portfolio {float: none; width: 100%; height: auto;} #main_portfolio .board_output_imgs {width: 100%; height: 150px;} #notice {float: none; width: 100%; margin-top: 20px;} #contact_ban {float: left; width: 45%; margin-top: 15px; padding-bottom: 20px; text-align: center; background: #f4f4f4;} #contact_ban dl {padding-right: 0;} #qna {float: right; width: 45%; margin-top: 0;} #head_title {display: none;} div#post_area img {width: 95%; max-width: 750px; height: auto;} } @media screen and (max-width: 959px) { #mob_gnb {display: block;} #mob_menu {position: absolute; top: 15px; right: 10px; z-index: 9002; display: block;} #gnb {display: none;} #menu {position: fixed; top: 0; right: 0; z-index: 9001; display: none; width: 70%; height: 100%; border: 1px solid #000; background: #FFFFFF; box-shadow: 2px 2px 10px 0 #333333, -2px -2px 10px 0 #333333; overflow-y: auto;} #menu ul li ul li {display: inline-block;} #menu ul li ul li a {padding: 10px; text-align: left; color: #555555;} #menu ul li ul li a:hover {text-decoration: none; color: #333333;} #menu>#menu_wrap>ul {position: absolute; top: 100px; left: 0; width: 100%; height: auto; margin-left: 0; padding-bottom: 30px; background: #FFFFFF;} #menu>#menu_wrap>ul>li {position: relative; float: none; width: 100%; padding-top: 3px; padding-bottom: 3px; border-right: 0;} #menu>#menu_wrap>ul>li>a {padding: 10px; font-size: 15px; text-align: left; color: #333333; border-bottom: 1px solid #CCCCCC; background: #FFFFFF url('/assets/img/youlbit/menu_arrow.png') no-repeat 98% center;} #menu>#menu_wrap>ul>li>a.on {color: #000; background: #FFF url('/assets/img/youlbit/menu_arrow_on.png') no-repeat 98% center; } #menu>#menu_wrap>ul>li>a.pc {display: none;} #menu>#menu_wrap>ul>li>a.mob {display: block;} #menu #submenu_1 ul, #menu #submenu_2 ul, #menu #submenu_3 ul, #menu #submenu_4 ul, #menu #submenu_5 ul, #menu #submenu_6 ul {position: relative; top: 0; left: 0; display: none; width: 100%; height: auto; background: #F2F2F2;} #main_product_gallery {width: 95%;} #main_portfolio {width: 95%;} #foot_company {width: 90%; margin-left: 20px;} #foot_customer {width: 90%; margin-left: 20px;} #sns_bottom {margin-left: 20px;} #main_quick_bg {position: relative; z-index: 10; margin: 0 auto 20px;} } @media screen and (max-width: 768px) { #logo {top: 5px; margin: 0 auto;} .board input[type=text] {width: 95%;} .board input[name=name] {width: 60%;} .board input[name=phone_no1] {width: 15%;} .board input[name=phone_no2] {width: 20%;} .board input[name=phone_no3] {width: 20%;} .board input[type=file] {width: 95%;} .board textarea {width: 95%;} .table_02 input[type=text] {width: 95%;} .table_02 input[name=name] {width: 60%;} .table_02 input[name=phone_no1] {width: 15%;} .table_02 input[name=phone_no2] {width: 20%;} .table_02 input[name=phone_no3] {width: 20%;} .table_02 input[type=file] {width: 95%;} .table_02 textarea {width: 95%;} .comment_txt {display: block;} .comment_txt textarea {width: 60%;} .comment_name {display: block;} .bbsnewf5 td a img {width: 100%; max-width: 100%; height: auto;} .login_box input[type=image] {width: 95%; max-width: 86px;} .member_txt input[name=member_img] {width: 250px;} .member_txt select[name=pw_question] {width: 250px;} .member_txt input[name=pw_answer] {width: 250px;} .member_txt input[name=email1] {width: 120px;} .member_txt select[name=email2] {width: 120px;} .member_txt input[name=email3] {width: 120px;} .member_txt input[name=com_member_secede_email] {width: 170px;} #copy {text-align: center;} #main_portfolio .board_output_imgs {width: 100%; height: 100px;} #main_quick a {width: 50%;} #main_quick div {border-bottom: 1px solid rgba(255, 255, 255, 0.2);} #sub_menu ul {width: 90%;} #sub_menu ul.sub_1 {width: 50%;} div#post_area img {width: 95%; max-width: 750px; height: auto;} } @media screen and (max-width: 639px) { #head_title {display: none;} #notice {float: none; width: 100%; margin-top: 35px;} #contact_ban {float: none; width: 100%; margin-top: 20px;} #qna {float: none; width: 100%; margin-top: 35px;} } @media screen and (max-width:600px) { article#sub_contents .year {background: none;} article#sub_contents ul li ul {margin: 10px 0 25px 20px; border-top: 1px solid #C9C9C9; background: none;} } @media screen and (max-width: 520px) { #contentsArea #title {width: 100%; font-family: '나눔고딕', Nanum Gothic, NanumGothic, "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; font-size: 35px; background: url('/assets/img/youlbit/sub_title_bg1.png') no-repeat center top;} #contentsArea #title_bg {position: relative; max-width: 500px; height: 125px; margin: 0 auto 20px;} .center img {width: 100%; height: auto;} } @media screen and (max-width: 480px) { article#sub_contents figure.img_left {clear: both; width: 100%;} article#sub_contents figure.img_right {clear: both; width: 100%;} .member_txt input[name=member_img] {width: 170px;} .member_txt select[name=pw_question] {width: 170px;} .member_txt input[name=pw_answer] {width: 170px;} .member_txt input[name=email1] {width: 150px;} .member_txt select[name=email2] {width: 150px;} .member_txt input[name=email3] {width: 150px;} .member_txt input[name=com_member_secede_email] {width: 150px;} #main_portfolio .board_output_imgs {width: 100%; height: 50px;} } @media screen and (max-width: 360px) { article#sub_contents h2 {margin-top: 5px; margin-bottom: 25px; font-size: 20px; font-weight: bold; line-height: 120%; letter-spacing: -0.05em;} } /* ===== /assets/img/youlbit/swf/css/font-awesome.min.css ===== */ @font-face{font-family:'FontAwesome';src:url('/assets/img/youlbit/swf/fonts/fontawesome-webfont.eot?v=4.5.0');src:url('/assets/img/youlbit/swf/fonts/fontawesome-webfont.eot?#iefix&v=4.5.0') format('embedded-opentype'),url('/assets/img/youlbit/swf/fonts/fontawesome-webfont.woff2?v=4.5.0') format('woff2'),url('/assets/img/youlbit/swf/fonts/fontawesome-webfont.woff?v=4.5.0') format('woff'),url('/assets/img/youlbit/swf/fonts/fontawesome-webfont.ttf?v=4.5.0') format('truetype'),url('/assets/img/youlbit/swf/fonts/fontawesome-webfont.svg?v=4.5.0#fontawesomeregular') format('svg');font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left{margin-right:.3em}.fa.fa-pull-right{margin-left:.3em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-ms-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-ms-transform:scale(1, -1);transform:scale(1, -1)}:root .fa-rotate-90,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-flip-horizontal,:root .fa-flip-vertical{filter:none}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:"\f000"}.fa-music:before{content:"\f001"}.fa-search:before{content:"\f002"}.fa-envelope-o:before{content:"\f003"}.fa-heart:before{content:"\f004"}.fa-star:before{content:"\f005"}.fa-star-o:before{content:"\f006"}.fa-user:before{content:"\f007"}.fa-film:before{content:"\f008"}.fa-th-large:before{content:"\f009"}.fa-th:before{content:"\f00a"}.fa-th-list:before{content:"\f00b"}.fa-check:before{content:"\f00c"}.fa-remove:before,.fa-close:before,.fa-times:before{content:"\f00d"}.fa-search-plus:before{content:"\f00e"}.fa-search-minus:before{content:"\f010"}.fa-power-off:before{content:"\f011"}.fa-signal:before{content:"\f012"}.fa-gear:before,.fa-cog:before{content:"\f013"}.fa-trash-o:before{content:"\f014"}.fa-home:before{content:"\f015"}.fa-file-o:before{content:"\f016"}.fa-clock-o:before{content:"\f017"}.fa-road:before{content:"\f018"}.fa-download:before{content:"\f019"}.fa-arrow-circle-o-down:before{content:"\f01a"}.fa-arrow-circle-o-up:before{content:"\f01b"}.fa-inbox:before{content:"\f01c"}.fa-play-circle-o:before{content:"\f01d"}.fa-rotate-right:before,.fa-repeat:before{content:"\f01e"}.fa-refresh:before{content:"\f021"}.fa-list-alt:before{content:"\f022"}.fa-lock:before{content:"\f023"}.fa-flag:before{content:"\f024"}.fa-headphones:before{content:"\f025"}.fa-volume-off:before{content:"\f026"}.fa-volume-down:before{content:"\f027"}.fa-volume-up:before{content:"\f028"}.fa-qrcode:before{content:"\f029"}.fa-barcode:before{content:"\f02a"}.fa-tag:before{content:"\f02b"}.fa-tags:before{content:"\f02c"}.fa-book:before{content:"\f02d"}.fa-bookmark:before{content:"\f02e"}.fa-print:before{content:"\f02f"}.fa-camera:before{content:"\f030"}.fa-font:before{content:"\f031"}.fa-bold:before{content:"\f032"}.fa-italic:before{content:"\f033"}.fa-text-height:before{content:"\f034"}.fa-text-width:before{content:"\f035"}.fa-align-left:before{content:"\f036"}.fa-align-center:before{content:"\f037"}.fa-align-right:before{content:"\f038"}.fa-align-justify:before{content:"\f039"}.fa-list:before{content:"\f03a"}.fa-dedent:before,.fa-outdent:before{content:"\f03b"}.fa-indent:before{content:"\f03c"}.fa-video-camera:before{content:"\f03d"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:"\f03e"}.fa-pencil:before{content:"\f040"}.fa-map-marker:before{content:"\f041"}.fa-adjust:before{content:"\f042"}.fa-tint:before{content:"\f043"}.fa-edit:before,.fa-pencil-square-o:before{content:"\f044"}.fa-share-square-o:before{content:"\f045"}.fa-check-square-o:before{content:"\f046"}.fa-arrows:before{content:"\f047"}.fa-step-backward:before{content:"\f048"}.fa-fast-backward:before{content:"\f049"}.fa-backward:before{content:"\f04a"}.fa-play:before{content:"\f04b"}.fa-pause:before{content:"\f04c"}.fa-stop:before{content:"\f04d"}.fa-forward:before{content:"\f04e"}.fa-fast-forward:before{content:"\f050"}.fa-step-forward:before{content:"\f051"}.fa-eject:before{content:"\f052"}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-plus-circle:before{content:"\f055"}.fa-minus-circle:before{content:"\f056"}.fa-times-circle:before{content:"\f057"}.fa-check-circle:before{content:"\f058"}.fa-question-circle:before{content:"\f059"}.fa-info-circle:before{content:"\f05a"}.fa-crosshairs:before{content:"\f05b"}.fa-times-circle-o:before{content:"\f05c"}.fa-check-circle-o:before{content:"\f05d"}.fa-ban:before{content:"\f05e"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-up:before{content:"\f062"}.fa-arrow-down:before{content:"\f063"}.fa-mail-forward:before,.fa-share:before{content:"\f064"}.fa-expand:before{content:"\f065"}.fa-compress:before{content:"\f066"}.fa-plus:before{content:"\f067"}.fa-minus:before{content:"\f068"}.fa-asterisk:before{content:"\f069"}.fa-exclamation-circle:before{content:"\f06a"}.fa-gift:before{content:"\f06b"}.fa-leaf:before{content:"\f06c"}.fa-fire:before{content:"\f06d"}.fa-eye:before{content:"\f06e"}.fa-eye-slash:before{content:"\f070"}.fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"}.fa-plane:before{content:"\f072"}.fa-calendar:before{content:"\f073"}.fa-random:before{content:"\f074"}.fa-comment:before{content:"\f075"}.fa-magnet:before{content:"\f076"}.fa-chevron-up:before{content:"\f077"}.fa-chevron-down:before{content:"\f078"}.fa-retweet:before{content:"\f079"}.fa-shopping-cart:before{content:"\f07a"}.fa-folder:before{content:"\f07b"}.fa-folder-open:before{content:"\f07c"}.fa-arrows-v:before{content:"\f07d"}.fa-arrows-h:before{content:"\f07e"}.fa-bar-chart-o:before,.fa-bar-chart:before{content:"\f080"}.fa-twitter-square:before{content:"\f081"}.fa-facebook-square:before{content:"\f082"}.fa-camera-retro:before{content:"\f083"}.fa-key:before{content:"\f084"}.fa-gears:before,.fa-cogs:before{content:"\f085"}.fa-comments:before{content:"\f086"}.fa-thumbs-o-up:before{content:"\f087"}.fa-thumbs-o-down:before{content:"\f088"}.fa-star-half:before{content:"\f089"}.fa-heart-o:before{content:"\f08a"}.fa-sign-out:before{content:"\f08b"}.fa-linkedin-square:before{content:"\f08c"}.fa-thumb-tack:before{content:"\f08d"}.fa-external-link:before{content:"\f08e"}.fa-sign-in:before{content:"\f090"}.fa-trophy:before{content:"\f091"}.fa-github-square:before{content:"\f092"}.fa-upload:before{content:"\f093"}.fa-lemon-o:before{content:"\f094"}.fa-phone:before{content:"\f095"}.fa-square-o:before{content:"\f096"}.fa-bookmark-o:before{content:"\f097"}.fa-phone-square:before{content:"\f098"}.fa-twitter:before{content:"\f099"}.fa-facebook-f:before,.fa-facebook:before{content:"\f09a"}.fa-github:before{content:"\f09b"}.fa-unlock:before{content:"\f09c"}.fa-credit-card:before{content:"\f09d"}.fa-feed:before,.fa-rss:before{content:"\f09e"}.fa-hdd-o:before{content:"\f0a0"}.fa-bullhorn:before{content:"\f0a1"}.fa-bell:before{content:"\f0f3"}.fa-certificate:before{content:"\f0a3"}.fa-hand-o-right:before{content:"\f0a4"}.fa-hand-o-left:before{content:"\f0a5"}.fa-hand-o-up:before{content:"\f0a6"}.fa-hand-o-down:before{content:"\f0a7"}.fa-arrow-circle-left:before{content:"\f0a8"}.fa-arrow-circle-right:before{content:"\f0a9"}.fa-arrow-circle-up:before{content:"\f0aa"}.fa-arrow-circle-down:before{content:"\f0ab"}.fa-globe:before{content:"\f0ac"}.fa-wrench:before{content:"\f0ad"}.fa-tasks:before{content:"\f0ae"}.fa-filter:before{content:"\f0b0"}.fa-briefcase:before{content:"\f0b1"}.fa-arrows-alt:before{content:"\f0b2"}.fa-group:before,.fa-users:before{content:"\f0c0"}.fa-chain:before,.fa-link:before{content:"\f0c1"}.fa-cloud:before{content:"\f0c2"}.fa-flask:before{content:"\f0c3"}.fa-cut:before,.fa-scissors:before{content:"\f0c4"}.fa-copy:before,.fa-files-o:before{content:"\f0c5"}.fa-paperclip:before{content:"\f0c6"}.fa-save:before,.fa-floppy-o:before{content:"\f0c7"}.fa-square:before{content:"\f0c8"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:"\f0c9"}.fa-list-ul:before{content:"\f0ca"}.fa-list-ol:before{content:"\f0cb"}.fa-strikethrough:before{content:"\f0cc"}.fa-underline:before{content:"\f0cd"}.fa-table:before{content:"\f0ce"}.fa-magic:before{content:"\f0d0"}.fa-truck:before{content:"\f0d1"}.fa-pinterest:before{content:"\f0d2"}.fa-pinterest-square:before{content:"\f0d3"}.fa-google-plus-square:before{content:"\f0d4"}.fa-google-plus:before{content:"\f0d5"}.fa-money:before{content:"\f0d6"}.fa-caret-down:before{content:"\f0d7"}.fa-caret-up:before{content:"\f0d8"}.fa-caret-left:before{content:"\f0d9"}.fa-caret-right:before{content:"\f0da"}.fa-columns:before{content:"\f0db"}.fa-unsorted:before,.fa-sort:before{content:"\f0dc"}.fa-sort-down:before,.fa-sort-desc:before{content:"\f0dd"}.fa-sort-up:before,.fa-sort-asc:before{content:"\f0de"}.fa-envelope:before{content:"\f0e0"}.fa-linkedin:before{content:"\f0e1"}.fa-rotate-left:before,.fa-undo:before{content:"\f0e2"}.fa-legal:before,.fa-gavel:before{content:"\f0e3"}.fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"}.fa-comment-o:before{content:"\f0e5"}.fa-comments-o:before{content:"\f0e6"}.fa-flash:before,.fa-bolt:before{content:"\f0e7"}.fa-sitemap:before{content:"\f0e8"}.fa-umbrella:before{content:"\f0e9"}.fa-paste:before,.fa-clipboard:before{content:"\f0ea"}.fa-lightbulb-o:before{content:"\f0eb"}.fa-exchange:before{content:"\f0ec"}.fa-cloud-download:before{content:"\f0ed"}.fa-cloud-upload:before{content:"\f0ee"}.fa-user-md:before{content:"\f0f0"}.fa-stethoscope:before{content:"\f0f1"}.fa-suitcase:before{content:"\f0f2"}.fa-bell-o:before{content:"\f0a2"}.fa-coffee:before{content:"\f0f4"}.fa-cutlery:before{content:"\f0f5"}.fa-file-text-o:before{content:"\f0f6"}.fa-building-o:before{content:"\f0f7"}.fa-hospital-o:before{content:"\f0f8"}.fa-ambulance:before{content:"\f0f9"}.fa-medkit:before{content:"\f0fa"}.fa-fighter-jet:before{content:"\f0fb"}.fa-beer:before{content:"\f0fc"}.fa-h-square:before{content:"\f0fd"}.fa-plus-square:before{content:"\f0fe"}.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angle-down:before{content:"\f107"}.fa-desktop:before{content:"\f108"}.fa-laptop:before{content:"\f109"}.fa-tablet:before{content:"\f10a"}.fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"}.fa-circle-o:before{content:"\f10c"}.fa-quote-left:before{content:"\f10d"}.fa-quote-right:before{content:"\f10e"}.fa-spinner:before{content:"\f110"}.fa-circle:before{content:"\f111"}.fa-mail-reply:before,.fa-reply:before{content:"\f112"}.fa-github-alt:before{content:"\f113"}.fa-folder-o:before{content:"\f114"}.fa-folder-open-o:before{content:"\f115"}.fa-smile-o:before{content:"\f118"}.fa-frown-o:before{content:"\f119"}.fa-meh-o:before{content:"\f11a"}.fa-gamepad:before{content:"\f11b"}.fa-keyboard-o:before{content:"\f11c"}.fa-flag-o:before{content:"\f11d"}.fa-flag-checkered:before{content:"\f11e"}.fa-terminal:before{content:"\f120"}.fa-code:before{content:"\f121"}.fa-mail-reply-all:before,.fa-reply-all:before{content:"\f122"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"}.fa-location-arrow:before{content:"\f124"}.fa-crop:before{content:"\f125"}.fa-code-fork:before{content:"\f126"}.fa-unlink:before,.fa-chain-broken:before{content:"\f127"}.fa-question:before{content:"\f128"}.fa-info:before{content:"\f129"}.fa-exclamation:before{content:"\f12a"}.fa-superscript:before{content:"\f12b"}.fa-subscript:before{content:"\f12c"}.fa-eraser:before{content:"\f12d"}.fa-puzzle-piece:before{content:"\f12e"}.fa-microphone:before{content:"\f130"}.fa-microphone-slash:before{content:"\f131"}.fa-shield:before{content:"\f132"}.fa-calendar-o:before{content:"\f133"}.fa-fire-extinguisher:before{content:"\f134"}.fa-rocket:before{content:"\f135"}.fa-maxcdn:before{content:"\f136"}.fa-chevron-circle-left:before{content:"\f137"}.fa-chevron-circle-right:before{content:"\f138"}.fa-chevron-circle-up:before{content:"\f139"}.fa-chevron-circle-down:before{content:"\f13a"}.fa-html5:before{content:"\f13b"}.fa-css3:before{content:"\f13c"}.fa-anchor:before{content:"\f13d"}.fa-unlock-alt:before{content:"\f13e"}.fa-bullseye:before{content:"\f140"}.fa-ellipsis-h:before{content:"\f141"}.fa-ellipsis-v:before{content:"\f142"}.fa-rss-square:before{content:"\f143"}.fa-play-circle:before{content:"\f144"}.fa-ticket:before{content:"\f145"}.fa-minus-square:before{content:"\f146"}.fa-minus-square-o:before{content:"\f147"}.fa-level-up:before{content:"\f148"}.fa-level-down:before{content:"\f149"}.fa-check-square:before{content:"\f14a"}.fa-pencil-square:before{content:"\f14b"}.fa-external-link-square:before{content:"\f14c"}.fa-share-square:before{content:"\f14d"}.fa-compass:before{content:"\f14e"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"}.fa-euro:before,.fa-eur:before{content:"\f153"}.fa-gbp:before{content:"\f154"}.fa-dollar:before,.fa-usd:before{content:"\f155"}.fa-rupee:before,.fa-inr:before{content:"\f156"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"}.fa-won:before,.fa-krw:before{content:"\f159"}.fa-bitcoin:before,.fa-btc:before{content:"\f15a"}.fa-file:before{content:"\f15b"}.fa-file-text:before{content:"\f15c"}.fa-sort-alpha-asc:before{content:"\f15d"}.fa-sort-alpha-desc:before{content:"\f15e"}.fa-sort-amount-asc:before{content:"\f160"}.fa-sort-amount-desc:before{content:"\f161"}.fa-sort-numeric-asc:before{content:"\f162"}.fa-sort-numeric-desc:before{content:"\f163"}.fa-thumbs-up:before{content:"\f164"}.fa-thumbs-down:before{content:"\f165"}.fa-youtube-square:before{content:"\f166"}.fa-youtube:before{content:"\f167"}.fa-xing:before{content:"\f168"}.fa-xing-square:before{content:"\f169"}.fa-youtube-play:before{content:"\f16a"}.fa-dropbox:before{content:"\f16b"}.fa-stack-overflow:before{content:"\f16c"}.fa-instagram:before{content:"\f16d"}.fa-flickr:before{content:"\f16e"}.fa-adn:before{content:"\f170"}.fa-bitbucket:before{content:"\f171"}.fa-bitbucket-square:before{content:"\f172"}.fa-tumblr:before{content:"\f173"}.fa-tumblr-square:before{content:"\f174"}.fa-long-arrow-down:before{content:"\f175"}.fa-long-arrow-up:before{content:"\f176"}.fa-long-arrow-left:before{content:"\f177"}.fa-long-arrow-right:before{content:"\f178"}.fa-apple:before{content:"\f179"}.fa-windows:before{content:"\f17a"}.fa-android:before{content:"\f17b"}.fa-linux:before{content:"\f17c"}.fa-dribbble:before{content:"\f17d"}.fa-skype:before{content:"\f17e"}.fa-foursquare:before{content:"\f180"}.fa-trello:before{content:"\f181"}.fa-female:before{content:"\f182"}.fa-male:before{content:"\f183"}.fa-gittip:before,.fa-gratipay:before{content:"\f184"}.fa-sun-o:before{content:"\f185"}.fa-moon-o:before{content:"\f186"}.fa-archive:before{content:"\f187"}.fa-bug:before{content:"\f188"}.fa-vk:before{content:"\f189"}.fa-weibo:before{content:"\f18a"}.fa-renren:before{content:"\f18b"}.fa-pagelines:before{content:"\f18c"}.fa-stack-exchange:before{content:"\f18d"}.fa-arrow-circle-o-right:before{content:"\f18e"}.fa-arrow-circle-o-left:before{content:"\f190"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"}.fa-dot-circle-o:before{content:"\f192"}.fa-wheelchair:before{content:"\f193"}.fa-vimeo-square:before{content:"\f194"}.fa-turkish-lira:before,.fa-try:before{content:"\f195"}.fa-plus-square-o:before{content:"\f196"}.fa-space-shuttle:before{content:"\f197"}.fa-slack:before{content:"\f198"}.fa-envelope-square:before{content:"\f199"}.fa-wordpress:before{content:"\f19a"}.fa-openid:before{content:"\f19b"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:"\f19c"}.fa-mortar-board:before,.fa-graduation-cap:before{content:"\f19d"}.fa-yahoo:before{content:"\f19e"}.fa-google:before{content:"\f1a0"}.fa-reddit:before{content:"\f1a1"}.fa-reddit-square:before{content:"\f1a2"}.fa-stumbleupon-circle:before{content:"\f1a3"}.fa-stumbleupon:before{content:"\f1a4"}.fa-delicious:before{content:"\f1a5"}.fa-digg:before{content:"\f1a6"}.fa-pied-piper:before{content:"\f1a7"}.fa-pied-piper-alt:before{content:"\f1a8"}.fa-drupal:before{content:"\f1a9"}.fa-joomla:before{content:"\f1aa"}.fa-language:before{content:"\f1ab"}.fa-fax:before{content:"\f1ac"}.fa-building:before{content:"\f1ad"}.fa-child:before{content:"\f1ae"}.fa-paw:before{content:"\f1b0"}.fa-spoon:before{content:"\f1b1"}.fa-cube:before{content:"\f1b2"}.fa-cubes:before{content:"\f1b3"}.fa-behance:before{content:"\f1b4"}.fa-behance-square:before{content:"\f1b5"}.fa-steam:before{content:"\f1b6"}.fa-steam-square:before{content:"\f1b7"}.fa-recycle:before{content:"\f1b8"}.fa-automobile:before,.fa-car:before{content:"\f1b9"}.fa-cab:before,.fa-taxi:before{content:"\f1ba"}.fa-tree:before{content:"\f1bb"}.fa-spotify:before{content:"\f1bc"}.fa-deviantart:before{content:"\f1bd"}.fa-soundcloud:before{content:"\f1be"}.fa-database:before{content:"\f1c0"}.fa-file-pdf-o:before{content:"\f1c1"}.fa-file-word-o:before{content:"\f1c2"}.fa-file-excel-o:before{content:"\f1c3"}.fa-file-powerpoint-o:before{content:"\f1c4"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:"\f1c5"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:"\f1c6"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:"\f1c7"}.fa-file-movie-o:before,.fa-file-video-o:before{content:"\f1c8"}.fa-file-code-o:before{content:"\f1c9"}.fa-vine:before{content:"\f1ca"}.fa-codepen:before{content:"\f1cb"}.fa-jsfiddle:before{content:"\f1cc"}.fa-life-bouy:before,.fa-life-buoy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:"\f1cd"}.fa-circle-o-notch:before{content:"\f1ce"}.fa-ra:before,.fa-rebel:before{content:"\f1d0"}.fa-ge:before,.fa-empire:before{content:"\f1d1"}.fa-git-square:before{content:"\f1d2"}.fa-git:before{content:"\f1d3"}.fa-y-combinator-square:before,.fa-yc-square:before,.fa-hacker-news:before{content:"\f1d4"}.fa-tencent-weibo:before{content:"\f1d5"}.fa-qq:before{content:"\f1d6"}.fa-wechat:before,.fa-weixin:before{content:"\f1d7"}.fa-send:before,.fa-paper-plane:before{content:"\f1d8"}.fa-send-o:before,.fa-paper-plane-o:before{content:"\f1d9"}.fa-history:before{content:"\f1da"}.fa-circle-thin:before{content:"\f1db"}.fa-header:before{content:"\f1dc"}.fa-paragraph:before{content:"\f1dd"}.fa-sliders:before{content:"\f1de"}.fa-share-alt:before{content:"\f1e0"}.fa-share-alt-square:before{content:"\f1e1"}.fa-bomb:before{content:"\f1e2"}.fa-soccer-ball-o:before,.fa-futbol-o:before{content:"\f1e3"}.fa-tty:before{content:"\f1e4"}.fa-binoculars:before{content:"\f1e5"}.fa-plug:before{content:"\f1e6"}.fa-slideshare:before{content:"\f1e7"}.fa-twitch:before{content:"\f1e8"}.fa-yelp:before{content:"\f1e9"}.fa-newspaper-o:before{content:"\f1ea"}.fa-wifi:before{content:"\f1eb"}.fa-calculator:before{content:"\f1ec"}.fa-paypal:before{content:"\f1ed"}.fa-google-wallet:before{content:"\f1ee"}.fa-cc-visa:before{content:"\f1f0"}.fa-cc-mastercard:before{content:"\f1f1"}.fa-cc-discover:before{content:"\f1f2"}.fa-cc-amex:before{content:"\f1f3"}.fa-cc-paypal:before{content:"\f1f4"}.fa-cc-stripe:before{content:"\f1f5"}.fa-bell-slash:before{content:"\f1f6"}.fa-bell-slash-o:before{content:"\f1f7"}.fa-trash:before{content:"\f1f8"}.fa-copyright:before{content:"\f1f9"}.fa-at:before{content:"\f1fa"}.fa-eyedropper:before{content:"\f1fb"}.fa-paint-brush:before{content:"\f1fc"}.fa-birthday-cake:before{content:"\f1fd"}.fa-area-chart:before{content:"\f1fe"}.fa-pie-chart:before{content:"\f200"}.fa-line-chart:before{content:"\f201"}.fa-lastfm:before{content:"\f202"}.fa-lastfm-square:before{content:"\f203"}.fa-toggle-off:before{content:"\f204"}.fa-toggle-on:before{content:"\f205"}.fa-bicycle:before{content:"\f206"}.fa-bus:before{content:"\f207"}.fa-ioxhost:before{content:"\f208"}.fa-angellist:before{content:"\f209"}.fa-cc:before{content:"\f20a"}.fa-shekel:before,.fa-sheqel:before,.fa-ils:before{content:"\f20b"}.fa-meanpath:before{content:"\f20c"}.fa-buysellads:before{content:"\f20d"}.fa-connectdevelop:before{content:"\f20e"}.fa-dashcube:before{content:"\f210"}.fa-forumbee:before{content:"\f211"}.fa-leanpub:before{content:"\f212"}.fa-sellsy:before{content:"\f213"}.fa-shirtsinbulk:before{content:"\f214"}.fa-simplybuilt:before{content:"\f215"}.fa-skyatlas:before{content:"\f216"}.fa-cart-plus:before{content:"\f217"}.fa-cart-arrow-down:before{content:"\f218"}.fa-diamond:before{content:"\f219"}.fa-ship:before{content:"\f21a"}.fa-user-secret:before{content:"\f21b"}.fa-motorcycle:before{content:"\f21c"}.fa-street-view:before{content:"\f21d"}.fa-heartbeat:before{content:"\f21e"}.fa-venus:before{content:"\f221"}.fa-mars:before{content:"\f222"}.fa-mercury:before{content:"\f223"}.fa-intersex:before,.fa-transgender:before{content:"\f224"}.fa-transgender-alt:before{content:"\f225"}.fa-venus-double:before{content:"\f226"}.fa-mars-double:before{content:"\f227"}.fa-venus-mars:before{content:"\f228"}.fa-mars-stroke:before{content:"\f229"}.fa-mars-stroke-v:before{content:"\f22a"}.fa-mars-stroke-h:before{content:"\f22b"}.fa-neuter:before{content:"\f22c"}.fa-genderless:before{content:"\f22d"}.fa-facebook-official:before{content:"\f230"}.fa-pinterest-p:before{content:"\f231"}.fa-whatsapp:before{content:"\f232"}.fa-server:before{content:"\f233"}.fa-user-plus:before{content:"\f234"}.fa-user-times:before{content:"\f235"}.fa-hotel:before,.fa-bed:before{content:"\f236"}.fa-viacoin:before{content:"\f237"}.fa-train:before{content:"\f238"}.fa-subway:before{content:"\f239"}.fa-medium:before{content:"\f23a"}.fa-yc:before,.fa-y-combinator:before{content:"\f23b"}.fa-optin-monster:before{content:"\f23c"}.fa-opencart:before{content:"\f23d"}.fa-expeditedssl:before{content:"\f23e"}.fa-battery-4:before,.fa-battery-full:before{content:"\f240"}.fa-battery-3:before,.fa-battery-three-quarters:before{content:"\f241"}.fa-battery-2:before,.fa-battery-half:before{content:"\f242"}.fa-battery-1:before,.fa-battery-quarter:before{content:"\f243"}.fa-battery-0:before,.fa-battery-empty:before{content:"\f244"}.fa-mouse-pointer:before{content:"\f245"}.fa-i-cursor:before{content:"\f246"}.fa-object-group:before{content:"\f247"}.fa-object-ungroup:before{content:"\f248"}.fa-sticky-note:before{content:"\f249"}.fa-sticky-note-o:before{content:"\f24a"}.fa-cc-jcb:before{content:"\f24b"}.fa-cc-diners-club:before{content:"\f24c"}.fa-clone:before{content:"\f24d"}.fa-balance-scale:before{content:"\f24e"}.fa-hourglass-o:before{content:"\f250"}.fa-hourglass-1:before,.fa-hourglass-start:before{content:"\f251"}.fa-hourglass-2:before,.fa-hourglass-half:before{content:"\f252"}.fa-hourglass-3:before,.fa-hourglass-end:before{content:"\f253"}.fa-hourglass:before{content:"\f254"}.fa-hand-grab-o:before,.fa-hand-rock-o:before{content:"\f255"}.fa-hand-stop-o:before,.fa-hand-paper-o:before{content:"\f256"}.fa-hand-scissors-o:before{content:"\f257"}.fa-hand-lizard-o:before{content:"\f258"}.fa-hand-spock-o:before{content:"\f259"}.fa-hand-pointer-o:before{content:"\f25a"}.fa-hand-peace-o:before{content:"\f25b"}.fa-trademark:before{content:"\f25c"}.fa-registered:before{content:"\f25d"}.fa-creative-commons:before{content:"\f25e"}.fa-gg:before{content:"\f260"}.fa-gg-circle:before{content:"\f261"}.fa-tripadvisor:before{content:"\f262"}.fa-odnoklassniki:before{content:"\f263"}.fa-odnoklassniki-square:before{content:"\f264"}.fa-get-pocket:before{content:"\f265"}.fa-wikipedia-w:before{content:"\f266"}.fa-safari:before{content:"\f267"}.fa-chrome:before{content:"\f268"}.fa-firefox:before{content:"\f269"}.fa-opera:before{content:"\f26a"}.fa-internet-explorer:before{content:"\f26b"}.fa-tv:before,.fa-television:before{content:"\f26c"}.fa-contao:before{content:"\f26d"}.fa-500px:before{content:"\f26e"}.fa-amazon:before{content:"\f270"}.fa-calendar-plus-o:before{content:"\f271"}.fa-calendar-minus-o:before{content:"\f272"}.fa-calendar-times-o:before{content:"\f273"}.fa-calendar-check-o:before{content:"\f274"}.fa-industry:before{content:"\f275"}.fa-map-pin:before{content:"\f276"}.fa-map-signs:before{content:"\f277"}.fa-map-o:before{content:"\f278"}.fa-map:before{content:"\f279"}.fa-commenting:before{content:"\f27a"}.fa-commenting-o:before{content:"\f27b"}.fa-houzz:before{content:"\f27c"}.fa-vimeo:before{content:"\f27d"}.fa-black-tie:before{content:"\f27e"}.fa-fonticons:before{content:"\f280"}.fa-reddit-alien:before{content:"\f281"}.fa-edge:before{content:"\f282"}.fa-credit-card-alt:before{content:"\f283"}.fa-codiepie:before{content:"\f284"}.fa-modx:before{content:"\f285"}.fa-fort-awesome:before{content:"\f286"}.fa-usb:before{content:"\f287"}.fa-product-hunt:before{content:"\f288"}.fa-mixcloud:before{content:"\f289"}.fa-scribd:before{content:"\f28a"}.fa-pause-circle:before{content:"\f28b"}.fa-pause-circle-o:before{content:"\f28c"}.fa-stop-circle:before{content:"\f28d"}.fa-stop-circle-o:before{content:"\f28e"}.fa-shopping-bag:before{content:"\f290"}.fa-shopping-basket:before{content:"\f291"}.fa-hashtag:before{content:"\f292"}.fa-bluetooth:before{content:"\f293"}.fa-bluetooth-b:before{content:"\f294"}.fa-percent:before{content:"\f295"} /* ===== /assets/img/youlbit/swf/css/responsiveslides.css ===== */ .rslides { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0; } .rslides li { -webkit-backface-visibility: hidden; position: absolute; display: none; width: 100%; left: 0; top: 0; background:#000; } .rslides li:first-child { position: relative; display: block; float: left; } .rslides img { display: block; height: auto; float: left; width: 100%; border: 0; opacity: 1; } .rslides { margin: 0 auto 40px; } #slider2, #slider3 { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; margin: 0 auto; } .rslides_tabs { list-style: none; padding: 0; background: rgba(0,0,0,.25); box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0); -moz-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0); -webkit-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0); font-size: 18px; list-style: none; margin: 0 auto 50px; max-width: 540px; padding: 10px 0; text-align: center; width: 100%; } .rslides_tabs li { display: inline; float: none; margin-right: 1px; } .rslides_tabs a { width: auto; line-height: 20px; padding: 9px 20px; height: auto; background: transparent; display: inline; } .rslides_tabs li:first-child { margin-left: 0; } .rslides_tabs .rslides_here a { background: rgba(255,255,255,.1); color: #fff; font-weight: bold; } a { color: #fff; text-decoration: none; } #download { background: #333; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.1); border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; display: block; font-size: 20px; font-weight: bold; margin: 60px auto; max-width: 500px; padding: 20px; } #download:hover { background: rgba(255,255,255,.15); } .footer { font-size: 11px; } h3 { font: 20px/30px "Helvetica Neue", Helvetica, Arial, sans-serif; text-align: center; color: #fff; } .events { list-style: none; } .callbacks_container { position: relative; float: left; width: 100%; } .callbacks { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0; } .callbacks li { position: absolute; width: 100%; left: 0; top: 0; } .callbacks img { display: block; position: relative; z-index: 1; height: auto; width: 100%; border: 0; } .callbacks .caption { display: block; position: absolute; z-index: 2; font-size: 20px; text-shadow: none; color: #fff; background: #000; background: rgba(0,0,0, .8); left: 0; right: 0; bottom: 0; padding: 10px 20px; margin: 0; max-width: none; } .callbacks_nav { position: absolute; -webkit-tap-highlight-color: rgba(0,0,0,0); top: 50%; left: 0; opacity: 0.7; z-index: 3; text-indent: -9999px; overflow: hidden; text-decoration: none; height: 61px; width: 38px; background: transparent url('/assets/img/youlbit/swf/css/themes.gif') no-repeat left top; margin-top: -30px; } .callbacks_nav:active { opacity: 1.0; } .callbacks_nav.next { left: auto; background-position: right top; right: 0; } #slider3-pager a { display: inline-block; } #slider3-pager img { float: left; } #slider3-pager .rslides_here a { background: transparent; box-shadow: 0 0 0 2px #666; } #slider3-pager a { padding: 0; } @media screen and (max-width: 600px) { h1 { font: 24px/50px "Helvetica Neue", Helvetica, Arial, sans-serif; } .callbacks_nav { top: 47%; } } /* ===== /assets/inc/style2.css ===== */ p, span, h5, h4, h3, h2, h1, strong, small {word-break: keep-all;} html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, .main_wrap .sec05 .swiper-button-next dl{margin: 0; padding: 0;border: 0; font-size: 100%; font: inherit; vertical-align: baseline;} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;} body {line-height: 1;} ol, ul, li {list-style: none;} blockquote, q {quotes: none;} blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;} table {border-collapse: collapse; border-spacing: 0;} a {text-decoration: none; color: inherit;} a, span {display: inline-block;} section {font-family: 'Pretendard' !important;} section p {font-family: 'Pretendard';} #post_area, .board_bgcolor, .board_desc {font-family: 'Pretendard' !important;} select[name="com_board_category_code"] {padding: 5px 10px; border-radius: 5px; } .pc_header {position: absolute !important; top: 0; left: 0;} .pc_header.fix {position: fixed !important; background-color: #fff;} #header .pc_header.fix>.header_inner>.menu_category>ul>li {color: #222;} #header .pc_header .fix_logo {display: none;} #header .pc_header.fix .fix_logo {display: block;} #header .pc_header.fix .nofix_logo {display: none;} #header .pc_header .nofix_logo {display: block;} #header .m_header .fix_logo {display: none;} #header .m_header.fix .fix_logo {display: block;} #header .m_header.fix .nofix_logo {display: none;} #header .m_header .nofix_logo {display: block;} #header.main-color .pc_header {} #header.main-color .pc_header.fix {} #header .pc_header {width: 100%; padding: 20px 4%; box-sizing: border-box; position: relative; z-index: 499;} #header .pc_header.fix {position: fixed; top: 0; left: 0; z-index: 499; padding: 20px 4%;} #header .pc_header>.header_inner {display: flex; flex-direction: row; align-content: center; align-items: center; flex-wrap: nowrap; justify-content: space-between;} #header .pc_header>.header_inner>.menu_category>ul {display: flex; flex-direction: row; justify-content: flex-start; align-content: center; align-items: center;} #header .pc_header>.header_inner>.menu_category>ul>li {margin: 0 30px 0 0; line-height: 20px; padding: 10px 0; cursor: pointer; position: relative; font-family: 'SangBlueOgSansRegular' !important; color: #fff; font-size: 16px !important;} #header .pc_header>.header_inner>.menu_category>ul>li:last-child {} #header .pc_header>.header_inner>.menu_category>ul>li, #header .pc_header>.header_inner>.menu_category>ul>li>a, #header .pc_header .menu_member>ul>li a {font-size: 13px;} #header .pc_header, #header .pc_header.fix, #header .pc_header_bg {transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s;} #header .pc_header>.header_inner>h1 {} #header .pc_header>.header_inner>h1 a {vertical-align: top; font-size: 0; line-height: 0; padding: 0; margin: 0;} #header .pc_header>.header_inner>h1 img {padding: 0 0 0 0;} #header .pc_header .board_menu {position: relative;} #header .pc_header .board_menu>ul {position: absolute; top: 50px; left: 50%; opacity: 0; visibility: hidden; z-index: 999; background-color: rgba(255, 255, 255, 0.5); width: 200px; transform: translateX(-50%) !important;} #header .pc_header .board_menu:hover>ul {opacity: 1; visibility: visible;} #header .pc_header .board_menu>ul>li {line-height: 20px; text-align: center;} #header .pc_header .board_menu>ul>li>a {font-size: 16px; font-family: 'Pretendard' !important; margin: 4px 0; font-weight: 200 !important;} #header .pc_header .board_menu>ul, #header .pc_header .board_menu:hover>ul {transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out;} #header .pc_header .menu_member {margin-left: auto; width: 390px;} #header .pc_header .menu_member>ul {display: flex; flex-direction: row; justify-content: flex-end; align-content: center; align-items: center;} #header .pc_header .menu_member>ul>li {position: relative; padding: 0 0 0 30px;} @media (min-width:1px) and (max-width:960px) { #header .pc_header {display: none;} } :root { --font-title: 80px; --font-Mlarge: 44px; --font-large: 40px; --font-medium: 24px; --font-regular: 20px; --font-small: 18px; --font-Xsmall: 16px; } html {overflow-x: hidden} html::-webkit-scrollbar { width: 6px; height: 6px; border-radius: 50px; background: transparent; } html::-webkit-scrollbar-thumb { width: 50%; border-radius: 50px; background: #6d625a; } html::-webkit-scrollbar-button { display: none; } body { scrollbar-width: thin; scrollbar-color: #6d625a transparent; } img {height: auto; max-width: 100%;} img.lazy { opacity: 0; filter: blur(4px); transition: opacity 10s ease, filter 10s ease; } img.lazy.is-loaded { opacity: 1; filter: blur(0); }.common_youtube .sec_tit h3, .common_youtube .sec_tit h1 {margin-bottom: 60px;} .more_ico img {vertical-align: bottom;} .m-on-off {line-height: 80px;} .small_fit_wrap .sec08 .sec_tit {font-family: 'AritaBuri';} .rnb2 { position: fixed; bottom: 0%; right: 0; z-index: 1000; } .rnb2 .rnb2_inner a { display: flex; flex-direction: column; justify-content: space-between; gap: 10px; align-items: center; width: 80px; height: 80px; color: #fff; font-size: 13px; margin-top: 1px; position: relative; left: 0; transition: all 0.3s; background: rgba(38, 38, 38, 0.7); text-decoration: none; font-family: 'Pretendard' !important; text-align: left; } .rnb2 .rnb2_inner a strong { font-family: 'Pretendard' !important; } .rnb2 .rnb2_inner a>span+span { margin-bottom: 10px; } .rnb2 .rnb2_inner a span img { width: 30px; display: block; margin: 0 auto; margin-top: 20px; } .rnb2 .side_youtube_icon img { margin-top: 25px; } .rnb2 .rnb2_inner a:last-child { background: #d6d2cf; } .rnb2 .rnb2_inner a:last-child span { color: #000; font-size: 14px; font-family: 'pretendard', sans-serif; text-align: center; } .rnb2 .rnb2_inner a:last-child span img { width: 11px !important; margin: 0 auto; margin-top: 25px; margin-bottom: 5px; } .rnb2 .rnb2_inner a:hover:last-child { left: 0px; background: #fff; } .rnb2 .rnb_item { opacity: 0; visibility: hidden; } .rnb2.show .rnb_item { opacity: 1; visibility: visible; } .rnb2.active { right: 500px !important; } .rnb2.active a:active:nth-child(2) { width: 29px; position: absolute; top: 50px; right: 100px; } .rnb_qr { position: absolute; top: 50%; left: -119px; transform: translateY(-50%); padding: 10px; box-sizing: border-box; background-color: #817266; border-radius: 10px; transition: 0.3s; width: auto; height: auto; color: #fff; opacity: 0; visibility: hidden; display: flex; flex-direction: column; align-items: center; } .rnb_qr img { max-width: 90px; } .rnb2 .rnb2_inner a:hover .rnb_qr { opacity: 1; visibility: visible; } .rnb2 .rnb2_inner a .qr_triangle { content: ""; position: absolute; top: 50%; left: -11px; width: 0; height: 0; border-bottom: 10px solid transparent; border-top: 10px solid transparent; border-left: 10px solid #817266; border-right: 10px solid transparent; transform: translateY(-50%); opacity: 0; visibility: hidden; transition: 0.3s; } .rnb2 .rnb2_inner a:hover .qr_triangle { opacity: 1; visibility: visible; } .rnb_qr p { font-size: 10px; text-align: center; margin-top: 4px; } .rnb2 .equalogy { border: 1px solid #ccc; position: absolute; bottom: 185px; left: 7px; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 30px; background-color: #fafafa; animation: equalogy_move 1s linear infinite; opacity: 0; visibility: hidden; transition: 0.3s; } .rnb2 .equalogy.show { opacity: 1; visibility: visible; transition: 0.3s; } .rnb2 .equalogy img { width: 85%; } @keyframes equalogy_move { 0% {bottom: 185px;} 50% {bottom: 190px;} 100% {bottom: 185px;} } @media(max-width:768px) { .rnb2 { right: 0; } .rnb2 .rnb2_inner a { width: 55px; height: 55px; } .rnb2 .rnb2_inner a:last-child span img { margin-top: 15px; } .rnb2 .rnb2_inner a span { font-size: 11px; } .rnb2 .side_youtube_icon img { margin-top: 18px; } .rnb2 .rnb2_inner a span img { width: 20px; margin-right: 0; margin-top: 10px; } .rnb2 .rnb2_inner a span strong { font-size: 12px; } .m-on-off { line-height: 55px; } .rnb2 .rnb_item { opacity: 0; visibility: hidden; } .rnb2.show .rnb_item { opacity: 1; visibility: visible; } .rnb2 .equalogy { bottom: 125px; left: 4px; width: 44px; height: 44px; } @keyframes equalogy_move { 0% {bottom: 125px;} 50% {bottom: 130px;} 100% {bottom: 125px;} } } .paging {text-align: center; color: #949494; padding: 50px 0;} .paging span {margin: 0 15px; cursor: pointer !important;} .paging span.active {color: #000; font-weight: 600; text-decoration: underline;} .paging_1 {text-align: center; color: #949494; padding: 50px 0;} .paging_1 span {margin: 0 15px; cursor: pointer !important;} .paging_1 span.active {color: #000; font-weight: 600; text-decoration: underline;} section {font-family: 'Pretendard'; color: #222;} .txt_line {background-color: #F3EFEC; font-family: 'Pretendard'; text-align: center; padding: 25px; font-size: 18px; font-weight: 500; color: #222;} .txt_line.ico {display: flex; align-items: center; justify-content: center; gap: 30px;} .txt_line.ico span {display: flex; align-items: center; justify-content: center; font-weight: 700;} .txt_line.ico span img {margin-right: 10px;} .sec_tit {text-align: center;} .sec_tit h5 {font-family: "Noto Serif KR", serif; font-size: var(--font-regular); margin-bottom: 20px;}.sec_tit h3, .sec_tit h1 {font-family: 'SangBlueOgSerifRelgular' !important; margin-bottom: 10px; font-size: 54px;} .sec_tit span {font-family: 'Pretendard'; font-size: 24px; margin: 10px 0 50px 0; font-weight: 600; color: #aa8863; line-height: 1.5;} .sec_tit P {font-family: 'Pretendard'; font-size: var(--font-regular); line-height: 1.5;} .header {z-index: 1110; transition: 0.3s; position: absolute; top: 0; left: 0; width: 100%;} .header.active {position: fixed; top: 0; left: 0; width: 100%; background-color: #fff; z-index: 111;} .header.active .nav_global li>a {color: #222;} .header .logo_white {display: block;} .header .logo a img {max-width: 120px;} .header.active .logo_white {display: none;} .header .logo_black {display: none;} .header.active .logo_black {display: block;} .header nav {display: flex; justify-content: space-between; align-items: center; padding: 0 40px;} .header .nav_global ul {display: flex; align-items: center;} .header .nav_global ul>li {position: relative; padding: 30px 20px; box-sizing: border-box; flex: 1; white-space: nowrap;} .header .nav_global ul>li>a {font-family: 'SangBlueOgSansRegular' !important; font-size: 16px; position: relative;} .header .nav_global ul>li>a+ul {display: flex; flex-direction: column; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); z-index: 1; background-color: rgba(255, 255, 255, 0.75); min-width: 160px; opacity: 0; visibility: hidden; transition: 0.3s; padding: 10px 0; border-radius: 8px;} .header .nav_global ul>li:hover>a+ul {opacity: 1; visibility: visible;} .header .nav_global ul>li>a+ul li {padding: 10px; white-space: nowrap; text-align: center; font-size: 15px; width: 100%; transition: 0.3s;} .header .nav_global ul>li>a+ul li a {font-family: 'Pretendard'; color: #222;} .header .nav_global ul>li>a+ul li:hover a {text-decoration: underline; font-weight: 600; text-underline-offset: 5px;} .main_header {background-color: transparent;} .visual {position: relative; overflow: hidden;} .visual_img {position: relative; height: 100vh;} .visual img {height: 100%; width: 100%; object-fit: cover;} .visual .visual_bg {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} .visual_title {position: absolute; bottom: 15%; color: #fff; z-index: 1; left: 50%; transform: translateX(-50%); text-align: center; font-family: 'Pretendard'; white-space: nowrap;} .visual_title h5 {font-size: 26px; font-weight: 200; margin-bottom: 30px; letter-spacing: .5px;}.visual_title h2, .visual_title h1 {font-size: 100px; margin: 10px 0 15px 0; font-family: 'SangBlueOgSansRegular' !important; margin-top: 20px;} .visual_title h5 strong {font-weight: 400;} .visual_title span {font-size: 18px;} .visual_slide_equalogy h3 {font-size: 44px; line-height: 1.3; font-weight: 600; margin-bottom: 30px;} .slide-txt-bt {width: 2px; height: 59px; background-color: #808080; position: absolute; text-align: center; bottom: 0; margin: 0 auto; left: 50%; transform: translateX(-50%); z-index: 1;} .slide-txt-bt::before {content: ''; position: absolute; top: 0; left: 0; display: block; width: 2px; height: 20px; background-color: #fff; animation: upndown 3s infinite; -webkit-animation: upndown 1.8s infinite;} .slide-txt-bt::after {content: "Scroll"; position: absolute; top: -25px; left: 50%; transform: translateX(-50%); color: #fff; font-family: 'Pretendard';} .medical_law {text-align: center; max-width: 1200px; margin: 50px auto 0; line-height: 1.5;} .medical_law span {padding: 10px 30px; border: 1px solid #f4f4f4; color: #cdcdcd; display: inline-flex; align-items: center; font-size: 12;} .medical_law span img {margin-right: 30px;} @-webkit-keyframes upndown { 0% {top: 0px;} 100% {top: 40px;} } .footer {padding: 30px 30px 70px 30px; font-family: "Pretendard !important"; color: #222;} .footer .policy {display: flex; justify-content: center; margin-bottom: 70px; padding-bottom: 30px; border-bottom: 1px solid #efefef;} .footer .footer_wrap {display: flex; justify-content: center; max-width: 1240px; margin: 0 auto;} .footer .footer_info {display: flex; align-items: center;} .footer .footer_info .footer_logo {transform: scale(0.6);} .footer .footer_info span {line-height: 1.5; font-family: 'Pretendard' !important; font-weight: 200 !important;} .footer .sns_box {display: flex; gap: 20px; font-family: 'Pretendard' !important; font-weight: 200 !important;} .footer .copyright {font-size: 13px; color: #919090; margin-top: 10px; font-family: 'Pretendard' !important; font-weight: 200 !important;} .m_policy {display: none;} @media(max-width:1024px) { .visual_title {white-space: wrap;} } @media(max-width:768px) { .policy {display: none;} .m_policy {display: block;} .visual_slide_equalogy h3 {font-size: 18px; margin-bottom: 20px;} } .toggle_list {padding: 200px 0; max-width: 1200px; margin: 0 auto;}.toggle_list .sec_tit h3, .toggle_list .sec_tit h1 {font-family: "Marcellus", serif; font-weight: 700;} .toggle_list ul li {border-bottom: 1px solid #C1C1C1; padding: 25px 20px; cursor: pointer;} .toggle_list ul li .faq_tit {display: flex; justify-content: space-between; align-items: center; padding: 10px 0; font-size: var(--font-regular); color: #222; transition: 0.3s; font-weight: 600;} .toggle_list ul li .faq_tit.show {color: #7F5F3B; font-weight: 600;} .toggle_list ul li .faq_tit .mius_ico {display: none;} .toggle_list ul li .faq_tit h5 {font-size: 20px;} .toggle_list ul li .faq_tit.show .mius_ico {display: block;} .toggle_list ul li .faq_tit.show .plus_ico {display: none;} .toggle_list ul li .faq_contant {margin: 20px 0;} .toggle_list ul li .faq_contant p {line-height: 1.5; font-size: 20px; text-align: left;} .toggle_list ul li .faq_tit h5 {font-weight: 600 !important; text-align: start !important;} .common_youtube {padding-top: 200px; max-width: 1240px; margin: 0 auto;} .common_youtube .youtube_thumbnail a {width: 100%;} .common_youtube .youtube_thumbnail img {width: 100%;} .common_instagram {padding-top: 300px; max-width: 1240px; margin: 0 auto;} .main_wrap .common_instagram {padding-bottom: 200px;} .common_instagram .np_instagram ul {display: grid; grid-template-columns: repeat(6, 1fr); gap: 7px 10px} .common_instagram .np_instagram ul li img {width: 100%;} @media(max-width:1240px) {} @media(max-width:768px) { .common_instagram {padding: 200px 20px;} .common_instagram .np_instagram ul {grid-template-columns: repeat(3, 1fr); margin-top: 30px;} .np_instagram ul li:nth-child(4), .np_instagram ul li:nth-child(5), .np_instagram ul li:nth-child(6), .np_instagram ul li:nth-child(10), .np_instagram ul li:nth-child(11), .np_instagram ul li:nth-child(12) {display: none;} } .comparison-slider {position: relative; width: 100%; margin: auto; user-select: none; overflow: hidden; touch-action: pan-x; max-width: 1000px;} .comparison-slider>figure {margin: 0;} .comparison-slider>figure:last-of-type {position: absolute; top: 0; left: 0; height: 100%; clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%);} .comparison-slider>figure>img {width: 100%; height: 100%; display: block; object-fit: cover; pointer-events: none;} .comparison-slider>figure>figcaption {position: absolute; bottom: 0; display: inline-block; padding: 5px 10px; line-height: 1.5; background: rgba(30, 30, 30, 0.7); max-width: 30%; overflow: hidden; text-overflow: ellipsis; color: #f1f1f1; transition: opacity 0.35s, transform 0.35s;} .comparison-slider>figure:first-child>figcaption {left: 0;} .comparison-slider>figure:last-of-type>figcaption {right: 0;} .comparison-slider>figure>figcaption.hide {opacity: 0; transform: translate3d(-10px, 0, 0);} .comparison-slider>figure:last-of-type>figcaption.hide {transform: translate3d(10px, 0, 0);} .comparison-slider>.slider svg {width: 0px;} .comparison-slider>.slider {position: absolute; top: calc(50% - 20px); left: 50%; display: flex; width: 40px; height: 40px; justify-content: center; align-items: center; border-radius: 50%; transform: translate3d(-20px, 0, 0); background: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.45); text-align: center; cursor: grab;} .comparison-slider.dragging, .comparison-slider.dragging>.slider {cursor: grabbing;} .comparison-slider.dragging>.slider {background: #d2abff;} .comparison-slider>.slider>svg {pointer-events: none;} .figcaption_befo {left: 0;} .slider::after {content: ""; background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/rl_ico.svg'); background-position: center; background-size: cover; background-repeat: no-repeat; width: 40px; height: 40px;} .aside_txt {display: flex; flex-direction: column; overflow: hidden; width: 100%;} .aside_txt h1, .aside_txt .deco_tit {font-size: 140px; font-family: 'Marcellus' !important; color: #DECFB6; opacity: 0.2 !important; letter-spacing: -2px;} .aside_txt h1:last-child, .aside_txt .deco_tit:last-child {margin-left: auto;} .aside_txt .ani_le_txt {margin-right: auto; margin-left: 100px;} .aside_txt .ani_ri_txt {margin-right: 100px;} .vertical_line {width: 1px; height: 400px; background-color: #C4AF82; margin: 0 auto; padding: 100px 0; box-sizing: border-box;} .vertical_line.black {background-color: #000;} .instagram_section {padding-top: 400px; max-width: 1240px; margin: 0 auto;} .instagram_section .instagram_box ul {display: grid; grid-template-columns: repeat(6, 1fr); gap: 7px 10px} .instagram_section .instagram_box ul li img {width: 100%;} .header .m_logo {display: none;} .m_side {background-color: #dfd2b9; position: fixed; top: 0; left: 0; height: 100vh; width: 100%; z-index: 11111; opacity: 0; visibility: hidden; transition: 0.3s; font-family: 'Pretendard';} .m_side.show {opacity: 1; visibility: visible;} .m_side .top {display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding: 30px 40px 20px;} .m_side .top .symbol img {max-width: 40px;} .m_side .top .close {cursor: pointer; margin-bottom: 10px;} .m_side .top .close img {max-width: 24px;} .m_side ul li h5, .m_side ul li {text-align: left;} .m_side .m_nav_list {display: flex; flex-direction: column; gap: 20px; margin-left: 40px;} .m_side .m_nav_list>li>p {font-size: 24px; padding-bottom: 5px; font-family: 'SangBlueOgSansRegular'; cursor: pointer; margin-bottom: 10px; transition: 0.3s; text-align: left;} .m_side .m_nav_list>li>p.active {border-bottom: 1px solid #222;} .m_side .m_nav_list>li>ul li a {font-size: 16px; line-height: 1.5;} .m_br {display: none !important;} .p_br {display: block !important;} .pc_img {display: block !important;} .mb_img {display: none !important;} .pc_flex {display: block;} .m_menu {display: none;} .visual_title .mb_txt {display: none;} .main_visual_swiper .visual_title p a {border: 1px solid #fff; padding: 5px 25px; border-radius: 30px; font-family: 'Pretendard' !important; color: #fff;} .recommend_sec .sec08_box .txt_box p {font-family: "Noto Serif KR", serif !important;}.persoonal_review .sec_tit h3, .persoonal_review .sec_tit h1 {margin-bottom: 50px;} body .small_wrap .sec06 {background-color: transparent;} @media(max-width:1240px) { .header .pc_logo {display: none;} .header .m_logo {display: block;} .header .m_logo img {max-width: 100px;} .header {background-color: transparent; padding: 20px; box-sizing: border-box;} .header .nav_global {display: none;} .header nav {padding: 0;} .header .m_menu img {max-width: 37px; width: 100%; cursor: pointer;} .visual_title h5 {font-size: 20px; line-height: 1.5;}.visual_title h2, .visual_title h1 {font-size: 60px;} .footer {padding: 100px 20px;} .footer .sns_box {display: none;} .footer .footer_info {flex-direction: column;} .footer .footer_content .txt {text-align: center;} .footer .footer_info span {font-size: 14px;} .footer .footer_info span small {display: none;} .footer .footer_info .footer_logo {margin-right: 0; margin-bottom: 20px;} .footer .footer_info .footer_logo img {max-width: 250px;} .footer .policy {display: none;} .footer .copyright {text-align: center;} .footer .m_policy {margin: 20px 0; font-size: 12px; text-align: center; color: #444;} .m_menu {display: block;} .footer .copyright {font-size: 8px;} } @media(max-width:768px) { body.wrap .toggle_list .sec_tit h3, body.wrap .toggle_list .sec_tit h1 {font-size: 36px;}body .wrap .toggle_list .sec_tit h3, body .wrap .toggle_list .sec_tit h1 {font-size: 42px;} body .location {padding: 100px 20px; margin-top: 0;} body .location h2 {font-size: 42px;} body .location p {font-size: 16px; line-height: 1.5;} body .location p strong {font-size: 16px; font-weight: 600; margin-top: 22px; display: block} body .location .reservation_btns {gap: 5px;} body .location .reservation_btns a {font-size: 14px;} body .location .reservation_btns img {max-width: 27px;} body .volumn_wrap .sec07 .disc p {font-size: 12px; letter-spacing: 3px;} .footer .footer_info .footer_logo img {max-width: 100px;} .header {position: absolute; top: 0; left: 0; width: 100%;} .header.active {background-color: #fff;}.sec_tit h3, .sec_tit h1 {font-size: 42px; font-weight: 500; margin-bottom: 10px;} .aside_txt {padding: 0; text-align: center;} .pc_img {display: none !important;} .pc_flex {display: none !important;} .mb_img {display: block !important;} .m_br {display: block !important;} .p_br {display: none !important;} .volumn_wrap .visual_title h2, .volumn_wrap .visual_title h1 {font-size: 46px;} .more_ico {display: none;} .toggle_list .sec_tit a {margin-bottom: 20px;} .small_fit_wrap .sec11 .np_instagram ul {grid-template-columns: repeat(3, 1fr);} .toggle_list ul {padding: 0 20px;} .toggle_list ul li {padding: 20px 0;} .toggle_list ul li .faq_tit {font-size: 18px; line-height: 1.5; text-align: start !important;} .toggle_list ul li .faq_contant {margin: 0;} .toggle_list ul li .faq_contant p {font-size: 14px; text-align: left;} .toggle_list ul li .faq_tit h5 {font-size: 16px;} .toggle_list .sec_tit a {color: #fff; background-color: #dcccb2; padding: 10px 25px; border-radius: 20px; margin: 20px 0 0px;} .visual_title h5 strong {display: none;} .visual_title .mb_txt {display: block;} } .header nav li a {color: #fff;} .header.active nav li a {color: #222;} @media(max-width:768px) { .treatment_tit small, .main_sec_tit small {display: none;} } .visual_title strong {font-weight: 700;} .intro {position: relative; width: 100%; height: 100vh; overflow: hidden;} .intro .global_nav {position: absolute; top: 5%; right: 5%; background-color: #fff; padding: 45px 40px; font-family: 'Pretendard'; font-weight: 600; z-index: 1;} .intro .global_nav .country {flex-direction: column; align-items: center; text-align: center; justify-content: center; margin-top: 15px; display: none;} .intro .global_nav .country.show {display: flex;} .intro .global_nav .country img {margin-right: 5px;} .intro .global_nav .country a:first-child {font-weight: 600; text-decoration: underline; width: 66px; font-size: 16px; text-align: left;} .intro .global_nav .country a {margin: 7px 0; font-weight: 500; width: 50px; font-size: 14px;} .intro .global_nav span {cursor: pointer;} .intro .global_nav>span img {margin-left: 10px;} .muted_btn {position: absolute; bottom: 60px; left: 60px;} button {background-color: transparent; outline: none; border: none;} button img {cursor: pointer; vertical-align: bottom; max-width: 60px;} .muted_btn.active img:first-child {display: block;} .muted_btn img:first-child {display: none;} .muted_btn.active img:last-child {display: none;} .intro video {width: 100%;} .intro .intro_box {position: relative;} .intro .m_bg.bottom {position: absolute; bottom: 0; left: 0; width: 100%; height: 400px; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 12.5%, #000 38%);} .intro .m_bg.top {position: absolute; top: 0; left: 0; width: 100%; height: 400px; background: linear-gradient(0, rgba(255, 255, 255, 0.00) 12.5%, #000 63%);} .intro_m_logo {position: absolute; top: 55px; left: 50%; transform: translateX(-50%); z-index: 111;} .m_intro_list {position: absolute; bottom: 20px; left: 0; z-index: 111; width: 100%; display: flex; justify-content: space-between; text-align: center; gap: 5px; padding: 0 20px; box-sizing: border-box;} .m_intro_list a {color: #fff; border: 1px solid #fff; padding: 5px 20px; box-sizing: border-box; width: 100%; border-radius: 30px; font-size: 14px; font-family: 'Pretendard' !important;} .m_intro_list {position: absolute; bottom: 30px; left: 0; z-index: 111; width: 100%; justify-content: space-between; text-align: center; gap: 5px; padding: 0 20px; box-sizing: border-box; display: none;} .m_intro_list a {color: #fff; border: 1px solid #fff; padding: 5px 20px; box-sizing: border-box; width: 100%; border-radius: 30px; font-size: 14px; font-family: 'Pretendard';} .muted_btn {z-index: 1;} .m_intro_txt {position: absolute; left: 0px; bottom: 14%; z-index: 1; width: 100%; box-sizing: border-box; padding: 20px; display: none;} .m_intro_txt h1, .m_intro_txt a, .m_intro_txt p {color: #fff;} .m_intro_txt>div {display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;} .m_intro_txt>div>a img {max-width: 42px;} .m_intro_txt>div>a {display: flex; flex-direction: column; align-items: center;} .m_intro_txt h1 {font-size: 36px; font-family: 'SangBlueOgSansRegular' !important;} .m_intro_txt a span {margin-top: 5px;} .m_intro_txt p {font-family: 'Pretendard'; line-height: 1.4; font-size: 15px;} @media(max-width:1240px) { .m_intro_txt {display: block;} .intro .m_bg.bottom {height: 400px;} .intro .m_bg.top {height: 400px;} .muted_btn {position: absolute; bottom: 60px; right: auto; left: 60px;} .m_intro_list {display: flex;} .muted_btn {top: 20px; right: 30px; left: auto; width: 40px; height: 40px;} .muted_btn img {width: 40px;} .intro video {height: 100vh;} .intro .intro_box {display: flex; background-color: #000; flex-direction: column; justify-content: flex-end; height: 100vh;} .intro .global_nav {display: none;} } .main_wrap .main_visual {position: relative; height: 100vh;} .main_wrap .main_visual .main_visual_swiper {height: 100%;} .main_wrap .main_visual .swiper-slide {position: relative;} .main_wrap .main_visual .swiper-slide .visual_img img {width: 100%; max-width: none; height: 100%; position: relative; object-fit: cover;} .main_wrap .main_visual .main_bg {position: absolute; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.3); width: 100%; height: 100%; z-index: 1;} .main_wrap .main_visual .visual_title {position: absolute; bottom: 20%; left: 75px; z-index: 2; transform: translateX(0); text-align: left;} .main_wrap .main_visual .visual_title strong {color: #fff; font-family: "Pretendard" !important;} .main_wrap .main_visual .visual_title h2, .main_wrap .main_visual .visual_title h1 {margin: 20px 0 10px 0; color: #fff; letter-spacing: -0.1px;} .main_wrap .main_visual .visual_title p {font-size: 24px; color: #fff; font-family: "Pretendard" !important; letter-spacing: -0.1px; font-weight: 200 !important;} .main_wrap .main_visual .visual_title h3 {font-size: 30px; font-weight: 200 !important; line-height: 1.5; color: #fff; font-family: "Pretendard" !important; letter-spacing: -0.1px; text-align: left;} .main_wrap .main_visual .visual_title h3 strong {font-weight: 600 !important;} .main_wrap .main_visual .swiper-pagination-bullet {background-color: #EBE5DE !important; border-radius: 0; width: 2px; height: 25px; margin: 0 8px !important; opacity: 1 !important;} .main_wrap .main_visual .swiper-pagination-bullet-active {width: 4px; height: 50px; background-color: #fff !important;} .main_wrap .swiper-pagination-bullets {text-align: left !important; left: 75px !important; bottom: 10% !important; display: flex; align-items: center;} .main_wrap .sec01 ul li h3 span {vertical-align: text-bottom; display: inline;} @media(max-width:1024px) { .main_wrap .main_visual .swiper-slide .visual_img img{width: auto; position: absolute; right: -250px;} .main_wrap .sec04 .treatment_tit{width: 30%;} .main_wrap .sec04 .treatment_list ul li .thumbnail img{max-width: 250px;} .youtube-section .you_profile{left:0 !important; bottom: -180px !important; transform: scale(0.6) translate(-30%, 0) !important;} } @media(max-width:768px) { .main_wrap .main_visual .visual_title h3 {font-size: 18px;} .main_wrap .main_visual .visual_title h2, .main_wrap .main_visual .visual_title h1 {font-size: 41px;} .main_wrap .swiper-pagination-bullets {left: 4% !important;} .main_wrap .main_visual .swiper-slide .visual_img img {width: 100%; position: relative; right: 0;} .main_wrap .main_visual .swiper-slide .visual_img img {height: 100vh; object-fit: cover;} .main_wrap .main_visual .visual_title {left: 5%;} .main_wrap .swiper-pagination-bullets {left: 5%} .main_wrap .main_visual .visual_title p {font-size: 13px;} #header .m_header {position: fixed !important;} #header .m_header>.header_inner ul .xans-layout-orderbasketcount {display: none !important;} #header .m_header>.header_inner>h1 img {max-height: 40px !important;} } .main_wrap .sec01 {max-width: 1280px; margin: 0 auto; padding: 200px 0;} .main_wrap .sec01 .main_sec01_tit h2 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; letter-spacing: -0.1px;} .main_wrap .sec01 .main_sec01_tit p {font-size: var(--font-regular); margin-left: 95px; margin-top: 20px; line-height: 1.3; font-weight: 400 !important; letter-spacing: -0.1px;} .main_wrap .sec01 ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px 5px; margin-top: 60px;} .main_wrap .sec01 ul li {display: flex; align-items: flex-end;} .main_wrap .sec01 ul li .signature_txt {display: flex; flex-direction: column; padding-left: 30px; box-sizing: border-box;} .main_wrap .sec01 ul li .signature_txt p strong {font-weight: 600 !important;} .main_wrap .sec01 ul li h3 {font-size: 30px; font-family: 'SangBlueOgSerifRelgular' !important; line-height: 1.3; transition: all 0.5s; font-weight: 400; color: #222; text-align: left;} .main_wrap .sec01 ul li p {font-size: 15px; margin: 20px 0 40px; line-height: 1.5; font-weight: 400 !important;} .main_wrap .sec01 ul li .more a {font-size: 14px; border: 1px solid #222; color: #222; padding: 8px 25px; border-radius: 30px; transition: all 0.5s; font-family: 'Pretendard' !important;} .main_wrap .sec01 ul li:hover .more a {background-color: #222; color: #fff; border: 1px solid #222;} .main_wrap .sec01 ul li:hover h3 {text-decoration: underline 2px; text-underline-position: under; text-underline-offset: 3px;} @media(max-width:1240px) { .main_wrap .sec01 {max-width: 100%; padding: 200px 20px;} .main_wrap .sec01 ul li .signature_thumbnail img {max-width: 200px;} .main_wrap .sec01 ul li .signature_txt {padding-left: 10px;} .main_wrap .sec01 ul li h3 {font-size: 30px;} .main_wrap .sec01 ul li p {font-size: 14px; margin: 20px 0;} } @media(max-width:768px) { .main_wrap .sec01 {padding: 150px 20px; box-sizing: border-box;} .main_wrap .sec01 .main_sec01_tit p {margin-left: 0; font-size: 13px; line-height: 1.5;} .main_wrap .sec01 .main_sec01_tit h2 {font-size: 40px;} .main_wrap .sec01 .signature_thumbnail img {width: 100%;} .main_wrap .sec01 ul {grid-template-columns: repeat(1, 1fr); gap: 100px;} .main_wrap .sec01 ul li .signature_thumbnail {width: 40%;} .main_wrap .sec01 ul li .signature_txt {width: 60%; padding-left: 20px;} .main_wrap .sec01 ul li p {font-size: 12px; margin: 10px 0 20px 0;} .main_wrap .sec01 ul li h3 {font-size: 26px;} .main_wrap .sec01 ul li:hover h3 {text-decoration: unset;} } .main_wrap .sec02 {padding: 200px 0;} .main_wrap .sec02 .main_sec_tit {text-align: center; margin-bottom: 50px;} .main_wrap .sec02 .main_sec_tit h2 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; letter-spacing: -0.1px;} .main_wrap .sec02 .main_sec_tit span {margin-top: 30px; font-size: 24px; font-family: 'Pretendard' !important; letter-spacing: -0.1px;} .main_wrap .sec02 .main_sec02_vid img {width: 100%;} .main_wrap .sec02 .main_sec02_vid iframe {width: 100%;} .video_default {max-width: 1200px; margin: 0 auto;} @media(max-width:1240px) { .video_default {max-width: 100%} } @media(max-width:768px) { .main_wrap .sec02 {padding: 0;} .main_wrap .sec02 .main_sec_tit h2 {font-size: 40px;} .main_wrap .sec02 .main_sec_tit span {font-size: 16px; margin-top: 20px;} .main_wrap .sec02 .main_sec02_vid iframe {height: 300px;} } .main_wrap .sec03 {padding: 200px 0;} .main_wrap .sec03 p {font-family: "Noto Serif KR", serif !important; font-size: 22px; line-height: 1.5; text-align: center; margin-top: 50px;} .main_wrap .sec03 .main_sec_tit {text-align: center; margin-bottom: 50px;} .main_wrap .sec03 .main_sec_tit h2 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; letter-spacing: -0.1px;} .main_wrap .sec03 .main_sec_tit span {margin-top: 20px; font-size: 24px; font-family: 'Pretendard' !important; letter-spacing: -0.1px;} .main_wrap .sec03 .main_medical_swiper img {width: 100%;} .main_wrap .sec03 .main_medical_swiper .swiper-slide {transform: scale(0.7);} .main_wrap .sec03 .main_medical_swiper .swiper-slide.swiper-slide-next {transform: scale(1);} .main_wrap .sec03 .swiper-button-prev::after, .main_wrap .sec03 .swiper-button-next::after {content: "";} .main_wrap .sec03 .swiper-button-next {top: 50%; right: 29.5%; width: 50px; height: 50px;} .main_wrap .sec03 .swiper-button-prev {top: 50%; left: 29.5%; position: absolute !important; width: 50px; height: 50px;} @media(max-width:1024px) { .main_wrap .sec03 .main_medical_swiper .swiper-slide {transform: scale(1);} .main_wrap .sec03 .main_medical_swiper .swiper-slide.swiper-slide-next {transform: scale(1);} } @media(max-width:768px) { .main_wrap .sec03 {padding: 150px 0;} .main_wrap .sec03 p {font-size: 16px; font-weight: 600; margin-top: 30px;} .main_wrap .sec03 .main_medical_swiper {padding-left: 0px;} .main_wrap .sec03 .main_sec_tit h2 {font-size: 40px;} .main_wrap .sec03 .main_sec_tit span {font-size: 18px;} .main_wrap .sec03 .swiper-button-next, .main_wrap .sec03 .swiper-button-prev {display: none;} .main_wrap .sec03 .swiper-button-next {right: 11.5%;} .main_wrap .sec03 .swiper-button-prev {left: 5.5%;} } .main_wrap .sec04 {max-width: 1200px; margin: 0 auto; display: flex; height: auto; padding-bottom: 200px;} .main_wrap .sec04 .treatment_tit {width: 40%; margin-top: 400px; position: sticky; top: 100px; align-self: flex-start;} .main_wrap .sec04 .treatment_tit h2 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; line-height: 1.2; letter-spacing: -0.1px;} .main_wrap .sec04 .treatment_tit h5 {font-size: 24px; margin-top: 20px; font-family: 'Pretendard' !important; letter-spacing: -0.1px;} .main_wrap .sec04 .treatment_list {width: 60%; display: flex; gap: 50px;} .main_wrap .sec04 .treatment_list ul:last-child li {margin-top: 400px;} .main_wrap .sec04 .treatment_list ul:first-child li {margin-top: 400px;} .main_wrap .sec04 .treatment_list ul li {margin-top: 200px;} .main_wrap .sec04 .treatment_list ul li:hover .txt a {background-color: #222; color: #fff; transition: 0.3s;} .main_wrap .sec04 .treatment_list ul li .txt {text-align: center; margin-top: 20px; height: 200px;} .main_wrap .sec04 .treatment_list ul li .txt h4 {font-size: 44px; font-family: 'SangBlueOgSerifRelgular' !important;} .main_wrap .sec04 .treatment_list ul li .txt p {font-size: 18px; margin: 10px 0 30px 0; line-height: 1.5;} .main_wrap .sec04 .treatment_list ul li .txt a {border: 1px solid #222; padding: 7px 30px; border-radius: 30px; font-size: 14px; font-weight: 500; font-family: 'Pretendard' !important;} .main_wrap .sec04 .treatment_list ul li .abs_txt {display: none; position: absolute;} @media(max-width:1024px) { .main_wrap .sec04 {max-width: 100%; padding: 0 20px 200px;} .main_wrap .sec04 .treatment_list ul li .txt h4 {font-size: 30px;} .main_wrap .sec04 .treatment_list ul li .txt p {font-size: 16px; margin: 10px 0;} .main_wrap .sec04 .treatment_list {gap: 0; width: 65%;} .main_wrap .sec04 .treatment_tit {width: 35%;} .main_wrap .sec04 .treatment_tit h2 {font-size: 44px;} .main_wrap .sec04 .treatment_tit h5 {font-size: 20px; line-height: 1.5;} } @media(max-width:768px) { .main_wrap .sec04 {flex-direction: column; overflow: hidden; padding: 0 0 150px;} .main_wrap .sec04 .treatment_tit {width: 100%; text-align: center; position: unset; margin-top: 0; margin-bottom: 50px;} .main_wrap .sec04 .treatment_tit h2 {font-size: 40px;} .main_wrap .sec04 .treatment_tit h2 br {display: none;} .main_wrap .sec04 .treatment_tit h5 {font-size: 18px;} .main_wrap .sec04 .treatment_list {width: 100%; gap: 10px; padding: 0 20px; box-sizing: border-box;} .main_wrap .sec04 .treatment_list .thumbnail img {width: 100%;} .main_wrap .sec04 .treatment_list ul:first-child li:first-child {margin-top: 0;} .main_wrap .sec04 .treatment_list ul:last-child {margin: 0;} .main_wrap .sec04 .treatment_list ul li {margin-top: 425px; position: relative;} .main_wrap .sec04 .treatment_list ul li .txt h4 {font-size: 28px;} .main_wrap .sec04 .treatment_list ul li .txt p {font-size: 15px;} .main_wrap .sec04 .treatment_list ul li .abs_txt {display: block; font-size: 170px; opacity: 0.05; font-family: 'SangBlueOgSansRegular' !important; z-index: -1;} .main_wrap .sec04 .treatment_list ul li .abs_txt1 {top: 10%; left: 80%;} .main_wrap .sec04 .treatment_list ul li .abs_txt2 {top: 10%; right: 80%;} .main_wrap .sec04 .treatment_list ul li .abs_txt3 {top: 10%; left: 80%;} .main_wrap .sec04 .treatment_list ul li .abs_txt4 {top: 10%; right: 80%;} .main_wrap .sec04 .treatment_list ul li .abs_txt5 {top: 10%; left: 80%;} .main_wrap .sec04 .treatment_list ul li .abs_txt6 {top: 10%; right: 80%;} .main_wrap .sec04 .treatment_list ul:last-child li {margin-top: 500px;} .main_wrap .sec04 .treatment_list ul:last-child li:nth-child(2) h4 {font-size: 20px;} .main_wrap .sec04 .treatment_list ul:last-child li:nth-child(3) {margin-top: 550px;} } .main_wrap .sec05 {margin-top: 200px; padding-bottom: 200px;} .main_wrap .sec05 .main_sec_tit {text-align: center; margin-bottom: 50px;} .main_wrap .sec05 .main_sec_tit h2 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important;} .main_wrap .sec05 .main_sec_tit h5 {font-size: 24px; margin-top: 10px; font-family: 'Pretendard' !important;} .main_wrap .sec05 .box {display: flex; max-width: 100%; margin: 0 auto;} .main_wrap .sec05 .swiper-container {overflow: hidden; width: 100%; margin: 0 auto;} .main_wrap .sec05 .swiper-container-wrapper {display: flex; gap: 20px; flex-flow: column nowrap; position: relative; width: 100%; max-width: 1200px;} .main_wrap .sec05 .swiper-slide {text-align: center; background-size: cover; background-position: center; background-color: #fff; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center;} .main_wrap .sec05 .swiper-slide a {width: 100%;} .main_wrap .sec05 .swiper-button-next, .swiper-button-prev {color: #000;} .main_wrap .sec05 .swiper-button-next, .main_wrap .sec05 .swiper-button-prev {width: 44px;} .main_wrap .sec05 .swiper-button-next {left: auto; right: 9%; top: 110%;} .main_wrap .sec05 .swiper-button-prev {left: auto; right: 9%; top: -10%;} .main_wrap .sec05 .swiper-button-next::after, .main_wrap .sec05 .swiper-button-prev::after {content: "";} .main_wrap .sec05 .gallery-top {position: relative; width: 86%;} .main_wrap .sec05 .gallery-top img {border-radius: 300px 0 0 0;} .main_wrap .sec05 .gallery-top .swiper-slide {position: relative;} .main_wrap .sec05 .gallery-thumbs {width: 100%; height: 546px; padding-top: 10px;} .main_wrap .sec05 .gallery-thumbs .swiper-wrapper {flex-direction: row;} .main_wrap .sec05 .gallery-thumbs .swiper-slide {overflow: hidden; width: 25%; flex-flow: row nowrap; height: 100%; opacity: 0.75; cursor: pointer;} .main_wrap .sec05 .gallery-thumbs .swiper-slide-thumb-active {opacity: 1;} .main_wrap .sec05 .youtube_txt {width: 30%; display: flex; flex-direction: column; justify-content: center; align-items: center;} .main_wrap .sec05 .youtube_txt .youtube_txt_box {margin-left: 30px;} .main_wrap .sec05 .youtube_txt h5 {font-family: "Noto Serif KR", serif !important; font-size: 24px; font-weight: 500 !important; margin-bottom: 20px;} .main_wrap .sec05 .youtube_txt h4 {font-family: "Noto Serif KR", serif !important; font-size: 54px; margin: 20px 0 40px; font-weight: 600 !important;} .main_wrap .sec05 .youtube_txt p {font-size: 20px; line-height: 1.5; font-weight: 300 !important;} .main_wrap .sec05 .youtube_txt a img {width: 20px; margin-right: 8px;} .main_wrap .sec05 .youtube_txt a {margin-top: 60px; border: 1px solid #222; padding: 10px 30px; border-radius: 30px; display: flex; align-items: center; justify-content: center; font-family: 'Pretendard' !important; font-weight: 300 !important;} .main_wrap .sec05 .youtube_txt a strong {font-weight: 700 !important; font-family: 'Pretendard' !important;} .main_wrap .sec05 img {width: 100%; vertical-align: bottom;} .main_wrap .sec05 iframe {position: absolute; left: 0; top: 0; width: 100%; height: 100%;} @media (min-width: 1240px) { .main_wrap .sec05 .swiper-container {min-height: 320px;} .main_wrap .sec05 .swiper-container-wrapper {flex-flow: row nowrap;} .gallery-top {width: 80%; margin-right: 10px;} .main_wrap .sec05 .gallery-thumbs {width: 30%; padding: 0;} .main_wrap .sec05 .gallery-thumbs .swiper-wrapper {flex-direction: column;} .main_wrap .sec05 .gallery-thumbs .swiper-slide {flex-flow: column nowrap; width: 100%;} } @media(max-width:1240px) { .main_wrap .sec05 .main_sec_tit h5 {font-size: 20px;} .main_wrap .sec05 .main_sec_tit h2 {font-size: 40px;} .main_wrap .sec05 .main_sec_tit span {font-size: 14px;} .main_wrap .sec05 .box {flex-direction: column-reverse;} .main_wrap .sec05 .swiper-container-wrapper {gap: 0;} .main_wrap .sec05 .swiper-slide {height: 300px;} .main_wrap .sec05 .swiper-button-prev {left: 3%; right: auto; top: 80%; transform: rotate(-90deg);} .main_wrap .sec05 .swiper-button-next {left: auto; right: 3%; top: 80%; transform: rotate(-90deg);} .main_wrap .sec05 .swiper-button-next, .main_wrap .sec05 .swiper-button-prev {width: 30px;} .main_wrap .sec05 .gallery-top {width: 100%;} .main_wrap .sec05 .gallery-top img {border-radius: 100px 0 0 0;} .main_wrap .sec05 .gallery-thumbs {height: auto; width: 75%;} .main_wrap .sec05 .youtube_txt {align-items: flex-start; padding: 10px 20px 20px 20px; box-sizing: border-box; width: 100%;} .main_wrap .sec05 .youtube_txt .youtube_txt_box {margin-left: 30px;} .main_wrap .sec05 .youtube_txt h5 {font-size: 20px;} .main_wrap .sec05 .youtube_txt h4 {font-size: 52px; margin: 10px 0 20px;} .main_wrap .sec05 .youtube_txt p {font-size: 14px;} .main_wrap .sec05 .youtube_txt p br {display: none;} .main_wrap .sec05 .youtube_txt a {margin-top: 25px;} .main_wrap .sec05 .youtube_txt .youtube_txt_box {text-align: center;} } .common_instagram.sec13 .sec_tit h3, .common_instagram.sec13 .sec_tit h1 {font-family: "Marcellus", serif; margin-bottom: 50px; font-size: 60px; color: #222;} .common_instagram.sec13 .sec_tit h5 {margin-bottom: 50px; font-family: 'Pretendard' !important;} .main_wrap .sec07 {padding: 200px;} .main_wrap .sec07 .main_sec_tit {text-align: center; margin-bottom: 50px;} .main_wrap .sec07 .main_sec_tit h2 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important;} .main_wrap .sec07 .main_sec_tit h5 {font-size: 24px; margin-top: 10px; font-family: 'Pretendard' !important;} .main_wrap .sec07 .box {margin: 0 auto; max-width: 1200px; box-sizing: border-box;} .main_wrap .sec07 .box img {width: 100%;} @media(max-width:1024px) { .main_wrap .sec07 {padding: 200px 20px;} } @media(max-width:768px) { .main_wrap .sec07 {padding: 150px 0} .main_wrap .sec07 .box {padding: 0 20px; padding-left: 0;} .main_wrap .sec07 .main_sec_tit h2 {font-size: 40px;} .main_wrap .sec07 .main_sec_tit h5 {font-size: 20px; line-height: 1.5;} } .np_wrap .sec04 {padding-top: 200px; max-width: 1200px; margin: 0 auto;}.np_wrap .sec04 .sec_tit h3, .np_wrap .sec04 .sec_tit h1 {font-size: 54px; font-family: 'Pretendard'; line-height: 1.3; font-weight: 500;} .np_wrap .sec04 .sec_tit h3 strong {font-family: 'AritaBuriSB'; font-weight: 600;} .np_wrap .sec04 .sec04_visual {text-align: center; margin: 100px 0 50px 100px;} .np_wrap .sec04 .sec04_visual img {max-width: 782px; width: 100%;} .np_wrap .sec04 p {line-height: 1.5; font-size: var(--font-regular); text-align: center;} .np_wrap .sec04 p strong {font-weight: 700; color: #0a0a50; font-size: 24px; text-decoration: underline; text-decoration-thickness: 2px; text-underline-position: under} .np_wrap .sec06 .swiper-button-next img, .swiper-button-prev img {width: 100%;} .np_wrap .sec07 {margin: 0 auto;} .np_wrap .sec07>h2 {font-size: 54px; text-align: center; font-family: 'AritaBuriM'; margin: 70px 0;} .np_wrap .sec07 .vertical_line {text-align: center;} .np_wrap .sec07 .sec07_box {display: flex; gap: 20px;} .np_wrap .sec07 .sec07_box>div {width: 50%; text-align: center; border-left: 1px solid #efefef; border-right: 1px solid #EFEFEF;} .np_wrap .sec07 .sec07_box>div:nth-child(1) .box_tit {background-color: #EFEFEF;} .np_wrap .sec07 .sec07_box>div:nth-child(2) .box_tit {background-color: #0A0A50; color: #fff;} .np_wrap .sec07 .sec07_box>div:last-child {border-left: 1px solid #0B0A50; border-right: 1px solid #0B0A50;} .np_wrap .sec07 .sec07_box>div:last-child .box_content:last-child {border-bottom: 1px solid #0B0A50;} .np_wrap .sec07 .sec07_box>div h5 {font-size: var(--font-medium); font-weight: 600;} .np_wrap .sec07 .sec07_box>div .box_tit {padding: 30px 20px;} .np_wrap .sec07 .sec07_box>div .box_content {text-align: center;} .np_wrap .sec07 .sec07_box>div .box_content {padding: 30px; color: #707070; border-bottom: 1px solid #EFEFEF;} .np_wrap .sec07 .sec07_box>div .box_content span {margin-bottom: 15px; font-weight: 600; font-size: var(--font-small);} .np_wrap .sec07 .sec07_box>div .box_content p {line-height: 1.5;} .np_wrap .sec08 {overflow: hidden; padding: 200px 360px;}.np_wrap .sec08 .sec_tit h3, .np_wrap .sec08 .sec_tit h1 {font-family: 'Pretendard'; line-height: 1.3; font-weight: 600; font-size: 40px;} .np_wrap .sec08 .sec08_box>div {display: flex;} .np_wrap .sec08 .sec08_box>div img {width: 100%;} .arrow_box {display: flex; justify-content: center; flex-direction: row-reverse; margin-top: 100px; gap: 50px;} .arrow_box>div {width: auto;} .main_wrap .sec_footer {overflow: hidden;} .main_wrap .sec_footer .map {display: flex; justify-content: center; align-items: center; background-color: #FAFAFA;} .main_wrap .sec_footer .map_img img {width: 100%;} .main_wrap .sec_footer .map>div {width: 50%;} .main_wrap .sec_footer .map_info {display: flex; flex-direction: column; justify-content: center; align-items: center;} .main_wrap .sec_footer .map_info h2 {font-family: 'SangBlueOgSerifRelgular' !important; font-size: 60px; margin: 20px 0 40px 0;} .main_wrap .sec_footer .map_info h5 {font-family: 'Pretendard' !important; font-size: 14px; letter-spacing: 10px; font-weight: 200 !important;} .main_wrap .sec_footer .map_info .txt ul li {display: flex; margin-bottom: 20px;} .main_wrap .sec_footer .map_info .txt ul li .infomation {display: flex; flex-direction: column;} .main_wrap .sec_footer .map_info .txt ul li>.infomation span {margin: 3px; font-family: 'Pretendard' !important; font-weight: 200 !important;} .main_wrap .sec_footer .map_info .txt ul li:last-child {margin-bottom: 50px;} .main_wrap .sec_footer .map_info .txt ul li>span:first-child {width: 100px; font-weight: 700; font-family: 'Pretendard' !important; font-weight: 500 !important;} .main_wrap .sec_footer .reservation_btns {display: flex; justify-content: flex-start; align-items: center; gap: 20px;} .main_wrap .sec_footer .reservation_btns a {background-color: #000; color: #fff !important; display: flex; align-items: center; padding: 10px 30px; justify-content: center;} .main_wrap .sec_footer .reservation_btns a span {color: #fff; font-family: 'Pretendard' !important;} @media(max-width:1024px) { .main_wrap .sec_footer .map>div {width: 100%;} .main_wrap .sec_footer .map {flex-direction: column;} .main_wrap .sec_footer .map .map_info {margin: 100px 0;} } @media(max-width:768px) { .header .logo a img { max-width: 100px; width: 100%; height: auto;} .main_wrap .sec_footer .map .map_info {margin: 50px 0;} .main_wrap .sec_footer .map .map_info .tit {text-align: center; margin-bottom: 20px;} .main_wrap .sec_footer .map_info h2 {font-size: 36px; font-family: 'SangBlueOgSerifRelgular';} .main_wrap .sec_footer .map_info h5 {font-size: 10px;} .main_wrap .sec_footer .map_info .txt ul li {flex-direction: column;} .main_wrap .sec_footer .map_info .txt ul li>span:first-child {margin-bottom: 10px;} .main_wrap .sec_footer .map ul {padding: 0 20px;} .main_wrap .sec_footer .reservation_btns {gap: 10px; justify-content: center;} .main_wrap .sec_footer .reservation_btns a {font-size: 12px; padding: 10px 18px;} .main_wrap .sec_footer .reservation_btns>div {width: 40%; justify-content: center;} } .location {margin-top: 200px; padding: 250px 0; border-bottom: 1px solid #CCCCCC; border-top: 1px solid #CCCCCC; text-align: center;} .location h2 {font-size: 80px; font-family: 'SangBlueOgSansRegular'} .location p {margin: 30px 0 40px; font-size: 20px;} .location p strong {font-family: "Marcellus", serif;} .location .reservation_btns {display: flex; justify-content: center; align-items: center; gap: 20px;} .location .reservation_btns a {background-color: #000; color: #fff; display: flex; align-items: center; padding: 10px 30px;} .sec_tit h3, .sec_tit h1 {color: #222;} .comparison_before {left: 0;} .header .m_menu_ico_black {display: none;} .header .m_menu_ico_white {display: block;} .header.active .m_menu_ico_black {display: block;} .header.active .m_menu_ico_white {display: none;} @media(max-width:768px){ .main{overflow-x: hidden;} } @media (max-width: 768px) { .main_wrap .sec04 .treatment_list { display: flex; flex-direction: column; gap: 80px; width: 100%; padding: 0 20px; box-sizing: border-box; } .main_wrap .sec04 .treatment_list ul { display: contents; } .main_wrap .sec04 .treatment_list ul li, .main_wrap .sec04 .treatment_list ul:first-child li, .main_wrap .sec04 .treatment_list ul:last-child li, .main_wrap .sec04 .treatment_list ul:last-child li:nth-child(3), .main_wrap .sec04 .treatment_list ul:first-child li:first-child, .main_wrap .sec04 .treatment_list ul:first-child li:nth-child(3) { margin-top: 0; width: 100%; } .main_wrap .sec04 .treatment_list ul li .thumbnail img { width: 100%; } .main_wrap .sec04 .treatment_list ul li { overflow: hidden; } .main_wrap .sec04 .treatment_list ul li .abs_txt1, .main_wrap .sec04 .treatment_list ul li .abs_txt3, .main_wrap .sec04 .treatment_list ul li .abs_txt5 { left: auto; right: 0; } .main_wrap .sec04 .treatment_list ul li .abs_txt2, .main_wrap .sec04 .treatment_list ul li .abs_txt4, .main_wrap .sec04 .treatment_list ul li .abs_txt6 { right: auto; left: 0; } .main_wrap .sec04 .treatment_list_item1 { order: 1; } .main_wrap .sec04 .treatment_list_item2 { order: 2; } .main_wrap .sec04 .treatment_list_item3 { order: 3; } .main_wrap .sec04 .treatment_list_item4 { order: 4; } .main_wrap .sec04 .treatment_list_item5 { order: 5; } .main_wrap .sec04 .treatment_list_item6 { order: 6; } } /* ===== /assets/inc/style3.css ===== */ .promotion_wrap .sec01 {padding-top: 200px; max-width: 800px; margin: 0 auto;} .promotion_wrap .sec01 ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 25px} .promotion_wrap .sec01 ul li a {width: 100%;} .promotion_wrap .sec01 ul li .promotion_thumbnail {position: relative;} .promotion_wrap .sec01 ul li .promotion_title {position: absolute; left: 50%; bottom: 0px; width: 100%; transform: translateX(-50%); background-color: rgba(255, 255, 255, 0.7); padding: 20px; box-sizing: border-box; width: 100%; transition: 0.3s;} .promotion_wrap .sec01 ul li:hover .promotion_title {font-weight: 700; padding: 40px 20px;} .promotion_wrap .sec01 ul li h5 {text-align: center; margin: 10px 0; font-size: var(--font-regular);} .promotion_wrap .sec01 ul li img {width: 100%;} .promotion_wrap .sec02 {padding-top: 200px; max-width: 800px; margin: 0 auto; font-family: 'Pretendard';}.promotion_wrap .sec_tit h3, .promotion_wrap .sec_tit h1 {margin-bottom: 30px;} .promotion_wrap .sec02 ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 25px} .promotion_wrap .sec02 ul li .promotion_thumbnail {position: relative;} .promotion_wrap .sec02 ul li .beauty_title {position: absolute; left: 50%; bottom: 0px; width: 100%; transform: translateX(-50%); background-color: rgba(255, 255, 255, 0.5); padding: 20px; box-sizing: border-box; transition: 0.3s;} .promotion_wrap .sec02 ul li a {width: 100%;} .promotion_wrap .sec02 ul li h5 {text-align: center; margin: 10px 0; font-size: var(--font-regular);} .promotion_wrap .sec02 ul li img {width: 100%;} .promotion_wrap .sec02 ul li:hover .beauty_title {font-weight: 700; padding: 40px 20px;} .medical_staff_wrap .sec0 {padding-top: 100px; margin-top: 100px;} .medical_staff_wrap .sec0 .sec0_box img {width: 100%;} .medical_staff_wrap .sec0 .sec0_box video {width: 100%;} .medical_staff_wrap .sec0 .sec0_box h3 {font-family: "Marcellus", serif; font-size: 72px; color: #222; text-align: center; margin-bottom: 20px;} .medical_staff_wrap .sec0 .sec0_box h5 {font-family: "Noto Serif KR", serif; font-size: 24px; text-align: center; margin-bottom: 40px; font-weight: 600;} .medical_staff_wrap .sec0 .sec0_box p {font-size: 20px; text-align: center; line-height: 1.3; font-weight: 600; margin: 40px 0 40px 0;} .medical_staff_wrap .sec0 .sec0_box .t_sign {text-align: center; margin: 50px 0 100px;} .medical_staff_wrap .sec0 .sec0_box .t_sign img {max-width: 218px;} .medical_staff_wrap .sec01 { max-width: 100%; margin: 0 auto; padding: 200px 0 0; } .medical_staff_wrap .sec01_1 { padding-top: 200px; margin-bottom: 200px; } .medical_staff_wrap .doctor_box { position: relative; padding-top: 100px; } .medical_staff_wrap .sec01 .doctor { position: relative; background-color: #fcfcfc; padding: 60px 40px 0; } .medical_staff_wrap .sec01 .doctor .doctor_title { position: relative; z-index: 1; text-align: center; margin-bottom: 50px; } .medical_staff_wrap .sec01 .doctor .doctor_title span { display: block; font-weight: 300; letter-spacing: 15px; margin-bottom: 30px; } .medical_staff_wrap .sec01 .doctor .doctor_title h4 { margin: 0; font-family: "Noto Serif KR", serif; font-size: 36px; font-weight: 600 !important; } .medical_staff_wrap .sec01 .doctor .doctor_title h4 small { font-size: 24px; font-weight: 500; margin-left: 10px; } .medical_staff_wrap .sec01 .doctor .doctor1_box { position: relative; z-index: 1; display: flex; justify-content: center; align-items: center; gap: 60px; text-align: left; } .medical_staff_wrap .sec01 .doctor .doctor1_box > div { width: 50%; } .medical_staff_wrap .doctor_visual { display: flex; align-items: center; justify-content: center; gap: 40px; width: 100%; } .medical_staff_wrap .doctor2 .doctor_visual { flex-direction: row-reverse; } .medical_staff_wrap .doctor_word { width: 380px; flex: 0 0 380px; } .medical_staff_wrap .doctor_word p { margin: 0 0 40px; font-size: 14px; line-height: 1.8; word-break: keep-all; font-weight: 500; } .doctor1 .sign, .doctor2 .sign { text-align: center; margin-top: 80px; } .doctor1 .sign img, .doctor2 .sign img { max-width: 220px; width: 100%; max-height: 100px; object-fit: contain; } .medical_staff_wrap .doctor_thsumbnail { position: relative; width: 360px; max-width: 360px; flex: 0 0 360px; z-index: 10; } .medical_staff_wrap .doctor_thsumbnail img { display: block !important; width: 100% !important; height: auto !important; max-height: 800px; object-fit: contain; opacity: 1 !important; visibility: visible !important; } .medical_staff_wrap .doctor_history { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; } .medical_staff_wrap .doctor_history ol { margin: 0; padding: 0; list-style: none; } .medical_staff_wrap .doctor_history ol:first-child { width: 40%; } .medical_staff_wrap .doctor_history ol + ol { width: 60%; } .medical_staff_wrap .doctor_history li { margin-bottom: 15px; font-size: 16px; line-height: 1.5; } .medical_staff_wrap .doctor_history .history_main { position: relative; padding-left: 14px; font-size: 16px; font-weight: 700; } .medical_staff_wrap .doctor_history .history_main::before { content: "·"; position: absolute; left: 0; top: 0; } .medical_staff_wrap .doctor_history .history_sub { margin-top: -10px; margin-bottom: 8px; padding-left: 14px; color: #888; font-size: 12px; font-weight: 300; } .medical_staff_wrap .doctor_history .history_blank { height: 22px; margin: 0; } .medical_staff_wrap .doctor2 .doctor1_box { flex-direction: row-reverse; text-align: right; margin-right: 100px; } .medical_staff_wrap .doctor2 .doctor_history { text-align: left; } .medical_staff_wrap .doctor2 .doctor_history ol { width: 100% !important; } .medical_staff_wrap .doctor2 .history_main { margin-left: 120px; } .medical_staff_wrap .doctor2 .history_main::before { right: auto; } .medical_staff_wrap .doctor2 .history_sub { padding-left: 0; padding-right: 14px; } .medical_staff_wrap .doctor_names { position: absolute; inset: 0; z-index: 0; display: flex; justify-content: space-between; align-items: center; padding: 0 5%; pointer-events: none; } .medical_staff_wrap .mo_doctor_names { display: none; } .medical_staff_wrap .doctor_name { font-family: "Marcellus", serif; font-size: 220px; color: #b8b8b8; opacity: 0.1; line-height: 1; } .medical_staff_wrap .doctor_name:nth-child(1) { transform: translateY(-280px); } .medical_staff_wrap .doctor_name:nth-child(2) { transform: translateY(0); } .medical_staff_wrap .doctor_name:nth-child(3) { transform: translateY(280px); } @media (max-width: 768px) { .medical_staff_wrap .sec01 { padding: 0; } .medical_staff_wrap .sec01_1 { margin-bottom: 0; } .medical_staff_wrap .doctor_box { padding-top: 0; } .medical_staff_wrap .sec01 .doctor { padding: 150px 20px; box-sizing: border-box; } .medical_staff_wrap .sec01 .doctor .doctor_title { margin-bottom: 30px; } .medical_staff_wrap .sec01 .doctor .doctor_title span { margin-bottom: 18px; font-size: 11px; letter-spacing: 5px; } .medical_staff_wrap .sec01 .doctor .doctor_title h4 { font-size: 28px; } .medical_staff_wrap .sec01 .doctor .doctor_title h4 small { font-size: 14px; margin-left: 6px; } .medical_staff_wrap .sec01 .doctor .doctor1_box { flex-direction: column; gap: 0; text-align: center; } .medical_staff_wrap .sec01 .doctor2 .doctor1_box { flex-direction: column; margin-right: 0; text-align: center; } .medical_staff_wrap .sec01 .doctor .doctor1_box > div { width: 100%; } .medical_staff_wrap .doctor_visual, .medical_staff_wrap .doctor2 .doctor_visual { position: relative; width: fit-content; margin: 0 auto; } .medical_staff_wrap .doctor_word, .doctor1 .sign, .doctor2 .sign { display: none; } .medical_staff_wrap .doctor_thsumbnail img { display: block !important; width: 100% !important; height: auto !important; object-fit: contain; } .medical_staff_wrap .doctor_names { display: none; } .medical_staff_wrap .doctor_thsumbnail { position: relative; z-index: 2; width: 100%; max-width: 220px; margin: 0 auto; } .medical_staff_wrap .mo_doctor_names { position: absolute; right: -50%; bottom: 0; z-index: 1; display: flex; flex-direction: column; align-items: flex-end; pointer-events: none; } .medical_staff_wrap .mo_doctor_names span { font-family: "Sangbleu OG Serif", "Marcellus", serif; font-size: 74px; line-height: 0.95; color: #b8b8b8; opacity: 0.08; } .medical_staff_wrap .doctor_name { font-size: 74px; line-height: 0.95; opacity: 0.08; transform: none !important; } .medical_staff_wrap .doctor_history { flex-direction: column; gap: 0; margin-top: 60px; text-align: center !important; } .medical_staff_wrap .doctor_history ol, .medical_staff_wrap .doctor_history ol:first-child, .medical_staff_wrap .doctor_history ol + ol { width: 100% !important; } .medical_staff_wrap .doctor_history li { margin: 3px 0; font-size: 14px; line-height: 1.45; font-weight: 300 !important; } .medical_staff_wrap .doctor_history .history_main { padding-left: 0; padding-right: 0; font-size: 16px; font-weight: 600; } .medical_staff_wrap .doctor_history .history_main::before { position: static; margin-right: 4px; } .medical_staff_wrap .doctor2 .history_main { margin-left: 0px; } .medical_staff_wrap .doctor2 .history_main::before { right: auto; } .medical_staff_wrap .doctor_history .history_sub, .medical_staff_wrap .doctor2 .history_sub { margin-top: 0; margin-bottom: 4px; padding-left: 0; padding-right: 0; color: #777; font-size: 13px; font-weight: 300; } .medical_staff_wrap .doctor_history .history_blank { height: 16px; } } .medical_staff_wrap .sec02 { background-color: #F8F8F8; padding: 200px 0; margin-top: 300px; } .medical_staff_wrap .sec02 .container { max-width: 1400px; margin: 0 auto; } .medical_staff_wrap .sec02 .sec_tit { margin-bottom: 120px; } .his-content { position: relative; } .his-track { position: absolute; left: 50%; top: 0; width: 1px; height: 100%; background-color: #dfdfdf; } .his-thumb { position: absolute; left: 50%; top: 0; width: 1px; height: 35px; background-color: #9F886D; } .his-thumb:after { content: ""; position: absolute; left: -5px; bottom: 0; width: 11px; height: 11px; background: url('https://cheongdamcircle.cafe24.com/web/upload/img/history-marker.png') no-repeat center / 100% auto; } .history-list { position: relative; } .history-item { position: relative; width: calc(50% - 60px); margin-bottom: 120px; } .history-item:not(:first-child) { margin-top: -100px; } .history-item.left { margin-right: auto; text-align: right; } .history-item.right { margin-left: auto; text-align: left; } .history-item dt { font-weight: 400; font-size: 40px; margin-bottom: 50px; font-family: 'SangBlueOgSerifRelgular'; } .history-item dd {margin: 20px 0;} .history-main {display: block; font-size: 1.18rem; color: #222; font-weight: 300; line-height: 1.55;} .history-desc {display: block; margin-top: 2px; padding-left: 15px; font-size: 14px; color: #888; line-height: 1.5;} .history-item.left .history-desc {padding-left: 0; padding-right: 18px;} #header1 { display: none; } @media(max-width:768px) { .medical_staff_wrap .sec02 { margin-top: 100px; padding: 100px 0; } .his-track, .his-thumb { left: 22px; } .history-item { width: 100%; margin: 0 0 50px; padding-left: 50px; padding-right: 10px; text-align: left !important; display:block; box-sizing: border-box; } .history-item:not(:first-child) { margin-top: 20px; } .history-item dt { margin-bottom: 25px; font-size: 30px; } .history-item dd { color: #606060; font-size: 11px; line-height: 1.3; margin: 5px 0; } .history-main{ font-size:13px; line-height:1.45; } .history-desc{ font-size:11px; line-height:1.45; margin-top: 3px; padding-left: 12px; font-size: 10px; } } .medical_staff_wrap .sec03 {padding: 200px 40px 0; box-sizing: border-box;} .medical_staff_wrap .sec03 .award_swiper {padding: 50px 0 100px; box-sizing: border-box;} .medical_staff_wrap .sec03 .swiper-pagination-bullet {background-color: #cccccc; opacity: 1;} .medical_staff_wrap .sec03 .swiper-pagination-bullet-active {background-color: #222222; width: 25px; border-radius: 5px;} .medical_staff_wrap .sec03 ul {display: flex; justify-content: center; margin-top: 100px; align-items: center;} .medical_staff_wrap .sec03 .swiper-slide {text-align: center; cursor: pointer;} .medical_staff_wrap .sec03 .swiper-slide img {width: 100%;} .medical_staff_wrap .sec03 .swiper-slide h5 {font-size: var(--font-medium); font-weight: 500; margin-bottom: 10px; font-family: "Marcellus", serif;} .medical_staff_wrap .sec03 .swiper-slide .award_tit {margin-top: 40px;} @media(max-width:768px) { .medical_staff_wrap .sec0 .sec0_box h3 {font-size: 28px;} .medical_staff_wrap .sec0 .sec0_box h5 {font-size: 18px;} .history-item { width: 100%; margin: 0 0 50px; padding-left: 70px; text-align: left !important; } .history-item.right, .history-item.left:not(:first-child) { margin-top: 20px; } .medical_staff_wrap .innerbox {flex-direction: column; padding-left: 60px;} } .academy_wrap .sec01 {max-width: 1240px; margin: 0 auto; padding-top: 200px;} .academy_wrap .sec01 ul {display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 10px;} .academy_wrap .sec01 ul li {margin: 10px 0 30px 0; position: relative;} .academy_wrap .sec01 ul li .academy_thumbnail {position: relative;} .academy_wrap .sec01 ul li h5 {position: absolute; left: 50%; bottom: 0px; width: 100%; transform: translateX(-50%); text-align: center; font-size: var(--font-Xsmall); margin-top: 20px; line-height: 1.3; background-color: rgba(255, 255, 255, 0.7); padding: 20px; font-weight: 500; transition: 0.3s; box-sizing: border-box; min-height: 86px; display: flex; align-items: center; justify-content: center;} .academy_wrap .sec01 ul li:hover h5 {font-weight: 600; font-size: var(--font-small); padding: 40px 20px;} .academy_wrap .sec01 ul li img {width: 100%;} @media(max-width:1240px) { .academy_wrap .sec01 ul {grid-template-columns: repeat(2, 1fr)} } @media(max-width:768px) { .visual_title h2, .visual_title h1 {font-size: 28px;} .academy_wrap .visual_title h2, .academy_wrap .visual_title h1 {line-height: 1.3;} .academy_wrap .sec01 ul {grid-template-columns: repeat(1, 1fr)} .academy_wrap .sec01 ul li {pointer-events: none;} .academy_wrap .sec01 ul li h5 {font-size: 14px; padding: 10px; min-height: 76px;} } .circle_tv_wrap .sec_tit h3, .circle_tv_wrap .sec_tit h1 {font-family: "Marcellus", serif !important; color: #222; font-weight: 500 !important; margin-bottom: 50px;} .circle_tv_wrap .sec img {width: 100%;} .circle_tv_wrap .sec01 {max-width: 1240px; margin: 0 auto; padding-top: 200px;} .circle_tv_wrap .sec01 ul {display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 10px;} .circle_tv_wrap .sec01 ul li {margin: 10px 0 30px 0} .circle_tv_wrap .sec01 ul li > div {width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: #fff;} .circle_tv_wrap .sec01 ul li > div a {display: block; width: 100%; height: 100%;} .circle_tv_wrap .sec01 ul li > div a img {display: block; width: 100%; height: 100%; object-fit: cover;} .circle_tv_wrap .sec01 ul li h5 {text-align: center; font-size: var(--font-Xsmall); margin-top: 20px; line-height: 1.3; padding: 0 10px;} .circle_tv_wrap .sec02 {max-width: 1240px; margin: 0 auto; padding-top: 200px;} .circle_tv_wrap .sec02 ul {display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 10px;} .circle_tv_wrap .sec02 ul li {margin: 10px 0 30px 0} .circle_tv_wrap .sec02 ul li h5 {margin-top: 15px;} .circle_tv_wrap .sec02 ul li img {width: 100%;} .circle_tv_wrap .sec03 {max-width: 1200px; margin: 0 auto; padding-top: 200px;} .circle_tv_wrap .sec03 ul {display: flex; justify-content: center;} .circle_tv_wrap .youtube_loading { margin-top: 10px; } .circle_tv_wrap .youtube_loading .loading_text { text-align: center; font-size: var(--font-Xsmall); color: #666; margin-bottom: 25px; } .circle_tv_wrap .youtube_loading .loading_grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; } .circle_tv_wrap .youtube_loading .loading_grid li { margin: 10px 0 30px 0; } .circle_tv_wrap .youtube_loading .thumb_skeleton { width: 100%; aspect-ratio: 16 / 9; border-radius: 2px; background: linear-gradient(90deg, #f1f1f1 25%, #e5e5e5 37%, #f1f1f1 63%); background-size: 400% 100%; animation: youtubeSkeleton 1.4s ease infinite; } .circle_tv_wrap .youtube_loading .text_skeleton { width: 80%; height: 18px; margin: 18px auto 0; border-radius: 999px; background: linear-gradient(90deg, #f1f1f1 25%, #e5e5e5 37%, #f1f1f1 63%); background-size: 400% 100%; animation: youtubeSkeleton 1.4s ease infinite; } @keyframes youtubeSkeleton { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } } @media(max-width:768px) { .circle_tv_wrap .youtube_loading .loading_grid { grid-template-columns: repeat(1, 1fr); } .circle_tv_wrap .youtube_loading .loading_text { font-size: 14px; margin-bottom: 15px; } .circle_tv_wrap .youtube_loading .text_skeleton { height: 14px; margin-top: 12px; } } @media(max-width:768px) { .circle_tv_wrap .sec {padding: 100px 20px; box-sizing: border-box;}.circle_tv_wrap .sec_tit h3, .circle_tv_wrap .sec_tit h1 {font-weight: 500 !important; margin-bottom: 25px;} .circle_tv_wrap .sec02 ul, .circle_tv_wrap .sec01 ul {grid-template-columns: repeat(1, 1fr);} .circle_tv_wrap .sec02 ul li h5, .circle_tv_wrap .sec01 ul li h5 {font-size: 14px; margin-top: 10px; line-height: 1.5;} } .conclerge_wrap .sec01 {max-width: 1500px; margin: 0 auto; padding-top: 200px;}.conclerge_wrap .sec01 .sec_tit h3, .conclerge_wrap .sec01 .sec_tit h1 {margin-bottom: 30px;} .conclerge_wrap .table {width: 100%; text-align: center;} .conclerge_wrap .table th {background: #F6F6F6; padding: 25px 0; font-weight: 700; font-size: var(--font-small);} .conclerge_wrap .table td {padding: 25px 20px; border-top: 1px solid #ccc; word-break: break-all;} .conclerge_wrap .table td:nth-child(1) {width: 10%;} .conclerge_wrap .table td:nth-child(2) {width: 60%; text-align: left;} .conclerge_wrap .table td:nth-child(3) {width: 10%;} .conclerge_wrap .table td:nth-child(4) {width: 10%;} .conclerge_wrap .table td:nth-child(5) {width: 10%;} .conclerge_wrap .table--min {min-width: 700px;} @media screen and (max-width:768px) { .conclerge_wrap .table-box {overflow-x: auto;} } .small_fit_wrap .sec01 {padding-top: 200px; max-width: 100%;} .small_fit_wrap .sec01 .samll_sec01_thumbnail {margin-top: 30px;} .small_fit_wrap .sec01 .samll_sec01_thumbnail img {width: 100%;} .small_fit_wrap .sec01 .samll_sec01_txt {text-align: center; margin: 50px 0; line-height: 1.4; font-family: "Noto Serif KR", serif; font-size: 24px; font-weight: 600;} .small_fit_wrap .sec01 .sign {text-align: center;} .small_fit_wrap .sec01 .sec01_box {max-width: 1040px; margin: 0 auto;} .small_fit_wrap .sec01 .sec01_box img {width: 100%;} .small_fit_wrap .sec01 .sec01_box h3 {font-family: "Marcellus", serif; font-size: 44px; color: #222; text-align: center; margin-bottom: 40px;} .small_fit_wrap .sec01 .sec01_box p {font-size: 20px; text-align: center; line-height: 1.3; font-weight: 600; margin-top: 100px; font-family: 'AritaBuri'; transform: skew(-0.1deg);} .small_fit_wrap .sec01 .sec01_box .t_sign {text-align: center; margin: 50px 0 100px;} .small_fit_wrap .sec01 .sec01_box .t_sign img {max-width: 218px;} .small_fit_wrap .txt_line.ico span {font-weight: 700;} @media(max-width:1240px) { .small_wrap .sec01 {padding: 200px 0 100px;} .small_wrap .sec01 .txt h1, .small_wrap .sec01 .txt .deco_tit {font-size: 70px;} .small_fit_wrap .sec01 .samll_sec01_txt {font-size: 20px; padding: 20px;} } .small_fit_wrap .sec02 {max-width: 1240px; margin: 0 auto; padding-top: 200px;} .small_fit_wrap .sec02 .sec02_tit {position: relative;} .small_fit_wrap .sec02 .sec02_tit img {position: absolute; left: -100px; top: 50%; transform: translateY(-50%);} .small_fit_wrap .sec02 .sec02_tit span {font-family: 'AritaBuri'; font-size: 20px; letter-spacing: 10px; font-weight: 600; display: block;} .small_fit_wrap .sec02 .sec02_tit h3 {font-size: 80px; margin: 20px 0 40px; font-family: 'SangBleu OG Sans'; position: relative; display: inline-block; padding-right: 20px;} .small_fit_wrap .sec02 .sec02_tit h3::after {content: ""; position: absolute; left: 100%; width: 100%; height: 1.5px; bottom: 15px; background-color: #000;} .small_fit_wrap .sec02 .sec02_tit p {font-family: 'AritaBuri'; font-size: 24px; font-weight: 600;} .small_fit_wrap .sec02 .sec02_visual {text-align: center;} .small_fit_wrap .sec02 .sec02_visual .sec02_visual_img {margin-top: 100px;} .small_fit_wrap .sec02 .sec02_visual .sec02_visual_info {padding: 100px 0 100px 0; background-color: #FBFBFB; margin-top: -100px;} .small_fit_wrap .sec02 .sec02_visual .sec02_visual_info div {padding: 100px 0;} .small_fit_wrap .sec02 .sec02_visual .sec02_visual_info div h5 {font-size: 40px; font-family: "AritaBuri", serif; margin: 20px 0 30px 0; font-weight: 500;} .small_fit_wrap .sec02 .sec02_visual .sec02_visual_info p {font-family: 'AritaBuri'; font-size: 22px; margin: 70px 0; line-height: 1.5; font-weight: 600;} .small_fit_wrap .sec02 .sec02_visual .sec02_visual_info p:first-child {font-weight: 600;} .small_fit_wrap .sec02 .sec02_visual .sec02_visual_info .p_2 {color: #5f5f5f; font-size: 18px; font-family: 'Pretendard'; font-weight: 500;} .small_fit_wrap .sec02 .sec02_visual .sec02_visual_info .p_3 {color: #7f5f3b;} .small_fit_wrap .sec02 .sec02_visual .sec02_visual_info .p_3 b {text-decoration: underline;} @media(max-width:1240px) { .small_wrap .sec02 .txt span {font-size: 12px;} } .small_fit_wrap .sec03 {padding-top: 400px;}.small_fit_wrap .sec03 .sec_tit h3, .small_fit_wrap .sec03 .sec_tit h1 {font-family: 'AritaBuri'; font-weight: 500;} .small_fit_wrap .sec03 .sec03_box {max-width: 1240px; margin: 0 auto; text-align: center;} .small_fit_wrap .sec03 .sec03_box h5 {font-size: 22px; line-height: 1.5;} .small_fit_wrap .sec03 .slide_toggle {max-width: 1000px; margin: 0 auto; display: flex; width: 100%; gap: 50px; justify-content: space-between;} .small_fit_wrap .sec03 .slide_toggle .toggle_box {margin: 30px 0;} .small_fit_wrap .sec03 .slide_toggle .toggle_tit .content_show {display: none;} .small_fit_wrap .sec03 .slide_toggle .toggle_tit .content_none {display: block;} .small_fit_wrap .sec03 .slide_toggle .toggle_tit.show .content_show {display: block;} .small_fit_wrap .sec03 .slide_toggle .toggle_tit.show .content_none {display: none;} .small_fit_wrap .sec03 .slide_toggle .toggle_tit.show span {font-weight: 600; color: #000;} .small_fit_wrap .sec03 .slide_toggle .toggle_tit {display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #000; padding: 10px 0; font-size: var(--font-regular); align-items: center; color: #5D5D5D; cursor: pointer;} .small_fit_wrap .sec03 .slide_toggle .toggle_content {padding: 20px; color: #989898; line-height: 1.7;} .small_fit_wrap .sec03 .slide_toggle .toggle_content p {text-align: left; font-size: 20px;} .small_fit_wrap .sec03 .slide_toggle_wrap {flex: 1;} .small_fit_wrap .sec04 {padding-bottom: 200px; background-repeat: no-repeat;} .small_fit_wrap .sec04 .sec04_box {max-width: 1040px; margin: 0 auto;} .small_fit_wrap .sec04 .sec04_box .small_fit_part {display: flex; align-items: center;} .small_fit_wrap .sec04 .sec04_box>.small_fit_part>div {width: 50%;} .small_fit_wrap .sec04 .sec04_box .small_fit_part img {width: 100%;} .small_fit_wrap .sec04 .sec04_box .small_fit_part .fit_part {position: relative;} .small_fit_wrap .sec04 .sec04_box .small_fit_part .bg {position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; background-color: rgba(0, 0, 0, 0.5); z-index: 1; visibility: hidden; border-radius: 28px; transition: 0.3s;} .small_fit_wrap .sec04 .sec04_box .small_fit_part .none {display: none;} .small_fit_wrap .sec04 .sec04_box .small_fit_part .over {display: block;} .small_fit_wrap .sec04 .sec04_box .fit_part:hover .bg {visibility: visible; opacity: 1;} .small_fit_wrap .sec04 .sec04_box .fit_part:hover .none {display: block;} .small_fit_wrap .sec04 .sec04_box .fit_part:hover .over {display: none;} .small_fit_wrap .sec04 .sec04_box .small_fit_part h4 {font-size: 40px; font-family: "Marcellus", serif; color: #6D6C68;} .small_fit_wrap .sec04 .sec04_box .small_fit_part h5 {font-size: 24px; margin: 20px 0 30px; color: #6D6C68;} .small_fit_wrap .sec04 .sec04_box .small_fit_part p {font-size: 20px; color: #A5A5A3; line-height: 1.5;} .small_fit_wrap .sec04 .sec04_box .small_fit_part .more {margin-top: 50px;} .small_fit_wrap .sec04 .sec04_box .small_fit_part .more a {font-family: "Marcellus", serif; font-size: 20px; position: relative;} .small_fit_wrap .sec04 .sec04_box .small_fit_part .more a::after {content: ""; position: absolute; bottom: -10px; width: 100%; left: 0; background-color: #000; height: 1px;} .small_fit_wrap .sec04 .sec04_box .small_fit_part .txt {padding-left: 95px; box-sizing: border-box;} .small_fit_wrap .sec04 .sec04_box .small_fit_part:nth-child(2) .txt {padding-left: 0; padding-right: 95px; text-align: right;} .small_fit_wrap .sec04 .sec04_box .small_fit_part2 {flex-direction: row-reverse;} .small_fit_wrap .sec05 .txt {max-width: 1200px; margin: 0 auto;} .small_fit_wrap .sec05 .txt h3 {font-size: 54px; font-family: 'Marcellus';} .small_fit_wrap .sec05 .txt h1, .small_fit_wrap .sec05 .txt .deco_tit {font-size: 240px; font-family: 'Marcellus'; color: #bfbfbf; opacity: 0.15; margin-bottom: -60px;} .small_fit_wrap .sec05 .txt span {font-size: 30px; margin: 20px 0 50px; font-weight: 600;} .small_fit_wrap .sec05 .txt p {line-height: 1.5; font-size: 20px;} .small_fit_wrap .sec05 .txt p strong {margin-top: 10px; display: inline-block; padding: 8px 30px; background-color: #CCB897; color: #fff; border-radius: 30px; font-weight: 600; position: relative;} .small_fit_wrap .sec05 .txt p strong::after {content: ""; position: absolute; bottom: 7px; left: 50%; transform: translateX(-50%); width: 94%; background-color: #fff; height: 2px;} .small_fit_wrap .sec05 ul {display: flex; justify-content: center; gap: 30px; margin-top: 50px;} .small_fit_wrap .sec05 ul li {position: relative;} .small_fit_wrap .sec05 ul li img {vertical-align: bottom; width: 100%;} .small_fit_wrap .sec05 ul li .bg {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); border-radius: 60px;} .small_fit_wrap .sec06 {margin: 200px 0; max-width: 100%; text-align: center; position: relative; font-family: 'Pretendard'; background-position: center; background-size: cover; background-repeat: no-repeat;} .small_fit_wrap .sec06.first {background-image: url('/assets/img/youlbit/images/smallfit_keypoint_11.webp'); opacity: 1; transition: all .3s;} .small_fit_wrap .sec06.second {background-image: url('/assets/img/youlbit/images/smallfit_keypoint_22.webp'); opacity: 1; transition: all .3s;} .small_fit_wrap .sec06.thr {background-image: url('/assets/img/youlbit/images/smallfit_keypoint_33.webp'); opacity: 1; transition: all .3s;} .small_fit_wrap .sec06 ul {justify-content: space-between; gap: 0; align-items: center;} .small_fit_wrap .sec06 ul li {width: 100%; padding: 120px 40px 360px 0; position: relative;} .small_fit_wrap .sec06 ul li.li_second {padding: 120px 40px 320px 0;} .small_fit_wrap .sec06 ul li h5 {margin-top: 50px; font-weight: 500; font-family: "SangBlueOgSerifRelgular";} .small_fit_wrap .sec06 ul li h3 {margin: 30px 0 50px; font-family: "Noto Serif KR", serif; font-size: 34px; font-weight: 600;} .small_fit_wrap .sec06 ul li p {line-height: 2; font-size: 20px;} .small_fit_wrap .sec06 ul li .sec06_num {position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); font-size: 200px; font-family: 'SangBlueOgSerifRelgular'; display: inline-block; line-height: 0.5; color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #fff;} .small_fit_wrap .sec06 li:hover .sec06_num {color: #fff; -webkit-text-stroke-width: 2px; -webkit-text-stroke-color: transparent;} .small_fit_wrap .sec06 li .txt_box {opacity: 0;} .small_fit_wrap .sec06.first li.li_first .txt_box {opacity: 1;} .small_fit_wrap .sec06.second li.li_second .txt_box {opacity: 1;} .small_fit_wrap .sec06.thr li.li_thr .txt_box {opacity: 1;} @media(max-width:1024px){ } .small_fit_wrap .sec07 {padding: 200px 0;} .small_fit_wrap .sec08 .txt p {line-height: 1.5; font-size: 24px;} .small_fit_wrap .sec08 .txt p strong {color: #aa8863; font-weight: 700; margin: 20px 0 30px; display: inline-block; font-size: 24px;} .small_fit_wrap .sec08 ul li:nth-child(2) {flex: 1;} .small_wrap .sec08 ul {padding: 40px 0 0;} .face_wrap .sec08 ul {padding: 40px 100px;} @media(max-width:768px) { .small_fit_wrap .sec08 .txt p {padding: 0 20px;} .small_fit_wrap .sec08 .txt {margin-bottom: 30px;} } .small_fit_wrap .sec10 {padding: 200px 0; max-width: 1200px; margin: 0 auto;} @media(max-width:768px) { .small_fit_wrap .sec10 {padding: 150px 0;} .small_fit_wrap .sec10 .sec_tit a {margin-bottom: 20px;} .small_fit_wrap .sec10 ul {padding: 0 20px;} .small_fit_wrap .sec10 ul li .faq_tit {font-size: 18px; line-height: 1.5;} .small_fit_wrap .sec10 ul li .faq_contant {margin: 0;} .small_fit_wrap .sec10 ul li .faq_contant p {font-size: 14px;} } .small_fit_wrap .sec11 {padding-top: 400px; max-width: 1200px; margin: 0 auto;} .small_fit_wrap .sec11 .np_instagram ul {display: grid; grid-template-columns: repeat(6, 1fr); gap: 7px 10px} .small_fit_wrap .sec11 .np_instagram ul li img {width: 100%;} @media(max-width:768px) { .small_fit_wrap .sec11 {padding: 100px 0;} .small_fit_wrap .sec11 .np_instagram ul {grid-template-columns: repeat(3, 1fr);} } .face_small_ban {padding: 0 20px !important;} .small_wrap .sec01 {padding: 400px 0 200px; max-width: 1200px; margin: 0 auto;} .small_wrap .sec01 .txt {text-align: center; position: relative;} .small_wrap .sec01 .txt h1, .small_wrap .sec01 .txt .deco_tit {font-family: "Marcellus", serif; font-size: 160px; white-space: nowrap; position: absolute; bottom: 60%; left: 50%; transform: translateX(-50%); color: #dcccb2; opacity: 0.2; z-index: 1;} .small_wrap .sec01 .txt h5 {font-family: "Noto Serif KR", serif; font-size: 24px; font-weight: 500;} .small_wrap .sec01 .txt h3 {font-family: "Noto Serif KR", serif; font-size: 44px; margin: 20px 0 50px; color: #222;} .small_wrap .sec01 .txt h3 strong {font-weight: 700; font-family:"Noto Serif KR", serif !important;} .small_wrap .sec01 .txt p {display: flex; align-items: center; justify-content: center; color: #888888; margin-bottom: 30px;} @media(max-width:768px) { .small_wrap .sec01 {padding: 150px 0;} .small_wrap .sec01 .txt h1, .small_wrap .sec01 .txt .deco_tit {font-size: 70px;} .small_wrap .visual_title h2, .small_wrap .visual_title h1 {font-size: 52px;} } @media(max-width:500px) { .small_wrap .visual_title h2, .small_wrap .visual_title h1 {font-size: 36px;} .small_wrap .sec01 .txt h1, .small_wrap .sec01 .txt .deco_tit {font-size: 56px;} } .face_wrap .sec01 {max-width: 100%; padding: 350px 0 100px;} .face_wrap .sec01 .face_yotube img {width: 100%;} .small_wrap .sec02 {padding: 200px 0; max-width: 1240px; margin: 0 auto;} .small_wrap .sec02 .txt {text-align: center; position: relative;} .small_wrap .sec02 .txt h2:not(.deco_tit) {font-family: "Noto Serif KR", serif; font-size: 44px; margin: 100px 0 30px; font-weight: 700;} .small_wrap .sec02 .txt p {font-family: 'Pretendard'; font-size: 24px; color: #5f5f5f; margin-bottom: 50px; line-height: 1.5;} .small_wrap .sec02 .txt p strong {font-weight: 700 !important;} .small_wrap .sec02 .txt h4 {font-family: "Noto Serif KR", serif; font-size: 34px; line-height: 1.5; font-weight: 400;} .small_wrap .sec02 .txt h1, .small_wrap .sec02 .txt .deco_tit {font-family: "Marcellus", serif; font-size: 120px; color: #dcccb2; opacity: 0.2; position: absolute; left: 50%; top: 92%; transform: translateX(-50%);} .small_wrap .sec02 .txt span {font-family: 'Pretendard'; font-size: 16px; letter-spacing: 15px; font-weight: 200 !important;} @media(max-width:1240px) { .small_wrap .sec02 .txt span {font-size: 12px; letter-spacing: 6px;} } @media(max-width:768px) { .small_wrap .sec02 {padding: 150px 0 200px;} .small_wrap .sec02 .txt {padding: 0 20px;} .small_wrap .sec02 .txt h2:not(.deco_tit) {font-size: 34px; margin: 30px 0 50px;} .small_wrap .sec02 .txt p {font-size: 16px;} .small_wrap .sec02 .txt h4 {font-size: 26px;} .small_wrap .sec02 .txt h1, .small_wrap .sec02 .txt .deco_tit {font-size: 80px; white-space: nowrap; top: 100%;} } .small_wrap .line_sun {text-align: center;} .small_wrap .sec03 {padding: 150px 0 200px; max-width: 1340px; margin: 0 auto; text-align: center;} .small_wrap .sec03 .box {display: flex; justify-content: center; gap: 90px; align-items: center;} .small_wrap .sec03 .box>div {flex: 1;} .small_wrap .sec03 .box .thumbnail img {width: 100%;} .small_wrap .sec03 .box .txt {text-align: left; flex: 1.1;} .small_wrap .sec03 .box .txt img {position: absolute; top: 30%; right: 15%; transform: translateY(-70%);} .small_wrap .sec03 .box .txt h3 {color: #aa8863; font-size: 44px; font-family: "Noto Serif KR", serif; line-height: 1.5; font-weight: 700; position: relative; display: inline-block; text-align: left;} .small_wrap .sec03 .box .txt p {font-family: 'Pretendard'; font-size: 20px; line-height: 1.5; margin-top: 50px; font-weight: 400;} .small_wrap .sec03 .box .txt p strong {font-weight: 700 !important; text-decoration: underline; text-underline-offset: 5px;} @media(max-width:1240px) { .small_wrap .sec03 .box {flex-direction: column; padding: 0 20px;} } @media(max-width:768px) { .small_wrap .sec03 {padding: 150px 0;} .small_wrap .sec03 .box .thumbnail img {width: 70%;} .small_wrap .sec03 .box .txt h3 {font-size: 34px; text-align: center; width: 100%;} .small_wrap .sec03 .box .txt {text-align: center;} .small_wrap .sec03 .box .txt img {max-width: 100px;} .small_wrap .sec03 .box .txt p strong, .small_wrap .sec03 .box .txt p {font-size: 18px;} } @media(max-width:768px) { .small_wrap .sec03 .box .txt p strong, .small_wrap .sec03 .box .txt p {font-size: 15px;} } .small_wrap .sec04 {padding: 200px 0; text-align: center; position: relative; font-family: 'Pretendard';} .small_wrap .sec04 .txt {max-width: 1200px; margin: 0 auto;} .small_wrap .sec04 .bg {position: absolute; left: 50%; bottom: 10%; transform: translateX(-50%); z-index: -1; width: 100%;} .small_wrap .sec04 .bg img {width: 100%;} .small_wrap .sec04 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; margin-bottom: 10px; color: #222;} .small_wrap .sec04 .txt span {font-size: 24px; margin: 10px 0 50px; font-weight: 700 !important;} .small_wrap .sec04 .txt p {font-size: 20px; line-height: 1.5;} .small_wrap .sec04 .txt p b {font-weight: 600 !important;} .small_wrap .sec04 .txt p strong {font-weight: 600 !important; color: #A98963;} .small_wrap .sec04 .snag {margin-top: 50px;} .small_wrap .sec04 .snag img {width: 100%; max-width: 600px;} @media(max-width:768px) { .small_wrap .sec04 .bg{bottom:35%;width:200%;} .small_wrap .sec04 {margin-top: 0; padding: 150px 0;} .small_wrap .sec04 .txt {padding: 0 20px;} .small_wrap .sec04 .txt h3 {font-size: 38px;} .small_wrap .sec04 .txt span {font-size: 18px; line-height: 1.5;} .small_wrap .sec04 .txt p {font-size: 15px;} .small_wrap .sec04 .snag {width: 80%; margin: 100px auto 0;} } .small_wrap .sec05 {padding: 200px 0; text-align: center; position: relative; font-family: 'Pretendard';} .small_wrap .sec05 .txt {max-width: 1200px; margin: 0 auto;} .small_wrap .sec05 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; color: #222;} .small_wrap .sec05 .txt span {font-size: 24px; margin: 20px 0 50px; font-weight: 600 !important;} .small_wrap .sec05 .box {display: flex;} .small_wrap .sec05 .box img {width: 100%; vertical-align: bottom;} .small_wrap .sec05 .box>div {flex: 1.4;} .small_wrap .sec05 .box>ul {flex: 2;} .small_wrap .sec05 .box>ul li {border-bottom: 1px solid #D2D2D2; cursor: pointer;} .small_wrap .sec05 .box>ul li:first-child {border-top: 1px solid #D2D2D2;} .small_wrap .sec05 .box>ul li a.active {background-color: #F9F9F9;} .small_wrap .sec05 .box>ul li span {padding: 20px; margin-right: 30px;} .small_wrap .sec05 .box>ul li p {font-size: 20px;} .small_wrap .sec05 .box>ul li h5 {font-size: 20px; font-weight: 700; color: #aa8863; margin-top: 10px;} .small_wrap .sec05 .m_strong {display: none;} @media(max-width:768px) { .small_wrap .sec05 {padding: 150px 0;} .small_wrap .sec05 .txt {padding: 0 20px;} .small_wrap .sec05 .txt h3 {font-size: 38px;} .small_wrap .sec05 .txt span {font-size: 18px; line-height: 1.5;} .small_wrap .sec05 .txt p {font-size: 16px;} .small_wrap .sec05 .m_strong {display: block;} .small_fit_wrap .sec05 .txt p strong {display: none;} .small_fit_wrap .sec05 .m_strong {margin: 30px 0;} .small_fit_wrap .sec05 .m_strong span {margin: 10px 0 0; background-color: #cdb896; color: #fff; padding: 5px 10px; border-radius: 30px; font-size: 14px;} .small_fit_wrap .sec05 ul {flex-direction: column; gap: 0;} } .small_wrap .sec06 {margin: 200px 0; padding: 0; max-width: 100%; text-align: center; position: relative; font-family: 'Pretendard'; background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/facesmall_sec06_bg.png'); background-position: center; background-size: cover; background-repeat: no-repeat; background-color: transparent;} .small_wrap .sec06 .txt {max-width: 1200px; margin: 0 auto;} .small_wrap .sec06 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; margin-bottom: 20px; color: #222;} .small_wrap .sec06 .txt h1, .small_wrap .sec06 .txt .deco_tit {font-size: 140px; font-family: 'Marcellus'; color: #bfbfbf; opacity: 0.15; margin-bottom: -40px;} .small_wrap .sec06 .txt span {font-size: 24px; margin: 10px 0 30px; font-weight: 600;} .small_wrap .sec06 .txt p {line-height: 1.5; font-size: 20px;} .small_wrap .sec06 .txt p strong {margin-top: 20px; display: inline-block; padding: 8px 40px; background-color: #CCB897; color: #fff; border-radius: 30px; font-weight: 600; position: relative; font-size: 22px;} .small_wrap .sec06 .txt p strong::after {content: ""; position: absolute; bottom: 7px; left: 50%; transform: translateX(-50%); width: 91%; background-color: #fff; height: 2px;} .small_wrap .sec06 ul {display: flex; justify-content: center; gap: 10px; margin: 50px auto 0;} .small_wrap .sec06 ul li {position: relative;} .small_wrap .sec06 ul li .thumbnail img {width: 100%;} .small_wrap .sec06 ul li .txt {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; z-index: 1;} .small_wrap .sec06 ul li .txt h3 {font-size: 84px; font-family: 'SangBlueOgSerifRelgular'; color: #fff; opacity: 0.3; margin-bottom: 0; transition: 0.3s;} .small_wrap .sec06 ul li .txt span {font-size: 20px; white-space: nowrap; color: #fff; font-weight: 600; transition: 0.3s; margin: 10px 0 0;} .small_wrap .sec06 ul li .txt p {display: none; color: #222222; white-space: nowrap; line-height: 1.5; font-size: 16px; font-weight: 600;} .small_wrap .sec06 ul li:nth-child(2) .txt p {color: #fff;} .small_wrap .sec06 ul li:hover .txt p {display: block;} .small_wrap .sec06 ul li:hover .txt h3 {display: none;} .small_wrap .sec06 ul li:hover .txt span {display: none;} .small_wrap .sec06 ul li img {vertical-align: bottom;} .small_wrap .sec06 ul li .bg {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.2); border-radius: 50px;} .small_wrap .sec06 ul li:hover .bg {display: none;} .small_wrap .sec06 .m_box {display: none;} .small_fit_wrap .sec06 {background-color: transparent;} .body_wrap.small_wrap .sec06 ul li .txt p {color: #fff} .body_wrap.small_wrap .sec06 ul li:nth-child(3) .txt p {color: #000} @media(max-width:1024px) { .body_wrap.small_wrap .sec06 ul li .txt p {font-size: 14px;} } @media(max-width:768px) { .small_wrap .sec06 {margin: 150px 0;} .small_wrap .sec06 ul li .txt h3 {font-size: 60px;} .small_wrap .sec06 .m_box {display: block;} .small_wrap .sec06 .m_box .m_box_con {padding: 50px 0 0 0; background-position: center; background-size: cover; background-repeat: no-repeat;} .small_wrap .sec06 .m_box .m_box_con h5 {font-family: 'Marcellus'; font-size: 20px; margin: 20px 0 30px;} .small_wrap .sec06 .m_box .m_box_con h3 {font-size: 22px; font-family: "Noto Serif KR", serif; font-weight: 600;} .small_wrap .sec06 .m_box .m_box_con p {margin: 30px 0; line-height: 1.5;font-size:14px;} .small_wrap .sec06 .m_box .m_box_con .sec06_num {font-family:'SangBlueOgSerifRelgular'; font-size: 80px; color: #fff; margin: -10px 0 50px;} .small_wrap .sec06 .m_box .m_box_con1 {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_small_sec0601.png');} .small_wrap .sec06 .m_box .m_box_con2 {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_small_sec0602.png');} .small_wrap .sec06 .m_box .m_box_con3 {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_small_sec0603.png');} .small_wrap .smallfit_point_swiper .m_box_con1 {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_small_sec0601.png');} .small_wrap .smallfit_point_swiper .m_box_con2 {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_small_sec0602.png');} .small_wrap .smallfit_point_swiper .m_box_con3 {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_small_sec0603.png');} .small_wrap .sec06.thr .box {display: none;} } .small_wrap .sec07 {padding: 200px 0; text-align: center; position: relative; font-family: 'Pretendard'; max-width: 1200px; margin: 0 auto;} .small_wrap .sec07 .sec07_box {display: flex;} .small_wrap .sec07 .sec07_box .sec07_thumbnail {width: 40%; position: relative;} .small_wrap .sec07 .sec07_box .sec07_thumbnail img {width: 100%; vertical-align: bottom;} .small_wrap .sec07 .sec07_box .txt_box {width: 60%; text-align: left; margin-right: 50px;} .small_wrap .sec07 .sec07_box .txt_box h2 {font-family: 'SangBlueOgSerifRelgular'; font-size: 54px;} .small_wrap .sec07 .sec07_box .txt_box p {font-family: "Noto Serif KR", serif !important; font-size: 24px; margin-top: 15px; font-weight: 600;} .small_wrap .sec07 .sec07_box .txt_box ul {margin-top: 40px;} .small_wrap .sec07 .sec07_box .txt_box ul li {font-size: 20px; padding: 20px 0; border-top: 1px solid #EBEBEB; font-weight: 600; display: flex; align-items: center;} .small_wrap .sec07 .sec07_box .txt_box ul li:last-child {border-bottom: 1px solid #EBEBEB;} .small_wrap .sec07 .sec07_box .txt_box ul li span:first-child {font-family: 'SangBleuOGSerif-Medium';} .small_wrap .sec07 .sec07_box .txt_box ul li span:nth-child(2) {color: #9D9D9D; margin: 0 8px; font-size: 32px;} .small_wrap .sec07 .sec07_box .txt_box ul li span:nth-child(3) {font-weight: 400;} .small_wrap .sec07 .sec07_box .txt_box .inqu a {background-color: #DCCCB2; color: #fff; padding: 12px 36px; border-radius: 36px; font-size: 26px; margin-top: 20px; font-weight: 600;} .small_wrap .sec07 .sec07_box .txt_bg {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; width: 200%;} .small_wrap .sec07 .sec07_box .txt_bg img {width: 100%;} .small_wrap .sec07 .sec07_box .txt_box .inqu {margin-top: 80px} .small_fit_wrap .sec07 .sec07_box .txt_box .inqu {margin-top: 20px;} @media(max-width:1240px) { .small_wrap .sec07 {padding: 150px 0;} .small_wrap .sec07 .sec07_box {flex-direction: column-reverse;} .small_wrap .sec07 .sec07_box .sec07_thumbnail {width: 100%;} .small_wrap .sec07 .sec07_box .txt_bg {display: none;} .small_wrap .sec07 .sec07_box .txt_box {width: 100%; text-align: center; margin-top: 40px;} .small_wrap .sec07 .sec07_box .txt_box h2 {font-size: 48px;} .small_wrap .sec07 .sec07_box .txt_box p {font-size: 20px;} .small_wrap .sec07 .sec07_box .txt_box ul li {margin: 0 20px; text-align: left;} .small_wrap .sec07 .sec07_box .txt_box ul li span {font-size: 13px;} .small_wrap .sec07 .sec07_box .txt_box ul li {padding: 10px 0;} .small_wrap .sec07 .sec07_box .txt_box .inqu {margin-top: 20px;} .small_wrap .sec07 .sec07_box .txt_box .inqu a {font-size: 18px;} } .small_wrap .sec08 {padding: 200px 0; text-align: center; position: relative; font-family: 'Pretendard'; max-width: 1200px; margin: 0 auto;} .small_wrap .sec08 .txt {text-align: center;} .small_wrap .sec01 .txt h1, .small_wrap .sec01 .txt .deco_tit {bottom: 80%;} .small_wrap .sec08 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; color: #222;} .small_wrap .sec08 .txt span {font-size: 24px; margin: 20px 0 50px; font-weight: 600; font-family: "Noto Serif KR", serif;} .small_wrap .sec08 ul {display: flex; padding: 40px; box-sizing: border-box; gap: 10px; align-items: center;} .small_wrap .sec08 ul li {flex: 1;} .small_wrap .sec08 ul li:nth-child(2) {flex: 1;} .small_wrap .sec08 ul li img {width: 100%;} .small_wrap .sec08 .m_box {display: none;} @media(max-width:768px) { .small_wrap .sec08 {padding: 150px 0;} .small_wrap .sec08 .txt h3 {font-size: 36px;} .small_wrap .sec08 .m_box {display: block;} .small_wrap .sec08 .m_box img {width: 100%;} .body_wrap .sec08 .txt span {font-size: 17px; padding: 0 20px; margin-bottom: 0;} .body_wrap .sec08 .box ul {display: none;} .body_wrap .sec08 .box .body_Before_nav li a {font-size: 14px;} .body_wrap .sec08 .box .body_Before_nav {gap: 10px; padding: 0 20px; margin-top: 20px; display: grid; grid-template-columns: repeat(2, 1fr);} .body_wrap .sec08 .box .body_Before_nav li {width: 100%;} .small_fit_wrap .sec08 .box {display: none;} .small_fit_wrap .sec08 .txt p strong {font-size: 18px; padding: 0 20px;} .small_fit_wrap .sec08 .txt p {font-size: 16px;} } .body_wrap .sec08 .box .body_Before_nav li {width: 100%;} .body_wrap .sec08 .sec11_img_box img {width: 100%;} .body_wrap .sec08 .bodyfit11_swiper11 img {width: 100%;} .body_wrap .sec08 .sec11_img_box>div>span {font-size: 18px; color: #707070; padding: 10px 30px; position: relative; margin-top: 20px;} .body_wrap .sec08 .sec11_img_box>div>span::after {content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background-color: #cfcfcf;} .body_wrap .sec08 .sec11_img_box>div>span::before {content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: #cfcfcf;} .body_wrap .sec08 .sec11_disc {text-align: center; margin-top: 60px;} .body_wrap .sec08 .sec11_disc span {padding: 10px 30px; border: 1px solid #f4f4f4; color: #cdcdcd; display: inline-flex; align-items: center; font-size: 12;} .body_wrap .sec08 .sec11_disc span img {margin-right: 10px;} .body_wrap .sec08 .sec_tit p {font-family: "Noto Serif KR", serif; font-size: 23px; margin-top: 20px;} .body_wrap .sec08 .bodyfit_tabnav {display: flex; justify-content: center; gap: 20px; margin: 20px 0 40px; padding: 0;} .body_wrap .sec08 .txt span {margin-bottom: 0;} .body_wrap .sec08 .bodyfit_tabnav li {flex: 1; max-width: 150px; text-align: center;} .body_wrap .sec08 .bodyfit_tabnav li a {padding: 10px 25px; box-sizing: border-box; border: 1px solid #dcccb2; width: 100%; border-radius: 30px; font-size: 20px;} .body_wrap .sec08 .bodyfit_tabnav li a.active {background-color: #DCCCB2; color: #fff; font-weight: 600;} .sec11.body_wrap .sec08 .bodyfit_tabnav li a.active {background-color: #dcccb2; color: #fff;} .bna_tabnav {display: flex; justify-content: center; gap: 20px; margin: 20px 0 40px; padding: 0;} .bna_tabnav li {flex: 1; max-width: 150px; text-align: center;} .bna_tabnav li a {padding: 10px 25px; box-sizing: border-box; border: 1px solid #dcccb2; width: 100%; border-radius: 30px; font-size: 20px;} .bna_tabnav li a.active {background-color: #DCCCB2; color: #fff; font-weight: 600;} @media(max-width:768px) { .body_wrap .sec08 .sec_tit p {font-size: 16px; font-weight: 500;} .body_wrap .sec08 .sec11_img_box {display: none;} .body_wrap .sec08 .bodyfit_tabnav {margin: 0;} .body_wrap .sec08 .bodyfit_tabnav li a {font-size: 14px;} .body_wrap .sec08 .bodyfit_tabnav li a.active {background-color: #dcccb2; color: #fff;} .body_wrap .sec08 .bodyfit_tabnav {gap: 10px; padding: 0 20px; margin: 20px 0 30px;} .body_wrap .sec08 .bodyfit_tabnav li {flex: auto !important;} .sec11 .bodyfit_tabnav {padding: 0 20px;} .bna_tabnav li a {font-size: 14px;} .bna_tabnav li a.active {background-color: #dcccb2; color: #fff;} .bna_tabnav {gap: 10px; padding: 0 20px; margin: 20px 0 30px;} .bna_tabnav li {flex: auto !important;} } .small_wrap .sec09 {padding: 200px 0; text-align: center; position: relative; font-family: 'Pretendard';} .small_wrap .sec09 .txt {max-width: 1200px; margin: 0 auto;} .small_wrap .sec09 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; margin-bottom: 10px; color: #222;} .small_wrap .sec09 .txt span {font-size: 24px; margin: 20px 0 50px; font-weight: 500; font-family: "Noto Serif KR", serif;} .small_wrap .sec09 .face_program_nav {display: flex; gap: 10px 20px; justify-content: center; flex-wrap: wrap; max-width: 1200px; margin: 0 auto 30px;} .small_wrap .sec09 .face_program_nav li {flex: 1; min-width: 30%; max-width: 160px;} .small_wrap .sec09 .face_program_nav li a {font-size: 20px; padding: 10px 0; border: 1px solid #DCCCB2; border-radius: 30px; width: 100%; box-sizing: border-box;} .small_wrap .sec09 .face_program_nav li a.active {background-color: #DCCCB2; color: #fff; font-weight: 600;} .small_wrap .sec09 .face_program_contnent img {width: 100%; max-width: 1200px; margin: 0 auto} .small_fit_wrap.small_wrap .sec09 .face_program_nav li {min-width: 300px;} @media(max-width:768px) { .small_wrap .sec09 {padding: 150px 0;} .small_wrap .sec09 .txt h3 {font-size: 36px;} .small_wrap .sec09 .txt span {font-size: 18px; margin-bottom: 20px;} .small_wrap .sec09 .face_program_nav {align-items: center; max-width: none;} .small_wrap .sec09 .face_program_nav li {width: 100%; max-width: 300px; min-width: 200px;} .small_wrap .sec09 .face_program_nav li a {font-size: 14px;} .body_wrap .sec09 .face_program_nav {display: grid; grid-template-columns: repeat(2, 1fr); padding: 0 20px;} } .sub_wrap .persoonal_review {padding: 200px 0; max-width: 1200px; margin: 0 auto} .sub_wrap .persoonal_review .common_review {display: flex; justify-content: center; align-items: center; gap: 40px;} .sub_wrap .persoonal_review .common_review li {position: relative; width: 100%;} .sub_wrap .persoonal_review .common_review li .txt {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 30px; box-sizing: border-box; color: #fff; z-index: 1;} .sub_wrap .persoonal_review .common_review li .txt p {line-height: 1.5; opacity: 0; transition: 0.3s; font-size: 16px; color: #fff; text-align: left; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 13; max-height:312px;} .sub_wrap .persoonal_review .common_review li:hover .txt p {opacity: 1;} .sub_wrap .persoonal_review .common_review li .txt .txt_a {display: flex; justify-content: space-between;} .sub_wrap .persoonal_review .common_review li .txt .txt_a>.intsa_txt {display: flex; flex-direction: column;} .sub_wrap .persoonal_review .common_review li .mius_ico {display: none;} .sub_wrap .persoonal_review .common_review li:hover .mius_ico {display: block;} .sub_wrap .persoonal_review .common_review li:hover .plus_ico {display: none;} .sub_wrap .persoonal_review .common_review li .txt .txt_a>.intsa_txt>span {color: #fff;} .sub_wrap .persoonal_review .common_review li .txt .txt_a>.intsa_txt>span:first-child {font-family: 'Marcellus'; font-size: 20px; margin-bottom: 10px; color: #fff; text-align: left;} .sub_wrap .persoonal_review .common_review li .bg {position: absolute; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; opacity: 0; transition: 0.3s;} .sub_wrap .persoonal_review .common_review li:hover .bg {opacity: 1;} .sub_wrap .persoonal_review .common_review li .personal_model img {vertical-align: bottom; width: 100%;} .face_wrap .sec08 .swiper-slide img {width: 100%;} .small_wrap .txt_line {font-size: 20px;} .branding_sec {display: none;} .branding_sec.show {display: block;} .branding_tit {text-align: center; margin-bottom: 50px; margin-top: 200px;} .branding_tit h2 {font-size: 72px; font-family: 'Marcellus'; line-height: 1.5;} .branding_tit span {font-family: "Noto Serif KR", serif; font-size: 20px; font-weight: 600;} @media(max-width:768px) { .sub_wrap .persoonal_review .common_review li .txt{width:100%;} .sub_wrap .persoonal_review .common_review li .txt p {font-size: 14px;} .sub_wrap .persoonal_review .common_review li .txt .more_ico{display:block;} .sub_wrap .persoonal_review {padding: 150px 0;} .small_wrap .txt_line {font-size: 16px;} .face_wrap .sec01 {padding: 200px 0 100px;} .face_wrap .sec01 .txt h1, .face_wrap .sec01 .txt .deco_tit {bottom: 100%;} .face_wrap .sec01 .txt h5 {font-size: 18px; padding-block-end: 0 20px; line-height: 1.5;} .face_wrap .sec01 .txt h3 {font-size: 32px;} .face_wrap .sec01 .txt p {font-size: 12px;} .face_wrap .sec04 .txt p {font-size: 15px;} .face_wrap .sec05 .box {margin-top: 0; flex-direction: column;} .face_wrap .sec05 .box>ul li span {margin-right: 0; padding: 20px 30px;} .face_wrap .sec05 .box>ul li a {display: flex; padding: 20px 20px 20px 0;} .face_wrap .sec05 .box>ul li .info {display: flex; flex-direction: column; text-align: left; gap: 0; align-items: flex-start; padding: 0;} .face_wrap .sec05 .box>ul li .info p {font-size: 14px;} .face_wrap .sec05 .box>ul li .info h5 {font-size: 16px;} .face_wrap .sec06 {margin: 150px 0;} .face_wrap .sec06 ul {display: grid; grid-template-columns: repeat(2, 1fr);} .face_wrap .sec06 .txt h3 {font-size: 36px; margin-bottom: 10px;} .face_wrap .sec06 .txt span {font-size: 18px; line-height: 1.5;} .face_wrap .sec06 .txt h1, .face_wrap .sec06 .txt .deco_tit {font-size: 140px; margin-bottom: 0;} .face_wrap .sec06 .txt p {font-size: 16px;} .face_wrap .sec06 .txt p strong {font-size: 16px; text-decoration: underline; text-underline-offset: 5px;} .face_wrap .sec06 .txt p strong::after {display: none;} .small_wrap .sec06 ul {gap: 10px;} .small_wrap .sec06 ul li .txt span {font-size: 16px;} .small_wrap .sec06 ul li .txt p {font-size: 14px;} .small_wrap .sec06 ul li .bg {border-radius: 15%;} .face_wrap .sec06 ul li img {width: 100%;} .face_wrap .sec06 ul, .face_wrap .sec06 .txt {padding: 0 20px;} .face_wrap .sec08 .txt span {font-size: 18px;} .face_wrap .sec09 .face_program_nav {display: grid; grid-template-columns: repeat(2, 1fr); padding: 0 20px;} .face_wrap .sec09 .face_program_nav li {max-width: 100%;} .face_wrap .persoonal_review {flex-direction: column;} } @media(max-width:500px) { .small_wrap .sec06 ul li .txt p {font-size: 12px;} } .face_wrap .sec05 .box>ul li a.active {background-color: #F9F9F9;} .small_wrap .sec05 .box>ul {display: flex; flex-direction: column;} .small_wrap .sec05 .box>ul li {flex: 1; display: flex;} .small_wrap .sec05 .box>ul li a {width: 100%; display: flex; text-align: left; padding: 20px; align-items: center;} .small_wrap .sec05 .box>ul li .info p {font-size: 18px; line-height: 1.6;} .body_wrap .reversal_box2 {display: flex; gap: 40px; justify-content: center;} .body_wrap .reversal_box2 .comparison-slider{max-width:450px; margin:0;} .body_wrap .sec06 .m_strong {display: none;} .body_wrap .sec08 .box .body_Before_nav {display: flex; gap: 20px; justify-content: center; margin-bottom: 30px;} .body_wrap .sec08 .box .body_Before_nav li {flex: 1; max-width: 160px;} .body_wrap .sec08 .box .body_Before_nav li a {font-size: 20px; padding: 10px 30px; border: 1px solid #DCCCB2; border-radius: 30px; box-sizing: border-box; width: 100%;} .body_wrap .sec08 .box .body_Before_nav li a.active {background-color: #DCCCB2; color: #fff; font-weight: 600;} .body_wrap .persoonal_review .common_review li:last-child .txt .txt_a>.intsa_txt {color: #222;} .body_wrap .persoonal_review .common_review li:last-child:hover .txt .txt_a>.intsa_txt {color: #fff;} .body_wrap .sec11_img_box {display: flex; justify-content: center; text-align: center; gap: 20px;} @media(max-width:1240px) { .body_wrap .reversal_box2{max-width:70%; margin:0 auto;} .body_wrap .sec05 .box {flex-direction: column; margin-top: 0;} .body_wrap .sec05 .box>ul li {padding: 0;} .body_wrap .sec05 .box>ul li a {display: flex; text-align: left;} .body_wrap .sec05 .box>ul li .info p {font-size: 14px; line-height: 1.5;} .body_wrap .sec05 .box>ul li h5 {font-size: 18px;} .body_wrap .sec05 .box>ul li span {margin-right: 0; padding: 20px 40px;} } @media(max-width:768px) { .small_wrap .sec05 .box>ul li .info p {font-size: 13px;} .small_wrap .sec05 .box>ul li a {padding: 20px 20px 20px 0;} .body_wrap .sec01 {padding: 200px 0;} .body_wrap .sec01 .txt p {font-size: 12px;} .body_wrap .sec01 .txt h5 {font-size: 18px; line-height: 1.5;} .body_wrap .sec01 .txt h1, .body_wrap .sec01 .txt .deco_tit {bottom: 100%;} .body_wrap .sec01 .txt h3 {font-size: 28px;} .body_wrap .sec01 .reversal_box2 .comparison-slider:last-child {display: none;} .body_wrap .sec05 .box>ul li span {padding: 20px 30px;} .body_wrap .sec06 {padding: 100px 0;} .body_wrap .sec06 .txt {padding: 0 20px;} .body_wrap .sec06 .txt h1, .body_wrap .sec06 .txt .deco_tit {font-size: 140px; margin-bottom: 0;} .body_wrap .sec06 .txt h3 {font-size: 36px;} .body_wrap .sec06 .txt span {font-size: 18px; margin: 20px 0; line-height: 1.3;} .body_wrap .sec06 .txt p {font-size: 16px; line-height: 1.5;} .body_wrap .sec06 .txt p strong {display: none;} .body_wrap .sec06 .txt .m_strong {background-color: #cdb896; padding: 10px; color: #fff; border-radius: 20px; margin-top: 20px; display: block;} .body_wrap .sec06 .txt .m_strong span {margin: 0; text-decoration: underline;} .body_wrap .sec06 ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;} .body_wrap .sec06 ul li img {width: 100%;} } .eye_wrap .sec01 .txt h1, .eye_wrap .sec01 .txt .deco_tit {bottom: 80%;} .eye_wrap .sec02 .txt h1, .eye_wrap .sec02 .txt .deco_tit {white-space: nowrap;} .eye_wrap .sec05 .box {flex-direction: column; max-width: 850px; margin: 0 auto;} .eye_wrap .sec05 .box>ul li:first-child {border-bottom: none;} .eye_wrap .sec05 .box>ul li:last-child {border-bottom: 1px solid #D2D2D2;} .eye_wrap .sec05 .box>ul li .info {display: flex; align-items: center; gap: 40px; width: 100%;} .eye_wrap .sec05 .box>ul li .info h5 {flex: 0.5;} .eye_wrap .sec05 .box>ul li .info p {flex: 1.5; line-height: 1.4;} .eye_wrap .sec05 .box>ul li a {display: flex; text-align: left; padding: 50px 22px; align-items: center;} .eye_wrap .sec05 .box>ul li span {padding: 20px 20px 20px 40px;} .eye_wrap .sec05 .box>ul li h5 {font-weight: 600;} .eye_wrap .sec06 {margin: 0 !important; padding: 200px 0 !important;} .eye_wrap .sec06 ul li:hover .txt h3, .eye_wrap .sec06 ul li:hover .txt span {display: block;} .eye_wrap .sec07 .sec07_box .txt_box .inqu {margin-top: 20px;} .eye_wrap .sec08 .swiper-slide img {width: 100%;}.small_wrap .toggle_list .sec_tit h3, .small_wrap .toggle_list .sec_tit h1 {font-family: 'SangBlueOgSerifRelgular'; font-size: 54px; font-weight: 500;} .small_wrap .sec10 .sec_tit a {color: #fff; background-color: #dcccb2; padding: 12px 30px; border-radius: 320px; margin: 10px 0 40px; font-weight: 600; font-size: 20px;} @media(max-width:768px) { .small_wrap .sec10 {padding: 150px 0;} .small_wrap .sec10 .sec_tit a {font-size: 16px; margin: 20px 0;} .eye_wrap .sec01 {padding: 200px 0;} .eye_wrap .sec01 .txt h5 {font-size: 18px; line-height: 1.5;} .eye_wrap .sec01 .txt h3 {font-size: 32px;} .eye_wrap .sec01 .txt p {font-size: 12px;} .eye_wrap .sec01 .txt h1, .eye_wrap .sec01 .txt .deco_tit {bottom: 100%;} .eye_wrap .sec02 .txt h4 {font-size: 22px;} .eye_wrap .sec02 .txt h1, .eye_wrap .sec02 .txt .deco_tit {font-size: 48px;} .eye_wrap .sec04 .txt span {font-size: 18px;} .eye_wrap .sec04 .txt p {font-size: 15px;} .eye_wrap .sec05 .box>ul li span {padding: 20px 30px; margin-right: 0;} .eye_wrap .sec05 .box>ul li .info {display: flex; flex-direction: column; text-align: left; gap: 0; align-items: flex-start;} .eye_wrap .sec05 .box>ul li .info p {font-size: 14px;} .eye_wrap .sec05 .box>ul li .info h5 {font-size: 16px;} .eye_wrap .sec05 .box>ul li a {display: flex; padding: 20px 20px 20px 0;} .eye_wrap .sec06 .txt {padding: 0 20px;} .eye_wrap .sec06 .txt h1, .eye_wrap .sec06 .txt .deco_tit {font-size: 140px; margin-bottom: 0;} .eye_wrap .sec06 .txt h3 {font-size: 36px; margin-bottom: 10px;} .eye_wrap .sec06 .txt span {font-size: 18px; line-height: 1.5;} .eye_wrap .sec06 .txt p strong, .eye_wrap .sec06 .txt p {font-size: 16px;} .eye_wrap .sec06 .txt p strong {text-decoration: underline; text-underline-offset: 5px; padding: 8px 20px; border-radius: 15px;} .eye_wrap .sec06 .txt p strong::after {display: none;} .eye_wrap .sec06 ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; padding: 0 20px;} .eye_wrap .sec06 ul img {width: 100%;} .eye_wrap .sec08 .eye_bna img {width: 100%;} .eye_wrap .sec08 .txt span {font-size: 18px;} .eye_wrap .sec09 .face_program_nav {display: grid; grid-template-columns: repeat(2, 1fr); padding: 0 20px;} .eye_wrap .sec09 .face_program_nav li {max-width: 100%;} } .m_eye_special_list {display: none !important;} .m_eye_special_list img {width: 100%;} @media(max-width:768px) { .eye_wrap .sec05 .box>ul li .info p {font-size: 13px;} .eye_wrap .sec06 {padding: 100px 0;} .eye_wrap .sec06 .eye_special_list {display: none;} .eye_wrap .toggle_list ul li .faq_tit h5 {font-size: 16px;} .sub_wrap .persoonal_review .common_review {flex-direction: column;} .m_eye_special_list {display: block !important; margin-top: 30px;} } .skin_wrap .sec .sec_tit {max-width: 1200px; margin: 0 auto; text-align: center;} .skin_wrap .sec .sec_tit span {font-size: 24px; margin: 0 0 50px; font-weight: 700; font-family: "Noto Serif KR", serif;}.skin_wrap .sec .sec_tit h3, .skin_wrap .sec .sec_tit h1 {font-size: 44px; font-family: 'SangBlueOgSerifRelgular' !important;} .skin_wrap .visual_title h2, .skin_wrap .visual_title h1 {font-family: "Noto Serif KR", serif !important; font-size: 84px;} .promotion_area {max-width: 800px; margin: 0 auto;} .youtube_section0 iframe {height: 700px;} @media(max-width:768px) { .youtube_section0 iframe { height: 400px;} } @media(max-width:500px) { .youtube_section0 iframe {height: 260px;} } .before_after_sec>div.box{margin-top: 30px;} .before_after_sec>div.box:nth-child(1){margin-top: 30px;} .bna_swiper { width: 100%; max-width: 1200px; margin: 0 auto; } .bna_swiper .swiper-wrapper { } .bna_swiper .swiper-wrapper .swiper-slide { display: flex; flex-direction: column; align-items: center; gap: 15px; } .bna_swiper .swiper-wrapper .swiper-slide>div { position: relative; } .bna_swiper .swiper-wrapper .swiper-slide>div img { width: 100%; vertical-align: middle; } .bna_swiper .swiper-wrapper .swiper-slide>div span.bna_date { position: absolute; bottom: 10px; right: 10px; color: #fff; font-weight: 500; } .bna_swiper .swiper-wrapper .swiper-slide>div span.bna_date_dark { color: #222; } .bna_swiper .swiper-wrapper .swiper-slide span.bna_name { display: flex; align-items: center; justify-content: center; width: 100%; max-width: 150px; color: #666; font-size: 14px; height: 28px; border-top: 1px solid #888; border-bottom: 1px solid #888; } @media(max-width:768px) { .bna_swiper .swiper-wrapper .swiper-slide>div span.bna_date { font-size: 12px; } } /* ===== /assets/inc/style4.css ===== */ .skin_wrap .sec01 {background-image: url('/assets/img/youlbit/images/sec01_bg.png'); background-repeat: no-repeat; background-position: center; margin-bottom: 50px;} .skin_wrap .sec01 .skin_sec01_vid {position: relative; display: flex; justify-content: center;} .skin_wrap .sec01 .bg_line {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; z-index: -1;} .skin_wrap .one_mo_tit {display: flex; flex-direction: column; padding: 200px 0 90px;} .skin_wrap .one_mo_tit h1, .skin_wrap .one_mo_tit .deco_tit {font-size: 140px; font-family: 'Marcellus'; color: #7f5f3b; opacity: 0.1;} .skin_wrap .one_mo_tit h1:first-child, .skin_wrap .one_mo_tit .deco_tit:first-child {margin-right: auto;} .skin_wrap .one_mo_tit h1:last-child, .skin_wrap .one_mo_tit .deco_tit:last-child {margin-left: auto; line-height: 0.7;} .one_mo_tit_fr {margin-left: 200px;} .n_scar_sec07_images .swiper-slide img{width:100%;} @media(max-width:1240px) { .skin_wrap .sec .sec_tit span {margin: 0 0 50px;} .skin_wrap .sec01 {background-image: url('');} .skin_wrap .sec01 .sec01_title {padding: 0 80px;} .skin_wrap .sec01 .sec01_title h1, .skin_wrap .sec01 .sec01_title .deco_tit {font-size: 100px;} .skin_wrap .one_mo_tit {padding: 100px 20px 0;} .skin_wrap .one_mo_tit h1, .skin_wrap .one_mo_tit .deco_tit {font-size: 46px;} .skin_wrap .visual_title h2, .skin_wrap .visual_title h1 {font-size: 40px;} } @media(max-width:768px) { .skin_wrap .sec01 {padding: 0; margin-bottom: 30px;} .skin_wrap .sec01 .sec01_title {padding: 20px;} .skin_wrap .sec01 .sec01_title h1, .skin_wrap .sec01 .sec01_title .deco_tit {font-size: 60px; line-height: 1.5;} .one_mo_tit_fr {margin-left: 0;} ul.hydrafacial_tabs li .txt_line {font-size: 14px; padding: 15px;} } @media(max-width:500px) { .txt_line {font-size: 14px; padding: 15px 5px;} } .skin_wrap .sec02 {padding: 200px 0;} .skin_wrap .sec02 .box>div {display: flex; align-items: center;} .skin_wrap .sec02 .box>div.left {text-align: left;} .skin_wrap .sec02 .box>div>div {width: 50%;} .skin_wrap .sec02 .box>div .thumbnail img {width: 100%; vertical-align: bottom} .skin_wrap .sec02 .box>.right {flex-direction: row-reverse; text-align: right;} .skin_wrap .sec02 .box>div .txt {padding: 40px; box-sizing: border-box;} .skin_wrap .sec02 .box>div h5 {font-size: 18px; margin-bottom: 30px; font-family: "Noto Serif KR", serif; font-weight: 600;} .skin_wrap .sec02 .box>div h4 {font-size: 28px; font-family: "Noto Serif KR", serif; line-height: 1.5; font-weight: 600;} .skin_wrap .sec02 .box>div p {font-size: 18px; margin: 50px 0; line-height: 1.7;} .skin_wrap .sec02 .box>div p strong {color: #7f5f3b; font-weight: 700;} @media(max-width:1240px) { .skin_wrap .sec02 .sec_tit h3, .skin_wrap .sec02 .sec_tit h1 {font-size: 36px;} .skin_wrap .sec02 .sec_tit span {font-size: 20px;} } @media(max-width:768px) { .skin_wrap .sec02 { padding: 150px 0 100px;} .skin_wrap .sec02 .box>.right, .skin_wrap .sec02 .box>div {flex-direction: column;} .skin_wrap .sec02 .box>div>div {width: 100%;} .skin_wrap .sec02 .box>div h4 {font-size: 20px; font-weight: 700;} .skin_wrap .sec02 .box>div h5 {margin: 30px 0 20px;} .skin_wrap .sec02 .box>div p {font-size: 14px; margin: 25px 0;} .skin_wrap .sec02 .box>div .txt {padding: 20px;} } .skin_wrap .box_sec02 .box .skin_cause {padding-bottom: 200px;} .skin_wrap .box_sec03 .box .skin_treatment p {font-size: 18px; line-height: 1.5;} .skin_wrap .sec03 {padding: 200px 0;} .skin_wrap .sec03 .box {max-width: 1200px; margin: 0 auto; text-align: center; border-radius: 60px; box-shadow: 4px 9px 11px 2px rgba(0, 0, 0, 0.15);} .skin_wrap .sec03 .box>span {background-color: #EEEAE7; padding: 25px 80px; font-family: "Noto Serif KR", serif; font-size: 34px; text-decoration: underline 2px; text-underline-offset: 10px; font-weight: 600;} .skin_wrap .sec03 .box .skin_element {margin: 50px 0 80px;} .skin_wrap .sec03 .box .skin_element .skin_img {margin: 30px 0;} .skin_wrap .sec03 .box .skin_element .skin_img ul {display: flex; justify-content: center; gap: 20px;} .skin_wrap .sec03 .box .skin_element .skin_img ul h5 {font-size: 18px; font-weight: 600; margin-top: 10px;} .skin_wrap .sec03 .box .skin_element>h5 {font-family: "Noto Serif KR", serif;} .skin_wrap .sec03 .box .skin_element>p {font-size: 20px; font-weight: 400; line-height: 1.5; margin-top: 20px;} .skin_wrap .sec03 .box .skin_element>p strong {font-size: 24px; font-weight: 700;} .skin_wrap .sec03 .box .skin_box_thumbnail {margin-bottom: 50px;} .skin_wrap .sec03 .box .skin_box_thumbnail img {max-width: 740px;} .skin_wrap .sec03 .box .skin_cause {padding-bottom: 200px;} .skin_wrap .sec03 .box .skin_cause ul {max-width: 737px; margin: 0 auto;} .skin_wrap .sec03 .box .skin_cause .ul_box {position: relative;} .skin_wrap .sec03 .box .skin_cause .ul_box>span {position: absolute; top: 0px; left: 100px; font-size: 18px; color: #7F5F3B; font-weight: 700;} .skin_wrap .sec03 .box .skin_cause ul li {display: flex; text-align: left; align-items: center; gap: 30px; margin-bottom: 40px; align-items: flex-start;} .skin_wrap .sec03 .box .skin_cause ul li h5 {font-size: 18px; font-weight: 700;} .skin_wrap .sec03 .box .skin_cause ul li p {font-size: 16px; margin-top: 5px; line-height: 1.5;} .skin_wrap .sec03 .box .skin_treatment {background-image: url('/assets/img/youlbit/images/skin_treatment_bg.webp'); padding: 100px 0; position: relative; margin: 0 auto 200px;} .skin_wrap .sec03 .box .skin_treatment>div {text-align: left; margin: 0 auto; max-width: 1000px; position: relative;} .skin_wrap .sec03 .box .skin_treatment h5 {font-size: 24px; font-family: "Noto Serif KR", serif; margin-bottom: 20px; line-height: 1.5; font-weight: 600;} .skin_wrap .sec03 .box .skin_treatment>div>div {margin-left: 200px;} .skin_wrap .sec03 .box .skin_treatment p {font-size: 18px; line-height: 1.5;} .skin_wrap .sec03 .box .skin_treatment span {position: absolute; left: 0; top: 12px; font-size: 18px; color: #7F5F3B; font-weight: 700;} .skin_wrap .sec03 .box .skin_product {display: flex; padding: 0 0 200px;} .skin_wrap .sec03 .box .skin_product .product_txt {width: 40%; position: relative; padding-left: 100px; box-sizing: border-box; text-align: left;} .skin_wrap .sec03 .box .skin_product .product_txt::after {content: ""; position: absolute; top: -90px; left: 30px; background-image: url('/assets/img/symbol_small.png'); width: 135px; height: 180px; z-index: 1;} .skin_wrap .sec03 .box .skin_product .product_txt h5 {font-size: 44px; font-family: 'SangBlueOgSerifRelgular'; margin-bottom: 20px; line-height: 1.3;} .skin_wrap .sec03 .box .skin_product .product_txt img{position: absolute; top: -20%; left: 7%;} .skin_wrap .sec03 .box .skin_product .product_txt span {font-size: 24px; font-family: "Noto Serif KR", serif;} .skin_wrap .sec03 .box .skin_product .product_txt::after {display: none;} .skin_wrap .sec03 .box .skin_product .skin_product3, .skin_wrap .sec03 .box .skin_product .skin_product2, .skin_wrap .sec03 .box .skin_product .skin_product1 {width: 60%; padding-bottom: 50px;} .skin_wrap .sec03 .box .skin_element .skin_img img {max-width: 200px;} .skin_wrap .sec03 .skin_product_txt h4 {font-weight: 600; font-size: 20px; margin: 20px 0 10px;} .skin_wrap .sec03 .skin_product_txt p {line-height: 1.5;} .skin_wrap .sec03 .scrollbar_box {position: relative; height: 10px; margin-top: 30px; width: 100%} .skin_product_bar {opacity: 1 !important; max-width: 300px !important;} .scar_wrap .box .skin_product .product_txt img img{position: absolute; top: -95px; left: 30px; max-width: 135px;} @media(max-width:1240px) { .m_sec07_img_box .swiper-slide img{width:100%;} .skin_product_img img{width:100%;} .skin_wrap .sec03 .box .skin_cause img{width:100%;} .skin_wrap .sec03 .box .skin_treatment {padding: 40px 20px; margin-top: 50px;} .skin_wrap .sec03 .box .skin_treatment span {position: unset; margin-bottom: 30px;} .skin_wrap .sec03 .box .skin_treatment h5 {font-size: 18px; text-align: center;} .skin_wrap .sec03 .box .skin_product {padding-top: 0;} .skin_wrap .sec03 .box .skin_product skin_product_img{width:100%;} } @media(max-width:768px) { .skin_wrap .sec03 {padding: 0 20px 150px;} .skin_wrap .sec03 .box>span {padding: 15px 50px; font-size: 24px;} .skin_wrap .sec03 .box .skin_element>p strong, .skin_wrap .sec03 .box .skin_element>p {font-size: 16px;} .skin_wrap .sec03 .box .skin_element>p {padding: 0 20px; font-weight: 500;} .skin_wrap .sec03 .box .skin_element .skin_img img {max-width: 150px;} .skin_wrap .sec03 .box .skin_element .skin_img ul {flex-wrap: wrap;} .skin_wrap .sec03 .box .skin_element .skin_img ul h5 {font-size: 16px;} .skin_wrap .sec03 .box .skin_cause {padding: 10px;} .skin_wrap .sec03 .box .skin_cause ul li {gap: 15px;} .skin_wrap .sec03 .box .skin_cause ul li p {font-size: 14px;} .skin_wrap .sec03 .box .skin_cause ul li img {min-width: 30px;} .skin_wrap .sec03 .box .skin_cause .ul_box>span {position: unset; margin-bottom: 30px;} .skin_wrap .sec03 .box .skin_treatment {padding: 40px 20px; margin: 50px auto 50px;} .skin_wrap .sec03 .box .skin_treatment>div {text-align: center;} .skin_wrap .sec03 .box .skin_treatment>div>div {margin-left: 0;} .skin_wrap .sec03 .box .skin_treatment p {font-size: 14px; text-align: center; line-height: 1.5;} .skin_wrap .sec03 .box .skin_product {flex-direction: column; padding: 50px 20px 150px;} .skin_wrap .sec03 .box .skin_product .product_txt {width: 100%; margin-bottom: 30px; padding-left: 0; text-align: center;} .skin_wrap .sec03 .box .skin_product .product_txt h5 {font-size: 34px;} .skin_wrap .sec03 .box .skin_product .product_txt span {font-size: 20px;} .skin_wrap .sec03 .box .skin_product .skin_product3, .skin_wrap .sec03 .box .skin_product .skin_product2, .skin_wrap .sec03 .box .skin_product .skin_product1 {width: 100%;} .skin_wrap .sec03 .skin_product_txt h4 {font-size: 17px;} .skin_wrap .sec03 .skin_product_txt p {font-size: 14px;} .ance_wrap .box .skin_product .product_txt img {display: none;} } .sec06 {padding: 200px 0; background-color: #F8F5F0;} .sec06 .box>h3 {font-family: 'SangBlueOgSerifRelgular'; margin-bottom: 10px; font-size: 44px; text-align: center; color: #222;} .sec06 .box>h5 {font-family: 'Pretendard'; font-size: 24px; line-height: 1.5; text-align: center; font-family: "Noto Serif KR", serif; font-weight: 500;} .sec06 .skin_process {box-sizing: border-box; max-width: 1200px; margin: 50px auto 0;} .sec06 .skin_process .process_sec06_ico {text-align: center; width: 100%; position: relative;} .sec06 .skin_process ul {display: flex; justify-content: space-between;} .sec06 .skin_process li:not(:last-child) .process_sec06_ico::after {content: ""; position: absolute; top: 50%; right: 0; background-image: url('/assets/img/youlbit/images/arrow_fill_right.png'); width: 21px; height: 19px;} .sec06 .skin_process ul li {display: flex; flex-direction: column; align-items: center; flex: 1;} .sec06 .skin_process ul li span {margin-top: 20px; font-weight: 600; font-size: 18px;} .m_sec07_Process_ico {display: none;} .process_sec06_ico img {max-width: 125px;} @media(max-width:1240px) {} @media(max-width:768px) { .sec06 .skin_process {padding: 20px;} .sec06 .skin_process ul {display: none;} .skin_wrap .sec06 .box>h3 {font-size: 36px;} .m_sec07_Process_ico {display: block;} } .sec07 {padding: 200px 0;} .sec07 .sec07_img_box {display: flex; justify-content: center; text-align: center; gap: 20px;} .sec07 .sec07_img_box img {width: 100%;} .sec07 .sec07_img_box>div>span {font-size: 18px; color: #707070; padding: 10px 30px; position: relative; margin-top: 20px;} .sec07 .sec07_img_box>div>span::after {content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background-color: #cfcfcf;} .sec07 .sec07_img_box>div>span::before {content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: #cfcfcf;} .sec07 .sec07_disc {text-align: center; margin-top: 30px;} .sec07 .sec07_disc span {padding: 10px 30px; border: 1px solid #f4f4f4; color: #cdcdcd; display: inline-flex; align-items: center; line-height: 1.5;} .sec07 .sec07_disc span img {margin-right: 10px; max-width: 24px;} .skin_wrap .sec07 .sec07_img_box {margin-top: 50px;} .ance_wrap .sec07 .m_sec07_img_box, .scar_wrap .sec07 .m_sec07_img_box {max-width: 1200px; margin: 0 auto;} .ance_wrap .sec07 .m_sec07_img_box .swiper-slide img {width:100%;} @media (max-width: 1240px) { .skin_wrap .sec07 .sec07_disc span {flex-direction: column; font-size: 13px; line-height: 1.3;} .skin_wrap .sec07 .sec07_disc span img {max-width: 24px; margin-bottom: 8px;} } @media (max-width: 768px) { .skin_wrap .sec07 {padding: 150px 0;} .skin_wrap .sec07 .sec07_img_box {display: none;} .sec07 .sec07_disc span img .skin_wrap .sec07 .sec_tit p {font-size: 18px;} } .bodyfit_wrap .sec .sec_tit span {font-size: 24px; margin: 10px 0 50px; font-weight: 700; font-family: "Noto Serif KR", serif;} .bodyfit_wrap .sec01 {padding: 400px 0 200px; max-width: 1240px; margin: 0 auto;} .bodyfit_wrap .sec01 .txt {text-align: center; position: relative;} .bodyfit_wrap .sec01 .txt h1, .bodyfit_wrap .sec01 .txt .deco_tit {font-family: "Marcellus", serif; font-size: 160px; white-space: nowrap; position: absolute; bottom: 80%; left: 50%; transform: translateX(-50%); color: #dcccb2; opacity: 0.2; z-index: -1;} .bodyfit_wrap .sec01 .txt h3 {font-family: "Noto Serif KR", serif; font-size: 48px; margin: 20px 0 40px; color: #222;} .bodyfit_wrap .sec01 .txt h3 strong {font-weight: 700; font-family: "Noto Serif KR", serif;} .bodyfit_wrap .sec01 .txt h5 {font-family: "Noto Serif KR", serif; font-size: 24px; font-weight: 500;} .bodyfit_wrap .sec01 .txt p {display: flex; align-items: center; justify-content: center; color: #888888; margin-bottom: 30px;} .bodyfit_wrap .reversal_box2 {display: flex; gap: 40px; justify-content: center;} .bodyfit_wrap .reversal_box2> .comparison-slider{max-width: 450px; margin: 0;} @media(max-width:1240px) { .bodyfit_wrap .sec01 .txt p {font-size: 14px;} } @media(max-width:768px) { .bodyfit_wrap .sec01 {padding: 200px 0;} .bodyfit_wrap .sec01 .txt h1, .bodyfit_wrap .sec01 .txt .deco_tit {font-size: 80px; bottom: 100%;} .bodyfit_wrap .sec01 .txt h3 {font-size: 36px;} .bodyfit_wrap .sec01 .txt h5 {font-size: 18px; font-weight: 700;} .bodyfit_wrap .reversal_box2 {padding: 40px; box-sizing: border-box;} .bodyfit_wrap .reversal_box2>div:last-child {display: none;} } .bodyfit_wrap .sec02 {background-color: #FFFBF2; padding: 200px 80px; margin: 200px 0; box-sizing: border-box; position: relative;} .bodyfit_wrap .sec02 .box .bodyfit02_img {display: flex;} .bodyfit_wrap .sec02 .box .bodyfit02_img.pc_img {display: flex !important; max-width: 1200px; margin: 0 auto; gap: 15px; filter: drop-shadow(-16px 16px 24px rgba(60, 60, 60, .15));} .bodyfit_wrap .sec02 .box .bodyfit02_img img {width: 100%;} .bodyfit_wrap .sec02 .vertical_line {position: absolute; left: 50%; bottom: calc(100% - 150px); height: 300px; background-color: #000;} @media(max-width:1240px) { .bodyfit_wrap .sec .sec_tit span {font-size: 22px; line-height: 1.5;} .bodyfit_wrap .sec02 {margin: 0; padding: 100px 20px;} } @media(max-width:768px) { .bodyfit_wrap .sec02 {margin: 0; padding: 150px 20px;} .bodyfit_wrap .sec .sec_tit span {margin: 0 0 50px; font-size: 16px;} .bodyfit_wrap .sec02 .box .bodyfit02_img.pc_img {display: none !important;} .bodyfit_wrap .sec02 .vertical_line {height: 200px; bottom: calc(100% - 50px);} } @media(max-width:500px) { .bodyfit_wrap .sec .sec_tit span {font-size: 15px;} } .bodyfit_wrap .sec03 {margin-bottom: 200px;} .bodyfit_youtube img {width: 100%;} .data-swiper img {width: 100%;} @media(max-width:768px) { .bodyfit_wrap .sec03 {padding: 150px 0; margin-bottom: 0;} } .bodyfit_wrap .sec04 {padding: 200px 0; max-width: 1200px; margin: 0 auto;} .bodyfit_wrap .sec04 .txt {text-align: center; position: relative;} .bodyfit_wrap .sec04 .txt h2 {font-family: "Noto Serif KR", serif; font-size: 44px; margin: 100px 0 30px; font-weight: 700;} .bodyfit_wrap .sec04 .txt span {letter-spacing: 15px; font-weight: 300; font-size: 12px;} .bodyfit_wrap .sec04 .txt>p {font-family: "Noto Serif KR", serif; font-size: 24px; color: #222; margin-bottom: 50px; line-height: 1.5; font-weight: 500;} .bodyfit_wrap .sec04 .txt .disc h4 {font-family: 'Pretendard'; font-size: 22px; font-weight: 600;} .bodyfit_wrap .sec04 .txt .disc p {font-family: 'Pretendard'; color: #5f5f5f; font-size: 20px; margin-top: 25px; line-height: 1.5;} .bodyfit_wrap .sec04 .txt .disc h3 {font-size: 24px; color: #aa8863; font-family: "Noto Serif KR", serif; margin-top: 70px; font-weight: 600;} .bodyfit_wrap .sec04 .txt .disc h3 strong {line-height: 1.8; font-family: "Noto Serif KR", serif;} @media(max-width:1240px) { .bodyfit_wrap .sec04 {padding: 0 20px; 150px} .bodyfit_wrap .sec04 .txt span {font-size: 14px; letter-spacing: 5px;} } @media(max-width:768px) { .bodyfit_wrap .sec04 .txt h2 {margin: 30px 0; font-size: 40px; font-weight: 700;} .bodyfit_wrap .sec04 .txt>p {font-size: 18px;} .bodyfit_wrap .sec04 .txt .disc h4 {font-size: 24px;} .bodyfit_wrap .sec04 .txt .disc p {font-size: 15px;} .bodyfit_wrap .sec04 .txt .disc h3 {font-size: 18px; font-family: "Noto Serif KR", serif; font-weight: 600;} .bodyfit_wrap .aside_txt h1, .bodyfit_wrap .aside_txt .deco_tit {font-size: 60px; white-space: nowrap;} .bodyfit_wrap .aside_txt h1:last-child, .bodyfit_wrap .aside_txt .deco_tit:last-child {margin-left: -15%; text-align: left;} } .bodyfit_wrap .sec05 {padding: 200px 0; max-width: 1200px; margin: 0 auto; text-align: center;} .bodyfit_wrap .sec05 .box {display: flex; justify-content: center; align-items: center; gap: 100px;} .bodyfit_wrap .sec05 .box>div {flex: 1;} .bodyfit_wrap .sec05 .box .thumbnail img {width: 100%;} .bodyfit_wrap .sec05 .box .txt {text-align: left; flex: 1.1;} .bodyfit_wrap .sec05 .box .txt img {position: absolute; top: 30%; right: 30%; transform: translateY(-70%);} .bodyfit_wrap .sec05 .box .txt h3 {color: #826529; font-size: 34px; font-family: "Noto Serif KR", serif; line-height: 1.7; font-weight: 500; position: relative; display: inline-block; text-align: left;} .bodyfit_wrap .sec05 .box .txt>p {font-family: 'Pretendard'; font-size: 20px; line-height: 1.5; margin-top: 50px; font-weight: 400;} @media(max-width:1024px) {} @media(max-width:768px) { .bodyfit_wrap .sec05 {padding: 150px 20px;} .bodyfit_wrap .sec05 .box {flex-direction: column;} .bodyfit_wrap .sec05 .box .thumbnail img {width: 70%;} .bodyfit_wrap .sec05 .box .txt img {top: 25%; right: 15%; max-width: 75px;} .bodyfit_wrap .sec05 .box .txt h3 {text-align: center; font-size: 24px;} .bodyfit_wrap .sec05 .box .txt>p {text-align: center; font-size: 15px;} } @media(max-width:768px) { .bodyfit_wrap .sec05 .box .txt h3 {font-size: 22px;} } .bodyfit_wrap .sec06 {background-color: #FAFAFA;} .bodyfit_wrap .sec06 .bodyfit_step {text-align: center;} .bodyfit_wrap .bodyfit_step img {width: 100%; max-width: 1240px; margin: 0 auto;} @media(max-width:1240px) { .bodyfit_wrap .sec06 {padding: 150px 20px;} } @media(max-width:768px) { .bodyfit_wrap .sec06 .bodyfit_step {margin-top: 0;} } @media(max-width:500px) { .bodyfit_wrap .sec06 .sec_tit span {font-size: 14px;} } .bodyfit_wrap .sec07 .bodyfit_area {display: flex; gap: 40px;} .bodyfit_wrap .bodyfit_area img {width: 100%;} @media(max-width:1240px) {} @media(max-width:768px) { .bodyfit_wrap .sec07 {padding: 150px 0;} .bodyfit_wrap .sec07 .bodyfit_area {flex-direction: column; gap: 0;} .bodyfit_wrap .sec07 .bodyfit_area img {vertical-align: bottom;} .bodyfit_wrap .sec07 .bodyfit_area div:last-child {display: none;} } .bodyfit_wrap .sec08 {padding-top: 200px;} .bodyfit_wrap .sec08 .box>div {display: flex; align-items: center;} .bodyfit_wrap .sec08 .box>div .thumbnail img {width: 100%; vertical-align: bottom;} .bodyfit_wrap .sec08 .box>div .txt {padding: 40px; box-sizing: border-box;} .bodyfit_wrap .sec08 .box>div h1, .bodyfit_wrap .sec08 .box>div .deco_tit {color: #f8f5f0; font-size: 100px; font-family: "Marcellus", serif; line-height: 0.8; margin-top: 30px;} .bodyfit_wrap .sec08 .box>div h4 {font-size: 24px; line-height: 1.5; font-weight: 600;} .bodyfit_wrap .sec08 .box>div h5 {font-size: 18px; margin-bottom: 30px; font-family: "Noto Serif KR", serif; font-weight: 600;} .bodyfit_wrap .sec08 .box>div p {font-size: 18px; margin-top: 25px; line-height: 1.5;} .bodyfit_wrap .sec08 .box>div p strong {color: #7f5f3b; font-weight: 700;} .bodyfit_wrap .sec08 .box>div>div {width: 50%;} .bodyfit_wrap .sec08 .box>.right {flex-direction: row-reverse; text-align: right;} .bodyfit_wrap .sec08 .box>.left {text-align: left;} @media(max-width:1240px) {} @media(max-width:768px) { .bodyfit_wrap .sec08 {padding: 150px 0;} .bodyfit_wrap .sec08 .box>div, .bodyfit_wrap .sec08 .box>.right {flex-direction: column;} .bodyfit_wrap .sec08 .box>div .txt {text-align: center; padding: 20px;} .bodyfit_wrap .sec08 .box>div h1, .bodyfit_wrap .sec08 .box>div .deco_tit {font-size: 60px; margin-top: 10px;} .bodyfit_wrap .sec08 .box>div h4 {font-weight: 600; font-size: 20px;} .bodyfit_wrap .sec08 .box>div h5 {margin-top: 20px;} .bodyfit_wrap .sec08 .box>div p {font-size: 15px;} .bodyfit_wrap .sec08 .box>div>div {width: 100%;} .bodyfit_wrap .sec08 .box .left {margin: 50px 0;} } .bodyfit_wrap .sec09 {padding: 200px 0; margin: 200px 0; text-align: center; background-color: #fafafa;} .bodyfit_wrap .sec09 .thumbnail img {width: 100%; max-width: 1200px;} .bodyfit_wrap .sec09 h3 {color: #222; font-size: 24px; font-weight: 500; line-height: 1.5; margin-top: 50px;} .bodyfit_wrap .sec09 .disc {margin: 200px 0 50px;} .bodyfit_wrap .sec09 .disc p {font-weight: 300; font-size: 14px; letter-spacing: 8px; margin-bottom: 40px;} .bodyfit_wrap .sec09 .disc h4 {font-size: 36px; font-family: "Noto Serif KR", serif; margin-top: 30px;} .bodyfit_wrap .sec09 .inuq {margin: 30px 0;} .bodyfit_wrap .sec09 .inuq a {padding: 10px 30px; color: #fff; font-size: 22px; background-color: #DCCCB2; border-radius: 30px; font-weight: 600;} .bodyfit_wrap .bodyfit_review .swiper-slide img {width: 100%;} .bodyfit_wrap .bodyfit_review {margin-left: -250px;} .bodyfit_wrap .bodyfit_review .swiper-pagination {display: none;} @media(max-width:1240px) {} @media(max-width:768px) { .bodyfit_wrap .sec09 {padding: 150px 0; margin: 150px 0;} .bodyfit_wrap .sec09 h3 {padding: 0 20px; margin-top: 30px;} .bodyfit_wrap .sec09 .disc {margin: 100px 0 50px;} .bodyfit_wrap .sec09 .disc p {letter-spacing: 5px; font-size: 12px;} .bodyfit_wrap .bodyfit_review {margin-left: 0;} } @media(max-width:500px) { .bodyfit_wrap .sec09 h3 {font-size: 14px;} .bodyfit_wrap .sec09 .inuq a {font-size: 18px;} } .bodyfit_wrap .sec10 {padding: 0; text-align: center; position: relative; font-family: 'Pretendard'; max-width: 1200px; margin: 0 auto; padding-bottom: 200px;} .bodyfit_wrap .sec10 .sec10_box {display: flex;} .bodyfit_wrap .sec10 .sec10_box .sec10_thumbnail {width: 40%; position: relative;} .bodyfit_wrap .sec10 .sec10_box .sec10_thumbnail img {width: 100%; vertical-align: bottom;} .bodyfit_wrap .sec10 .sec10_box .txt_box {width: 60%; text-align: left; margin-right: 50px;} .bodyfit_wrap .sec10 .sec10_box .txt_box h2 {font-family: 'SangBlueOgSerifRelgular'; font-size: 54px;} .bodyfit_wrap .sec10 .sec10_box .txt_box p {font-family: "Noto Serif KR", serif !important; font-size: 24px; margin-top: 15px; font-weight: 600;} .bodyfit_wrap .sec10 .sec10_box .txt_box ul {margin-top: 40px;} .bodyfit_wrap .sec10 .sec10_box .txt_box ul li {font-size: 20px; padding: 20px 0; border-top: 1px solid #EBEBEB; font-weight: 600; display: flex; align-items: center;} .bodyfit_wrap .sec10 .sec10_box .txt_box ul li:last-child {border-bottom: 1px solid #EBEBEB;} .bodyfit_wrap .sec10 .sec10_box .txt_box ul li span:first-child {font-family: 'SangBleuOGSerif-Medium'; font-weight: 400;} .bodyfit_wrap .sec10 .sec10_box .txt_box ul li span:nth-child(2) {color: #9D9D9D; margin: 0 8px; font-size: 32px;} .bodyfit_wrap .sec10 .sec10_box .txt_box ul li span:nth-child(3) {font-weight: 400;} .bodyfit_wrap .sec10 .sec10_box .txt_box .inqu a {background-color: #DCCCB2; color: #fff; padding: 12px 36px; border-radius: 36px; font-size: 24px; margin-top: 60px; font-weight: 600;} .bodyfit_wrap .sec10 .sec10_box .txt_bg {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; width: 200%;} .bodyfit_wrap .sec10 .sec10_box .txt_bg img {width: 100%;} @media(max-width:1240px) { .bodyfit_wrap .sec10 .sec10_box {flex-direction: column-reverse;} .bodyfit_wrap .sec10 .sec10_box .sec10_thumbnail {width: 100%;} .bodyfit_wrap .sec10 .sec10_box .txt_box {width: 100%; text-align: center; margin-top: 40px;} .bodyfit_wrap .sec10 .sec10_box .txt_box h2 {font-size: 48px;} .bodyfit_wrap .sec10 .sec10_box .txt_box p {font-size: 20px;} .bodyfit_wrap .sec10 .sec10_box .txt_box ul li {margin: 0 20px; padding: 10px 0;} .bodyfit_wrap .sec10 .sec10_box .txt_box ul li span {font-size: 14px;} .bodyfit_wrap .sec10 .sec10_box .txt_box .inqu a {font-size: 18px;} .bodyfit_wrap .sec10 .sec10_box .txt_bg {display: none;} } @media(max-width:768px) { .bodyfit_wrap .sec10 {padding-bottom: 150px;} } .sec11 {padding: 200px 0;} .sec11 .sec11_img_box {display: flex; justify-content: center; text-align: center; gap: 20px;} .sec11 .sec11_img_box img {width: 100%;} .sec11 .sec11_img_box>div>span {font-size: 18px; color: #707070; padding: 10px 30px; position: relative; margin-top: 20px;} .sec11 .sec11_img_box>div>span::after {content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background-color: #cfcfcf;} .sec11 .sec11_img_box>div>span::before {content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: #cfcfcf;} .sec11 .sec11_disc {text-align: center; margin-top: 60px;} .sec11 .sec11_disc span {padding: 10px 30px; border: 1px solid #f4f4f4; color: #cdcdcd; display: inline-flex; align-items: center; font-size: 12px;} .sec11 .sec11_disc span img {margin-right: 10px;} .sec11 .sec_tit p {font-family: "Noto Serif KR", serif; font-size: 24px; margin-top: 20px; font-weight: 600;} .sec11 .bodyfit_tabnav {display: flex; justify-content: center; gap: 20px; margin: 20px 0 30px;} .sec11 .bodyfit_tabnav li {flex: 1; max-width: 150px; text-align: center;} .sec11 .bodyfit_tabnav li a {padding: 10px 25px; box-sizing: border-box; border: 1px solid #dcccb2; width: 100%; border-radius: 30px;} .sec11 .bodyfit_tabnav li a.active {background-color: #dcccb2; color: #fff;} .body_wrap .sec08 .txt {margin-bottom: 50px;} .body_wrap .sec08 .txt h3 {margin-bottom: 10px;} .bodyfit_wrap .sec11 {padding: 200px 0; max-width: 1200px; margin: 0 auto;} .bodyfit_wrap .sec11 .bodyfit11_swiper11 img,.bodyfit_wrap .sec11 .bodyfit11_swiper22 img,.bodyfit_wrap .sec11 .bodyfit11_swiper33 img {width: 100%;} .bodyfit11_swiper1, .bodyfit11_swiper2, .bodyfit11_swiper3 {display: none !important;} .bodyfit11_swiper1 .swiper-slide img, .bodyfit11_swiper2 .swiper-slide img, .bodyfit11_swiper3 .swiper-slide img {width: 100%;} .ance_wrap {width: 100%;} @media(max-width:1240px) { .sec11 .sec11_disc span {flex-direction: column; font-size: 9px; line-height: 1.3;} .sec11 .sec11_disc span img {margin: 8px;} } @media(max-width:768px) { .sec11 .sec11_disc span {font-size: 12px;} .bodyfit_wrap .sec11 {padding: 150px 0;} .sec11 .sec_tit p {font-size: 16px; font-weight: 500;} .sec11 .sec11_img_box {display: none;} .sec11 .bodyfit_tabnav {padding: 0 10px;} .sec11 .bodyfit_tabnav li a {font-size: 14px;} .sec11 .bodyfit_tabnav {gap: 10px;} .bodyfit11_swiper1, .bodyfit11_swiper2, .bodyfit11_swiper3 {display: block !important;} } .ance_wrap .sec02 {text-align: center;} .ance_wrap .sec02>span {padding: 10px 30px; border: 1px solid #f4f4f4; color: #cdcdcd; display: inline-flex; align-items: center; line-height: 1.5;} .ance_wrap .sec02>span img {margin-right: 10px; max-width: 24px;} .ance_wrap .container ul li img {height: 100%; width: auto; max-height: 300px; max-width: none} @media(max-width:1240px) {} @media(max-width:768px) { .ance_wrap .sec01 .sec01_title h1, .ance_wrap .sec01 .sec01_title .deco_tit {font-size: 46px;} .ance_wrap .sec02 {display: flex; flex-direction: column-reverse;} .ance_wrap .sec02>span {flex-direction: column; font-size: 13px; line-height: 1.3; flex-direction: column; margin: 0 20px; font-size: 12px;} .ance_wrap .sec02>span img {margin-bottom: 8px; max-width: 24px;} .ance_wrap .container {margin: 0 auto;} .ance_wrap .container ul li img {height: 80%;} .skin_wrap .boxes img {width: auto;} } .ance_wrap .sec02_content {padding-top: 0; margin-bottom: 200px;} .ance_wrap .sec02_content .txt {text-align: center; position: relative;} .ance_wrap .sec02_content .txt h2 {font-family: "Noto Serif KR", serif; font-size: 44px; margin-top: 20px;} .ance_wrap .sec02_content .txt h3 {font-family: 'SangBlueOgSerifRelgular'; font-size: 34px; color: #222;} .ance_wrap .sec02_content .txt p {font-size: 24px; margin: 50px 0; line-height: 1.5; color: #7f5f3b;} .ance_wrap .sec02_content .txt span {font-family: "Noto Serif KR", serif; font-size: 34px; line-height: 1.5;} .ance_wrap .sec02_content .txt .sec03_bg {position: absolute;} .ance_wrap .sec02_content .txt .sec03_bg1 {top: 15%; left: 8%;} .ance_wrap .sec02_content .txt .sec03_bg2 {top: 100%; right: 10%;} @media(max-width:768px) { .ance_wrap .visual_title h5 {margin-bottom: 0; font-size: 18px;} .ance_wrap .sec02_content .txt h2 {font-size: 34px;} .ance_wrap .sec02_content .txt h3 {font-size: 32px;} .ance_wrap .sec02_content .txt p {font-size: 18px; margin: 100px 0 50px; padding: 0 20px;} .ance_wrap .sec02_content .txt span {font-size: 20px;} .ance_wrap .sec02_content .txt span strong {font-weight: 600;} .ance_wrap .sec02_content .txt .sec03_bg1 {left: -20px; width: 60%; top: 32%;} .ance_wrap .sec02_content .txt .sec03_bg1 img {width: 100%} .ance_wrap .sec02_content .txt .sec03_bg2 {width: 60%; right: 0;} .ance_wrap .sec02_content .txt .sec03_bg2 img {width: 100%} } .ance_wrap .ance_box {padding: 150px 0;} .ance_wrap .ance_box .box {max-width: 1330px; margin: 0 auto; text-align: center; border-radius: 60px; box-shadow: 4px 9px 11px 2px rgba(0, 0, 0, 0.15);} .ance_wrap .ance_box .box>span {background-color: #EEEAE7; padding: 35px 100px; font-family: 'AritaBuriSB'; font-size: 39px; text-decoration: underline; text-underline-offset: 5px;} .ance_wrap .ance_box .box .skin_element {margin: 50px 0 100px;} .ance_wrap .ance_box .box .skin_element>h5 {font-family: 'AritaBuriL';} .ance_wrap .ance_box .box .skin_element>p {font-size: 24px; font-weight: 400; line-height: 1.7; margin-top: 20px;} .ance_wrap .ance_box .box .skin_element>p strong {font-size: 24px; font-weight: 700;} .ance_wrap .ance_box .box .skin_element .skin_img {margin: 30px 0 50px;} .ance_wrap .ance_box .box .skin_element .skin_img ul {display: flex; justify-content: center; gap: 20px;} .ance_wrap .ance_box .box .skin_element .skin_img ul h5 {font-size: 18px; font-weight: 600; margin-top: 10px;} .ance_wrap .ance_box .box .skin_cause {padding-bottom: 100px;} .ance_wrap .ance_box .box .skin_cause .ul_box {position: relative;} .ance_wrap .ance_box .box .skin_cause .ul_box>span {position: absolute; top: 0px; left: 100px; font-size: 22px; color: #7F5F3B; font-weight: 600;} .ance_wrap .ance_box .box .skin_treatment {background-image: url('/assets/img/skin_treatment_bg.webp'); font-weight: 500; padding: 100px 40px; position: relative;} .ance_wrap .ance_box .box .skin_treatment>div {text-align: left; max-width: 100%; margin-left: 300px;} .ance_wrap .ance_box .box .skin_treatment h5 {font-size: 28px; font-family: "Noto Serif KR", serif; margin-bottom: 20px; line-height: 1.3; font-weight: 600;} .ance_wrap .ance_box .box .skin_treatment p {font-size: 20px; line-height: 1.5;} .ance_wrap .ance_box .box .skin_treatment span {position: absolute; left: 100px; top: 105px; font-size: 18px; color: #7F5F3B; font-weight: 600; font-size: 22px;} .ance_wrap .ance_box .box .skin_product {display: flex; padding: 150px 0 100px;} .ance_wrap .ance_box .box .skin_product .product_txt {width: 40%; position: relative; padding-left: 100px; box-sizing: border-box; text-align: left;} .ance_wrap .ance_box .box .skin_product .product_txt h5 {font-size: 42px; font-family: "Marcellus", serif; margin-bottom: 10px;} .ance_wrap .ance_box .box .skin_product .product_txt span {font-size: 24px; font-family: "Noto Serif KR", serif;} .ance_wrap .box .skin_product .product_txt img {position: absolute; top: -95px; left: 30px; max-width: 135px;} .ance_wrap .ance_box .box .skin_product .skin_product3, .ance_wrap .ance_box .box .skin_product .skin_product2, .ance_wrap .ance_box .box .skin_product .skin_product1 {width: 60%; padding-bottom: 50px;} .ance_wrap .ance_box .skin_product_txt h4 {font-weight: 600; font-size: 22px; margin: 10px 0;} .ance_wrap .ance_box .skin_product_txt p {line-height: 1.5;} .ance_wrap .ance_03_box {display: flex; justify-content: center; max-width: 1000px; margin: 0 auto;} .ance_wrap .ance_03_box2 {max-width: 1000px;} .ance_wrap .ance_03_box .ance_wrap .ance_03_box>div {width: 50%;} .ance_wrap .ance_03_box .img img {width: 100%; max-width: 400px;} .ance_wrap .ance_03_box .disc {margin-left: 30px;} .ance_wrap .ance_03_box .disc h3 {font-size: 24px; font-family: "Noto Serif KR", serif; padding: 40px 0; border-bottom: 1px solid #cfcfcf; font-weight: 600; color: #222; text-align: left;} .ance_wrap .ance_03_box .disc .disc_box h5 {font-family: 'SangBleuOGSerif-Medium'; font-size: 20px;} .ance_wrap .ance_03_box .disc .disc_box p {font-weight: 500;} .ance_wrap .ance_03_box .disc .disc_box>div {border-bottom: 1px solid #cfcfcf; padding: 20px 10px; display: flex; font-size: 20px; align-items: center;} .ance_wrap .ance_03_box .disc .disc_box>div>span {margin: 0 15px; font-size: 30px; color: #cfcfcf;} .ance_wrap .skin_ance_list {margin: 0 auto 200px; position: relative; max-width: 1000px;} .ance_wrap .skin_ance_list ul {display: grid; grid-template-columns: repeat(3, 1fr); gap: 80px 40px; max-width: 900px; margin: 0; margin-left: 200px;} .ance_wrap .skin_ance_list ul li h5 {font-size: 20px; font-weight: 600; margin: 20px 0;} .ance_wrap .skin_ance_list ul li p {line-height: 1.5;} .ance_wrap .skin_ance_list ul li img {max-width: 140px;} .ance_wrap .skin_ance_list2 ul {grid-template-columns: repeat(4, 1fr);} .ance_wrap .skin_ance_list2 ul li img {max-width: 72px;} .skin_ance_list>span {position: absolute; top: 0px; left: 0; font-size: 18px; color: #7F5F3B; font-weight: 600;} .skin_wrap .sec_tit p {font-family: "Noto Serif KR", serif; font-size: 24px; margin: 10px 0 50px; font-weight: 500;} @media(max-width:1240px) { .ance_wrap .ance_box .box .skin_treatment>div {margin-left: 0;} } @media(max-width:768px) { .skin_wrap .sec_tit p {font-size: 16px;} .ance_box {padding: 100px 20px; box-sizing: border-box;} .ance_wrap .ance_box {padding: 50px 20px 150px; box-sizing: border-box;} .ance_wrap .ance_box .box {padding: 0 20px;} .ance_wrap .ance_box .box>span {padding: 15px 50px; font-size: 24px;} .ance_wrap .ance_box .box .skin_element>p {font-size: 14px; font-weight: 500;} .ance_wrap .ance_box .box .skin_element>p strong {font-size: 14px;} .ance_wrap .ance_box .box .skin_treatment {padding: 40px 20px;} .ance_wrap .ance_box .box .skin_treatment h5 {font-size: 18px; text-align: center;} .ance_wrap .ance_box .box .skin_treatment p {font-size: 14px; text-align: center;} .ance_wrap .ance_box .box .skin_treatment span, .skin_ance_list>span, .ance_wrap .ance_box .box .skin_cause .ul_box>span {position: unset; margin-bottom: 30px;} .ance_wrap .ance_box .box .skin_product {flex-direction: column;} .ance_wrap .ance_box .box .skin_product .product_txt, .ance_wrap .ance_box .box .skin_product .skin_product3, .ance_wrap .ance_box .box .skin_product .skin_product2, .ance_wrap .ance_box .box .skin_product .skin_product1 {width: 100%;} .ance_wrap .ance_box .box .skin_product .product_txt {margin-bottom: 30px; padding-left: 0; text-align: center;} .ance_wrap .ance_box .box .skin_product .product_txt h5 {font-size: 34px;} .ance_wrap .ance_box .box .skin_product .product_txt img {display: none;} .ance_wrap .ance_box .skin_product_txt h4 {font-size: 17px;} .ance_wrap .ance_box .skin_product_txt p {font-size: 14px;} .ance_wrap .ance_03_box {flex-direction: column;} .ance_wrap .ance_03_box .disc {margin-left: 0;} .ance_wrap .ance_03_box .disc h3 {font-size: 18px; padding: 30px 0;} .ance_wrap .ance_03_box .disc p {font-size: 12px;} .ance_wrap .ance_03_box .disc .disc_box h5 {font-size: 14px;} .ance_wrap .ance_03_box .disc .disc_box>div {font-size: 16px; padding: 10px;} .ance_wrap .ance_03_box .disc .disc_box>div>span {margin: 0 10px;} .ance_wrap .skin_ance_list {margin: 50px auto;} .ance_wrap .skin_ance_list ul {margin-left: 0; grid-template-columns: repeat(2, 1fr); gap: 5px; padding: 0 10px;} .ance_wrap .skin_ance_list ul li h5 {font-size: 17px;} .ance_wrap .skin_ance_list ul li p {font-size: 14px;} .ance_wrap .skin_ance_list img {max-width: 120px;} .ance_wrap .sec06, .skin_wrap .sec06 {padding: 150px 0;} } .volumn_wrap .visual_title h2, .volumn_wrap .visual_title h1 {font-family: 'SangBlueOgSerifRelgular';} .volumn_wrap .sec01 {padding: 200px 0;} .volumn_wrap .sec01 .skin_sec01_vid {position: relative; display: flex; justify-content: center;} .volumn_wrap .sec01 .bg_line {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; z-index: -1;} .volumn_wrap .sec01 .sec01_title {display: flex; flex-direction: column; padding: 0 130px;} .volumn_wrap .sec01 .sec01_title h1, .volumn_wrap .sec01 .sec01_title .deco_tit {font-size: 140px; font-family: 'Marcellus'; color: #7f5f3b; opacity: 0.1; margin-left: 300px;} .volumn_wrap .sec01 .sec01_title h1:first-child, .volumn_wrap .sec01 .sec01_title .deco_tit:first-child {margin-right: auto;} .volumn_wrap .sec01 .sec01_title h1:last-child, .volumn_wrap .sec01 .sec01_title .deco_tit:last-child {margin-left: auto; margin-right: 300px; line-height: 0.7; margin-bottom: 50px;} .volumn_wrap .sec01 .txt {margin-top: 50px;} .volumn_wrap .sec01 .txt .sign {text-align: center; margin-top: 50px;} .volumn_wrap .sec01 .txt p {font-size: 24px; text-align: center; line-height: 1.5; font-family: "Noto Serif KR", serif !important; font-weight: 600;} .volumn_wrap .sec01 video {max-width: 1080px; width: 100%;} .skin_wrap .sec01 .skin_sec01_vid img, .ance_wrap .sec01 .skin_sec01_vid img {max-width: 950px;} @media(max-width:768px) { .volumn_wrap .sec01 {padding: 50px 0 100px;} .volumn_wrap .sec01 .sec01_title {padding: 0 20px;} .volumn_wrap .sec01 .sec01_title h1, .volumn_wrap .sec01 .sec01_title .deco_tit {margin-left: 0; margin-right: auto; font-size: 70px; margin-bottom: 0;} .volumn_wrap .sec01 .sec01_title h1:last-child, .volumn_wrap .sec01 .sec01_title .deco_tit:last-child {margin-left: auto; margin-right: 0; margin-top: 10px;} .volumn_wrap .sec01 .txt {padding: 0 20px; margin-top: 30px;} .volumn_wrap .sec01 .txt p {font-size: 16px; font-family: "Noto Serif KR", serif; font-weight: 600;} .volumn_wrap .sec01 .txt .sign {margin-top: 30px;} .volumn_wrap .sec01 .txt .sign img {max-width: 220px;} .volumn_wrap .txt_line {display: none;} } .volumn_wrap .sec02 {padding: 200px 0; background-image: url('/assets/img/youlbit/images/volume_sec02bg.webp'); background-size: cover; background-repeat: no-repeat; background-position: center;} .volumn_wrap .sec02 .sec02_tit {text-align: center; color: #fff;} .volumn_wrap .sec02 .sec02_tit p {font-size: 24px;} .volumn_wrap .sec02 .sec02_tit h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; margin: 20px 0 50px; color: #fff;} .volumn_wrap .sec02 .txt {padding: 200px 360px 0; color: #fff;} .volumn_wrap .sec02 .txt h2 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; margin-bottom: 20px; text-align: left;} .volumn_wrap .sec02 .txt .disc {display: flex; justify-content: space-between;} .volumn_wrap .sec02 .txt .disc h4 {font-size: 34px; font-family: "Noto Serif KR", serif; font-weight: 700; margin-bottom: 50px; display: inline-block; position: relative; text-align: left;} .volumn_wrap .sec02 .txt .disc h4::after {content: ""; position: absolute; left: 105%; width: 200px; height: 1px; background-color: #fff; top: 50%;} .volumn_wrap .sec02 .txt .disc>div {text-align: left;} .volumn_wrap .sec02 .txt .disc>div:first-child p {font-size: 20px; font-weight: 300; line-height: 1.5; text-align: left;} .volumn_wrap .sec02 .txt .disc>div:last-child p {font-size: 20px; line-height: 1.5; font-weight: 400; font-family: "Noto Serif KR", serif; text-align: left;} .volumn_wrap .sec02 .txt .disc>div:last-child p strong {font-size: 24px; font-weight: 700;} .volumn_wrap .sec02 .volumn02_slide {margin-left: 360px;} @media(max-width:1240px) { .volumn_wrap .sec02 {padding: 150px 20px; background-image: url('/assets/img/youlbit/images/m_volume_sec02bg.webp');} .volumn_wrap .sec02 .sec02_tit p {font-size: 18px; line-height: 1.5;} .volumn_wrap .sec02 .sec02_tit h3 {font-size: 38px; line-height: 1.3; margin-bottom: 20px;} .volumn_wrap .sec02 .txt {padding: 0;} .volumn_wrap .sec02 .txt h2 {font-size: 32px;} .volumn_wrap .sec02 .txt .disc {flex-direction: column;} .volumn_wrap .sec02 .txt .disc h4::after {display: none;} .volumn_wrap .sec02 .txt .disc h4 {font-size: 20px;} .volumn_wrap .sec02 .txt .disc>div:first-child p {font-size: 15px;} .volumn_wrap .sec02 .txt .disc>div:last-child p {font-size: 16px;} .volumn_wrap .sec02 .txt .disc>div:last-child p strong {font-size: 17px;} .volumn_wrap .sec02 .volumn02_slide {margin-left: 0; margin-bottom: 20px;} } .volumn_wrap .sec03 {padding: 200px 0;} .volumn_wrap .sec03 ul {display: flex; justify-content: center; gap: 30px; max-width: 1200px; margin: 50px auto 0;} .volumn_wrap .sec03 ul li {position: relative;} .volumn_wrap .sec03 ul li .txt {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; z-index: 1;} .volumn_wrap .sec03 ul li .txt h3 {font-size: 84px; font-family: 'SangBlueOgSerifRelgular'; color: #fff; opacity: 0.3; margin-bottom: 0; transition: 0.3s;} .volumn_wrap .sec03 ul li .txt p {display: none; color: #222222; white-space: nowrap; line-height: 1.5; font-size: 16px; font-weight: 600; margin-top: 0;} .volumn_wrap .sec03 ul li .txt span {font-size: 20px; white-space: nowrap; color: #fff; font-weight: 600; transition: 0.3s; margin-top: 10px;} .volumn_wrap .sec03 ul li:nth-child(1) .txt p {color: #fff;} .volumn_wrap .sec03 ul li:nth-child(4) .txt p {color: #fff;} .volumn_wrap .sec03 ul li:hover .txt h3 {display: none;} .volumn_wrap .sec03 ul li:hover .txt p {display: block;} .volumn_wrap .sec03 ul li:hover .txt span, .face_wrap .sec06 ul li:hover .txt h3 {display: none;} .volumn_wrap .sec03 ul li img {vertical-align: bottom; max-width: 275px;} .volumn_wrap .sec03 ul li .bg {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); border-radius: 50px;} .volumn_wrap .sec03 ul li:hover .bg {display: none;} .volumn_wrap .sec03 .txt {max-width: 1200px; margin: 0 auto; text-align: center;} .volumn_wrap .sec03 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; color: #222;} .volumn_wrap .sec03 .txt p {line-height: 1.5; font-size: 24px; font-family: 'Pretendard'; font-weight: 600; color: #aa8863; margin-top: 20px;} @media(max-width:768px) { .volumn_wrap .sec03 {padding: 150px 0;} .volumn_wrap .sec03 ul {flex-wrap: wrap; gap: 10px;} .volumn_wrap .sec03 ul li {width: calc(50% - 20px);} .volumn_wrap .sec03 ul li .txt h3 {font-size: 48px;} .volumn_wrap .sec03 ul li .txt p {font-size: 14px;} .volumn_wrap .sec03 ul li .txt span {font-size: 16px; font-family: 'Pretendard'; margin-top: 15px;} .volumn_wrap .sec03 ul li .bg {border-radius: 30px; display: block;} .volumn_wrap .sec03 .txt h3 {font-size: 36px;} .volumn_wrap .sec03 .txt p {font-size: 18px;} } .volumn_wrap .sec04 {padding-top: 200px 0;}.volumn_wrap .sec04 .sec_tit h3, .volumn_wrap .sec04 .sec_tit h1 {font-family: 'Pretendard' !important; line-height: 1.3; font-weight: 600; font-size: 24px; color: #aa8863; margin-top: 20px;} .volumn_wrap .sec04 .sec_tit h2 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular';} .volumn_wrap .sec04 .drug_box {margin-top: 100px;} .volumn_wrap .sec04 .swiper-wrapper {align-items: baseline;} .volumn_wrap .sec04 .np_product_slide {} .volumn_wrap .sec04 .np_product_slide .swiper-slide {text-align: center;} .volumn_wrap .sec04 .np_product_slide .swiper-slide div h5 {font-size: 20px; font-weight: 600; margin: 20px 0;} .volumn_wrap .sec04 .np_product_slide .swiper-slide div p {font-size: 16px; line-height: 1.5;} .volumn_wrap .sec04 .np_product_slide .swiper-slide img {width: 100%;} .volumn_wrap .sec04 .np_product_slide .swiper-slide-active {background-color: #FAFAFA; height: 30; box-sizing: border-box; border-radius: 10px;} .volumn_wrap .sec04 .np_product_slide .swiper-slide-active h5 {font-size: 24px !important; font-weight: 700 !important;} .volumn_wrap .sec04 .np_product_slide .swiper-slide-active p {font-size: 20px !important;} .volumn_wrap .sec04 .np_product_slide .swiper-slide-next+div {background-color: #FAFAFA; padding: 80px 20px 40px; border-radius: 10px; height: 500px; display: flex; flex-direction: column; justify-content: center;} .volumn_wrap .sec04 .np_product_slide .swiper-slide-next+div h5 {font-size: 30px; font-weight: 600;} .volumn_wrap .sec04 .np_product_slide .swiper-slide-next+div p {font-size: 20px;} .volumn_wrap .sec04 .np_product_slide .swiper-button-next:after {content: "";} .volumn_wrap .sec04 .np_product_slide .swiper-slide-active .volumn_wrap .sec05 .box .disc>p {color: #aa8863; font-size: 24px; font-weight: 600;} .volumn_wrap .sec04 .slider .swiper-button-next, .volumn_wrap .sec04 .slider .swiper-button-prev {position: unset;} .volumn_wrap .sec04 .slider .swiper-button-next::after {display: none;} .volumn_wrap .sec04 .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {content: "";} .volumn_wrap .sec04 .np_product_slide .arrow_box {display: flex; justify-content: center; flex-direction: row-reverse; margin-top: 100px; gap: 50px;} .volumn_wrap .sec04 .np_product_slide .arrow_box>div {position: unset !important;} .volumn_wrap .sec04 .arrow_box {margin-top: 50px !important;} .arrow_box {display: flex; justify-content: center; flex-direction: row-reverse; margin-top: 100px; gap: 50px;} .arrow_box>div {width: auto;} @media(max-width:768px) { .volumn_wrap .sec04 .np_product_slide .swiper-slide div h5 {font-size: 20px;} .volumn_wrap .sec04 .np_product_slide .swiper-slide div p {font-size: 15px;} .volumn_wrap .sec04 .np_product_slide .swiper-slide-next+div {height: auto;} .volumn_wrap .sec04 .np_product_slide .arrow_box {margin-top: 30px;} } @media(max-width:768px) { .slider .inner {height: 400px;} .volumn_wrap .sec04 {padding-top: 0;} .volumn_wrap .sec04 .sec_tit h2 {font-size: 36px;}.volumn_wrap .sec04 .sec_tit h3, .volumn_wrap .sec04 .sec_tit h1 {font-size: 18px;} .volumn_wrap .sec04 .np_product_slide .swiper-slide br {display: none;} .volumn_wrap .sec04 .np_product_slide .swiper-slide h5 {font-size: 18px important;} .volumn_wrap .sec04 .np_product_slide .swiper-slide div p {font-size: 13px;} .volumn_wrap .sec04 .np_product_slide .swiper-slide-active h5 {font-size: 20px !important;} .volumn_wrap .sec04 .np_product_slide .swiper-slide-active p {font-size: 15px !important;} .volumn_wrap .sec04 .drug_box {margin-top: 50px;} .volumn_wrap .sec04 .drug_box .arrow_box img {max-width: 80px;} .volumn_wrap .sec04 .arrow_box {margin-top: 40px;} .volumn_wrap .sec04 .swiper-slide-active {background-color: #FAFAFA; padding: 80px 20px 40px; box-sizing: border-box; min-height: 360px;} .slide_list>li {height: 100% !important;} } .volumn_wrap .sec05 {padding: 200px 0;} .volumn_wrap .sec05 .box>div {display: flex; align-items: center; max-width: 1200px; margin: 0 auto 50px;} .volumn_wrap .sec05 .box>div:last-child {margin-bottom: 0;} .volumn_wrap .sec05 .box>div .thumbnail img {width: 100%; vertical-align: bottom;} .volumn_wrap .sec05 .box>div .txt {padding: 40px; box-sizing: border-box;} .volumn_wrap .sec05 .box>div h1, .volumn_wrap .sec05 .box>div .deco_tit {color: #f8f5f0; font-size: 100px; font-family: "Marcellus", serif; line-height: 0.8;} .volumn_wrap .sec05 .box>div h5 {font-size: 18px; margin-bottom: 30px; font-family: 'AritaBuriM';} .volumn_wrap .sec05 .box>div h4 {font-size: 28px; line-height: 1.5;} .volumn_wrap .sec05 .box>div p {font-size: 18px; margin: 0; line-height: 1.5;} .volumn_wrap .sec05 .box>div p strong {color: #7f5f3b; font-weight: 700;} .volumn_wrap .sec05 .box>div>div {width: 50%;} .volumn_wrap .sec05 .box>.right {flex-direction: row-reverse; text-align: right;} .volumn_wrap .sec05 .box .volume_list ul {display: flex; max-width: 500px; flex-wrap: wrap; margin: 40px auto 0; gap: 20px; justify-content: center;} .volumn_wrap .sec05 .box .volume_list ul li a img {max-width: 150px;} .volumn_wrap .sec05 .box .volume_list .volume_collagen_list2 {display: flex; max-width: 500px; flex-wrap: wrap; margin: 40px auto 0;} .volumn_wrap .sec05 .box .disc>h5 {font-family: 'SangBlueOgSerifRelgular'; font-size: 44px; position: relative; display: inline-block;} .volumn_wrap .sec05 .box .disc>h5::after {content: '01'; position: absolute; right: -50px; top: -50px; color: #aa8863; opacity: 0.1; font-size: 74px; font-family: 'Marcellus'} .volumn_wrap .sec05 .disc {text-align: center;} .volumn_wrap .sec05 .volume_list {padding: 40px 70px; box-sizing: border-box;} .volumn_wrap .sec05 .box .collagen_thumbnail2+.volume_list .disc>h5::after {content: '02';} .volumn_wrap .sec05 .box .collagen_thumbnail3+.volume_list .disc>h5::after {content: '03';} .volumn_wrap .sec05 .box .collagen_thumbnail4+.volume_list .disc>h5::after {content: '04';} .volumn_wrap .sec05 .box .collagen_thumbnail3+.volume_list ul {display: flex;} .volumn_wrap .sec05 .box .collagen_thumbnail3+.volume_list ul li img {width: 100%;} .volume_none {display: none;} @media(max-width:768px) { .volumn_wrap .sec05 {padding: 150px 0;}.volumn_wrap .sec05 .sec_tit h3, .volumn_wrap .sec05 .sec_tit h1 {font-size: 36px;} .volumn_wrap .sec05 .sec_tit span {font-size: 18px;} .volumn_wrap .sec05 .box>div>div {width: 100%;} .volumn_wrap .sec05 .box>.right, .volumn_wrap .sec05 .box>div {flex-direction: column;} .volumn_wrap .sec05 .volume_list {padding: 20px; margin-bottom: 50px;} .volumn_wrap .sec05 .box .disc {margin-top: 30px;} .volumn_wrap .sec05 .box .disc>h5 {font-size: 32px; width: 100%;} .volumn_wrap .sec05 .box .disc>h5::after {left: 0; right: auto;} .volumn_wrap .sec05 .box .disc>p {font-size: 18px;} .volumn_wrap .sec05 .box .volume_list ul {grid-template-columns: repeat(2, 1fr); display: grid; flex-wrap: nowrap;} .volumn_wrap .sec05 .box .volume_list .volume_collagen_list1 li:nth-child(5), .volumn_wrap .sec05 .box .volume_list .volume_collagen_list1 li:nth-child(6) {display: none;} .volumn_wrap .sec05 .box .collagen_thumbnail3+.volume_list ul, .volumn_wrap .sec05 .box .volume_list .volume_collagen_list2 {display: grid; grid-template-columns: repeat(2, 1fr);} } .volumn_wrap .sec06 {background-color: #fff;} .volumn_wrap .sec06 .box {display: flex; justify-content: center; gap: 40px; max-width: 1660px; margin: 0 auto;} .volumn_wrap .sec06 .box>div {width: 50%;} .volumn_wrap .sec06 .box>div .txt {display: flex; justify-content: space-between; align-items: flex-start; margin-top: 20px;} .volumn_wrap .sec06 .box>div .txt .yotube_disc {display: flex; border: 1px solid #000; padding: 10px 20px; border-radius: 20px; align-items: center;} .volumn_wrap .sec06 .box>div .txt .yotube_disc img {margin-right: 10px;} .volumn_wrap .sec06 .box>div .txt .yotube_disc a {font-size: 16px; color: #222;} .volumn_wrap .sec06 .box>div .txt h5 {font-size: 22px; font-weight: 600; margin-bottom: 10px; text-align: left;} .volumn_wrap .sec06 .box>div .txt p {font-size: 20px;} .volumn_wrap .sec06 .box .thumbnail {position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden;} .volumn_wrap .sec06 .box .thumbnail iframe, .volumn_wrap .sec06 .box .thumbnail object, .volumn_wrap .sec06 .box .thumbnail embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} .volumn_wrap .sec05 .box .volume_list .volume_collagen_list4 {display: flex; justify-content: center;} .volumn_wrap .sec09 .sec_tit, .volumn_wrap .sec06 .sec_tit, .volumn_wrap .sec05 .sec_tit {margin-bottom: 50px;} .volumn_wrap .sec09 .sec_tit span, .volumn_wrap .sec06 .sec_tit span, .volumn_wrap .sec05 .sec_tit span {color: #5c5c5c; font-family: "Noto Serif KR", serif; font-size: 24px; margin-bottom: 0;} @media(max-width:768px) { .volumn_wrap .sec06 {padding: 150px 0;} .volumn_wrap .sec06 .sec_tit span {font-size: 18px;} .volumn_wrap .sec06 .box {flex-direction: column;} .volumn_wrap .sec06 .box>div {width: 100%;} .volumn_wrap .sec06 .box>div .txt {padding: 10px; flex-direction: row; margin-top: 0; align-items: center;} .volumn_wrap .sec06 .box>div .txt .yotube_disc a {white-space: nowrap; font-size: 12px;} .volumn_wrap .sec06 .box>div .txt .yotube_disc img {max-width: 20px;} .volumn_wrap .sec06 .box>div .txt .yotube_disc span {white-space: nowrap;} .volumn_wrap .sec06 .box>div .txt h5 {font-size: 18px;} .volumn_wrap .sec06 .box>div .txt p {font-size: 14px;} .volumn_wrap .sec06 .box>div .txt .yotube_disc {font-size: 14px; padding: 10px; margin-top: 0;} } .volumn_wrap .sec07 {padding: 200px 0; text-align: center; background-color: #FAFAFA;} .volumn_wrap .sec07 h3 {font-size: 24px; font-weight: 500; line-height: 1.5; margin-top: 50px; color: #222;} .volumn_wrap .sec07 .thumbnail img {width: 100%; max-width: 1200px;} .volumn_wrap .sec07 .bodyfit_review .swiper-slide img {width: 100%;} .volumn_wrap .sec07 .bodyfit_review {margin-left: -250px;} .volumn_wrap .sec07 .bodyfit_review .swiper-pagination {display: none;} .volumn_wrap .sec07 .disc {margin: 150px 0 50px;} .volumn_wrap .sec07 .disc p {font-weight: 300; font-size: 16px; letter-spacing: 8px; color: #61462F;} .volumn_wrap .sec07 .disc h4 {font-size: 36px; font-family: "Noto Serif KR", serif; margin-top: 30px; color: #61462F;} .volumn_wrap .sec07 .inuq {margin: 30px 0;} .volumn_wrap .sec07 .inuq a {padding: 12px 36px; color: #fff; font-size: 26px; background-color: #B28965; border-radius: 30px; font-weight: 600;} .volumn_wrap .sec07 .real-review-box .swiper-slide .txt_box p {line-height: 1.5; text-align: left; font-weight: 500;} @media(max-width:768px) { .volumn_wrap .sec07 {margin: 0; padding: 150px 0;} .volumn_wrap .sec07 .disc {margin: 100px 0 50px 0} .volumn_wrap .sec07 .disc h4 {margin-top: 15px;} .volumn_wrap .sec07 .inuq a {font-size: 18px;} .volumn_wrap .sec07 .real-review-box .swiper-slide {min-height: 200px;} .volumn_wrap .sec07 .real-review-box .swiper-slide .txt_box {font-size: 12px; padding: 15px;} } .volumn_wrap .sec08 {padding: 200px 0; text-align: center; position: relative; font-family: 'Pretendard'; max-width: 1200px; margin: 0 auto;} .volumn_wrap .sec08 .sec08_box {display: flex;} .volumn_wrap .sec08 .sec08_box .sec08_thumbnail {width: 40%; position: relative;} .volumn_wrap .sec08 .sec08_box .sec08_thumbnail img {width: 100%; vertical-align: bottom;} .volumn_wrap .sec08 .sec08_box .txt_box {width: 60%; text-align: left; margin-right: 50px;} .volumn_wrap .sec08 .sec08_box .txt_box h2 {font-family: 'SangBlueOgSerifRelgular'; font-size: 54px;} .volumn_wrap .sec08 .sec08_box .txt_box p {font-family: 'AritaBuriL'; font-size: 26px; margin-top: 15px; font-weight: 600;} .volumn_wrap .sec08 .sec08_box .txt_box ul {margin-top: 40px;} .volumn_wrap .sec08 .sec08_box .txt_box ul li {font-size: 20px; padding: 20px 0; border-top: 1px solid #EBEBEB; font-weight: 600; display: flex; align-items: center;} .volumn_wrap .sec08 .sec08_box .txt_box ul li:last-child {border-bottom: 1px solid #EBEBEB;} .volumn_wrap .sec08 .sec08_box .txt_box ul li span:first-child {font-family: 'SangBleuOGSerif-Medium';} .volumn_wrap .sec08 .sec08_box .txt_box ul li span:nth-child(2) {color: #9D9D9D; margin: 0 8px; font-size: 32px;} .volumn_wrap .sec08 .sec08_box .txt_box ul li span:nth-child(3) {font-weight: 400;} .volumn_wrap .sec08 .sec08_box .txt_box .inqu a {background-color: #DCCCB2; color: #fff; padding: 12px 36px; border-radius: 36px; font-size: 26px; margin-top: 50px; font-weight: 600;} .volumn_wrap .sec08 .sec08_box .txt_bg {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; width: 200%;} .volumn_wrap .sec08 .sec08_box .txt_bg img {width: 100%;} .volumn_wrap .sec09 {padding: 200px 0;} .volumn_wrap .sec09 .sec_tit p {font-family: 'AritaBuriM';} .volumn_wrap .sec09 .txt p {font-size: 20px; line-height: 1.5; font-size: 24px;} .volumn_wrap .sec09 .txt p strong {color: #aa8863; font-weight: 700; margin: 30px 0 40px; display: inline-block; font-size: 24px;} .volumn_wrap .sec09 ul {display: flex !important; padding: 40px; box-sizing: border-box; gap: 30px; align-items: center; max-width: 1200px; margin: 0 auto;} .volumn_wrap .sec09 ul li {flex: 1;} .volumn_wrap .sec09 ul li:nth-child(2) {flex: 1;} .volumn_wrap .sec09 ul li img {width: 100%;} .volumn_wrap .sec09 .sec09_disc {text-align: center;} .volumn_wrap .sec09 .sec09_disc span {padding: 10px 30px; border: 1px solid #f4f4f4; color: #cdcdcd; display: inline-flex; align-items: center;} .volumn_wrap .sec09 .sec09_disc span img {margin-right: 10px;} @media(max-width:1240px) { .volumn_wrap .sec09 ul {padding: 0 50px 40px;} .volumn_wrap .sec09 .sec09_disc span img {max-width: 20px; margin-bottom: 15px;} } @media(max-width:768px) { .volumn_wrap .sec08 {padding: 150px 0 !important:} .volumn_wrap .sec09 {padding: 150px 0:} .volumn_wrap .sec09 ul.pc_img {display: none !important;} .volumn_wrap .sec09 .sec09_disc span {flex-direction: column; font-size: 12px; line-height: 1.3;} .volumn_wrap .sec09 .sec09_disc span img {max-width: 20px; margin-bottom: 15px;} .volumn_wrap .sec08 .sec08_box .txt_box ul li span:nth-child(2) {font-size: 20px;} } .volumn_wrap .sec10 {padding: 200px 0; background-color: #fafafa; position: relative; margin-top: 200px; position: relative;} .volumn_wrap .sec10::after {content: ""; position: absolute; left: 50%; top: -150px; width: 1px; height: 300px; background-color: #000;} .volumn_wrap .sec10 .sec_tit h2 {font-family: "Noto Serif KR", serif; font-weight: 600; font-size: 44px; line-height: 1.5; margin-bottom: 50px;} .volumn_wrap .sec10 .box {max-width: 1200px; margin: 0 auto; background-color: #fff; padding: 120px; box-shadow: 10px 10px 30px 10px rgba(0, 0, 0, 0.10); text-align: center; z-index: 1; position: relative; box-sizing: border-box;} .volumn_wrap .sec10 .box .thumbnail {display: flex; justify-content: center; align-items: center; gap: 30px;} .volumn_wrap .sec10 .box .thumbnail div img {max-width: 400px} .volumn_wrap .sec10 .box .txt h4 {font-family: 'SangBlueOgSerifRelgular'; font-size: 54px;} .volumn_wrap .sec10 .box .txt p {font-size: 20px; font-weight: 500; margin: 20px 0 50px; font-family: "Noto Serif KR", serif; line-height: 1.5;} .volumn_wrap .sec10 .box .txt span {color: #AF906D; font-size: 24px; font-weight: 600; margin: 50px 0 20px;} .volumn_wrap .sec10 .box .txt .more a {padding: 13px 35px; background-color: #DBCDB2; color: #FFF; font-size: 22px; border-radius: 30px; font-weight: 600;} .volumn_wrap .sec10 .volume_sec10_bg {position: absolute; top: 58%; left: 5%; transform: translateY(-50%); z-index: 0; width: 100%; max-width: 250px;} .volumn_wrap .sec10 .volume_sec10_bg img {width: 100%;} @media(max-width:1240px) { .medical_law img {max-width: 20px} .volumn_wrap img {width: 100%;} .volumn_wrap .sec10 .sec_tit h2 {font-size: 24px; margin-bottom: 50px;} .volumn_wrap .sec10 .box {padding: 40px 20px;} } @media(max-width:768px) { .volumn_wrap .sec10 {margin: 0 0 150px; padding: 150px 0;} .volumn_wrap .sec10::after {display: none;} .volumn_wrap .sec10 .sec_tit {position: relative; z-index: 1;} .volumn_wrap .sec10 .box .txt h4 {font-size: 44px;} .volumn_wrap .sec10 .box .txt p {font-size: 16px;} .volumn_wrap .sec10 .box .txt span {font-size: 20px;} .volumn_wrap .sec10 .box .txt .more a {font-size: 16px;} .volumn_wrap .sec10 .volume_sec10_bg {top: 35%; left: -10%;} .volumn_wrap .sec10 .volume_sec10_bg img {width: 60%; max-width: 300px;} } .hydra_wrap .visual .visual_title p {font-size: 20px;} .hydra_wrap .sec01 {margin: 200px 0; padding: 200px 0; box-sizing: border-box; background-image: url('/assets/img/youlbit/images/hydra_sec01.webp'); background-repeat: no-repeat; background-position: center; background-size: cover; position: relative;} .hydra_wrap .sec01 h5 {color: #4F5A9F; font-size: 24px; font-weight: 600; margin-top: 70px;} .hydra_wrap .sec01 h4 {font-size: 44px; font-family: "Noto Serif KR", serif; font-weight: 600; margin: 20px 0 50px;} .hydra_wrap .sec01 p {font-size: 20px; color: #5f5f5f; line-height: 1.5; font-weight: 400;} .hydra_wrap .sec01 p b {font-weight: 600;} @media(max-width:1024px) { .hydra_wrap .sec01 {padding: 0; margin: 150px 0; background-image: url('/assets/img/youlbit/images/m-hydra_sec01.webp');} .hydra_wrap .sec01 h5 {font-size: 20px; margin-top: 40px;} .hydra_wrap .sec01 h4 {font-size: 34px; margin: 20px 0 40px;} .hydra_wrap .sec01 p {font-size: 16px;} .hydra_wrap .sec01 .hydra_logo img {width: 100%; max-width: 80%; margin: 0 auto;} .hydra_wrap .visual .visual_title h2, .hydra_wrap .visual .visual_title h1 {font-size: 36px; line-height: 1.6;} } .hydra_wrap .sec02 {padding: 300px 0; margin: 100px 0; position: relative; box-shadow: 0px 0px 60px 0px #EDEDED inset;} .hydra_wrap .sec02 .bg {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)} .hydra_wrap .sec02 ul {display: flex; justify-content: center; align-items: center; gap: 50px;} @media(max-width:1024px) { .hydra_wrap .sec02 ul {gap: 10px; margin: 0 20px;} .hydra_wrap .sec02 ul li img {width: 100%;} .hydra_wrap .sec02 .bg {width: 90%;} .hydra_wrap .sec02 .bg img {width: 100%;} } .hydra_wrap .sec03 {padding: 200px 0;} .hydra_wrap .sec03 .animated-title {font-size: 24px; font-weight: 300; position: relative; width: 100%; max-width: 100%; height: auto; padding: 0 0 34px; overflow: hidden;} .hydra_wrap .sec03 .animated-title .track {position: absolute; white-space: nowrap; will-change: transform; animation: marquee1 100s linear infinite;} .hydra_wrap .sec03 .animated-title2 {font-size: 24px; font-weight: 300; position: relative; width: 100%; max-width: 100%; height: auto; padding: 34px 0; overflow: hidden;} .hydra_wrap .sec03 .animated-title2 .track {position: absolute; white-space: nowrap; will-change: transform; animation: marquee2 100s linear infinite; right: -100%; top: 15px;} .hydra_wrap .sec03 .animated-title2 .content img {margin: 0 100px;} .hydra_wrap .sec03 .content {font-family: 'SangBleuOGSerif-Regular'; display: flex; align-items: center;} .hydra_wrap .sec03 .video video {width: 100%; max-height: 800px;} .hydra_wrap .sec03 .video {width: 100%; max-height: 800px; background: #000;} .sec03 {overflow: hidden;} @keyframes marquee1 { from {transform: translateX(0);} to {transform: translateX(-50%);} } @keyframes marquee2 { from {transform: translateX(0);} to {transform: translateX(50%);} } @media(max-width:1024px) { .hydra_wrap .sec03 {padding: 150px 0;} .hydra_wrap .sec03 .animated-title {padding: 0 0 24px;} .hydra_wrap .sec03 .animated-title2 {padding: 24px 0 0;} .hydra_wrap .sec03 .animated-title2 .track {top: 10px;} .hydra_wrap .sec03 .animated-title2 .content img, .animated-title .content img {width: 150px; margin: 0 30px;} .hydra_wrap .sec03 .animated-title2, .hydra_wrap .sec03 .animated-title {font-size: 16px;} .hydra_wrap .sec03 .animated-title2 {padding: 36px 0 0;} .hydra_wrap .sec03 .video video {width: 100%;} } .hydra_wrap .sec04 {padding: 200px 0 0;} .hydra_wrap .sec04 .box {display: flex; align-items: center; justify-content: center; flex-direction: row-reverse;} .hydra_wrap .sec04 .box>div {flex: 1;} .hydra_wrap .sec04 .box .txt {padding: 40px; box-sizing: border-box; text-align: right;} .hydra_wrap .sec04 .box .txt h3 {font-size: 44px; text-align: center; font-family: "Noto Serif KR", serif; color: #313E8E; font-weight: 600; margin: 50px 0; text-align: right;} .hydra_wrap .sec04 .box .txt p {line-height: 1.5; font-size: 20px; font-weight: 400;} .hydra_wrap .sec04 .box .txt p strong {font-weight: 600;} .hydra_wrap .sec04 .box .tit_img {max-width: 600px; margin-left: auto; position: relative;} .hydra_wrap .sec04 .box .tit_img::after {content: ""; position: absolute; left: -35px; top: 0; transform: translateY(-50%); background-image: url('/assets/img/youlbit/images/symbol-black.png'); width: 135px; height: 180px;} .hydra_wrap .sec04 .box .tit_img img {width: 100%;} @media(max-width:1024px) { .hydra_wrap .sec04 .box {flex-direction: column;} .hydra_wrap .sec04 .box>.thumbnaul {padding: 0 20px;} .hydra_wrap .sec04 .box>div img {width: 100%;} .hydra_wrap .sec04 .box .txt {padding: 40px 20px;} .hydra_wrap .sec04 .box .txt h3 {font-size: 24px; margin: 30px 0 20px; text-align: center;} .hydra_wrap .sec04 .box .txt p {font-size: 16px; text-align: center;} .hydra_wrap .sec04 .box .tit_img::after {left: 0; top: 50px; background-size: cover; width: 41px; height: 54px;} } .hydra_wrap .sec05 {padding: 0 0 200px;} .hydra_wrap .txt_list {margin: 0 auto; text-align: left; box-sizing: border-box;} .hydra_wrap .sec05 .txt_list {position: relative; padding: 50px; margin: 100px 0; display: flex; justify-content: space-between; flex-wrap: wrap;} .hydra_wrap .sec05 .txt_list::after {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #fcfcfc; z-index: -1;} .hydra_wrap .sec05 .txt_list .txt_item {margin: 50px 0 0; text-align: center;} .hydra_wrap .sec05 .txt_list .txt_item:last-child {margin: 50px 0 0;} .hydra_wrap .sec05 .txt_list .txt_item p {font-weight: 300; font-size: 20px; display: inline-block; position: relative; line-height: 1.5; text-align: center;} .hydra_wrap .sec05 .txt_list .txt_item p::after {position: absolute; left: 80%; top: 60%; white-space: nowrap;} .hydra_wrap .sec05 .txt_list .txt_item p strong {font-weight: 600; color: #505b9f; text-decoration: underline; text-decoration-thickness: 2px; text-underline-position: under; line-height: 1.5;} .hydra_wrap .sec05 .txt_list .txt_item h4 {font-size: 44px; color: #323863; font-family: 'Marcellus'; opacity: 0.1; white-space: nowrap;} .txt_item {position: relative;} .txt_item1::after {content: "01"} .txt_item2::after {content: "02";} .txt_item3::after {content: "03";} .txt_item1::after, .txt_item2::after, .txt_item3::after {position: absolute; bottom: 110%; left: 50%; transform: translate(-50%); font-size: 44px; font-family: 'Marcellus'; color: #323863; opacity: 0.1;} @media(max-width:1500px) { .hydra_wrap .sec05 .txt_list {flex-direction: column; align-items: center;} .hydra_wrap .sec05 .txt_list {padding: 100px 20px;} .hydra_wrap .sec05 .txt_list .txt_item {margin: 0 0 80px;} .hydra_wrap .sec05 .txt_list .txt_item:last-child {margin: 0;} .hydra_wrap .sec05 .txt_list .txt_item h4 {font-size: 26px;} .hydra_wrap .sec05 .txt_list .txt_item p {font-size: 16px;} .txt_item1::after, .txt_item2::after, .txt_item3::after {font-size: 34px;} } @media(max-width:1024px) { .hydra_wrap .sec05 .txt_list {padding: 100px 20px;} .hydra_wrap .sec05 .txt_list .txt_item {margin: 0 0 80px;} .hydra_wrap .sec05 .txt_list .txt_item:last-child {margin: 0;} .hydra_wrap .sec05 .txt_list .txt_item h4 {font-size: 26px;} .hydra_wrap .sec05 .txt_list .txt_item p {font-size: 16px;} .txt_item1::after, .txt_item2::after, .txt_item3::after {font-size: 34px;} } .hydra_wrap .sec06 {padding: 0; background-color: transparent; margin: 200px 0;} .hydra_wrap .sec06 .box {padding: 0 0 200px; position: relative;} .hydra_wrap .sec06 .box .one-bg {position: absolute; top: 50%; transform: translateY(-50%); z-index: -1; opacity: .5;} .hydra_wrap .sec06 .box .one-bg1 {right: 150px;} .hydra_wrap .sec06 .box .one-bg2 {left: 150px;} .hydra_wrap .sec06 .content {max-width: 1240px; margin: 0 auto; display: flex; align-items: flex-end; justify-content: center; gap: 30px;} .hydra_wrap .sec06 .content .txt {text-align: left;} .hydra_wrap .sec06 .content .txt h2 {font-size: 54px; margin-bottom: 60px; position: relative; display: inline-block; padding: 0 8px; font-family: 'SangBleuOGSerif-RegularItalic';} .hydra_wrap .sec06 .content .txt h2::after {content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 80%; background-color: #505b9f; opacity: 0.1;} .hydra_wrap .sec06 .content .txt p {font-size: 20px; line-height: 1.5;} .hydra_wrap .sec06 .content .thumbnail {max-height: 850px; padding: 0 20px;} .hydra_wrap .sec06 .content .thumbnail img {max-height: 850px; width: 100%;} @media(max-width:1024px) { .hydra_wrap .sec06 {padding: 0 0 150px;} .hydra_wrap .sec06 {margin: 0;} .hydra_wrap .sec06 .box .one-bg1 {right: auto; top: 20%; left: 0; transform: translateY(0); width: 100%; max-width: 70px;} .hydra_wrap .sec06 .box .one-bg2 {left: auto; top: 7%; right: 0; transform: translateY(0); width: 100%; max-width: 147px;} .hydra_wrap .sec06 .box .one-bg2 img, .hydra_wrap .sec06 .box .one-bg1 img {width: 100%;} .hydra_wrap .sec06 .content {flex-direction: column; align-items: flex-start;} .hydra_wrap .sec06 .content .txt {padding: 0 20px;} .hydra_wrap .sec06 .content .txt h2 {margin-bottom: 15px; font-size: 32px;} .hydra_wrap .sec06 .content .txt p {font-size: 14px;} } .hydra_wrap .sec07 {padding: 200px 0;} .hydra_wrap .sec07 .animated-title {font-size: 24px; font-family: 'Raleway', Sans-serif; font-weight: 300; position: relative; width: 100%; max-width: 100%; height: auto; padding: 0 0 34px; overflow: hidden;} .hydra_wrap .sec07 .animated-title .track {position: absolute; white-space: nowrap; will-change: transform; animation: marquee1 100s linear infinite;} .hydra_wrap .sec07 .animated-title2 {font-size: 24px; font-family: 'Raleway', Sans-serif; font-weight: 300; position: relative; width: 100%; max-width: 100%; height: auto; padding: 38px 0 0; overflow: hidden;} .hydra_wrap .sec07 .animated-title2 .track {position: absolute; white-space: nowrap; will-change: transform; animation: marquee2 100s linear infinite; right: -100%; top: 10px;} .hydra_wrap .sec07 .animated-title2 .content img, .animated-title .content img {margin: 0 100px;} .hydra_wrap .sec07 .animated-title .content, .hydra_wrap .sec07 .animated-title2 .content {font-family: 'SangBleuOGSerif-Regular';} .hydra_wrap .sec07 .content {display: flex; align-items: center;} .hydra_wrap .sec07 .video {width: 100%; max-height: 800px; background: #000;} .hydra_wrap .sec07 .video video {width: 100%; max-height: 800px;} @keyframes marquee1 { from {transform: translateX(0);} to {transform: translateX(-50%);} } @keyframes marquee2 { from {transform: translateX(0);} to {transform: translateX(50%);} } @media(max-width:1024px) { .hydra_wrap .sec07 {padding: 150px 0;} .hydra_wrap .sec07 .animated-title {padding: 0 0 24px;} .hydra_wrap .sec07 .animated-title2 {padding: 36px 0 0;} .hydra_wrap .sec07 .animated-title2 .track {top: 10px;} .hydra_wrap .sec07 .animated-title2 .content img, .animated-title .content img {width: 200px; margin: 0 30px;} .hydra_wrap .sec07 .animated-title2, .hydra_wrap .sec07 .animated-title {font-size: 16px;} .hydra_wrap .sec07 .video {width: 100%;} .hydra_wrap .sec07 video video {width: 100%;} } .hydra_wrap .sec08 {padding: 200px 0} .hydra_wrap .sec08 .sec_tit {max-width: 1240px; margin: 0 auto; text-align: center;}.hydra_wrap .sec08 .sec_tit h3, .hydra_wrap .sec08 .sec_tit h1 {font-size: 44px; font-family: "Noto Serif KR", serif !important; margin-bottom: 10px; font-weight: 600; line-height: 1.3;} .hydra_wrap .sec08 .sec_tit span {font-size: 24px; margin: 10px 0 50px; font-weight: 600; font-family: 'SangBleuOGSerif-Regular'; color: #505b9f;} .hydra_wrap .sec08 .treatment_box {max-width: 1200px; margin: 0 auto;} .hydra_wrap .sec08 .treatment_box .box:last-child .thumbnail {border: 1px solid rgba(0, 0, 0, .1)} .hydra_wrap .sec08 .treatment_box .box {display: flex; align-items: center;} .hydra_wrap .sec08 .treatment_box .box:nth-child(even) {flex-direction: row-reverse; text-align: right;} .hydra_wrap .sec08 .treatment_box .box>div {width: 50%;} .hydra_wrap .sec08 .treatment_box .box>div video {width: 100%;} .hydra_wrap .sec08 .treatment_box .box img {vertical-align: bottom; width: 100%;} .hydra_wrap .sec08 .treatment_box .box .txt {padding: 50px; box-sizing: border-box; text-align: left;} .hydra_wrap .sec08 .treatment_box .box .txt h3 {text-align: left; font-weight: 400; font-size: 34px; line-height: 1.5;} .hydra_wrap .sec08 .treatment_box .box .txt h3 small {font-size: 20px;} .hydra_wrap .sec08 .treatment_box .box .txt h3 strong {font-weight: 700;} .hydra_wrap .sec08 .treatment_box .box .txt p {margin-top: 10px; line-height: 1.5; font-size: 20px;} .hydra_wrap .sec08 .treatment_box .box:nth-child(even) .txt {text-align: right;} .hydra_wrap .sec08 .treatment_box .box:nth-child(even) .txt h3 {text-align: right;} @media(max-width:1024px) { .hydra_wrap .sec08 {padding: 150px 0;}.hydra_wrap .sec08 .sec_tit h3, .hydra_wrap .sec08 .sec_tit h1 {font-size: 24px; line-height: 1.3;} .hydra_wrap .sec08 .sec_tit span {font-size: 24px;} .hydra_wrap .sec08 .treatment_box {padding: 0 20px;} .hydra_wrap .sec08 .treatment_box .box>div {width: 100%;} .hydra_wrap .sec08 .treatment_box .box:nth-child(even), .hydra_wrap .sec08 .treatment_box .box {flex-direction: column; margin-bottom: 50px;} .hydra_wrap .sec08 .treatment_box .box .txt {padding: 20px 0; text-align: center;} .hydra_wrap .sec08 .treatment_box .box .txt h3 {font-size: 18px; text-align: center;} .hydra_wrap .sec08 .treatment_box .box .txt p {font-size: 16px; text-align: center;} .hydra_wrap .sec08 .treatment_box .box:nth-child(even) {text-align: center;} .hydra_wrap .sec08 .treatment_box .box:nth-child(even) .txt h3 {text-align: center;} } .hydra_wrap .sec09 {padding: 200px 0; background-color: #FBF9F6; margin: 200px 0;} .hydra_wrap .sec09 .sec_tit {max-width: 1240px; margin: 0 auto;}.hydra_wrap .sec09 .sec_tit h3, .hydra_wrap .sec09 .sec_tit h1 {font-size: 44px; font-family: "Noto Serif KR", serif !important; margin-bottom: 10px; font-weight: 600;} .hydra_wrap .sec09 .sec_tit span {font-size: 24px; margin: 10px 0 50px; font-weight: 600; font-family: 'SangBleuOGSerif-Regular', serif; color: #1E2C85;} .hydra_wrap .sec09 .technology_box {display: flex; justify-content: center; gap: 40px;} .hydra_wrap .sec09 .technology_box .box {display: flex; flex-direction:column; align-items: center;} .hydra_wrap .sec09 .technology_box .thumbnail {position: relative; max-width:400px;} .hydra_wrap .sec09 .technology_box .thumbnail img {vertical-align: bottom; max-width: 400px} .hydra_wrap .sec09 .technology_box .thumbnail img.off {display: none;} .hydra_wrap .sec09 .technology_box .thumbnail .disc {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: #fff; display: none;} .hydra_wrap .sec09 .technology_box .thumbnail .disc p {font-weight: 400; font-size: 24px; line-height: 1.5;} .hydra_wrap .sec09 .technology_box .thumbnail .disc p strong {font-weight: 600;} .hydra_wrap .sec09 .technology_box .thumbnail:hover img.off {display: block;} .hydra_wrap .sec09 .technology_box .thumbnail:hover img.on {display: none;} .hydra_wrap .sec09 .technology_box .thumbnail:hover .disc {display: block;} .hydra_wrap .sec09 .technology_box .txt {text-align: center;} .hydra_wrap .sec09 .technology_box .txt h5 {font-family: "Noto Serif KR", serif; font-size: 20px; font-weight: 500; margin: 30px 0;} .hydra_wrap .sec09 .technology_box .txt h4 {font-family: 'SangBlueOgSerifRelgular', serif; font-size: 28px; line-height: 1.3;} .hydra_wrap .sec09 .technology_box .txt p {margin-top: 20px; line-height: 1.5; font-size: 18px;} @media(max-width:1024px) { .hydra_wrap .sec09 {margin: 0;}.hydra_wrap .sec09 .sec_tit h3, .hydra_wrap .sec09 .sec_tit h1 {font-size: 24px;} .hydra_wrap .sec09 .technology_box {flex-direction: column; gap: 100px; padding: 0 20px;} .hydra_wrap .sec09 .technology_box .thumbnail {overflow: hidden; border-radius: 43px;} .hydra_wrap .sec09 .technology_box .thumbnail img {width: 100%;} .hydra_wrap .sec09 .technology_box .thumbnail img.on {display: block;} .hydra_wrap .sec09 .technology_box .thumbnail .disc {transform: translate(-50%, 0%); top: 0; width: 100%; background-color: rgba(0, 0, 0, 0.5); padding: 5px 0;} .hydra_wrap .sec09 .technology_box .thumbnail .disc p {font-size: 14px;} .hydra_wrap .sec09 .technology_box .thumbnail .disc br {display: none;} .hydra_wrap .sec09 .technology_box .thumbnail:hover img.off, .hydra_wrap .sec09 .technology_box .thumbnail img.off {display: none} .hydra_wrap .sec09 .technology_box .thumbnail:hover img.on {display: block;} .hydra_wrap .sec09 .technology_box .thumbnail:hover .disc, .hydra_wrap .sec09 .technology_box .thumbnail .disc {display: block;} .hydra_wrap .sec09 .technology_box .txt h5 {font-size: 18px; margin: 20px 0;} .hydra_wrap .sec09 .technology_box .txt h4 {font-size: 32px; line-height: 1.3;} .hydra_wrap .sec09 .technology_box .txt p {font-size: 14px; margin-top: 20px;} } .hydra_wrap .sec10 {padding: 200px 0; text-align: center; position: relative; font-family: 'Pretendard'; max-width: 1240px; margin: 0 auto;} .hydra_wrap .sec10 .sec10_box {display: flex; justify-content: space-between; position: relative;} .hydra_wrap .sec10 .sec10_box .txt_box {width: 60%; text-align: left; margin-right: 50px; position: relative;} .hydra_wrap .sec10 .sec10_box .txt_box h2 {font-family: "Noto Serif KR", serif; font-size: 44px; font-weight: 600;} .hydra_wrap .sec10 .sec10_box .txt_box h3 {font-family: "SangBleuOGSerif-Regular"; font-size: 28px; margin-top: 15px; font-weight: 500; color: #dddddd; text-align: left;} .hydra_wrap .sec10 .sec10_box .txt_box p {font-size: 24px; margin-top: 15px; line-height: 1.5; display: inline-block; position: relative;} .hydra_wrap .sec10 .sec10_box .txt_box p::after {content: ""; position: absolute; bottom: -10px; left: 0; width: 125%; height: 1px; background-color: #505b9f;} .hydra_wrap .sec10 .sec10_box .txt_box p strong {font-family: "SangBleuOGSerif-Regular";} .hydra_wrap .sec10 .sec10_box .txt_box .inqu {margin-top: 80px} .hydra_wrap .sec10 .sec10_box .txt_box .inqu {margin-top: 20px;} .hydra_wrap .sec10 .sec10_box .txt-bg {position: absolute; top: -21%; left: -18%; max-width: 300px;} .hydra_wrap .sec10 .sec10_box .txt-bg img {width: 100%;} .hydra_wrap .sec10 .sec10_box .thumbnail-box {max-height: 800px;} .hydra_wrap .sec10 .sec10_box .thumbnail-box .pc_img {max-height: 800px;} .hydra_wrap .sec10 .sec10_box .sec07_thumbnail {width: 40%; position: relative;} .hydra_wrap .sec10 .sec10_box .sec07_thumbnail img {width: 100%; vertical-align: bottom;} ul.hydrafacial_tabs {margin: 0px; margin-top: 80px; padding: 0px; list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;} ul.hydrafacial_tabs li {background: none; position: relative; padding: 10px 15px; cursor: pointer; text-align: center; display: flex; width: 220px; height: 220px; border: 1px solid #a49d8f; justify-content: center; align-items: center; border-radius: 200px; line-height: 1.5; font-size: 20px; color: #a49d8f;} ul.hydrafacial_tabs li.current {border: 1px solid #505b9f; color: #505b9f;} .hydra-tab-content {display: none; padding: 15px 0; margin-top: 15px; font-size: 18px;} .hydra-tab-content.current {line-height: 1.5; display: inherit;} .sec10_box_img {display: none;} .sec10_box_img.pc_img {display: none !important;} .sec10_box_img.active.pc_img {display: block !important} .sec10_box_img.active.mb_img {display: none !important} @media(max-width:1240px) { .thumbnail-box .mb_img {display: none !important} .thumbnail-box .sec10_box_img.active.pc_img {display: none !important} .thumbnail-box .sec10_box_img.active.mb_img {display: block !important} .hydra_wrap .sec10 {padding: 150px 0;} .hydra_wrap .sec10 .sec10_box {flex-direction: column;} .hydra_wrap .sec10 .sec10_box .txt_box .inqu {margin-top: 20px;} .hydra_wrap .sec10 .sec10_box .txt_box {width: 100%; text-align: center; margin-top: 40px;} .hydra_wrap .sec10 .sec10_box .txt_box h2 {font-size: 24px;} .hydra_wrap .sec10 .sec10_box .txt_box p {font-size: 16px;} .hydra_wrap .sec10 .sec10_box .txt_box h3 {text-align: center;} .hydra_wrap .sec10 .sec10_box .txt-bg {top: -5%; left: -5%; max-width: 200px; width:100%;} .hydra_wrap .sec10 .sec10_box .sec07_thumbnail {width: 100%;} ul.hydrafacial_tabs {gap: 10px;} ul.hydrafacial_tabs li {width: 100px; height: 100px; padding: 0; font-size: 14px; line-height: 1.3;} ul.hydrafacial_tabs {margin: 20px 20px 30px;} .hydra_wrap .sec10 .sec10_box .txt_box p::after{width:100%;} .thumbnail-box img {width: 100%;} .hydra-tab-content.current {font-size: 14px;} .hydra_wrap .sec10 .sec-tab-content-box{display: flex ; flex-direction: column-reverse; align-items: center;} .hydra_wrap .sec10 .hydra-tab-content{padding:0; margin-top:0; margin-bottom:20px;} } @media(max-width:768px) { ul.hydrafacial_tabs li {width: 120px; height: 120px;} .hydra_wrap .sec10 .sec10_box .txt_box {margin-right: 0;} } .hydra_wrap .sec11 {padding: 200px 0; text-align: center; position: relative; font-family: 'Pretendard'; max-width: 1200px; margin: 0 auto; padding-bottom: 200px;} .hydra_wrap .sec11 .sec11_box {display: flex;} .hydra_wrap .sec11 .sec11_box .sec10_thumbnail {width: 40%; position: relative;} .hydra_wrap .sec11 .sec11_box .sec10_thumbnail img {width: 100%; vertical-align: bottom;} .hydra_wrap .sec11 .sec11_box .txt_box {width: 60%; text-align: left; margin-right: 200px;} .hydra_wrap .sec11 .sec11_box .txt_box h2 {font-family: 'SangBlueOgSerifRelgular'; font-size: 54px;} .hydra_wrap .sec11 .sec11_box .txt_box p {font-family: "Noto Serif KR", serif; font-size: 24px; margin-top: 15px; font-weight: 600;} .hydra_wrap .sec11 .sec11_box .txt_box ul {margin-top: 40px;} .hydra_wrap .sec11 .sec11_box .txt_box ul li {font-size: 20px; padding: 20px 0; border-top: 1px solid #EBEBEB; font-weight: 600; display: flex; align-items: center;} .hydra_wrap .sec11 .sec11_box .txt_box ul li:last-child {border-bottom: 1px solid #EBEBEB;} .hydra_wrap .sec11 .sec11_box .txt_box ul li span:first-child {font-family: 'SangBleuOGSerif-Medium'; font-weight: 400;} .hydra_wrap .sec11 .sec11_box .txt_box ul li span:nth-child(2) {color: #9D9D9D; margin: 0 8px; font-size: 32px;} .hydra_wrap .sec11 .sec11_box .txt_box ul li span:nth-child(3) {font-weight: 400;} .hydra_wrap .sec11 .sec11_box .txt_box .inqu a {background-color: #505b9f; color: #fff; padding: 12px 36px; border-radius: 36px; font-size: 24px; margin-top: 50px; font-weight: 600;} .hydra_wrap .sec11 .sec11_box .txt_bg {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; width: 200%;} .hydra_wrap .sec11 .sec11_box .txt_bg img {width: 100%;} @media(max-width:1240px) { .hydra_wrap .sec11 { padding: 150px 0;} .hydra_wrap .sec11 .sec11_box {flex-direction: column-reverse;} .hydra_wrap .sec11 .sec11_box .sec10_thumbnail {width: 100%;} .hydra_wrap .sec11 .sec11_box .txt_box {width: 100%; text-align: center; margin-top: 40px; margin-right: 0;} .hydra_wrap .sec11 .sec11_box .txt_box h2 {font-size: 36px;} .hydra_wrap .sec11 .sec11_box .txt_box p {font-size: 18px; font-weight: 600;} .hydra_wrap .sec11 .sec11_box .txt_box ul li {margin: 0 20px; padding: 10px 0;} .hydra_wrap .sec11 .sec11_box .txt_box ul li span {font-size: 14px;} .hydra_wrap .sec11 .sec11_box .txt_box .inqu a {font-size: 18px;} .hydra_wrap .sec11 .sec11_box .txt_bg {display: none;} } .hydra_wrap .sec12 {padding: 200px 0;} .hydra_wrap .sec12 .sec_tit {max-width: 1240px; margin: 0 auto;}.hydra_wrap .sec12 .sec_tit h3, .hydra_wrap .sec12 .sec_tit h1 {font-size: 54px; font-family: 'Marcellus'; margin-bottom: 10px;} .hydra_wrap .sec12 .sec_tit span {font-size: 24px; margin: 10px 0 50px; font-weight: 600; font-family: "Noto Serif KR", serif;} .hydra_wrap .sec12 .box {display: flex; gap: 20px; max-width: 1200px; margin: 0 auto;} .hydra_wrap .sec12 .box .thumbnail img {width: 100%;} .hydra_wrap .sec12 .sec12_disc {text-align: center; margin-top: 60px;} .hydra_wrap .sec12 .sec12_disc span {padding: 10px 30px; border: 1px solid #f4f4f4; color: #cdcdcd; display: inline-flex; align-items: center;} .hydra_wrap .sec12 .sec12_disc span img {margin-right: 10px;} .hydra_wrap .sec12 .effect_list ul {display: flex; justify-content: center; gap: 20px; margin: 30px 0;} .hydra_wrap .sec12 .hydra_before {margin: 50px 0;} .hydra_wrap .sec12 .swiper-slide img {width: 100%;} @media(max-width:1024px) { .hydra_wrap .sec12 {padding: 150px 0;} .hydra_wrap .sec12 .sec12_disc span {flex-direction: column; font-size: 12px; line-height: 1.5;} } @media(max-width:768px) { .hydra_wrap .sec12 {padding: 200px 20px;}.hydra_wrap .sec12 .sec_tit h3, .hydra_wrap .sec12 .sec_tit h1 {font-size: 42px;} .hydra_wrap .sec12 .sec_tit span {font-size: 16px;} .hydra_wrap .sec12 .sec07_disc span {font-size: 12px; padding: 10px 20px; flex-direction: column; gap: 5px; line-height: 1.3;} } .hydra_wrap .sec13 {padding: 200px 0 100px; background-color: #FBF9F6; position: relative; margin: 0 0 200px} .hydra_wrap .sec13 .sec_tit {width: calc(50% - 80px); text-align: right;}.hydra_wrap .sec13 .sec_tit h3, .hydra_wrap .sec13 .sec_tit h1 {font-size: 54px; font-family: 'SangBlueOgSansRegular'; margin-bottom: 10px; line-height: 1.3; text-align: right;} .hydra_wrap .sec13 .sec_tit span {font-size: 20px; margin: 0 0 50px; font-weight: 600; color: #505b9f;} .hydra_wrap .sec13 .box {display: flex;} .hydra_wrap .sec13 .box>div {flex: 1;} .hydra_wrap .sec13 .box .hydra-history-maq {margin-top: 100px;} .hydra_wrap .sec13 .box .hydra-history ul {padding-left: 80px; position: relative; padding-bottom: 100px;} .hydra_wrap .sec13 .box .hydra-history ul::after {content: ""; position: absolute; top: 10px; left: 40px; background-color: #7f6f55; width: 14px; height: 14px; border-radius: 14px;} .hydra_wrap .sec13 .box .hydra-history ul::before {content: ""; position: absolute; top: 10px; left: 47px; background-color: #7f6f55; width: 1px; height: 100%;} .hydra_wrap .sec13 .box .hydra-history ul li {font-size: 20px; line-height: 1.5; font-weight: 200;} .hydra_wrap .sec13 .box .hydra-history .history-item {display: flex; align-items: flex-start; text-align: left; width: auto;} .hydra_wrap .sec13 .box .hydra-history .history-item:last-child ul::before {display: none;} .hydra_wrap .sec13 .box .hydra-history .history-item h4 {font-size: 34px; font-family: 'SangBleuOGSerif-Regular';} .hydra_wrap .sec13 .txt-bg {position: absolute; bottom: 0; right: 0;} .sec .marquee__group>div span {text-align: left; margin-top: 10px;} @media(max-width:1024px) { .hydra_wrap .sec13 {padding: 150px 0; margin: 0 0 150px;} .hydra_wrap .sec13 .sec_tit {width: 100%; text-align: center;}.hydra_wrap .sec13 .sec_tit h3, .hydra_wrap .sec13 .sec_tit h1 {font-size: 32px; text-align: center;} .hydra_wrap .sec13 .sec_tit span {font-size: 16px; margin: 10px 0 50px;} .hydra_wrap .sec13 .box {flex-direction: column-reverse;} .hydra_wrap .sec13 .box .hydra-history ul {padding-left: 40px; padding-bottom: 60px;} .hydra_wrap .sec13 .box .hydra-history ul::after {width: 11px; height: 11px; left: 15px; top: 5px;} .hydra_wrap .sec13 .box .hydra-history ul::before {left: 20px;} .hydra_wrap .sec13 .box .hydra-history ul li {font-size: 14px; text-indent: -7px; margin-left: 7px;} .hydra_wrap .sec13 .box .hydra-history .hydra-history-box {padding: 0 20px;} .hydra_wrap .sec13 .box .hydra-history-maq {margin-top: 0;} .hydra_wrap .sec13 .box .hydra-history .history-item h4 {font-size: 20px} .hydra_wrap .sec13 .txt-bg {width: 50%;} .hydra_wrap .sec13 .txt-bg img {width: 100%;} .hydra_wrap .sec13 .wrapper {max-width: 90vw;} .hydra_wrap .sec13 .marquee--reverse {display: none;} .hydra_wrap .sec13 .marquee__group {gap: 20px; height: auto;} .hydra_wrap .sec13 .marquee__group span {display: block; text-align: left; margin-top: 10px;} .hydra_wrap .sec13 .marquee__group>div {max-width: 200px;} .hydra_wrap .sec13 .marquee__group>div img {width: 100%;} } .hydra_wrap .sec14 {padding: 200px 0; margin: 400px 0 200px; position: relative; background-image: url('/assets/img/youlbit/images/hydra_sec13_bg_new.webp'); text-align: center;} .hydra_wrap .sec14 .sec_tit {max-width: 1240px; margin: 0 auto;}.hydra_wrap .sec14 .sec_tit h3, .hydra_wrap .sec14 .sec_tit h1 {font-size: 44px; font-weight: 600; font-family: "Noto Serif KR", serif !important; color: #fff;} .hydra_wrap .sec14 .sec_tit span {font-size: 34px; font-family: 'SangBleuOGSerif-Regular'; margin-bottom: 10px; background: linear-gradient(0deg, #F7E6A2 20%, #D1A853 80%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;} .hydra_wrap .sec14 p {margin-bottom: 10px; font-size: 28px; line-height: 1.5; color: #d7b25f;} .hydra_wrap .sec14 p strong {color: #f7e9a4;} .hydra_wrap .sec14 .sec14_main {text-align: center; margin: 50px 0;} .hydra_wrap .sec14 .sec14_main img {width: 100%; max-width: 780px;} .hydra_wrap .sec14 .sec14_dc {max-width: 1200px; margin: 0 auto 200px;} @media(max-width:1024px) { .hydra_wrap .sec14 {padding: 150px 0; margin: 150px 0;}.hydra_wrap .sec14 .sec_tit h3, .hydra_wrap .sec14 .sec_tit h1 {font-size: 22px; line-height: 1.3; margin: 20px 0 10px;} .hydra_wrap .sec14 .sec_tit span {font-size: 26px;} .hydra_wrap .sec14 p {font-size: 16px;} .hydra_wrap .sec14 p b {position: relative;} .hydra_wrap .sec14 p b::after {content: ""; position: absolute; bottom: -1px; left: 0; width: 100%; height: 1px; background-color: #d7b25f;} .hydra_wrap .sec14 .sec14_dc img {width: 100%;} .hydra_wrap .sec14 .sec14_dc {margin: 0 auto 150px;} } .hydra_wrap .sec15 {padding: 200px 0;} .hydra_wrap .sec15 .sec_tit {margin-bottom: 50px;} .hydra_wrap .sec15 .box {display: flex; max-width: 1720px; margin: 0 auto; gap: 30px;} .hydra_wrap .sec15 .box .txt {display: flex; justify-content: space-between; margin: 10px 0 0;} .hydra_wrap .sec15 .box .txt span:first-child {font-size: 24px; font-weight: 600;} .hydra_wrap .sec15 .box .txt span:last-child {color: #666; font-size: 18px;} .hydra_wrap .sec15 .box .thumbnail a {width: 100%;} @media(max-width:1024px) { .hydra_wrap .sec15 {padding: 150px 0;}.hydra_wrap .sec15 .sec_tit h3, .hydra_wrap .sec15 .sec_tit h1 {font-size: 28px;} .hydra_wrap .sec15 .sec_tit h3 b {position: relative; font-family: 'SangBlueOGSerifBold';} .hydra_wrap .sec15 .sec_tit h3 b::after {content: ""; position: absolute; bottom: -1px; left: 0; width: 100%; height: 1px; background-color: #000;} .hydra_wrap .sec15 .box {flex-direction: column; padding: 20px; max-width: 90%; width: 100%;} .hydra_wrap .sec15 .box .thumbnail {width: 100%} .hydra_wrap .sec15 .box .thumbnail img {width: 100%; box-shadow: 2px 2px 5px rgba(0, 0, 0, .3);} .hydra_wrap .sec15 .box .txt {flex-direction: column; gap: 5px; margin-top: 10px;} .hydra_wrap .sec15 .box .txt span:first-child {font-size: 15px;} .hydra_wrap .sec15 .box .txt span:last-child {font-size: 13px} } .hydra_wrap .sec16 {padding: 200px 0 250px;} .hydra_wrap .sec16 .sec_tit {max-width: 1240px; margin: 0 auto;}.hydra_wrap .sec16 .sec_tit h3, .hydra_wrap .sec16 .sec_tit h1 {font-size: 44px; margin: 0; font-weight: 600; font-family: "Noto Serif KR", serif !important; margin-bottom: 20px;} .hydra_wrap .sec16 .sec_tit span {font-size: 24px; font-family: 'SangBleuOGSerif-Regular'; margin-bottom: 40px;} .hydra_wrap .sec16 .sec16_tab {text-align: center;} .hydra_wrap .sec16 .sec16_tab .tab_img {width: 100%; max-height: 520px; margin: 0 auto; overflow: hidden; position: relative;} .hydra_wrap .sec16 .sec16_tab .tab_img::after {content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 80%; background-color: #F3F3F3; z-index: -1; opacity: 1;} .hydra_wrap .sec16 .sec16_tab .tab_img img {max-width: 1000px;} .hydra_wrap .sec16 .sec16_tab .tab_btn {display: flex; justify-content: center; gap: 15px; margin-top: 20px;} .hydra_wrap .sec16 .sec16_tab .tab_btn a {max-width: 80px;} .hydra_wrap .sec16 .sec16_tab .tab_btn a img {width: 100%;} @media(max-width:1024px) { .hydra_wrap .sec16 {padding: 150px 0;}.hydra_wrap .sec16 .sec_tit h3, .hydra_wrap .sec16 .sec_tit h1 {font-size: 20px; margin-bottom: 10px;} .hydra_wrap .sec16 .sec_tit span {font-size: 20px; margin: 0 0 30px;} .hydra_wrap .sec16 .sec16_tab .tab_btn {padding: 0 20px; margin-top: 10px; gap: 5px;} .hydra_wrap .sec16 .sec16_tab .tab_btn a {max-width: 60px;} .hydra_wrap .sec16 .sec16_tab .tab_img::after {opacity: 0;} .hydra_wrap .sec16 .sec16_tab .tab_img {width: 100%;} .hydra_wrap .sec16 .tab_btn img, .hydra_wrap .sec16 .tab_img img {width: 100%;} } /* ===== /assets/inc/style5.css ===== */ h3 {color: #222;} .lefting_wrap .lefting_title {padding: 100px 100px 0;} .lefting_wrap .sec01 {padding-bottom: 200px;} .lefting_wrap .sec01 h5 {color: #7f5f3b; font-family: "Noto Serif KR", serif; font-size: 30px; font-weight: 600;} .lefting_wrap .sec01 p {color: #7f5f3b; font-family: "Noto Serif KR", serif; font-size: 24px; line-height: 1.5; font-weight: 600;} .lefting_wrap .sec01 p+div {margin: 50px 0;} .lefting_wrap .sec01 p+div img {width: 100%; max-width: 800px;} .lefting_wrap .txt_line {margin-bottom: 100px;} .lefting_wrap .lefting_youtube+div {background-image: url('/assets/img/youlbit/images/lifting_sec01_bg.webp'); background-repeat: no-repeat; background-position: center; background-size: cover; padding: 50px 0; box-sizing: border-box; margin: 100px 0 0;} .lefting_youtube video {width: 100%;} .lefting_youtube img {width: 100%;} @media(max-width:768px) { .lefting_wrap .sec01 {padding-bottom: 100px;} .lefting_wrap .sec01 h5 {font-size: 16px;} .lefting_wrap .sec01 p {font-size: 14px;} .lefting_wrap .lefting_youtube+div {padding: 60px 20px; margin: 0;} .lefting_wrap .lefting_title {padding: 60px 0 20px 20px} .lefting_wrap .visual_title h5 {font-size: 16px;} .lefting_title img {width: 100%;} } .lefting_wrap .sec02 {} .lefting_wrap .sec02 .lifting_sec02_top {position: relative; margin-bottom: -100px;} .lefting_wrap .sec02 .lifting_sec02_top .txt {position: absolute; top: 45%; left: 50%; transform: translate(-50%, -50%); color: #fff;} .lefting_wrap .sec02 .lifting_sec02_top .txt h4 {font-family: "Noto Serif KR", serif; font-size: 44px; white-space: nowrap; font-weight: 700;} .lefting_wrap .sec02 .lifting_sec02_top .txt p {font-size: 24px; font-weight: 200; margin-top: 24px;} .lefting_wrap .sec02 .lifting_sec_slide_box {background-color: #f4f0e8; padding: 300px 0;} .lefting_wrap .sec02 .lifting_sec_slide_box .title h3 {color: #222; font-size: 54px; font-family: 'SangBlueOgSerifRelgular';} .lefting_wrap .sec02 .lifting_sec_slide_box .title p {font-family: "Noto Serif KR", serif; font-size: 24px; margin: 20px 0; font-weight: 600;} .lefting_wrap .sec02 .lifting_sec_slide {padding-left: 300px; position: relative;} .lefting_wrap .sec02 .lifting_sec_slide .circle_text {position: absolute; bottom: 0; left: 0;} .lifting_sec02_bg img {width: 100%;} @media(max-width:768px) { .lefting_wrap .sec02 .lifting_sec02_top .txt h4 {font-size: 18px;} .lefting_wrap .sec02 .lifting_sec02_top .txt p {font-size: 14px; line-height: 1.3;} .lefting_wrap .sec02 .lifting_sec_slide .circle_text img {display: none;} .lefting_wrap .sec02 .lifting_sec_slide {padding-left: 0px;} .lifting_sec_slide .swiper-slide img {width: 100%;} .lefting_wrap .sec02 .lifting_sec_slide_box {padding-top: 0; padding: 150px 20px;} .lefting_wrap .sec02 .lifting_sec_slide_box .title h3 {font-size: 32px; text-align: left;} .lefting_wrap .sec02 .lifting_sec_slide_box .title p {text-align: left; font-size: 16px; line-height: 1.3;} .lefting_wrap .sec02 .img_sec {padding: 200px 0;} } .lefting_wrap .sec03 {padding: 200px 0;} .lefting_wrap .sec03 .sec_tit {max-width: 1240px; margin: 0 auto; text-align: center; position: relative;}.lefting_wrap .sec03 .sec_tit h3, .lefting_wrap .sec03 .sec_tit h1 {font-size: 54px; font-family: 'Marcellus'; margin-bottom: 10px;} .lefting_wrap .sec03 .sec_tit span {font-size: 24px; margin: 20px 0 50px; font-weight: 600; color: #aa8863;} .lefting_wrap .sec03 ul {} .lefting_wrap .sec03 ul li {display: flex; margin: 0 0 40px;} .lefting_wrap .sec03 ul li:nth-child(2) {flex-direction: row-reverse; text-align: right;} .lefting_wrap .sec03 ul li:nth-child(odd) .txt {text-align: left;} .lefting_wrap .sec03 ul li .txt_box {width: 50%; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; padding: 0 40px; box-sizing: border-box;} .lefting_wrap .sec03 ul li .txt_box>div {width: 100%;} .lefting_wrap .sec03 ul li .txt_box>div img {width: 100%;} .lefting_wrap .sec03 ul li .txt {padding: 40px; box-sizing: border-box; margin-top: 60px} .lefting_wrap .sec03 ul li .txt h5 {font-size: 34px; font-weight: 600;} .lefting_wrap .sec03 ul li .txt p {font-size: 18px; line-height: 1.5; margin: 30px 0 0;} .lefting_wrap .sec03 ul li .txt a {background-color: #dcccb2; color: #fff; padding: 10px 25px; border-radius: 8px; width: 100px; text-align: center; margin-top: 30px;} .lefting_wrap .sec03 ul li .thumbnail {width: 50%;} .lefting_wrap .sec03 ul li .thumbnail img {width: 100%; vertical-align: bottom;} @media(max-width:768px) { .lefting_wrap .sec03 {padding: 100px 0;}.lefting_wrap .sec03 .sec_tit h3, .lefting_wrap .sec03 .sec_tit h1 {font-size: 42px;} .lefting_wrap .sec03 .sec_tit span {font-size: 15px; margin: 10px 0 30px;} .lefting_wrap .sec03 ul li:nth-child(2), .lefting_wrap .sec03 ul li {flex-direction: column;} .lefting_wrap .sec03 ul li .txt_box {width: 100%; padding: 30px 20px;} .lefting_wrap .sec03 ul li .txt_box>div, .lefting_wrap .sec03 ul li:nth-child(odd) .txt {text-align: center;} .lefting_wrap .sec03 ul li .txt_box>div img {display: none;} .lefting_wrap .sec03 ul li .txt {padding: 0; margin-top: 0;} .lefting_wrap .sec03 ul li .txt p {font-size: 14px; margin: 15px 0 -10px;} .lefting_wrap .sec03 ul li .txt h5 {font-size: 26px;} .lefting_wrap .sec03 ul li .thumbnail {width: 100%; padding: 0 40px; box-sizing: border-box;} } .lefting_wrap .sec04 {padding: 200px 0;} .lefting_wrap .sec04 .drug_box {margin-top: 100px;} .lefting_wrap .sec04 .sec_tit {max-width: 1240px; margin: 0 auto; text-align: center; position: relative;}.lefting_wrap .sec04 .sec_tit h3, .lefting_wrap .sec04 .sec_tit h1 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; margin-bottom: 10px;} .lefting_wrap .sec04 .sec_tit span {font-size: 24px; margin: 10px 0 50px; font-weight: 600; color: #aa8863;} .lefting_wrap .sec04.swiper-wrapper {display: flex; align-items: center;} .lefting_wrap .sec04 .laser_swiper {padding: 70px 0;} @media(max-width:768px) { .lefting_wrap .sec04 {padding: 150px 0;}.lefting_wrap .sec04 .sec_tit h3, .lefting_wrap .sec04 .sec_tit h1 {font-size: 42px;} .lefting_wrap .sec04 .sec_tit span {font-size: 15px; margin: 10px 0;} } .silhouette_soft .sec11 .disc .lefting_wrap .sec05 {padding: 200px 0; text-align: center; position: relative; font-family: 'Pretendard'; overflow: hidden;} .lefting_wrap .sec05 .txt {max-width: 1240px; margin: 0 auto;} .lefting_wrap .sec05 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; color: #222;} .lefting_wrap .sec05 .txt span {font-size: 24px; margin: 20px 0 50px; font-weight: 600; font-family: "Noto Serif KR", serif;} .lefting_wrap .sec05 .lifting_program_nav {display: flex; gap: 20px; justify-content: center; margin-bottom: 30px;} .lefting_wrap .sec05 .lifting_program_nav li {flex: 1; max-width: 190px;} .lefting_wrap .sec05 .lifting_program_nav li a {font-size: 20px; padding: 10px 0; color: #222; border: 1px solid #DCCCB2; border-radius: 30px; width: 100%; box-sizing: border-box;} .lefting_wrap .sec05 .lifting_program_nav li a.active {background-color: #DCCCB2; color: #fff; font-weight: 600;} .lefting_wrap .sec05 .box {display: flex; margin-top: 50px;} .lefting_wrap .sec05 .box > .thumbnail_box {width:32%;} .lefting_wrap .sec05 .box > .face_nav{width:68%;} .lefting_wrap .sec05 .box img {width: 100%; vertical-align: bottom; max-width: 600px;} .lefting_wrap .sec05 .box>ul {display: grid; border-left: 1px solid #D2D2D2;} .lefting_wrap .sec05 .box>ul li {border-bottom: 1px solid #D2D2D2; border-left: 1px solid #D2D2D2; cursor: pointer; display: flex; text-align: left; padding: 30px 50px; align-items: center; transition: 0.3s; line-height: 1.5; background-color: #fff;} .lefting_wrap .sec05 .box>ul li:first-child {border-top: 1px solid #D2D2D2;} .lefting_wrap .sec05 .box>ul li:hover {background-color: #f9f9f9;} .lefting_wrap .sec05 .box>ul li span {padding: 10px; margin-right: 30px; font-size: 18px; font-weight: 500;} .lefting_wrap .sec05 .box>ul li p {font-size: 18px;} .lefting_wrap .sec05 .box>ul li h5 {font-size: 20px; font-weight: 600; color: #aa8863; margin-top: 10px;} .lefting_wrap .sec05 .rotate_txt {position: absolute; top: 20%; right: -20%; z-index: -1; animation: lefting_rotate_txt 120s linear alternate forwards infinite;} .img_sec {padding: 200px 0;} .img_sec img {width: 100%; margin: 0 auto;} @-webkit-keyframes lefting_rotate_txt { 0% {transform: rotate(0);} 100% {transform: rotate(-365deg);} } @media(max-width:768px) { .lefting_wrap .sec05 .box > .thumbnail_box {width:100%;} .lefting_wrap .sec05 .box > .face_nav{width:100%;} .img_sec {padding: 150px 0;} .lefting_wrap .sec05 .txt h3 {font-size: 42px;} .lefting_wrap .sec05 .txt span {font-size: 15px;} .lefting_wrap .sec05 .box {flex-direction: column;} .lefting_wrap .sec05 .box>ul li {padding: 20px;} .lefting_wrap .sec05 .box>ul li p {font-size: 14px;} .lefting_wrap .sec05 .box>ul li h5 {font-size: 18px;} .lefting_wrap .sec05 .lifting_program_nav {gap: 5px;} .lefting_wrap .sec05 .lifting_program_nav li a {font-size: 13px;} .lefting_wrap .sec05 .rotate_txt {display: none;} } .lefting_wrap .sec06 {padding: 200px 0; margin: 200px 0; text-align: center; background-color: #F4F0E8;} .lefting_wrap .sec06 .thumbnail img {width: 100%; max-width: 1200px;} .lefting_wrap .sec06 .bodyfit_review {margin-left: -250px;} .lefting_wrap .sec06 .bodyfit_review .swiper-slide img {width: 100%;} .lefting_wrap .sec06 .bodyfit_review .swiper-pagination {display: none;} .lefting_wrap .sec06 h3 {font-size: 22px; font-weight: 500; line-height: 1.7; margin-top: 50px; color: #222;} .lefting_wrap .sec06 .disc {margin: 150px 0 50px;} .lefting_wrap .sec06 .disc p {font-weight: 300; font-size: 16px; letter-spacing: 8px; color: #61462F;} .lefting_wrap .sec06 .disc h4 {font-size: 36px; font-family: "Noto Serif KR", serif; margin-top: 30px; color: #61462F;} .lefting_wrap .sec06 .inuq {margin: 30px 0;} .lefting_wrap .sec06 .inuq a {padding: 10px 30px; color: #fff; font-size: 22px; background-color: #B28965; border-radius: 30px; font-weight: 600;} @media(max-width:768px) { .lefting_wrap .sec06 {padding: 150px 0} .lefting_wrap .sec06 .bodyfit_review {margin-left: 0;} .sec06 .real-review-box .swiper-slide {min-height: 282px;} .sec06 .real-review-box .swiper-slide .txt_box {font-size: 12px; padding: 15px;} } .lefting_wrap .sec07 {padding: 200px 0;} .lefting_wrap .sec07 .sec_tit {max-width: 1240px; margin: 0 auto;}.lefting_wrap .sec07 .sec_tit h3, .lefting_wrap .sec07 .sec_tit h1 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; margin-bottom: 10px;} .lefting_wrap .sec07 .sec_tit span {font-size: 24px; margin: 10px 0 50px; font-weight: 600; font-family: "Noto Serif KR", serif;} .lefting_wrap .sec07 .effect_list ul {display: flex; justify-content: center; gap: 20px; margin: 30px 0;} .lefting_wrap .sec07 .hydra_before {margin: 50px 0;} .lefting_wrap .sec07 .box {display: flex; gap: 20px; width: 100%; max-width: 1200px; margin: 0 auto;} .lefting_wrap .sec07 .box .thumbnail img {width: 100%;} .lefting_wrap .sec07 .sec07_disc {text-align: center; margin-top: 60px;} .lefting_wrap .sec07 .sec07_disc span {padding: 10px 30px; border: 1px solid #f4f4f4; color: #cdcdcd; display: inline-flex; align-items: center; line-height: 1.5;} .lefting_wrap .sec07 .sec07_disc span img {margin-right: 10px;} @media(max-width:768px) { .lefting_wrap .sec07 {padding: 150px 20px;}.lefting_wrap .sec07 .sec_tit h3, .lefting_wrap .sec07 .sec_tit h1 {font-size: 42px;} .lefting_wrap .sec07 .sec_tit span {font-size: 16px;} .lefting_wrap .sec07 .sec07_disc span {font-size: 12px; padding: 10px 20px; flex-direction: column; gap: 5px; line-height: 1.3;} .lefting_wrap .sec08 {padding: 150px 0;} } .lefting_wrap .sec08 {padding: 200px 0;} .lefting_wrap .sec09 {padding: 100px 0;} .silhouette_soft .visual {margin-bottom: 200px; position: relative;} .silhouette_soft .sec01 {padding: 200px 0;} .silhouette_soft .sec01 .box {display: flex; justify-content: center; position: relative;} .silhouette_soft .sec01 .box>div {width: 50%;} .silhouette_soft .sec01 .box .thumbnail img {width: 100%;} .silhouette_soft .sec01 .box .content_box {padding: 30px 60px 60px 100px; position: relative; color: #222; text-align: left; box-sizing: border-box;} .silhouette_soft .sec01 .box .content_box .silhouette_soft_award {position: absolute; bottom: 20px; right: 0;} .silhouette_soft .sec01 .box .content_box h2 {font-size: 44px; line-height: 1.3; font-family: "SangBlueOgSerifRelgular";} .silhouette_soft .sec01 .box .content_box h4 {font-size: 24px; color: #59BAC4; font-family: "Noto Serif KR", serif; font-weight: 600; margin: 20px 0;} .silhouette_soft .sec01 .box .content_box h5 {font-size: 24px; font-family: "Noto Serif KR", serif; font-weight: 700; margin-bottom: 15px;} .silhouette_soft .sec01 .box .content_box p {font-size: 20px; line-height: 1.5; z-index: 1; position: relative;} .silhouette_soft .sec01 .box .content_box p strong {font-weight: 700;} .silhouette_soft .sec01 .box .content_box .short_line {margin: 40px 0;} .silhouette_soft .sec01 .silhouette_soft_award img {width: 100%;} .silhouette_soft .sec01 .box .training_symbol {position: absolute; top: 0; left: 50%; transform: translateX(-50%); top: -100px;} .silhouette_soft .sec01 .box .training_symbol1 {top: -50px;} .silhouette_soft .sec01 .box .m_training_symbol {position: relative;} .silhouette_soft .sec01 .box .m_training_symbol .training_symbol1 {position: unset; transform: translateX(0);} .silhouette_soft .sec01 .box .m_training_symbol .training_symbol2 {transform: translateX(0); top: -50px; left: 23% !important;} .silhouette_soft .sec01 .training_symbol2 {animation: rotateOne 40s forwards infinite; left: 25% !important;} @keyframes rotateOne { 0% {transform: rotate(0deg);} 100% {transform: rotate(-360deg);} } @media(max-width:768px) { .silhouette_soft .visual {margin-bottom: 0;} .silhouette_soft .sec01 {padding: 100px 0 150px;} .silhouette_soft .sec01 .box {flex-direction: column;} .silhouette_soft .sec01 .box>div {width: 100%;} .silhouette_soft .sec01 .box .content_box {padding: 0 20px 20px;} .silhouette_soft .sec01 .box .content_box .tit_logo img {max-width: 300px; width: 100%;} .silhouette_soft .sec01 .box .content_box h2 {font-size: 24px} .silhouette_soft .sec01 .box .content_box h4 {font-size: 18px} .silhouette_soft .sec01 .box .content_box h5 {font-size: 18px} .silhouette_soft .sec01 .box .content_box p {font-size: 14px;} .silhouette_soft .sec01 .box .content_box .short_line {margin: 20px 0;} .silhouette_soft .sec01 .box .content_box .silhouette_soft_award {position: unset; text-align: right;} .silhouette_soft .sec01 .box .content_box .silhouette_soft_award img {width: 80%; margin-left: auto;} .silhouette_soft .sec01 .box .training_symbol {display: none;} .silhouette_soft .sec01 .box .m_training_symbol .training_symbol2 img {max-width: 220px;} .silhouette_soft .sec01 .m_training_symbol img {max-width: 130px;} .silhouette_soft .sec01 .m_training_symbol {margin: 100px 0} } .silhouette_soft .sec02 {padding: 200px 0;} .silhouette_soft .sec02 .collagen_top {margin-bottom: -500px;} .silhouette_soft .sec02 .collagen_top img {width: 100%;} .silhouette_soft .sec02 .box {padding: 600px 0 200px; background-image: url('/assets/img/youlbit/images/silhouette_sec02_bg.webp')} .silhouette_soft .sec02 .txt_box {color: #222; padding: 80px 0; background-color: rgba(255, 255, 255, 0.7)} .silhouette_soft .sec02 .txt_box h3 {margin: 40px 0 20px; font-size: 40px; font-family: "Noto Serif KR", serif; color: #222; font-weight: 700;} .silhouette_soft .sec02 .txt_box h5 {font-size: 24px; color: #7c6a54; font-weight: 600;} .silhouette_soft .sec02 .txt_box p {font-size: 18px; line-height: 1.5;} .silhouette_soft .sec02 .txt_box p strong {font-size: 24px; font-weight: 600;} .silhouette_soft .sec02 .txt_box .vertical_short_line {width: 2px; margin: 60px auto; height: 50px; overflow: hidden;} .silhouette_soft .sec02 .txt_box .serif {font-size: 30px; font-family: "Noto Serif KR", serif; color: #7c6a54; font-weight: 700; margin-top: 10px;} @media(max-width:768px) { .silhouette_soft .sec02 {padding: 100px 0;} .silhouette_soft .sec02 .collagen_top {margin-bottom: -110px;} .silhouette_soft .sec02 .box {padding: 200px 0; background-image: url('/assets/img/youlbit/images/m_silhouette_sec02_bg.webp'); background-size: cover; background-repeat: no-repeat;} .silhouette_soft .sec02 .txt_box p {font-size: 15px;} .silhouette_soft .sec02 .txt_box p strong {font-size: 18px;} .silhouette_soft .sec02 .txt_box h3 {font-size: 28px; line-height: 1.3;} .silhouette_soft .sec02 .txt_box h5 {font-size: 16px; line-height: 1.3;} .silhouette_soft .sec02 .txt_box .serif {font-size: 20px;} .silhouette_soft .sec02 .txt_box .tit_logo img {max-width: 70%;} .silhouette_soft .sec02 .txt_box .vertical_short_line {margin: 30px auto;} .silhouette_soft .sec02 .txt_box .vertical_short_line img {width: 2px;} } .silhouette_soft .sec03 {padding: 200px 0;} .silhouette_soft .sec03 .box {display: flex;} .silhouette_soft .sec03 .box>div {width: 55%;} .silhouette_soft .sec03 .box>div.studies_slide {width: 45%;} .silhouette_soft .sec03 .swiper-slide {max-width: 500px;} .silhouette_soft .sec03 .swiper-slide img {width: 100%; object-fit: cover;} .silhouette_soft .sec03 .txt_img {width: 57%;} .silhouette_soft .sec03 .txt_img img {width: 100%;} .silhouette_soft .sec03 .txt {text-align: right; padding-right: 360px;} .silhouette_soft .sec03 .txt h2 {font-size: 44px; margin: 20px 0 40px; font-family: "Noto Serif KR", serif; font-weight: 700;} .silhouette_soft .sec03 .txt h4 {font-size: 34px; font-family: "Noto Serif KR", serif; margin-top: 15px;} .silhouette_soft .sec03 .txt p {font-size: 20px; line-height: 1.5; position: relative; padding-right: 40px;} .silhouette_soft .sec03 .txt p::after {content: ""; position: absolute; top: 0; right: 0; width: 4px; height: 100%; background-color: #BFDCDF;} .silhouette_soft .sec03 .txt p strong {font-weight: 600;} .silhouette_soft .swiper-button-next:after, .silhouette_soft .swiper-rtl .swiper-button-prev:after, .silhouette_soft .sec03 .swiper-button-prev:after, .silhouette_soft .sec03 .swiper-rtl .swiper-button-next:after {content: '';} .silhouette_soft .sec03 .swiper-button-prev, .silhouette_soft .sec03 .swiper-button-next {width: 68px;} .silhouette_soft .sec03 .swiper-button-prev img, .silhouette_soft .sec03 .swiper-button-next img {width: 100%;} .silhouette_soft .sec03 .vertical_text {position: absolute; top: 0; left: 6px; writing-mode: vertical-rl; transform: rotate(180deg);} .silhouette_soft .sec03 .vertical_text span {position: relative; color: #4E4E4E; font-family: 'SangBlueOgSerifRelgular'; font-size: 20px; line-height: 1.5;} .silhouette_soft .sec03 .vertical_text span::after {content: ""; position: absolute; top: 0; left: -6px; width: 1px; height: 100%; background-color: #BCBCBC;} .silhouette_soft .sec03 .content_txt {position: relative;} .silhouette_soft .sec03 .studies_slide {position: relative;} .silhouette_soft .sec03 .m-txture {writing-mode: vertical-lr; position: absolute; top: -1px; right: 0; z-index: 1; background: #fff; padding: 9px; transform: rotate(180deg); font-family: 'SangBleuOGSansLtalic'; text-align: right; height: 100%; box-sizing: border-box;} .silhouette_soft .sec03 .m-txture span {position: relative;} .silhouette_soft .sec03 .m-txture span::after {position: absolute; left: -3px; bottom: 0; content: ""; background-color: #000; width: 1px; height: 100%; background-color: #bcbcbc;} @media(max-width:768px) { .silhouette_soft .sec03 .box>div.studies_slide {width: 100%;} .silhouette_soft .sec03 {padding: 150px 0;} .silhouette_soft .sec03 .box {flex-direction: column;} .silhouette_soft .sec03 .box>div {width: 100%;} .silhouette_soft .sec03 .txt_img img {display: none;} .silhouette_soft .sec03 .txt {padding-right: 20px;} .silhouette_soft .sec03 .txt h2 {font-size: 30px; margin: 5px 0 40px;} .silhouette_soft .sec03 .txt h4 {font-size: 26px; margin-top: 30px;} .silhouette_soft .sec03 .txt p {font-size: 14px; padding-right: 20px;} .silhouette_soft .sec03 .txt p::after {width: 2px; right: 0px;} .silhouette_soft .sec03 .swiper-button-prev, .silhouette_soft .sec03 .swiper-button-next {width: 42px;} .silhouette_soft .studies_slide .swiper-button-next {right: 5%;} .swiper-button-prev, .swiper-rtl .swiper-button-next {left: 32px;} .silhouette_soft .sec03 .swiper-button-next {right: 9% !important;} .silhouette_soft .sec03 .swiper-button-prev {left: 10%;} .silhouette_soft .sec03 .vertical_text {display: none;} } .silhouette_soft .sec04 {padding: 200px 0;} .silhouette_soft .sec04 .silhouette_sec04_tit {font-family: 'SangBleuOGSerif-Regular'; padding: 0 300px; text-align: left; margin-bottom: 30px;} .silhouette_soft .sec04 .silhouette_sec04_tit h3 {font-size: 54px; text-align: left; margin-bottom: 15px; color: #000; font-family: 'SangBleuOGSerif-Regular';} .silhouette_soft .sec04 .silhouette_sec04_tit h4 {font-size: 44px; margin-left: 50px;} .silhouette_soft .sec04 .video_box {margin-bottom: 100px;} .silhouette_soft .sec04 .video_box+h3 {font-size: 44px; text-align: left; font-family: "Noto Serif KR", serif; padding-left: 360px; font-weight: 700; margin-bottom: 60px; color: #000;} .silhouette_soft .sec04 .video_box video {width: 100%;} .silhouette_soft .sec04 .video_box img {width: 100%;} .silhouette_soft .sec04 .txt {text-align: left; padding-left: 40px; margin-left: 360px; position: relative;} .silhouette_soft .sec04 .txt::after {content: ""; position: absolute; top: 0; left: 0; background-color: #BFDCDF; width: 4px; height: 100%;} .silhouette_soft .sec04 .txt p {font-size: 20px; margin: 20px 0; line-height: 1.5;} .silhouette_soft .sec04 .txt p:last-child strong {font-family: "Noto Serif KR", serif; color: #222; font-weight: 600; font-size: 22px;} .silhouette_soft .sec04 .txt b {font-weight: 600;} .silhouette_soft .sec04 .txt .first-txt {color: #7c6a54;} .silhouette_soft .sec04 .txt .first-txt strong {color: #594d3c; font-weight: 600; text-decoration: underline; text-decoration-thickness: 2px; text-underline-position: under;} @media(max-width:768px) { .silhouette_soft .sec04 {padding: 150px 0;} .silhouette_soft .sec04 .silhouette_sec04_tit {padding: 0 20px;} .silhouette_soft .sec04 .silhouette_sec04_tit h3 {font-size: 32px; margin-bottom: 10px;} .silhouette_soft .sec04 .silhouette_sec04_tit h4 {font-size: 16px; font-weight: 500; margin-left: 0;} .silhouette_soft .sec04 .video_box {margin-bottom: 40px;} .silhouette_soft .sec04 .video_box+h3 {padding-left: 20px; font-size: 28px; margin-bottom: 30px;} .silhouette_soft .sec04 .video_box video {width: 100%;} .silhouette_soft .sec04 .video_box img {width: 100%;} .silhouette_soft .sec04 .txt {margin-left: 0; padding-left: 30px; padding-right: 20px;} .silhouette_soft .sec04 .txt::after {width: 2px; left: 15px;} .silhouette_soft .sec04 .txt p {font-size: 16px;} .silhouette_soft .sec04 .txt p:last-child strong {font-size: 16px;} } .silhouette_soft .sec05 {padding: 200px 0 0;} .silhouette_soft .sec05 .silhouette_sec05_tit {text-align: left; margin-left: 240px;} .silhouette_soft .sec05 .silhouette_sec05_tit h2 {margin-left: 100px; font-size: 44px; font-family: "Noto Serif KR", serif; margin-top: 20px; font-weight: 300;} .silhouette_soft .sec05 .silhouette_sec05_tit h3 {color: #222; text-align: left; font-size: 44px; font-family: "Noto Serif KR", serif;} .silhouette_soft .sec05 .silhouette_sec05_tit p {letter-spacing: 9px; font-size: 12px;} .silhouette_soft .sec05 .silhouette_sec05_tit p:last-child {text-align: right; margin-right: 360px;} .silhouette_soft .sec05 .silhouette_sec05_tit>div {margin: 20px 0 40px 350px; display: flex; justify-content: space-between; align-items: flex-end; font-weight: 600;} .silhouette_soft .sec05 .content_txt {padding-bottom: 300px; position: relative; text-align-last: right; margin-right: 310px;} .silhouette_soft .sec05 .content_txt h3 {text-align: right; color: #C2C2C2; font-family: 'Marcellus'; font-size: 54px; margin: 50px 0 30px;} .silhouette_soft .sec05 .content_txt h5 {color: #7f6f55; font-family: "Noto Serif KR", serif; font-size: 34px; font-weight: 700; line-height: 1.5; margin-right: 50px;} .silhouette_soft .sec05 .content_txt p {padding-right: 30px; position: relative; line-height: 1.5; font-size: 20px; margin: 30px 50px 30px 0; color: #606060; font-weight: 300;} .silhouette_soft .sec05 .content_txt p strong {font-weight: 600;} .silhouette_soft .sec05 .content_txt p::after {content: ""; position: absolute; top: 0; right: 0; background-color: #BFDCDF; width: 4px; height: 100%;} .silhouette_soft .sec05 .content_txt .rollring_attr {position: absolute; animation: rollring_att 20s infinite;} .silhouette_soft .sec05 .content_txt .rollring_attr1 {top: 19%; left: 8%;} .silhouette_soft .sec05 .content_txt .rollring_attr2 {top: 42%; left: 30%;} .silhouette_soft .sec05 .content_txt .rollring_attr3 {top: 78%; left: 15%;} .silhouette_soft .sec05 .thumbnail img {width: 100%; max-width: 1200px; margin: 0 auto;} @media(max-width:768px) { .silhouette_soft .sec05 {padding: 100px 0;} .silhouette_soft .sec05 .silhouette_sec05_tit {margin: 0;} .silhouette_soft .sec05 .silhouette_sec05_tit h2 {font-size: 28px; margin-left: 20px; margin-bottom: 8px;} .silhouette_soft .sec05 .silhouette_sec05_tit h3 {font-size: 24px; margin-left: 40px;} .silhouette_soft .sec05 .silhouette_sec05_tit p {font-size: 9px; letter-spacing: 4px;} .silhouette_soft .sec05 .silhouette_sec05_tit p:last-child {margin-right: 0;} .silhouette_soft .sec05 .silhouette_sec05_tit>div {margin: 0;} .silhouette_soft .sec05 .content_txt {margin-right: 0; padding: 20px;} .silhouette_soft .sec05 .content_txt h3 {font-size: 20px; margin: 30px 0;} .silhouette_soft .sec05 .content_txt h5 {font-size: 20px; margin-right: 0;} .silhouette_soft .sec05 .content_txt p {margin: 30px 0 15px; font-size: 14px; padding-right: 15px;} .silhouette_soft .sec05 .content_txt p::after {width: 2px;} .silhouette_soft .sec05 .content_txt .rollring_attr {display: none;} .silhouette_soft .sec05 .content_txt .rollring_attr1 {top: 35%; left: 8%;} .silhouette_soft .sec05 .content_txt .rollring_attr2 {top: 95%; left: 41%;} .silhouette_soft .sec05 .content_txt .rollring_attr3 {top: 112%; left: 5%;} .silhouette_soft .sec05 .content_txt .rollring_attr1 img {max-width: 80px;} .silhouette_soft .sec05 .content_txt .rollring_attr2 img {max-width: 70px;} .silhouette_soft .sec05 .content_txt .rollring_attr3 img {max-width: 50px} .silhouette_soft .sec05 .thumbnail {margin-top: 30px;} .silhouette_soft .sec05 .thumbnail img {width: 100%;} } @keyframes rollring_att { 0% {transform: rotate(0deg);} 100% {transform: rotate(360deg);} } .silhouette_soft .sec06 {margin: 200px 0; padding: 0 !important; background-image: url('/assets/img/youlbit/images/bg_img_under_video.webp'); background-size: cover; position: relative; height: 600px;} .silhouette_soft .sec06 .video {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 1200px; filter: drop-shadow (4px 10px rgba(0, 0, 0, .2));} .silhouette_soft .sec06 .video video {} @media(max-width:1240px) { .silhouette_soft .sec06 {height: 350px;} .silhouette_soft .sec06 .video video {width: 100%;} } @media(max-width:768px) { .silhouette_soft .sec06 {margin: 150px 0;background-image: url('/assets/img/youlbit/images/m-bg_img_under_video.webp')} .silhouette_soft .sec06 .video {width: 100%;} .silhouette_soft .sec06 .video img {width: 100%;} } .silhouette_soft .sec07 {padding: 200px 0;} .silhouette_soft .sec07 .sec_tit {max-width: 1240px; margin: 0 auto; text-align: center; position: relative;}.silhouette_soft .sec07 .sec_tit h3, .silhouette_soft .sec07 .sec_tit h1 {font-size: 44px; font-family: "Noto Serif KR", serif !important; margin-bottom: 20px; color: #7F6F55; font-weight: 700;} .silhouette_soft .sec07 .sec_tit span {font-size: 24px; margin: 0 0 10px; font-family: 'SangBlueOgSerifRelgular';} .silhouette_soft .sec07 .box {display: flex; max-width: 1100px; margin: 0 auto; justify-content: center; gap: 30px; align-items: center;} .silhouette_soft .sec07 .box img {max-height: 650px;} .silhouette_soft .sec07 .silhouette_point {margin-bottom: 30px;} .silhouette_soft .sec07 .silhouette_point img {max-width: 100%; max-height: 50px;} @media(max-width:768px) { .silhouette_soft .sec07 {padding: 100px 0;}.silhouette_soft .sec07 .sec_tit h3, .silhouette_soft .sec07 .sec_tit h1 {font-size: 28px; line-height: 1.3; margin-bottom: 0;} .silhouette_soft .sec07 .sec_tit span {font-size: 21px;} .silhouette_soft .sec07 .silhouette_point img {max-width: 70%;} .m_silhouette_point img {width: 100%;} .swipe-row-txt {color: #9b9b9b; margin-top: 50px;} } .silhouette_soft .sec08 {padding: 200px 0;} .silhouette_soft .sec08 .box {display: flex; gap: 50px; max-width: 1240px; margin: 0 auto;} .silhouette_soft .sec08 .box .content {text-align: left; display: flex; flex-direction: column; justify-content: space-between; min-width: 756px; max-height: 700px;} .silhouette_soft .sec08 .box .content .content_txt h4 {font-size: 44px; color: #7F6F55; font-family: "Noto Serif KR", serif; font-weight: 700;} .silhouette_soft .sec08 .box .content .content_txt h5 {font-size: 34px; font-family: 'SangBlueOgSerifRelgular'; color: #DDDDDD; position: relative; margin: 20px 0 30px; padding-bottom: 30px;} .silhouette_soft .sec08 .box .content .content_txt h5::after {content: ""; position: absolute; bottom: 0; left: 0; width: 80%; background-color: #7F6F55; height: 2px;} .silhouette_soft .sec08 .box .content .content_txt p {font-size: 20px; line-height: 1.5;} .silhouette_soft .sec08 .box .content .content_txt .point_b {display: none;} .silhouette_soft .sec08 .box .content .content_txt .point_b.active {display: block;} .silhouette_soft .sec08 .box .content .point_list ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px;} .silhouette_soft .sec08 .box .content .point_list ul li {text-align: center; border: 1px solid #C5BAAD; font-size: 22px !important; line-height: 1.5; padding: 60px 30px; width: 100%; box-sizing: border-box; cursor: pointer;} .silhouette_soft .sec08 .box .content .point_list ul li.active {background-color: #ddd6cf; font-weight: 600;} .silhouette_soft .sec08 .silhouette_point {margin-bottom: 30px;} .silhouette_soft .sec08 .silhouette_point img {margin: 0 auto; max-height: 50px;} .silhouette_soft .sec08 .thumbnail {max-height: 700px; display: flex; border: 1px solid #ddd6cf; border-left: none; border-right: none;} .silhouette_soft .sec08 .thumbnail .pc_img {object-fit: cover;} .silhouette_soft .sec08 .mb_lay_txt {display: none;} @media(max-width:768px) { .silhouette_soft .sec08 {padding: 100px 0;} .silhouette_soft .sec08 .box {gap: 0; flex-direction: column; padding: 0 20px;} .silhouette_soft .sec08 .box .content {min-width: auto} .silhouette_soft .sec08 .box .content .content_txt {text-align: center;} .silhouette_soft .sec08 .box .content .content_txt h4 {font-size: 28px; color: #7F6F55; line-height: 1.3;} .silhouette_soft .sec08 .box .content .content_txt h5 {margin: 20px 0 30px; padding-bottom: 15px; font-size: 21px;} .silhouette_soft .sec08 .box .content .content_txt h5::after {height: 1px;} .silhouette_soft .sec08 .box .content .content_txt h5::after {width: 90%; left: 50%; transform: translateX(-50%);} .silhouette_soft .sec08 .box .content .content_txt p {display: none; margin-bottom: 40px;} .silhouette_soft .sec08 .box .content .content_txt .point_b.active {display: none;} .silhouette_soft .sec08 .box .content .point_list ul {gap: 10px;} .silhouette_soft .sec08 .box .content .point_list ul li {display: flex; align-items: center; height: 100%; font-size: 14px !important; justify-content: center; padding: 40px 20px;} .silhouette_soft .sec08 .box .content .point_list ul li h5 {font-size: 16px;} .silhouette_soft .sec08 .box .thumbnail img {width: 100%;} .silhouette_soft .sec08 .point_tabcontent .pc_img {max-height: 800px;} .silhouette_soft .sec08 .mb_lay_txt {display: block; margin-bottom: 30px; font-size: 14px; line-height: 1.5; text-align: center; margin-top: 30px;} .silhouette_point img {max-width: 70%;} } .silhouette_soft .sec09 {padding: 200px 0 0;} .silhouette_soft .sec09 .silhouette_point {margin-bottom: 30px;} .silhouette_soft .sec09 .silhouette_point img {max-height: 50px;} .silhouette_soft .sec09 h3 {font-size: 44px; font-family: "Noto Serif KR", serif; font-weight: 700; color: #7F6F55; margin-bottom: 100px;} .silhouette_soft .sec09 h3 .thumbnail img {width: 100%;} .silhouette_soft .sec08 .box .content .point_list ul li a {font-size: 14px;} .silhouette_soft .sec09 .box .silhouette_collagen {padding: 200px 0;} .silhouette_soft .sec09 .box .silhouette_collagen .thumbnail {padding: 0 20px;} .silhouette_soft .sec09 .box .collagen01 {background-color: #F9F9F9; padding: 150px 0;} .silhouette_soft .sec09 .box .collagen01-img img {max-width: 1200px; margin: 0 auto;} .silhouette_soft .sec09 .collagen02 img {width: 100%;} .silhouette_soft .sec09 .collagen02 h3 {margin-bottom: 50px;} .silhouette_soft .sec09 .collagen02 .thumbnail {max-height: 860px; display: flex; align-items: center; overflow-y: hidden;} .silhouette_soft .sec09 .silhouette_point, .silhouette_soft .sec08 .silhouette_point, .silhouette_soft .sec07 .silhouette_point {margin-bottom: 40px;} @media(max-width:768px) { .silhouette_soft .sec09 {padding: 100px 0 0;} .silhouette_soft .sec09 h3 {font-size: 28px; line-height: 1.3; margin-bottom: 50px;} .silhouette_soft .sec09 .box .collagen01-img img {width: 100%;} .silhouette_soft .sec09 .collagen02 h3 {margin-top: 0;} .silhouette_soft .sec09 .box .silhouette_collagen {padding: 150px 0;} } .silhouette_soft .sec10 {padding: 200px 40px; background-image: url('/assets/img/youlbit/images/silhouette_face_bg.webp');} .silhouette_soft .sec10 .sec10_tit h3 {color: #DDDDDD; font-size: 40px; font-family: 'SangBlueOgSerifRelgular'; margin-bottom: 20px;} .silhouette_soft .sec10 .sec10_tit h4 {font-family: "Noto Serif KR", serif; color: #7f6f55; font-size: 44px; font-weight: 700;} .silhouette_soft .sec10 .box ul {display: flex; justify-content: space-between; max-width: 1200px; margin: 50px auto 400px;} .silhouette_soft .sec10 .box ul li h5 {font-size: 20px; font-weight: 600; margin-top: 25px;} .silhouette_soft .sec10 .box ul li span {font-size: 16px; margin-top: 6px;} .silhouette_soft .sec10 .silhouette_face>p {font-weight: 500; font-family: 'Marcellus'; letter-spacing: 14px; position: relative; padding-bottom: 25px;} .silhouette_soft .sec10 .silhouette_face>p::after {content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 100%; height: 1px; background-color: #000; max-width: 1240px;} .silhouette_soft .sec10 .silhouette_face>.thumbnail {margin-top: 50px;} .silhouette_soft .sec10 .silhouette_face>.thumbnail img {max-height: 600px;} .silhouette_soft .sec10 .silhouette_face .face_txt {margin-top: 50px;} .silhouette_soft .sec10 .silhouette_face .face_txt>div {position: relative; margin-top: 50px;} .silhouette_soft .sec10 .silhouette_face .face_txt>div:nth-child(2) {margin-top: 30px;} .silhouette_soft .sec10 .silhouette_face .face_txt>div p {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 20px; line-height: 1.5;} .silhouette_soft .sec10 .silhouette_face .face_txt>div .thumbnail img {max-height: 120px;} @media(max-width:768px) { .silhouette_soft .sec10 {padding: 150px 20px;} .silhouette_soft .sec10 .sec10_tit h3 {font-size: 28px;} .silhouette_soft .sec10 .sec10_tit h4 {font-size: 23px; line-height: 1.3;} .silhouette_soft .sec10 .box ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px 40px; margin: 50px auto 150px} .silhouette_soft .sec10 .box ul li img {width: 100%;} .silhouette_soft .sec10 .box ul li h5 {font-size: 14px; margin-top: 15px;} .silhouette_soft .sec10 .silhouette_face>.thumbnail img {width: 100%;} .silhouette_soft .sec10 .silhouette_face>p {font-size: 14px; letter-spacing: 7px;} .silhouette_soft .sec10 .silhouette_face .face_txt {margin-top: 0;} .silhouette_soft .sec10 .silhouette_face .face_txt .thumbnail img {width: 100%;} .silhouette_soft .sec10 .silhouette_face .face_txt>div {margin: 20px 0;} .silhouette_soft .sec10 .silhouette_face .face_txt>div p {font-size: 14px; width: 100%;} .silhouette_soft .sec10 .silhouette_face .face_txt>div .thumbnail img {max-height: auto;} } .silhouette_soft .sec11 {padding: 200px 0; text-align: center; background-color: #F4F0E8;} .silhouette_soft .sec11 h3 {font-size: 22px; font-weight: 500; line-height: 1.7; margin-top: 50px; color: #222;} .silhouette_soft .sec11 .thumbnail img {width: 100%; max-width: 1200px;} .silhouette_soft .sec11 .bodyfit_review {margin-left: -250px;} .silhouette_soft .sec11 .bodyfit_review .swiper-slide img {width: 100%;} .silhouette_soft .sec11 .bodyfit_review .swiper-pagination {display: none;} .silhouette_soft .sec11 .disc {margin: 150px 0 50px;} .silhouette_soft .sec11 .disc h4 {font-size: 36px; font-family: "Noto Serif KR", serif; margin-top: 30px; color: #61462F;} .silhouette_soft .sec11 .disc p {font-weight: 300; font-size: 16px; letter-spacing: 8px; color: #61462F;} .silhouette_soft .sec11 .inuq {margin: 30px 0;} .silhouette_soft .sec11 .inuq a {padding: 12px 36px; color: #fff; font-size: 26px; background-color: #B28965; border-radius: 30px; font-weight: 600;} .silhouette_soft .sec11 .real-review-box .swiper-slide .txt_box p {line-height: 1.5; text-align: left; font-weight: 500;} @media(max-width:768px) { .silhouette_soft .sec11 {margin: 0; padding: 150px 0;} .silhouette_soft .sec11 .disc {margin: 100px 0 50px;} .silhouette_soft .sec11 .disc h4 {margin-top: 15px;} .silhouette_soft .sec11 .inuq a {font-size: 18px;} .silhouette_soft .sec11 .real-review-box .swiper-slide .txt_box {font-size: 12px; padding: 15px;} .silhouette_soft .sec11 .real-review-box .swiper-slide {min-height: 200px;} } .silhouette_soft .recommend_sec {padding: 200px 0; text-align: center; position: relative; font-family: 'Pretendard'; max-width: 1200px; margin: 0 auto; } .silhouette_soft .recommend_sec .recommend_box {display: flex;} .silhouette_soft .recommend_sec .recommend_box .sec08_thumbnail {width: 40%; position: relative;} .silhouette_soft .recommend_sec .recommend_box .sec08_thumbnail img {width: 100%; vertical-align: bottom;} .silhouette_soft .recommend_sec .recommend_box .txt_box {width: 60%; text-align: left; margin-right: 50px;} .silhouette_soft .recommend_sec .recommend_box .txt_box h2 {font-family: 'SangBlueOgSerifRelgular'; font-size: 54px;} .silhouette_soft .recommend_sec .recommend_box .txt_box p {font-family: "Noto Serif KR", serif; font-size: 24px; margin-top: 15px; font-weight: 500;} .silhouette_soft .recommend_sec .recommend_box .txt_box ul {margin-top: 40px;} .silhouette_soft .recommend_sec .recommend_box .txt_box ul li {font-size: 21px; padding: 20px 0; border-top: 1px solid #EBEBEB; font-weight: 600; display: flex; align-items: center;} .silhouette_soft .recommend_sec .recommend_box .txt_box ul li:last-child {border-bottom: 1px solid #EBEBEB;} .silhouette_soft .recommend_sec .recommend_box .txt_box ul li span:first-child {font-family: 'SangBleuOGSerif-Medium';} .silhouette_soft .recommend_sec .recommend_box .txt_box ul li span:nth-child(2) {color: #9D9D9D; margin: 0 8px; font-size: 32px;} .silhouette_soft .recommend_sec .recommend_box .txt_box ul li span:nth-child(3) {font-weight: 400;} .silhouette_soft .recommend_sec .recommend_box .txt_box .inqu a {background-color: #DCCCB2; color: #fff; padding: 12px 36px; border-radius: 36px; font-size: 26px; margin-top: 50px; font-weight: 600;} .silhouette_soft .recommend_sec .recommend_box .txt_bg {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; width: 200%;} .silhouette_soft .recommend_sec .recommend_box .txt_bg img {width: 100%;} @media(max-width:1240px) { .silhouette_soft .recommend_sec .recommend_box {flex-direction: column-reverse;} .silhouette_soft .recommend_sec .recommend_box .sec10_thumbnail {width: 100%;} .silhouette_soft .recommend_sec .recommend_box .txt_bg {display: none;} .silhouette_soft .recommend_sec .recommend_box .txt_box {width: 100%; text-align: center; margin-top: 40px;} .silhouette_soft .recommend_sec .recommend_box .txt_box h2 {font-size: 48px;} .silhouette_soft .recommend_sec .recommend_box .txt_box p {font-size: 20px;} .silhouette_soft .recommend_sec .recommend_box .txt_box ul li {margin: 0 20px; padding: 10px 0;} .silhouette_soft .recommend_sec .recommend_box .txt_box ul li span {font-size: 14px;} .silhouette_soft .recommend_sec .recommend_box .txt_box .inqu a {font-size: 18px;} } @media(max-width:768px) { .silhouette_soft .recommend_sec {padding: 150px 0;} .silhouette_soft .recommend_sec .recommend_box .sec08_thumbnail {width: 100%;} } .silhouette_soft .sec13 {padding: 200px 0;} .silhouette_soft .sec13 .sec_tit {max-width: 1240px; margin: 0 auto;}.silhouette_soft .sec13 .sec_tit h3, .silhouette_soft .sec13 .sec_tit h1 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; margin-bottom: 10px;} .silhouette_soft .sec13 .sec_tit span {font-size: 24px; margin: 10px 0 50px; font-weight: 600; font-family: "Noto Serif KR", serif;} .silhouette_soft .sec13 .box {display: flex; gap: 20px; max-width: 1200px; margin: 0 auto;} .silhouette_soft .sec13 .box .thumbnail img {width: 100%;} .silhouette_soft .sec13 .sec07_disc {text-align: center; margin-top: 60px;} .silhouette_soft .sec13 .sec07_disc span {padding: 10px 30px; border: 1px solid #f4f4f4; color: #cdcdcd; display: inline-flex; align-items: center;} .silhouette_soft .sec13 .sec07_disc span img {margin-right: 10px;} .silhouette_soft .sec13 .hydra_before {margin: 50px 0;} .silhouette_soft .sec13 .effect_list ul {display: flex; justify-content: center; gap: 20px; margin: 30px 0;} .silhouette_soft .sec13 .swiper-slide img {width: 100%;} @media(max-width:768px) { .silhouette_soft .sec13 {padding: 150px 0;}.silhouette_soft .sec13 .sec_tit h3, .silhouette_soft .sec13 .sec_tit h1 {font-size: 42px; margin-bottom: 0;} .silhouette_soft .sec13 .sec_tit span {font-size: 14px; margin-top: 20px; line-height: 1.5;} .silhouette_soft .sec13 .box {margin-top: 0;} } .silhouette_soft .sec14 {padding: 200px 0; text-align: center; position: relative; font-family: 'Pretendard';} .silhouette_soft .sec14 .txt {max-width: 1240px; margin: 0 auto;} .silhouette_soft .sec14 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular'; margin-bottom: 10px; color: #222;} .silhouette_soft .sec14 .txt span {font-size: 24px; margin: 10px 0 50px; font-weight: 500; font-family: "Noto Serif KR", serif;} .silhouette_soft .sec14 .face_program_nav {display: flex; gap: 20px; justify-content: center; margin-bottom: 30px;} .silhouette_soft .sec14 .face_program_nav li {flex: 1; max-width: 160px;} .silhouette_soft .sec14 .face_program_nav li a {font-size: 20px; padding: 10px 0; border: 1px solid #DCCCB2; border-radius: 30px; width: 100%; box-sizing: border-box;} .silhouette_soft .sec14 .face_program_nav li a.active {background-color: #DCCCB2; color: #fff; font-weight: 600;} .silhouette_soft .sec14 .face_program_contnent img {width: 100%; max-width: 1200px; margin: 0 auto} @media(max-width:768px) { .silhouette_soft .sec14 {padding: 150px 0;} .silhouette_soft .sec14 .txt h3 {font-size: 42px; margin-bottom: 0;} .silhouette_soft .sec14 .txt span {font-size: 16px; margin: 20px 0 30px;}.silhouette_soft .sec14 .sec_tit h3, .silhouette_soft .sec14 .sec_tit h1 {font-size: 32px;} .silhouette_soft .sec14 .face_program_nav {gap: 15px; flex-wrap: wrap; padding: 0 10px} .silhouette_soft .sec14 .face_program_nav li {flex: auto; width: 100px;} .silhouette_soft .sec14 .face_program_nav li a {font-size: 16px;} } .ulthermage_wrap .ulthermage_title {padding: 100px 100px 0;} .ulthermage_wrap .ulthermage_title img {width: 100%;} .ulthermage_wrap .sec01 {padding: 100px 0;} .ulthermage_wrap .txt_line {margin-bottom: 100px;} .ulthermage_wrap .sec01 {text-align: center; position: relative; font-family: 'Pretendard';} .ulthermage_wrap .sec01 .sec_tit {margin: -130px 0 0 0 !important} .ulthermage_wrap .sec01 .sec_tit span {} .ulthermage_wrap .sec01 .txt {max-width: 1240px; margin: 0 auto;} .ulthermage_wrap .sec01 .txt h3 {font-size: 72px; font-family: 'Marcellus';} .ulthermage_wrap .sec01 .txt span {font-size: 30px; margin: 30px 0 50px; font-weight: 600; font-family: 'AritaBuriL';} @media(max-width:768px) { .ulthermage_wrap .sec01 {padding: 0; padding-bottom: 150px;} .ulthermage_wrap .ulthermage_title {padding: 100px 20px 20px 10px;} } .ulthermage_wrap .sec02 {padding: 200px 0; text-align: center;} .ulthermage_wrap .sec02 .sec_tit {max-width: 1240px; margin: 0 auto; text-align: center; position: relative; margin-bottom: 50px;}.ulthermage_wrap .sec02 .sec_tit h3, .ulthermage_wrap .sec02 .sec_tit h1 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; margin-bottom: 10px;} .ulthermage_wrap .sec02 .sec_tit span {font-size: 24px; margin: 10px 0 0; font-weight: 600; color: #aa8863; line-height: 1.5;} .ulthermage_wrap .sec02 .box>div {display: flex; align-items: center; text-align: left; padding: 0 0 75px;} .ulthermage_wrap .sec02 .box>div:last-child {flex-direction: row-reverse; text-align: right; padding: 0;} .ulthermage_wrap .sec02 .box>div>div {width: 50%;} .ulthermage_wrap .sec02 .box>div .txt {padding: 40px; box-sizing: border-box;} .ulthermage_wrap .sec02 .box>div .img img {vertical-align: bottom; width: 100%;} .ulthermage_wrap .sec02 .box>div h5 {font-size: 34px; font-weight: 700; display: flex; align-items: center; font-family: "Noto Serif KR", serif; color: #222;} .ulthermage_wrap .sec02 .box>div h5 img {height: 100%; margin: 0 15px;} .ulthermage_wrap .sec02 .box>div:first-child {background-position: right; background-repeat: no-repeat;} .ulthermage_wrap .sec02 .box>div:first-child h5 strong {color: #f7a611; font-family: "Noto Serif KR", serif;} .ulthermage_wrap .sec02 .box>div:last-child {background-position: right; background-repeat: no-repeat;} .ulthermage_wrap .sec02 .box>div:last-child h5 {justify-content: flex-end;} .ulthermage_wrap .sec02 .box>div:last-child h5 strong {color: #8f3688; font-family: "Noto Serif KR", serif;} .ulthermage_wrap .sec02 .box>div p {font-size: 20px; line-height: 1.5; margin: 35px 0 60px;} .ulthermage_wrap .sec02 .box>div span {font-size: 20px; font-weight: 600; padding: 15px 30px; background-color: #EEE6DE; border-radius: 30px; text-align: center; margin: 0 15px 15px 0;} .ulthermage_wrap .sec02 .box>div span img {margin: 0 5px 0 10px;} @media(max-width:768px) { .ulthermage_wrap .sec02 {padding: 150px 0 50px;}.ulthermage_wrap .sec02 .sec_tit h3, .ulthermage_wrap .sec02 .sec_tit h1 {font-size: 32px;} .ulthermage_wrap .sec02 .sec_tit span {font-size: 20px; margin: 0;} .ulthermage_wrap .sec02 .box>div {padding: 0;} .ulthermage_wrap .sec02 .box>div:last-child, .ulthermage_wrap .sec02 .box>div {flex-direction: column;} .ulthermage_wrap .sec02 .box>div>div {width: 100%;} .ulthermage_wrap .sec02 .box>div .txt {padding: 40px 20px 100px;} .ulthermage_wrap .sec02 .box>div .txt>div {display: grid; grid-template-columns: repeat(3, 1fr);} .ulthermage_wrap .sec02 .box>div h5 {font-size: 28px;} .ulthermage_wrap .sec02 .box>div h5 img {max-width: 90px;} .ulthermage_wrap .sec02 .box>div p {text-align: center; font-size: 14px; margin: 20px 0 40px;} .ulthermage_wrap .sec02 .box>div span {font-size: 14px; margin: 0 10px 10px 0;} .ulthermage_wrap .visual_title h2, .ulthermage_wrap .visual_title h1 {font-size: 44px; line-height: 1.2;} } @media(max-width:500px) { .ulthermage_wrap .sec02 .box>div .txt>div {grid-template-columns: repeat(2, 1fr);} .ulthermage_wrap .sec02 .box>div h5 {font-size: 23px;} .ulthermage_wrap .sec02 .box>div h5 img {max-width: 60px; margin: 0 10px;} .ulthermage_wrap .sec02 .box>div span {margin: 0 10px 10px 0; padding: 13px 20px;} } .ulthermage_wrap .sec03 {padding: 200px 0; text-align: center;} .ulthermage_wrap .sec03 .sec_tit {max-width: 1240px; margin: 0 auto; text-align: center; position: relative; margin-bottom: 50px;}.ulthermage_wrap .sec03 .sec_tit h3, .ulthermage_wrap .sec03 .sec_tit h1 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; margin-bottom: 10px;} .ulthermage_wrap .sec03 .sec_tit span {font-size: 24px; margin: 10px 0 0; font-weight: 600; color: #aa8863; line-height: 1.5; font-family: "Noto Serif KR", serif;} .ulthermage_wrap .sec03 .ulthermage-lifting-swiper img {width: 100%;} @media(max-width:768px) { .ulthermage_wrap .sec03 {margin-bottom: 0; padding: 150px 0;} .ulthermage_wrap .sec03 .sec_tit {margin-bottom: 20px;}.ulthermage_wrap .sec03 .sec_tit h3, .ulthermage_wrap .sec03 .sec_tit h1 {font-size: 26px;} .ulthermage_wrap .sec03 .sec_tit span {font-size: 16px;} } .ulthermage_wrap .sec04 {padding: 200px 0; background-image: url('/assets/img/youlbit/images/ulthermage_sec04_bg.webp'); background-repeat: no-repeat; background-position: center; background-size: cover;} .ulthermage_wrap .sec04 .sec_tit {max-width: 1240px; margin: 0 auto; text-align: center; position: relative; margin-bottom: 10px;}.ulthermage_wrap .sec04 .sec_tit h3, .ulthermage_wrap .sec04 .sec_tit h1 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; margin-bottom: 10px;} .ulthermage_wrap .sec04 .sec_tit span {font-size: 24px; margin: 0; font-weight: 600; color: #7F5F3B; line-height: 1.5;} .ulthermage_wrap .sec04>h2 {font-size: 36px; font-family: "Noto Serif KR", serif; color: #7F5F3B; font-weight: 600; margin: 50px 0 30px;} .ulthermage_wrap .sec04>p {font-size: 18px; line-height: 1.5;} .ulthermage_wrap .sec04>p strong {font-weight: 600;} .ulthermage_wrap .sec04 .thumbnail {margin-top: 30px; margin-right: 4vw;} .ulthermage_wrap .sec04 .thumbnail img {width: 100%; max-width: 600px;} .ulthermage_wrap .sec04 .txt_box {max-width: 1200px; width: 100%; margin: 80px auto 0; padding: 60px 30px; box-sizing: border-box; background-color: #fff; box-shadow: inset 1px 0px 15px 3px rgb(0, 0, 0, 0.10); border-radius: 10px; color: #222;} .ulthermage_wrap .sec04 .txt_box h4 {font-size: 34px; font-weight: 600; color: #7F5F3B; margin-bottom: 50px; font-family: "Noto Serif KR", serif; position: relative; display: inline-block;} .ulthermage_wrap .sec04 .txt_box h4 img {max-width: 60px; margin-bottom: -10px;} .ulthermage_wrap .sec04 .txt_box h4::before {content: ""; position: absolute; bottom: -15px; left: 0px; background-color: #7F5F3B; width: 100%; height: 2px;} .ulthermage_wrap .sec04 .txt_box p {font-size: 20px; line-height: 1.5; font-weight: 400;} .ulthermage_wrap .sec04 .txt_box p strong {font-weight: 500; text-decoration: underline 0.1em; margin-top: 20px; display: inline-block; text-underline-position: under;} @media(max-width:768px) { .ulthermage_wrap .sec04 {padding: 150px 20px;}.ulthermage_wrap .sec04 .sec_tit h3, .ulthermage_wrap .sec04 .sec_tit h1 {font-size: 24px;} .ulthermage_wrap .sec04 .sec_tit span {font-size: 24px;} .ulthermage_wrap .sec04>h2 {font-size: 22px;} .ulthermage_wrap .sec04>p {font-size: 15px;} .ulthermage_wrap .sec04 .thumbnail {margin-right: 0; width: 100%; max-width: 100%; margin: 70px auto 0;} .ulthermage_wrap .sec04 .txt_box {padding: 40px 20px} .ulthermage_wrap .sec04 .txt_box h4 {font-size: 18px;} .ulthermage_wrap .sec04 .txt_box h4 img {max-width: 30px;} .ulthermage_wrap .sec04 .txt_box p {font-size: 14px;} .ulthermage_wrap .sec04 .txt_box p strong {margin-top: 20px;} } .ulthermage_wrap .sec05 {max-width: 1200px; margin: 0 auto; width: 100%; position: relative; padding: 200px 0; text-align: center;} .ulthermage_wrap .sec05 .sec_tit {max-width: 1200px; margin: 0 auto; text-align: center; position: relative; margin-bottom: 50px;}.ulthermage_wrap .sec05 .sec_tit h3, .ulthermage_wrap .sec05 .sec_tit h1 {font-size: 72px; font-family: 'Marcellus'; margin-bottom: 10px;} .ulthermage_wrap .sec05 .sec_tit span {font-size: 30px; margin: 20px 0; font-weight: 600; color: #aa8863; line-height: 1.5;} .ulthermage_wrap .sec05 .img {text-align: center;} .ulthermage_wrap .sec05 .txt {text-align: left; max-width: 900px;} .ulthermage_wrap .sec05 .txt>div {font-size: 44px; color: #7f5f3b; display: flex; font-family: "Noto Serif KR", serif; font-weight: 700;} .ulthermage_wrap .sec05 .txt>div>h2 {margin-top: -30px; margin-right: 10px;} .ulthermage_wrap .sec05 .txt>div>strong {font-family: "Noto Serif KR", serif;} .ulthermage_wrap .sec05 .txt>div small {font-family: 'SangBlueOgSerifRelgular'; transform: rotate(9deg); margin-top: 4px; display: inline-block;} .ulthermage_wrap .sec05 .txt>div img {width: 100%;} .ulthermage_wrap .sec05 .txt div+p {color: #444444; font-size: 18px; margin: 40px 0 10px; position: relative;} .ulthermage_wrap .sec05 .txt div+p::after {content: ""; position: absolute; bottom: -5px; left: 0; width: 100%; height: 1px; background-color: #222;} .ulthermage_wrap .sec05 .txt p {font-size: 20px; line-height: 1.5;} .ulthermage_wrap .sec05 .txt p:last-child {position: relative; padding: 20px 0;} .ulthermage_wrap .sec05 .txt p:last-child::after {content: ""; position: absolute; bottom: -70px; left: 0; width: 100%; height: 1px; background-color: #000;} .ulthermage_wrap .sec05 .txt p strong {font-size: 22px; text-decoration: underline; text-underline-position: under;} .ulthermage_wrap .sec05 .txt .strong_color {text-decoration: none; color: #7F5F3B; font-family: "Noto Serif KR", serif; font-weight: 700; font-size: 24px;} .ulthermage_wrap .sec05 .product_img {position: absolute; top: 27%; right: -20%; transform: translateY(-50%);} .ulthermage_wrap .sec05 .product_img img {max-width: 750px} .ulthermage_wrap .sec05 .product_video {margin-top: 300px;} .ulthermage_wrap .sec05 .product_video * {width: 100%;} @media(max-width:768px) { .ulthermage_wrap .sec05 {padding: 150px 0;} .ulthermage_wrap .sec05 .txt>div {font-size: 22px; padding: 0 15px;} .ulthermage_wrap .sec05 .txt>div small {margin-top: 3px;} .ulthermage_wrap .sec05 .txt>div img {max-width: 90%; margin: 40px auto 0;} .ulthermage_wrap .sec05 .txt div+p {font-size: 13px; margin: 40px 20px 0;} .ulthermage_wrap .sec05 .txt p {font-size: 16px;} .ulthermage_wrap .sec05 .txt p:last-child {padding: 20px;} .ulthermage_wrap .sec05 .txt p:last-child::after {bottom: -10px; width: calc(100% - 40px); left: 50%; transform: translateX(-50%)} .ulthermage_wrap .sec05 .txt p strong {font-size: 18px;} .ulthermage_wrap .sec05 .txt .strong_color {font-size: 18px;} .ulthermage_wrap .sec05 .product_video {margin-top: 150px;;} } .ulthermage_wrap .sec06 {padding: 200px 0; text-align: center; background: url('/assets/img/youlbit/images/ulthermage-effect_bg.webp') center no-repeat; background-size: cover;} .ulthermage_wrap .sec06 .sec_tit {max-width: 1240px; margin: 0 auto; text-align: center; position: relative; margin-bottom: 50px;}.ulthermage_wrap .sec06 .sec_tit h3, .ulthermage_wrap .sec06 .sec_tit h1 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; margin-bottom: 10px;} .ulthermage_wrap .sec06 .sec_tit span {font-size: 24px; margin: 0; font-weight: 600; color: #aa8863; line-height: 1.5;} .ulthermage_wrap .sec06 ul {display: flex; justify-content: center; gap: 20PX;} .ulthermage_wrap .sec06 ul li {position: relative;} .ulthermage_wrap .sec06 ul li .thumbnail img {max-width: 285px;} .ulthermage_wrap .sec06 ul li .txt {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; z-index: 1;} .ulthermage_wrap .sec06 ul li .txt h5 {font-family: 'Marcellus'; font-size: 24px; white-space: nowrap;} .ulthermage_wrap .sec06 ul li .txt p {font-family: "Noto Serif KR", serif; font-size: 20px; margin-bottom: 15px;} .ulthermage_wrap .sec06 ul li .txt span {font-family: 'Marcellus'; font-size: 36px; white-space: nowrap; margin-top: 20px;} .ulthermage_wrap .sec06 ul li .bg {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; border-radius: 100%;} .ulthermage_wrap .sec06 ul li .txt, .ulthermage_wrap .sec06 ul li .bg {opacity: 0; visibility: hidden; transition: 0.3s;} .ulthermage_wrap .sec06 ul li:hover .txt, .ulthermage_wrap .sec06 ul li:hover .bg {opacity: 1; visibility: visible;} @media(max-width:768px) { .ulthermage_wrap .sec06 {background-color: transparent !important; padding: 150px 0;}.ulthermage_wrap .sec06 .sec_tit h3, .ulthermage_wrap .sec06 .sec_tit h1 {font-size: 36px;} .ulthermage_wrap .sec06 .sec_tit span {font-size: 16px;} .ulthermage_wrap .sec06 ul {display: grid; gap: 10px; padding: 20px; grid-template-columns: repeat(2, 1fr);} .ulthermage_wrap .sec06 ul li img {width: 100%;} .ulthermage_wrap .sec06 ul li .txt p {font-size: 14px;} .ulthermage_wrap .sec06 ul li .txt h5 {font-size: 16px;} } .ulthermage_wrap .sec07 .sec_tit span {font-size: 24px; margin: 0; font-weight: 600; color: #aa8863; line-height: 1.5; margin-bottom: 50px;} .ulthermage_wrap .sec07 .box {position: relative;} .ulthermage_wrap .sec07 .box .thumbnail img {max-width: 1600px; margin: 0 auto;} .ulthermage_wrap .sec07 .box.box2 {margin-top: 100px;} .ulthermage_wrap .sec08 .box img {margin-bottom: 0px;} .ulthermage_wrap .sec08 .box>div .smb_img {display: none !important;} .ulthermage_wrap .sec07 .box2 .thumbnail img {max-width: 1600px} .ulthermage_wrap .sec07 .box2 .confirm {position: absolute; right: 25%; top: 102%; left: auto;} .ulthermage_wrap .sec07 .box2 .pop_content {flex-direction: column;} .ulthermage_wrap .sec07 .box2 .pop_content h5 {color: #97479a; margin: 20px 0;} .ulthermage_wrap .sec07 .box2 .imgs {display: flex; flex-direction: row; align-items: flex-end; margin-top: 30px; gap: 40px;} .ulthermage_wrap .sec07 .box2 .piece_pop {top: 70%; box-shadow: 1px 1px 30px 4px rgba(0, 0, 0, 0.25);} .ulthermage_wrap .sec07 .confirm {position: absolute; left: 20%; top: 95%;} .ulthermage_wrap .sec07 .confirm>div {display: flex; align-items: center;} .ulthermage_wrap .sec07 .confirm span {color: #956809; font-size: 20px; text-decoration: underline; font-weight: 600; text-underline-position: under; margin-left: 10px;} .ulthermage_wrap .sec07 .pop_content {display: flex; justify-content: space-between;} .ulthermage_wrap .sec07 .pop_content>div {display: flex; flex-direction: column; justify-content: space-between;} .ulthermage_wrap .sec07 .pop_content h5 {font-size: 24px; font-weight: 600; color: #e7b32b;} .ulthermage_wrap .sec07 .pop_content p {font-size: 18px; color: #222; line-height: 1.5; margin-top: 15px;} .ulthermage_wrap .sec07 .pop_content .img {margin-top: 20px;} .ulthermage_wrap .sec07 .piece_pop {display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; padding: 40px 100px; box-sizing: border-box; border: 5px solid #946709; border-radius: 50px;} .ulthermage_wrap .sec07 .piece_pop.show {display: block;} .ulthermage_wrap .sec07 .piece_pop .s_title h4 {font-family: 'SangBlueOgSerifRelgular'; font-size: 40px; font-style: italic; color: #222;} .ulthermage_wrap .sec07 .s_title p {margin: 10px 0 20px; font-size: 18px;} .ulthermage_wrap .sec07 .pop_box1 {padding-right: 100px} .ulthermage_wrap .sec07 .pop_box1 {border-right: 1px solid #222;} .ulthermage_wrap .sec07 .pop_box2 {padding-left: 100px} .ulthermage_wrap .sec07 .pop_close {position: absolute; top: 30px; right: 30px;} @media(max-width:768px) { .ulthermage_wrap .sec07 {padding: 150px 0;} .ulthermage_wrap .sec07 .sec_tit .tip_m_title {font-size: 16px;} .ulthermage_wrap .sec07 .box .thumbnail img:last-child {padding: 0 20px; box-sizing: border-box; width: 100%;} .ulthermage_wrap .sec07 .box2 {margin-top: 200px;} .ulthermage_wrap .sec07 .box2 .piece_pop {top: 40%;} .ulthermage_wrap .sec07 .box2 .confirm, .ulthermage_wrap .sec07 .confirm {position: unset; text-align: center;} .ulthermage_wrap .sec07 .box2 .imgs {align-items: center;} .ulthermage_wrap .sec07 .box2 .imgs, .ulthermage_wrap .sec07 .pop_content {flex-direction: column; gap: 40px} .ulthermage_wrap .sec07 .box2 .imgs, .ulthermage_wrap .sec07 .pop_content img {width: 100%;} .ulthermage_wrap .sec07 .confirm>div {justify-content: center; margin-bottom: 20px;} .ulthermage_wrap .sec07 .pop_content h5 {font-size: 16px; line-height: 1.5} .ulthermage_wrap .sec07 .pop_content p {font-size: 14px;} .ulthermage_wrap .sec07 .piece_pop {top: 20%; padding: 70px 20px 50px; width: 94%;} .ulthermage_wrap .sec07 .piece_pop .s_title h4 {font-size: 36px} .ulthermage_wrap .sec07 .piece_pop2 .pop_content .imgs {flex-direction: column;} .ulthermage_wrap .sec07 .pop_box1 {border-right: 0; border-top: 1px solid #222; padding-top: 40px; padding-right: 0;} .ulthermage_wrap .sec07 .pop_box2 {padding-left: 0;} .ulthermage_wrap .piece_machine {max-width: 50% !important; margin: 0 auto 50px !important;} } .ulthermage_wrap .sec08 {padding: 200px 0; text-align: center; box-sizing: border-box; background: url('/assets/img/youlbit/images/ulthermage_sec08_bg.webp') center no-repeat; background-size: cover; position: relative; margin: 200px 0;} .ulthermage_wrap .sec08 .bg_txt {text-align: center; color: #fff;} .ulthermage_wrap .sec08 .bg_txt h3 {font-family: 'SangBlueOgSerifRelgular'; font-size: 54px; font-style: italic; color: #fff;} .ulthermage_wrap .sec08 .bg_txt h4 {font-family: "Noto Serif KR", serif; font-size: 34px; margin: 20px 0 50px; font-weight: 600;} .ulthermage_wrap .sec08 .bg_txt p {font-family: 'Marcellus'; font-size: 60px;} .ulthermage_wrap .sec08 .bg_txt p strong {font-size: 100px;} .ulthermage_wrap .sec08 .bg_txt span {font-size: 13px; margin: 30px 0;} .ulthermage_wrap .sec08 .box {max-width: 1200px; margin: 0 auto;} .ulthermage_wrap .sec08 .box>div {margin: 50px 0 0; display: flex; flex-direction: column; gap: 50px;} .ulthermage_wrap .sec08 .box>div img:nth-child(odd) {align-self: end;} .ulthermage_wrap .sec08 .box>div img:nth-child(even) {align-self: start;} @media(max-width:768px) { .ulthermage_wrap .sec08 {padding: 150px 0 !important; margin: 0;} .ulthermage_wrap .sec08 .bg_txt h3 {font-size: 42px;} .ulthermage_wrap .sec08 .bg_txt h4 {font-size: 28px;} .ulthermage_wrap .sec08 .box>div img {width: 100%;} } @media(max-width:458px) { .ulthermage_wrap .sec08 .box>div .mb_img {display: none !important;} .ulthermage_wrap .sec08 .box>div .smb_img {display: block !important;} } .ulthermage_wrap .sec09 {background-color: #efefef; padding: 150px 0;}.ulthermage_wrap .sec09 .sec_tit h3, .ulthermage_wrap .sec09 .sec_tit h1 {font-size: 44px; margin: 20px 0 50px; font-weight: 700; font-family: "Noto Serif KR", serif !important;} .ulthermage_wrap .sec09 .sec_tit div img {max-width: 250px;} .ulthermage_wrap .sec09 .advantage_swiper .swiper-slide img {max-height: 600px;} @media(max-width:768px) { .ulthermage_wrap .sec09 .sec_tit h3, .ulthermage_wrap .sec09 .sec_tit h1 {font-size: 26px;} .ulthermage_wrap .sec09 .sec_tit>div {margin-bottom: 20px;} .ulthermage_wrap .sec09 .sec_tit>div img {max-width: 170px; margin: 0 auto;} .ulthermage_wrap .sec09 .advantage {padding-left: 20px;} .ulthermage_wrap .sec09 .advantage_swiper .swiper-slide img {max-height: 380px;} } .ulthermage_wrap .sec10 {padding: 200px 0; text-align: center; background-color: #F4F0E8; margin: 200px 0;} .ulthermage_wrap .sec10 h3 {font-size: 22px; font-weight: 500; line-height: 1.7; margin-top: 50px; color: #222;} .ulthermage_wrap .sec10 .thumbnail img {width: 100%; max-width: 1200px;} .ulthermage_wrap .sec10 .bodyfit_review .swiper-slide img {width: 100%;} .ulthermage_wrap .sec10 .bodyfit_review {margin-left: -250px;} .ulthermage_wrap .sec10 .bodyfit_review .swiper-pagination {display: none;} .ulthermage_wrap .sec10 .disc {margin: 150px 0 50px;} .ulthermage_wrap .sec10 .disc h4 {font-size: 36px; font-family: "Noto Serif KR", serif; margin-top: 30px; color: #61462F;} .ulthermage_wrap .sec10 .disc p {font-weight: 300; font-size: 16px; letter-spacing: 8px; color: #61462F;} .ulthermage_wrap .sec10 .inuq {margin: 30px 0;} .ulthermage_wrap .sec10 .inuq a {padding: 12px 36px; color: #fff; font-size: 26px; background-color: #B28965; border-radius: 30px; font-weight: 600;} .ulthermage_wrap .sec10 .real-review-box .swiper-slide .txt_box p {line-height: 1.5; text-align: left; font-weight: 500;} @media(max-width:768px) { .ulthermage_wrap .sec10 {margin: 150px 0; padding: 150px 0;} .ulthermage_wrap .sec10 .disc {margin: 100px 0 50px} .ulthermage_wrap .sec10 .disc h4 {margin-top: 15px;} .ulthermage_wrap .sec10 .inuq a {font-size: 18px;} .ulthermage_wrap .sec10 .real-review-box .swiper-slide .txt_box {font-size: 12px; padding: 15px;} .ulthermage_wrap .sec10 .real-review-box .swiper-slide {min-height: 200px;} } .ulthermage_wrap .sec11 {padding: 0; text-align: center; position: relative; font-family: 'Pretendard'; max-width: 1200px; margin: 0 auto; padding-bottom: 200px;} .ulthermage_wrap .sec11 .sec11_box {display: flex;} .ulthermage_wrap .sec11 .sec11_box .sec10_thumbnail {width: 40%; position: relative;} .ulthermage_wrap .sec11 .sec11_box .sec10_thumbnail img {width: 100%; vertical-align: bottom;} .ulthermage_wrap .sec11 .sec11_box .txt_box {width: 60%; text-align: left; margin-right: 50px;} .ulthermage_wrap .sec11 .sec11_box .txt_box h2 {font-family: 'SangBlueOgSerifRelgular' !important; font-size: 54px;} .ulthermage_wrap .sec11 .sec11_box .txt_box p {font-family: "Noto Serif KR", serif; font-size: 24px; margin-top: 15px; font-weight: 600;} .ulthermage_wrap .sec11 .sec11_box .txt_box ul {margin-top: 40px;} .ulthermage_wrap .sec11 .sec11_box .txt_box ul li {font-size: 24px; padding: 20px 0; border-top: 1px solid #EBEBEB; font-weight: 600; display: flex; align-items: center;} .ulthermage_wrap .sec11 .sec11_box .txt_box ul li:last-child {border-bottom: 1px solid #EBEBEB;} .ulthermage_wrap .sec11 .sec11_box .txt_box ul li span:first-child {font-family: 'SangBleuOGSerif-Medium'; font-weight: 400;} .ulthermage_wrap .sec11 .sec11_box .txt_box ul li span:nth-child(2) {color: #9D9D9D; margin: 0 8px; font-size: 32px;} .ulthermage_wrap .sec11 .sec11_box .txt_box ul li span:nth-child(3) {font-weight: 400;} .ulthermage_wrap .sec11 .sec11_box .txt_box .inqu a {background-color: #DCCCB2; color: #fff; padding: 12px 36px; border-radius: 36px; font-size: 24px; margin-top: 60px; font-weight: 600;} .ulthermage_wrap .sec11 .sec11_box .txt_bg {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; width: 200%;} .ulthermage_wrap .sec11 .sec11_box .txt_bg img {width: 100%;} @media(max-width:1240px) { .ulthermage_wrap .sec11 {padding-bottom: 150px;} .ulthermage_wrap .sec11 .sec11_box {flex-direction: column-reverse;} .ulthermage_wrap .sec11 .sec11_box .sec10_thumbnail {width: 100%;} .ulthermage_wrap .sec11 .sec11_box .txt_box {width: 100%; text-align: center; margin-top: 40px;} .ulthermage_wrap .sec11 .sec11_box .txt_box h2 {font-size: 48px;} .ulthermage_wrap .sec11 .sec11_box .txt_box p {font-size: 20px;} .ulthermage_wrap .sec11 .sec11_box .txt_box ul li {margin: 0 20px; padding: 10px 0;} .ulthermage_wrap .sec11 .sec11_box .txt_box ul li span {font-size: 14px;} .ulthermage_wrap .sec11 .sec11_box .txt_box .inqu a {font-size: 18px;} .ulthermage_wrap .sec11 .sec11_box .txt_bg {display: none;} } .ulthermage_wrap .sec12 {padding: 300px 0 0; text-align: center; position: relative; font-family: 'Pretendard';} .ulthermage_wrap .sec12 .txt {max-width: 1240px; margin: 0 auto;} .ulthermage_wrap .sec12 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; color: #222;} .ulthermage_wrap .sec12 .txt span {font-size: 24px; margin: 20px 0 50px; font-weight: 500; font-family: "Noto Serif KR", serif;} .ulthermage_wrap .sec12 .ulthermage_program_nav {display: flex; gap: 20px; justify-content: center; margin-bottom: 30px;} .ulthermage_wrap .sec12 .ulthermage_program_nav li {flex: 1; max-width: 160px; max-width: 270px;} .ulthermage_wrap .sec12 .ulthermage_program_nav li a {font-size: 20px; padding: 10px 0; border: 1px solid #DCCCB2; border-radius: 30px; width: 100%; box-sizing: border-box;} .ulthermage_wrap .sec12 .ulthermage_program_nav li a.active {background-color: #DCCCB2; color: #fff; font-weight: 600;} .ulthermage_wrap .sec12 .box {display: flex; margin-top: 50px; max-width: 1200px; margin: 0 auto;} .ulthermage_wrap .sec12 .box img {width: 100%; vertical-align: bottom;} .ulthermage_wrap .sec12 .box>div {flex: 1.4;} .ulthermage_wrap .sec12 .box>ul {display: grid;} .ulthermage_wrap .sec12 .box>ul li {border-bottom: 1px solid #D2D2D2; cursor: pointer; display: flex; text-align: left; padding: 40px; align-items: center; transition: 0.3s; line-height: 1.5;} .ulthermage_wrap .sec12 .box>ul li:hover {background-color: #f9f9f9;} .ulthermage_wrap .sec12 .box>ul li:first-child {border-top: 1px solid #D2D2D2;} .ulthermage_wrap .sec12 .box>ul li span {padding: 20px; margin-right: 30px;} .ulthermage_wrap .sec12 .box>ul li h5 {font-size: 24px; font-weight: 700; color: #aa8863; margin-top: 10px;} .ulthermage_wrap .sec12 .box>ul li p {font-size: 20px;} @media(max-width:768px) { .ulthermage_wrap .sec12 {padding: 150px 0 0;} .ulthermage_wrap .sec12 .txt h3 {font-size: 42px;} .ulthermage_wrap .sec12 .txt span {font-size: 16px; margin-top: 20px;} .ulthermage_wrap .sec12 .box {margin-top: 0;} } .ulthermage_wrap .sec13 {padding: 300px 0 200px; text-align: center; position: relative; font-family: 'Pretendard';} .ulthermage_wrap .sec13 .txt {max-width: 1240px; margin: 0 auto;} .ulthermage_wrap .sec13 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; margin-bottom: 10px; color: #222;} .ulthermage_wrap .sec13 .txt span {font-size: 24px; margin: 10px 0 50px; font-weight: 500; font-family: "Noto Serif KR", serif;} .ulthermage_wrap .sec13 .face_program_nav {display: flex; gap: 20px; justify-content: center; margin-bottom: 30px;} .ulthermage_wrap .sec13 .face_program_nav li {flex: 1; max-width: 160px;} .ulthermage_wrap .sec13 .face_program_nav li a {font-size: 20px; padding: 10px 0; border: 1px solid #DCCCB2; border-radius: 30px; width: 100%; box-sizing: border-box;} .ulthermage_wrap .sec13 .face_program_nav li a.active {background-color: #DCCCB2; color: #fff; font-weight: 600;} .ulthermage_wrap .sec13 .face_program_contnent img {width: 100%; max-width: 1200px; margin: 0 auto} @media(max-width:768px) { .ulthermage_wrap .sec13 {padding: 150px 0;} .ulthermage_wrap .sec13 .txt h3 {font-size: 42px;} .ulthermage_wrap .sec13 .txt span {font-size: 16px;}.ulthermage_wrap .sec_tit h3, .ulthermage_wrap .sec_tit h1 {font-size: 32px;} .ulthermage_wrap .sec13 .face_program_nav {gap: 15px; flex-wrap: wrap; padding: 0 10px} .ulthermage_wrap .sec13 .face_program_nav li {flex: auto; width: 100px;} .ulthermage_wrap .sec13 .face_program_nav li a {font-size: 16px;} } @media(max-width:768px) { .wrap .recommend_sec {padding: 100px 0 !important;} .wrap .recommend_sec>div {flex-direction: column-reverse;} .wrap .recommend_sec>div .txt_box h2 {font-size: 36px !important; font-weight: 500;} .wrap .recommend_sec>div>div {width: 100% !important;} .wrap .recommend_sec .sec08_box .txt_box {text-align: center !important; margin-top: 30px; margin-right: 0 !important;} .wrap .recommend_sec .sec08_box .txt_box p {font-size: 18px !important;} .wrap .recommend_sec .sec08_box .txt_box ul {padding: 0 20px;} .wrap .recommend_sec .sec08_box .txt_box ul li span {font-size: 14px; text-align: left;} .wrap .recommend_sec .txt_box .inqu a {font-size: 18px !important;} .wrap .recommend_sec .txt_bg {display: none;} .volumn_wrap .before_after_sec .sec_tit span {font-size: 18px;} } .policy_sec {padding-top: 200px;} .policy_sec .policy_tabnav {display: flex; justify-content: center; max-width: 1240px; margin: 0 auto;} .policy_sec .policy_tabnav li {width: 50%; text-align: center;} .policy_sec .policy_tabnav li a {padding-bottom: 30px; color: #959595; font-size: 24px; width: 100%;} .policy_sec .policy_tabnav li a.active {border-bottom: 2px solid #222; color: #222; font-weight: 500;} .policy_sec .policy_tabnav li a, .policy a, .footer .m_policy a {font-family: 'Pretendard' !important;} .policy_sec .policy_tabcontent>div {padding-top: 100px;} .policy_sec .policy_tabcontent>div p {line-height: 1.5;} .policy_sec .policy_tabcontent .txt_left {text-align: left;} .policy_sec .policy_tabcontent table {text-align: center; line-height: 1.5;} .policy_sec .policy_tabcontent table th, .policy_sec .policy_tabcontent table td {padding: 15px; border: 1px solid #222222; vertical-align: middle;} .policy_sec .policy_tabcontent>#tab01, .policy_sec .policy_tabcontent>#tab02 {max-width: 1240px; margin: 0 auto;} @media(max-width:768px) { .policy_sec .policy_tabnav {padding: 0 40px; gap: 10px; margin-bottom: 50px;} .policy_sec .policy_tabnav li a {padding-bottom: 10px; font-size: 18px;} .policy_sec .policy_tabcontent table th, .policy_sec .policy_tabcontent table td {padding: 8px;} .policy_sec .policy_tabcontent>#tab01, .policy_sec .policy_tabcontent>#tab02 {padding: 20px;} .policy_sec .policy_tabcontent>#tab01 {font-size: 12px;} .policy_sec .policy_tabcontent>#tab02 {font-size: 10px;} } @media(max-width:768px) { .map_box #map {height: 300px !important;} } @media screen and (max-width: 1024px) { .rnb2 {display: none;} } .quick_coun {background: #817266; position: fixed; right: 0px; bottom: 0; top: 0; z-index: 999; padding: 0 100px; box-sizing: border-box; width: 680px; display: flex; flex-direction: column; justify-content: center; right: -680px;} .quick_coun .btn_close {display: block; width: 29px; position: absolute; top: 50px; right: 100px;} .quick_coun h3 {font-family: 'SangBleuOGSerif-Medium'; font-size: 50px; line-height: 1.7; color: #fff;} .quick_coun p {font-family: 'pretendard', sans-serif; font-size: 18px; line-height: 1.2; color: #fff;} .quick_coun dl {color: #fff; margin: 50px 0;} .quick_coun dt {margin: 10px 0; width: 100px; float: left; font-family: 'pretendard', sans-serif; font-size: 20px; line-height: 46px; color: #fff;} .quick_coun dt span {width: 27px; display: inline-block;} .quick_coun dd {width: 380px; float: left; margin: 10px 0;} .quick_coun input[type="text"], .quick_coun textarea {color: #222; font-size: 20px; padding: 8px; border: 0px solid #606060; line-height: 30px; width: 100%; border-radius: 0px !important; box-sizing: border-box;} .quick_coun input[type="checkbox"] {margin: 0; accent-color: #fff; width: 18px; height: 18px; margin-right: 2px; vertical-align: middle;} .quick_coun input[type="submit"] {font-family: 'pretendard', sans-serif; font-size: 22px; color: #fff; box-sizing: border-box; background: transparent; border: 1px solid #fff; border-radius: 0; line-height: 53px; font-weight: bold; height: 53px; width: 100%; transition: all 0.2s linear;} .quick_coun input[type="submit"]:hover {background: #fff; color: #817266;} .quick_coun input.tel {width: 31.4%;} .quick_coun .agree {padding: 30px 0;} .quick_coun .agree label {position: relative; display: block; font-family: 'pretendard', sans-serif; font-size: 16px; color: #fff; font-weight: 300; line-height: 32px;} .quick_coun .agree label>a {display: inline-block; line-height: 28px; color: #fff; text-decoration: underline;} .quick_coun1 .agree .mobr {display: none;} @media (min-width: 1025px) { #quick-menu {display: none;} .quick_coun1 {display: none;} } @media (max-width: 1024px) { .sr-only {position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;} #quick-menu {display: block; position: fixed; top: 850px; right: 0px; z-index: 99;} #quick-menu .quick-wrap {position: relative;} #quick-menu .quick-wrap>.btn-show {position: absolute; bottom: 50px; right: 0; display: block; width: 49px; height: 49px; cursor: pointer; outline: none; text-align: center; text-decoration: none; border: 0; color: #fff; font-family: 'pretendard', sans-serif; font-size: 35px; font-weight: 200; line-height: 46px; background: rgba(38, 38, 38, 0.7) auto 50% 50% no-repeat; transition: all .3s linear 0s; -webkit-transition: all .3s linear 0s;} #quick-menu .quick-wrap>.btn-show:hover {animation: vibration .5s;} #quick-menu .quick-wrap>.btn-top {position: absolute; bottom: 0; right: 0; display: block; width: 49px; height: 49px; cursor: pointer; outline: none; color: #000; font-size: 11px; font-family: 'pretendard', sans-serif; text-align: center; border: 0; box-sizing: border-box; background-color: #d6d2cf;} #quick-menu .quick-wrap>.btn-top a {color: #000; display: block; padding: 13px 0;} #quick-menu .quick-wrap>.btn-top img {padding-bottom: 3px; width: 9px;} #quick-menu .quick-wrap>ul>li {position: absolute; right: 0; opacity: 0; bottom: 0; transition: all .3s ease-out 0s; -webkit-transition: all .3s ease-out 0s;} #quick-menu .quick-wrap>ul>li:nth-child(2)>a:active, #quick-menu .quick-wrap>ul>li:nth-child(2)>a:focus {background-color: #817266;} #quick-menu .quick-wrap>ul>li>a {display: block; width: 49px; height: 49px; text-align: center; line-height: 46px; font-weight: bold; text-decoration: none; transition: all .15s linear 0s; -webkit-transition: all .15s linear 0s; background: rgba(38, 38, 38, .7) 50% 50% 27px no-repeat;} #quick-menu .quick-wrap>ul>li>a:hover {animation: vibration .5s;} #quick-menu .quick-wrap>ul>li:nth-of-type(1)>a {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_rnb_call.png');} #quick-menu .quick-wrap>ul>li:nth-of-type(2)>a {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_rnb_naver.png');} #quick-menu .quick-wrap>ul>li:nth-of-type(3)>a {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_rnb_kakao.png');} #quick-menu .quick-wrap>ul>li:nth-of-type(4)>a {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_rnb_chat.png');} #quick-menu .quick-wrap>ul>li:nth-of-type(5)>a {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_rnb_blog.png');} #quick-menu .quick-wrap>ul>li:nth-of-type(6)>a {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_rnb_whats.png');} #quick-menu .quick-wrap>ul>li:nth-of-type(7)>a {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_rnb_insta.png');} #quick-menu .quick-wrap>ul>li:nth-of-type(8)>a {background-image: url('https://cheongdamcircle.cafe24.com/web/upload/img/m_rnb_youtube.png');} #quick-menu .quick-wrap .btn-show .more_rnb {display: block;} #quick-menu .quick-wrap .btn-show .done_more_rnb {display: none;} #quick-menu.active .quick-wrap .btn-show {background-image: url('/_files/5XwlmRVOh.png');} #quick-menu.active .quick-wrap .btn-show .more_rnb {display: none;} #quick-menu.active .quick-wrap .btn-show .done_more_rnb {display: block;} #quick-menu.active .quick-wrap>ul>li {opacity: 1;} #quick-menu.active .quick-wrap>ul>li:nth-of-type(1) {bottom: 450px;} #quick-menu.active .quick-wrap>ul>li:nth-of-type(2) {bottom: 400px;} #quick-menu.active .quick-wrap>ul>li:nth-of-type(3) {bottom: 350px;} #quick-menu.active .quick-wrap>ul>li:nth-of-type(4) {bottom: 300px;} #quick-menu.active .quick-wrap>ul>li:nth-of-type(5) {bottom: 250px;} #quick-menu.active .quick-wrap>ul>li:nth-of-type(6) {bottom: 200px;} #quick-menu.active .quick-wrap>ul>li:nth-of-type(7) {bottom: 150px;} #quick-menu.active .quick-wrap>ul>li:nth-of-type(8) {bottom: 100px;} .quick_coun1 {background: #817266; position: fixed; left: 0px; bottom: 0; top: 0; z-index: 999; padding: 0; padding-left: 49px; box-sizing: border-box; width: 100%; margin-left: -48px; display: none;} .quick_coun1 .btn_close {display: block; width: 29px; position: absolute; top: 50px; right: 100px;} .quick_coun1 .coun_wrap {display: flex; flex-direction: column; justify-content: center; height: 100vh; width: 80%; margin: 0 auto;} .quick_coun1 h3 {font-family: 'SangBleuOGSerif-Medium'; font-size: 50px; line-height: 1.7; color: #fff;} .quick_coun1 p {font-family: 'pretendard', sans-serif; font-size: 18px; line-height: 1.2; color: #fff;} .quick_coun1 dl {color: #fff; margin: 50px 0;} .quick_coun1 dt {margin: 10px 0; width: 20%; float: left; font-family: 'pretendard', sans-serif; font-size: 20px; line-height: 46px; color: #fff;} .quick_coun1 dt span {width: 27px; display: inline-block;} .quick_coun1 dd {width: 80%; float: left; margin: 10px 0;} .quick_coun1 input[type="text"], .quick_coun1 textarea {color: #222; font-size: 20px; padding: 8px; border: 0px solid #606060; line-height: 30px; width: 100%; border-radius: 0px !important; box-sizing: border-box;} .quick_coun1 input[type="checkbox"] {margin: 0; accent-color: #fff; width: 18px; height: 18px; margin-right: 2px; vertical-align: middle;} .quick_coun1 input[type="submit"] {font-family: 'pretendard', sans-serif; font-size: 22px; color: #fff; box-sizing: border-box; background: transparent; border: 1px solid #fff; border-radius: 00; line-height: 53px; font-weight: bold; height: 53px; width: 100%; transition: all 0.2s linear;} .quick_coun1 input[type="submit"]:hover {background: #fff; color: #817266;} .quick_coun1 input.tel {width: calc(95% / 3);} .quick_coun1 .agree {padding: 30px 0;} .quick_coun1 .agree label {position: relative; display: block; font-family: 'pretendard', sans-serif; font-size: 16px; color: #fff; font-weight: 300; line-height: 32px;} .quick_coun1 .agree label>a {display: inline-block; line-height: 28px; color: #fff; text-decoration: underline;} } @media (min-width: 768px) { #quick-menu {top: 850px; right: 0px; z-index: 99;} } @media (max-width: 768px) { .quick_coun1 .coun_wrap {width: 90%;} .quick_coun1 input.tel {width: calc(94% / 3);} .quick_coun1 .btn_close {right: 5%;} #header .m_header>.header_inner ul {margin-left: 30px;} .main_wrap .sec01 ul li h3 span {display: inline-block; vertical-align: top;}.common_instagram.sec13 .sec_tit h3, .common_instagram.sec13 .sec_tit h1 {font-size: 40px !important;} .policy_sec {padding-top: 100px;} } @media (max-width: 650px) { #quick-menu {top: 810px;} } @media (max-width: 600px) { .quick_coun1 h3 {font-size: 40px;} .quick_coun1 p {font-size: 16px;} .quick_coun1 input.tel {width: calc(92% / 3);} .quick_coun1 dl {margin: 30px 0;} .quick_coun1 dt {font-size: 18px; width: 21%; line-height: 40px;} .quick_coun1 dd {width: 79%;} .quick_coun1 input[type="text"], .quick_coun1 textarea {font-size: 18px; padding: 5px; line-height: 30px;} .quick_coun1 .agree label {font-size: 15px;} } @media (max-width: 500px) { .quick_coun1 input.tel { width: calc(91% / 3);} .quick_coun1 .coun_wrap {width: 80%;} } @media (max-width: 450px) { #footer .address span {font-size: 12px !important;} #footer .address span .quick_coun1 .agree .mobr { display: block;} } .policy_tabcontent th, .policy_tabcontent td {font-family: 'Pretendard' !important;} .polity_foot {text-align: center; padding: 20px; border: 1px solid #000; border-top: none;} .rnb_line_ico {font-size: 14px !important;} .rnb_what_ico {font-size: 14px !important;} .board_main+.align {flex-direction: column; align-items: center; align-content: center; width: 100%; justify-content: center; padding-top: 200px;} .board_main+.align>div:last-child {max-width: 1500px !important; margin: 0 auto !important; padding: 0 !important; width: 100%;} .board_main+.align .xans-board-list .summary .subject, .board_main+.align .xans-board-list .summary>a>span, .board_main+.align .xans-board-list .summary>a {padding: 15px; color: #222; font-family: 'Pretendard' !important; font-size: 16px;} .board_search_form {display: none;} .board_paging_form {margin: 0 auto;} .qna_write {width: 150px !important; line-height: 32px;} .qna_list_box {display: flex; justify-content: space-between; align-items: center; background-color: #F6F6F6; padding: 10px 0} .qna_list_box span {font-family: 'Pretendard' !important; font-weight: 600; color: #000; font-size: 20px; padding: 15px;} .qna_list_box .qna_item_disc>span {width: 100%; text-align: center;} .qna_list_box .qna_item_title {width: 80%; text-align: center;} .qna_list_box .qna_item_title span {padding-left: 50px;} .qna_item_disc {width: 20%; display: flex} .location .reservation_btns span {color: #fff !important;} .location .reservation_btns img {max-width: 27px;} #footer .address span .empty_wrap {text-align: center; padding-top: 100px;} #footer .address span {font-family: 'Pretendard' !important; font-size: 16px; color: #222; line-height: 1.5; font-weight: 200 !important;} #footer .copyright {font-size: 13px; color: #919090; margin-top: 10px; font-family: 'Pretendard' !important; font-weight: 200 !important; padding: 0 !important;} .footer_logo img {max-width: 130px;} .foot_logo img {max-width: 130px;} .foot_box {display: flex; max-width: 1000px; margin: 0 auto; align-items: center;} .foot_box_inner {text-align: left; margin-left: 40px;} .empty_wrap img {max-width: 700px; width: 100%;} .intro .global_nav .country a:first-child {font-size: 14px !important} .wrap .visual {position: relative;} .xans-board-list li {border-bottom: 1px solid #ccc !important;} .xans-board-list-8 .summary .subject {white-space: wrap !important;} .ytp-chrome-top-buttons, ytp-chrome-controls {display: none !important;} #contents {padding: 0 !important;} #titleArea.qna_top_title h2 {font-size: 72px; font-family: "Marcellus", serif !important; font-weight: 800 !important;} @media(max-width:768px) { #titleArea.qna_top_title h2 {font-size: 36px; text-align: center;} .qna_list_box span {font-size: 16px;} .qna_list_box .qna_item_title {width: 40%;} .qna_item_disc {width: 60%;} .board_main+.align .xans-board-list .summary .subject, .board_main+.align .xans-board-list .summary>a>span, .board_main+.align .xans-board-list .summary>a {font-size: 14px !important;} .board_main+.align {padding-top: 0; padding: 100px 20px; box-sizing: border-box;} .mb_visual_title_s h2 {font-size: 28px; color: #fff !important;} .mb_visual_title_s h5 {color: #fff !important;} #footer .address span {font-size: 14px !important;} #footer .footer-inner>div {text-align: center;} .foot_logo {margin-bottom: 20px} .f-mo {padding: 60px 4% !important;} .m_foot_adress {text-align: center;} }.visual_title h5, .visual_title h2, .visual_title h1 {color: #fff !important;} .location p strong {font-family: 'SangBlueOgSansRegular' !important;} .promotion_board {max-width: 800px; margin: 0 auto;} .promotion_board ul {display: grid !important; table-layout: unset !important; grid-template-columns: repeat(2, 1fr);} .promotion_board ul li, .promotion_board ul .thumbnail a, .promotion_board ul .thumbnail img {width: 100% !important;} .promotion_board ul li {position: relative; border-bottom: none !important;} .promotion_board ul li .summary {position: absolute; left: 50%; bottom: 21px; z-index: 11111; transform: translateX(-50%); white-space: nowrap; padding: 25px 15px; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.7); width: 100%; text-align: center; transition: 0.3s;} .promotion_board ul li .summary a {margin-bottom: 0 !important; font-size: 16px !important; font-family: 'Pretendard' !important;} .promotion_board ul li:hover .summary {padding: 35px 15px; font-weight: 600 !important;} .board_promotion+.xans-board-8+.align-pag {display: block;} .board_promotion+div #titleArea h2 {display: none;} .align-pag {display: block;} .align-pag>div:first-child {margin: 0 auto;} .gallery_title {font-size: 16px; font-family: 'Pretendard' !important;} .gallery_sec_tit h2 {margin-top: 100px; font-family: "Marcellus", serif !important; font-size: 72px; text-align: center;} .gallery_sec_tit h2, .url_img {display: none;} .gallery_sec_tit h2.show, .url_img.show {display: block;} @media(max-width:768px) { .empty_wrap {margin-top: 200px;} .gallery_sec_tit h2 {font-size: 32px;} .promotion_board {padding: 0 20px; box-sizing: border-box;} .promotion_board ul {gap: 0 10px; margin-top: 50px;} .promotion_board ul li .summary {padding: 15px 10px; bottom: 15px;} .promotion_board ul li:hover .summary {padding: 15px 10px;} .xans-board-list-8 .thumbType li {padding: 0;} .xans-board-list-8 .summary .subject {text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 13px !important; line-height: 1.3;} .medical_law span {flex-direction: column; font-size: 12px; line-height: 1.5; gap: 10px; padding: 15px;} .medical_law span img {margin-bottom: 5px; margin-right: 0;} } .np_wrap {font-family: 'Pretendard';} .np_wrap .sec01 {background: url('/assets/img/youlbit/images/sec01_bg.png') no-repeat center; margin-bottom: 100px; max-width: 100%; padding: 0;} .np_wrap .sec01 .skin_sec01_vid {position: relative; display: flex; justify-content: center; max-width: 1240px; margin: 0 auto;} .np_wrap .sec01 .skin_sec01_vid img {width: 100%;} .np_wrap .sec01 .bg_line {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; z-index: -1;} .np_wrap .one_mo_tit {display: flex; flex-direction: column; padding: 200px 90px 0; padding-top: 200px;} .np_wrap .one_mo_tit .mb_img {margin-left: 100px;} .np_wrap .one_mo_tit h1, .np_wrap .one_mo_tit .deco_tit {font-size: 140px; font-family: 'Marcellus'; color: #7f5f3b; opacity: 0.1;} .np_wrap .one_mo_tit h1:last-child, .np_wrap .one_mo_tit .deco_tit:last-child {margin-left: auto; line-height: 0.7;} .np_wrap .np_sec01_txt {text-align: center; margin: 50px 0; line-height: 1.4; font-family: "Noto Serif KR", serif; font-size: 24px; font-weight: 600;} .np_wrap .sign {text-align: center; margin-bottom: 200px;} @media(max-width:1240px) { .np_wrap .sec .sec_tit span {margin: 0 0 50px;} .np_wrap .sec01 {background-image: url('');} .np_wrap .sec01 .sec01_title {padding: 0 80px;} .np_wrap .sec01 .sec01_title h1, .np_wrap .sec01 .sec01_title .deco_tit {font-size: 100px;} .np_wrap .one_mo_tit {padding: 100px 0px 40px 20px;} .np_wrap .one_mo_tit h1, .np_wrap .one_mo_tit .deco_tit {font-size: 46px;} .np_wrap .visual_title h2, .np_wrap .visual_title h1 {font-size: 40px;} .np_wrap .np_sec01_txt {font-size: 20px; padding: 20px;} } @media(max-width:768px) { .txt_line {font-size: 14px; padding: 15px;} .np_wrap .sec01 {padding: 0; margin-bottom: 30px;} .np_wrap .sec01 .sec01_title {padding: 20px;} .np_wrap .sec01 .sec01_title h1, .np_wrap .sec01 .sec01_title .deco_tit {font-size: 60px; line-height: 1.5;} .np_wrap .one_mo_tit .mb_img {margin-left: 50px;} .np_wrap .np_sec01_txt {font-size: 14px; margin-bottom: 30px;} .np_wrap .sign {margin-bottom: 150px;} .np_wrap .sign img {max-width: 150px;} } .np_wrap .sec02 {background-color: #FBF9F6; padding-bottom: 100px;} .np_wrap .sec02 img {width: 100%;} .np_wrap .sec02 .box {display: flex; justify-content: center; padding: 200px 360px; box-sizing: border-box; border-radius: 0px 0px 25% 0px; background: #FFF; box-shadow: 0px 30px 20px 0px rgba(0, 0, 0, 0.15);} .np_wrap .sec02 .box .thumbnail {width: 45%;} .np_wrap .sec02 .box .sec02_content {width: 55%; margin-left: 50px; text-align: left;} .np_wrap .sec02 .box .sec02_content .txt {display: inline-block; position: relative;} .np_wrap .sec02 .box .sec02_content .txt::after {content: ""; position: absolute; top: -60px;right: 0; width: 123px; height: 164px; background: url('/assets/img/youlbit/images/symbol_black.png') cover no-repeat;} .np_wrap .sec02 .box .sec02_content h1, .np_wrap .sec02 .box .sec02_content .deco_tit {font-size: 44px; color: #ab8b46; font-family: "Noto Serif KR", serif; line-height: 1.5; font-weight: 700;} .np_wrap .sec02 .box .sec02_content p {margin-top: 30px; margin-bottom: 50px; font-size: 20px; color: #444; line-height: 1.5; padding-left: 15px; position: relative; font-weight: 500;} .np_wrap .sec02 .box .sec02_content p::after {content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 3px; background-color: #ab8b46;} .np_wrap .sec02 .box .sec02_content .txt_title {margin-top: -10px; margin-left: -50px;} .np_wrap .sec02 .box .sec02_content .txt_title img {max-width: 640px;} .np_wrap .sec02 .m_txt {text-align: center; position: relative;} .np_wrap .sec02 .m_txt::after {content: ""; position: absolute; top: -60px; left: -20px; width: 226px; height: 301px; background: url('/assets/img/youlbit/images/m_symbol_black.png') no-repeat cover;} .np_wrap .sec02 .m_txt h1, .np_wrap .sec02 .m_txt .deco_tit {font-size: 36px; color: #ab8b46; font-family: "Noto Serif KR", serif; line-height: 1.5; font-weight: 700;} .np_wrap .sec02 .m_txt p {margin-top: 30px; margin-bottom: 50px; font-size: 18px; color: #444; line-height: 1.5; padding-left: 10px; position: relative; font-weight: 600;} .np_wrap .sec02 .marquee-container {width: 100%; overflow: hidden; white-space: nowrap; box-sizing: border-box;} .np_wrap .sec02 .marquee {display: inline-block; animation: marquee 90s linear infinite;} .np_wrap .sec02 .marquee img {height: 109px; margin-right: 20px; vertical-align: middle;} @keyframes marquee { 0% {transform: translateX(0);} 100% {transform: translateX(-100%);} } @media(max-width:1240px) { .np_wrap .sec02 .box {padding: 200px 0;} .np_wrap .sec02 .box .sec02_content h1, .np_wrap .sec02 .box .sec02_content .deco_tit {font-size: 36px;} .np_wrap .sec02 .box .sec02_content p {font-size: 16px;} } @media(max-width:768px) { .np_wrap .sec02 .box {border-radius: 0 0 30px; padding: 0; flex-direction: column;} .np_wrap .sec02 .box .sec02_content {margin-left: 0;} .np_wrap .sec02 .box .sec02_content .txt_title img {max-width: 100%; width: 100%;} .np_wrap .sec02 .box .txt_disc {padding: 0 20px 40px;} .np_wrap .sec02 .box .thumbnail {width: 100%; padding: 0 60px; box-sizing: border-box;} .np_wrap .sec02 .box .sec02_content {display: flex; flex-direction: column-reverse; width: 100%;} .np_wrap .sec02 .box .sec02_content .txt {display: none;} .np_wrap .sec02 .box .sec02_content .txt_title {margin: 50px 0; text-align: center;} .np_wrap .sec02 .box .sec02_content .txt_title img {max-width: none; height: 109px; width: 1359px;} .np_wrap .sec02 .m_txt {background-color: #fff;} .np_wrap .sec02 .m_txt::after {top: -20px; width: 150px; height: 217px;} .np_wrap .sec02 .m_txt p {margin-bottom: 0; padding-bottom: 50px; font-size: 14px;} .np_wrap .sec02 .m_txt h1, .np_wrap .sec02 .m_txt .deco_tit {font-size: 24px;} } .np_wrap .sec03 {padding: 200px 0; margin: 0 auto; background-color: #FBF9F6;} .np_wrap .sec03 .vs_booster {display: flex; justify-content: center;} .np_wrap .sec03 .vs_booster img {width: 100%; max-width: 1000px;} .np_wrap .sec04 {background-color: #FBF9F6; max-width: 100%; padding-top: 0;} .np_wrap .sec04 img {width: 100%;} .np_wrap .sec04 p {margin-top: 80px;} .np_wrap .sec04 .thumbnail img {max-width: 1000px;} .np_wrap .sec04 .horizontal_line {padding: 200px 0;} .np_wrap .sec04 .horizontal_line img {max-width: 1240px;} .np_wrap .sec04 .horizontal_line, .np_wrap .sec04 .thumbnail {display: flex; justify-content: center; text-align: center;} @media(max-width:768px) { .np_wrap .sec03 {padding: 150px 0;} .np_wrap .sec04 {padding-bottom: 150px;} } .np_wrap .sec05 {padding: 200px 0; background: url('/assets/img/youlbit/images/np_sec05_bg.webp') no-repeat center; backgroung-size: cover;} .np_wrap .sec05 .sec05_title {text-align: center; color: #fff;} .np_wrap .sec05 .sec05_title .title_img {margin: 30px 0 40px;} .np_wrap .sec05 .sec05_title .title_img img {max-width: 1200px;} .np_wrap .sec05 .sec05_title h5 {font-family: "Noto Serif KR", serif; font-size: 34px;} .np_wrap .sec05 .sec05_title p {font-size: 24px; font-weight: 200; margin-bottom: 10px;} .np_wrap .sec05 .main_img img {max-width: 1000px;} .np_wrap .sec05 .img {max-width: 1200px; margin: 0 auto; display: flex; justify-content: center;} .np_wrap .sec05 .img img {max-width: 1620px;} .np_wrap .sec05 .img, .np_wrap .sec05 .main_img {text-align: center;} .np_wrap .sec05 .img img, .np_wrap .sec05 .main_img img {width: 100%;} .np_wrap .sec05 .disc {color: #fff; max-width: 1200px; margin: 200px auto 0;} .np_wrap .sec05 .disc h3 {font-family: 'SangBlueOgSerifRelgular'; font-size: 44px; text-align: left; color: #fff;} .np_wrap .sec05 .disc h3 small {font-family: 'SangBleuOGSerif-Light'; font-size: 40px;} .np_wrap .sec05 .disc h3 strong {text-decoration: underline 2px; text-underline-offset: 5px; font-family: 'SangBlueOgSerifBold'} .np_wrap .sec05 .disc p {margin: 30px 0 50px; font-size: 20px; line-height: 1.5; font-weight: 200; text-align: left;} .np_wrap .sec05 .skin_booster_slide {max-width: 1200px; margin: 0 auto; margin-top: 100px;} .np_wrap .sec05 .skin_booster_swiper, .np_wrap .sec05 .skin_booster_swiper2 {padding: 0 0 40px;} .np_wrap .sec05 .skin_booster_swiper img, .np_wrap .sec05 .skin_booster_swiper2 img {width: 100%;} .np_wrap .sec05 .swiper-scrollbar-drag {background-color: #EBAE2B;} .swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal {background-color: #EFEFEF; border-radius: 0; opacity: 1 !important; width: 100%;} @media(max-width:768px) { .np_wrap .sec05 {padding: 150px 0;} .np_wrap .sec05 .sec05_title h5 {font-size: 14px;} .np_wrap .sec05 .sec05_title p {font-size: 12px; margin: 25px 0;} .np_wrap .sec05 .sec05_title img {width: 100%;} .np_wrap .sec05 .sec05_title .title_img {margin: 20px 0;} .np_wrap .sec05 .img {padding: 0 20px; margin: 50px 0;} .np_wrap .sec05 .main_img {padding: 0 20px;} .np_wrap .sec05 .disc {padding: 0 20px; box-sizing: border-box; margin-top: 50px;} .np_wrap .sec05 .disc h3 {font-size: 24px; text-align: left;} .np_wrap .sec05 .disc h3 small {font-size: 20px} .np_wrap .sec05 .disc p {font-size: 14px; margin-top: 20px; text-align: left;} .np_wrap .sec05 .skin_booster_slide {margin-top: 0;} .np_wrap .sec05 .skin_booster_swiper, .np_wrap .sec05 .skin_booster_swiper2 {padding: 40px 0; box-sizing: border-box; margin: 0 20px;} .np_wrap .sec05 .swiper-scrollbar {height: 2px;} } .np_wrap .sec06 {background-color: transparent; padding: 200px 20px; box-sizing: border-box;} .np_wrap .sec06 .np_product_tit {margin: 100px 0 50px;} .np_wrap .sec06 .np_product_tit h4 {color: #555555; font-size: 34px; text-align: center; line-height: 1.4;} .np_wrap .sec06 .np_product_tit h4 strong {color: #222; font-weight: 700; font-size: 44px; font-family: "Noto Serif KR", serif;} .np_wrap .sec06 .swiper-wrapper {align-items: baseline;} .np_wrap .sec06 .np_product_slide .swiper-slide {text-align: center;} .np_wrap .sec06 .np_product_slide .swiper-slide div h5 {font-size: 24px; font-weight: 600; margin: 20px 0;} .np_wrap .sec06 .np_product_slide .swiper-slide div p {font-size: 18px; line-height: 1.4;} .np_wrap .sec06 .np_product_slide .swiper-slide img {width: 100%;} .np_wrap .sec06 .np_product_slide .swiper-slide-active {background-color: #FAFAFA; padding: 40px 20px; border-radius: 10px; height: 440px; display: flex; flex-direction: column; justify-content: center;} .np_wrap .sec06 .np_product_slide .swiper-slide-active div h5 {font-size: 30px; font-weight: 600;} .np_wrap .sec06 .np_product_slide .swiper-slide-active div p {font-size: 20px;} .np_wrap .sec06 .np_product_slide .swiper-button-next:after, .np_wrap .sec06 .np_product_slide .swiper-button-prev:after {content: "";} .np_wrap .sec06 .np_product_slide .arrow_box {display: flex; justify-content: center; flex-direction: row-reverse; margin-top: 50px; gap: 50px;} .np_wrap .sec06 .np_product_slide .arrow_box>div {position: unset !important;} @media(max-width:768px) { .np_wrap .sec06 {padding: 150px 20px;} .np_wrap .sec06 .np_product_tit {margin: 30px 0;} .np_wrap .sec06 .np_product_tit h4 {font-size: 18px; text-align: center;} .np_wrap .sec06 .np_product_tit h4 strong {font-size: 24px;} .np_wrap .sec06 .np_product_slide .swiper-slide div h5 {font-size: 20px;} .np_wrap .sec06 .np_product_slide .swiper-slide div p {font-size: 15px;} .np_wrap .sec06 .np_product_slide .swiper-slide-active {background-color: #fafafa; padding: 80px 20px 40px;} .np_wrap .sec06 .np_product_slide .arrow_box {margin-top: 30px; gap:0;} .np_wrap .sec06 .np_product_slide .arrow_box img {width: 60%;} } .np_wrap .sec07 {width: 100%; position: relative; margin-bottom: 200px; padding: 300px 0 0; overflow: hidden;} .np_wrap .sec07 .sec07_tit {padding: 50px 0;} .np_wrap .sec07 .sec07_tit h3 {font-size: 34px; text-align: center; color: #555; line-height: 1.4;} .np_wrap .sec07 .sec07_tit h3 strong {font-family: "Noto Serif KR", serif; color: #222; font-weight: 700; font-size: 44px;} .np_wrap .sec07 .sec07_bg {position: absolute; top: 100px; left: 50px; width: 130%; opacity: 0.3; z-index: -1; animation: rotate_bg 90s infinite alternate forwards;} .np_wrap .sec07 .sec08_box div {display: flex;} .np_wrap .sec07 div img {width: 100%;} @-webkit-keyframes rotate_bg { from {-webkit-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);} to {-webkit-transform: rotate(-360deg); -o-transform: rotate(-360deg); transform: rotate(-360deg);} } @media(max-width:768px) { .np_wrap .sec07 {padding: 100px 0 150px; margin: 0;} .np_wrap .sec07 .sec07_tit {padding: 20px 0 30px;} .np_wrap .sec07 .sec07_tit h3 {font-size: 18px;} .np_wrap .sec07 .sec07_tit h3 strong {font-size: 22px;} .np_wrap .sec07 .sec07_bg {right: -120%; min-width: 800px; top: 30px;} .np_wrap .sec07 .sec08_box div {flex-direction: column;} } .np_wrap .sec08 img {width: 100%;} .np_wrap .sec08 .txt {text-align: center;} .np_wrap .sec08 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; color: #222;} .np_wrap .sec08 .txt span {font-size: 24px; margin: 20px 0 50px; font-weight: 600; font-family: "Noto Serif KR", serif;} .np_wrap .sec08 .medical_law img {max-width: 24px;} @media (max-width: 768px) { .np_wrap .sec08 .txt h3 {font-size: 36px;} .np_wrap .sec08 .txt span {font-size: 18px;} } .np_wrap .sec09 {padding: 200px 0;} .np_wrap .sec09 .txt {max-width: 1240px; margin: 0 auto 20px; text-align: center;} .np_wrap .sec09 .txt h3 {font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; margin-bottom: 10px; color: #222;} .np_wrap .sec09 .txt span {font-size: 24px; margin: 20px 0 30px; font-weight: 500; font-family: "Noto Serif KR", serif;} .np_wrap .sec09 .program_nav {display: flex; gap: 20px; justify-content: center; margin-bottom: 30px;} .np_wrap .sec09 .program_nav li {text-align: center; flex: 1; max-width: 160px;} .np_wrap .sec09 .program_nav li a {font-size: 20px; padding: 10px 0; border: 1px solid #DCCCB2; border-radius: 30px; width: 100%; box-sizing: border-box;} .np_wrap .sec09 .program_nav li a.active {background-color: #DCCCB2; color: #fff; font-weight: 600;} .np_wrap .sec09 .program_contnent img {width: 100%; max-width: 1200px; margin: 0 auto;} @media(max-width:768px) { .np_wrap .sec09 {padding: 150px 0;} .np_wrap .sec09 .txt h3 {font-size: 36px;} .np_wrap .sec09 .txt span {font-size: 18px; margin-bottom: 20px;} .np_wrap .sec09 .program_nav {gap: 10px; padding: 0 20px; flex-wrap:wrap;} .np_wrap .sec09 .program_nav li {max-width: 300px; min-width: 200px;} .np_wrap .sec09 .program_nav li a {font-size: 14px;} } .np_wrap .sec10 {padding-bottom: 200px; margin-top: 200px;} .np_wrap .sec10 .box {display: flex; max-width: 100%; margin: 0 auto;} .np_wrap .sec10 img {width: 100%; vertical-align: bottom;} .np_wrap .sec10 iframe {position: absolute; left: 0; top: 0; width: 100%; height: 100%;} .np_wrap .sec10 .main_sec_tit {text-align: center; margin-bottom: 50px;} .np_wrap .sec10 .main_sec_tit h2 {font-size: 60px; font-family: 'SangBlueOgSerifRelgular' !important;} .np_wrap .sec10 .main_sec_tit h2.mb_img {font-family: "Noto Serif KR", serif !important; font-weight: 600;} .np_wrap .sec10 .main_sec_tit h5 {font-size: 22px; margin-top: 10px; font-family: 'Pretendard' !important; } .np_wrap .sec10 .swiper-container-wrapper {display: flex; gap: 20px; flex-flow: column nowrap; position: relative; width: 100%;} .np_wrap .sec10 .swiper-container {overflow: hidden; width: 100%; margin: 0 auto;} .np_wrap .sec10 .swiper-slide {text-align: center; background: #fff center; background-size: cover; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; } .np_wrap .sec10 .swiper-slide a {width: 100%;} .np_wrap .sec10 .swiper-button-next {left: auto; right: 9%; top: 110%;} .np_wrap .sec10 .swiper-button-prev {left: auto; right: 9%; top: -10%;} .np_wrap .sec10 .swiper-button-next, .swiper-button-prev {color: #000;} .np_wrap .sec10 .swiper-button-next, .main_wrap .sec05 .swiper-button-prev {width: 44px;} .np_wrap .sec10 .swiper-button-next::after, .main_wrap .sec05 .swiper-button-prev::after {content: "";} .np_wrap .sec10 .swiper-button-prev:after, .np_wrap .sec10 .swiper-rtl .swiper-button-next:after {content: "";} .np_wrap .sec10 .gallery-top {position: relative; width: 86%;} .np_wrap .sec10 .gallery-top img {border-radius: 300px 0 0;} .np_wrap .sec10 .gallery-top .swiper-slide {position: relative;} .np_wrap .sec10 .gallery-thumbs {width: 100%; height: 546px; padding-top: 10px;} .np_wrap .sec10 .gallery-thumbs .swiper-wrapper {flex-direction: row;} .np_wrap .sec10 .gallery-thumbs .swiper-slide {overflow: hidden; width: 25%; flex-flow: row nowrap; height: 100%; opacity: 0.75; cursor: pointer;} .np_wrap .sec10 .gallery-thumbs .swiper-slide-thumb-active {opacity: 1;} .thumbs-button-prev img, .thumbs-button-next img {width: auto !important;} .np_wrap .sec10 .swiper-container-wrapper {max-width: 1240px;} .np_wrap .sec10 .youtube_txt {width: 30%; display: flex; flex-direction: column; justify-content: center; align-items: center;} .np_wrap .sec10 .youtube_txt .youtube_txt_box {margin-left: 30px;} .np_wrap .sec10 .youtube_txt h4 {font-family: "Noto Serif KR", serif !important; font-size: 54px; margin: 20px 0 40px; font-weight: 600 !important;} .np_wrap .sec10 .youtube_txt h5 {font-family: "Noto Serif KR", serif !important; font-size: 24px; font-weight: 500 !important; margin-bottom: 20px;} .np_wrap .sec10 .youtube_txt p {font-size: 20px; line-height: 1.5; font-weight: 300 !important;} .np_wrap .sec10 .youtube_txt a {margin: 60px auto 0; max-width: 300px; border: 1px solid #222; padding: 10px 30px; border-radius: 30px; display: flex; align-items: center; justify-content: center; font-family: 'Pretendard' !important; font-weight: 300 !important; } .np_wrap .sec10 .youtube_txt a img {width: 20px; margin-right: 8px;} .np_wrap .sec10 .youtube_txt a strong {font-weight: 700 !important; font-family: 'Pretendard' !important;} .np_sec10_disc {background-color: #fbf8f0; padding: 15px 0; margin: 10px 15px;} .np_sec10_disc span, .np_sec10_disc a { font-size: 12px;} .np_sec10_disc a {background-color: #fff; border: 1px solid #7f7e7a; padding: 6px; margin-left: 5px; font-size: 12px; border-radius: 5px;} span, p {word-break: keep-all;} @media (min-width: 1240px) { .np_wrap .sec10 .swiper-container-wrapper {flex-flow: row nowrap;} .np_wrap .sec10 .swiper-container {min-height: 320px;} .gallery-top {width: 80%; margin-right: 10px;} .np_wrap .sec10 .gallery-top {width: 100%;} .np_wrap .sec10 .gallery-top img {border-radius: 100px 0 0 0;} .np_wrap .sec10 .gallery-thumbs {height: auto; width: 75%;} .np_wrap .sec10 .gallery-thumbs {width: 30%; padding: 0;} .np_wrap .sec10 .gallery-thumbs .swiper-wrapper {flex-direction: column;} .np_wrap .sec10 .gallery-thumbs .swiper-slide {flex-flow: column nowrap; width: 100%;} .np_wrap .sec10 .swiper-container-wrapper {gap: 0;} .np_wrap .sec10 .box {flex-direction: column-reverse;} .np_wrap .sec10 .swiper-button-next {left: auto; right: 3%; top: 80%;} .np_wrap .sec10 .swiper-button-prev {left: 3%; right: auto; top: 80%;} .np_wrap .sec10 .youtube_txt {align-items: flex-start; padding: 10px 20px 20px; box-sizing: border-box; width: 100%;} .np_wrap .sec10 .youtube_txt .youtube_txt_box {margin-left: 30px;} .np_wrap .sec10 .youtube_txt h4 {font-size: 52px; margin: 10px 0 20px;} .np_wrap .sec10 .youtube_txt h5 {font-size: 20px;} .np_wrap .sec10 .youtube_txt p {font-size: 14px;} .np_wrap .sec10 .youtube_txt p br {display: none;} .np_wrap .sec10 .youtube_txt a {margin-top: 25px;} .np_wrap .sec10 .swiper-slide {height: 300px;} } @media(max-width:768px) { .np_wrap .sec10 .main_sec_tit h2 {font-size: 40px;} .np_wrap .sec10 .main_sec_tit h2.mb_img {display: flex !important; align-items: center; justify-content: center;} .np_wrap .sec10 .main_sec_tit h2.mb_img img {max-width: 27px; height: 100%; margin-right: 15px;} .np_wrap .sec10 .main_sec_tit h5 {font-size: 16px; margin-top: 15px;} .np_wrap .sec10 .main_sec_tit span {font-size: 14px;} .np_wrap .sec10 .swiper-button-next, .np_wrap .sec10 .swiper-button-prev {top: 88.5%; width: 30px;} .np_wrap .sec10 .swiper-button-next img, .np_wrap .sec10 .swiper-button-prev img {object-fit: cover; max-height: 87px;} .np_wrap .sec10 .youtube_txt .youtube_txt_box {text-align: center; margin-left: 15px;} .sec_footer .map #map {height: 400px !important;} } @media(max-width:500px) { .np_wrap .sec10 .swiper-button-next img, .np_wrap .sec10 .swiper-button-prev img {max-height: 87px;} } .p-obj{display: block !important;} .m-obj{display: none !important;} @media(max-width:1024px){ .p-obj{display: none !important} .m-obj{display: block !important;} } /* ===== /assets/inc/style6.css ===== */ span,p,section,a,strong,small,div{font-family:"pretendard";} .lounge_wrap .journey_sec{padding: 200px 0;} .lounge_wrap .journey_sec .big_tit h2{font-family: 'Marcellus';font-size:160px; color:#73614f;opacity: 0.1;} .lounge_wrap .journey_sec .big_tit h2:first-child{margin-right:auto; margin-left:0; max-width:1000px; text-align:left;} .lounge_wrap .journey_sec .big_tit h2:last-child{margin-right:0; margin-left:auto; max-width:1000px; margin-top:-50px;text-align:right;} .lounge_wrap .journey_sec .sec_tit{margin-top:-20px;} .lounge_wrap .journey_sec .sec_tit h4{font-size:34px; font-family: "Noto Serif KR", serif; font-weight:600;} .lounge_wrap .journey_sec .sec_tit span{font-size:24px;font-family: 'SangBleuOGSerif-Regular'; color:#666666; margin-top:20px; font-weight: 500;} @media(max-width:768px){ .main{overflow-x: hidden;} .lounge_wrap .journey_sec{padding: 200px 0 150px;} body .instagram-section .instagram-links{bottom:10px !important;} } .sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } @media (max-width: 768px) { .visual_title h1, .visual_title h2 { font-size: 40px; } .conclerge_wrap .visual_title h1, .conclerge_wrap .visual_title h2 { font-size: 28px; } .wrap:not(.main_wrap):not(.conclerge_wrap) .visual_title h1, .wrap:not(.main_wrap):not(.conclerge_wrap) .visual_title h2 { font-size: 40px; } } .doctor_title .doctor_links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; } .doctor_title .doctor_links li { padding: 0; } .doctor_title .doctor_links a { display: inline-block; padding: 7px 18px; border: 1px solid #222; border-radius: 30px; font-family: 'Pretendard' !important; font-size: 14px; font-weight: 400; color: #222; line-height: 1.4; white-space: nowrap; transition: .2s; } .doctor_title .doctor_links a:hover { background: #222; color: #fff; } @media (max-width: 768px) { .doctor_title .doctor_links { gap: 6px; margin-top: 12px; } .doctor_title .doctor_links a { padding: 6px 14px; font-size: 13px; } } .toggle_list .sec_tit a {color: #fff; background-color: #dcccb2; padding: 12px 30px; border-radius: 320px; margin: 10px 0 40px; font-weight: 600; font-size: 20px; display: inline-block;} .toggle_list ul li .faq_tit h5 {font-weight: 600 !important; text-align: start !important; line-height: 1.4;} .toggle_list ul li .faq_contant p strong {font-weight: 600;} .toggle_list ul li .faq_contant p i {font-style: italic;} .t_br {display: block !important;} @media (max-width: 768px) { .toggle_list .sec_tit a {font-size: 16px; margin: 20px 0;} .t_br {display: none !important;} } /* ===== /assets/img/youlbit/swf/css/font.css ===== */ @font-face { font-family: 'SangBlueOgSansBlack'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSans-Black.woff') format('woff'); font-weight: bold; font-style: normal; } @font-face { font-family: 'SangBlueOgSansBold'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSans-Bold.woff') format('woff'); font-weight: bold; font-style: normal; } @font-face { font-family: 'SangBlueOgSansHairline'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSans-Hairline.woff') format('woff'); font-weight: bold; font-style: normal; } @font-face { font-family: 'SangBlueOgSansMedium'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSans-Medium.woff') format('woff'); font-weight: bold; font-style: normal; } @font-face { font-family: 'SangBlueOgSansRegular'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSans-Regular.woff') format('woff'); font-weight: bold; font-style: normal; } @font-face { font-family: 'SangBlueOgSansLight'; src: url('/assets/img/youlbit/swf/font/SangBleuOGSans-Light.woff') format('woff'); font-weight: bold; font-style: normal; } @font-face { font-family: 'SangBlueOgSerifBlack'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-Black.woff') format('woff'); font-weight: 800; font-style: normal; } @font-face { font-family: 'SangBlueOgSerifBold'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-Bold.woff') format('woff'); font-weight: 600; font-style: normal; } @font-face { font-family: 'SangBlueOgSerifMedium'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-Medium.woff') format('woff'); font-weight: 500; font-style: normal; } @font-face { font-family: 'SangBlueOgSerifRelgular'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-Regular.woff') format('woff'); font-weight: 300; font-style: normal; } @font-face { font-family: 'SangBleuOGSerif-Light'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-Light.ttf') format('TrueType'); font-weight: 200; font-style: normal; } @font-face { font-family: 'SangBleuOGSerif-LightItalic'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-LightItalic.ttf') format('TrueType'); font-weight: 200; font-style: normal; } @font-face { font-family: 'SangBleuOGSerif-Regular'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-Regular.ttf') format('TrueType'); font-weight: 400; font-style: normal; } @font-face { font-family: 'SangBleuOGSerif-RegularItalic'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-RegularItalic.ttf') format('TrueType'); font-weight: 400; font-style: normal; } @font-face { font-family: 'SangBleuOGSerif-Medium'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-Medium.ttf') format('TrueType'); font-weight: 500; font-style: normal; } @font-face { font-family: 'SangBleuOGSerif-MediumItalic'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-MediumItalic.ttf') format('TrueType'); font-weight: 500; font-style: normal; } @font-face { font-family: 'SangBleuOGSerif-Bold'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-Bold.ttf') format('TrueType'); font-weight: 600; font-style: normal; } @font-face { font-family: 'SangBleuOGSerif-BoldItalic'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-BoldItalic.ttf') format('TrueType'); font-weight: 600; font-style: normal; } @font-face { font-family: 'SangBleuOGSerif-Black'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-Black.ttf') format('TrueType'); font-weight: 800; font-style: normal; } @font-face { font-family: 'SangBleuOGSerif-BlackItalic'; src: url('/assets/img/youlbit/swf/fonts/SangBleuOGSerif-BlackItalic.ttf') format('TrueType'); font-weight: 800; font-style: normal; } @font-face { font-family: 'SuperiorTitle-Light'; src: url('/assets/img/youlbit/swf/fonts/SuperiorTitleTRIAL-Light.woff') format('woff'); font-weight: 300; font-style: normal; } @font-face { font-family: 'SuperiorTitle-Regular'; src: url('/assets/img/youlbit/swf/fonts/SuperiorTitleTRIAL-LightItalic.woff') format('woff'); font-weight: 300; font-style: normal; } @font-face { font-family: 'SuperiorTitle-Regular'; src: url('/assets/img/youlbit/swf/fonts/SuperiorTitleTRIAL-Regular.woff') format('woff'); font-weight: 400; font-style: normal; } @font-face { font-family: 'SuperiorTitle-RegularItalic'; src: url('/assets/img/youlbit/swf/fonts/SuperiorTitleTRIAL-RegularItalic.woff') format('woff'); font-weight: 400; font-style: normal; } @font-face { font-family: 'SuperiorTitle-Medium'; src: url('/assets/img/youlbit/swf/fonts/SuperiorTitleTRIAL-Medium.woff') format('woff'); font-weight: 500; font-style: normal; } @font-face { font-family: 'SuperiorTitle-MediumItalic'; src: url('/assets/img/youlbit/swf/fonts/SuperiorTitleTRIAL-MediumItalic.woff') format('woff'); font-weight: 500; font-style: normal; } @font-face { font-family: 'SuperiorTitle-Bold'; src: url('/assets/img/youlbit/swf/fonts/SuperiorTitleTRIAL-Bold.woff') format('woff'); font-weight: 200; font-style: normal; } @font-face { font-family: 'SuperiorTitle-BoldItalic'; src: url('/assets/img/youlbit/swf/fonts/SuperiorTitleTRIAL-BoldItalic.woff') format('woff'); font-weight: 200; font-style: normal; } @font-face { font-family: 'SuperiorTitle-Black'; src: url('/assets/img/youlbit/swf/fonts/SuperiorTitleTRIAL-Black.woff') format('woff'); font-weight: 200; font-style: normal; } @font-face { font-family: 'SuperiorTitle-BlackItalic'; src: url('/assets/img/youlbit/swf/fonts/SuperiorTitleTRIAL-BlackItalic.woff') format('woff'); font-weight: 200; font-style: normal; } /* ===== /assets/inc/components.css ===== */ .nav_global { display: flex; align-items: center; } .global_page { position: relative; padding: 6px 12px; background-color: rgba(0, 0, 0, .3); border-radius: 100px; margin-left: 30px; } .global_page .global_btn { display: flex; align-items: center; gap: 10px; cursor: pointer; } .global_page .global_btn>img { width: 24px; } .global_page .global_btn span img { width: 14px; } .global_page ul.global_list { flex-direction: column; align-items: center; gap: 10px; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); margin-top: 10px; overflow: hidden; max-height: 0; transition: max-height 0.3s ease; border-radius: 8px; opacity: 0; padding: 0; transition: max-height 0.3s ease, opacity .5s ease; } .global_page ul.global_list li { padding: 0 !important; } .global_page ul.global_list li a { width: 50px; display: flex; align-items: center; justify-content: space-between; font-size: 14px; font-weight: 500; line-height: 1; } .global_page ul.global_list li a img { width: 24px; margin-bottom: 2px; } .m_global_list { padding: 30px 40px; display: flex; gap: 30px; } .m_global_list li { } .m_global_list li img { max-width: 34px; } .instagram-section { position: relative; padding: 200px 0; } .instagram-section .main_sec_tit { display: flex; justify-content: center; align-items: center; gap: 20px; margin-bottom: 30px; } .instagram-section .main_sec_tit img { transform: scale(0.6); width: auto !important; } .instagram-section .main_sec_tit h2 { font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; text-align: center; margin-top: 7px; } .instagram-section .box { text-align: center; margin: 10px 0 30px; position: relative; padding: 60px 0; } .instagram-section .box::after { content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-style: solid; border-width: 30px 30px 0px 30px; border-color: #fff transparent transparent transparent; display: inline-block; } .instagram-section .box h5 { font-size: 24px; color: #fff; } .instagram-section .double-arrow { margin: 20px 0; } .instagram-section .insta-content img { width: 85%; margin-top: -10px; } .instagram-section .instagram-links { position: absolute; bottom: 10%; left: 20%; text-align: left; } .instagram-section .instagram-links a { font-size: 18px; margin: 5px 0; } .instagram-section .instagram-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; } .instagram-section .instagram-bg img { width: 100%; height: 95%; object-fit: cover; } @media(max-width:1600px) { .instagram-section .instagram-links { left: 5%; transform: translate(0, 0) !important; } } @media(max-width:1240px) { .instagram-section .instagram-links a { font-size: 14px; } } @media(max-width:768px) { .instagram-section { position: relative; padding: 0 0 150px; } .instagram-section .main_sec_tit { gap: 10px; margin-bottom: 40px; } .instagram-section .main_sec_tit img { max-width: 50px; } .instagram-section .main_sec_tit h2 { font-size: 32px; } .instagram-section .box { background-image: url('/assets/img/youlbit/images/m-instagram-main.webp'); background-size: cover; background-repeat: no-repeat; background-position: center; padding: 50px 0 100px; } .instagram-section .box::after { border-width: 20px 20px 0px 20px; } .instagram-section .box h5 { font-size: 18px; line-height: 1.3; } .instagram-section .double-arrow { margin: 10px 0; } .instagram-section .double-arrow img { max-width: 13px; } .instagram-section .insta-content img { max-width: 70%; } .instagram-section .instagram-links { left: 50%; bottom: 20px; text-align: center; transform: translateX(-50%) !important; } .instagram-section .instagram-bg { display: none; } } .youtube-section { margin-bottom: 200px; padding-bottom: 200px; } .youtube-section .main_sec_tit { display: flex; justify-content: center; align-items: center; gap: 20px; margin-bottom: 30px; } .youtube-section .main_sec_tit img { transform: scale(0.6); } .youtube-section .main_sec_tit h2 { font-size: 54px; font-family: 'SangBlueOgSerifRelgular' !important; text-align: center; margin-top: 7px; } .youtube-section .box { position: relative; } .youtube-section .box::after { content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-style: solid; border-width: 30px 30px 0px 30px; border-color: #fff transparent transparent transparent; display: inline-block; } .youtube-section .you_txt { position: absolute; left: 17%; top: 30%; font-family: "Noto Serif KR", serif; color: #fff; } .youtube-section .you_txt h3 { font-size: 44px; font-weight: 500; color: #fff; text-align: left; margin-bottom: 30px; } .youtube-section .you_txt h3 b { font-weight: 700; } .youtube-section .you_txt p { font-family: "Noto Serif KR", serif; text-align: left; font-size: 24px; } .youtube-section .you_disc { position: absolute; bottom: 40px; left: 37%; text-align: left; display: flex; flex-direction: column; } .youtube-section .you_disc h5 { font-size: 24px; font-weight: 300; color: #787878; margin-bottom: 10px; } .youtube-section .you_disc a { font-size: 24px; font-weight: 500; color: #000; position: relative; } .youtube-section .you_disc a::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; } .youtube-section .you_disc .profile-arrow { margin-top: -13px; max-width: 340px; } .youtube-section .you_profile { position: absolute; bottom: -220px; left: 14%; transform: scale(0.8); } .you_txt { z-index: 1; } .youtube-bg { height: 500px; overflow: hidden; z-index: 0; } .youtube-bg img { margin-top: -20px; } .youtube-bg img.pc_img { display: inline-block !important; } @media(max-width:768px) { .youtube-section { margin-bottom: 50px; } .youtube-section .main_sec_tit { gap: 10px; } .youtube-section .main_sec_tit img { max-width: 50px; } .youtube-section .main_sec_tit h2 { font-size: 32px; } .youtube-section .box::after { border-width: 20px 20px 0px 20px; } .youtube-section .you_txt { top: 16%; left: 20px; } .youtube-section .you_txt h3 { font-size: 18px; line-height: 1.3; margin-bottom: 15px; } .youtube-section .you_txt p { font-size: 14px; line-height: 1.3; } .youtube-section .you_disc { left: 20px; transform: translateX(0); bottom: 120px; } .youtube-section .you_disc h5 { font-size: 15px; } .youtube-section .you_disc a { font-size: 17px; } .youtube-section .you_disc .profile-arrow { max-width: 245px; margin-top: -7px; } .youtube-section .you_profile { width: 50% !important; bottom: -100.5px !important; left: 50% !important; transform: translateX(-50%) scale(0.8) !important; } .youtube-section .you_profile img { max-width: 100%; } .youtube-bg { height: 80%; } .youtube-bg img { width: 100%; margin-top: -25px; } .youtube-bg img.pc_img { display: none !important; } .youtube-bg img.mb_img { display: inline-block !important; } }