﻿@charset "utf-8";

#subWrapper{overflow:hidden;}
#subWrapper #content{background:url('../imgs/sub/sub_bg.png') no-repeat 100% 0;}
.subVisual{position:relative;z-index:-1;height:250px;overflow:hidden;/*font-family:'SCDream';*/font-size:27px;color:#fff;font-weight:400;text-align:center;text-shadow:1px 1px 1px #000;}
.subVisual:before{position:absolute;top:0;left:0;content:'';display:block;width:100%;height:100%;background:url('../imgs/sub/subVisual1.jpg') no-repeat 50% 0;animation-name:img_move;animation-duration:5s;animation-iteration-count:1;}
.subVisual.sub1:before{background:url('../imgs/sub/subVisual1.jpg') no-repeat 50% 0;}
.subVisual.sub2:before{background:url('../imgs/sub/subVisual2.jpg') no-repeat 50% 0;}
.subVisual.sub3:before{background:url('../imgs/sub/subVisual3.jpg') no-repeat 50% 0;}
.subVisual.sub4:before{background:url('../imgs/sub/subVisual4.jpg') no-repeat 50% 0;}
.subVisual.sub5:before{background:url('../imgs/sub/subVisual5.jpg') no-repeat 50% 0;}
.subVisual.sub6:before{background:url('../imgs/sub/subVisual6.jpg') no-repeat 50% 0;}
.subVisual.sub7:before{background:url('../imgs/sub/subVisual7.jpg') no-repeat 50% 0;}
.subVisual h1{position:absolute;left:0;top:45px;width:100%;font-size:45px;}
.subVisual p{position:absolute;left:0;top:110px;width:100%;}
@keyframes img_move{
	0%{transform:scale(1.2) rotate(.001deg);}
	100%{transform:scale(1);}
}
.sub_top {margin-top:-57px;height:57px;border-bottom:1px solid #e2e4e5;background:#fff;}
#subMenu li{position:relative;float:left;line-height:57px;border-right:1px solid #e2e4e5;}
#subMenu li a{display:block;width:290px;padding-left:25px;font-size:18px;color:#000;font-weight:400;background:url('../imgs/sub/subMenu_arr.png') no-repeat 95% 50%;}
#subMenu li.home a{display:block;width:65px;height:57px;padding:0;text-indent:-9999px;overflow:hidden;background:#383838 url('../imgs/sub/home_icon.png') no-repeat 50%;}
#subMenu li.on a{color:#0f48a1;border-bottom:2px solid #0f48a1;}
#subMenu ul ul{display:none;position:absolute;top:57px;left:-1px;padding:10px 0;width:100%;background:#fff;border:1px solid #dfdfdf;border-top:2px solid #0f48a1;z-index:9;}
#subMenu li li{float:none;line-height:1.5;border:0;}
#subMenu li li a{width:auto !important;padding:10px 20px;background:none;font-size:17px;color:#555 !important;border:0 !important;}
#subMenu li li.on a{color:#084390 !important;font-weight:600;}
#subMenu li li a:hover{background:#f6f6f6;color:#0f48a1 !important;}
#subMenu li li a[target="_blank"] span{display:inline-block; width:14px; height:14px; margin:0 0 0 10px; background:url('../imgs/header/blank_icon2.png') no-repeat; vertical-align:-2px;}
.sub_top .sns{position:absolute;top:14px;right:0;}
.sub_top .sns li{position:relative;float:left;padding-left:8px;background:url('../imgs/sub/slash.png') no-repeat 0 50%;}
.sub_top .sns li:first-child, .sub_top .sns li li{padding:0;background:none;}
.sub_top .sns li a{display:block;padding:5px 13px;}
.sub_top .sns ul ul{display:none;position:absolute;top:-9px;right:0;width:185px;padding:5px 10px;border:1px solid #000;background:#fff;z-index:1;box-shadow:2px 3px 5px 0px rgba(0,0,0,0.1);}
.sub_top .sns li li a{margin-right:4px;padding:0;}
.sub_top .sns li li a img{vertical-align:middle;}
.sub_top .sns a.share_close{display:none;margin:0;padding:5px;position:absolute;top:0;right:10px;z-index:1;}
.menu4Tab{margin-top:60px;text-align:center;font-size:0;}
.menu4Tab li{display:inline-block;}
.menu4Tab li a{position:relative;display:block;padding:9px 20px 12px;margin:2px 0 2px -1px;font-size:17px;color:#000;font-weight:500;border:1px solid #ccc;letter-spacing:-0.9px;background:#fff; margin:3px 3px 3px 3px;}
.menu4Tab li.on a, .menu4Tab li a:hover{color:#fff;background:#122e5d;text-decoration:underline;}
.menu4Tab li.on a:focus{outline:2px dashed #ccc} /*웹 접근성을 위한 포커스링 색상 변경*/
.menu4Tab li:first-child a{border-left:1px solid #ccc;}
.menu4Tab li:last-child a{border-right:1px solid #ccc;}
.menu5Tab{margin-top:30px;text-align:center;font-size:0;}
.menu5Tab li{display:inline-block;}
.menu5Tab li a{position:relative;display:block;padding:3px 20px 3px 50px;margin:2px 0;font-size:17px;color:#555;font-weight:500;letter-spacing:-0.7px;background:url('../imgs/sub/tab_off.png') no-repeat 20px 50%;}
.menu5Tab li a:before{position:absolute;top:9px;left:0;z-index:-1;content:'';display:block;width:1px;height:16px;background:#c7c7c7;}
.menu5Tab li.on a, .menu5Tab li a:hover{color:#005cb9;text-decoration:underline;background-image:url('../imgs/sub/tab_on.png');}
.menu5Tab li:first-child a:before{display:none;}
h3.subTitle{margin:50px 0 0px;font-size:45px;color:#000;font-weight:bold;text-align:center;}
@media all and (max-width:1400px) {
	#content .centerContent{margin:0 20px;}
}
@media all and (max-width:1250px) {
	#subMenu li a{width:230px;padding-left:20px;}
}
@media all and (max-width:1024px) {
	#subWrapper #content{background:none;}
	#content .centerContent{width:94%;margin:0 3%;}
	#subMenu li.home, .sub_top .sns li.print{display:none;}
	.sub_top .sns{top:-60px;right:3%;}
	.sub_top .sns li{background:none;}
	.sub_top .sns li a{padding:10px 0;line-height:1;width:40px;background:#fff;border-radius:100px;text-align:center;}
	.sub_top .sns ul ul{top:-5px;}
	.sub_top .sns li li a{width:auto;background:none;border-radius:0;}
	.sub_top .sns a.share_close{width:auto;top:3px;}
}
@media all and (max-width:768px) {
	.subVisual{height:240px;font-size:18px;}
	.subVisual h1{font-size:34px;top:75px;left:3%;width:94%}
	.subVisual p{top:124px;left:3%;width:94%}
	.sub_top{height:auto;margin-top:0;}
	.sub_top .sns{top:-51px;}
	#subMenu li{float:none;width:100%;border:0;border-top:1px solid #e2e4e5;}
	#subMenu li a{width:auto;}
	#subMenu li.on a{height:55px;}
	#subMenu ul ul{left:0;border-top:0;box-sizing:border-box;}
	#subMenu li li a{height:auto !important;}
	.menu4Tab{margin-top:40px;}
	h3.subTitle{margin:40px 0;font-size:34px;}
}
@media all and (max-width:640px) {
	.menu4Tab li{display:block;}
	.menu4Tab li a{border:1px solid #ccc;border-top:0;margin:0;border-radius:0 !important;}
	.menu4Tab li:first-child a{border-top:1px solid #ccc;}
	.menu4Tab li.on a{border-color:#1b4b8b;}
}