@charset "utf-8";
 
/* 메인비주얼 */
.main_visual_wrap {width:100%; height:100%; overflow:hidden;  background:url('/images/org/web/upo/main/m_bg.png') no-repeat center 0; }
.main_visual{width:1200px; margin:0 auto; text-align:right;}

/* 바로가기 */
.M_link01 { position:relative}
.M_link01 ul:after {content:""; display:block; clear:both;}
.M_link01 li {float:left; width:33.3%; margin-bottom:15px}
.M_link01 li a {display:block; text-align:center;}
.M_link01 li a:hover{text-decoration:none}
.M_link01 li a:hover img {
	-webkit-animation:M_link01_icon 0.5s  ease; 
	-moz-animation:M_link01_icon 0.5s  ease; 
	-o-animation:M_link01_icon 0.5s  ease; 
	-ms-animation:M_link01_icon 0.5s  ease; 
	animation:M_link01_icon 0.5s  ease;}
@-webkit-keyframes M_link01_icon {0% {transform:translateY(0);} 50% {transform:translateY(-5px);} 100% {transform:translateY(0);}}
@-moz-keyframes M_link01_icon {0% {transform:translateY(0);} 50% {transform:translateY(-5px);} 100% {transform:translateY(0);}}
@-o-keyframes M_link01_icon {0% {transform:translateY(0);} 50% {transform:translateY(-5px);} 100% {transform:translateY(0);}}
@-ms-keyframes M_link01_icon {0% {transform:translateY(0);} 50% {transform:translateY(-5px);} 100% {transform:translateY(0);}}
@keyframes M_link01_icon {0% {transform:translateY(0);} 50% {transform:translateY(-5px);} 100% {transform:translateY(0);}}
.M_link01 a span {display:block; padding:5px 0; font-size:15px; line-height:140%; color:#fff; }

/* 공지사항 수정 181018*/
.notice01 {position:relative; width:100%; padding-top:44px;}
.notice01 h2 {position:absolute; top:0; font-weight:bold; font-size:16px; letter-spacing:-0.5px; height:44px; line-height:42px}
.notice01 h2 a {display:block; height:100%; background-color:#fff; width:102px; text-align:center; color:#8c8c8c; }
.notice01 h2 a:hover, .notice01 h2 a:focus {background-color:#eeeeee; border-radius:10px 10px 0 0;}
.notice01 h2.current a {background-color:#013c6c; color:#fff; border-radius:10px 10px 0 0;}
.notice01 h2.tit_1{left:0;}
.notice01 h2.tit_2{left:102px;}
.notice01 h2.tit_3{left:204px;}
.notice01 .list_box.on {display:block;}
.notice01 .list_box {display:none; font-size:14px; border-top:1px solid #013c6c; overflow:hidden;}
.notice01 .top_list{padding:10px 0 6px;}
.notice01 .top_list a {display:block; min-height:62px; position:relative}
.notice01 .top_list a:hover { text-decoration:none}
.notice01 .top_list a span.img {position:absolute; top:0; left:0}
.notice01 .top_list a dl {margin-left:75px; padding-top:6px; line-height:150%}
.notice01 .top_list a dl dt {font-size:14px; font-weight:bold; margin-bottom:4px; color:#444; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.notice01 .top_list a dl dd { font-size:14px; color:#777; line-height:20px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.notice01 .top_list a:hover dl dt { text-decoration:underline}
.notice01 .list_box ul.ul_list { overflow:hidden}
.notice01 .list_box ul.ul_list li {position:relative; line-height:27px; overflow:hidden; background:url('/images/org/web/upo/main/dot_01.png') no-repeat 0 12px}
.notice01 .list_box ul.ul_list li a {display:block; width:76%; padding-left:8px; float:left; color:#555; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.notice01 .list_box ul.ul_list li a:hover {text-decoration:underline;}
.notice01 .list_box ul.ul_list li span.date {display:block; float:right; text-align:right; color:#777; }
.notice01 .btn_more {position:absolute; right:0; top:7px; width:29px; height:29px; text-indent:-9999em; line-height:0; font-size:0; background:url('/images/org/web/upo/main/notice_more01.png') no-repeat}

/* 팝업 수정 250911*/
.box_popup {position:relative; height:100%;}
.box_popup h2 {height:50px; line-height:48px; font-size:19px; font-weight:bold; color:#222; background: url(/images/org/web/upo/main/bu_h2_tit.png) no-repeat left top;}
.box_popup .pop {position:relative;height: 250px;overflow:hidden}
.box_popup .pop li {width:100%;height: 250px;overflow:hidden;float:left}
.box_popup .pop li a {display:block;}
.box_popup .pop li a img {width:100%;height: 250px;}
.box_popup .control {position:absolute; top:16px; right:0; z-index:10}
.box_popup .control a {display:block; float:left; text-indent:-10000px; width:20px; height:20px; margin-left:2px; overflow:hidden; }
.box_popup .control a.prev { background:url('/images/org/web/upo/main/btn_pop_prev.png') no-repeat; }
.box_popup .control a.next { background:url('/images/org/web/upo/main/btn_pop_next.png') no-repeat; }
.box_popup .control a.stop { background:url('/images/org/web/upo/main/btn_pop_stop.png') no-repeat; }
.box_popup .control a.play { background:url('/images/org/web/upo/main/btn_pop_play.png') no-repeat; }

/* 월중계획 수정 250911 */
.schedule {position:relative;height: 100%;overflow: hidden;}
.schedule h2 {height:50px; line-height:48px; font-size:19px; font-weight:bold; color:#222; background: url(/images/org/web/upo/main/bu_h2_tit.png) no-repeat left top;}
.schedule > .box {height: 250px;background:#f3f3f3;}
.schedule > .box .top {display:block; position:relative; height:45px; line-height:43px; text-align:center; font-size:17px; font-weight:bold; color:#515151; background:url('/images/org/web/upo/main/pt_calen.png') repeat;}
.schedule > .box .top em {color:#ff6647; font-weight:bold}
.schedule > .box .top a.btn{display:block; width:27px; height:27px; position:absolute; top:9px; text-indent:-10000px; background-repeat:no-repeat}
.schedule > .box .top a.btn.prev {left:40px; background-image:url('/images/org/web/upo/main/btn_calen_prev.png');}
.schedule > .box .top a.btn.next {right:40px; background-image:url('/images/org/web/upo/main/btn_calen_next.png');}
.schedule > .box ul {padding:6px 12px 0;height: 200px;overflow-y: scroll;}
.schedule > .box ul li {position:relative; overflow:hidden; margin:6px 0}
.schedule > .box ul li span.day { display:block; float:left; width:35px; height:35px; line-height:33px; margin-right:10px; border-radius:50%; text-align:center; background-color:#90b1de; color:#fff; font-size:15px;}
.schedule > .box ul li.today span.day {background-color:#465c8b}
.schedule > .box ul li a {display:block; color:#222; font-size:14px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.schedule > .box ul li a span {display:block; margin-top:2px; padding-left:15px; font-size:12px; color:#949faf; background:url('/images/org/web/upo/main/icon_time.png') no-repeat left 3px;}
.schedule .btn_more {position:absolute; top:13px; right:0; width:26px; height:26px; background:url('/images/org/web/upo/main/btn_more.png') no-repeat; text-indent:-10000px; z-index:10}

/* 전화번호안내 수정181018 */
.cstm_center {position:relative; height:100%; padding-left:127px;}
.cstm_center .img { position:absolute; top:18px; left:10px;}
.cstm_center h2 {font-size:22px; padding-top:37px; color:#2a447a; font-weight:bold; line-height:160%}
.cstm_center h2 span {font-size:18px; color:#fff;}
.cstm_center span.txt {font-size:15px; color:#fff; line-height:160%}
.cstm_center span.txt em {color:#f9ec31;}

/* 바로가기2 수정181018 */
.M_link2 { overflow:hidden; height:100%;} 
.M_link2 li { position:relative; float:left; width:276px; height:100%; margin-left:32px;}
.M_link2 li:first-child {margin-left:0}
.M_link2 li a { display:block; padding:38px 0 35px}
.M_link2 li a .tit {display:block; font-size:20px; font-weight:bold; color:#30487c;}
.M_link2 li a .tit:after { content:''; display:inline-block; width:42px; height:8px; margin-left:3px; background:url('/images/org/web/upo/main/btn_more2.png') no-repeat;  -webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-ms-transition:all 0.3s ease;transition:all 0.3s ease;}
.M_link2 li a:hover .tit:after {margin-left:10px}
.M_link2 li a .sm_txt {display:block; width:135px; font-size:13px; color:#fff; margin-top:10px}
.M_link2 .img {position:absolute; right:0; top:15px;}

/* 포토뉴스 수정 250911 */
.news {position:relative;}
.news > h2 {float:left;width: 250px;color:#1a1a1a;font-size:24px;font-weight:bold;}
.news > h2:before {content:''; width:45px; height:3px; background-color:#2059a8; display:block; margin-bottom:8px}
.news .news_info { display:block; padding-top:12px; line-height:130%; font-weight:normal; font-size:14px; width:290px; color:#6e7b92; word-break:keep-all}
.news .news_list_box {float:right;width: 400px;padding: 0;}
.news .news_list_box ul{height: 200px;overflow:hidden;}
.news .news_list_box ul li {padding-bottom: 40px;width:195px;height: 190px;float:left;margin-left:10px;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-ms-transition:all 0.3s ease;transition:all 0.3s ease;}
.news .news_list_box ul li:first-child {margin-left:0;}
.news .news_list_box ul li a {position:relative;display:block;height: 190px;}
.news .news_list_box ul li a > img {width:100%; height:100%;}
.news .news_list_box ul li:hover {margin-top:-10px;}
.news .news_list_box ul li a:hover .view_con {display:block;}
.news .news_list_box ul li a .view_con {display:none; position:absolute; top:0; left:0; width:100%; height:100%; text-align:center; background:url("/images/org/web/upo/main/view_bg.png") repeat;}
.news .news_list_box ul li a .view_con > h3 {color:#fff; font-size:16px; font-weight:bold; padding:80px 20px 20px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.news .news_list_box ul li a .view {color:#fff; font-size:13px;}
.news .news_list_box ul li a .view span.view_ico {background: url("/images/org/web/upo/main/view_ico.png") no-repeat left 5px; margin-right:12px; padding-left:17px; display:inline-block;}
.news .news_list_box ul li a .view span.date_ico {background: url("/images/org/web/upo/main/date_ico.png") no-repeat left 4px; padding-left:16px; display:inline-block;}
.news .news_list_box ul li a .view_con .btn {margin-top: 20px;display:block}
.news_control {position:absolute;left:0;top: 150px;}
.news_control a { display:block; float:left; width:40px; height:40px; text-indent:-9999em; font-size:0; margin-left:1px; background-repeat:no-repeat}
.news_control a:first-child {margin-left:0}
.news .news_control a.news_prev {background-image:url("/images/org/web/upo/main/news_prev.png")}
.news .news_control a.news_next {background-image:url("/images/org/web/upo/main/news_next.png")}
.news .news_control a.news_more {background-image:url("/images/org/web/upo/main/news_more.png")}

/* 배너존 */
.bannerZone {width:100%; background:#fff; border-top:1px solid #b2b7c7;}
.bannerZone .inner { position:relative; width:1200px; margin:0 auto}
.bannerZone h2 {position:absolute; left:0; top:21px; line-height:150%; font-size:16px; font-weight:bold}
.bannerZone .control {position:absolute; left:60px; top:28px;}
.bannerZone .control a {display:block; width:14px; height:15px; float:left; text-indent:-10000em; font-size:0; line-height:0; background-repeat:no-repeat }
.bannerZone .control a.prev {background-image:url('/images/org/web/upo/main/btn_b_prev.png'); }
.bannerZone .control a.next {background-image:url('/images/org/web/upo/main/btn_b_next.png'); }
.bannerZone .control a.stop {background-image:url('/images/org/web/upo/main/btn_b_stop.png'); }
.bannerZone .control a.play {background-image:url('/images/org/web/upo/main/btn_b_play.png'); }
.bannerZone .control a.list {background-image:url('/images/org/web/upo/main/btn_b_list.png'); }
.bannerZone .obj {margin-left:178px; height:43px; overflow:hidden; padding-top:14px}
.bannerZone .obj li { width:190px; height:43px; margin-left:18px;  float:left;}
.bannerZone .obj li:first-child { margin-left:0}



@media screen and (max-width:1019px) {
	

	#container,  .main_content, 
	.main_visual_wrap, .box_popup, 
	.drawSchedule, .drawSchedule .date_view,
	.gallery, .M_link02, .M_link02 li, .news .news_list_box ul li,
	.bannerZone .obj li{ -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box }
	
	/* 메인비주얼 */
	.main_visual_wrap { padding-top:2.5%;}
	.main_visual{width:95%;}
	.main_visual img{ width:55%; height:auto}
	
	/* 바로가기 */
	.M_link01 li {width: 33%;} /*230717*/
	.M_link01 li a img { width:68%; height:auto}
	.M_link01 li a span br {display:none;}
	
	/* 공지사항 */
	.notice01 .top_list{padding:20px 0 15px;}
		
	/* 갤러리 */
	.gallery {height:auto; padding:2% 2.5% 2.5%; background:#dfeeff;}
	.gallery .gall_list li {width:22.75%; margin-left:3%;}
	.gallery .btn_more {right:2.5%; top:9%}
	
	/* 전화번호안내 수정181018 */
	.cstm_center {height:99px; background-color:#74a1de; border-bottom:1px solid #fff; padding-left:100px}
	.cstm_center .img {top:16px; left:2.5%;}
	.cstm_center .img img { width:64px; height:auto}
	.cstm_center h2 {font-size:20px; padding-top:19px}
	.cstm_center h2 span {font-size:16px;}
	.cstm_center span.txt {font-size:14px;} 
	
	/* 바로가기2 수정181018 */
	.M_link2 {height:99px; background-color:#74a1de;} 
	.M_link2 li {width:50%; margin-left:0}
	.M_link2 li a {height:100%; padding:18px 5% 0; border-left:1px dashed #fff;}
	.M_link2 li:first-child a {border-left:0;}
	.M_link2 .img { top:15px; right:5%;}
	.M_link2 .img img { width:60px; height:auto} 
	
	/* 포토뉴스 수정181018 */
	.news > h2 {width:100%; font-size:20px; padding-top:0}
	.news .news_info { display:none}
	.news .news_list_box {width:100%;padding:25px 0 0;height: 220px;overflow: hidden;}/* 190517 */
	.news .news_list_box ul li {width:31%; height:auto; margin-left:3.5%}
	.news .news_list_box ul li a {height:220px;}
	.news .news_list_box ul li a .view_con > h3 {padding:50px 20px 20px;}
	.news_control { left:auto; right:0; top:0;}	

	/* 배너존 */
	.bannerZone .inner {width:95%;}
	.bannerZone .obj {margin-left:150px}
	.bannerZone .obj li { width:calc(25% - 18px)}
	.bannerZone .obj li img { width:100%; height:100%;}
	
	
}

@media screen and (max-width:800px) {
	
	/* 메인비주얼 */
	.main_visual_wrap { padding-top:2.5%;}
	.main_visual{width:95%; text-align:center}
	.main_visual img{ width:70%; height:auto}

	 /* 바로가기 */
	.M_link01 {width:100%; height:auto; background:#1f5aa0}
	.M_link01 ul {border-bottom:1px dashed #fff; border-right:1px dashed #fff}
	.M_link01 li {margin-bottom:0}
	.M_link01 li a {border-top:1px dashed #fff; border-left:1px dashed #fff }
	.M_link01 a span {padding:8px 0 10px; line-height:160%;}
	.M_link01 li a img { display:none}
	
	/* 포토뉴스 수정181018 */
	.news .news_list_box ul li a {height:180px;}
	.news .news_list_box ul li a .view_con > h3 {padding:50px 20px 10px;}
	.news .news_list_box ul li a .view_con .btn { margin-top:13px}	
	
	/* 배너존 */
	.bannerZone .obj li { width:calc(33.3% - 18px)}
	

}


@media screen and (max-width:680px) {
	
	/* 갤러리 */
	.gallery {padding:3% 3.5% 3.5%;}
	.gallery .gall_list { height:130px;}
	.gallery .gall_list li {width:30%; margin-left:5%; margin-bottom:20px}
	.gallery .btn_more {right:3.5%; top:7%}
	
	/* 바로가기 3개 */
	.M_link02 {padding:3.5%;}
	.M_link02 li {width:100%; margin-left:0; margin-top:2%}
	.M_link02 li:first-child {margin-left:0; margin-top:0}
	
	/* 포토뉴스 수정181018 */
	.news .news_list_box ul li a {height:140px;}
	.news .news_list_box ul li a .view_con > h3 {padding:25px 20px 10px;}	
	
	/* 배너존 */
	.bannerZone .obj li { width:calc(50% - 18px)}
	
	
}


@media screen and (max-width:580px) {
	
	/* 갤러리 */
	.gallery .gall_list li {width:48%; margin-left:4%;}
	
	/* 공지사항 */
	.notice01 .list_box ul.ul_list li a {width:90%}
	.notice01 .list_box ul.ul_list li span.date { display:none}
	
	/* 전화번호안내 수정181018 */
	.cstm_center {padding-left:5%}
	.cstm_center .img {left:auto; right:12px}
	.cstm_center h2 {padding-top:13px}
	.cstm_center h2 span {display:none}
	.cstm_center span.txt {line-height:120%}
	.cstm_center h2 + span.txt, .cstm_center h2 + span.txt + span.txt {display:block;}
	
	/* 바로가기2 수정181018 */
	.M_link2 { height:auto} 
	.M_link2 li {width:100%}
	.M_link2 li a {padding:18px 5% 18px; border-left:0; border-top:1px dashed #fff}
	.M_link2 li:first-child a { border-top:0}

	/* 포토뉴스 수정181018 */
	.news .news_list_box ul li {width:100%; margin-left:0}
	.news .news_list_box ul li a {height:200px; margin-bottom:3%}
	.news .news_list_box ul li:last-child a {margin-bottom:0}
	.news .news_list_box ul li:hover{margin-top:0}
	.news .news_list_box ul li a .view_con > h3 {padding:50px 20px 10px;}
	
}


@media screen and (max-width:480px) {
	
	/* 배너존 */
	.bannerZone .obj li { width:calc(100% - 18px)}

}


@media screen and (max-width:380px) {
	


}
