@charset "utf-8";

/* layout */
.area_lnb .lnb .depth2{padding:15px; background:#f1f1f1; border:1px solid #d9d9d9; border-top:0;}
.area_lnb .lnb .depth2 > li > a{display:block; padding:3px; letter-spacing:-1px;}
.area_lnb .lnb .depth2 > li > a.on{color:#54C1E5;}

/* common */
#wrap{min-width:320px;}
#container{padding-bottom:90px;}
#container:after{content:''; display:block; clear:both;}
#container > .inr{margin-left:300px;}
#content{min-height:500px; padding-top:40px;}

/* font */
#content h3{margin:40px 0 20px; font-size:25px; color:#151515; letter-spacing:-1.5px; font-weight:400;}
#content h3:before{content:''; display:block; width:28px; height:1px; margin-bottom:4px; background:#1b40b3;}
#content h3 span{color:#005cb9;}
#content h3:first-child{margin-top:0px;}
#content h3.nodeco{text-align:center;}
#content h3.nodeco:before{display:none;}
#content h4{font-size:20px; font-weight:400; letter-spacing:-1.5px;}
#content p{margin-bottom:10px; font-weight:300; font-size:16px; letter-spacing:-0.3px;}
#content .em{font-weight:400;}
#content .em.mt15{margin-top: 15px;}
#content .remark{display:block; color:#555; font-size:0.75em; font-weight:300; letter-spacing:-0.5px;}
#content ul li{font-weight:300; letter-spacing:-1px;}

/* tit */
#content .tit_deco{position:relative; padding-left:24px; margin:40px 0 20px 0; font-weight:500; color:#333; text-align:left; letter-spacing:-1.5px;}
#content .tit_deco:before{position:absolute; top:7px; left:0; content:""; width:17px; height:17px; background:url(../images/common/deco_tit.png) no-repeat 0 0;}
#content .tit_deco.mt10{margin-top:10px;}

/* box */
.box_text p{margin-top:25px;}
.box_img{margin:20px 0; text-align:center;}
.box_img:first-child{margin-top: 0;}
.box_img img{max-width:100%;}
.box_img img.w{display:inline-block;}
.box_img img.m{display:none;}
.box_img.v1{padding:40px 30px; border:1px solid #d9d9d9;}
.box_img.noimg{min-height:67px; background:#f2f2f2 url(../images/common/icon_noimg.png) no-repeat 50% 50%;}
.box_map{width:100%; height:420px; margin:0 0 25px 0; background:url(../images/content/img_map.jpg) no-repeat 50% 50%; background-size:contain;}
.box_map .map{width:100%; height:100%; box-sizing:border-box; padding-bottom:33px;} /*다음지도쓸경우*/
.box_map .root_daum_roughmap .wrap_map{height:100%;} /*다음지도쓸경우*/

/* area_snb */
.area_snb{overflow:hidden; width:102%; margin:30px 0 40px;}
.area_snb:first-child{margin-top: 0;}
.area_snb > *{float:left;  margin:0 2% 0 0;}
.area_snb .box_img{overflow: hidden; width:31.33%; text-align:center;} /*33.33*/
.area_snb .box_img:hover img{transform:scale(1.05); transition:transform 0.3s;}
.area_snb .snb{width:64.67%;} /*66.67*/

/* area_menu */
#content .area_menu h3,
#content .area_menu h4{margin-bottom:3px; text-align:center; text-transform:uppercase;}
#content .area_menu h3{font-size: 30px; font-weight: 600;}
#content .area_menu h3:before{display:none;}

/* snb */
.snb{box-sizing:border-box; border:1px solid #d9d9d9; border-width:1px 0 0 0;}
.snb li{width:100%;}
.snb li a{display:block; position: relative; width:100%; height:47px; line-height:45px; box-sizing:border-box; padding:0 10px; border:1px solid #d9d9d9; border-width:0 1px 1px 1px; font-size:16px; text-align:center; transition: background 0.3s;}
.snb li:hover a{background: #fafafa;}
.snb li a.on{background:#005cb9; color:#fff; font-weight:400;}
.snb li:first-child a{border-top:0;}
.snb.col2{overflow:hidden; border-width:1px 0 0 1px;}
.snb.col2 li{float:left; width:50%;}
.snb.col2 li a{border-width:0 1px 1px 0px;}
.snb.col2 li:first-child + li a{border-top:0px;}

/* tab */
.tab{margin-bottom:40px;}
.tab:after{content:''; display:block; clear:both;}
.tab li{float:left; width:33.33%; box-sizing:border-box;}
.tab li a{display:block; width:100%; height:47px; line-height:45px; box-sizing:border-box; padding:0 10px; background:#fff; border:1px solid #d9d9d9; border-bottom-color:#1b40b3; font-size:16px; text-align:center; letter-spacing:-1.5px;}
.tab li a.on{border-color:#1b40b3; border-bottom-color:#fff; color:#1b40b3;}
.area_tab{overflow:hidden; width:100%;}
.area_tab .cont > li{display:none;}
.area_tab .cont > li:first-child{display:block;}

/* table */
.area_table{position:relative;}
.table{border-top:2px solid #2545a9; border-left:1px solid #ececec;}
.table th,
.table td{padding:13px 15px; border-bottom:1px solid #ececec; border-right:1px solid #ececec; letter-spacing:-0.5px; font-weight: 300;}
.table td img{display:inline-block; vertical-align:middle;}
.table th{background:#f9f9f9; font-family:'Noto Sans KR', Sans-serif; font-weight:400;}
.table tbody tr:first-child th,
.table tbody tr:first-child td{border-top:1px solid #ececec;}
.table thead + tbody tr:first-child th,
.table thead + tbody tr:first-child td{border-top:0px !important;}
.table thead tr:first-child th{border-top:2px solid #2545a9;}
.table.w{display:table;}
.table.m{display:none;}

/* list */
.list_normal li{position:relative; margin:5px 0; padding-left:15px; font-size:16px;}
.list_normal li:before{content:""; display:block; position:absolute; top:10px; left:0; width:5px; height:5px; background:#b7b7b7; border-radius:50%;}
.list_normal li > span{font-weight:500;} 

.list_img{overflow:hidden; margin:15px 0; width:102%;}
.list_img li{float:left; width:31.333%; box-sizing:border-box; padding:5px; background:#fff; border:1px solid #d9d9d9; margin:0 2% 0 0; text-align:center;}
.list_img li img{max-width:100%;}
.list_img.col2 li{width: 48%;}

.list_process{font-size: 0;}
.list_process li{display: inline-block; position: relative; box-sizing:border-box; margin:6px 0 6px 40px; font-size: 15px; text-align: center;}
.list_process li:before, .list_process li:after{content:''; display: block; position: absolute; top: 50%; right: 100%;}
.list_process li:before{width: 40px; height: 1px; margin-top: -0.5px; background: #ececec;}
.list_process li:after{width: 9px; height: 9px; margin-right:-8.5px; background:#d9d9d9; border:4px solid #fff; border-radius:50%; transform:translate(0, -50%);}
.list_process li:first-child{margin-left: 0;}
.list_process li:first-child:before, .list_process li:first-child:after{display: none;}
.list_process li span{display: inline-block; min-width:165px; box-sizing:border-box; padding: 15px 20px; line-height: 1; background: #ececec; border-radius:40px; vertical-align: middle; font-weight: 400;}
.list_process li.point span{background: #1f427f; color:#fff;}
.list_process li.point:after{background: #001e53; border-color:#bdc9de;}
.list_process li.notes span{background: #f16e14; color:#fff;}
.list_process li.notes:after{background: #df5b00; border-color:#ffc39a;}
.list_process li.end span{background: #fff; border:2px solid #ececec;}

/* 회사소개 */
.area_ceo{overflow:hidden;}
.area_ceo .box_message{padding-right:45%; background:url(../../images/content/img_greeting.png) no-repeat 100% 10%; background-size:40%;}
.area_ceo .box_message h2{line-height:1.3em; font-size:33px; font-weight:400; letter-spacing:-1.5px;}
.area_ceo .box_message h2 span{font-weight:500; color:#2877d4;}
.area_ceo .sign{text-align:right;}
.area_ceo .sign .grade{display:inline-block; vertical-align:middle; font-weight:500;}
.area_ceo .sign .name{display:inline-block; vertical-align:middle; font-family: 'Noto Serif KR', sans-serif; font-size: 32px; font-weight:500;}

.area_business:after{content:''; display:block; clear:both;}
.area_business li{float:left; width:33.33%; box-sizing:border-box; padding:20px; border-left:1px solid #d9d9d9; text-align:center;}
.area_business li:first-child{border-left:0;}
.area_business li h4:before{content:""; display:block; width:138px; height:82px; margin:0 auto 10px;}
.area_business li.icon01 h4:before{background:url(../../images/content/icon_business01.png) no-repeat 50%; background-size:contain;}
.area_business li.icon02 h4:before{background:url(../../images/content/icon_business02.png) no-repeat 50%; background-size:contain;}
.area_business li.icon03 h4:before{background:url(../../images/content/icon_business03.png) no-repeat 50%; background-size:contain;}

.area_history > li{margin:20px 0 40px;overflow:hidden;}
.area_history .sort{float:left; display:inline-block; position:relative; width:25.33%; height:252px; line-height:252px; box-sizing:border-box; background-repeat:no-repeat; background-position:50% 50%; background-size:contain; text-align:center;}
.area_history .sort:after{content:''; display:block; position:absolute; top:50%; left:100%; width:25%; height:12px; margin-left:-10px; background-repeat:no-repeat; background-position:100% 50%; background-size:auto 100%;}
.area_history .sort span{display:inline-block; line-height:1.4; vertical-align:middle; font-size:20px; font-weight:500; text-align:center;}
.area_history .detail{padding-left:33.33%}
.area_history .detail li{overflow:hidden;}
.area_history .detail li .date{float:left;}
.area_history .detail li .date span{display:inline-block; font-weight:500;}
.area_history .detail li .date span.month{margin-left:20px;}
.area_history .detail li .desc{padding-left:145px;}
.area_history .history01 .sort{background-image:url(../../images/content/img_history01.png);}
.area_history .history01 .sort:after{background-image:url(../../images/content/arrow_history01.png);}
.area_history .history01 .sort span{color:#e86808;}
.area_history .history02 .sort{background-image:url(../../images/content/img_history02.png);}
.area_history .history02 .sort:after{background-image:url(../../images/content/arrow_history02.png);}
.area_history .history02 .sort span{color:#93ba05;}
.area_history .history03 .sort{background-image:url(../../images/content/img_history03.png);}
.area_history .history03 .sort:after{background-image:url(../../images/content/arrow_history03.png);}
.area_history .history03 .sort span{color:#357fd5;}

.area_vietnam .box_img{margin:40px 0;}
.box_vietnam{min-height:249px; box-sizing:border-box; margin-bottom:20px; padding:45px 40px; background:url(../../images/content/img_vietnamap_web.png) no-repeat 100% 0px; border:1px solid #d9d9d9;}
.box_vietnam em{display:inline-block; font-size:27px; margin-bottom:20px; font-weight:500; letter-spacing:-1.5px;}

.way{word-break:keep-all;}
.way span{display:inline-block; min-width:66px; box-sizing:border-box; margin:0 10px 0 21px; padding:3px 15px; background:#d9d9d9; border-radius:20px; font-size:13px; text-align:center;}
.way:first-child span{margin-left:0;}
.way.v1 span{background:#00aa6c; color:#fff;}
.way.v2 span{background:#115bb4; color:#fff;}

.text_box{display: inline-block; margin-right:5px; padding: 3px 7px; border:1px solid #d9d9d9;}

@media all and (max-width:1024px){
	#container > .inr{margin-left:0px;}
	
	.area_lnb .lnb .depth2{padding: 3px 15px; background:none; border:0;}
	.area_lnb .lnb .depth2 > li > a{padding: 4px 2px; font-weight: 300; font-size: 14px; color:#d9e5ff;}
}

@media all and (max-width:768px){
	#container{padding-bottom:40px;}
	#content h3{margin:30px 0 10px; font-size:23px;}
	#content h4{font-size:17px;}
	#content p{font-size:15px;}
	
	#content .tit_deco{margin:25px 0 15px;}
	
	.box_img.v1{padding:30px 20px;}
	.box_img img.m{display:inline-block;}
	.box_img img.w{display:none;}
	.box_map{height:380px; background-size:contain;}
	
	.area_snb{width:100%; margin:20px 0 20px;}
	.area_snb > *{float:none;  margin:0;}
	.area_snb .box_img{width:100%; margin:0 0 10px 0;}
	.area_snb .snb{width:100%;}
	
	.snb li{float:none !important; width:100% !important;}
	.snb li a{height:42px; line-height:40px; font-size:15px;}
	
	.tab{overflow:hidden; width:101%;}
	.tab li{width:49%; margin:0 1% 1% 0;}
	.tab li a{height:42px; line-height:40px; border-bottom-color:#d9d9d9; font-size:15px;}
	.tab li a.on{border-bottom-color:#1b40b3; box-shadow:5px 5px 0 #f1f1f1;}
	
	.list_normal li{margin:3px 0; padding-left:12px; font-size:15px;}
	.list_img{width:101%;}
	.list_img li{width:49% !important; padding:3px; margin:0 1% 0 0;}
	
	.tit_deco:before{top:6px;}
	
	.area_ceo .box_message{padding-right:0; background:none;}
	.area_ceo .box_message h2{font-size:25px;}
	
	.area_business li{float:none; position:relative; width:100%; padding-left:110px; border-top:1px solid #d9d9d9; border-left:0; text-align:left;}
	.area_business li h4:before{position:absolute; top:50%; left:0; width:100px; margin-top:-41px; }
	.area_business li:first-child{border-top:0;}
	
	.area_history .sort{float:none; width:100%; height:205px; line-height:205px;}
	.area_history .sort span{font-size:18px;}
	.area_history .sort:after{display:none;}
	.area_history .detail{width:80%; margin:10px auto 0; padding-left:0;}
	.area_history .detail li .desc{padding-left:115px;}
	.area_history .detail li .date span.month{margin-left:10px;}
	
	.box_vietnam{padding:30px; background:url(../../images/content/img_vietnamap_mobile.png) no-repeat 100% 0px;}
	.box_vietnam em{margin-bottom:10px;}
	.box_vietnam p br{display:none;}
	
	.way{display: block; margin:5px 0 0 0;}
	.way span{min-width:auto; margin:0 5px 0 0; padding:3px 10px; font-size:13px;}
}
@media all and (max-width:640px){
	.box_map{height:300px;}
	
	.scrollTable{overflow:auto;}
	.scrollTable .table{width:640px;}
	.table.w{display:none;}
	.table.m{display:table;}
	
	.list_process{overflow: hidden;width: 100%;}
	.list_process li{float: left; display: block; width: 50%; margin:5px 0; padding-right:40px;}
	.list_process li span{width: 100%; min-width:auto; border:0; border-radius:20px;}
	.list_process li:first-child{margin-top: 0;}
	.list_process li:before{right:0; width:40px; height:15px; margin-top:-7.5px; background:url(../../images/content/icon_arrow.png) no-repeat 50%; background-size:contain; transform:rotate(-90deg);}
	.list_process li:first-child:before{display: block;}
	.list_process li:last-child:before{display: none;}
	.list_process li:after{display: none;}
	.list_process li.point span,
	.list_process li.notes span{background: #ececec;font-weight: 500; color:#333;}
	
	.area_history .detail{width:90%;}
}
@media all and (max-width:480px){
	.area_history .detail{width:100%;}
}	
@media all and (max-width:452px){
	.tab li a{padding:0 5px; font-size:14px;}
	
	.list_process li{width: 100%; box-sizing:border-box; margin: 25px 0 0 0; padding-right: 0;}
	.list_process li:before{top:auto; bottom:100%; left:50%; width:40px; height:15px; margin-left:-20px; margin-bottom:5px; transform:none;}
	.list_process li:last-child:before{display: block;}
	.box_vietnam{min-height:280px; padding:20px; background:url(../../images/content/img_vietnamap_mobile02.png) no-repeat 100% 100%; background-size:100% auto;}
}