#subNav{width:100%; height:50px; background:#111; text-align:center;}
.sticky{position:fixed; top:148px; left:0; z-index: 400 }
#subNav ul{display:inline-block; }
/*#subNav .m4{max-width:800px;}*/
#subNav ul li{float:left; border-right:1px solid #999; width:200px; box-sizing:border-box;}
/*#subNav .m4 li{max-width:800px; width:25%;}*/
#subNav ul li:first-child{border-left:1px solid #999;}
#subNav ul li a{display:block; width:100%; text-align:center; line-height:50px; color:#999; position:relative;  transition:all 0.1s ease-in-out; box-sizing:border-box;}
#subNav ul li:hover a{color:#fff;}
#subNav ul li:hover a:after{content:""; display:block; width:100%; height:2px; background:#fa7c25; position:absolute; bottom:0; left:0;}
#subNav ul .on a{color:#fff; }
#subNav ul .on a:after{content:""; display:block; width:100%; height:2px; background:#77c86b; position:absolute; bottom:0; left:0;}

.subVisual{width:100%; height:500px; background:url(../img/sub_common/subvisual.jpg) no-repeat center 0; margin:0 auto;}
.subVisual .text{padding-top:300px; text-align: center; color:#fff;}
.subVisual .text .page{font-size:38px; line-height:1.2em; margin-bottom:24px;}
.subVisual .text .sub{font-size:20px; font-weight:300;} 
.mobile_subVisual{display:none;}  

.sub_container{max-width:1200px; margin:0 auto; padding:100px 50px; color:#333;} 
.page_name{font-size:36px; font-weight:500; color:#111; line-height:36px; text-align:center; margin-bottom:56px;}
.page_name i{display:inline-block; background:url(../img/sub_common/icon_title.png) no-repeat center center; width:36px; height:36px; text-indent: -9999px; padding:6px; margin-left:-36px; margin-right:6px;}
.sub_pad{padding-left:50px; padding-right:50px;}
.sub_container .title_big{font-size:30px; font-weight:900; margin-bottom:20px;}
.sub_container .title_small{font-size:24px; font-weight:500; margin-bottom:24px;}


.s_title{font-size:24px; line-height:1em; font-weight:500; position:relative;}
.s_title:after{content:""; display:block; width:16px; height:2px; background:url(../img/sub_common/icon_sub.png) no-repeat; position:absolute; top:10px; left:-40px;}
.sub_padding{padding-left:50px; padding-right:50px;}
.item{padding:60px 32px;}

@media screen and (max-width:1200px){
    
}
@media screen and (max-width:1024px){
    .sub_container{padding-top:50px;}
    #subNav{height:0; overflow:hidden;}/*display:none 처리시 모바일에서 pc로 돌아올때 offset top이 0으로 읽어져 상단에 계속 붙어서 나오게 된다. 오프셋값을 유지하기위해 높이를 0으로 안보이게*/
    .subVisual{background:none; position:relative; height:360px;}
    .subVisual .text{ position:relative; z-index: 300; padding:160px 20px 0; box-sizing:border-box;}
    .mobile_subVisual{display:block; height:360px; background:url(../img/sub_common/subvisual.jpg) no-repeat -200px 0px; background-size: auto 360px; position:absolute; top:0; left:0; width:100%; z-index:200;} 
	
	
}


@media screen and (max-width:768px){
    .sub_container{padding:25px 20px;}
    .subVisual{height:300px;}
    .subVisual .text{padding:150px 20px 0;}
    .subVisual .text .page{font-size:26px; margin-bottom:10px; }
    .subVisual .text .sub{font-size:16px;} 
    
	.sub_pad{padding-left:20px; padding-right:20px;}

    .mobile_subVisual{display:block; height:300px; background:url(../img/sub_common/subvisual.jpg) no-repeat -190px 0; background-size: auto 300px; } 
    
    .page_name{font-size:30px; line-height: 30px; margin-bottom:25px;}
    .page_name i{width:30px; height:30px; text-indent: -9999px; margin-left:-36px; margin-right:2px; padding:6px; background-size:20px 20px;} 

	.sub_container .title_small{font-size:18px; margin-bottom:12px;}
	.sub_padding{padding-left:20px; padding-right:20px;}

	.s_title:after{left:-36px;}

}

@media screen and (max-width:600px){
    .subVisual{height:180px;}
    .mobile_subVisual{display:block; height:180px; background:url(../img/sub_common/subvisual.jpg) no-repeat 0px 0; background-size: auto 190px; } 
    .subVisual .text{padding:90px 20px 0; text-align: left;}
    .subVisual .text .page{font-size:18px; margin-bottom:10px; }
    .subVisual .text .sub{font-size:14px;}
    .subVisual .text .sub span{display:block;}

	.page_name{text-align:left; margin-left:26px; font-size:22px;}
	.page_name i{}
    
    
}
@media screen and (max-width:370px){
	.sub_container{padding:25px 10px;}
	.subVisual .text .sub{font-size:10px;}
	.s_title{font-size:16px;}
	.s_title:after{top:8px;}
}
