@charset "utf-8";
#container_main {position:relative; float:left; width:100%;}

/* 비주얼 */
#visual{overflow:hidden; position:relative; height:477px; color:#111; background:#dedad1;}
#visual:before,
#visual:after{content:''; display:block; position:absolute; top:0; right:56%; width:44%; height:477px; background:#a2bd43 url(../../images/ch/main/bg_left.jpg) no-repeat 100% 0;}
#visual:after{right:auto; left:44%; width:56%; background:#dedad1 url(../../images/ch/main/bg_right.jpg) no-repeat;}
#visual .slogan{padding:100px 0 0 0; color:#fff; font-weight:200; text-shadow:0 0 7px rgba(51,51,51,0.2);}
#visual .en{height:auto; line-height:110%; padding:0 0 10px; font-size:20px; color:#cee383; font-family:"gmarket"; font-weight:900; text-transform:uppercase;}
#visual .tit{display:inline-block; line-height:120%; font-size:50px; font-family:"gmarket"; font-weight:900;}
#visual .tit span{display:block; color:#feffa4;}
#visual .info{padding:10px 0 40px; line-height:150%; font-weight:200;}

#visual .btn_greeting{overflow:hidden; position:relative; display:block; width:241px; height:50px; line-height:50px; padding:0 0 0 31px; border-radius:25px; box-sizing:border-box; background:#8b7d3d; box-sizing:border-box; font-weight:300; font-size:15px; color:#fff;}
#visual .btn_greeting:after{content:''; display:block; position:absolute; top:50%; left:78.4%; width:30px; height:15px; margin:-7px 0 0 0; background:url(../../images/ch/main/ico_greeting.png) no-repeat 100% 0; transition:0.2s linear;}
#visual .btn_greeting:hover:after{width:35px;}

@media all and (max-width:1430px) {
	#visual .slogan{padding-left:15px;}
}
@media all and (max-width:1024px) {
	#visual{height:380px;}
	#visual .slogan{padding:45px 0 0 15px; font-size:15px;}
	#visual .en{font-size:19px;}
	#visual .tit{font-size:34px;}
	#visual .tit span{font-size:35px;}
	#visual .info{padding:10px 0 35px 0; word-break:keep-all;}
	#visual .btn_greeting{width:220px;}
}
@media all and (max-width:768px) {
	#visual{height:auto; text-align:center; background:#a2bd43 url(../../images/ch/main/bg_left.jpg) no-repeat 100% 0 / cover;}
	#visual:before,
	#visual:after{display:none;}
	#visual .en{font-size:17px;}
	#visual .tit{font-size:29px;}
	#visual .tit span{font-size:30px;}
	#visual .slogan{padding:30px 0 50px 0; font-size:15px;}
	#visual .btn_greeting{width:200px; height:43px; padding:0 0 0 20px; margin:0 auto; line-height:44px; text-align:left;}
}
@media all and (max-width:568px) {
	#visual .en{font-size:16px;}
	#visual .tit{font-size:23px;}
	#visual .tit span{font-size:24px;}
	#visual .info{padding:10px 0 27px 0;}
	#visual .slogan{padding:27px 0 40px 0; font-size:14px;}
}
@media all and (max-width:380px) {
	#visual .tit{font-size:22px;}
	#visual .tit span{font-size:23px;}
	#visual .info{padding:10px 0 25px 0;}
}


#link{padding:84px 0 80px 0; text-align:center;}
#link ul{display:inline-block; width:100%;}
#link li{float:left; width:20%;}
#link a{position:relative; display:block; word-break:keep-all; text-decoration:none;}
#link a:before{content:''; display:block; width:100%; height:240px; background:url(../../images/ch/main/ico_lnk1.png) no-repeat 50% 0; box-sizing:border-box;}
#link .list2 a:before{background-image:url(../../images/ch/main/ico_lnk2.png);}
#link .list3 a:before{background-image:url(../../images/ch/main/ico_lnk3.png);}
#link .list4 a:before{background-image:url(../../images/ch/main/ico_lnk4.png);}
#link .list5 a:before{background-image:url(../../images/ch/main/ico_lnk5.png);}
#link strong{display:block; line-height:120%; font-size:19px; font-weight:500;}
#link a:hover:before{animation:ani_link 0.9s ease-in-out;}
@keyframes ani_link {
	0%{transform:translateY(0);}
	25%{transform:translateY(5px);}
	50%{transform:translateY(0);}
	75%{transform:translateY(7px);}
	100%{transform:translateY(0);}
}
@media all and (max-width:1280px) {
	#link a:before{height:205px; background-size:auto 190px;}
}
@media all and (max-width:1024px) {
	#link {padding:60px 0;}
	#link a:before{height:140px; background-size:auto 130px;}
	#link strong{font-size:17px;}
}
@media all and (max-width:768px) {
	#link {padding:50px 0;}
	#link h4{padding:0 0 28px;}
	#link strong{font-size:16px;}
	#link a:before{height:105px; background-size:auto 95px;}
}
@media all and (max-width:568px) {
	#link {padding:40px 0;}
	#link li{float:none; display:inline-block; vertical-align:top; width:30%;}
	#link li:nth-last-child(-n + 2){width:35%; margin:20px 0 0 0;}
	#link strong{font-size:15px;}
}
@media all and (max-width:380px) {
	#link {padding:38px 0;}
	#link a:before{height:100px; background-size:auto 90px;}
	#link strong{font-size:14px;}
}

