@charset "utf-8";
.control{float:right;}
.control button,
.more{float:left; width:48px; height:48px; margin:0 7px 0 0; font-size:0; text-indent:-9999px; border-radius:50%; border:1px solid #e3e6eb; box-sizing:border-box; background:#fff url(../../images/ch/main/ico_arrow.png) no-repeat 16px 50%; color:#215283;}
.control .btn_next{background-position:-39px 50%;}
.more{display: flex; justify-content: center; align-items:center; width:116px; margin:0; border-radius:48px; font-size:18px; font-family:"Pretendard"; font-weight: 700; text-indent:0; background:#fff;}
.more:after{content: ''; display: inline-block; vertical-align: middle; width:14px; height:14px; margin:0 0 0 5px; background: url(../../images/ch/main/ico_more.png) no-repeat;}
.control button:hover,
.more:hover{text-decoration: none; border-color: #656d7b; transition: 0.2s ease-in;}

@media all and (max-width:1024px) {
    .control button,
    .more{width:40px; height:40px; background-position:10px 50%;}
    .control .btn_next{background-position:-46px 50%;}
    .more{width:85px; font-size:15px;}
}
@media all and (max-width:568px) {
    .control button{margin:0 4px 0 0;}
    .control button,
    .more{width:35px; height:35px;}
    .more{font-size:0;}
    .more::after{margin:0 0 0 3px;}
}

#visual{position:relative; width:100%; height:460px; margin:0 0 75px;}
#visual .img img{position:relative; top:0; left:50%; transform:translateX(-50%); border-radius:24px;}
.slogan{position:absolute; top:50%; left:50%; margin:0 0 0 -720px; transform:translateY(-50%); color:#fff; font-weight:400; font-size:18px; word-break:keep-all; text-align:left;}
.slogan div{padding:0 0 31px; line-height:145%; font-size:42px; font-weight:400; font-family:"Paperozi"; animation:slideup 1.2s both; animation-delay:0.3s;}
.slogan div strong{font-weight:700;}
.slogan p{line-height:110%; animation:slideup 1.6s both; animation-delay:0.8s;}
@keyframes slideup{
	0%{transform:translateY(20px); opacity:0; visibility:hidden;}
	100%{transform:translateY(0); opacity:1; visibility:visible;}
}
@media all and (max-width:1840px) {
    #visual {padding:0 20px; box-sizing: border-box;}
    #visual .img{overflow:hidden; border-radius:24px; text-align:right;}
    #visual .img img{left:100%; transform:translateX(-100%); max-width:inherit;}
}
@media all and (max-width:1520px) {
     .slogan{left:50px; margin:0;}
}
@media all and (max-width:1024px) {
    #visual{height:inherit; margin:0 0 50px; padding:0 15px; box-sizing: border-box;}
    #visual .img img{width:100%;}
    .slogan {top:100px; left:40px; font-size:17px;}
    .slogan div{padding:0 0 20px; line-height:120%; font-size:30px;}
}
@media all and (max-width:768px) {
    .slogan {top:75px; left:35px; font-size:15px;}
    .slogan div{padding:0 0 15px; font-size:25px;}
}
@media all and (max-width:568px) {
    #visual .img,
    #visual .img img{border-radius:14px;}
    #visual .img img{left:-40%; width:140%; transform: inherit;}
    
    .slogan{top:55px; font-size:13px; text-shadow:0 0 2px rgba(0,0,0,0.5);}
    .slogan div{font-size:20px;}
}

/* 의사일정 */
#agenda{z-index:2; position:absolute; top:348px; left:50%; width:780px; height:137px; margin:0 0 0 -61px; padding:21px 0 0 35px; text-align:left; border-radius:18px; box-sizing:border-box; border:1px solid #e4e9f2; background:#fff; box-shadow:0 0 13px rgba(0,0,0,0.06); font-weight:400;}
#agenda h3{float:left; line-height:128%; font-size:32px; font-weight:400; font-family:"Paperozi"; color:#215283;}
#agenda h3 strong{display: block; font-weight:700;}
#agenda .txt{float:left; width:calc(100% - 130px); padding:0 0 0 29px; box-sizing:border-box;}
#agenda .date{position:relative; margin:0 0 16px; font-size:20px; color:#19305a;}
#agenda .list_wrap{position:relative; float:left; width:calc(100% - 102px); padding:0 0 0 18px; background:#e6e6e6; border-radius:8px; box-sizing: border-box;}
#agenda .list_wrap *{vertical-align:top;}
#agenda .list p{position:relative; width:100%; line-height:43px; padding:0 70px 0 11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; box-sizing:border-box;}
#agenda .list p:before{content:""; position:absolute; left:0; top:50%; width:6px; height:1px; background:#393549;}
#agenda .list p:not(:first-of-type){display:none;}
#agenda .list.slick-initialized p:not(:first-of-type){display:block;} 
#agenda .more{float:right; width:90px; height:43px; border-radius:8px; border: none; font-size:20px; color:#fff; background:#215283;}
#agenda .more:after{display: none;}
#agenda .control{z-index:55; position:absolute; top:10px; right:5px;}
#agenda .control button{width:18px; height:22px; margin:0 2px 0 0; border-radius:2px; background-size:45px;}
#agenda .btn_prev{background-position:4px 50%;}
#agenda .btn_next{background-position:-32px 50%;}
#agenda .btn_stop{transition:none; background-size:22px !important; background:#fff url(../../images/committee/main/ico_stop.png) no-repeat 5px 5px;}
#agenda .btn_stop.on{background-position:-7px 5px;}

@media all and (max-width:1480px) {
	#agenda{left:auto; right:20px; margin:0;}
}
@media all and (max-width:1024px) {
    #agenda{position:static; width:100%; margin:50px 0 0 0;}
    #agenda h3{padding:7px 0 0 0; font-size:27px;}
    #agenda .more{font-size:17px;}
}
@media all and (max-width:768px) {
    #agenda{overflow:hidden; height: auto; width:100%; margin:20px 0 0 0; padding:21px 20px 25px 20px;}
    #agenda h3{width:100%; padding:0; margin:0 0 10px; font-size:23px; text-align: center;}
    #agenda h3 strong{display: inline-block;}
    #agenda .txt{width:100%; padding:0;}
    #agenda .date{text-align: center;}
    #agenda .list_wrap{width:calc(100% - 80px);}
    #agenda .more{width:70px; font-size:15px; letter-spacing: 0;}
}

/*위원회 구성 */
#member {position:relative; padding:0 0 125px;}
#member .en{line-height:100%; font-weight: 400; text-transform: uppercase; color:#215283; font-size:15px; letter-spacing: 0;}
#member h3{padding:10px 0 43px 0; line-height:128%; font-size:32px; font-weight:400; font-family:"Paperozi"; color:#215283; word-break: keep-all;}
#member h3 strong{font-weight: 700;}
#member .list {display:flex; width:calc(100% + 20px); margin:0 -10px; text-align:center;}
#member .list a {width:calc(100% / 7); text-decoration:none; box-sizing: border-box;}
#member .pic {position:relative; display:block; max-width:201px; padding:0 10px; margin:0 auto 14px; box-sizing:border-box; text-align:center;}
#member .pic img {overflow:hidden; max-width:100%; width:100%; border: 1px solid #d8e0ed;  border-radius:14px; box-sizing: border-box;}
#member .name{display:block; font-weight:400; font-size:20px; color:#19305a;}
#member .name strong{font-weight:700;}
@media all and (max-width:1480px) {
    #member{padding:0 20px 125px;}
}
@media all and (max-width:1024px) {
    #member{padding:0 15px 60px;}
    #member .en{font-size:14px;}
    #member h3{padding:8px 0 28px; font-size:27px;}
    #member h3 br{display: none;}
    #member .list {width:calc(100% + 10px); margin:0 -5px;}
    #member .pic{padding:0 5px;}
    #member .name{font-size:17px;}
}
@media all and (max-width:768px) {
    #member{padding:0 15px 25px;}
    #member .en{font-size:13px;}
    #member h3{font-size:23px;}
    #member .list {flex-wrap: wrap;}
	#member .list a{width:25%; margin:0 0 20px;}
    #member .pic{max-width:120px; margin: 0 auto 10px;}
}
@media all and (max-width:568px) {
    #member h3{font-size:21px;}
	#member .pic{max-width:115px; margin:0 auto 6px;}
	#member .name{font-size:16px;}
    #member .name strong{display:block;}
}

/* 사진첩 */
#gallery{overflow:hidden; position:relative; float:left; width:100%; height:676px; padding:100px 0 0 0; box-sizing:border-box; font-weight:600; background:#f2f5f7;}
#gallery .inner{width:1484px; padding:0 24px;}
#gallery .en{line-height:100%; font-weight: 400; text-transform: uppercase; color:#215283; font-size:15px; letter-spacing: 0;}
#gallery h3{padding:14px 0 46px; line-height:100%; font-size:32px; font-weight:400; font-family:"Paperozi"; color:#215283; word-break: keep-all;}
#gallery h3 strong{font-weight: 700;}
#gallery .list_wrap{clear:both;  width:calc(100% + 24px);} 
#gallery .list_wrap .list:not(:first-of-type){display:none;}
#gallery .list_wrap.slick-initialized .list:not(:first-of-type){display:block;}
#gallery .list a{overflow:hidden; position:relative; display:block; width:calc(100% - 24px); margin:0 24px 0 0;  text-decoration:none;}
#gallery .list a *{display:block;}
#gallery .list img{display:inline; width:100%; transition:0.25s ease;}
#gallery .img{display:flex; align-items:center; vertical-align:middle; position:relative; overflow:hidden; max-height:280px; border-radius:14px; border: 1px solid #d8dde5; box-sizing: border-box;}
#gallery a:hover img,
#gallery a:focus img{transform:scale(1.1);}
#gallery a:hover .img{border-color: #bcc3ce;}
#gallery .sbj{padding:24px 0 0 18px; font-family:"Pretendard";}
#gallery .tit{display:block; max-width:100%; margin:0 0 16px; line-height:100%; font-size:22px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; box-sizing:border-box;}
#gallery .list a:hover .tit,
#gallery .list a:focus .tit{text-decoration: underline;}
#gallery .date{line-height:100%; color:#656d7b; font-size:18px; font-weight:400;}
#gallery .date:before{content: ''; display:inline-block; vertical-align: middle; width:16px; height:16px; margin:-3px 6px 0 0; background: url(../../images/ch/main/ico_date.png) no-repeat;}
#gallery .control{z-index:51; position: absolute; left:0; top:calc(50% - 15px); width:100%;}
#gallery .control button{position: absolute; left:0; top:0; box-shadow:2px 3px 7px rgba(0,0,0,0.16);}
#gallery .control .btn_next{left:auto; right:0;}
#gallery .more{position: absolute; right:24px; top:18px;}
@media all and (max-width:1520px){
    #gallery{padding-left:20px; padding-right:20px;;}
    #gallery .inner{width:100%;}
}
@media all and (max-width:1024px){
	#gallery{height:auto; padding:45px 0 55px;}
    #gallery .en{font-size:14px;}
	#gallery h3{padding:8px 0 32px; font-size:27px;}
	
	#gallery .img{max-height:187px;}
    #gallery .sbj{padding:20px 0 0 10px;}
	#gallery .tit{margin:0 0 10px; font-size:18px;}
    #gallery .date{font-size:15px;}
    #gallery .control button{left:5px;}
    #gallery .control .btn_next{right:5px}
    #gallery .more{top:14px;}
}
@media all and (max-width:768px){
    #gallery .en{font-size:13px;}
	#gallery h3{font-size:23px;}

	#gallery .img{max-height:160px;}
    #gallery .sbj{padding:15px 0 0 5px;}
	#gallery .tit{margin:0 0 7px; font-size:17px;}
	#gallery .date{font-size:14px;}
    #gallery .date::before{width:14px; background-size:14px;}
}
@media all and (max-width:568px){
	#gallery h3{font-size:21px;}
    #gallery .tit{font-size:16px;}
    #gallery .list_wrap{width:calc(100% + 14px);} 
    #gallery .list a{width:calc(100% - 14px); margin:0 14px 0 0;}
}
@media all and (max-width:350px){
    #gallery .more{top:-15px;}
}