@charset "utf-8";

#subBnr{overflow:hidden;position:relative;min-width:1280px;width:100%;height:420px;background:url(./sub_bg.jpg) center no-repeat; background-size:cover}
#subBnr:after{opacity:0;display:block;content:"";position:absolute;left:0;top:0;width:40%;height:100%;background-color:rgba(0,0,0,.5);-webkit-transition:all 1s;transition:all 1s}
#subBnr.on:after{opacity:1;left:-50px}
#subBnr h3{display:none;font-size:16px;font-weight:normal;font-family:'notokr-medium'}
#subBnr .txt_area{position:relative;top:35%;z-index:1;width:1280px;margin:0 auto;padding:0 40px;font-size:15px;letter-spacing:-.2px;color:#fff;font-family:'notokr-regular'}
#subBnr .txt_area .btxt{font-size:32px;font-weight:600}
#subBnr .txt_area .stxt{margin:20px 0 90px}
#subBnr .txt_area span{color:rgba(255,255,255,.6)}
#subBnr .txt_area span i{padding:0 10px}

@media(max-width:1300px){
#subBnr{min-width:100%}
}
@media (max-width:1024px){
#subBnr{height:300px}	
#subBnr:after{width:calc(50% + 55px)}
#subBnr .txt_area{top:20%}
}
@media (max-width:768px){
#subBnr{height:260px;text-align:center}
#subBnr:after{width:100%}	
#subBnr.on:after{left:0}
#subBnr .txt_area{width:100%}
#subBnr .txt_area .stxt{margin-bottom:35px}
}
@media (max-width:480px){
#subBnr{height:auto;padding:15px 0;border-top:1px solid #d1d1d1;border-bottom:1px solid #eee;color:#222;background:none}
#subBnr h3{display:block}
#subBnr:after{display:none}
#subBnr .txt_area{display:none}
}