@charset "utf-8";

header h1 { float:none; position: absolute; left: 55%; top:10px; transform: translateX(-50%) scale(0.8); padding:0;}
header .left { padding: 25px 0 20px 14px;}
header .all { display: block; position: relative; width:32px; height: 14px; border-top: 2px solid #000; border-bottom: 2px solid #000; color:transparent; transform: scale(0.8);}
header .all:before { content: ""; position: absolute; left: 0; top: 50%; width: 100%; height: 2px; background: #000; margin-top: -1px;}
header .header_sub .left > div { float:none; }
/*header .rights > div { float:none; }*/
header > ul { padding: 33px 17px 0 0;}
header > ul li {display: none;}
header .nav_sub{display: none;}









header > ul li a {width: 70px;}

/* 모바일메뉴 */
header .close,
header .all,
header .left > div > div,
header h2 { display: block;}
header .header_sub .nav {  position: absolute; left:-120%; top: 0; z-index: 101; transition: left 0.7s; padding: 15px 24px 15px 22px; width:calc(100% - 32px); height:calc(100vh - -20px); background: #fff; box-sizing: border-box;}
header .header_sub .nav.on { left: 0;}
header .header_sub .nav.on nav { padding: 0 0 24px; border-top: 1px solid #0091d0;text-decoration: none;}
header .header_sub .nav.on nav a { font-size:16px;height: 40px; text-decoration: none;line-height: 40px; color:#111;}
header .header_sub .nav.on nav a:before { display: none;}
header .header_sub .nav.on nav ul { margin: 0 auto; padding: 0;}
header .header_sub .nav.on nav li { float: none; height: 50px;    padding: 12px 0 5px 0;border-bottom: 1px solid #eee;}
header .header_sub .nav.on div { display: flex; border:1px solid #eee;}
header .header_sub .nav.on div a:first-child { border: none;}
header .header_sub .nav.on div a { flex:1; height: 38px; text-decoration: none;border-left: 1px solid #eee; line-height: 38px; text-align: center; color:#666; font-size: 13px; font-weight: bold;}
header .header_sub .nav.on .close { position: absolute; right: 24px; top: 24px; width: 25px; height: 25px; color:transparent;}
header .header_sub .nav.on .close:before { content: ""; position: absolute; left:46%; top: 0; width: 1px; height: 100%; background: #5a5a5a; transform: rotate(45deg);}
header .header_sub .nav.on .close:after { content: ""; position: absolute; right:45%; top: 0; width: 1px; height: 100%; background: #5a5a5a; transform: rotate(-45deg);}
header h2 { margin: 0 0 75px 0; width: 132px; height: 50px; background: url("../images/layout.png") no-repeat 0 -70px; color:transparent;}
.dim { display: none;position: fixed; left: 0; top: 0; z-index: 100; width: 100%; height: 100%; background: rgba(0,0,0,0.5);}