@charset "UTF-8";

/*layout*/
#header{position:fixed;}
#container{padding-top:80px;}

/*visual*/
#main article{position:relative;max-width:1220px;box-sizing:border-box;margin:0 auto;}
#main article h4{
	padding:50px 0 30px;
	text-align:left;font-weight:400;font-size:35px;color:#013769;letter-spacing:-2px;line-height:1.3em
}
#main article h4:after{content:'';display:inline-block;width:34px;height:1px;margin:28px 0 0 13px;background:#8a8888;vertical-align:top}
#main .more{position:absolute;right:0;top:70px;}
#main .more a{display:inline-block;padding-right:21px;background:url(../img/common/ico_more_blue.png) no-repeat right center;font-size:13px;color:#013769}

#main #visual{position:relative;border-bottom:3px solid #3374be}
#main #visual .slick-slide{
	height:610px;
	background-size:cover;background-position:center;
}
#main #visual .slick-slide div{display:none}
#main #visual .slick-slide p,
#main #visual .slick-slide dl{
	position:absolute;left:50%;bottom:70px;
	width:1220px;
	margin-left:-610px;
}
#main #visual .slick-slide dl dt{
	font-size:40px;font-weight:500;color:#fff;line-height:1.1em;letter-spacing:-2px
}
#main #visual .slick-slide dl dt b{display:block;font-size:40px;font-weight:500;color:#fff;}
#main #visual .slick-slide dl dd{
	max-width:60%;height:24px;
	margin-top:30px;
	font-size:16px;font-weight:400;color:#fff;word-break:keep-all;
}
#main #visual .slick-slide dl dd a{
	display:inline-block;
	padding-right:35px;
	background:url(../img/common/ico_more_blue_big.png) no-repeat right 55%;
	font-size:14px;
}
#main #visual .slick-counter{position:absolute;bottom:60px;left:50%;width:610px;font-size:20px;color:#fff;text-align:right}
#main #visual .slick-counter .total{font-size:20px;color:#fff;opacity:0.5}
#main #visual .slick-counter .current{font-size:31px}
#main #visual .slick-dots{visibility:hidden;position:absolute}
#main #visual .slick-arrow,
#main #visual .btn_pause,
#main #visual .btn_play{position:absolute;bottom:69px;left:50%;display:block;width:20px;height:25px;background:url(../img/common/btn_prev.png) no-repeat center;font-size:0;z-index:10}
#main #visual .slick-track{z-index:5}
#main #visual .slick-prev{margin-left:425px;}
#main #visual .slick-next{margin-left:493px;background-image:url(../img/common/btn_next.png)}
#main #visual .btn_pause{margin-left:458px;background-image:url(../img/common/btn_stop.png)}
#main #visual .btn_play{margin-left:458px;background-image:url(../img/common/btn_play.png)}

