@charset "utf-8";
.slick-vertical .slick-slide{border:none;}
#container_main{overflow:hidden; width:100%;}

#visual{z-index:1; position:relative; height:610px; background:url(/images/ch/main/bg.jpg) no-repeat 50% 50%;}

.slogan{padding:70px 0 0 0; color:#fff; line-height:150%; font-size:20px; word-break:keep-all; box-sizing:border-box;}
.slogan:before{z-index:-1; content:''; display:block; position:absolute; top:0; right:50%; width:685px; height:500px; margin:0 -600px 0 0; background: url(/images/ch/main/bg_ch.png) no-repeat 100% 100%;}
.slogan .txt1 p{animation:slideup 0.6s both;}
.slogan .txt1 p{line-height:175%; font-weight:600; text-shadow:0 0 4px #000;}

.slogan .txt1 p:nth-of-type(1){animation-delay:0.3s;}
.slogan .txt1 p:nth-of-type(2){animation-delay:0.7s;}
.slogan .txt1 p:nth-of-type(3){animation-delay:1.4s;}
.slogan .txt2{padding:0 0 0 5px; animation:slideup 0.55s both; animation-delay:2.0s;}
.slogan .txt2:before{content:''; display:block; width:30px; height:2px; margin:36px 0 35px; background:#fff;}

@keyframes slideup{
	0%{transform:translateY(20px); opacity:0; visibility:hidden;}
	100%{transform:translateY(0); opacity:1; visibility:visible;}
}

@media all and (max-width:1230px) {
	.slogan{padding-left:15px;}
	.slogan:before{width:53%; right:10px; margin:0; background-size:contain;}
}
@media all and (max-width:1024px) {
	#visual{height:495px; background-size:cover;}
	.slogan{padding:40px 0 0 15px; font-size:18px;}
	.slogan:before{height:410px; width:48%;}
	.slogan .txt1 img{width:450px;}
	.slogan .txt2:before{margin:30px 0 27px;}
}
@media all and (max-width:768px) {
	#visual{height:465px;}
	.slogan{padding:30px 0 0 13px; font-size:17px;}
	.slogan:before{right:5px; width:52%;}
	.slogan .txt1 img{width:370px;}
	.slogan .txt2:before{margin:20px 0 17px;}
}
@media all and (max-width:568px) {
	.slogan{padding:25px 0 0 13px; font-size:16px;}
	.slogan:before{width:280px; max-width:68%;}
	.slogan .txt1 img{width:320px;}
}
@media all and (max-width:380px) {
	#visual{height:430px;}
	.slogan{padding:20px 0 0 11px; font-size:15px;}
	.slogan:before{height:370px;}
	.slogan .txt1 img{width:300px;}
}

/* 바로가기 */
#link{position:relative; z-index:2; width:100%; margin:-140px 0 0 0; height:280px; padding:30px 0 0 0; box-sizing:border-box;}
#link:before{content:''; display:block; position: absolute; left:50%; top:0; width:100%; height:100%; margin:0 0 0 -600px; border-radius:280px 0 0 280px; box-shadow:0 0 15px rgba(4,30,22,0.3); background:#4f67d6 url(/images/ch/main/bg_link.jpg) no-repeat;}
#link .list_wrap{width:100%; padding: 0 70px 0 110px; box-sizing:border-box;}
#link .list {display:inline-block; vertical-align:top; width:24%; line-height:120%; text-align:center;}
#link .list a{display:inline-block; z-index:1; position:relative; width:186px; height:210px; color:#fff; text-align:center;}
#link .list span{display:block; position:absolute; bottom:0; right:-7px; width:100px; height:100px; padding:31px 0 0 0; line-height:110%; font-weight:800; font-size:18px; border-radius:50%; background:rgba(0,0,0,0.7); box-sizing:border-box; transition:0.3s ease-in-out;}
#link .list1 span{padding:41px 0 0 0;}
#link .list a:before,
#link .list a:after{content:''; display:block; position:absolute; top:0; left:50%; width:180px; height:200px; border-radius:0 0 180px 180px; transform:translateX(-50%); background:url(/images/ch/main/bg_link1.png) no-repeat 50% 0;}
#link .list a:after{z-index:-1; top:20px; height:180px; border-radius:50%; box-shadow:0 0 15px rgba(4,30,22,0.5); transition:0.3s ease-in-out; background:#21cf9c;}
#link .list2 a:before{background-image:url(/images/ch/main/bg_link2.png);}
#link .list3 a:before{background-image:url(/images/ch/main/bg_link3.png);}
#link .list4 a:before{background-image:url(/images/ch/main/bg_link4.png);}
#link .list5 a:before{background-image:url(/images/ch/main/bg_link5.png);}
#link .list6 a:before{background-image:url(/images/ch/main/bg_link6.png);}
#link .list a:hover:after{box-shadow:0 0 0 3px #fff;}
#link .list a:hover span{color:#fdd000; background:#000;}

#link .control{z-index:55; position:absolute; top:50%; left:0; width:100%; margin:-25px 0 0 0;}
#link .control button{position:absolute; top:0; left:50px; display:block; width:50px; height:50px; font-size:0; text-indent:-999px; border-radius:50%; background:#fff url(/images/ch/main/ico_ctrl.png) no-repeat -59px 14px;}
#link .control .btn_next{left:auto; right:0; background-position:-112px 14px;}
#link .control .slick-disabled{background-color:rgba(255,255,255,0.5);}

@media all and (max-width:1230px) {
	#link .control .btn_next{right:15px;}
	#link:before{left:15px; margin:0;}
	#link .list_wrap{padding:0 70px 0 90px;}
}
@media all and (max-width:1024px) {
	#link{height:210px; padding:20px 0 0 0; margin:-105px 0 0 0;}
	#link:before{background-size:cover;}
	#link .list a{width:136px; height:155px;}
	#link .list a:before{width:130px; height:145px; border-radius:0 0 130px 130px; background-size:100% auto;}
	#link .list a:after{top:14px; width:130px; height:130px;}
	#link .list span{right:-3px; width:80px; height:80px; padding:23px 0 0 0; font-size:17px;}
	#link .list1 span{padding:31px 0 0 0;}
	#link .control{margin:-22px 0 0 0;}
	#link .control button{left:46px; width:45px; height:45px; background-position:-62px 12px;}
	#link .control .btn_next{background-position:-116px 12px;}

}
@media all and (max-width:768px) {
	#link{height:183px; margin:-91px 0 0 0;}
	#link:before{left:10px;}
	#link .list_wrap{padding:0 60px 0 75px;}
	#link .list a{width:100%; height:auto; padding:115px 0 0 0;}
	#link .list a:before{width:90px; height:100px; border-radius:0 0 90px 90px;}
	#link .list a:after{top:10px; width:90px; height:90px;}
	#link .list span{position:static; width:100%; height:auto; padding:0; font-size:16px; border-radius:10px; background:none;}
	#link .list br{display:none;}
	#link .control {margin:-20px 0 0 0;}
	#link .control button{left:35px; width:40px; height:40px; background-position:-64px 9px;}
	#link .control .btn_next{background-position:-118px 9px;}
	#link .list a:hover span{background:none;}
}
@media all and (max-width:568px) {
	#link{height:auto; padding:0;  margin:-71px 0 0 0;}
	#link:before,
	#link .control{display:none;}
	#link .list_wrap{padding:20px 20px 13px; border-radius:10px; background:#4f67d6 url(/images/ch/main/bg_link.jpg) no-repeat;}
	#link .list{width:33%; margin:0 0 13px;}
	#link .list a{padding:94px 0 0 0;}
	#link .list a:before{width:74px; height:82px; border-radius:0 0 74px 74px;}
	#link .list a:after{top:8px; width:74px; height:74px;}

}
@media all and (max-width:380px) {
	#link .list_wrap{padding:20px 12px 13px;}
	#link .list a{padding:90px 0 0 0;}
	#link .list a:before{width:70px; height:78px; border-radius:0 0 70px 70px;}
	#link .list a:after{width:70px; height:70px;}
	#link .list span{font-size:15px;}
}
@media all and (max-width:330px) {
	#link .list_wrap{padding:20px 5px 13px;}
}

/* 사진첩 */
#gallery {float:left; position:relative; width:100%; height:528px; padding:75px 0 0 0;}
#gallery .inner{width:1274px;}
#gallery h4{position:absolute; top:0; left:0; width:100%; line-height:100%; color:#333; font-size:45px; letter-spacing:-3px; font-family:"score"; font-weight:500; text-align:center;}
#gallery h4 span{color:#ef3948;}
#gallery ul{float:left; padding:0 0 0 37px;}
#gallery li{float:left; margin:0 5px 0 0;}
#gallery li > a:not(.more){z-index:1; overflow:hidden; position:relative; float:left; width:90px; line-height:44px; font-weight:400; font-family:"score"; font-size:18px; border:1px solid #ccc; border-radius:5px; text-align:center; box-sizing:border-box; text-decoration:none;}
#gallery li.on > a:not(.more),
#gallery li > a:not(.more):hover{color:#fff; border-color:#ef3948; transition:color 0.25s linear, border-color 0s 0.2s ease-in-out;}
#gallery li > a:not(.more):before{z-index:-1; opacity:0; content:''; display:block; position:absolute; top:-5%; left:-130%; width:120%; height:110%; margin:0; background:#ef3948; transform:skew(-20deg); transition:0.25s linear;}
#gallery li > a:not(.more):hover:before,
#gallery li.on > a:not(.more):before{opacity:1; left:-10%;}


#gallery .list_wrap{display:none; position:absolute; top:0; left:0; width:100%; box-sizing:border-box;}
#gallery li.on .list_wrap{display:block;}
#gallery .list_wrap .list:not(:first-of-type){display:none;}
#gallery .list_wrap.slick-initialized .list:not(:first-of-type){display:inline-block;}
#gallery .list{float:left; margin:0 0 30px;}
#gallery .list *{display:block;}
#gallery .list a{position:relative; overflow:hidden; width:350px; margin:114px 37px 0 38px; text-decoration:none; border-radius:10px; box-shadow:0 0 12px rgba(0,0,0,0.1); transition:0.25s ease-in-out;}
#gallery .img{z-index:2; position:relative; overflow:hidden; width:100%;}
#gallery .list a:hover{box-shadow:0 0 27px rgba(0,0,0,0.15);}
#gallery .img img{width:100%; height:220px; transition:0.3s ease;}
#gallery a:hover img{transform:scale(1.1);}
#gallery .sbj{position:relative; height:92px; padding:19px 5px 0 20px; box-sizing:border-box;}

#gallery .tab2 .img:after{z-index:1; content:''; position:absolute; top:50%; left:50%; width:51px; height:50px; margin:-25px 0 0 -25px; background:url(/images/ch/main/ico_play.png) no-repeat 50% 50%;}
#gallery .tab2 .list a:hover .img:after{transform:rotate(360deg); transition:0.6s ease-in-out;}

#gallery .tit{display:inline-block; line-height:110%; max-width:98%; padding:10px 20px 0 0; font-size:18px; font-weight:400; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; box-sizing:border-box;}
#gallery .new{display:inline-block; vertical-align:bottom; width:18px; height:18px; line-height:18px; margin:-2px 0 0 -20px; font-size:10px; font-weight:400; border-radius:50%; text-transform:uppercase; text-align:center; color:#fff; background:#e05454;}
#gallery .date{line-height:110%; color:#ef3948;}

#gallery a:hover .tit,
#gallery a:focus .tit{text-decoration:underline;}
#gallery .more,
#gallery .slick-arrow{width:44px; height:44px; padding:0 !important; font-size:0; text-indent:-999px; border-radius:50%; border:1px solid #cdcdcd; background:url(/images/ch/main/ico_ctrl.png) no-repeat -10px -51px;}
#gallery .more:before{display:none;}
#gallery .more,
#gallery .slick-arrow{z-index:2; position:absolute; right:37px; top:0;}

#gallery .slick-next{right:87px; background-position:-58px -51px;}
#gallery .slick-prev{right:135px;}
#gallery .more:hover,
#gallery .slick-arrow:hover{background-color:rgba(0,0,0,0.03); transition:background-color 0.25s ease-in-out;}
#gallery .more{display:none; background-position:-107px -51px;}
#gallery .on .more{z-index:95; display:block;}

@media all and (max-width:1304px){
	#gallery .inner{width:100%;}
	#gallery .list a{width:calc(100% - 74px);}
}
@media all and (max-width:1230px){
	#gallery h4{left:15px; margin:0;}
	#gallery ul{padding:0 0 0 3px;}

	#gallery .list a{width:calc(100% - 40px); margin:114px 20px 0;}
	
	#gallery .more{right:15px;}
	#gallery .slick-next{right:65px;}
	#gallery .slick-prev{right:113px;}
}
@media all and (max-width:1024px){
	#gallery{height:430px; padding:60px 0 0 0;}
	#gallery h4{top:4px; font-size:28px;}
	#gallery h4 span{font-size:35px;}

	#gallery .list a{width:calc(100% - 30px); margin:81px 15px 0;}
	#gallery .img{height:183px;}
	#gallery .img img{height:100%;}
	#gallery .img div{right:13px; bottom:12px;  width:65px; height:22px; line-height:24px; font-size:13px;}
	#gallery .tit{font-size:17px;}
	#gallery .date{padding:8px 0 0 0; font-size:15px;}
}
@media all and (max-width:768px){
	#gallery {height:395px; padding:50px 0 0 0;}
	#gallery h4 {position:static; padding:0 0 17px; font-size:23px; letter-spacing:-2px;}
	#gallery h4 span{font-size:27px;}
	#gallery li > a:not(.more){width:85px; height:42px; line-height:41px; font-size:17px;}
	#gallery .list a{width:calc(100% - 20px); margin:110px 10px 0;}
	#gallery .img{height:131px;}
	#gallery .sbj{height:auto; padding:13px 5px 18px 15px;}
	#gallery .tit{font-size:16px;}
	#gallery .date{padding:5px 0 0 0; font-size:14px;}
	#gallery .more, #gallery .slick-arrow{top:40px;}
	#gallery .more{right:10px;}
	#gallery .slick-next{right:60px;}
	#gallery .slick-prev{right:108px;}
}
@media all and (max-width:568px){
	#gallery {height:370px; padding:45px 0 0 0;}
	#gallery h4 {font-size:21px;}
	#gallery h4 span{font-size:25px;}
	#gallery li > a:not(.more){width:76px; height:40px; line-height:39px; font-size:16px;}
	#gallery .list_wrap{padding:0 3px;}
	#gallery .list a{width:calc(100% - 14px); margin:105px 7px 0;}
	#gallery .more, #gallery .slick-arrow{top:38px;}
}
@media all and (max-width:380px){
	#gallery{height:330px; padding:42px 0 0 0;}
	#gallery h4 {font-size:20px;}
	#gallery h4 span{font-size:24px;}
	#gallery li > a:not(.more){width:72px; height:37px; line-height:36px; font-size:15px;}
	#gallery .list_wrap{padding:0 4px;}
	#gallery .list a{width:calc(100% - 12px); margin:100px 6px 0;}
	#gallery .sbj{padding:12px 5px 15px 12px;}
	#gallery .tit{padding-top:8px; font-size:15px;}
	#gallery .img{height:108px;}
	#gallery .date{padding:3px 0 0 0; font-size:13px;}
	#gallery .new{width:16px; height:16px; line-height:16px;}
	#gallery .more, #gallery .slick-arrow{top:33px;}
}