/* 활동사진 */
#gallery{z-index:1; position:relative; float:left; width:100%; height:551px; box-sizing:border-box; text-align:center; background:url(../../images/ch/main/bg_gallery.jpg) no-repeat 50% 100% / cover;}
#gallery h4{height:45px; padding:59px 0 0 0; font-family:"gmarket"; font-weight:900; font-size:34px;}
#gallery h4 span{color:#5068be;}
#gallery .info{line-height:120%;}
#gallery .inner{width:1570px; padding:0 84px 0 64px; box-sizing:border-box;}
#gallery .list_wrap{width:100%;}
#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;}
#gallery .list *{display:block;}
#gallery .list a{overflow:hidden; width:320px; padding:6px; margin:28px 20px 30px 20px; background:#fff; text-decoration:none; border-radius:10px; box-shadow:0 0 20px rgba(51,51,51,0.2); transition:box-shadow 0.2s ease-in-out; box-sizing:border-box; text-align:left;}
#gallery .list img{width:100%; height:226px; transition:transform 0.3s ease-in-out;}
#gallery .list .img{position:relative; overflow:hidden;}
#gallery .sbj{position:relative; height:98px; padding:17px 0 0 24px; transition:background 0.25s ease-in-out; box-sizing:border-box;}
#gallery .sbj:after{content:''; display:block; position: absolute; bottom:18px; right:14px; width:33px; height:17px; background:url(../../images/ch/main/ico_gallery.png) no-repeat 0 100%;}
#gallery a:hover .sbj:after{background-position:0 0;}
#gallery .tit{position:relative; z-index:1; display:inline-block; max-width:95%; padding:0 20px 0 0; line-height:120%; font-weight:500; color:#000; font-size:17px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; box-sizing:border-box; transition:color 0.25s ease-in-out;}

#gallery .date{padding:12px 0 0 0; line-height:100%; color:#666; font-size:15px;}
#gallery .new{display:inline-block; vertical-align:middle; width:16px; height:16px; line-height:16px; margin:-5px 0 0 -20px; font-size:9px; font-weight:400; text-align:center; color:#fff; border-radius:50%; background:#df4f66; text-transform:uppercase;}
#gallery .list a:hover{box-shadow:0 0 3px rgba(51,51,51,0.2);}
#gallery .list a:hover .tit{font-weight:800; text-decoration:underline;}
#gallery .list a:active img,
#gallery .list a:hover img,
#gallery .list a:focus img{transform:scale(1.1);}

#gallery .control{z-index:1; position:absolute; top:52%; left:0; width:100%;}
#gallery .control button{z-index:2; position:absolute; top:50%; left:0; width:55px; height:55px; border:1px solid #ddd; font-size:0; text-indent:-999px; border-radius:50%; transform:rotate(180deg); box-sizing:border-box; background:#fff url(../../images/kr/main/ico_ctrl_arrow.png) no-repeat 17px -26px;}
#gallery .control button:hover,
#gallery .control button:focus{background-position:17px 21px; border-color: #9a574d;}
#gallery .control .btn_next{left:auto; right:0; transform:rotate(0deg);}

#gallery .more{z-index:2; position:absolute; top:63px; right:85px; display:block; width:50px; height:47px; border-radius:10px; font-size:0; box-shadow:0 0 10px rgba(142,152,199,0.6); text-indent:-999px; box-sizing:border-box; background:#fff url(../../images/ch/main/ico_more.png) no-repeat 50% 50%;}
#gallery .none{padding:50px 0 0 0; text-align:center;}

@media all and (max-width:1590px) {
	#gallery .inner{width:100%;}
	#gallery .control .btn_prev{left:15px;}
	#gallery .control .btn_next{right:15px;}
}
@media all and (max-width:1024px) {
	#gallery {height:auto; text-align:left;}
	#gallery h4{height:auto; padding:45px 0 0 10px; font-size:27px;}
	#gallery .info{padding:5px 0 32px 10px; font-size:13px;}
	#gallery .inner{padding:0 5px;}
	#gallery .list a{width:calc(100% - 20px); margin:0 10px 65px; box-sizing:border-box;}
	#gallery .list img{max-height:175px;}
	#gallery .list .sbj{height:auto; padding:20px 10px;}
	#gallery .list .tit{font-size:17px;}
	#gallery .control{left:auto; top:50px; right:50px; width:116px;}
	#gallery .control button{width:40px; height:40px; background-position:11px -35px;}
	#gallery .control button:hover,
	#gallery .control button:focus{background-position:11px 13px;}
	#gallery .more{top:50px; right:15px; width:40px; height:40px;}
}
@media all and (max-width:768px) {
	#gallery .inner{padding:0 7px;}
	#gallery h4{padding:40px 0 0 8px; font-size:24px;}
	#gallery .list a{width:calc(100% - 16px); margin:0 8px 60px;}
	#gallery .list img{max-height:127px;}
	#gallery .list .tit{font-size:16px;}
	#gallery .list .date{padding:8px 0 0 0; font-size:14px;}
	#gallery .list .img:after{width:45px; height:45px; background-size:contain;}
}
@media all and (max-width:568px) {
	#gallery h4{padding:37px 0 0 8px; font-size:19px;}
	#gallery h4 span{font-size:22px; display:block;}
	#gallery .info{padding:5px 0 25px 8px; font-size:12px;}
	#gallery .list a{margin:0 8px 53px;}
	#gallery .list .date{font-size:13px;}
	#gallery .control{top:30px;}
	#gallery .more{top:30px;}
}
@media all and (max-width:380px) {
	#gallery .inner{padding:0 9px;}
	#gallery h4{padding:35px 0 0 6px;}
	#gallery .list a{width:calc(100% - 12px); margin:0 6px 50px;}
	#gallery .list img{max-height:98px;}
	#gallery .list .date{padding:6px 0 0 0; font-size:12px;}
	#gallery .list .sbj{padding:18px 7px;}
}