@charset "utf-8";

/* Guide
----------------------------------------------------------------------------------------------------------------------------------------------------------

▶사이즈
pc : 1200px
mobile : 767px ~
         480px ~ 320px

▶미디어쿼리는 (주석으로 구분 되어있는)파트마다 각각 작성함.

*/


/* Font
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* 본고딕 */
@font-face {
    font-family:'Noto Sans KR';
	font-weight:300;
    src: url('/tpl/webfont/NotoSansKR-Light.eot');
    src: url('/tpl/webfont/NotoSansKR-Light.eot?#iefix') format('embedded-opentype'),
         url('/tpl/webfont/NotoSansKR-Light.woff') format('woff'),
         url('/tpl/webfont/NotoSansKR-Light.ttf') format('truetype');
}
@font-face {
    font-family:'Noto Sans KR';
	font-weight:400;
    src: url('/tpl/webfont/NotoSansKR-Regular.eot');
    src: url('/tpl/webfont/NotoSansKR-Regular.eot?#iefix') format('embedded-opentype'),
         url('/tpl/webfont/NotoSansKR-Regular.woff') format('woff'),
         url('/tpl/webfont/NotoSansKR-Regular.ttf') format('truetype');
}
@font-face {
    font-family:'Noto Sans KR';
	font-weight:500;
    src: url('/tpl/webfont/NotoSansKR-Medium.eot');
    src: url('/tpl/webfont/NotoSansKR-Medium.eot?#iefix') format('embedded-opentype'),
         url('/tpl/webfont/NotoSansKR-Medium.woff') format('woff'),
         url('/tpl/webfont/NotoSansKR-Medium.ttf') format('truetype');  
}
@font-face {
    font-family:'Noto Sans KR';
	font-weight:bold;
    src: url('/tpl/webfont/NotoSansKR-Bold.eot');
    src: url('/tpl/webfont/NotoSansKR-Bold.eot?#iefix') format('embedded-opentype'),
         url('/tpl/webfont/NotoSansKR-Bold.woff') format('woff'),
         url('/tpl/webfont/NotoSansKR-Bold.ttf') format('truetype');
}

/* 출처 : 이 사이트에는 네이버에서 제공한 나눔글꼴이 적용되어 있습니다. */
/* 나눔스퀘어 */
@font-face {
    font-family:'Nanum Square';
    src: url('/tpl/webfont/NanumSquareR.eot');
    src: url('/tpl/webfont/NanumSquareR.eot?#iefix') format('embedded-opentype'),
         url('/tpl/webfont/NanumSquareR.woff') format('woff'),
         url('/tpl/webfont/NanumSquareR.ttf') format('truetype');
}
@font-face {
    font-family:'Nanum Square';
	font-weight:bold;
    src: url('/tpl/webfont/NanumSquareB.eot');
    src: url('/tpl/webfont/NanumSquareB.eot?#iefix') format('embedded-opentype'),
         url('/tpl/webfont/NanumSquareB.woff') format('woff'),
         url('/tpl/webfont/NanumSquareB.ttf') format('truetype');
}

/* 출처 : APACHE 라이센스, 버전 2 */
/* Roboto */
@font-face {
    font-family: 'Roboto';
    font-weight: 300;
    src: local('Roboto-Light'), local('Roboto-Light'),
    src: url('/tpl/webfont/Roboto-Light.eot'),
    src: url('/tpl/webfont/Roboto-Light.eot?#iefix') format('embedded-opentype'),
         url('/tpl/webfont/Roboto-Light.woff') format('woff'),
         url('/tpl/webfont/Roboto-Light.otf') format('opentype');
}

@font-face {
    font-family: 'Roboto';
    font-weight: 500;
    src: local('Roboto-Regular'), local('Roboto-Regular'),
    src: url('/tpl/webfont/Roboto-Regular.eot'),
    src: url('/tpl/webfont/Roboto-Regular.eot?#iefix') format('embedded-opentype'),
         url('/tpl/webfont/Roboto-Regular.woff') format('woff'),
         url('/tpl/webfont/Roboto-Regular.otf') format('opentype');
}

