@charset "utf-8";
/* *******************************************************
 * filename : main.css
 * description : 메인 레이아웃 및 컨텐츠 CSS
 * date : 2020-11-25
******************************************************** */

/* ******************  메인 레이아웃(Fullpage) ********************** */
#fullpage #mainVisual{height:100vh}
@media all and ( min-width: 1025px ) and (max-height: 750px) {
	#fullpage .section:not(#mainFooter){min-height:750px;}
	#fullpage .section .fp-tableCell{height:100% !important;}
}

/* ******************  메인 비주얼 ********************** */
#mainVisual{overflow:hidden; width:100%; height:1000px; height:100vh; position:relative; background-color:#000}
#mainVisual .video_background {width: auto; height: 130%; object-fit: cover;}
.main-visual-con .slick-track,
.main-visual-con .slick-list {
	 -webkit-perspective: 2000;
	-webkit-backface-visibility: hidden;
}
.main-visual-con, 
.main-visual-con .slick-list,  
.main-visual-con .slick-track, 
.main-visual-item{
	height:100%;
}
.main-visual-con{z-index:1;}
/* 메인 비주얼 :: 이미지 */
.main-visual-item{position:relative;}
.main-visual-item .main-visual-pc-img{
	width:100%;
	height:100%;
	opacity:0.08;
	filter:Alpha(opacity=40);
	background-size:cover !important;
    transform: scale(1.0,1.0);
    transition:opacity 1.5s ease-out, transform 9.5s linear ;	
}
.main-visual-item .main-visual-m-img{display:none;}

