@charset "utf-8";
/* 서브 비주얼 영역 */
#sub_visual {position:relative;height:300px; overflow:hidden; z-index:20;margin-top:80px;}
#sub_visual .swiper-container {width:100%;height:100%;}
#sub_visual .swiper-slide {background-position: center;background-size: cover;position: relative}
#sub_visual .swiper-slide .visual_txt{position: absolute; top: 30%; right: 15%}
#sub_visual .swiper-slide .visual_txt p{font-weight: bold; font-size: 40px; color: #000;}
#sub_visual .swiper-slide .visual_txt p span{font-size: 55px;color:#1c4ec0}
#sub_visual .swiper-container-horizontal>.swiper-pagination-bullets, #mainVisual .swiper-pagination-custom, #mainVisual .swiper-pagination-fraction {bottom:30px;}
#sub_visual .swiper-pagination-white .swiper-pagination-bullet-active {background:#000;width:20px;border-radius:50px;}
#sub_visual .swiper-pagination-bullet {width:10px;height:10px;background:#fff;border-radius:30px;transition:all .3s ease;opacity:1;}
#sub_visual .swiper-slide img {position:relative;left:50%;margin-left:-600px;top:200px;}
#sub_visual .swiper-button-next {right:20px;}
#sub_visual .swiper-button-prev {left:20px;}

