/*-------공통------*/
#header{height: 100%; border-bottom: none;}
#header h1{left: 0; transform: translate(0, -50%);}
#container{min-height: 500px; margin: 60px 0 0 0;}
.container_inner{padding: 0 0 20px 0; margin: 40px auto 0;}
.sub_gnb{width: 980px; margin: 0 auto;}

.gnb_wrap .gnb>li .depth02{display: none; position: absolute; top: 40px; left: 0; right: 0; height: 210px; background: rgba(0,0, 0, .5); padding: 30px 0 0 0; z-index: 5;}
.gnb_wrap .gnb>li .depth02 li{text-align:left; padding-left: 45px; height: 30px;}
.gnb_wrap .gnb>li .depth02 li a{font-size: 14px; color:#fff; font-weight: bold; padding-left: 10px; position: relative;}
.gnb_wrap .gnb>li .depth02 li a:before{content: ''; display: block; width: 3px; height: 3px; background:#fff; position: absolute; left: 0; top: 50%; transform:  translate(0, -50%);}
.gnb_wrap .gnb>li.all .depth_wrap{display: none;}
.gnb_wrap .gnb>li.all>a:before{content: ''; display: block; width: 7px; height: 4px; background: url('/img/all_menu_ico.png')no-repeat center center; position: absolute; top: 50%; right: 20px; margin-top: -2px; transform: rotate(360deg);}
.gnb_wrap .gnb>li.all .depth_wrap{position: absolute; top: 40px; left: 0; right: 0; height: 210px; background: rgba(0,0, 0, .5); padding: 30px 0 0 0; z-index: 5;}
.gnb_wrap .gnb>li.all .depth_wrap .all_depth02{float: left; width: 165px; height: 100%;}
.gnb_wrap .gnb>li.all .depth_wrap .all_depth02 li{text-align:left; padding-left: 50px; height: 30px;}
.gnb_wrap .gnb>li.all .depth_wrap .all_depth02 li a{font-size: 14px; color:#fff; font-weight: bold; padding-left: 10px; position: relative;}
.gnb_wrap .gnb>li.all .depth_wrap .all_depth02 li a:before{content: ''; display: block; width: 3px; height: 3px; background:#fff; position: absolute; left: 0; top: 50%; transform: translate(0, -50%);}

.left_wrap{float: left; width: 175px; }
.left_wrap .top p{font-size: 15px; color:#8b8b8b;}
.left_wrap .top h2{font-size: 30px; letter-spacing: -0.03em; color:#4e4e4e; line-height: 55px;}
.left_wrap .lnb{border-top: 7px solid #3d86bf; margin-bottom: 20px;}
.left_wrap .lnb ul li{height: 40px; border-bottom: 1px solid #ccc; line-height: 39px;  }
.left_wrap .lnb ul li a{display: block; font-size: 17px; font-weight: bold; color: #333; padding-left: 10px;}
.left_wrap .lnb ul li a.on{color: #fff; background:#90c31f;}
.right_wrap{float: right; width: 785px; }
.top_title{height: 145px; border-bottom: 1px solid #ccc; margin-bottom: 20px; background: url('/img/sub/sub_title_img5.png')no-repeat right bottom; background-size: 23%;}
.navi{width: 100%; margin-bottom:30px; font-size: 0;}
.navi span{position: relative; display: inline-block; font-size: 11px; color:#797979; padding-right: 11px; margin-right: 6px;}
.navi span:before{content: ''; display: block; width: 5px; height: 9px; background: url('/img/sub/navi_arr_ico.png')no-repeat center center; position: absolute; right: 0; top: 50%; transform: translate(0, -50%);}
.navi span:last-child{color:#377dba; font-weight: bold;}
.navi span:last-child:before{display: none;}
.top_title h2{font-size: 35px; color:#3d3d3d; letter-spacing: -0.06em; margin-bottom: 20px;}
.top_title p{font-size: 14px; color:#525151; letter-spacing: -0.03em;}

.content{width: 100%; overflow: hidden;}

.about_text{padding: 50px 0; background: url('/img/sub/about_bg.png')no-repeat right center;}
.about_text .top{display: block; font-size: 23px; color:#606060; margin-bottom: 40px;}
.about_text p{color:#606060; letter-spacing: -0.03em; font-size: 15px; line-height: 2em; margin-bottom: 30px;}
.about_text p em{color:#3576b6;}
.about_text .bot{display: block; font-size: 20px; color:#626262;}

.history_wrap{padding: 50px 0; background: url('/img/sub/about_bg2.png')no-repeat 470px center;}
.history_wrap h3{font-size: 27px; color:#5d5d5d; margin-bottom: 35px;}
.history_wrap h3 em{color:#3376b6;}
.history_wrap dl{margin-bottom: 30px; position: relative;}
.history_wrap dl:before{content: ''; display: block; height: 1px; width: 200px; background:#004f9c; position: absolute; top:0; left: 0;}
.history_wrap dl dt{font-size: 32px; color:#004f9c; font-weight: bold; line-height: 50px; }
.history_wrap dl dd {margin-bottom: 10px;}
.history_wrap dl dd span{font-size: 15px; color:#666; letter-spacing: -0.03em;}
.history_wrap dl dd span.date{position: relative; padding-right: 15px; margin-right: 14px;}
.history_wrap dl dd span.date:before{content: ''; display: block; width: 1px; height: 12px; background:#ccc; position: absolute; right: 0; top: 2px;}

.certification_list ul{overflow: hidden;}
.certification_list ul li{float: left; width: 170px; height: 280px;  margin-right: 30px; margin-bottom:20px;}
.certification_list ul li:nth-child(4n){margin-right: 0;}
.certification_list ul li a img{height: 230px;}
.certification_list ul li p{height: 32px; padding: 0 10px; line-height: 1.2em; text-align: center; margin: 15px 0 0 0; overflow: hidden;}

.show_pop{display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.7); z-index: 999;}
.show_wrap{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center;  background:#fff;}
.show_wrap a{display: block;   position: absolute; right: 0; top: 0; font-size: 1.6em; padding: 0.2em;}
.show_wrap a:hover{background:#000; color:#fff;}

.map_info{position: relative; height: 80px; padding-left: 150px; margin-bottom:30px; background:#eee; line-height: 80px;}
.map_info img{position: absolute; left: 25px; top: 50%; transform: translate(0, -50%);}
.map_info p{font-size: 15px; font-weight: bold; color:#333;}
.map_info p span{position: relative;padding-left: 20px; margin-left: 10px;}
.map_info p span.type1:before{content: ''; display: block; width: 14px; height: 21px; background: url('/img/sub/map_ico.png')no-repeat center center; position: absolute; left: 0; top:50%; transform: translate(0, -50%);}
.map_info p span.type2:before{content: ''; display: block; width: 14px; height: 21px; background: url('/img/sub/phone_ico.png')no-repeat center center; position: absolute; left: 0; top:50%; transform: translate(0, -50%);}

.traffic_wrap{border-top: 1px solid #ccc; overflow: hidden;}
.traffic_wrap .fl{position: relative;width: 50%; float: left; padding-top: 20px;}
.traffic_wrap .fl:before{content: ''; display: block; width: 120px; height: 1px; background:#3376b6; position: absolute; top: 0; left: 0;}
.traffic_wrap .fl dt{float:left; width: 120px; height: 45px; font-size: 18px; color:#333; text-align: center; font-weight: bold;}
.traffic_wrap .fl dd{float: left; font-size: 15px; color:#676767; line-height: 1.4em;}
.traffic_wrap .fl dd em{font-weight: bold;}
.traffic_wrap .fl dd .type1{color:#627424;}
.traffic_wrap .fl dd .type2{color:#1a7db5;}
.traffic_wrap .fl dd .type3{color:#dc2a2a;}