/* layout */
#container{padding:0}
#container.menuon header,
.header.simple header{background-color:#fff}
header{background:none}


/* main */
.slick-dots{font-size:0}
.slick-dots li{display:Inline-block;margin:0 14px}
.slick-dots li button{
	display:block;width:20px;height:20px;
	background:#ece9e9;border-radius:20px;
	transition:.3s;
	font-size:0;
}
.slick-dots li.slick-active button{width:85px;background:#ec5a68}

#main section{position:relative;}
/*
#main section:after{
	content:'';
	position:absolute;top:400px;left:0;
	display:block;width:100%;height:100%
}
*/

/* 캐릭터 */
#main section:before{
	content:'';
	position:absolute;
	display:block;
	background-position:center;background-size:100% auto;background-repeat:no-repeat;
	z-index:299
}

@keyframes bounce1 {
    from {margin-top:3px;transform:rotate(2deg) scale(1)}
    to {margin-top:0;transform:rotate(-2deg) scale(1)}
}
@keyframes bounce2 {
    from {margin-bottom:3px;transform:rotate(2deg) scale(1)}
    to {margin-bottom:0;transform:rotate(-2deg) scale(1)}
}
#main h3{
	padding:120px 0 40px;
	text-align:center;font-size:40px;font-weight:800;
}
#main h3 b{font-weight:800;color:#EC5A68}
#main h3 span{display:block;margin-top:10px;font-size:20px;color:#767676;font-weight:400}

#main article{padding-bottom:300px;z-index:1}
/*
#main .visual_list:before{
	content:'';
	position:absolute;bottom:300px;right:200px;
	display:block;width:500px;height:265px;
	background:url(../img/index/visual2_txt.svg) no-repeat center 0;
	background-size:100% auto;
	z-index:10
}
*/
#main .visual_list{position:relative;z-index:1}
#main .visual_list .slick-slide{height:100vh;background-position:center;background-repeat:no-repeat;background-size:auto 100%}
#main .visual_list .slick-slide:before{
	content:'';
	position:absolute;
	background-position:center 0;background-repeat:no-repeat;background-size:100% auto;
	animation: bounce1 1s linear infinite alternate;
	transform-origin:center;
	transition:.7s;transform:scale(0);opacity:0;transition-delay:.5s;
	z-index:1
}
#main .visual_list .slick-slide:after{
	content:'';
	position:absolute;bottom:300px;right:200px;
	display:block;width:500px;height:265px;
	background:url(../img/index/visual2_txt.svg) no-repeat center 0;
	background-size:100% auto;
	transform-origin:center;
	transition:.5s;transform:scale(0);opacity:0;
	transition-delay:.2s
}
#main .visual_list .slick-slide.slick-active:before,
#main .visual_list .slick-slide.slick-active:after{transform:scale(1);opacity:1}
#main .visual_list .slick-slide.li1:before{top:180px;right:100px;width:204px;height:179px;background-image:url(../img/ico/Character1.png);}
#main .visual_list .slick-slide.li2:before{left:80px;bottom:150px;width:174px;height:174px;background-image:url(../img/ico/Character5.png);animation: bounce2 1s linear infinite alternate;}
#main .visual_list .slick-dots{position:absolute;right:200px;bottom:200px;}

/*visual_v2*/
#main .visual_v2 #visual_svg{position:absolute;}
#main .visual_v2 .slick-slide{min-height:1000px;}
#main .visual_v2 .slick-slide>div{
	position:absolute;top:0;left:50%;
	width:1800px;height:100%;
	margin:0 auto;
	transform:translateX(-50%);
	background-position:center;background-repeat:no-repeat;background-size:cover;
	clip-path: url(#cut);
}
/*visual_v2 end*/