@font-face {
    font-family: 'Roboto';
    font-weight: 700;
    src: local('Roboto-Medium'), local('Roboto-Medium'),
    src: url('/tpl/webfont/Roboto-Medium.eot'),
    src: url('/tpl/webfont/Roboto-Medium.eot?#iefix') format('embedded-opentype'),
         url('/tpl/webfont/Roboto-Medium.woff') format('woff'),
         url('/tpl/webfont/Roboto-Medium.otf') format('opentype');
}

@font-face {
    font-family: 'Roboto';
    font-weight: 900;
    src: local('Roboto-Bold'), local('Roboto-Bold'),
    src: url('/tpl/webfont/Roboto-Bold.eot'),
    src: url('/tpl/webfont/Roboto-Bold.eot?#iefix') format('embedded-opentype'),
         url('/tpl/webfont/Roboto-Bold.woff') format('woff'),
         url('/tpl/webfont/Roboto-Bold.otf') format('opentype');
}


/* Reset
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button{margin:0; padding:0; font-family:"Noto Sans KR", sans-serif;}
dl,ul,ol,menu,li {list-style:none;}
body{font-family:"Noto Sans KR", sans-serif; font-size:15px; font-weight:400; color:#555;}
*, *:before, *:after{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
:focus{outline:0 !important;}
iframe{border:none; width:100%;}
a{font-family:"Noto Sans KR", sans-serif; color:inherit; -webkit-transition:all .2s ease-out; -moz-transition:all .2s ease-out; transition:all .2s ease-out; color:#555;}
a:hover, a:active{text-decoration:none; color:#1766b6;}
img{max-width:100%;}
textarea{max-width:100%; resize:none;}
.mt30 {margin-top:30px;}

@media only screen and (min-width: 320px){
	body{min-width:320px; overflow-x:hidden;}
}

.hidden{margin:0; padding:0; font-size:0; line-height:0; text-indent:-9999em; overflow:hidden;}
#divWMSSLLoading {display:none;}

/* Parallax
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.parallax{background-position:0 0; background-repeat:no-repeat; background-size:100% auto; width:100%; background-size:cover; background-attachment:fixed;}


/* Preloader
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.animationload{position: fixed; top:0; left:0; right:0; bottom:0; background-color:#fff; z-index:999999;}
.loader {width:200px; height:200px; font-size: 24px; text-align: center; position:absolute; left:50%; top:50%; background-image:url(/images/basic_resp/img/preloader.gif); background-repeat:no-repeat; background-position:center; margin:-100px 0 0 -100px;}


/* Back to top (탑 버튼)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.back-to-top{width:40px; height:40px; position:fixed; bottom:10px; right:20px; display:none; text-align: center; z-index: 10000; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius:50%; background:#1b1b1b;}
.back-to-top i{color: #fff; font-size: 15px; display: block; line-height: 33px;}


/* Layoyt (레이아웃)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#wrapper{position:relative; }

#header{z-index:10000; position:fixed; top:0; left:0; width:100%; box-sizing:border-box; height:80px; background:none; transition:all .2s ease-out;}
#header.header-bg{background:#222; box-shadow:2px 3px 15px rgba(0,0,0,0.2);}
.header-area{padding:0 20px; margin:0 auto; width:90%; box-sizing:border-box;}

#L_SITE_LOGO{float:left;}
#L_SITE_LOGO h1{margin:0;}
#L_SITE_LOGO a{line-height:70px;}
#L_SITE_LOGO img{vertical-align:middle;}

@media only screen and (max-width:1590px) {
/* #header{height:auto; */}
}

@media only screen and (max-width: 1200px){
	#wrapper{min-width:320px;}
	.header-area{position:relative; padding:0; height:65px; width:100%;}
}



@media only screen and (max-width: 1024px){
	#header {height:auto;}
	#wrapper {min-width:auto;}
	.header-area{position:relative; padding:0; height:65px; width:100%;}

	#L_SITE_LOGO{padding: 0 25px;}
	#L_SITE_LOGO a{display:block; line-height:60px;}
	#L_SITE_LOGO img{width:200px;}
}