#pressRelease article{width:100%;overflow:hidden;}
#pressRelease .pressRelease{position:relative;margin-bottom:70px}
#pressRelease .pressRelease ul{display:table;table-layout:fixed;width:calc(100% + 30px);margin-left:-30px;font-size:0}
#pressRelease .pressRelease ul li{display:table-cell;box-sizing:border-box;padding:0 30px;vertical-align:top}
#pressRelease .pressRelease ul li+li{border-left:1px solid #eee;}
#pressRelease .pressRelease ul li a{display:block;}
#pressRelease .pressRelease ul li time{display:block;font-size:14px;color:#3374be;font-weight:600}
#pressRelease .pressRelease ul li dt{
	max-height:96px;margin:15px 0;
	overflow: hidden;
	white-space:normal;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	word-wrap:break-word;
	font-size:19px;color:#353535;font-weight:600;line-height:1.3em
}
#pressRelease .pressRelease ul li dd{
	max-height:72px;
	overflow: hidden;
	white-space:normal;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	word-wrap:break-word;
	font-size:14px;color:#5e6b7e;line-height:1.3em
}
#pressRelease .pressRelease ul li dd p,
#pressRelease .pressRelease ul li dd span,{font-size:14px;color:#5e6b7e;line-height:1.3em}
#pressRelease .chairperson{position:relative;float:left;width:calc(50% - 30px)}
#pressRelease .pressRelease ul{display:table;table-layout:fixed;width:calc(100% + 30px);margin-left:-30px;font-size:0}
#pressRelease .pressRelease ul li{display:table-cell;box-sizing:border-box;padding:0 30px;vertical-align:top}
#pressRelease .pressRelease ul li+li{border-left:1px solid #eee;}
#pressRelease .pressRelease ul li a{display:block;}
#pressRelease .pressRelease ul li time{display:block;font-size:14px;color:#3374be;font-weight:600}
#pressRelease .pressRelease ul li dt{
	max-height:96px;margin:15px 0;
	overflow: hidden;
	white-space:normal;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	word-wrap:break-word;
	font-size:19px;color:#353535;font-weight:600;line-height:1.3em
}
#pressRelease .pressRelease ul li dd{
	max-height:72px;
	overflow: hidden;
	white-space:normal;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	word-wrap:break-word;
	font-size:14px;color:#5e6b7e;line-height:1.3em
}
#pressRelease .chairperson{position:relative;float:left;width:48%}
#pressRelease .chairperson p{position:absolute;top:-15px;left:15px;}
#pressRelease .chairperson dl{
	min-height:247px;box-sizing:border-box;
	padding:35px 20px 20px 298px;
	background:#3374be url(../img/main/chairperson_bg.png) no-repeat right bottom;background-size:auto 120%
}
#pressRelease .chairperson dl dt{font-size:26px;color:#fff;line-height:1.3em}
#pressRelease .chairperson dl dd{margin-top:20px;font-size:14px;color:#fff;letter-spacing:0}
#pressRelease .chairperson dl dd+dd{margin-top:50px}
#pressRelease .chairperson dl dd a{display:inline-block;padding-right:21px;background:url(../img/common/ico_more_white.png) no-repeat right center;}
#pressRelease .other_site{float:right;width:calc(50% - 30px)}
#pressRelease .other_site p{margin-bottom:14px;font-size:0}
#pressRelease .other_site p a{display:inline-block;width:calc(50% - 3px);box-sizIng:border-box;padding:12px 20px;border:1px solid #555;background:url(../img/common/ico_more_blue.png) no-repeat right 20px top 20px;font-size:15px;color:#353535;font-weight:600;vertical-align:top}
#pressRelease .other_site p a span{display:block;margin-top:5px;font-size:13px;color:#666;}
#pressRelease .other_site p a+a{margin-left:6px;}
#pressRelease .other_site li+li{border-top:1px solid #e1e1e1}
#pressRelease .other_site li a{display:block;padding:12px 40px 12px 0;background:url(../img/common/ico_more_blue.png) no-repeat right center;font-size:14px;color:#353535;font-weight:600}
#pressRelease .other_site li a img{vertical-align:middle;margin-right:10px;}

#photoGallery{position:relative;padding:1px 0 96px;margin-top:163px;background:#013769}
#photoGallery article{margin-top:-156px;}
#photoGallery .slick-list{overflow:visible}
#photoGallery .slick-slide{width:475px;overflow:hidden;}
#photoGallery .slick-slide a{position:relative;display:block;background-size:cover;background-position:center;}
#photoGallery .slick-slide a img{width:100%}
#photoGallery .slick-slide a b{
	position:absolute;bottom:0;left:0;display:block;width:100%;box-sizing:border-box;padding:30px 20px 20px;
	background: rgb(0,0,0);background:linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 0%, rgba(136,136,136,0) 93%);
	font-size:14px;color:#fff;font-weight:normal
}
#photoGallery .slick-arrow{position:absolute;top:30px;left:0;display:block;width:60px;height:60px;background:#3374be url(../img/common/btn_next2.png) no-repeat center;font-size:0;z-index:1}
#photoGallery .slick-prev{margin-left:-60px;background-image:url(../img/common/btn_prev2.png)}
#photoGallery .slick-arrow.slick-disabled{background-color:#ddd}
#photoGallery .slick-dots{position:absolute;visibility:hidden}