#main .merits{background:#fff8ef}
#main .merits article{width:1619px}
#main .merits h3 b{display:block;line-height:1.2em}
#main .merits:before{
	bottom:0;left:100px;
	width:259px;height:250px;background-image:url(../img/ico/Character2.png);
	animation: bounce2 1s linear infinite alternate;
	transform-origin:center;
}
#main .merits .bg{margin-top:-700px}
#main .merits_list{padding:0 100px}
#main .merits .slick-arrow{
	position:absolute;top:50%;
	display:block;width:36px;height:61px;
	margin-top:-30px;
	background:url(../img/index/btn_next.png) no-repeat center;background-size:100% auto;
	font-size:0;z-index:10
}
#main .merits .slick-arrow.slick-next{right:0;}
#main .merits .slick-arrow.slick-prev{left:0;background-image:url(../img/index/btn_prev.png)}
#main .merits .slick-arrow.slick-disabled{opacity:0.2}
#main .merits .slick-slide{
	display:flex;flex-direction: row-reverse;
	height:auto !important;
}
#main .merits .slick-slide p{flex:none}
#main .merits .slick-slide dl{
	flex:auto;
	padding:5vw 5vw 0;
	background:#fff;
}
#main .merits .slick-slide dl dt{
	font-size:32px;color: #EC5A68;font-weight:800;
}
#main .merits .slick-slide dl dt b{
	display:block;
	margin:10px 0 20px;
	font-size:46px;color:#222;font-weight:800;line-height:1.3em;letter-spacing:-1px
}
#main .merits .slick-slide dl dd{font-size:27px;color:#666}
#main .merits .slick-dots{
	position:absolute;left:calc(5vw + 100px);bottom:4vw;
	z-index:10
}
#main .merits .slick-dots li{margin:0 15px 0 0}
#main .merits .slick-dots li button{width:10px;height:10px}




#main .team:before{
	bottom:-87px;right:100px;
	width:225px;height:200px;background-image:url(../img/ico/Character3.png);
	animation: bounce2 1s linear infinite alternate;
	transform-origin:center;
}
#main .team .bg{margin-top:-700px}
#main .team{background:#293763}
#main .team article:after{
	content:'';
	position:absolute;left:100%;bottom:0;
	display:block;width:555px;height:420px;
	margin:0 0 -100px -146px;
	background:url(../img/index/bg_icon.png) no-repeat;
	z-index:1
}
#main .team h3,
#main .team h3 span{color:#fff}
#main .team ul{display:flex;gap:20px}
#main .team ul li{flex:1;text-align:center;font-size:25px;}
#main .team ul li img{display:block;margin:0 auto 20px}
#main .team ul li b{display:block;margin-bottom:20px;font-weight:800;color:#fff}
#main .team ul li a{margin:5px}

#main .facilities .bg{margin-top:-600px}
#main .facilities article{width:100%;max-width:100%;padding-bottom:0;display:flex;align-items: center;}
#main .facilities article>div{flex:1;width:50%;box-sizing:border-box;}
#main .facilities h3{padding-top:0;text-align:left}
#main .facilities h3 b{display:block;line-height:1em}
#main .facilities #facilities_pic{flex:1;position:relative;height:46vw;max-height:880px}
#main .facilities #facilities_pic img{display:block;position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;visibility:hidden;opacity:0;transition:.8s}
#main .facilities #facilities_pic img.active{visibility:visible;opacity:1}
#main .facilities .facilities_ct{padding-left:80px}
#main .facilities_list dt{margin-bottom:20px;font-size:20px;color:#666;} 
#main .facilities_list dt b{display:block;margin-bottom:8px;font-size:30px;color:#222;font-weight:800}
#main .facilities_list .slick-dots{margin-top:60px}
#main .facilities_list .slick-dots li{margin:0 7px}
#main .facilities_list .slick-dots li button{width:10px;height:10px}

#main .menu:before{
	top:-100px;left:100px;
	width:206px;height:254px;background-image:url(../img/ico/Character4_v.png);
	animation: bounce1 1s linear infinite alternate;
	transform-origin:center;
}
#main .menu article{width:1156px;padding:100px 0 50px}
#main .menu_list{display:flex;gap:30px}
#main .menu_list li{flex:1;text-align:center}
#main .menu_list li img{display:block;margin:0 auto 30px;}
#main .menu_list li a{display:block;font-size:20px;font-weight:800;color:#222}
#main .menu table{display:block;margin-top:100px;}
#main .menu table tbody{display:flex;gap:30px;align-items: center;}
#main .menu table tbody tr{flex:1;background:#fff;border-radius:40px;box-sizing:border-box;padding:40px;transition:.4s}
#main .menu table tbody tr td{display:block;width:100%;text-align:left;font-size:14px;}
#main .menu table tbody tr td a{display:block;height:48px;margin-top:10px;font-size:16px;color:222;font-weight:700}
#main .menu table tbody tr td img{display:None}
.web #main .menu table tbody tr:hover{box-shadow:0 0 20px rgba(0,0,0,0.1);border-radius:20px}