@media only screen and (max-width: 767px){
	.header-area{height:50px;}

	#L_SITE_LOGO{padding: 0 20px;}
	#L_SITE_LOGO a{line-height:45px;}
	#L_SITE_LOGO img{width:160px;}
}


/* Navigation (상단 메뉴)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#gnb{z-index:999;}

.navigation .menu-item > a{display:inline-block;letter-spacing:-1px; font-size:18px; text-decoration:none; color:#fff;}
.navigation .menu-item.on > a{color:#ff6ebd;}
/*.navigation .menu-item > a:hover, .navigation .menu-item > a:active, .navigation .menu-item > a:focus{text-decoration:none; color:#53e7e1;}*/
.navigation .menu-item > a:hover {text-decoration:none; color:#ff6ebd;}

@media only screen and (min-width: 1280px){
	
	#menuArea{float:right;}

/* #gnb{display:block !important;}*/

	.navigation{margin:28px 0 0;}
	.navigation:after{content:""; display:block; clear:both;}
	.navigation .menu-item{position:relative; float:left; font-size:14px;}
	.navigation .menu-item:before{display:inline-block; margin:0 15px; content:" "; color:#fff;}
	.navigation .menu-item:first-child:before{display:none;}
	.navigation .menu-item > a{letter-spacing:0.2px;}
}

@media only screen and (max-width: 1280px){
	#gnb{display:none; width:100%; height:auto; box-sizing:border-box; background:#000; opacity: 0.8;}
	#gnb {position: absolute; top:65px; border-bottom: 1px solid #ddd; }
	#gnb .navigation .menu-item:last-child a { border-bottom: 0; }

	#menuArea{width:100%; height:100%;}
	#menuArea.open {background: #000;}
	nav [data-type='menu-btn'] {z-index:1000; position:absolute; right:25px; top:calc(50% - 12px); width:24px; height:24px; border-radius:5px; cursor:pointer; transition:.4s all linear;}
	nav [data-type='menu-btn'] span {display:block; position:absolute; left:1px; width:22px; height:3px;  transition:.3s all linear; background:#fff;}
	nav [data-type='menu-btn'] span:nth-child(1) {top:4px; transform: rotate(0deg);}
	nav [data-type='menu-btn'] span:nth-child(2),
	nav [data-type='menu-btn'] span:nth-child(3) {top:11px; transform: rotate(0deg);}
	nav [data-type='menu-btn'] span:nth-child(4) {top:18px;}
	nav.open [data-type='menu-btn'] span:nth-child(1) {left:50%; width:0;}
	nav.open [data-type='menu-btn'] span:nth-child(2) {transform: rotate(45deg);}
	nav.open [data-type='menu-btn'] span:nth-child(3) {transform: rotate(-45deg);}
	nav.open [data-type='menu-btn'] span:nth-child(4) {left:50%; width:0;}

	.navigation .menu-item > a{padding:0 25px; text-align:center; width:100%; line-height:40px; font-size:15px; transition:none; border-bottom:1px solid #555; color:#fff;}
	.navigation .menu-item:first-child > a{border-top:1px solid #555;}
	.navigation .menu-item.on > a{color:#fff;}
}

@media only screen and (max-width: 768px){
	#gnb {top:50px;}
	#btnMenuOpen{right:20px;}
	nav [data-type='menu-btn']{right:20px;}
	.navigation .menu-item > a{padding:0 20px;}
}


/* Button (공통 버튼)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.btn{font-family:"Malgun Gothic", sans-serif; text-transform:uppercase; border-radius:0; line-height:24px;}
.btn:focus, .btn:active{outline:none; color:#fff;}

.btn-custom{border-radius:3px; padding:0.8em 1.8em; -webkit-transition:all .2s ease-out; -moz-transition:all .2s ease-out; transition:all .2s ease-out; text-transform:uppercase; background-color:#003aaf; border-color: #003aaf; color:#fff;}
.btn-custom:hover, .btn-custom:focus{background-color: #00208e; border-color: #00208e; color:#fff;}

.btn-custom-outline{border-radius:3px; padding:0.8em 1.8em; color:#fff; -webkit-transition:all .2s ease-out; transition:all .2s ease-out; text-transform:uppercase; background-color:transparent; border-color:#fff;}
.btn-custom-outline:hover, .btn-custom-outline:focus{color:#fff; background-color:rgba(255,255,255,.5);}
.btn-bar a{margin-right:10px;}

.form-control{box-shadow:none; -webkit-box-shadow:none; border-radius:3px; height:38px;}
.form-control:focus{outline:none; box-shadow:none; -webkit-box-shadow:none; border-color: #003aaf;}



/* Footer (하단메시지)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#footer{padding:40px 0px; width:100%;}
#footer {position:absolute; bottom:0px; min-height:130px; background: #1f1f1f;}
.footer-area{margin:0 auto;  width:90%; box-sizing:border-box;}
.footer-area:after{content:""; display:block; clear:both;}
.foot-logo{border-bottom: solid 1px #363636; padding-bottom:10px;  margin-bottom: 15px; box-sizing:border-box;}
.footer-menu{display: inline-block;  float: right;}
.footer-menu li{display:inline-block; margin-left:20px;	padding-left:20px; line-height:10px; border-left:1px solid #5d5d5d;}
.footer-menu li:first-child{margin-left:0; padding-left:0; border-left:0;}
.footer-menu li a{line-height:10px; font-weight:400; font-size:14px; color:#555;}
.footer-menu li.privacy a{color:#b8b8b8;}

.footer-info {color:#a5a5a5;}
.footer-info p:nth-of-type(1){margin-bottom:10px;}
.footer-info span{color:#5d5d5d;}

@media only screen and (max-width:1280px) {
	.footer-area{width:100%; padding: 0 30px;}
}
@media only screen and (max-width:980px) {
	.footer-area{padding:0 25px;}
}
@media only screen and (max-width:768px) {
	.footer-area{padding:0 20px;}
	.foot-logo{float:none; padding:0; margin:0 auto 20px;}
	.footer-info{float:none; width:100%; text-align:left;}
	.footer-menu {display: block;   float: none;  margin: 20px 0;}
	.footer-menu li{margin-left:5px; padding-left:5px; letter-spacing:-1px;}
	.footer-menu li a{font-size:12px;}
	.footer-info,.footer-info a{font-size:12px;}
	.footer-info p:nth-of-type(1){margin-bottom:5px;}
	.foot-logo > img {width:140px;}
}


/* fullPage 
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#fullpage > .section > .intro {height:100vh;}
#fullpage {position:relative;top:0px;z-index:9;width:100%;height:100%;}
.section{width:100%;height:100%;position:relative; }

.quick {position:fixed;right:20px;top:52%;transform:translateY(-50%); z-index:100000}
.quick ul{position:relative;}
/* .quick ul:before{content:''; display:block; width:1px; height:170px; background:#d3d3d3; position: absolute; left: 50%; top: 11px; z-index:-1} */
.quick li {position:relative; /*margin-bottom:22px; */ margin:20px auto; border-radius:35px; width:6px; height:6px; background:#ccc; /*opacity: 0.5;*/ cursor:pointer;}
.quick li:last-child{margin-bottom:0;}

.quick li.on{background:transparent;border: solid 4px #ff4fae;width: 16px; height: 16px; /*opacity: 1;*/}
/* .quick li.on:before{position: absolute; top:-8px; display: inline-block; padding-left:15px; height:30px; border-radius:100px; background:#ffb300; z-index:-1; line-height:30px;  color:#fff; opacity: 1; font-family: Roboto; font-weight:500; font-size:15px;}*/
.quick li.on:before{color:#ff4fae; }
.quick li:before{position: absolute; top:-10px; display: inline-block; padding-left:15px; height:30px; border-radius:100px;  z-index:-1; line-height:30px;  color:#ccc; /*opacity: 0.7; font-family: Roboto;*/ font-weight:500; font-size:15px; }
.quick li:nth-child(1):before{content: 'HOME';    width:90px; left:-75px;}
.quick li:nth-child(2):before{content: '예쁜 V-line 스토리';    width:140px; left:-148px;}
.quick li:nth-child(3):before{content: 'V-line 동안 성형 수술';    width:150px; left:-165px;}
.quick li:nth-child(4):before{content: 'V-line 동안 클리닉';    width:140px; left:-148px;}
.quick li:nth-child(5):before{content: 'V-line 오시는 길';  width:130px; left:-135px;}




/* IE10+ */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.quick li:nth-child(1):before{line-height:31px;}
	.quick li:nth-child(1).on:before{line-height:31px;}
	.quick li.on:before{line-height:35px;}
	.quick li:before{line-height:35px;}
}

@media only screen and (max-width:1600px) {
	.quick li:before {display:none;}
	.quick li{width: 10px; height: 10px; }

}

@media only screen and (max-width:980px) {
	.quick {display:none;}
}




/* Main Contents (메인 컨텐츠)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#mainContents{z-index:88;}

.section .intro {color:#fff; font-family: 'Roboto' , 'Noto Sans KR'; }
.section .intro {display:table; width: 1280px; margin: 0 auto; text-align: center}
.section .intro .conf {display: table-cell; vertical-align: middle;}
.section .intro h2 {font-size: 46px;  font-weight: 700; letter-spacing:-1px; word-break:keep-all;}
.section .intro h4 {font-size: 24px;  font-weight: 500; line-height:1.5; letter-spacing:-1px; word-break:keep-all;}

@media only screen and (max-width:1360px) {
	.section .intro .conf{padding:0 50px 0 30px;}
}
@media only screen and (max-width:1280px) {
	.section .intro {width:100%; margin: 0; }
}
@media only screen and (max-width:1200px) {
	.section .intro {margin: 0 auto; }
}
@media only screen and (max-width:980px) {
	.section .intro .conf {padding:60px 30px;}	
	.section .intro h2 {font-size: 32px; }
	.section .intro h4 {font-size:20px;}
}

@media only screen and (max-width:768px) {
	.section .intro .conf {padding:60px 20px;}	
}
@media only screen and (max-width:620px) {
	.section .intro h2 {font-size: 24px;}
	.section .intro h4 {font-size:19px;}
}



/* Main Visual */
#section-1 {background:url('/images/kor01-24-0463/main_visual_bg.jpg') no-repeat top center/cover}
#section-1 .slogan{text-align:center; position:relative; top:32%;}
#section-1 {background:url('/images/kor01-24-0463/main_visual_bg.jpg') no-repeat top center/cover}
#section-1 .intro {overflow:hidden}
#section-1 .main-visual{position:relative; height:100vh }
#section-1 .main-visual .slogan{text-align:center; display:block; padding:7% 0; width:720px; margin:0 auto; position:relative; top:20%; background:#3f4fd6; border:12px solid #fff;}
#section-1 .slogan h1 { font-size:70px; font-weight: 900; letter-spacing: -1px;  color:#fff; word-break:keep-all;}
#section-1 .slogan p{font-size: 32px; font-weight: 400; color:#fff; letter-spacing: -1px; margin-bottom:15px; line-height:1.5; word-break:keep-all; }
#section-1 .slogan p span{ position:relative; z-index:1;}
#section-1 .slogan p span:after {content:''; display:inline-block; position:absolute; bottom:3px; left:0; width:100%; height:20px; z-index:-1; background:#f26db5;}

#section-1 .main-visual .main-img01{position:absolute; height:100vh; left:20%; top:60%; width:100%; background:url('/images/kor01-24-0463/main_circle.png') no-repeat left top}
#section-1 .main-visual .main-img02{position:absolute; height:100vh; right:0; top:40%; width:100%; background:url('/images/kor01-24-0463/main_obj.png') no-repeat right top}

@media only screen and (max-width:1024px) {
	#section-1 .main-visual .main-img01{left:12%;}
	#section-1 .main-visual .main-img02{top:45%;}
}

@media only screen and (max-width:980px) {
	#section-1 .main-visual .main-img01{left:5%; top:51%}
	#section-1 .main-visual .main-img02{right:-10%;}
}

@media only screen and (max-width:768px) {
	#section-1 .main-visual .main-img01{left:6%; top:52%}
	#section-1 .main-visual .main-img02{right:-16%;}
	#section-1 .main-visual .slogan{width:560px;  top:20%;}
	#section-1 .slogan h1 { font-size:52px; }
	#section-1 .slogan p{font-size: 25px; margin-bottom:15px; }
	#section-1 .slogan p span:after {height:15px;}
}

@media only screen and (min-width:641px) {
	#section-1 .slogan p br{display:none;}
}

@media only screen and (max-width:640px) {
	#section-1 .main-visual .main-img01{left:15%; top:45%; background-size:40%; }
	#section-1 .main-visual .main-img02{right:-3%; background-size:340px; }
	#section-1 .main-visual .slogan{width:320px; top:17%; border:7px solid #fff;}
	#section-1 .slogan h1 { font-size:30px; }
	#section-1 .slogan p{font-size: 20px;}
	#section-1 .slogan p span:after {height:15px;}
}

@media only screen and (max-width:480px) {
	#section-1 .main-visual .slogan{top:15%;}
	#section-1 .main-visual .main-img01{left:5%; top:43%;}
	#section-1 .main-visual .main-img02{right:-13%; background-size:280px; background-position:right bottom 90%}
	#section-1 .main-visual .slogan{width:280px; top:15%; border:4px solid #fff;}
	#section-1 .slogan h1 { font-size:26px; }
	#section-1 .slogan p{font-size: 18px; margin-bottom:10px; }
	#section-1 .slogan p span:after {height:10px;}
}



/* 예쁜 V-line  스토리 */
#section-2 {background:url('/images/kor01-24-0463/sect02_bg.png') no-repeat right bottom 50px}
#section-2 .cont-inner{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center}
#section-2 .cont-inner .img-box{width:50%;}
#section-2 .cont-inner .txt-box{width:45%; text-align:right;}

#section-2 .cont-inner .txt-box h2 {margin-bottom:90px;  word-break: keep-all; color:#333; }
#section-2 .cont-inner .txt-box h2 span {position: relative; width:100%;}
#section-2 .cont-inner .txt-box h2 span:after{content:''; display:inline-block; width:1px; height:50px; background:#333; position:absolute; top:80px; left: 50%;}

#section-2 .cont-inner .txt-box p {font-size: 20px; line-height: 1.5; margin-top:30px; word-break: keep-all; color:#666; letter-spacing:-1px; color:#454545}
#section-2 .intro p.big-tit {font-size:30px;}
#section-2 .cont-inner .txt-box p strong{font-weight:600;}
#section-2 .cont-inner .txt-box .t-block{display:block;}


@media only screen and (max-width:1024px) {
	#section-2 .cont-inner .txt-box .t-block{display:none;}
	#section-2 .cont-inner .img-box{width:48%;}
	#section-2 .cont-inner .txt-box{width:50%;}
	
}


@media only screen and (max-width:980px) {
	#section-2 {background-size:60%; background-position:right bottom}
	#section-2 .cont-inner .img-box{width:100%; text-align:center; margin-bottom:50px;}
	#section-2 .cont-inner .txt-box{width:100%; text-align:center;}
	#section-2 .cont-inner .txt-box h2 span:after{display:none;}
	#section-2 .cont-inner .txt-box h2 {margin-bottom:10px;}
	#section-2 .cont-inner .img-box img{width:60%;}
}

@media only screen and (max-width:620px) {
	#section-2 .cont-inner{padding:0 15px;}
	#section-2 .cont-inner .img-box{margin-bottom:50px;}
	#section-2 .cont-inner .img-box img{width:80%;}
	#section-2 .cont-inner .txt-box p {font-size: 17px; line-height: 1.4; margin-top:20px;}
	#section-2 .intro p.big-tit {font-size:18px;}
}


/* V-line 동안 성형 수술  */
#section-3 {background:url('/images/kor01-24-0463/section3_bg.jpg') no-repeat left 20% center/cover}
#section-3 h4{margin:30px 0 10px 0}
#section-3 p{font-size:18px; color:#fff; word-break:keep-all; line-height:1.5; letter-spacing:-1px;}

#section-3 .cont-inner{display:flex; flex-wrap:wrap; justify-content:space-between; margin-top:60px;}
#section-3 .cont-inner > div{width:21%; margin:0 2%; margin-bottom:30px; border:2px solid #ff62b3; text-align:center; padding:40px 30px;}
#section-3 .cont-inner > div h5{font-size:22px; color:#fff; padding-bottom:20px;}

@media only screen and (max-width:1360px) {
	#section-3 .cont-inner > div{width:24%; margin:0 0.5%; margin-bottom:15px; }
}

@media only screen and (max-width:1024px) {
	#section-3 .cont-inner > div{padding:30px 10px;}
}

@media only screen and (max-width:980px) {
	#section-3 p{font-size:16px; }
	#section-3 .cont-inner > div h5{font-size:18px; padding-bottom:10px;}
}

@media only screen and (min-width:769px) {
	#section-3 .cont-inner > div:nth-child(2),
	#section-3 .cont-inner > div:nth-child(4){border:2px solid #bb44ff;}
	#section-3 .cont-inner > div:nth-child(5),
	#section-3 .cont-inner > div:nth-child(7){border:2px solid #bb44ff;}
}

@media only screen and (max-width:768px) {
	#section-3 h4{margin:20px 0 10px 0}
	#section-3 .cont-inner{margin-top:30px;}
	#section-3 .cont-inner > div{width:calc((100% - 20px)/2);margin-bottom: 20px;  }
	#section-3 .cont-inner > div:nth-child(2),
	#section-3 .cont-inner > div:nth-child(3),
	#section-3 .cont-inner > div:nth-child(6),
	#section-3 .cont-inner > div:nth-child(7){border:2px solid #bb44ff;}
}

@media only screen and (max-width:480px) {
	#section-3 .cont-inner > div{width:calc((100% - 10px)/2);margin-bottom:10px; padding:25px 10px; }
	#section-3 .cont-inner > div h5{font-size:17px; padding-bottom:10px;}
	#section-3 p{font-size:15px; }
}


/* V-line 동안 클리닉 */
#section-4 {}
#section-4 h2{color:#333; padding-top:40px;}
#section-4 p{font-size:18px; line-height:1.5; color:#666; word-break:keep-all;}
#section-4 .round-title{margin:45px 0 20px 0; position:relative; text-align:center;}
#section-4 .round-title:before{position:absolute; content:""; width:100%; height:1px; top:25px; left:0; background:#f794ca;}
#section-4 .round-title span{width:174px; position:relative; display:inline-block; line-height:50px; text-align:center; font-size:22px; font-weight:500; color:#fff; letter-spacing:-1px; background:#f794ca; border-radius:50px; z-index:1}

#section-4 .clinic-box{display:flex; flex-wrap:wrap; justify-content:space-between; }
#section-4 .clinic-box > li{width:21%; margin:0 2%; text-align:center;}
#section-4 .clinic-box .circle{display:table; width:140px; height:140px; border-radius:100%; background:#fdf0f7; margin:0 auto 10px; }
#section-4 .clinic-box .circle p.c-title{display:table-cell; vertical-align:middle; font-size:20px; color:#ee74b6; font-weight:500; letter-spacing:-1px; line-height:1.3;}
#section-4 .clinic-box .circle p.c-title span{font-size:16px;}

#section-4 .round-title.bg02:before{background:#8c96ec;}
#section-4 .round-title.bg02 span{background:#8c96ec;}
#section-4 .clinic-box.col03 > li{width:31.33%; margin:0 1%; }
#section-4 .clinic-box.col03 .circle{background:#edeefe;}
#section-4 .clinic-box.col03 .circle p.c-title{color:#7984dd;}

@media only screen and (min-width:641px) {
	/*#section-4 .intro{margin-left:33.33%;}*/
	#section-4.section .intro .conf{padding:0;}
	#section-4 .intro{width:65%; padding:0 5%}
	#section-4 .sect04-bg{float:left; width:35%; height:100vh; background:url('/images/kor01-24-0463/section4_bg.jpg') no-repeat right 30% center/cover}
}

@media only screen and (min-width:861px) {
	#section-4 .intro{width:75%;}
	#section-4 .sect04-bg{width:25%;}
}

@media only screen and (min-width:981px) {
	#section-4 .intro{width:70%;}
	#section-4 .sect04-bg{width:30%;}
}

@media only screen and (min-width:1601px) {
	#section-4 .intro{padding:0 15% 0 5%}
}


@media only screen and (max-width:860px) {
	#section-4 h2{padding-top:0}
	#section-4 p{font-size:15px; }
	#section-4 .clinic-box .circle{width:120px; height:120px;}
	#section-4 .clinic-box .circle p.c-title{font-size:17px;}
	#section-4 .clinic-box .circle p.c-title span{font-size:14px;}
	#section-4 .round-title{margin:30px 0 15px 0;}
	#section-4 .round-title span{width:130px; line-height:40px; font-size:18px;}
	#section-4 .round-title:before{top:20px;}
	#section-4 .clinic-box > li{width:calc((100% - 20px)/2); margin:0 0 20px;}
}

@media only screen and (max-width:640px) {
	#section-4 .clinic-box > li{width:calc((100% - 20px)/2); margin:0 0 20px;}
	/*#section-4 .clinic-box.col03 .circle{width:100px; height:100px;}*/
	#section-4 .clinic-box.col03 > li{width:calc((100% - 10px)/2); margin:0 0 20px;}
	#section-4 .sect04-bg-mo{width:100%; height:240px; margin-bottom:30px; background:url('/images/kor01-24-0463/section4_bg02.jpg') no-repeat center center/cover}
}


/* 오시는 길 */
#section-5 {background:url('/images/kor01-24-0463/section5_bg.jpg') no-repeat top center/cover}
#section-5 h2{margin-bottom:50px;}
#section-5 .sect05-inner{display:table; width:100%; margin-top:30px;}

#section-5 .map-info{width:50%; display:table-cell; vertical-align:top; padding:50px 80px 0 0; text-align:left;}
#section-5 .map-cont{width:50%; display:table-cell;}
#section-5 .map-info li{position:relative; padding-left:35px; font-size:19px; line-height:1.6; word-break:keep-all; margin-bottom:15px;}
#section-5 .map-info li i{position:absolute; left:0; top:3px; width:30px; text-align:center; color:#ff62b7;}
#section-5 .map-info li:nth-child(1) i{font-size:24px; }
#section-5 .map-info li:nth-child(2) i{font-size:24px; }
#section-5 .map-info li:nth-child(3) i{font-size:20px; }

@media only screen and (max-width: 768px){
	#section-5 .map-info{padding:30px 30px 0 0;}
	#section-5 h2{margin-bottom:20px;}
	#section-5 .map-info li{padding-left:25px; font-size:16px; margin-bottom:10px;}
	#section-5 .map-info li i{top:4px; width:20px;}
	#section-5 .map-info li:nth-child(1) i{font-size:20px; }
	#section-5 .map-info li:nth-child(2) i{font-size:20px; }
	#section-5 .map-info li:nth-child(3) i{font-size:18px; }
}

@media only screen and (max-width: 640px){
	#section-5 .sect05-inner{margin-top:0;}
	#section-5 .map-info{width:100%; display:block; padding:0 0 20px 0;}
	#section-5 .map-cont{width:100%; display:block;}
	#section-5 .map-cont .wrap_map{height:260px !important;}
}