/* 로케이션 영역 */
#container .location_bar {height:60px; border-bottom:1px solid #e6e6e6; background:#fff}
#container .location_bar .inner {max-width:1400px; margin:0 auto; padding:0 50px; text-align:right}
#container .location_bar .inner ul {text-align:right}
#container .location_bar .inner ul li {display:inline-block; color:#888; line-height:60px}
#container .location_bar .inner ul li.divider {margin:0 5px}
#container .location_bar .inner ul li.current {color:#333}
/* 컨텐츠 영역 레이아웃 */
#container > .inner:before {position:absolute; top:0; left:-1px; content:''; border-left:1px solid #e6e6e6; width:1px; height:100%}
#container > .inner {position:relative; max-width:1300px; margin:0 auto }
#container > .inner:after {clear:both; display:block; content:''; position:absolute; top:0; right:0; border-right:1px solid #e6e6e6; width:1px; height:100%}
#container > .inner .content:before {position:absolute; top:0; left:0; content:''; border-left:1px solid #e6e6e6; width:1px; height:100%}
#container > .inner .content {position:relative; /*margin-left:250px;*/ min-height:500px; padding:50px}
.btm_img {clear:both; height:560px; background:url(../img/sub_btm_img.jpg) center top no-repeat; background-size:cover}
.btm_img .inner {max-width:1400px; margin:0 auto; padding:0 50px}
.btm_img .inner .caption {padding-top:10%}
.btm_img .inner .caption h2 {font-size:50px; font-weight:600; color:#fff; line-height:1; margin-bottom:30px}
.btm_img .inner .caption p {font-size:15px; font-weight:300; color:#fff; max-width:60%}
/* 좌측 서브메뉴 */
/*#leftBar {float:left; width:250px; margin-top:-60px}
#leftBar .title {height:160px; padding:20px; background:#1c1c1c}
#leftBar .title h2 {display:inline-block; font-size:20px; font-weight:600; color:#fff}
#leftBar .title span {font-size:12px; font-weight:600; margin-left:10px; color:#fff}
#leftBar a.dropdown {display:none}
.lnb li {border-bottom:1px dotted #dcdcdc}
.lnb li.on a {color:#fff; background:#555}
.lnb li:hover a {color:#fff; text-decoration:underline; background:#555}
.lnb li a {display:block; padding:10px 20px}*/
#leftBar {width:100%; margin:0; border-bottom:1px solid #dcdcdc}
#leftBar a.dropdown {display:none}
#leftBar:after {clear:both; display:block; content:''}
#leftBar .title {float:left; width:14%; height:60px; padding:0 0 0 40px;background:#1c1c1c}
#leftBar .title h2 {font-size:18px; font-weight:600;;margin:0; line-height:60px;color:#fff;}
#leftBar .title span {display:none}
#leftBar .box {display:none}
 .lnb {/*margin-left:25%;*/ height:100%; border-bottom:1px dotted #dcdcdc}
 .lnb li {position:relative; float:left; height:100%;border-right:1px solid #dcdcdc}
 .lnb li a {display:inline-block; padding:0 28.9px; height:100%; line-height:60px; text-align:center}
 .lnb li a > span{ font-size:15px}
 .lnb li.on a {color:#fff; background:#555}
 .lnb li:hover a {color:#fff; text-decoration:underline; background:#555}
 .lnb li.on a:after {position:absolute; bottom:-18px; left:50%; margin-left:-9px; content:''; border-style:solid; border-width:9px; border-color:transparent; border-top-color:#555}
/*#leftBar .box h4 {font-size:16px; font-weight:400; color:#333; line-height:1.1; margin-bottom:10px}
#leftBar .box p {color:#666}
#leftBar .box p span {font-size:16px; font-weight:600; color:#444}*/
/* 컨텐츠 내부 공통 */
#container > .inner img.img_tab, #container > .inner img.img_mob {display:none !important}
#container .inner .content .title {margin-bottom:40px}
#container .inner .content .title h2 {font-size:35px; font-weight:600; color:#333; line-height:1.2; margin-bottom:15px}
#container .inner .content .title p {display:none;font-size:12px; color:#888; line-height:1.6}
#container .inner .content h3.sub_tit {font-size:26px; font-weight:bold; line-height:1.2; color:#555; margin-bottom:30px}
#container .inner .content .business img {display:block; width:100%; height:283px}
#container .inner .content .greeting img {display:block; width:auto}

/* 컨텐츠 영역 레이아웃 하단동영상*/
#bottomCover {display:none;position:relative;width:100%;overflow:hidden}
#bottomCover .mask {position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.7; filter:alpha(opacity='30'); z-index:30}
#bottomCover .video {position:relative; width:100%; height:450px; z-index:20}
#bottomCover .video video {position:absolute;display:block; width:100%;top:-250px;object-fit:cover}
#bottomCover .inner {position:absolute;text-align:center;padding:0 50px;z-index:40;}
#bottomCover .inner .caption {padding-top:10%}
#bottomCover .inner .caption h2 {font-size:50px; font-weight:600; color:#fff; line-height:1; margin-bottom:30px}
#bottomCover .inner .caption p {font-size:15px; font-weight:300; color:#fff; max-width:60%;margin:0px auto;display:inline-block;}



/* COMPANY - 회사소개 */
.content .greeting .bg{ float:right; box-shadow:20px 20px 30px 0}
.content .greeting .grt_tit {margin-bottom:60px; width:60%; float:left}
.content .greeting .grt_tit h3 {font-size:25px; font-weight:600; color:#444; line-height:1.2; margin-bottom:20px}
.content .greeting .grt_tit p{font-size:18px; word-break:keep-all;padding:20px 0;}
.content .greeting .grt_tit p > span{ font-weight:bold; font-size:20px;}
.content .greeting .grt_tit p.right{ float:right}
.content .greeting ul.teamList {text-align:justify; margin-bottom:60px}
.content .greeting ul.teamList:after {display:inline-block; width:100%; content:''}
.content .greeting ul.teamList > li {display:inline-block; width:30%; vertical-align:top}
.content .greeting ul.teamList > li .info {margin-bottom:30px}
.content .greeting ul.teamList > li .info h4 {font-size:18px; font-weight:600; color:#555; line-height:1.1}
.content .greeting ul.teamList > li .info span {font-size:12px; color:#888}
.content .greeting ul.teamList > li .info ul {margin-top:20px}
.content .greeting ul.teamList > li .info ul li {color:#666}
.content .greeting ul.teamList > li .info ul li:before {display:inline-block; width:2px; height:2px; content:''; margin-right:5px; background:#ccc; vertical-align:middle}
.content .greeting ul.teamList > li .imgArea {width:80%; margin:0 auto; border-radius:50%; overflow:hidden}
.content .greeting .info_box {margin-top:30px}
.content .greeting .info_box dl {margin:0; overflow:hidden}
.content .greeting .info_box dl dt {display:block; float:left; width:12%; padding:8px 0; font-weight:600; color:#444; border-bottom:1px dotted #ccc}
.content .greeting .info_box dl dd {display:block; margin-left:15%; padding:8px 0; color:#666; border-bottom:1px dotted #ccc}
/* COMPANY - 연혁 */
.content .history .history_box {margin-bottom:60px}
.content .history .history_box:after {clear:both; display:block; content:''}
.content .history .history_box .his_tit {margin-bottom:30px; padding-bottom:15px; border-bottom:2px solid #aaa}
.content .history .history_box .his_tit span {font-size:20px; color:#888}
.content .history .history_box .his_tit h3 {font-size:24px; font-weight:600; color:#444; line-height:1}
.content .history .history_box .left {float:left; width:45%}
.content .history .history_box .left p {color:#666; margin-bottom:25px; text-align:justify}
.content .history .history_box .right {float:right; width:50%}
.content .history .history_box .right dl {clear:both; margin:0 0 20px 0; overflow:hidden}
.content .history .history_box .right dl dt {float:left; width:60px; font-size:24px; font-weight:600; color:#444}
.content .history .history_box .right dl dd {margin-left:80px; line-height:2; color:#666}
/* COMPANY - 찾아오시는 길 */
#map {position:relative; height:400px; margin-bottom:30px; overflow:hidden}
.content .map_box {margin-top:30px;padding:30px; background:#f6f6f6}
.content .map_box ul.map_info li {color:#666}
.content .map_box ul.map_info li:before {display:inline-block; width:3px; height:3px; margin-right:5px; content:''; background:#aaa; vertical-align:4px}
/* BUSINESS - 사업안내 */
.content .business ul.typeList {text-align:justify; margin-bottom:60px}
.content .business ul.typeList:after {display:inline-block; width:100%; content:''}
.content .business ul.typeList li {display:inline-block; width:30%; vertical-align:top; border:1px solid #ccc}
.content .business ul.typeList .imgArea {margin-bottom:25px; overflow:hidden}
.content .business ul.typeList .info h4 {font-size:18px; font-weight:400; color:#444; line-height:1; margin-bottom:15px}
.content .business ul.typeList .info p {color:#666}
.content .business ul.half {margin:0 auto; width:60%;}
.content .business ul.half li{width:45%;}
.content .business ul.no_bo li {border:none}
.content .business ul.no_bo li > p{font-size:20px; font-weight:bold}
.content .business .list{margin:30px 0;border-bottom:1px dotted #ccc}
.content .business p.list_txt{font-weight:bold; font-size:20px;}
.content .business p.list_txt > span{font-size:17px;}
.content .business p.list_txt:before{content:''; width:10px; height:10px; border-radius:50px; background:red; display:inline-block; margin:0 5px 2px 0}
.content .business .list ul li{padding:10px 0; font-size:16px}
.content .business .list ul li:before{content:'*'; color:#F63; display:inline-block; margin:0 5px 2px 0}
.content .business .spec{ overflow:auto}
.content .business .spec table{margin:20px 0 10px; border:1px solid #ccc; overflow:hidden; border-collapse:collapse; width:100%;text-align:center}
.content .business .spec table thead{border:1px solid #ccc;}
.content .business .spec table th{border:1px solid #ccc; font-size:18px; padding:10px; background:#defd; word-break:keep-all}
/*.content .business .spec table tr{border:1px solid #ccc; font-size:18px;}*/
.content .business .spec table td{border:1px solid #ccc; font-size:18px; padding:10px}
.content .business .spec > .col{ color:red}
.content .business ul.processList {text-align:justify; margin-bottom:60px}
.content .business ul.processList:after {display:inline-block; width:100%; content:''}
.content .business ul.processList li {margin-top:30px; display:inline-block; width:285px;overflow:hidden; transition:all 0.4s; border:1px solid #ccc}
.content .business ul.processList li.no{display:none}
.content .business ul.processList li:hover img{ transform:scale(1.1)}
.content .business ul.processList .imgArea {/*margin-bottom:20px;*/ overflow:hidden}
.content .business ul.processList .info {padding:10px 15px; background:#ebebeb}
.content .business ul.processList .info.color {background:#555}
.content .business ul.processList .info.color span {color:#fff}
.content .business ul.processList .info span {font-size:15px; color:#777}
.content .business .sub_imgArea img {margin:0 auto;width:auto !important; height:auto !important}
.content .business .sub_mainimg img {margin:0 auto;width:auto !important; height:auto !important}
/* BUSINESS - 사업영역 */
.content .business .area_wrap {text-align:justify; overflow:hidden}
.content .business .area_wrap:after {display:inline-block; width:100%; content:''}
.content .business .area_wrap > .area_box {display:inline-block; width:49.5%; margin-bottom:20px; vertical-align:top}
.content .business .area_wrap > .area_box .imgArea {overflow:hidden}
.content .business .area_wrap > .area_box .info {padding:30px; min-height:260px; background:#efefef}
.content .business .area_wrap > .area_box .info h4 {font-size:24px; font-weight:400; color:#444; line-height:1; margin-bottom:40px}


/* ----------------------------------------------------------------------------------------------------- 미디어 쿼리 ----------------------------------------------------------------------------------------------------- */
@media screen and (max-width:1280px) {
 #sub_visual .swiper-slide .visual_txt{right: 10%;}
}

@media screen and (max-width:1024px) {
 /* 서브 비주얼 영역 */
 #sub_visual {position:relative; overflow:hidden; z-index:20}
 #sub_visual {height:auto;margin-top:80px;}
 #sub_visual .caption {top:12%;position:absolute;max-width:100%;}
 #sub_visual .caption h2 {font-size:28px}
 #sub_visual .caption p {font-size:13px}
 #sub_visual .caption a.btn {font-size:13px; margin-top:40px}
 #sub_visual .swiper-slide {background:none !important;}
 #sub_visual .swiper-slide .visual_txt{z-index: 2;right: -30%; transform:translateX(-50%); text-align: center}
 #sub_visual .swiper-slide img.mobile-style {left:0px;top:0px;width:100%;margin-left:0px;}
 #sub_visual .swiper-button-next, #mainVisual .swiper-button-prev, #mainVisual .swiper-pagination-bullet  {display:none;}

 /* 서브 공통 레이아웃 */
 #container .location_bar {display:none}
 #container > .inner {border:none}
 
 #container .inner .content .title h2 {font-size:24px;}
 
 #leftBar {float:none; width:100%; margin:0; border-bottom:1px solid #dcdcdc}
 #leftBar:after {clear:both; display:block; content:''}
 #leftBar .title {float:none; width:100%; height:60px; padding:0 0 0 50px}
/* #leftBar .title h2 {display:none}*/
 #leftBar .title span {font-size:18px; margin:0; line-height:60px}
 #leftBar .box {display:none}
 .lnb {margin-left:0; height:100%}
 .lnb li {position:relative; float:left; height:100%; border-bottom:none; border-right:1px solid #dcdcdc}
 .lnb li a {display:inline-block; padding:0 13px; height:100%; line-height:60px}
 .lnb li.on a:after {position:absolute; bottom:-18px; left:50%; margin-left:-9px; content:''; border-style:solid; border-width:9px; border-color:transparent; border-top-color:#555}
 #container > .inner .content {margin:0; min-height:auto}
 
 
 #container > .inner .content {margin:0; min-height:auto}
 .btm_img {height:450px}
 .btm_img .inner .caption p {max-width:90%}
 
 
 #bottomCover .video {height:350px; }
 #bottomCover .video video {width:250%;top:0px;}
 #bottomCover .inner {padding:0 20px;z-index:30;}
 #bottomCover .inner .caption {padding-top:20%}
 #bottomCover .inner .caption h2 {font-size:30px;margin-bottom:30px}
 #bottomCover .inner .caption p {font-size:13px; max-width:100%;}
 
 
 /* COMPANY - 회사소개 */
 .content .greeting .grt_tit p br {display:none}
 .content .greeting ul.teamList > li .info ul li {font-size:12px}
 .content .greeting ul.teamList > li .info span {font-size:11px}
 .content .greeting ul.teamList > li .imgArea {width:70%}
 /* BUSINESS - 사업안내 */
 .content .business > p br {display:none}
 .content .business ul.typeList li {width:33%; margin-bottom:40px}
 .content .business ul.typeList li.img_two {width:45%;}
 .content .business ul.typeList li .imgArea {max-height:250px}
 .content .business ul.typeList li .imgArea img {margin-top:-20%}
 #container .inner .content .business img {margin:0 auto; height:250px}
 .content .business ul.processList .info span {font-size:13px}
 /* BUSINESS - 사업영역 */
 .content .business .area_wrap > .area_box .info {min-height:280px}
}
@media screen and (max-width:768px){
 /* 서브 공통 레이아웃 */
 .lnb li a {padding:0 9px;}
 /* 서브 비주얼 영역 */
 #sub_visual .swiper-slide .visual_txt{right: -27%;}
 #sub_visual .swiper-slide .visual_txt p{font-size: 25px}

/* COMPANY - 회사소개 */
 .content .greeting .bg{display:none}
 .content .greeting .grt_tit {width:100%; float:none}
 .content .greeting .grt_tit h3 {font-size:23px;}
 /* BUSINESS - 사업안내 */
 .content .business ul.typeList{margin:0 auto;width:60%;}
 .content .business ul.typeList li {width:100% !important;}

 #container .inner .content .business img { width:auto;}
 #container .inner .content .business img.oneh { width:100%}
	}
@media screen and (max-width:640px) {
 /* 서브 비주얼 영역 */
 #sub_visual .swiper-slide .visual_txt{right: -30%;}
 #sub_visual .swiper-slide .visual_txt p{font-size: 20px}	
 #sub_visual > .imgList {height:200px}
 #sub_visual > .imgList > li {height:200px}

#container > .inner .content:before {display:none;}

 /* 서브 공통 레이아웃 */
 #container > .inner {padding:0 30px}
 #container > .inner .content {padding:0 0 50px 0; border:none}
 #leftBar {position:relative; padding:30px 0 0 0; border:none; overflow:visible; z-index:50}
 #leftBar .title {display:none}
 #leftBar a.dropdown {position:relative; display:block !important; margin-bottom:60px; padding:13px 15px; color:#fff; background:#555}
 #leftBar a.dropdown:after {position:absolute; top:50%; right:15px; width:0; height:0; margin-top:-3px; content:''; border-style:solid; border-width:6px; border-color:transparent; border-top-color:#fff}
 #leftBar a.dropdown.open:after {margin-top:-9px; border-top-color:transparent; border-bottom-color:#fff}
 .lnb {display:none; position:absolute; left:0; top:77px; width:100%; height:auto; margin-left:0; border-top:1px solid #f0f0f0; background:#fff; box-shadow:0 0 2px rgba(0,0,0,.2)}
 .lnb li {float:none; height:auto !important; border:none}
 .lnb li a {display:block; padding:13px 15px; line-height:1; color:#a1a1a1; border-bottom:1px solid #f0f0f0}
 .lnb li:hover a {color:#181818; text-decoration:none; background:none}
 .lnb li.on a {color:#181818; background:none}
 .lnb li.on a span {border-bottom:1px solid #181818}
 .lnb li.on a:after {display:none}
 #container .inner .content h3.sub_tit {font-size:16px; font-weight:600}
 #container > .inner img.img_mob {display:block !important}
 #container > .inner img.img_pc, #container > .inner img.img_tab {display:none !important}
 .btm_img {height:400px}
 .btm_img .inner {padding:0 30px}
 .btm_img .inner .caption h2 {font-size:36px}
 .btm_img .inner .caption p {max-width:100%; font-size:13px}

 /* COMPANY - 회사소개 */
 /*.content .greeting .grt_tit h3 {font-size:16px}*/
 .content .greeting ul.teamList > li {width:100%; margin-bottom:30px; padding-top:30px; text-align:center; border-top:1px solid #e6e6e6}
 .content .greeting ul.teamList > li:first-child {border-top:none}
 .content .greeting ul.teamList > li .imgArea {width:160px}
 .content .greeting .info_box dl {border-bottom:1px dotted #ccc}
 .content .greeting .info_box dl dt {width:20%; border:none}
 .content .greeting .info_box dl dd {margin-left:25%; border:none}
 /* COMPANY - 연혁 */
 .content .history .history_box .his_tit span {font-size:14px}
 .content .history .history_box .his_tit h3 {font-size:18px; margin-top:5px}
 .content .history .history_box .left {float:none; width:100%; margin-bottom:40px}
 .content .history .history_box .left p {font-size:12px}
 .content .history .history_box .right {margin-left:none; width:100%}
 .content .history .history_box .right dl {margin:15px 0; padding:15px 0 0 0; border-top:1px solid #e6e6e6}
 .content .history .history_box .right dl:first-child {border-top:none}
 .content .history .history_box .right dl dt {width:45px; font-size:18px}
 .content .history .history_box .right dl dd {margin-left:60px; font-size:12px}
 /* COMPANY - 찾아오시는 길 */
 #map {height:350px}
 .content .map_box ul.map_info li {font-size:12px}
 /* BUSINESS - 사업안내 */
 .content .business ul.typeList li {width:100%}
 .content .business ul.typeList .info h4 {font-size:15px}
 .content .business ul.typeList li .imgArea {max-height:initial}
 .content .business ul.typeList li .imgArea img {margin-top:0}
 .content .business ul.processList li {width:100%; margin-bottom:40px}
 .content .business ul.processList li:last-child {margin-bottom:0}
 /* BUSINESS - 사업영역 */
 .content .business .area_wrap > .area_box {width:100%; margin-bottom:15px}
 .content .business .area_wrap > .area_box .info {min-height:initial; padding:20px}
 .content .business .area_wrap > .area_box .info h4 {font-size:15px; font-weight:600; margin-bottom:20px}
 .content .business .area_wrap > .area_box .info p {font-size:12px}

 /*장비현황*/
.content .business .sub_imgArea img {width:100% !important;}	
}
@media screen and (max-width:550px){
 /* 서브 비주얼 영역 */
 #sub_visual .swiper-slide .visual_txt{width: 85%; right: -35%;}
 #sub_visual .swiper-slide .visual_txt p span{font-size: 40px}	
}
@media screen and (max-width:480px){
 /* 서브 비주얼 영역 */
#sub_visual .swiper-slide .visual_txt{width: 100%; right: -50%;}
#container .inner .content .business img { width:100% !important;}
	
}
@media screen and (max-width:450px){
#sub_visual .swiper-slide .visual_txt p {word-break: keep-all}	
}
@media screen and (max-width:375px){
 /* 서브 비주얼 영역 */
 #sub_visual .swiper-slide .visual_txt{width: 80%; top: 15%; right:-30%;}
 /* BUSINESS - 사업안내 */
 .content .business ul.typeList{width:100%;}
	}