#main .contact:before{
	top:100px;right:100px;
	width:204px;height:179px;background-image:url(../img/ico/Character1.png);
	animation: bounce1 1s linear infinite alternate;
	transform-origin:center;
}
#main .contact{background:#fff8ef}
#main .contact article{padding-bottom:180px}
#main .contact .maparea{border-radius:50px;overflow:Hidden;}
#main .contact .maparea iframe{width:100%;height:350px;border:0}
#main .contact .info{display:flex;margin-top:56px}
#main .contact .info dl{
	flex:1;
	position:relative;
	box-sizing:border-box;
	padding-left:180px;
}
#main .contact .info dl dt{position:absolute;left:64px;top:0;font-size:16px;font-weight:800}
#main .contact .info dl dd{
	position:relative;
	padding-left:10px;margin-bottom:10px;
	font-size:14px;
}
#main .contact .info dl dd a{font-size:16px;font-weight:700;color:#222}
#main .contact .info dl dd a b{color:#EC5A68;font-weight:800}
#main .contact .info dl dd span{display:inline-block;width:60px;}
#main .contact .info dl dd small{display:inline-block;margin-top:10px}
#main .contact .info dl dd:before{
	content:'';
	position:absolute;top:8px;left:0;
	display:block;width:3px;height:3px;
	background:#222;border-radius:50%
}
#main .contact .info dl dd button{margin-top:10px}
#main .contact .info .btn_ani{margin:15px 0 0 -10px;}
#main .contact .info .btn_ani span{width:230px}