#network article{width:100%;overflow:hidden;padding: 50px 0 60px;}
#network article h4{padding-bottom:20px;}
#network ul{width:calc(100% + 10px);margin-left:-10px;font-size:0}
#network ul li{display:inline-block;margin:10px 0 0 10px;font-size:0}
#network ul li a{display:block;border:1px solid #e1e1e1;font-size:0}
/*
#network .network{float:left;width:350px;}
#network .network ul{width:calc(100% + 14px);margin-left:-14px;font-size:0;overflow:hidden;}
#network .network ul li{display:inline-block;width:calc(50% - 14px);margin:-1px 0 0 14px;border-top:1px solid #e1e1e1;vertical-align:top}
#network .network ul li a{display:block;height:45px;line-height:45px;background:url(../img/common/ico_more_blue.png) no-repeat right center;font-size:14px;color:#353535;font-weight:600}
#network .pr{position:relative;float:right;width:calc(100% - 410px)}
#network .pr ul{width:calc(100% + 30px);margin-left:-30px;font-size:0}
#network .pr ul li{display:inline-block;width:calc(50% - 30px);margin-left:30px;vertical-align:top}
#network .pr ul li dt a{position:relative;display:block;background-size:cover;background-position:center;}
#network .pr ul li dt img{width:100%}
#network .pr ul li dd{margin:10px 0 20px;font-size:15px;color:#353535;font-weight:600;}
#network .pr ul li>a{display:inline-block;padding-right:21px;background:url(../img/common/ico_more_blue.png) no-repeat right center;font-size:13px;color:#013769}
#network .pr .slick-counter{position:absolute;right:0;top:-35px}
#network .pr .slick-counter .current{font-weight:600;color:#013769}
*/
#contact article{max-width:100%;width:100%;overflow:hidden;}
#contact .contact{position:relative;float:left;width:calc(50% + 190px);min-height:315px;background:url(../img/main/contact_bg.jpg) no-repeat;background-size:cover;background-position:right 0}
#contact .contact div{position:absolute;right:0;top:34px;width:800px;box-sizing:border-box;}
#contact .contact div p{max-width:380px;margin-bottom:20px;font-size:15px;color:#353535;font-weight:500}
#contact .contact div a{display:inline-block;padding-right:21px;background:url(../img/common/ico_more_blue.png) no-repeat right center;font-size:13px;color:#013769}
#contact .brochure{position:relative;float:right;width:calc(50% - 190px);min-height:285px;margin-top:30px;background:#3374be url(../img/main/brochure_bg.png) no-repeat 245px bottom;}
#contact .brochure div{max-width:366px;margin:0 0 0 65px;}
#contact .brochure div h4{color:#fff}
#contact .brochure div h4:after{background:rgba(255,255,255,0.4)}
#contact .brochure div p{max-width:380px;margin-bottom:20px;font-size:15px;color:#fff;font-weight:500}
#contact .brochure div a{display:inline-block;padding-right:21px;background:url(../img/common/ico_more_white.png) no-repeat right center;font-size:13px;color:#fff}

