/********************************** main **********************************/
.main .inner{max-width:1500px; } 
.main-tit {margin-bottom:40px; } 
.main-tit h2{font-size:50px; color:#111;     display: inline-block; position:relative; line-height:1.2; margin:15px 0 15px; }
.main-tit p{font-size:18px; font-weight:300;}
.main-tit b{color:#258bc4; font-size:1.1em; vertical-align:baseline; line-height:1.2;}



/* fullpage */
.fp-section .fp-tableCell{padding-top:100px;} 
.fp-section#section1 .fp-tableCell{padding-top:0;} 
.fp-section#section12 .fp-tableCell{padding-top:0;} 
.fp-section#section9{background:#f4f6f7;}
.fp-section#section10{background:url('../../images/broad_bg.png') no-repeat left bottom ;}
.fp-section#section11{background:#f4f6f7;}




/* visual */
.main-visual .swiper-slide:after{content:''; width:100%; height:100%; background:rgba(0,0,0,0.1); position:absolute; left:0; top:0; z-index:-1;}
.main-visual .swiper-container{height:100vh;}
.main-visual .swiper-slide{position:Relative;  background-repeat:no-repeat; background-position:center center; background-size:cover;}
.main-visual .swiper-slide a{display:block; width:100%; height:100%;}
.main-visual .bg01{background-image:url('../../images/main_visual01.jpg')}
.main-visual .bg02{background-image:url('../../images/main_visual02.html') }
.main-visual .bg03{background-image:url('../../images/main_visual03.html') }
.main-visual .main-tit{ padding-top:30vh; position:absolute; top:0; left:0; z-index: 99; width:100%;}
.main-visual .main-tit h2{font-size:60px; color:#fff; margin-bottom:20px;}
.main-visual .main-tit p{font-size:22px; font-weight:500; color:#fff; opacity:.6;}  

.main-visual .control{color:#fff; font-size:16px;  position: relative;bottom: 30vh;width: 90%;max-width: 1500px;margin: 0 auto;display:flex; align-items:center;text-align: left; z-index:2;}  
.main-visual .control > * {display:inline-block;}
.main-visual .control .bar {display:none; position:relative; width:120px; height:2px; background:rgba(255,255,255,0.3); overflow:hidden; margin-left:1rem; vertical-align:middle; margin-top:-2px;}
.main-visual .control .bar .active_bar {display:inline-block; position:absolute; top:0; left:0; width:0%; height:100%; background:#fff;}
.main-visual .control .bar .active_bar.on {animation: barOn 15s linear forwards; animation-play-state: running;} 
@keyframes barOn{
    from{
        width:0;
    }

    to{
        width:100%;
    }
}
.main-visual .mvisual_pagination .swiper-pagination-bullet {background:none; border:none; width:auto; height:auto; color: #fff; font-size:15px; font-weight:400; opacity:0.8; margin-right:1rem;}
.main-visual .mvisual_pagination .swiper-pagination-bullet-active {background:none; border:none; opacity:1;}
.main-visual .mvisual_pagination .swiper-pagination-bullet-active .bar {display:inline-block;}  
.main-visual .mvisual_pagination .pg_btn .active_bar.on {transition:all ease 15s;} 
.main-visual .mvisual_pagination .pg_btn .active_bar.stop{animation-play-state: paused;}
.main-visual .swiper-button-pause{  z-index: 2;width:24px; height:24px; display: flex;  align-items: center;  justify-content: center; cursor:pointer;}
.main-visual .swiper-button-pause:after{content:'II';  font-size:18px;}
.main-visual .swiper-button-pause.on:after{content:'▶'; font-size:13px;} 
.main-visual .swiper-button-arr{color:#fff; position:absolute; right:5%; top:50%; transform:translateY(-50%); z-index:2; width:60px; height:180px; display:flex;   flex-direction: column-reverse;  justify-content: space-between;} 
.main-visual .swiper-button-next, 
.main-visual .swiper-button-prev{color:#fff;   width:76px; height:76px; border:1px solid #fff; border-radius:50%; transform: rotate(90deg); position:relative;     top: auto;  margin-top: auto;}
.main-visual .swiper-button-next:after, 
.main-visual .swiper-button-prev:after{font-size:16px;}
.main-visual .swiper-button-next{right:auto; }
.main-visual .swiper-button-prev{left:auto;} 


/* video */
.main-visual .video{height:100%;}
.main-visual .video video{width: 100%; height:100%; object-fit: cover;}


/* news */
.main-news ul{border-top:1px solid #333;}
.main-news ul li a{padding:26px 40px; border-bottom:1px solid #ddd; display:flex; flex-wrap:wrap; justify-content:space-between; position:relative;}
.main-news ul li .img{width:280px;}
.main-news ul li .thumb{position:relative; width:100%; height:0; padding-bottom:50%;}
.main-news ul li .thumb img{position:absolute; left:0; top:0; width:100%;height:100%; object-fit:cover;}
.main-news ul li .txt{width:calc(100% - 330px); padding-right:50px;}
.main-news ul li .txt h3{color:#333; font-size:25px; margin:30px 0 20px; white-space: nowrap; overflow:hidden; text-overflow:ellipsis; -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis;}
.main-news ul li .txt p{font-size:14px; color:#aaa;}
.main-news ul > li a:before{content:"\e93f"; font-family: xeicon!important; position:absolute; right:30px; top:50%; transform:translateY(-50%); font-size:20px; width:46px; height:46px; background:#cccccc; color:#fff;border-radius:50%; display:flex; justify-content:center; align-items:Center;transition:all ease .6s;} 
.main-news ul > li a:after{content:''; width:0; height:1px; background:#258bc4; position:absolute; left:0; bottom:-1px; transition:all ease .6s;}
.main-news ul > li:hover a:before{background-color:#258bc4}
.main-news ul > li:hover a:after{width:100%;}
.main-news .main-tit{position:relative;}
.main-news .more{position:absolute; right:0; bottom:0; color:#258bc4; padding:10px 30px 10px 10px; display:inline-block; }  
.main-news .more:after{content:"\e93f"; font-family: xeicon!important; position:absolute; right:0; top:50%; transform:translateY(-50%); font-size:20px;}




 
/* clinic */
.main-clinic .inner{text-align:center;  max-width:1300px; } 
.main-clinic .main-tit h2{font-size:45px;}
.main-clinic ul{display:flex; justify-content:space-between; }
.main-clinic ul > li{width:31%;}
.main-clinic ul > li a{display:block;position:relative; width:100%; padding-bottom:100%;}
.main-clinic ul > li a > img{position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; z-index:-1;}
.main-clinic ul > li .tit{color:#fff; position:absolute; left:0; bottom:0; padding:40px;font-size:33px; width:100%; font-weight:bold; transition:all ease .3s;}
.main-clinic ul > li .hover{width:100%;  position:absolute; left:0; top:60%; transform:translateY(-50%); padding:30px; color:#fff; opacity:0; transition:all ease .3s; }
.main-clinic ul > li .hover i{width:50px; height:50px; border-radius:50%; border:2px solid #fff; display:flex; align-items:Center; justify-content:center; text-align:center; margin:20px auto 0;}
.main-clinic ul > li a:hover .hover{opacity:1;top:50%; }
.main-clinic ul > li a:hover .tit{opacity:0; bottom:-10%}



/* reason */
.main-reason .inner{text-align:center;  max-width:1300px; }
.main-reason .main-tit h2{font-size:45px;}
.main-reason ul{display:flex; justify-content:space-between; flex-wrap:Wrap;}
.main-reason ul > li{width:31%; margin-right:2%; margin-bottom:2%;}
.main-reason ul > li a{display:block; } 
.main-reason ul > li h3{font-size:25px; color:#333; margin:10px 0; line-height:1.2;}
.main-reason ul > li i{background:#dddddd; width:35px; height:35px; text-align:center; display:flex; align-items:center; color:#fff; margin:0 auto 0; border-radius:50%; justify-content:center;}



 




/* product */
.main-product .swiper-slide{text-align:center;}
.main-product .swiper-slide a{display:block;}
.main-product .swiper-slide a:hover .img:before{opacity:1;}
.main-product .swiper-slide .img{width:100%; height:0; padding-bottom:100%; position:relative;}
.main-product .swiper-slide .img:before{content:''; width:calc(100% - 8px); height:calc(100% - 8px); border:4px solid #258bc4; opacity:0; position:absolute; left:0; top:0; transition:all ease .3s; z-index: 1;}
.main-product .swiper-slide .img img{position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; }
.main-product .swiper-slide p{font-size:25px; font-weight:bold; color:#111; margin:10px 0;}
.main-product .swiper-button-next{right:-70px; margin-top:-50px;}
.main-product .swiper-button-prev{left:-70px; margin-top:-50px;}
.main-product .swiper-button-next:after, 
.main-product .swiper-button-prev:after{color:#aaa;}
.main-product .inner{position:relative;}


/* 공용 메인 슬라이드 세션 */
.slide-section .swiper-slide{display:flex; background:#fff;}
.slide-section .swiper-slide > div{width:50%;}
.slide-section .swiper-slide .txt{ text-align:right; display:flex;  align-items: center; justify-content: flex-end;}
.slide-section .swiper-slide .txt .main-tit{text-align:left; max-width:750px; padding-right:20%; display: inline-block;} 
.slide-section .swiper-slide .img{height:calc(100vh - 100px); position:relative;}
.slide-section .swiper-slide .img img{position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; z-index:-1;}
.slide-section .swiper-slide .more{background:#258bc4; color:#fff; padding:20px 100px 20px 20px; display:inline-block; margin-top:60px; position:relative;}  
.slide-section .swiper-slide .more:before{content:"\e93f"; font-family: xeicon!important; position:absolute; right:20px; top:50%; transform:translateY(-50%); font-size:20px; animation-duration: 1s; animation-iteration-count: infinite;}
.slide-section .swiper-slide .more:hover:before{animation-name:move;}
@keyframes move{
    0%   {right:20px;}
    50%  {right:10px;}
    100% {right:20px;}
}
.slide-section .swiper-pagination{bottom:0; left:50%; padding:20px; text-align:left;width: 50%;}
.slide-section .swiper-pagination-bullet{width:10px; height:10px;  margin:5px;background:#fff; opacity:1;}
.slide-section .swiper-pagination-bullet-active{width:15px; height:15px; background:#258bc4;} 
.slide-section.rtl .swiper-slide{ flex-direction: row-reverse;}
.slide-section.rtl .swiper-slide .txt{ justify-content: flex-start;}
.slide-section.rtl .swiper-slide .txt .main-tit{padding-right:0;padding-left:20%}
.slide-section.rtl .swiper-pagination{left:0; text-align:right;}

  
/* broad */
.main-broad .main-tit{text-align:center;}
.main-broad .main-youtube{display:flex; justify-content:space-between;}
.main-broad .main-youtube .youtube-wr{width:100%; height:0; padding-bottom:56.25%; position:relative;}
.main-broad .main-youtube .youtube-wr iframe{width:100%; height:100%; position:absolute; left:0; top:0;} 
.main-broad .main-youtube .tab-menu{width:45%; border-top:1px solid #333;}
.main-broad .main-youtube .tab-menu li{border-bottom:1px solid #ccc;}
.main-broad .main-youtube .tab-menu li a{display:block;color:#ccc; font-size:28px; padding:21px; font-weight:400; white-space: nowrap; overflow:hidden; text-overflow:ellipsis; -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis; position:relative;  transition:all ease .3s;}
.main-broad .main-youtube .tab-menu li a:before{content:"\e940"; font-family: xeicon!important; position:absolute; right:20px; top:50%; transform:translateY(-50%);  border-radius:50%; transition:all ease .3s;} 
.main-broad .main-youtube .tab-menu li a.active{color:#258bc4; font-weight:700} 
.main-broad .main-youtube .tab{width:50%; display: none;} 
.main-broad .main-youtube .tab.active{ display: block;}




/* inquiry */
.main-inquiry .inner{display:flex; justify-content:space-between;}
.main-inquiry .inq-link{width:400px;  }
.main-inquiry .inq-link ul{display:flex; flex-wrap:wrap;}
.main-inquiry .inq-link ul li {margin-right:50px; margin-bottom:20px; text-align:center;}
.main-inquiry .inq-link ul li .icon{width:63px; height:63px; border-radius:13px; box-shadow:2px 2px 2px rgba(0,0,0,0.1); display:flex; align-items:center; justify-content:center; background:#fff;  }
.main-inquiry .inq-link ul li .icon img{ filter: grayscale(1); opacity:.5;transition:all ease .3s;}
.main-inquiry .inq-link ul li:hover .icon img{filter:none; opacity:1;}
.main-inquiry .inq-link ul li p{font-size:14px; margin:15px 0;}
.main-inquiry .inq-link ul li a{cursor: pointer;}
.main-inquiry .inq-link > p{font-size:18px;}
.main-inquiry .inq-form{ width:calc(100% - 550px)}
.main-inquiry .inq-form ul li{background:#fff; padding:10px 20px; border:1px solid #ddd; display:flex; flex-wrap:wrap; align-items:center; margin:0 0 10px; font-size:15px;}
.main-inquiry .inq-form ul li dt{padding:10px 0; width:200px; color:#111; font-weight:500; font-size:16px;}
.main-inquiry .inq-form ul li dt em{font-size:15px;}
.main-inquiry .inq-form ul li dt em b{color:#ff0000;}
.main-inquiry .inq-form ul li dd{  width:calc(100% - 200px); border-left:1px solid #ddd;}
.main-inquiry .inq-form ul li input{border:0; padding:10px 20px; font-size:15px;}
.main-inquiry .inq-form ul li textarea{border:0; padding:20px 0; font-size:15px; height:150px;}
.main-inquiry .inq-form ul li select{border:0; width:100%; padding:10px 20px; font-size:15px;}
.main-inquiry .inq-form ul li:last-child dt{width:100%;}
.main-inquiry .inq-form ul li:last-child dd{width:100%; border-left:0; border-top:1px solid #ddd; }
.main-inquiry .inq-send{ display:flex; flex-wrap:wrap; justify-content:space-between; margin-top:20px;}
.main-inquiry .inq-send button{font-size:16px;  background:#258bc4; color:#fff; padding:20px 100px 20px 20px; display:inline-block; position:relative;}  
.main-inquiry .inq-send button:before{content:"\e93f"; font-family: xeicon!important; position:absolute; right:20px; top:50%; transform:translateY(-50%); font-size:20px;  animation-duration: 1s; animation-iteration-count: infinite;}
.main-inquiry .inq-send button:hover::before{animation-name:move;}


.main-reason .inner{max-width:1500px;}
.main-reason .img_wrap h3{font-size:25px; color:#333; margin:10px 0; line-height:1.2;}
.main-reason .img_wrap .img_box{position:relative; font-size:0;}
.main-reason .img_wrap .img_box::after{content:''; position:absolute; top:0; bottom:0; left:0; right:0; background-color:rgb(37,139,196,0.6); z-index:10; display:none;}
.main-reason .img_wrap .img_box i{width:35px; height:35px; text-align:center; line-height:35px; background-color:rgb(255,255,255,0.7); border-radius:50%;  position:absolute; top:50%; left:50%; transform:translate(-50% , -50%); font-size:16px; z-index:20; display:none;}
.main-reason .img_wrap a:hover .img_box::after,.main-reason .img_wrap a:hover .img_box i{display:block;}
.main-reason .top_img{display:flex; justify-content:center; margin-bottom:50px;}
.main-reason .top_img a{max-width:340px; margin-right:48px;}
.main-reason .top_img a:last-child{margin-right:0;}
.main-reason .bottom_img{display:flex; justify-content:space-between; gap:48px;}
.main-reason .bottom_img a{max-width:340px;}

/* top 버튼 */
.side_nav{position:fixed; bottom:40px; right:30px;}
.side_nav ul li{margin-bottom:10px;}
.side_nav ul li a{width:55px; height:55px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer;}
/* .side_nav ul li:nth-child(1) a{background-color:#48ca50;}
.side_nav ul li:nth-child(2) a{background-color:#2dc100;}
.side_nav ul li:nth-child(3) a{background-color:#fff;}
.side_nav ul li:nth-child(4) a{background-color:#258bc4;} */
.side_nav ul li:nth-child(1) a{background-color:#86c7eb; color:#fff;}

/********************************** responsive **********************************/
@media (max-width: 1400px) {   
	.fp-section#section3,
	.fp-section#section5,
	.fp-section#section6,
	.fp-section#section9,
	.fp-section#section10,
	.fp-section#section11{ padding:120px 0;}
	.fp-section{height:auto !important; display:block; }
	.fp-section .sec-footer{display:none;}
	.fp-section .fp-tableCell{padding-top:0; height:auto !important; display:block;}
	.main-visual .main-tit h2{font-size:50px;}
	.main-visual .main-tit p{font-size:16px;}
	.slide-section .swiper-slide .txt .main-tit{padding-left:10%;}
	.main-tit h2{font-size:40px;}
	.main-clinic .main-tit h2{font-size:35px;}
	.main-clinic ul > li .tit{font-size:24px;}
	.main-visual .control{bottom:20vh;}
	.main-tit p{font-size:16px;}
	.main-reason ul > li h3{font-size:24px;}
}
@media (max-width: 768px) {   
	.fp-section#section3,
	.fp-section#section5,
	.fp-section#section6,
	.fp-section#section9,
	.fp-section#section10,
	.fp-section#section11{ padding:60px 0 0;}
	.main-tit{margin-bottom:20px;}
	.main-tit h2{font-size:28px;}
	.main-tit b{font-size:1em;}
	.main-visual .main-tit h2{font-size:30px;}
	.main-visual .swiper-button-arr{display:none;}
	.main-visual .control{bottom:10vh;}
	.slide-section .swiper-slide{flex-wrap:wrap;}
	.slide-section .swiper-slide > div{width:100%} 
	.slide-section .swiper-slide .txt{padding:60px 0;}
	.slide-section .swiper-slide .more{padding:15px 80px 15px 15px;margin-top:30px;}
	.slide-section .swiper-slide .txt .main-tit{padding:0 30px; margin-bottom:0;}
	.slide-section .swiper-slide .img{height:300px}
	.slide-section.rtl .swiper-slide .txt .main-tit{padding-left:30px;}
	.slide-section .swiper-pagination{left:0;}
	.main-clinic ul{flex-wrap:wrap;}
	.main-clinic ul li{width:100%; margin-bottom:10px;}
	.main-clinic .main-tit h2{font-size:24px;}
	.main-clinic ul > li a{padding-bottom:70%;}
	.main-clinic ul > li .tit{padding:20px; font-size:20px;line-height: 1.2;}
	.main-product .swiper-slide p{font-size:18px;}
	.main-product .inner:last-child{width:100%;}
	.main-product .swiper-button-next,
	.main-product .swiper-button-prev{display:none;}
	.main-reason .main-tit h2{font-size:28px;}
	.main-reason .top_img{flex-wrap:wrap; margin:0;}
	.main-reason .bottom_img{flex-wrap:wrap;}
	.main-reason .top_img a{margin-right:0; margin: 0 auto 20px;}
	.main-reason .img_wrap h3{font-size:18px;}
	.main-reason .bottom_img{gap:0}
	.main-reason .bottom_img a{margin-right:0; margin: 0 auto 20px;} 
	.main-news ul{ padding-bottom:60px;}
	.main-news ul li a{padding:30px 0 0; border-bottom:0;}
	.main-news ul li .img{width:100%;}
	.main-news ul li .txt{width:100%; padding-right:0;}
	.main-news ul li .txt h3{font-size:20px; margin:20px 0 10px;}
	.main-broad .main-youtube{flex-wrap:wrap;}
	.main-broad .main-youtube .tab{width:100%;}
	.main-broad .main-youtube .tab-menu{width:100%; padding-bottom:60px;}
	.main-broad .main-youtube .tab-menu li a{font-size:20px;}
	.main-inquiry .inner{flex-wrap:wrap; padding-bottom:60px;}
	.main-inquiry .inq-link{width:100%;}
	.main-inquiry .inq-form{width:100%;}
	.main-inquiry .inq-link ul li{margin-right:0; width:25%; margin-bottom: 0;}
	.main-inquiry .inq-link ul li a{max-width:63px; display:block;}
	.main-inquiry .inq-form ul{margin-top:30px;}
	.main-inquiry .inq-form ul li{font-size:13px;}
	.main-inquiry .inq-form ul li select{font-size:13px;}
	.main-inquiry .inq-form ul li input{font-size:13px;}
	.main-inquiry .inq-form ul li dt{width:80px;}
	.main-inquiry .inq-form ul li dd{    width: calc(100% - 80px);}
	.main-inquiry .inq-send button{padding:15px 80px 15px 15px;margin-top:30px; font-size:14px;}


}