/* 메인 비주얼 :: 텍스트 */
.main-visual-item .main-visual-txt-con{position:absolute; left:10%; top:50%; transform:translateY(-50%); width:50%; padding-right:80px; box-sizing:border-box}
.main-visual-item .main-visual-txt-con .main-visual-txt1,
.main-visual-item .main-visual-txt-con .main-visual-txt2,
.main-visual-item .main-visual-txt-con .main-visual-txt3{
	opacity:0; 
}
.main-visual-item .main-visual-txt-con .main-visual-txt1{display:block; font-size:20px; font-weight:700; letter-spacing:0; color:#fff; margin-bottom:25px; }
.main-visual-item .main-visual-txt-con .main-visual-txt2{font-weight:700; font-size:80px; letter-spacing:-0.1px; color:#fff; margin-bottom:35px; text-transform:uppercase; line-height:0}
.main-visual-item .main-visual-txt-con .main-visual-txt3{font-weight:500; font-size:22px; letter-spacing:-0.65px; color:#fff; line-height:1.63;}

/* 메인 비주얼 :: active효과 */
.main-visual-item.active-item .main-visual-pc-img{transform: scale(1.1,1.1) rotate(0.0001deg); opacity:1; filter:Alpha(opacity=100);}
.main-visual-item.active-item .main-visual-txt1,
.main-visual-item.active-item .main-visual-txt2,
.main-visual-item.active-item .main-visual-txt3{
	-webkit-animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
	animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
}
.main-visual-item.active-item .main-visual-txt-con .main-visual-txt3{ -webkit-animation-delay:1.2s; animation-delay:1.2s;}
.main-visual-item .main-visual-txt1.splitting .char,
.main-visual-item .main-visual-txt2.splitting .char{
	-webkit-animation: text-fade-out 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
	animation: text-fade-out 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
}
.main-visual-item.active-item .main-visual-txt1.splitting .char,
.main-visual-item.active-item .main-visual-txt2.splitting .char{
	-webkit-animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
	animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
}

@keyframes text-active-animation {
	from {
		opacity:0;filter:Alpha(opacity=0);
		-webkit-transform: translateY(50px); 
		transform: translateY(50px); 
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		-webkit-transform: translateY(0); 
		transform: translateY(0); 
	}
}
@keyframes text-fade-out {
	from {
		opacity:1.0;filter:Alpha(opacity=100);
	}
	to {
		opacity:0;filter:Alpha(opacity=0);
	}
}

/* 메인 비주얼 :: 화살표 */
.main-visual-arrow{position:absolute; display:flex; flex-direction:column-reverse; right:142px; top:50%; z-index:9; transform:translate(-50px, -50%); opacity:0; transition:transform ease-out 1s 0.4s, opacity ease-out 1s 0.4s}
.main-visual-arrow a{display:block; width:82px; height:82px; border:1px solid rgba(255,255,255,0.2); border-radius:50%; box-sizing:border-box; text-align:center}
.main-visual-arrow a.next{margin-bottom:30px; position:relative}
.main-visual-arrow a i{line-height:82px; color:#fff; transform:rotate(90deg)}
.main-visual-arrow a svg{overflow: visible; position:absolute;  top:0; left:0; width:100%; height:100%; fill:none; stroke:#fff; transform:rotate(-90deg);}
.main-visual-arrow a svg circle { transform-origin: center; stroke: #fff; stroke-dasharray: 401.4743; stroke-dashoffset: 401.4743; stroke-width: 3px;}

/* 메인 비주얼 :: 스크롤아이콘 */
.main-scroll-icon{position:absolute; bottom:0; left:110px; z-index:9; transform:translateX(-50px); opacity:0; transition:transform ease-out 1s 0.4s, opacity ease-out 1s 0.4s}
.main-scroll-icon .txt{display:block; }
.main-scroll-icon .bar{display:block; width:3px; height:88px; background-color:rgba(255,255,255,0.2); margin-top:35px; margin-left:2px; position:relative; overflow:hidden}
.main-scroll-icon .bar:after{position:absolute; content:""; width:3px; height:38px; background:url(/images/main/scroll_bar.png) no-repeat; top:-40px; left:0; animation: upDown 2s ease-in-out infinite;}
@keyframes upDown {
	0% {
		top:-40px
	}
	100% {
		top:100%
	}
}

/* 메인 비주얼 :: 처음들어왔을때 검은화면 */
.main-bk-bg {width: 100%; height: 100%; position: fixed; z-index: 9999999; top: 0; left: 0; opacity: 1; visibility: visible; background-color: #000;}


/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: 공통 -------- */
/* 공통 :: 타이틀 */
.main-en-tit{display:block; color:#333; font-size:20px; letter-spacing:0; font-weight:700; text-transform:uppercase}
.main-cm-tit{font-weight:700; font-size:75px; letter-spacing:-0.1px; color:#111; line-height:0}
.main-cm-txt{font-weight:500; font-size:22px; letter-spacing:-0.75px; color:#666; line-height:1.63; margin-top:30px}
.main-en-tit.wh,
.main-cm-tit.wh,
.main-cm-txt.wh{color:#fff}

.txt-effect{opacity:0}
.txt-up-effect-con.animated .txt-effect{opacity:1}
.animated .main-cm-tit.splitting .char{animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
.animated .main-cm-txt{
	animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
	animation-delay:0.7s;
}
.txt-up-effect.splitting .char{
	opacity:0;
	transform:translateY(100%);
	transition:opacity 0.8s, transform 0.8s;
}
 /* transition일때 */ 
.active-section .txt-up-effect.splitting .char,
.animated .txt-up-effect.splitting .char{
	opacity:1.0;
	transform:translateY(0);
	animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
}


/* -------- 메인 컨텐츠 :: 컨텐츠1(special) -------- */
#mainPrdCon{background:#f8f8f8 url(/images/main/main_prd_bg.jpg) no-repeat left center; background-size:cover}
.main-prd-con{position:relative}
.main-prd-con .main-en-tit{position:absolute; top:0; left:0}
.main-prd-con .main-prd-slide{}
.main-prd-con .main-prd-slide .slick-list{overflow:visible}
.main-prd-con .main-prd-slide li .prd-inner{}
.main-prd-con .main-prd-slide li .prd-inner .prd-txt{float:left; width:45%; margin-top:55px; box-sizing:border-box; padding-right:3%; padding-bottom:180px}
.main-prd-con .main-prd-slide li .prd-inner .prd-txt h3{font-weight:bold; font-size:70px; letter-spacing:-1px; color:#333; line-height:1; }
.main-prd-con .main-prd-slide li .prd-inner .prd-txt p{font-weight:600; font-size:22px; letter-spacing:-0.65px; color:#333; line-height:1.63; margin-top:35px; height:3.26em}
.main-prd-con .main-prd-slide li .prd-inner .prd-img{float:left; width:55%; position:relative;}
.main-prd-con .main-prd-slide li .prd-inner .prd-img:after{position:absolute; content:""; bottom:0; right:0; width:90%; height:100%; background-color:#eee; z-index:-1; transition:all 0.7s 0.2s; transform:translate(50px, 50px)}
.main-prd-con .main-prd-slide li .prd-inner .prd-img .img-con{position:relative; display:block; padding-top:52.3%; box-shadow:30px 33px 19px -5px rgba(0,0,0,0.13)}
.main-prd-con .main-prd-slide li .prd-inner .prd-img .img-con .img{position:absolute; top:0; left:0; width:100%; height:100%; transform:translate(50px, 50px); transition:all 0.7s 0.2s; overflow:hidden}
.main-prd-con .main-prd-slide li.first .prd-inner .prd-img .img-con .img img{transform: scale(1.3,1.3); transition:opacity .5s linear,transform 3s cubic-bezier(.19,1,.22,1)}
.main-prd-con .main-prd-slide li .prd-inner .prd-img .img-con .img img{position:absolute; top:0; left:0; width:100%; height:100%; transform: scale(1.1,1.1); opacity:0; transition: transform 4s}
.main-prd-con .main-prd-slide li .prd-inner .prd-img .img-con .img .cover-bg{position:absolute; top:0; left:0; width:100%; height:100%; background-color:#04314e; transition:opacity .5s linear }
.main-prd-con .main-prd-slide li .prd-inner .prd-img .img-txt{position:absolute; bottom:-40px; right:0; font-weight:600; font-size:16px; letter-spacing:-0.1px; color:#333; line-height:1.3}
.main-prd-con .main-prd-slide li .prd-inner .prd-img .more-btn{position:absolute; bottom:-65px; left:10.8%; width:130px; height:130px; border-radius:50%; text-align:center; box-shadow:10px 10px 19px 7px rgba(0,0,0,0.18);}
.main-prd-con .main-prd-slide li .prd-inner .prd-img .more-btn:after{position:absolute; content:""; top:0; left:0; border-radius:50%; background-color:#04314e; width:100%; height:100%; transition:all 0.4s}
.main-prd-con .main-prd-slide li .prd-inner .prd-img .more-btn i{font-size:36px; color:#fff; line-height:130px; position:relative; z-index:9}
.main-prd-con .main-prd-slide li .prd-inner .prd-img .more-btn .bg-txt{position:absolute; top:0; left:0; width:100%; height:100%; background:url(../images/main/discover_more_txt.png) no-repeat; background-size:100% 100% !important; animation: circleSpin 8s infinite linear; z-index:9} 
@keyframes circleSpin {
	0% {transform:rotate(0)}
	100% {transform:rotate(360deg)}
}
.main-prd-con .main-prd-conuter{position:absolute; left:0; bottom:95px; z-index:99; opacity:0; transform: translateY(50px); transition:opacity 1.5s 1s, transform 1.5s 1s}
.main-prd-con .main-prd-conuter .prd-arrow{display:inline-block; position:relative}
.main-prd-con .main-prd-conuter .prd-arrow.prev:after{position:absolute; content:""; width:2px; height:6px; background-color:#b6b7d6; top:12px; right:-2px}
.main-prd-con .main-prd-conuter .prd-arrow a{font-size:28.8px; color:#333; display:inline-block; vertical-align:middle;  transition:all 0.5s;}
.main-prd-con .main-prd-conuter .prd-arrow a:hover{opacity:0.5}
.main-prd-con .main-prd-conuter .prd-arrow span{position:relative; display:inline-block; vertical-align:middle; margin:0 22px; font-weight:900; font-size:15.6px; color:#333; width:20px}
.main-prd-con .main-prd-conuter .prd-arrow span:before{position:relative; content:"0";}

@media all and ( min-width: 801px ){		
	.main-prd-con .main-prd-slide li .prd-inner .prd-img .more-btn:hover:after{transform:scale(1.12) }
}

/* 해당영역 왔을 때 */
.txt-effect{opacity:0; transition:opacity 0.3s}
.animated.main-prd-con .main-prd-slide li .prd-inner .prd-img:after{transform:translate(70px, 100px)}
.animated.main-prd-con .main-prd-slide li .prd-inner .prd-img .img-con .img{transform:translate(0, 0)}
.animated.main-prd-con .main-prd-conuter{opacity:1; transform:translateY(0); }
.animated .active-item .txt-effect{opacity:1}
.animated .txt-up-effect-02.splitting .char{animation: text-fade-out 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
.animated .active-item .txt-up-effect-02.splitting .char{animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
.animated .active-item .txt-up-effect-03{
	animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
	animation-delay:0.7s;
}
.animated .main-prd-slide li .prd-inner .prd-img .img-con .img img{opacity:1}
.animated .main-prd-slide li.active-item .prd-inner .prd-img .img-con .img img{transform: scale(1.0,1.0) rotate(0.0001deg);}
.animated.main-prd-con .main-prd-slide li .prd-inner .prd-img .img-con .img .cover-bg{opacity:0}








/* -------- 메인 컨텐츠 :: 컨텐츠2(GROWTH) -------- */
#mainGrowthCon{background-color:#000; position:relative; z-index:2}
/* 상단 */
.main-growth-top{height:60%; position:relative}
.main-growth-top .growth-top-slide,
.main-growth-top .growth-top-slide .slick-list,
.main-growth-top .growth-top-slide .slick-track{height:100%}
.main-growth-top .growth-top-slide li .bg{position:relative; display:block; width:100%; height:100%}
.main-growth-top .growth-top-slide li .bg span{position:absolute; top:0; left:0; width:100%; height:100%; background-size:cover !important}
.main-growth-top .growth-top-slide li .txt-con{position:absolute; top:50%; left:0; right:0; transform:translateY(-50%); z-index:9; margin-top:30px;}
.main-growth-top .growth-top-slide li .txt-con > div{box-sizing:border-box; padding-right:140px}
.main-growth-top .growth-top-slide li .txt-con .txt{font-weight:300; font-size:50px; /*letter-spacing:-0.1px; */ letter-spacing:-2px; color:#fff; line-height:1.4; margin-top:25px}
.main-growth-top .growth-top-slide li .txt-con .txt b{font-weight:600}
.main-growth-top .growth-visual-arrow{position:absolute; left:0; right:0; top:50%; transform:translateY(-50%); z-index:99999; text-align:right}
.main-growth-top .growth-visual-arrow .arrow-wrap{display:flex; flex-direction:column-reverse; align-items:flex-end}
.main-growth-top .growth-visual-arrow a{display:block; width:82px; height:82px; border:1px solid rgba(255,255,255,0.2); border-radius:50%; box-sizing:border-box; text-align:center}
.main-growth-top .growth-visual-arrow a.next{margin-bottom:30px; position:relative}
.main-growth-top .growth-visual-arrow a i{line-height:82px; color:#fff; transform:rotate(90deg)}
.main-growth-top .growth-visual-arrow a svg{overflow: visible; position:absolute;  top:0; left:0; width:100%; height:100%; fill:none; stroke:#fff; transform:rotate(-90deg);}
.main-growth-top .growth-visual-arrow a svg circle { transform-origin: center; stroke: #fff; stroke-dasharray: 401.4743; stroke-dashoffset: 401.4743; stroke-width: 3px;}
.main-growth-top .bg span {background:url(/images/main/doctors_top_bg01-1.jpg) no-repeat 60% 0}


.effect-bg{overflow:hidden}
.effect-bg span{transform: scale(1.2); transition:transform 2s}
.animated .active-item .effect-bg span{transform: scale(1.0) rotate(0.0001deg);}
/* 하단 */
.main-growth-bt{height:40%; display:table; width:100%; table-layout:fixed}
.main-growth-bt > div{display:table-cell; vertical-align:middle; width:50%; position:relative}
.main-growth-bt .lf-con .main-growth-bt-lf,
.main-growth-bt .lf-con .main-growth-bt-lf .slick-list,
.main-growth-bt .lf-con .main-growth-bt-lf .slick-track{height:100%}
.main-growth-bt .lf-con .main-growth-bt-lf li{position:relative}
.main-growth-bt .lf-con .main-growth-bt-lf li .bg{position:relative; display:block; width:100%; height:100%}
.main-growth-bt .lf-con .main-growth-bt-lf li .bg span{background-size:cover !important; position:absolute; top:0; left:0; width:100%; height:100%}
.main-growth-bt .rt-con{background-color:#04314e}
.main-growth-bt .rt-con .txt-con{padding:0 8.4%}
.main-growth-bt .rt-con .txt-con dt{font-weight:300; font-size:48px;/* letter-spacing:-0.75px; */letter-spacing:-2px; color:#fff; line-height:1.35}
.main-growth-bt .rt-con .txt-con dt b{font-weight:500}
.main-growth-bt .rt-con .txt-con dd{font-weight:500; font-size:18px; letter-spacing:-0.65px; color:rgba(255,255,255,0.4); margin-top:15px; line-height:1.4}


/* -------- 메인 컨텐츠 :: 컨텐츠3(Global Network) -------- */
#mainGlobalCon {background: url(/images/main/main_doctor_bg.png) no-repeat center bottom; background-size: contain;}
#mainGlobalCon .fp-tableCell {vertical-align: top !important}
.global-map-con {position:absolute; bottom: 0; left: 0; width:100%; text-align: center;}
.global-map-con .map-img {}
.global-map-con .map-img.mb{display:none}
.global-con-txt {z-index:99; position: relative; padding-top: 80px; text-align:center;}
.global-con-txt > .main-cm-tit{font-weight:700; font-size:65px; letter-spacing:-0.1px; color:#111; line-height:0}
.global-map-con-m{display:none;}
.global-nation-box{position:absolute; top:0px; left:0px; width:100%; height:100%; }

@media all and (min-width:2000px) {
    .global-map-con img {width: 100%; max-width: 2000px}   
}

@media all and (min-width:1024px) {
	#mainGlobalCon {background-size: cover;}
}

@media all and (max-width:1024px) {
	#mainGlobalCon {background-image: url("/images/res/sub02-sec08-bg.jpg"); background-size: cover; padding-bottom: 53%;}	
    .global-con-txt {padding-top: 70px;}
}

@media all and (max-width:980px) {
    .global-con-txt {padding-top: 100px; left: 0 !important; bottom: 0 !important}
    .global-con-txt > .main-cm-tit {font-size: 45px;}
    
    .main-growth-top {display: none}
    .main-growth-top .bg span {background:url(/images/res/res-doctors_top_bg01-1.jpg) no-repeat 60% 0}
}

@media all and (max-width:768px) {
    #mainGlobalCon {padding-bottom: 60%; padding-top: 20px;}
    .global-con-txt {padding-top: 50px}
    .global-con-txt > .main-cm-tit {font-size: 37px;}
}


@media all and (max-width:640px) {
    .global-con-txt > .main-cm-tit {font-size: 32px;}
    .main-cm-txt {font-size: 15px;}
}



@keyframes nation-circle {
  0% {
	-webkit-transform: scale(0);
	transform: scale(0);
	opacity: 0.5; 
   }
  50% {
	opacity: 1.0; 
   }
  100% {
	-webkit-transform: scale(1.7);
	transform: scale(1.7);
	opacity: 0; 
	} 
}



.main-tit-box .main-sub-tit{margin-left: 15px; padding-bottom: 10px; font-size:22px; line-height:1.5; letter-spacing:-0.75px; color:#888; display: inline-block; vertical-align: bottom; transform:translateY(30px); opacity: 0; transition:opacity 0.8s, transform 0.8s;}
.main-tit-box .main-tit.splitting .char{
	opacity:0;
	transform:translateY(100%);
	transition:opacity 0.8s, transform 0.8s;
}

/* -------- 메인 컨텐츠 :: 컨텐츠3(VIDEO) -------- */
#mainVideoCon {}
#mainVideoCon .main-global-con {margin-bottom: 60px;}
#mainVideoCon .main-tit-box .area{position: relative; }
#mainVideoCon .main-cm-tit {color:#000; text-align: center;margin-bottom: 100px;}
#mainVideoCon .main-cm-tit img {max-width: 600px; width: 80%;}

#mainVideoCon .main-cm-txt {text-align: center;}
.main-video-control{position: absolute; top: 50%; margin-top: -15px; right: 0;}
.main-video-control .arrow{position: relative; display: inline-block; vertical-align: middle; cursor: pointer;}
.main-video-control .arrow + .arrow{margin-left: 25px;}
.main-video-control .arrow:before{position: absolute; top: 50%; margin-top: -8px; left: -13px; display: block; content: ''; width: 1px; height: 16px; background-color: #d8d8d8;}
.main-video-control .arrow:first-child:before{display: none;}
.main-video-control .arrow i{font-size: 30px; color: #000;}

.main-video-con{position: relative;}
.main-video-con:before{position: absolute; bottom: -10px; left: 0; display: block; content: ''; width: 50%; height: 215px; background-color: #eee;}
.main-video-con .area{position: relative; -webkit-box-sizing: border-box; box-sizing: border-box;}
.main-video-title-txt{position: absolute; top: 0; left: -25px; width: 11px; display: block;}
.main-video-title-txt img{width: 100%;}

@media all and (max-width:980px ){
    #mainVideoCon {padding: 80px 0;}
    .main-cm-tit {font-size: 45px;}
    
    #mainVideoCon .main-cm-tit {margin-bottom: 40px;}
    
}


/* 큰 슬라이드 영역 */
.main-video-original{}
.main-video-slide{}
.main-video-item{padding-bottom: 35px;}

/* 큰 슬라이드 영역 :: 비디오 영역 */
.main-video-iframe{float: left; width: 57.5%; position:relative; overflow:hidden; z-index: 1; -webkit-box-shadow: 19px 19px 35px -10px rgba(0,0,0,0.24); box-shadow: 19px 10px 35px -10px rgba(0,0,0,0.24);}
.main-video-iframe-box{position:relative; padding-top: 59.42%; height:0; background-color:#000;}
.main-video-iframe-box iframe{position:absolute; top:0px; left:0px; width:100%; height:100%;}
.main-video-cover-box{position:absolute; top:0px; left:0px; width:100%; height:100%; cursor:pointer;}
.main-video-cover-box:after{position:absolute; top:0px; left:0px; content:""; width:100%; height:100%; cursor:pointer; background: rgba(0,0,0,0.2) url('../images/main/btn-video-play.png') 50% 50% no-repeat;}
.main-video-cover-box .thumb{display:block; width:100%; height:100%; -webkit-transition:all 0.3s; transition:all 0.3s;}
.main-video-cover-box .thumb img{width:100%; height:100%;}

/* 큰 슬라이드 영역 :: 텍스트 영역 */
.main-video-txt{padding: 50px 0 160px; padding-left: 5.3%; float: left; width: 42.5%; letter-spacing: -0.75px; -webkit-box-sizing: border-box; box-sizing: border-box;}
.main-video-txt .tit{font-size: 30px; line-height: 1.3; font-weight: 500; color: #333;}
.main-video-txt .txt{margin: 30px 0; font-size: 16.5px; line-height: 1.6; color: #888;}
.cm-button-style06 {
  position: relative;
  border-bottom: 2px solid #474747; 
  display: inline-block;
  font-size: 15px; font-weight: 400; color: #333;
  padding: 13px 0; padding-right: 20px;
  transition: ease-in 0.3s;
}
.cm-button-style06 span{float: left;}
.cm-button-style06 i{float: right;}
.cm-button-style06 .arrow {position: absolute; top: 50%; margin-top: -7.5px; right: -2px;}


/* 썸네일 슬라이드 영역 */
.main-video-thum{position: absolute; bottom: 35px; right: 0; padding-left: 5.3%; width: 42.5%; z-index: 2; -webkit-box-sizing: border-box; box-sizing: border-box;}
.main-video-thum-slide{margin: 0 -5px;}
.main-video-thum-item{float: left; width: calc(33.33% - 10px); margin: 0 5px;}
.main-video-thum-item .thumb{display: block; position: relative; width: 100%; height: 0; padding-top: 59.42%; cursor: pointer;}
.main-video-thum-item .thumb:before{position: absolute; top: 0; left: 0; display: block; content: ''; width: 100%; height: 100%; border: 3px solid transparent; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.3s; transition: all 0.3s; z-index: 1;}
.main-video-thum-item .thumb img{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.main-video-thum-item.slick-current .thumb:before{border-color: #000;}


.media_slider {position: relative; width: 1300px; margin: 0 auto;}
.media_wrap {width: 100%; display: flex; flex-wrap: wrap; align-items: center;}
.media_wrap .video_thumb {width: 57%}
.media_wrap .video_text {width: 43%; background: #f8f8f8; box-sizing: border-box; padding: 50px;}
.media_wrap .video_text p {font-size: 17px; color: #4d4e56;  margin: 10px 0; line-height: 1.54;}
.media_wrap .video_text p.name {font-weight: 700; color: #212121;}
.media_wrap .video_text p.title {font-size: 27px; color: #212121; font-weight: 600; line-height: 1.2; margin-bottom: 20px;}
.media_slider-pagination {text-align: center; margin-top: 30px;}
.media_slider-pagination span {width: 10px; height: 10px; margin: 0 5px; background: #d4d5d7; border-radius: 50px; opacity: 1;}
.media_slider-pagination span.swiper-pagination-bullet-active {width: 30px; background: #4d4e56; border-radius: 20px;}

.media_slider-btn {position: absolute; top: 50%; margin-top: -10px; font-size: 40px; z-index: 10; cursor: pointer;}
.media_slider-btn.media_slider-next {right: -50px;}
.media_slider-btn.media_slider-prev {left: -50px;}

@media all and (max-width:1310px) {
    .media_slider {width: 90%;}
}


@media all and (min-width:801px){
    .main-video-cover-box:hover .thumb{
		  -webkit-transform: scale(1.05) rotate(0.002deg);
		  transform: scale(1.05) rotate(0.002deg);
	}
	.cm-button-style06:hover .arrow {
        animation: move 0.5s ease-in-out;
        animation-iteration-count: 1;
    }
	.main-video-thum-item .thumb:hover:before{border-color: #000;}
}

@media all and (max-width:980px) {
    #mainVideoCon {padding: 70px 0;}
    #mainVideoCon .main-cm-txt {margin-top: 0 !important; font-size: 15px;}
    .media_wrap .video_thumb {width: 100%}
    .media_wrap .video_text {width: 100%;}
    .media_wrap .video_text p.title {font-size: 23px;}
    #mainVideoCon .main-global-con {margin-bottom: 40px;}
}
 
@media all and (max-width:768px) {
    #mainVideoCon {padding: 50px 0;}
    .media_wrap .video_text {padding: 40px 20px;}
    .media_wrap .video_text p {font-size: 14px;}
    .media_wrap .video_text p.title {font-size: 19px;}
    .media_slider-pagination {margin-top: 0;}
    #mainVideoCon .main-global-con {margin-bottom: 30px;}
}
 
@keyframes move {
  0% {
    right: -2px;
  }50% {
    right: -5px;
  }100% {
    right: -2px;
  }
}



/* -------- 메인 컨텐츠 :: 컨텐츠4(Inquiry/customer) -------- */
.main-system-con{width:100%; height:100%; /*padding-right:77px; */box-sizing:border-box; background-color:#111}
/* 좌측컨텐츠 */

.main-system-con .lf-con {float:left; width:71%; height:100%; overflow:hidden; position:relative;background: url("/images/main/newnew-main_visual_01.jpg") no-repeat right -150px center, #000; background-size: cover;}
.main-system-con .lf-con .bg{position:absolute; top:0; left:0; width:100%; height:100%; background-size:cover !important; transform: scale(1.2); transition:transform 2s}
.main-system-con .lf-con .video_background {position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); width:auto; height:120%; opacity: 0.7}
.main-system-con .lf-con .txt-con{position:absolute; bottom:90px; left:80px; z-index:9}

/* 우측컨텐츠 :: Inquiry, Customer */
.main-system-con .rt-con {float:left; width:29%; height:100%}
.main-system-con .rt-con .rt-item {display:table; width:100%; height:50%; table-layout:fixed; box-sizing:border-box; background-color:#fff}
.main-system-con .rt-con .rt-item img {width: 100%;}
.main-system-con .rt-con .rt-item .rt-item-inner {display:table-cell; vertical-align:middle}
.main-system-con .rt-con .rt-item .rt-item-inner .inner-wrap{ margin:0 auto; padding:0 50px}
.main-system-con .rt-con .rt-item .rt-item-inner .rt-item-tit{font-weight:700; font-size:40px; letter-spacing:-0.1px; color:#111}


/*진료시간안내*/
.main-system-con .rt-con .slogan {}
.main-system-con .rt-con .slogan span {font-size: 25px; color: #04314e; border-radius: 5px; background: #fff; padding: 5px 15px; font-weight: 600}
.main-system-con .rt-con .info_wrap {padding: 40px 0; border-bottom: 1px solid rgba(255,255,255,0.2);}
.main-system-con .rt-con .info_wrap dl {position: relative; padding-left: 100px; box-sizing: border-box; width: 100%; margin: 10px 0;}
.main-system-con .rt-con .info_wrap dl dt, .main-system-con .rt-con .info_wrap dl dd {font-size: 22px; color: #fff; }
.main-system-con .rt-con .info_wrap dl dt {font-weight: 500; position: absolute; top: 7px; left: 0; }
.main-system-con .rt-con .info_wrap dl dd {line-height: 1.56;}
.main-system-con .rt-con .info_wrap dl.call {padding-left: 0}
.main-system-con .rt-con .info_wrap dl.call dt {pointer-events: inherit; top: auto; left: auto;}
.main-system-con .rt-con .info_wrap dl.call dd a {font-size: 50px; font-weight: 700; color: #fff; line-height: 1; display: block; padding-top: 30px;}

@media all and (max-width:768px){
    .main-system-con .rt-con .info_wrap dl {padding-left: 65px}
    .main-system-con .rt-con .info_wrap dl dt {top: 4px;}
}


/* inquiry */
.main-system-con .rt-con .main-inquiry-con {position: relative; background: #f1f1f1;}
.main-system-con .rt-con .main-inquiry-con img {position: absolute; top: 50%; left: 0; transform: translateY(-50%); height: 100%; width: auto; object-fit: cover;}
.main-system-con .rt-con .main-inquiry-con .inquiry-menu-list {/*margin-top:100px*/ margin-top:30%}
.main-system-con .rt-con .main-inquiry-con .inquiry-menu-list li{}
.main-system-con .rt-con .main-inquiry-con .inquiry-menu-list li a{display:table; height:57px; width:100%; table-layout:fixed; font-weight:600; font-size:18px; letter-spacing:-0.25px; color:#2b2b2b; position:relative; transition:color 0.5s; border-bottom:1px solid #e9e9e9}
.main-system-con .rt-con .main-inquiry-con .inquiry-menu-list li a:after{position:absolute; content:""; width:0; height:1px; background-color:#04314e; bottom:-1px; left:0; transition:width 0.5s}
.main-system-con .rt-con .main-inquiry-con .inquiry-menu-list li a span{display:table-cell; vertical-align:middle; width:100%}
.main-system-con .rt-con .main-inquiry-con .inquiry-menu-list li a span .icon{width:32px; vertical-align:middle; position:relative; top:-2px;}
.main-system-con .rt-con .main-inquiry-con .inquiry-menu-list li a span .arrow{position:absolute; right:0; top:50%; transform:translateY(-50%)}




/* customer */
.main-system-con .rt-con .main-customer-con{background-color:#04314e}
.main-system-con .rt-con .rt-item.main-customer-con .rt-item-inner .rt-item-tit{color:#fff}
.main-system-con .rt-con .main-customer-con .main-customer-slide{/*margin-top:100px*/margin-top:30%}
.main-system-con .rt-con .main-customer-con .main-customer-slide .cate-date{display:flex; align-items:center; /*margin-bottom:45px*/margin-bottom:14%}
.main-system-con .rt-con .main-customer-con .main-customer-slide .cate-date b{font-weight:700; font-size:18px; letter-spacing:-0.35px; color:#fff}
.main-system-con .rt-con .main-customer-con .main-customer-slide .cate-date span{font-weight:500; font-size:13px; letter-spacing:-0.35px; color:#fff; opacity:0.3; margin:1px 0 0 17px}
.main-system-con .rt-con .main-customer-con .main-customer-slide .tit{display:block; font-weight:400; font-size:20px; letter-spacing:-0.75px; color:#fff; line-height:1.65; max-height:3.3em; }
.main-system-con .rt-con .main-customer-con .main-customer-conuter{/*margin-top:60px*/margin-top:18%}
.main-system-con .rt-con .main-customer-con .main-customer-conuter .customer-arrow{position:relative; display:inline-block; vertical-align:middle;}
.main-system-con .rt-con .main-customer-con .main-customer-conuter .customer-arrow.prev:after{position:absolute; content:""; width:2px; height:6px; background-color:#fff; opacity:0.3; top:12px; right:-2px}
.main-system-con .rt-con .main-customer-con .main-customer-conuter .customer-arrow a{font-size:28.8px; color:#fff; display:inline-block; vertical-align:middle;}
.main-system-con .rt-con .main-customer-con .main-customer-conuter .customer-arrow span{position:relative; display:inline-block; vertical-align:middle; margin:0 22px; font-weight:900; font-size:15.6px; color:#fff; width:20px}
.main-system-con .rt-con .main-customer-con .main-customer-conuter .customer-arrow span:before{position:relative; content:"0";}

/* 해당영역 왔을 때 */
.animated.main-system-con .lf-con .bg{transform: scale(1.0) rotate(0.0001deg);}


/* -------- 처음 홈페이지 들어왔을때 애니메이션 -------- */
.active-page .main-visual-arrow{transform:translate(-0,-50%); opacity:1}
.active-page .main-scroll-icon{transform:translateX(-0); opacity:1}


/* -------- 메인 컨텐츠 :: 공통 ( 텍스트애니메이션 ) -------- */
.up-effect{display: block; padding-bottom: 0.1em; overflow-y: hidden; opacity:0}
.up-effect .effect-inner{position: relative; display: inline-block;}
.animated .up-effect{opacity:1}
.animated .up-effect .effect-inner{animation: text-up 1s cubic-bezier(0.4, 0, 0.2, 1) both 0.2s;}
@keyframes text-up {
  from {
    transform: translate3d(0, 150%, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}


@media all and (max-width:1400px ){
    .main-system-con .rt-con .rt-item .rt-item-inner .inner-wrap {padding-left: 30px; padding-right: 30px;}
    .main-system-con .lf-con {width: 65%}
    .main-system-con .rt-con {width: 35%;}
}


@media all and (max-width: 984px){	
	.main-system-con .rt-con .main-inquiry-con .inquiry-menu-list li a:hover{color:#04314e}
	.main-system-con .rt-con .main-inquiry-con .inquiry-menu-list li a:hover:after{width:100%}
}



@media all and ( min-width: 801px ){	
	.main-system-con .rt-con .main-inquiry-con .inquiry-menu-list li a:hover{color:#04314e}
	.main-system-con .rt-con .main-inquiry-con .inquiry-menu-list li a:hover:after{width:100%}
}


@media all and (max-width:1200px ){
    .main-system-con .lf-con {width: 55%}
    .main-system-con .rt-con {width: 45%;}
    .main-system-con .rt-con .slogan span {font-size: 21px;}
    .main-system-con .rt-con .info_wrap {padding: 25px 0;}
    .main-system-con .rt-con .info_wrap dl dt, .main-system-con .rt-con .info_wrap dl dd {font-size: 18px;}
    .main-system-con .rt-con .info_wrap dl.call dd a {font-size: 30px;}
    
}


@media all and (max-width:980px ){
    .main-system-con .rt-con .main-inquiry-con img {position: relative; top: auto; left: auto; transform: none; width: 100%; height: auto; transform: none;}
    .main-system-con .rt-con .rt-item {padding-top: 50px;padding-right: 0}
    .main-customer-con {padding-top: 50px;}
}




@media all and (max-width:768px ){
    .main-system-con .rt-con .slogan span {font-size: 19px;}
    .main-system-con .rt-con .info_wrap dl dt, .main-system-con .rt-con .info_wrap dl dd {font-size: 15px;}
    .main-system-con .rt-con .info_wrap dl.call dd a {font-size: 25px;}
    .main-inquiry-con {padding-top: 0 !important}
    .main-customer-con {padding-top: 30px;}
}



/*ifame wrap*/
.video-container {position:relative; padding-bottom:56.25%; height:0; overflow:hidden;}
.video-container iframe,.video-container object,.video-container embed {position:absolute; top:0; left:0; width:100%; height:100%;}
.video-container video,.video-container object,.video-container embed {position:absolute; top:0; left:0; width:100%; height:100%;}

.merit_slider {width: 120%; margin-left: 20%;}
.merit_slider .swiper-slide {display: table; height: 750px;}
.merit_slider .wrap {display: table-cell; vertical-align:bottom; position: relative; box-sizing: border-box; padding: 0 50px}
.merit_slider .text {box-sizing: border-box; padding: 50px 30px; background: #fff; transition: 0.7s; box-shadow: 0 0 15px rgba(0,0,0,0.1);}
.merit_slider .text h3 {font-size: 40px; color: #212121; margin: 15px 0 20px 0}
.merit_slider .text p {font-size: 17px; line-height: 1.6;}
.merit_slider .text p strong {font-size: 18px; color: #212121;}
.merit_slider .pics {position: absolute; bottom: 50px; left:0; opacity: 0; transition: 0.7s; width: 505px; overflow: hidden; }
.merit_slider .pics img {width: 100%;}
.merit_slider .swiper-slide-active .text {padding-bottom: 70%}
.merit_slider .swiper-slide-active .pics {left: 100px; opacity: 1; transition: opacity 0.7s ease 0.55s, left .7s ease 0.55s;}

.merit_slider-pagination {text-align: center; width: 1200px; margin: 50px auto 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; position: relative;}
.merit_slider-pagination::after {width: 100%; height: 1px; background: #dedede; content: ''; position: absolute; left: 0; top: 50%;}
.merit_slider-pagination span {width: 20px; height: 20px; position: relative; z-index: 1; opacity: 1; background: #dedede}
.merit_slider-pagination span.swiper-pagination-bullet-active {background: #04314e;}
/*
@media all and (min-width:2000px ){
    .merit_slider .pics {width: 650px;}
}
*/
@media all and (max-width:2000px ){
    .merit_slider {margin-left: 12%}
    .merit_slider .wrap {padding: 0 25px;}
    .merit_slider .pics {width: 85%}
    .merit_slider .swiper-slide-active .text {padding-bottom: 65%}
    .merit_slider .swiper-slide-active .pics {left: 50px; }

}

@media all and (max-width:1210px ){
    .merit_slider-pagination {width: 90%; margin-bottom: 110px; margin-top: 100px;}
}

@media all and (max-width:980px ){
    #mainPrdCon {padding: 0;}
    .merit_slider {width: 95%; margin: 0 auto; display: none}
    .merit_slider .swiper-slide {height: 560px}
    
    .merit_slider .wrap {padding: 0;} 
    .merit_slider .text {padding: 33px;}
    .merit_slider .text h3 {font-size:35px;}
    .merit_slider .text p {font-size: 16px;}
    
    .merit_slider-pagination {width: 70%; margin-bottom: 0; margin-top: 50px; display: none}
    .merit_slider .swiper-slide-active .text {padding-bottom: 60%}
    .merit_slider .swiper-slide-active .pics {left: 30px; }
    
}


@media all and (max-width:768px){
    
    .merit_slider .swiper-slide {}
    
    .merit_slider .wrap {padding: 0;}
    .merit_slider .text {padding: 20px; padding-top: 50px;}
    .merit_slider .text h3 {font-size:30px;}
    .merit_slider .text p {font-size: 15px;}
    .merit_slider .text p strong {font-size: 13px;}
    .merit_slider .pics {width: 90%} 
    .merit_slider-pagination {width: 50%; margin-top: 25px !important}
    .merit_slider-pagination span  {width: 15px; height: 15px;}
    .merit_slider .swiper-slide-active .pics {left: 25px;}
    .merit_slider .swiper-slide-active .text {padding-bottom: 65%}
    
}


#main_visual02 {background-image: url(/images/main/visual_sample01.jpg);}
#main_visual05 {background-image: url(/images/main/visual_sample02.jpg);}
#main_visual06 {background-image: url(/images/main/visual_sample03.jpg);}


#main_visual02 .main-visual-txt-con .main-visual-txt1, #main_visual02 .main-visual-txt-con .main-visual-txt2, #main_visual02 .main-visual-txt-con .main-visual-txt3 {color: #212121;}
#main_visual05 .main-visual-txt-con .main-visual-txt1, #main_visual05 .main-visual-txt-con .main-visual-txt2, #main_visual05 .main-visual-txt-con .main-visual-txt3 {color: #212121;}
#main_visual06 .main-visual-txt-con .main-visual-txt1, #main_visual06 .main-visual-txt-con .main-visual-txt2, #main_visual06 .main-visual-txt-con .main-visual-txt3 {color: #212121;}


#main_visual03 {background-image: url(/images/main/main_visual_03.jpg);}
#main_visual04 {background-image: url(/images/main/main_visual_04.jpg);}
#main_visual04 p a {text-align: center; font-size:17px; margin:30px auto 0 auto; color: #000; width: 180px; height: 60px; border: 1px solid #000; display: block; line-height: 60px; transition: 0.3s;}
#main_visual04 p a:hover {color: #fff; background: #000;}
#main_visual04 .pics {display: none}
#main_visual04 .pics img {width: 100%}
#main_visual04 .main-visual-txt-con .main-visual-txt1, #main_visual04 .main-visual-txt-con .main-visual-txt2, #main_visual04 .main-visual-txt-con .main-visual-txt3 {color: #212121;}


@media all and (max-width:980px){
    #main_visual01 {background-image: url(/images/res/res-main_visual_01.jpg);}
    #main_visual01 .video_background {display: none; }
    #main_visual01 video {display: block;}
    #main_visual03 {background-image: url(/images/res/res-main_visual_03.jpg);}
    #main_visual04 {background:#e6e4e7;}
    #main_visual04 .pics {display: block; margin-bottom: 30px;}
    #main_visual04 p a {font-size: 14px; height: 45px; line-height: 45px; width: 150px; margin-top: 20px;}
    
    #main_visual02 {background-image: url(/images/res/res-visual_sample01.jpg); }
    #main_visual05 {background-image: url(/images/res/res-visual_sample02.jpg);}
    #main_visual06 {background-image: url(/images/res/res-visual_sample03.jpg); background-position: center bottom -100px}
    
    .main-visual-txt-con {transform: none !important; top: 100px !important;}
}



#merit_list__wrap {flex-wrap: wrap; justify-content: space-between; display: none;}
#merit_list__wrap .box {position: relative; background-position: center; background-size: cover; background-repeat: no-repeat; width: 50%; padding:30px 20px; padding-bottom: 30%; box-sizing: border-box; }
#merit_list__wrap .box p {font-size: 16px; font-weight: 600; color: #fff; position: relative; z-index: 1;}
#merit_list__wrap .box i {color: #fff; position: absolute; bottom: 15px; right: 15px; z-index: 1; font-size: 40px;}
#merit_list__wrap .box::after {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); content: '';}
#merit_list__wrap .box#meritBox1 {background-image: url("/images/main/main_prd_img.jpg");}
#merit_list__wrap .box#meritBox2 {background-image: url("/images/main/main_prd_img02.jpg");}
#merit_list__wrap .box#meritBox3 {background-image: url("/images/main/main_prd_img03.jpg");}
#merit_list__wrap .box#meritBox4 {background-image: url("/images/main/main_prd_img04.jpg");}
#merit_list__wrap .box#meritBox5 {background-image: url("/images/main/main_prd_img05.jpg");}
#merit_list__wrap .box#meritBox6 {background-image: url("/images/main/main_prd_img06_1.jpg");}

@media all and (max-width:980px) {
    #merit_list__wrap {display: flex;}
}



.merit_pop {position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0,0,0,0.5); z-index: 9999; box-sizing: border-box; padding: 30px; display: none;}
.merit_pop .wrap {width: 100%; background: #fff; box-sizing: border-box; padding: 30px;}
.merit_pop .text { margin-bottom: 30px;}
.merit_pop .text h3 {font-size: 25px; color: #212121; margin: 10px 0;}
.merit_pop .text p {font-size: 14px; line-height: 1.6;}
.merit_pop .text p strong { color: #212121;}
.merit_pop .pics {}
.merit_pop .pics img {width: 100%;}
.merit_pop .modal_close {border: 0; background-color: transparent; position: absolute; top: 40px; right: 40px; font-size: 30px;}
.merit_pop.show {display: block;}



#main_notice__wrap {position: absolute; bottom: 0; left: 0; box-sizing: border-box; padding: 40px 100px;; background: rgba(255,255,255,0.9); z-index: 199; display: flex; flex-wrap: wrap; width: 45%; overflow: hidden; justify-content: space-between;}
#main_notice__wrap .title {font-size: 21px; font-weight: 600; color: #000; width: 15%;}
#main_notice__wrap .cont {width: 80%}
#main_notice__wrap .cont p {font-size: 18px; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
#main_notice__wrap .cont p span {color: #9a9a9a; font-size: 15px; display: block; padding-top: 30px;}
#main_notice__wrap .cont:hover p {color: #000}
#main_notice__wrap .cont:hover p span {color: #04314e}

@media all and (max-width:1100px ){
    #main_notice__wrap  {padding-left: 50px; padding-right: 50px}
}

@media all and (max-width:980px ){
    #main_notice__wrap {width: 100%; padding: 40px 20px; position: relative; background: #fff; box-sizing: border-box; padding-left: 110px;}
    #main_notice__wrap .title {position: absolute; top: 40px; left: 20px; font-size: 21px; font-weight: 700; width: auto;}
    #main_notice__wrap .cont {width: 100%}
    #main_notice__wrap .cont p {font-size: 14px;}
    #main_notice__wrap .cont p span {font-size: 12px; padding-top: 15px;}
    
}

#scroll-down {display: block; position: absolute; text-align: center; bottom: 30px; left: 50%; z-index: 9999; transform: translateX(-50%); padding-top:59px;}
.arrow-down {display: block;margin: 0 auto; width: 10px;height: 28px;}
.arrow-down:after {content: '';display: block;margin: 0;padding: 0;width: 8px;height: 8px;border-top: 2px solid #fff;border-right: 2px solid #fff;behavior: url(-ms-transform.htc);-moz-transform: rotate(135deg);-webkit-transform: rotate(135deg);-o-transform: rotate(135deg);-ms-transform: rotate(135deg);transform: rotate(135deg);}
#scroll-title {display: block;text-transform: uppercase;color: #fff;font-size:13px;font-weight:bold;letter-spacing:.1em;}
#scroll-down::before {
    -webkit-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
    /* Safari 4+ */
    
    -moz-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
    /* Fx 5+ */
    
    -o-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
    /* Opera 12+ */
    
    animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
    /* IE 10+, Fx 29+ */
    
    position: absolute;
    top: 0px;
    left: 50%;
    margin-left: -1px;
    width: 2px;
    height: 70px;
    background: #fff;
    content: ' ';
}
@-webkit-keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
}
@-moz-keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
}
@-o-keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
}
@keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
}


@media all and (max-width:980px) {
    #scroll-down {bottom: 40px; padding-top: 30px;}
    #scroll-title {font-size: 10px;}
    #scroll-down::before {height: 40px;}
    .arrow-down {height: 20px}
    
}