﻿/*메인 비주얼*/
#mainVisual{position:relative; width:100%; height:640px;  overflow: hidden;    z-index: 2;  color: #fff;}
#mainVisual #visual .visual_item{overflow:hidden;}
#mainVisual #visual .visual_item img.v_bg{display: block;    position: relative;    margin-left: -1000px;    left: 50%; }
#mainVisual #visual .visual_item .v_txt{position:absolute; top:16%; left:10%;   text-align:center; transition:all 0.2s;}
#mainVisual #visual .visual_item .v_txt img{width:100%;}
.LR_btn{width:100%;}
.LR_btn li{display:inline-block;  position:absolute; top:45%; font-size:50px; color:#fff; opacity:0.9; cursor:pointer; z-index:5;}
.LR_btn li i{font-weight:700; text-shadow:2px 2px 2px rgba(0,0,0,0.5);}
.LR_btn li.prev{left:50px;}
.LR_btn li.next{right:50px;}

#mainVisual .slick-dots{position:absolute;left:50%; bottom:50px;  margin-left:-49px;}
#mainVisual .slick-dots li{float:left; margin:0;}
#mainVisual .slick-dots li button{ width: 12px; height: 12px; margin: 0 0.375rem; border-radius: 50px; background-color: #fff; text-indent: -9999em;  overflow: hidden; -webkit-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
#mainVisual .slick-dots li.slick-active button{ width: 36px; background-color: #36a1ff;}

#mainVisual .P_btn{position:absolute;left:50%;bottom:43px; margin-left:-77px;}
#mainVisual .P_btn button i{font-size:20px; color:#fff; opacity:1;}
#mainVisual .P_btn .play{display:none;}

/*공통 제목, 버튼*/
.inner{max-width:1200px; margin:0 auto; }
/*.tit h2{position:relative;}
.tit h2:before{content:"";     position: absolute; display: block; width: 110%; height: 20px; background: rgba(1,86,162,0.25); bottom: -5px; left:-7px; }*/
.tit{text-align:center; }
.tit h2{display:inline-block; font-size:3.5rem; line-height:1.2; letter-spacing: 0.05em;}
.tit p{font-size:20px; margin-top:10px; font-weight:300;}

.btn_box{width:97%; text-align:right; margin-top:0px; margin-bottom:30px;}
.btn_box .more_btn{display:inline-block; padding:0px 20px; height:36px; line-height:36px; border:2px solid rgba(255,255,255,0.7);     vertical-align: middle; font-size:1.5rem;  color:#fff; transition: all 0.3s;     border-radius: 50px; font-weight:400;}
.btn_box .more_btn i{display:inline-block; margin-top:-3px; padding-left:10px; font-size:1.8rem;  vertical-align:middle;  -webkit-transition:all 0.3s;  -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s; transition:all 0.3s;}
.btn_box .more_btn:hover i{padding-left:15px;}

/*행사 컨텐츠*/
#main_schedule{position:relative; width:100%; margin:0px auto;  padding:60px 0px 0px; box-sizing:border-box;}
#main_schedule div.cont{float:left; width:410px; margin-right:50px;}
#main_schedule .volunteer.cont{width:280px; margin-right:0;}
.tit_box{padding-bottom:12px; border-bottom:1px solid #095a97;}
.tit_box a{display:block;}
.tit_box span{display:inline-block; font-weight:400;}
.tit_box .title{font-size:2.5rem; }
.tit_box .more{font-size:1.5rem; float:right; padding-top:12px; color:#1a78bf;}

/*행사일정*/
#main_schedule .e_list{ text-align:center;}
#main_schedule .e_list:after{content:".";clear:both;display:block;height:0;visibility:hidden;}
#main_schedule .e_list li{position:relative; border-bottom:1px dashed #ccc; background:#fff; display:block; text-align:left;}
#main_schedule .e_list li:first-child{margin-left:0;}
#main_schedule .e_list li a{position:relative; display:block; padding:28px 0; box-sizing:border-box;  -webkit-transition:all 0.3s;  -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s; transition:all 0.3s; }
.e_date{display:inline-block; font-weight:600; color:#1a78bf; position:absolute; top:26%; left:20px; vertical-align:middle; line-height:0.9; letter-spacing:-0.03em; text-align:center;  box-sizing:border-box;  -webkit-transition:all 0.3s;  -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s; transition:all 0.3s; font-size:1.4rem;}
.e_date em{display:block; font-size:2.5rem; margin-top:5px; color:#1a78bf; }
.e_txt{display:inline-block; font-size:1.8rem; font-weight:400;  max-width:59%; display:block; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis;}
#main_schedule .event_date .e_list .e_txt{ padding-left:100px; }
#main_schedule .e_list li:hover .e_txt{text-decoration:underline; }
#main_schedule .e_list li i{position:absolute; top:50%; right:20px; margin-top:-12px; font-size:1.6rem; color:#c7c7c7;  border:2px solid #c7c7c7; padding:3px; border-radius:100px; -webkit-transition:all 0.3s;  -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s; transition:all 0.3s; }
#main_schedule .e_list li:hover i{color:#6aaada; border-color:#6aaada;}

/*공지사항*/
#main_schedule .notice .e_list li{padding-left:10px;}
#main_schedule .notice .e_list li a{padding:17px 0 15px;}
#main_schedule .notice .e_list .e_txt{max-width:81%;}
#main_schedule .notice .e_list .n_date{display:block; font-size:1.4rem; color:#b6b6b6; font-weight:500; margin-top:3px;}

/*자원봉사*/
#main_schedule .volunteer{height:296px; text-align:center; padding:35px 0; border-radius:5px; box-sizing:border-box; background: #fbfbfb url(../../images/main/volunteer_bg.jpg) no-repeat; background-size:cover; background-position:50% 50%;}
#main_schedule .volunteer > a{display:block;}
#main_schedule .volunteer .icon{display:block; text-align:center; position:relative; margin-top:-7px;}
#main_schedule .volunteer .icon img{width:65px;}
#main_schedule .volunteer span{display:block; }
#main_schedule .volunteer .title{position:relative; font-size:2.3rem; padding:5px 0 15px; margin-bottom:15px; font-weight:400; color:#fff;}
#main_schedule .volunteer .title:after{content:""; display:block; width:20px; height:1px; background:#fff; position:absolute; bottom:0; left:50%; margin-left:-10px;}
#main_schedule .volunteer .title i{display:none;}
#main_schedule .volunteer .txt{font-size:1.4rem; color:rgba(255,255,255,0.8);}
#main_schedule .volunteer .btn_box{width:100%; text-align:center; margin-top:20px; margin-bottom:0;}
#main_schedule .volunteer .btn_box .more_btn{display:inline-block;}

/*활동자료*/
#mainNews{width:100%; padding:50px 0 100px; background:url(../../images/main/activity_bg.jpg) no-repeat;  background-position:50% 0; background-size:cover;   min-height:400px;}
#mainNews .tit h2{color:#fff;}
#mainNews .news_cont{width:1200px; margin:0 auto;}
#mainNews .news_cont li a{display:block; padding:0 20px;}
#mainNews .news_cont li .img_box{width:100%; height:176px; overflow:hidden; border-top-left-radius: 5px; border-top-right-radius: 5px;}
#mainNews .news_cont li .img_box img{width:100%; -webkit-transform:scale(1);  -moz-transform:scale(1); -ms-transform:scale(1);  -o-transform:scale(1);   transform:scale(1); -webkit-transition:.3s; -moz-transition:.3s; -ms-transition:.3s; -o-transition:.3s;  transition:.3s;}
#mainNews .news_cont li:hover img{-webkit-transform:scale(1.2); -moz-transform:scale(1.2); -ms-transform:scale(1.2);    -o-transform:scale(1.2);  transform:scale(1.2);}
#mainNews .news_cont li .text_box{padding:35px 32px 31px; border-top:0; /*box-shadow: 1px 4px 7px 1px rgba(0, 0, 0, 0.02);*/  border-bottom:2px solid rgba(255, 255, 255, 0.35); background:#fff;}
#mainNews .news_cont li .text_box p{font-size:2rem; font-weight:400; display:block; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;}
#mainNews .news_cont li .text_box span{display:block; text-align:right; font-size:1.6rem; font-weight:400; color:#797979; margin-top:11px;}
#mainNews .news_cont li:hover .text_box p{}
#n_slide .slick-dots{ text-align:center; width:100%; bottom: -55px;}
#n_slide .slick-dots li{display:inline-block;}
#n_slide .slick-dots li button { width: 12px; height: 12px; margin: 0 0.375rem; border-radius: 50px; background-color: rgba(147, 154, 162, 0.75); text-indent: -9999em;  overflow: hidden; -webkit-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
#n_slide .slick-dots li.slick-active button { width: 36px; background-color: #fec23f;}

/*바로가기메뉴*/
#main_quick{width:100%; padding:50px 0;}
#main_quick .quick_cont{width:1200px; margin:0 auto;}
#main_quick .quick_cont li{position:relative; float:left; width:33.3%;}
#main_quick .quick_cont li a{display:block; padding:0 10%;}
#main_quick .quick_cont li i{display:inline-block; padding:3px; border-radius:50px; margin-left:7px; background:#d1d1d1; color:#fff;  -webkit-transition:all 0.3s;  -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s; transition:all 0.3s;}
#main_quick .quick_cont li:hover i{background:#095a96; }
#main_quick .quick_cont li .ico{display:inline-block; position:absolute; top:0; left:11%;}
#main_quick .quick_cont li .ico img{width:65px;}
#main_quick .quick_cont li .text_box{padding-left:95px;}
#main_quick .quick_cont li .text_box span{display:block;}
#main_quick .quick_cont li .text_box .title{font-size:2.0rem; font-weight:400;}
#main_quick .quick_cont li .text_box .txt{font-size:1.4rem; margin-top:5px;}






/*----------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media (max-width:1280px) {
/*행사일정*/
#main_schedule{padding:50px 20px 0;}
#main_schedule div.cont { width: 395px;    margin-right: 45px;}
}
@media (max-width:1200px) {
/*메인 비주얼*/
#mainVisual{height:450px;}
#mainVisual #visual .visual_item .v_txt{width:400px;}

/*컨텐츠 공통 */
#mainContents{width:100%;}
.inner, #mainNews .news_cont, #main_quick .quick_cont {width:100%; max-width:100%;}

/*행사 컨텐츠*/
#main_schedule div.cont{width:47%; margin-right:0;}
#main_schedule .event_date.cont{margin-right:5%;}
#main_schedule .volunteer.cont{width:100%; height:auto; margin-top:50px; padding:20px 0;}
#main_schedule .volunteer.cont a > div{display:inline-block;}
#main_schedule .volunteer .icon, #main_schedule .volunteer dl, #main_schedule .volunteer dt, #main_schedule .volunteer dd, #main_schedule .volunteer .btn_box{display:inline-block; vertical-align:middle; margin:0 10px;}
#main_schedule .volunteer .icon{margin:0; margin-right:15px;}
#main_schedule .volunteer dl{text-align:left; margin-left:0;}
#main_schedule .volunteer .title{padding:0; margin-bottom:5px;}
#main_schedule .volunteer .title:after{display:none;}
#main_schedule .volunteer .btn_box{width:auto;}

/*활동자료*/
#mainNews .news_cont li .img_box{height:auto;}
}

@media (max-width:1024px) {
/*메인 비주얼*/
#mainVisual #visual .visual_item .v_txt{width:350px; }

/*바로가기메뉴*/
#main_quick{padding:0;}
#main_quick .quick_cont li{float:none; width:100%;  padding:30px 0px;   vertical-align:middle; border-top:1px dashed #e4e4e4; box-sizing:border-box;}
#main_quick .quick_cont li:first-child{  border-top:0;}
#main_quick .quick_cont li a{padding:0 20px; }
#main_quick .quick_cont li .ico{top:50%; left:30px; margin-top:-31px;}
#main_quick .quick_cont li i{position:absolute; top:50%; right:30px; margin-top:-11px;}
#main_quick .quick_cont li .text_box span{display:inline-block; vertical-align:middle;}
#main_quick .quick_cont li .text_box .txt{margin-top:0; margin-left:10px;}

}

@media (max-width:767px) {
/*공통*/
.tit_box{padding-bottom:14px;}
.tit_box .title{font-size:2rem;}
.tit_box .more{padding-top:7px;}
.btn_box .more_btn{line-height:42px}

/*메인 비주얼*/
#mainVisual { height: 390px;}
#mainVisual #visual .visual_item .v_txt{width:250px;}

/*행사 컨텐츠*/
#main_schedule{padding:30px 20px 10px;}
#main_schedule div.cont{width:100%;}
#main_schedule .event_date.cont{margin-right:0; margin-bottom:30px;}
#main_schedule .e_list li a{padding:20px 0;}
#main_schedule .e_list li .e_date{top:21%;}
#main_schedule .e_list li .e_date em{font-size:2.3rem;}
#main_schedule .event_date .e_list .e_txt, #main_schedule .notice .e_list .e_txt{font-size:1.6rem;}
#mainNews .news_cont li .text_box span{font-size:1.4rem;}

/*활동자료*/
#mainNews{padding:50px 0 65px;}
#mainNews .tit h2{font-size:2.3rem;}
#mainNews .news_cont li .text_box{padding:25px 25px 20px;}
#mainNews .news_cont li .text_box p{font-size:1.6rem;}
}

@media (max-width:640px) {
/*메인 비주얼*/
#mainVisual { height: 320px;}

}

@media (max-width:580px) {
/*메인 비주얼*/
#mainVisual #visual .visual_item .v_txt{left:7%; width:190px;}
#mainVisual { height: 200px;}


/*행사 컨텐츠 - 자원봉사*/
#main_schedule .volunteer.cont{margin-top:30px; padding:15px 0;}
#main_schedule .volunteer dl {text-align:center; margin-right:0;}
#main_schedule .volunteer dt, #main_schedule .volunteer dd{display:block; text-align:left;}
#main_schedule .volunteer .icon img{width:55px;}
#main_schedule .volunteer .title{font-size:1.8rem; margin-bottom:0;}
#main_schedule .volunteer .title i{display:inline-block;}
#main_schedule .volunteer.cont a > div.btn_box{display:none;}

/*바로가기메뉴*/
#main_quick .quick_cont{margin-bottom:20px;}
#main_quick .quick_cont li{padding:20px 0;}
#main_quick .quick_cont li .ico{margin-top:-27px; left:20px;}
#main_quick .quick_cont li .ico img{width:55px;}
#main_quick .quick_cont li i{right:20px;}
#main_quick .quick_cont li .text_box{padding-left:75px;}
#main_quick .quick_cont li .text_box .title{font-size:1.8rem;}
#main_quick .quick_cont li .text_box .txt{display:block; margin-left:0;}

}