/* 200206 추가 */
#main section:nth-child(2)#bannerCollect .bn_organ:before,
#main section:nth-child(2)#bannerCollect .bn_organ:after,
#main section:nth-child(4)#bannerCollect .bn_organ:before,
#main section:nth-child(4)#bannerCollect .bn_organ:after{display:none}
#main #bannerCollect{padding:80px 0}
#main #bannerCollect article{box-sizing:border-box}
#main #bannerCollect .noti_area{position:absolute;top:0;left:0;width:352px}
#main #bannerCollect .noti_area .slick-slide{width:352px}
#main #bannerCollect .noti_area .slick-slide a{display:block;background-size:contain;background-position:center;background-repeat:no-repeat;background-color:#333}
#main #bannerCollect .noti_area .slick-dots{position:absolute;top:-39px;bottom:auto;left:auto;right:30px}
#main #bannerCollect .noti_area .slick-dots li button{display:none}
#main #bannerCollect .noti_area .slick-dots li.slick-active button{border-color:#18437b}
.slick-dots li button.btn_pause,
.slick-dots li button.btn_play{width:12px;height:12px;border:0;border-radius:0;background:url(../img/main/stop.png) no-repeat center;}
#main #bannerCollect .noti_area .slick-dots li button.btn_pause{display:block;margin-right:0;background-image:url(../img/main/stop2.png);font-size:0;}
#main #bannerCollect .noti_area .slick-dots li button.btn_play{display:block;margin-right:0;background-image:url(../img/main/play2.png)}
#main #bannerCollect .noti_area .slick-arrow{
	position:absolute;top:-45px;right:50px;
	display:block;width:24px;height:24px;
	background:Url(../img/main/btn_prev4.png) no-repeat center;
	font-size:0;z-index:1
}
#main #bannerCollect .noti_area .slick-arrow.slick-next{right:0;background-image:Url(../img/main/btn_next4.png)}
#main #bannerCollect .noti_area .slick-counter{
	position:absolute;top:-44px;right:80px;
	font-size:15px;color:#888;font-family: 'Roboto';
}
#main #bannerCollect .noti_area .slick-counter .current{color:#0b78e8}

#main #bannerCollect .bn_aside,
#main #bannerCollect .bn_organ{margin-left:434px}

/*200206 시작*/
#main #bannerCollect .bn_aside{padding-top:125px;}
#main #bannerCollect .bn_aside ul{font-size:0;text-align:left;}
#main #bannerCollect .bn_aside ul li {display:inline-table;width:calc(33% - 7px);margin:0 0 12px 10px;border:1px solid #e1e1e1;vertical-align:top}
#main #bannerCollect .bn_aside ul li:nth-child(3n-2) {margin-left:0;}
#main #bannerCollect .bn_aside ul li a {display:table-cell;height:63px;font-size:0;vertical-align:middle;}
#main #bannerCollect .bn_aside ul li a span{display:block;font-size:0}
#main #bannerCollect .bn_aside ul li a b{display:block;font-size:14px;color:#003567;letter-spacing:-1px;line-height:1.2em}
/*200206 끝*/

#main #bannerCollect .bn_organ{position:relative;box-sizing:border-box;height:78px;padding:17px 30px 0;border-top:1px solid #e0e6ed}
#main #bannerCollect .bn_organ:before,
#main #bannerCollect .bn_organ:after{
	content:'';
	position:absolute;top:0;right:30px;
	display:block;width:43px;height:100%;
	background:url(../img/main/bn_organ_bg.png) repeat-y;
	z-index:9
}
#main #bannerCollect .bn_organ:before{right:auto;left:10px;transform:rotate(180deg)}
#main #bannerCollect .bn_organ li{padding:0 25px}
#main #bannerCollect .bn_organ .slick-arrow{
	position:absolute;top:50%;left:-30px;
	display:block;width:30px;height:30px;
	margin-top:-15px;
	background:url(../img/main/btn_prev.png) no-repeat center;
	font-size:0;z-index:10
}
#main #bannerCollect .bn_organ .slick-arrow.slick-next{left:auto;right:-30px;background-image:url(../img/main/btn_next.png)}
#main #bannerCollect .bn_organ .slick-arrow.slick-disabled{opacity:.1}
#main #bannerCollect .bn_organ li a{display:block;}

