@charset "UTF-8";

#container {clear: both; position:relative; width: 100%; height: auto;overflow: hidden; z-index:1; background: #fff;}
#container .mainBg {position: absolute;clear: both;width: 100%;background: #8cb8e4;z-index: -999;height: 448px;overflow: hidden;}
#container .mainTxt {float: left;height: 182px;display: block;padding:4% 0% 3%;padding-left: 1%;}
#container .mainImg {float: right;display: inline-block;width: 50%;}
#container .mainBg2 {min-width: 777px;max-width: 961px}
#container span.wt {font-size: 26px;color: #fff;font-weight: 600;letter-spacing: -2px;display: block;line-height: 1.1;}
#container p.wc {font-size: 13px;color: #fff;position: relative;margin-top: 12px;display: inline-block;letter-spacing: -1px}
#container span.bt {color: #5b5b5b;font-size: 26px;font-weight: 600;letter-spacing: -1px;display: block;line-height: 1;}
#container p.wt img {display: inline-block;vertical-align: top;padding-right: 10px;}
#container p.wt.m {font-size: 18px;color: #fff;font-weight: 400;}
#container span.wt-s {font-size: 20px;}

.mainspot span.mainT.T {font-size: 50px;font-weight: 600;color: #2e5998;display: block; letter-spacing: -2px}
.mainspot span.mainT.W {font-size: 50px;color: #fff;font-weight: 400;display: block;clear: both;letter-spacing: -2px}
.mainspot span.mainT.C {font-size: 16px;color: #3b6c9c;display: block;padding-top: 29px;padding-left: 7px;letter-spacing: 1px}
.mainspot span.mainT {padding-top: 39px;}

.main1 .main1box1 {width: 50%;display: inline-block;height: auto;overflow: hidden;padding: 0;margin: 0;float: left;background: url(/siteTemplete/ice_ipl/img/bg-back.gif) no-repeat 100% 50%;}
.main1 .main1box1 ul {width: 100%;display: inline-block;float: right;border-bottom: 1px solid #dadada;}
.main1 .main1box1 ul li { position: relative;float: left;width: 33.333%;display: inline-block;height: 178px!important;}
.main1 .main1box1 ul li.li-bg a{width: 83%; height:87%;padding-top: 12%;padding-left: 10%;padding-right: 7%;}
.main1 .main1box1 ul li.bg-blue a{
}
.main1 .main1box1 ul li.bg-white a{border-left:1px solid #dadada}
.main1 .main1box1 ul li.bg-wgray:after{

	position: absolute;display: block; top: 0; left: 0; width: 100%; height:100%; border: 1px solid #dadada;content:'';
}
#container .main1 .main1box1 ul li.bg-green .wt{letter-spacing: -2px}
/*#container .main1 .main1box1 ul li.bg-green p.wc{ margin-top: 24px;}*/
.main1 .main1box1 ul li.bg-wgray img.mi{ margin-top: -4px;}
.main1 .main1box1 ul li.bg-white img.mi{ margin-top: -11px;}

.main1 .main1box1 ul li a { position: relative; display: block; height:89%;padding-top: 11%; padding-left: 12%; padding-right: 7%;}
.main1 .main1box1 img.mi { position: absolute;bottom:20px; right:10px}
.main1 .main1box1 p.bc {font-size: 13px;color: #5b5b5b;position: relative;margin-top: 18px;display: inline-block; letter-spacing:-1px;}
.main1 .main1box1 p.nc {font-size: 13px;color: #5e8fdc;position: relative;margin-top: 18px;display: inline-block; letter-spacing:-1px;}
.main1 .main1box1 .bg-blue {background: #42679e;}
.main1 .main1box1 .bg-dgray {background: #bbb9b9;}
.main1 .main1box1 .bg-green {background: #7dcfcb;}
.main1 .main1box1 .bg-white {background: #fff;}
.main1 .main1box1 .bg-green span.wt {font-size: 23px;}

.main1 .main1box2 {width: 50%;display: inline-block;padding: 0;margin: 0;float: left;}
.main1 .main1box2 .searchBox {height: 82px;padding: 23px 39px 28px;padding-left: 39px;position: relative;}
.main1 .main1box2 .searchBox input {border: 0;width: 87%;height: 47px; padding-left: 20px; color:#2b2c2d}
.main1 .main1box2 .searchInput img.btn2 {vertical-align: middle;}
.main1 .main1box2 .searchInput img.btn2:hover {vertical-align: middle;}
.main1 .main1box2 .popupZone {clear: both;background: #fff;height: 200px;position: relative;width:100%}
.main1 .main1box2 .popupZone .popup-title {min-height: 18px!important;padding:14px 11px 13px 15px;max-height: 24px!important;}
.main1 .main1box2 .popupZone .popup-img {clear: both;position: absolute;height: 163px;width:100%}
.main1 .main1box2 .popupZone .popup-title span {font-weight: 800;color: #444; font-size: 16px; vertical-align: middle;}
.main1 .main1box2 .popupZone .popup-title #pager{ font-weight: normal; margin-right: 5px;}
.main1 .main1box2 .popupZone .popup-title span.r-span span.blind{display: none;}
.main1 .popupZone .r-span a.stop,
.main1 .popupZone .r-span a.play{display:none;}
.main1 .popupZone .r-span a.stop.active,
.main1 .popupZone .r-span a.play.active{display:inline-block;}

.main1 .main1box2 span.r-span {float: right;font-weight: 400;width: 42%;display: inline-block;text-align: right;}
.main1 .main1box2 span.blue {color: #548ec5;}
.main1 .main1box2 .r-span a {display: inline-block; width: 21px; height: 21px; vertical-align: middle;}
.main1 .main1box2 .r-span .prev{background: url("../img/btn-prev.gif") no-repeat 50% 50%;}
.main1 .main1box2 .r-span .next{background: url("../img/btn-next.gif") no-repeat 50% 50%;}
.main1 .main1box2 .r-span .stop{background: url("../img/btn-pause.gif") no-repeat 50% 50%;}
.main1 .main1box2 .r-span .play{background: url("../img/btn-play.gif") no-repeat 50% 50%;}
.main1 .main1box2 a.arrow.right {position: relative;display: inline-block;bottom: 124px;left: 2px;}
.main1 .main1box2 a.arrow.left {display: inline-block;position: relative;bottom: 124px;left: -4px;float: right;}
.main1 .main1box2 a.popupImg {display: inline-block;height: 179px;width: 100%;margin: 0 auto; text-align: center;    background: #d8d8d8;}
.main1 .main1box2 .main1 {height: auto;overflow: hidden;height: 327px;}
/*.main1 .main1box2 .popupImg img {height: 165px;}*/
.main1 .main1box2 .searchBox a { position: absolute;display: inline-block;right:0; width: 49px; height: 49px;background: #fff;vertical-align: middle;text-align: center; line-height:49px;}
.main1 .main1box2 .popup-img a.bx-prev{ position: absolute; top:48px; z-index: 999; bottom: 159px; left: 11px; float: left; background: url("../img/incheon_popup_larrow.png") 100% no-repeat; width: 45px; height: 100px; font-size: 0;}
.main1 .main1box2 .popup-img a.bx-next {position: absolute; top:48px; z-index: 999; bottom: 159px; right: 21px; width: 45px; height: 100px; font-size: 0; float: right; background: url("../img/incheon_popup_rarrow.png") 100% no-repeat;}

.main2 {clear: both;margin-top: 25px;width: 100%;height: auto;overflow: hidden;}
.main2 .noticeWrap{ width: 50%;float: left;}
.main2 .notice {height: 270px;border: 1px solid #dadada;}
.main2 ul.title {width: 100%;border-bottom: 1px solid #dadada;}
.main2 ul.title li a { display: block; padding:16px 13px 12px;font-size: 16px;font-weight: 500;vertical-align: middle;}
.main2 ul.title li a.prev{ padding:0;width: 34px; height: 45px;background: url("../img/btn-prev2.gif") no-repeat 50% 50%;}
.main2 ul.title li a.next{ padding:0;width: 34px; height: 45px;background: url("../img/btn-next2.gif") no-repeat 50% 50%;}
.main2 ul.title li a.more{ padding:0;width: 34px; height: 45px;background: url("../img/btn-more2.gif") no-repeat 50% 50%;}
.main2 .notice ul.title li {display: inline-block;}
.main2 .notice ul.title li.lastLi a{ display: block; /*width: 15px;*/height:15px;background: url("../img/btn-more.gif") no-repeat 50% 50%;}
.main2 .notice ul.title li.lastLi a .blind{text-indent:-999em}
.main2 .notice ul.title li span {margin-left: 22px;display: inline-block;vertical-align: -webkit-baseline-middle;}
.main2 .notice ul.title li a{background: url("../img/incheon_txt.png") no-repeat 0 17px;}
.main2 .notice ul.title li:first-child a{ background: none;}
.main2 .notice ul.title li.on a {color: #006bb6!important;font-weight: 800!important;vertical-align: middle;}
.main2 .notice ul.list {padding: 22px 20px 22px;}
.main2 .notice .list li.on-cont {/*width: 96%;height: 85px;*/display: inline-block;padding-bottom: 5px!important; padding-top: 0;}
.main2 .notice .on-cont span.title {font-weight: 600;margin-left: 0;color: #262626;font-size: 16px;}
.main2 .notice .on-cont img {display: inline-block;float: left;max-width: 13%;}
.main2 .notice p.title {font-weight: 800;font-size: 15px;color: #4c4c4c;}
.main2 .notice .list .on-cont a {display: inline-block;padding-left: 13px;width: 80%; height: 85px;}
.main2 .notice ul.list li {width: 100%;float: left; padding-top: 7px;}
.main2 .notice ul.list li.on{ border-top: 1px dashed #dadada;  padding-top: 24px;}
.main2 .notice .list li a {overflow:hidden; display: inline-block;float: left;font-size: 14px;font-weight: normal;color: #b6b6b6;width: 100%;}
.main2 .notice .list li.on a span.not-sub{color:#006bb6;}
.main2 .notice ul.list{display:none;}
.main2 .notice ul.list.on{display:block; overflow:hidden;}
.main2 span.date {font-size: 13px; color: #444; margin-left: 0!important; float: right; position: relative; text-align: right; display: inline-block;}
.main2 p.date {font-size: 13px;margin-top: 7px; margin-bottom: 5px;color:#444}
.main2 span.content {margin-left: 0!important;color: #555;width: 100%; font-size: 14px; font-weight: 500; text-overflow: ellipsis; overflow: hidden; display: inline-block; white-space: nowrap;}
.main2 .book {width: 25%;height:270px;display: inline-block;float: left;/*height: 250px*/border: 1px solid #dadada;border-left: 0;border-right: 0;}
.main2 ul.title.li {overflow:hidden;}
.main2 ul.title.li li:first-child a{ font-weight: 800; color:#222}
.main2 .title.li li {display: inline-block;border-left: 1px solid #dadada;text-align: center;vertical-align: middle;float: right;}
.main2 .title.li li:first-child {border: 0;text-align: left;float: left;}
.main2 .bookContent .book ul.title li a {display: inline-block;}
.main2 .bookContent a {display: inline-block;vertical-align: middle;height: 100%;width: 103%;text-align: center;}
.main2 .bookContent {clear: both;width: 94%;height: 66%;vertical-align: middle;display: block;padding: 18px;padding-right: 0;padding-top:33px; padding-bottom: 23px;}
.main2 .bookContent .bookImg {width: 93px;display: inline-block;height: 100%;position: relative;text-align: center;margin-right:17px;vertical-align: top;}
.main2 .bookContent .bookEx {width: 50%;display: inline-block;padding-left: 0;overflow: hidden; text-align: left;letter-spacing: 0;}
.main2 .bookContent .bookEx span.title{ overflow:hidden;  width: 90%;white-space: nowrap;text-overflow: ellipsis;
	display: inline-block;}
.main2 span.title {font-size: 16px;font-weight: 600;display: inline-block;color:#292929}
.main2 span.name {font-size: 14px;display: block;padding-top: 5px;color: #444;}
.main2 span.name img {margin: 0 4%;vertical-align: middle;}
.main2 p.code {font-size: 13px; color:#444}
.main2 span.explain {width:88%;display: block;padding-top: 15px;font-size: 14px;overflow: hidden;color: #444;font-weight:normal; line-height:1.3;height: 90px;}
.main2 .book ul li span.blind{font-size:0;}
.main2 .calenderWrap{ width: 25%;float: left;}
.main2 .cal {/*display: inline-block;*/border-left: 0;border: 1px solid #dadada;overflow: hidden;height: 270px;}
.main2 .cal ul.title.li .lastLi a{overflow:hidden; padding:0;width: 34px; height: 45px;background: url("../img/btn-more2.gif") no-repeat 50% 50%;}
.main2 .cal ul.title.li .lastLi a .blind{ display: block;text-indent:-999em}


.main3 {width: 100%;height: 100%;overflow: hidden;margin: 25px 0 45px 0;}
.main3 .banner {width: 50%;float: left;text-align: center;vertical-align: middle;}
.main3 .banner .bannerWrap{overflow:hidden;border: 1px solid #dadada;}
.main3 ul.bannerImg {width: 100%;float: left;overflow: hidden;display: inline-block;height: 45px;z-index: 9999;}
.main3 .bannerImg li {padding-left: 10px;overflow: hidden;float: left;}
.main3 .bannerbox {width: 76%;float: left;overflow: hidden; padding-top: 22px; padding-bottom: 18px;}

.main3 .quickMenu {width: 50%;float: left;display: inline-block;border-left: none;}
.main3 .quickMenu .quickWrap{overflow:hidden;/*border: 1px solid  #dadada;border-left:none;*/}
.main3 .quickMenu ul {overflow:hidden; width: 100%;height: 100%;border-top:1px solid  #dadada;}
.main3 .quickMenu li {width: 25%;float: left;height: 91px;/*border-left: 1px solid #dadada;*/}
.main3 .quickMenu a {display: block; position: relative;vertical-align: middle;padding: 19px 17px;border-right: 1px solid  #dadada;border-bottom: 1px solid  #dadada;height:51px}
.main3 .quickMenu a:hover {background:#f0f0f0;}
.main3 .quickMenu a i {font-size: 0;}
.main3 .quickMenu li.on {border-left: 0;color: #fff!important;}
.main3 .quickMenu li.on a{border:none;background: #47b6d4;border-bottom:1px solid #47b6d4}
.main3 .quickMenu li.on a:hover{background: #f0f0f0;}

.main3 .quickMenu li img { position: absolute; bottom: 15px; right: 17px;}
.main3 span.subject {width: 100%;display: block;height: 38px; font-size: 15px; font-weight: 500;}
.main3 span.subject.on {color: #fff;}

.bannerBtn {width: 20%;float: left;padding-left: 18px; padding-top: 19px;}
.bannerBtn p {font-size: 16px;font-weight: 600;padding: 3px;text-align: left;color:#222}
.bannerBtn .btnBox{overflow:hidden; width: 105px;}
.bannerBtn a {display:block; float:left; /*border: 1px solid #dadada;*/}
.bannerBtn p a span{font-size:0;}
.main3 .banner .bannerBtn a.prev{ width: 26px; height: 27px;background: url("../img/btn-prev3.gif") no-repeat 0 0;}
.main3 .banner .bannerBtn a.next{ width: 26px; height: 27px;background: url("../img/btn-next3.gif") no-repeat 0 0;}
.main3 .banner .bannerBtn a.stop{ width: 26px; height: 27px;background: url("../img/btn-pause3.gif") no-repeat 0 0;}
.main3 .banner .bannerBtn a.play{ width: 26px; height: 27px;background: url("../img/btn-play3.gif") no-repeat 0 0;}
.main3 .banner .bannerBtn a.more{ width: 27px; height: 27px;background: url("../img/btn-more3.gif") no-repeat 0 0;}

.main3 .banner .bannerBtn a.stop,
.main3 .banner .bannerBtn a.play{display:none;}
.main3 .banner .bannerBtn a.stop.active,
.main3 .banner .bannerBtn a.play.active{display:inline-block;}



.list li.on img {width: 31px;text-align: left;font-size: 12px;color: gray;margin-left: 0!important;vertical-align: text-bottom}
.searchInput{ position: relative;height: 49px;overflow:hidden;background:#fff;margin-top: 13px;}
span.not-sub { float:left; padding-left: 10px;background: url("../img/ico-blet.gif") no-repeat 0 50%;;margin-left: 0!important; width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; color:#555}
img.book {position: relative;}
/* img.tag {position: relative;float: left;z-index: 999;} */

.book .bookContent .bookImg .tag {position: absolute;top: -2px;left: 5px;z-index:  999;height: 36px;line-height: 32px;color: #fff;font-size: 10px;width: 30px;text-align:  center;}

.cal .calendar .box { overflow: hidden;border: aliceblue;height: auto;width: 100%;}
.cal .calendar #planBox {overflow: hidden;padding-bottom: 0;background-color: #fff;/*float: right;*/}
.cal .calendar .info {padding-bottom: 15px;}
.cal .calendar .info, .calendar .cal_area {float: left}
.cal .calendar .info {width: 100%;}
.cal .calendar .cal_area {height: auto;overflow: hidden;width: 100%;}
.cal .calendar h3 {display: block;font-weight: bold;padding-top: 5px}
.cal .calendar h3, .calendar .cal-func {width: 100%;overflow: hidden;text-align: center;height: 35px;}
.cal #calendar .cal-tbl {width: 63%;display: inline-block;margin-top: 4px;color:#3b3b3b; text-align: center;}
.cal .calendar .info i, .calendar td a {display: block;color: #fff;}
.cal .calendar td a {line-height: 23px;height: 23px;width: 23px;margin: 0 auto}
.cal .calendar .type-r {background-color: #929292}
.cal .calendar .type-e {background-color: #eb5722;}
.cal .calendar .type-m {background-color: #156da8}
.cal .calendar .info li {font-size: 13px;font-weight: normal;padding: 2px 0}
.cal #calendar li i {padding: 0px;border-radius: 20px; display:inline-block; width: 10px; height: 10px; vertical-align: middle;}
.cal .calendar .info li i, .calendar .info li span {display: inline-block;vertical-align: middle}
.cal .calendar .t1 {color: #353535;font-size: 23px;line-height: 39px; vertical-align: middle;}
.cal .calendar .t2 {font-size: 10px;color: #dbdbdb;font-weight: 800;text-align: center;width: 50%;}
.cal #calendar table, #calendar table th, #calendar table td {border: 0;padding: 0}
.cal #calendar table th, #calendar table td, #calendar table td div {font-size: 11px;font-weight: normal;line-height: 2.1;}
#calendar table td div a{ }
#calendar table td div a.closed{color:#eb5722; font-weight: bold;}
#calendar table td div a.event{color:#156da8; font-weight: bold;}
#calendar table td div p{ width: 20px; height: 20px; margin:0 auto; color:#fff; border-radius: 30px; background: #a2a2a2; line-height:22px;}
.cal #calendar .btn {border: 0;background: none; line-height: 35px; vertical-align: middle;}
.cal #planList {display: none}
.cal .cal-func a.btn {color: #888;margin-top: -2px;font-size: 30px;}
.cal .cal-func a.btn:focus, .cal-func a.btn:hover {color: #222}
.cal .cal-func a, .cal-func div {line-height: 35px;display: inline-block; vertical-align: middle;padding:0 5px}
.cal .cal-func b span, .cal-func div em {vertical-align: middl}
.cal .cal-func b {font-size: 120%; padding:0% 2%;}
.cal .cal-func b em {color: #67940a}
.cal #calendar .cal-tbl td {white-space: nowrap;width:1%}
.cal #calendar .cal-tbl td div {margin: 0 10%}
.cal .calendar .more {background: url("/resources/homepage/geic/img/s_plus.png" ) no-repeat 0	0;float: right;font-size: 0px;width: 21px;height: 21px;margin-top: -22px;}
.cal .calendar .cal-area {overflow: hidden;width: 100%;height: 176px;display: inline-block;}
.cal .planList2 .planDay {color:#23c2ee;}
.cal .planList {clear: both;height: auto;float: right;overflow: hidden;width: 100%;}
.cal .calendar {width: 100%;height: auto;}
.cal ul.cal-cont {display: inline-block;text-align:left;padding-top: 20px;font-size: 12px;color:#222}
.cal .cal-cont li {padding-bottom: 0px;}
.cal .planList2 {width: 100%;text-align: left;float: left;clear: both;display: inline-block;margin-top: 11px;}
.cal #calendar .planList2 span {font-size: 12px;}
.cal #calendar {float: left;width: 100%; padding-top: 11px;}
.cal .cal-today {width: 30%;float: left;text-align: center;padding-top: 10px;}
.cal span.cal-date {font-size: 35px;font-weight: 900;color: #4c4c4c;display: block;padding-top: 10px;}
.cal p.cal-n1 {font-size: 13px;}
.cal i.type-t {padding: 0px 5px;border-radius: 20px;background: gray;}

.bookCopy {height: 149px;text-align: center;display: inline-block;width: 100px;	background-size: 100%!important;}
.main2 .notice ul.title li.lastLi {border-left: 0!important; float: right;padding-right: 14px; padding-top: 3px;}

.popup-img ul li {display:none;}
.popup-img ul li.on {display:inline-block!important;}

#footer{ margin-top: 0;}

/*이미지 고정 및 불필요한 font 사이즈 변경*/
.bannerbox li img{width: 167px; height: 45px;}
.bannerbox .bannerImg li span a i{position: absolute; font-size: 0;}
.fa-external-link{font-size: 0}

@media (max-width: 1000px){
	.on-cont img{display:none!important;}
	.main1 .main1box1{width:100%!important;}
	.main1 .main1box2{width:100%!important}
	.list .on-cont a{padding-left:0!important;width: 100%!important;}
	.notice ul.list .on-cont{padding-left: 0;width: 93%;}
	.notice ul.list li{padding-left: 5px;}
	.bookContent{padding:3%;}

	img.bookfront{position: relative;text-align: center;min-width: 97px!important;}
	.banner{display:none!important;}
	.quickMenu{width:100%!important; margin-bottom:20px;}
	#calendar .cal-tbl td{padding:0!important}
	.searchBox input{width:82%!important}
	span.not-sub{ width: 70%;}
	.main2 .book{ width: 50%;}
	.calenderWrap{width:100%!important; margin-top: 10px;}
.bx-viewport { height: auto;}
}


@media (max-width: 765px){

	
	.bookImg{float: left;position: relative;text-align: center;padding-left: 0;}
	.bookImg{width: 30%!important;padding-left: 0;}
	.bookEx{/*width: 80%!important;*/margin-left: 0;height: auto!important;float: left;}
	.bookEx span.title{width:90%!important;text-align: left;}

	.cal #calendar .cal-tbl{text-align:center; margin-left:0px;}
	#container .mainImg{display:none;}

	/*.main1 .main1box1{width:100%!important}*/
	/*.main1 .main1box2{width:100%!important}*/
	.main1{height:auto!important; overflow:hidden;}
	.main2 span.explain{/*height:auto;*/width:100%;}
	.main2 .searchBox{width: 99%!important;padding-left: 1.5%;}
	.main2 .popupZone{width:100%!important}
	.main2 .popup-img, .popupImg{width: 100%;!important}
	.main2 .popupImg img{width: 738px!important;}
	.main2 .noticeWrap{width:100%!important; height:auto!important;}
	.book{width:100%!important;height:auto!important;margin-top:10px!important;}
	
	.book .title li{padding: 0px!important;	}
	img.bookfront{width: 120px!important;	}
	.on-cont img{display:inline-block!important;}
	.list .on-cont a{width:80%!important; padding-left: 10px!important;}
	.cal .calendar #planBox{width:85%; margin: 0 auto; float:none;}
	.calendar .cal-func{width:100%}
	span.not-sub{width:70%}
	/*.main1 .main1box2 .popupZone{margin-top:30px;}*/
	.main2 .bookContent{padding-top:5%;}
	.main2 .notice .list li.on-cont{margin-bottom:5px}
	.main3 {margin: 10px 0 0 0;}
	.main3 .quickMenu li{width:50%}

	
}


@media all and (max-width:580px){

	.main1 .main1box1 ul li { width:50%;}
	.main2 {margin-top: 10px;}
	.main2 ul.title li a{padding:16px 7px 12px}
	
	.on-cont img {display: none !important;}
    .on-cont a{font-size: 18px;}
	#container span.wt,#container span.bt{ font-size: 23px;}
	#container span.wt-s { font-size: 18px; }
	.main3 .quickMenu li{width:50%}
	span.not-sub{width:60%}
	.main2 .notice .list li {}
	.main2 .notice ul.list {padding: 23px 15px 20px 10px; }
}