/* 물결 */
.wave:after{
	content:'';
	position:absolute;top:-150px;left:0;width:6400px;height:300px;
	background:#fff url(../img/index/wave_pink.svg) repeat-x; 
	animation: wave_main 15s cubic-bezier( 0.36, 0.45, 0.63, 0.53) infinite;
	transform: translate3d(0, 0, 0);
}
.team.wave:after{background-color:#fff8ef;background-image:url(../img/index/wave_blue.svg)}
.facilities.wave:after{background-color:#293763;background-image:url(../img/index/wave_white.svg)}
.contact.wave:after{top:-300px}
@keyframes wave_main {
  0% {
    margin-left: 0;
  }
  100% {
    margin-left: -1600px;
  }
}
/* bg 
.bg{position:absolute;top:0;left:0;width:2580px;height:1200px}
.path-0{
	animation:pathAnim-0 8s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.path-1{
	animation:pathAnim-1 9s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
@keyframes pathAnim-0{
	0%{
	d: path("M 0,600 C 0,600 0,300 0,300 C 128.53333333333336,338.6666666666667 257.0666666666667,377.33333333333337 412,345 C 566.9333333333333,312.66666666666663 748.2666666666667,209.33333333333331 924,190 C 1099.7333333333333,170.66666666666669 1269.8666666666668,235.33333333333334 1440,300 C 1440,300 1440,600 1440,600 Z");
	}
	25%{
	d: path("M 0,600 C 0,600 0,300 0,300 C 204.40000000000003,279.3333333333333 408.80000000000007,258.66666666666663 562,257 C 715.1999999999999,255.33333333333334 817.2,272.6666666666667 955,283 C 1092.8,293.3333333333333 1266.4,296.66666666666663 1440,300 C 1440,300 1440,600 1440,600 Z");
	}
	50%{
	d: path("M 0,600 C 0,600 0,300 0,300 C 205.86666666666667,254.79999999999998 411.73333333333335,209.59999999999997 546,205 C 680.2666666666667,200.40000000000003 742.9333333333333,236.40000000000003 880,259 C 1017.0666666666667,281.59999999999997 1228.5333333333333,290.79999999999995 1440,300 C 1440,300 1440,600 1440,600 Z");
	}
	75%{
	d: path("M 0,600 C 0,600 0,300 0,300 C 157.86666666666667,343.8666666666667 315.73333333333335,387.7333333333333 466,397 C 616.2666666666667,406.2666666666667 758.9333333333334,380.9333333333333 920,359 C 1081.0666666666666,337.0666666666667 1260.5333333333333,318.53333333333336 1440,300 C 1440,300 1440,600 1440,600 Z");
	}
	100%{
	d: path("M 0,600 C 0,600 0,300 0,300 C 128.53333333333336,338.6666666666667 257.0666666666667,377.33333333333337 412,345 C 566.9333333333333,312.66666666666663 748.2666666666667,209.33333333333331 924,190 C 1099.7333333333333,170.66666666666669 1269.8666666666668,235.33333333333334 1440,300 C 1440,300 1440,600 1440,600 Z");
	}
}

@keyframes pathAnim-1{
	0%{
	d: path("M 0,600 C 0,600 0,300 0,300 C 128.53333333333336,338.6666666666667 257.0666666666667,377.33333333333337 412,345 C 566.9333333333333,312.66666666666663 748.2666666666667,209.33333333333331 924,190 C 1099.7333333333333,170.66666666666669 1269.8666666666668,235.33333333333334 1440,300 C 1440,300 1440,600 1440,600 Z");
	}
	25%{
	d: path("M 0,600 C 0,600 0,300 0,300 C 204.40000000000003,279.3333333333333 408.80000000000007,258.66666666666663 562,257 C 715.1999999999999,255.33333333333334 817.2,272.6666666666667 955,283 C 1092.8,293.3333333333333 1266.4,296.66666666666663 1440,300 C 1440,300 1440,600 1440,600 Z");
	}
	50%{
	d: path("M 0,600 C 0,600 0,300 0,300 C 205.86666666666667,254.79999999999998 411.73333333333335,209.59999999999997 546,205 C 680.2666666666667,200.40000000000003 742.9333333333333,236.40000000000003 880,259 C 1017.0666666666667,281.59999999999997 1228.5333333333333,290.79999999999995 1440,300 C 1440,300 1440,600 1440,600 Z");
	}
	75%{
	d: path("M 0,600 C 0,600 0,300 0,300 C 157.86666666666667,343.8666666666667 315.73333333333335,387.7333333333333 466,397 C 616.2666666666667,406.2666666666667 758.9333333333334,380.9333333333333 920,359 C 1081.0666666666666,337.0666666666667 1260.5333333333333,318.53333333333336 1440,300 C 1440,300 1440,600 1440,600 Z");
	}
	100%{
	d: path("M 0,600 C 0,600 0,300 0,300 C 128.53333333333336,338.6666666666667 257.0666666666667,377.33333333333337 412,345 C 566.9333333333333,312.66666666666663 748.2666666666667,209.33333333333331 924,190 C 1099.7333333333333,170.66666666666669 1269.8666666666668,235.33333333333334 1440,300 C 1440,300 1440,600 1440,600 Z");
	}
}
*/

@media only screen and (max-width: 1800px){
	#main .merits_list{padding:0 50px}
	#main .merits .slick-arrow{width:26px}
	#main .merits .slick-dots{left:110px;bottom:50px}
	#main .merits .slick-slide p,
	#main .merits .slick-slide dl{flex:1}
	#main .merits .slick-slide dl{padding:60px 60px 100px;}
	#main .merits .slick-slide p img{object-fit:cover;width:100%;height:100%}
	#main .merits .slick-slide dl dt,
	#main .merits .slick-slide dl dt b{font-size:28px}
	#main .merits .slick-slide dl dd{font-size:25px}
}
@media only screen and (max-width: 1400px){
}

@media only screen and (max-width: 1024px){
	#main h3{padding:100px 40px 30px;font-size:30px}
	#main h3 span{font-size:18px;}

	#main article{padding-bottom:200px}

	#main .visual_list .slick-dots{bottom:100px;right:auto;left:20px}
	#main .visual_list .slick-slide:after{right:20px;bottom:150px;width:350px;height:190px;}
	#main .visual_list .slick-slide.li1:before{top:90px;right:20px;width:120px;height:120px;}
	#main .visual_list .slick-slide.li2:before{left:20px;width:120px;height:120px;}
	
	#main .merits .slick-arrow{width:22px}
	#main .merits .slick-dots{left:90px;bottom:30px}
	#main .merits .slick-slide dl{padding:40px 40px 80px}
	#main .merits .slick-slide dl dt,
	#main .merits .slick-slide dl dt b{font-size:22px}
	#main .merits .slick-slide dl dd{font-size:18px}

	#main .team ul li{font-size:18px}
	#main .team ul li img{max-width:80%}

	#main .facilities article{display:block;}
	#main .facilities article>div{width:100%}
	#main .facilities h3{text-align:center}
	#main .facilities h3 b{display:inline}
	#main .facilities .facilities_ct{padding:80px 80px 0}
	#main .facilities_list .slick-slide{height:auto}
	#main .facilities_list .slick-dots,
	#main .facilities_list dt,
	#main .facilities_list dd{text-align:center;}

	#main .contact .info{display:block;}
	#main .contact .info dl dd button{margin:0 0 0 10px}
	#main .contact .info dl+dl{margin-top:30px}
	#main .contact .info .btn_ani{display:block;width:230px}

	#main .merits:before{left:50px;width:103px;height:99px}
	#main .team:before{width:103px;height:80px}
	#main .menu:before{left:50px;width:103px;height:126px}
	#main .contact:before{width:103px;height:91px}
}

@media only screen and (max-width: 760px){
	#main h3{padding:80px 40px 25px;font-size:20px}
	#main h3 span{font-size:14px;}

	#main article{padding-bottom:100px}
	.slick-dots li{margin:0 5px}
	.slick-dots li button{width:10px;height:10px}
	.slick-dots li.slick-active button{width:40px}

	#main .visual_list .slick-slide:after{bottom:auto;bottom:100px;width:65%;max-width:300px;background-position:right bottom;display:None}
	#main .visual_list .slick-slide.li1:before{top:70px;right:0px;width:100px;height:100px;}
	#main .visual_list .slick-slide.li2:before{left:20px;bottom:130px;width:70px;height:70px;}
	
	#main .merits_list{padding:0 15px}
	#main .merits .slick-arrow.slick-prev{left:-8px}
	#main .merits .slick-arrow.slick-next{right:-8px}
	#main .merits .slick-arrow{width:14px}
	#main .merits .slick-dots{left:0;bottom:20px;width:100%;text-align:center}
	#main .merits .slick-dots li{margin:0 4px;}
	#main .merits .slick-slide{display:block;}
	#main .merits .slick-slide p img{height:auto}
	#main .merits .slick-slide dl{padding:20px 25px 60px;text-align:center}
	#main .merits .slick-slide dl dt,
	#main .merits .slick-slide dl dt b{font-size:20px}
	#main .merits .slick-slide dl dd{font-size:16px}
	
	#main .team article:after{display:None}
	#main .team ul li{font-size:14px}
	#main .team ul li img{max-width:90%}
	
	#main .facilities #facilities_pic{height:82vw}
	#main .facilities .facilities_ct{padding:40px 40px 0}
	#main .facilities_list dt{text-align:center;font-size:14px}
	#main .facilities_list dt b{font-size:16px;}

	#main .menu article{padding:0}
	#main .menu .bg{margin-top:-200px}
	#main .menu_list{flex-flow:wrap;gap:0}
	#main .menu_list li{min-width:50%;box-sizing:border-box;padding:10px;}
	#main .menu_list li a{font-size:16px}
	#main .menu_list li img{margin-bottom:15px;}
	
	#main .menu table{margin-top:50px;}
	#main .menu table tbody{flex-flow:wrap;gap:0;padding-bottom:1px;}
	#main .menu table tbody tr{min-width:calc(50% - 20px);margin:10px;padding:30px;border-radius:30px}
	#main .menu table tbody tr td a{height:42px;font-size:14px;}

	#main .contact article{padding-bottom:100px}
	#main .contact .info dl{padding-left:85px}
	#main .contact .info dl dt{left:10px;font-size:14px;}

	#main .merits:before{left:20px;bottom:-50px}
	#main .team:before{bottom:-40px;right:10px}
	#main .menu:before{left:20px;top:-35px;width:80px}
	#main .contact:before{right:0}

	.wave:after{height:163px;background-size:auto 100%;top:-38px;}
	.facilities.wave:after{display:none}
	.contact.wave:after{height:300px}

}


#main .interview:before{
	bottom:0;left:100px;
	width:259px;height:250px;background-image:url(../img/ico/Character2.png);
	animation: bounce2 .7s linear infinite alternate;
}
#main .interview .bg{margin-top:-700px}
#main .interview{background:#fff8ef}
#main .interview ul{display:flex;gap:20px}
#main .interview ul li{flex:1;text-align:center;font-size:25px;}
#main .interview ul li img{display:block;margin:0 auto 20px}
#main .interview ul li b{display:block;font-weight:800}
#main .interview ul li a{margin-top:20px;}

@media only screen and (max-width: 1024px){
	#main .interview:before{left:50px;width:103px;height:99px}
	#main .interview ul{gap:10px}
	#main .interview ul li{font-size:18px}
	#main .interview ul li img{max-width:60%}
}

@media only screen and (max-width: 760px){
	#main .interview ul li{font-size:14px}
	#main .interview ul li a{margin-top:10px}
	#main .interview:before{left:20px;bottom:-50px}
}