@media all and (max-width:1300px){
	#main #visual .slick-slide p, #main #visual .slick-slide dl{left:40px;margin:0}
	#main #visual .slick-counter{left:auto;right:40px;width:auto;margin:0}
	#main #visual .slick-arrow, #main #visual .btn_pause, #main #visual .btn_play{left:auto;right:0}
	#main #visual .slick-next{margin:0 128px 0 0}
	#main #visual .btn_pause,
	#main #visual .btn_play{margin:0 162px 0 0}
	#main #visual .slick-prev{margin:0 194px 0 0}

	#main article{padding:0 40px}
	#bannerCollect article{margin:0 40px;padding:0;} /*200206*/
	#photoGallery .more{right:40px}
	#network article{padding:50px 40px 60px;text-align:center}
	#contact article{padding:0}
	#contact .contact div{width:100%;padding-left:40px}
	#contact .brochure div{margin-left:35px}

}

@media all and (max-width:1041px){
	#container{padding-top:133px;}

	#main #visual .slick-slide{height:67vw;background-color:#000;background-size:140% auto;background-repeat:no-repeat;background-position:center 0}
	#main #visual .slick-slide p, #main #visual .slick-slide dl{
		box-sizing:border-box;
		padding:30px 250px 30px 30px;
		left:0;bottom:0;width:100%;
		background:#011b3e
	}
	#main #visual .slick-slide dl dt{font-size:30px}
	#main #visual .slick-slide dl dt b{line-height:1.2em;font-size:30px}
	#main #visual .slick-slide dl:before{
		content:'';
		position:absolute;bottom:100%;left:0;
		display:block;width:100%;height:100px;
		background: url(../img/main/visual_bg.png) repeat-x;background-size:auto 100%
	}
	#pressRelease .chairperson{width:100%}
	#pressRelease .other_site{width:100%;margin-top:30px}
	#network .network,
	#network .pr,
	#contact .contact,
	#contact .brochure{width:100%}
	#contact .brochure{margin-top:0}

	/*200206 시작*/
	#main #bannerCollect .bn_aside {margin-left:402px;}
	#main #bannerCollect .bn_aside ul li {width:calc(32% - 7px);}
	/*200206 끝*/
}

@media all and (max-width:768px){
	#container{padding-top:67px;}
	#main #visual .slick-slide{height:54vw}
	#main #visual .slick-slide dl:before{height:60px}
	#main #visual .slick-slide p, #main #visual .slick-slide dl{padding:0 20px 20px}
	#main #visual .slick-slide dl dt,
	#main #visual .slick-slide dl dt b{font-size:20px}
	#main #visual .slick-slide dl dt,
	#main #visual .slick-slide dl dd{max-width:100%}
	#main #visual .slick-slide dl dd{margin-top:10px}
	#main #visual .slick-slide dl dd a{
		position:absolute;top:0;left:0;
		display:block;width:100%;height:100%;
		background:none;
		font-size:0;
	}
	#main #visual .slick-arrow, #main #visual .btn_pause, #main #visual .btn_play, #main #visual .slick-counter{visibility:hidden;display:none;opacity:0}
	#main #visual .slick-dots{visibility:visible;left:0;bottom:20px;width:100%;font-size:0;text-align:center;}
	#main #visual .slick-dots li{display:inline-block;padding:0 5px;}
	#main #visual .slick-dots li button{display:block;width:10px;height:10px;border:1px solid #fff;border-radius:50%;font-size:0}
	#main #visual .slick-dots li.slick-active button{background:#fff}

	#main article{padding:0 20px;}
	#main article h4{padding:30px 0 20px;font-size:28px;}
	#main .more{position:relative;top:0;margin-top:30px;text-align:right}

	/*#pressRelease .pressRelease>div{width:100%;overflow:auto;overflow-y:hidden;}*/
	.mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action, .mCustomScrollBox{outline:none}
	#pressRelease .pressRelease{margin-bottom:50px}
	#pressRelease .pressRelease .more{margin-top:10px}
	#pressRelease .pressRelease ul{min-width:1200px}

	#pressRelease .other_site p a{display:block;width:100%}
	#pressRelease .other_site p a+a{margin:5px 0 0}
	#pressRelease .other_site li a{position:relative;padding:10px 40px}
	#pressRelease .other_site li a img{position:absolute;top:50%;left:0;margin-top:-11px}

	#photoGallery{padding-bottom:30px;}
	#photoGallery .slick-slide ul{width:100%}
	#photoGallery .slick-slide ul li a b{padding-top:50px;}
	#photoGallery .slick-slide ul li a b span{
		display:block;max-height:38px;
		overflow: hidden;
		white-space:normal;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		word-wrap:break-word;
	}
	#photoGallery .slick-dots{position:relative;visibility:visible;margin-top:20px;font-size:0;text-align:center;}
	#photoGallery .slick-dots li{display:inline-block;padding:0 5px;}
	#photoGallery .slick-dots li button{display:block;width:10px;height:10px;border:1px solid #ddd;background:#ddd;border-radius:50%;font-size:0}
	#photoGallery .slick-dots li.slick-active button{background:#2c81e1;border-color:#2c81e1}
	#photoGallery .more{right:0}
	#photoGallery .more a{color:#fff;background-image:url(../img/common/ico_more_white.png)}
	#photoGallery .slick-arrow{visibility:hidden;opacity:0}

	#network article{padding:25px 20px 30px}
	#network ul{width:calc(100% + 5px);margin-left:-5px}
	#network ul li{width:calc(50% - 5px);margin:5px 0 0 5px;text-align:center}
	#network .pr ul li{width:calc(100% - 30px);margin-bottom:40px}

	#contact article{padding:0}
	#contact .contact{min-height:50px;background:url(../img/main/m/contact_bg.jpg) no-repeat center;background-size:cover}
	#contact .contact div{position:relative;top:0;padding:5px 20px 40px}
	#contact .brochure{min-height:50px;background-size:auto 80%;background-position:right bottom;}
	#contact .brochure div{max-width:100%;box-sizing:border-box;margin:0;padding:5px 20px 40px;}

	/*200206 시작*/
	#main #bannerCollect {padding-bottom:0}
	#main #bannerCollect article {margin:0 20px;padding:0;}
	#main #bannerCollect .noti_area h5{font-size:20px}
	#main #bannerCollect .noti_area{position:relative;width:100%}
	#main #bannerCollect .noti_area .slick-slide {opacity:0.3;}
	#main #bannerCollect .noti_area .slick-slide.slick-active {opacity:1;}
	#main #bannerCollect .bn_aside {margin-left:auto;padding-top:40px;}
	#main #bannerCollect .bn_aside ul li {width:calc(33% - 7px);}
	/*200206 끝*/
}


@media all and (max-width:560px){
	#main #visual .slick-slide{height:70vw}
	#main #visual .slick-slide p, #main #visual .slick-slide dl{padding-bottom:10px}
	#main #visual .slick-slide dl dt,
	#main #visual .slick-slide dl dt b{font-size:18px}
	#main #visual .slick-slide div{position:absolute;top:0;left:0;display:block;width:100%;height:100%;background-position:center;background-size:cover}
	#pressRelease .chairperson{background:#3374be}
	#pressRelease .chairperson p{position:relative;max-width:50%}
	#pressRelease .chairperson dl{min-height:50px;padding:0 20px 30px;background-size:auto 100%}
	#pressRelease .chairperson dl dt{font-size:20px;}
	#pressRelease .chairperson dl dd{margin-top:10px}
	#pressRelease .chairperson dl dd+dd{margin-top:20px}
}

@media all and (max-width:410px){
	/*200206 시작*/
	#main #bannerCollect .bn_aside ul li {width:calc(50% - 7px);}
	#main #bannerCollect .bn_aside ul li:nth-child(3n-2) {margin-left:10px;}
	#main #bannerCollect .bn_aside ul li:nth-child(2n-1) {margin-left:0;}
	/*200206 끝*/
}
