@charset "utf-8";

/*서브비주얼*/
#subVisual { width:100%; position:relative; z-index:10;}
.svl_area, .svl_area li { width: 100%; height:300px;  background-repeat:no-repeat; background-position:center top; position:relative; z-index:inherit;} 
.svl_area .subVisual_bg1{ background-image:url("/img/sub/SubVisual01.jpg");}
.svl_area .subVisual_bg2{ background-image:url("/img/sub/SubVisual02.jpg");}
.svl_area .subVisual_bg3{ background-image:url("/img/sub/SubVisual03.jpg");}
.svl_area .subVisual_bg4{ background-image:url("/img/sub/SubVisual04.jpg");}
.svl_area .subVisual_bg5{ background-image:url("/img/sub/SubVisual05.jpg");}
.svl_area .subVisual_bg6{ background-image:url("/img/sub/SubVisual06.jpg");}
.svl_area li > div { width:1200px; margin: 0 auto; height: 100%; text-align: center;  padding-top:150px; }
.svl_area h2 { color: #fff; font-size:20px; line-height:120%; animation:vsTit 2s ease-in-out; letter-spacing:-0.03em; text-shadow:1px 1px 1px rgba(0,0,0,0.4);}
.svl_area dl { margin-top:10px; color:#fff; animation:vsTit 2s 2s ease-in-out; animation-fill-mode: forwards; opacity:0; }
.svl_area dt { display:inline-block; line-height:20px; font-size:20px; padding:0 10px; letter-spacing:-0.03em; text-shadow:1px 1px 1px rgba(0,0,0,0.4);}
#subVisual .bx-prev,
#subVisual .bx-next {display: none; text-indent: -999em;}
#subVisual .bx-pager {display: none;}

@keyframes vsTit {
	0% { opacity:0; padding-top:10%; }
	100% { opacity:1; padding-top:0; }
}

@keyframes vsTit2 {
	0% { opacity:0; margin-top:55px; }
	100% { opacity:1; margin-top:35px; }
}


@media screen and (max-width:1100px) {
	/*서브비주얼*/
	.svl_area li > div { width:100%; box-sizing:border-box; padding:150px 10px 0 10px; }
	.svl_area h2 { font-size:18px; }
	.svl_area dt { line-height:100%; font-size:18px; padding:10px 0; }
}

@media screen and (max-width:600px) {
   /*서브비주얼*/
	.svl_area li > div { width:100%; padding:150px 10px 0 10px;}
	.svl_area h2 { font-size:14px; line-height:100%;}
	.svl_area dt { line-height:22px; font-size:14px; padding:0;}
}

/* 박스 */
.SubBax {width:100%;}
.SubBax h2{color:#444; font-size:18px; line-height:20px; font-weight:600; letter-spacing:-0.01em; font-family:notokrM;}
.SubBax p{color:#444;font-size:14px; line-height:16px; letter-spacing:-0.01em;}
.SubBax span{font-size:13.5px; color:444; line-height:25px; letter-spacing:-0.01em;}

/* 1회사소개-1인사말 */
.greeting { margin:0 auto; max-width:1200px; overflow: hidden; position: relative;}
.greeting .img { float: left; position: absolute; z-index:1; top:0; left:0;}
.greeting article { float: right; width:57%; height: 637px; padding:40px 40px 0 40px; margin:120px 20px 50px 0; color: #333; background: #fff; position: relative;  box-sizing:border-box;  box-shadow:1px 1px 25px rgba(0,0,0,0.1); z-index:5; }
.greeting h2 { font-size:22px; margin-bottom:20px;  color:#2369a6;}
.greeting h2 img{ display:inline-block; padding-bottom:10px;}
.greeting span { font-size:14px; color:#333; line-height:26px; margin:0 0 30px 0; word-break:keep-all;}
.greeting p{text-align:right; margin-top:15px; font-size:14px; color:#333; margin:10px 0 25px 0;}
.greeting p span{font-size:16px; color:#000;}
.greeting div { width: 890px; height: 520px; box-sizing:border-box; background: url("/img/sub/gree_line_bg.png") repeat; position: absolute; z-index:0; top: 50px; left: 50%; margin-left:-445px; }
.greeting div:before { content: ""; display: block; width: 830px; height: 460px; background: #fff; margin:30px; }

table.grt_area {width:100%; border-top:2px solid #2c7ac6; color:#666; border-collapse:separate; border-spacing:0; border:none; font-size:14px;}
table.grt_area th {height:2px; background-color:#2c7ac6;}
table.grt_area td {padding:10px 30px;  border-bottom:1px solid #e0e0e0;}
table.grt_area td.bg {background:#f4f4f4; color:#333; font-size:15px;}


@media screen and ( max-width:1200px){
    /* 1회사소개-1인사말 */
	.greeting { margin:110px auto; box-sizing:border-box; padding:0 15px; }
	.greeting article { width:70%; height: auto; padding:30px; margin:30% 20px 20px 0;}
	.greeting p span { display: inline; margin-left: 3px; }
	.greeting div { width: 95%; top: 50px; left: 5%; margin-left:0; padding:30px; }
	.greeting div:before { width: 100%; height: 100%; margin:0; }
}	

@media screen and ( max-width:650px){
    /* 1회사소개-1인사말 */
	.greeting { margin:50px auto 20px auto; padding:0 15px ; }
	.greeting .img { width:100%; }
	.greeting article { width:100%; padding:20px; margin:30% 0 20px 0;}
	.greeting h2 { font-size:18px;}
	.greeting p { font-size:14px; line-height: 150%; }
	.greeting p span { display: inline; margin-left: 3px; font-size:14px;}
	.greeting div { width:100%; height: 270px; padding:20px; background:none;}
	.greeting span { font-size:13px; line-height:20px;}

	table.grt_area { font-size:13px;}
    table.grt_area td {padding:10px;}
    table.grt_area td.bg {width:20%; font-size:13px;}
}

/* 1회사소개-2개요 */
.info { background:#f5f5f5; position:relative; padding:50px; margin-bottom:50px;}
.info h3 { font-size:22px; color:#2369a6; line-height:30px; margin:0 0 20px 0;}
.info h3:before { content:""; width:1px; height:99px; background:#6ba5d4; display:block; position:absolute; top:-76px; left:54px;}
.info p{ background:url("/img/sub/txt_icon1.png")no-repeat 0 8px; font-size:14px; color:#666; padding-left:13px; clear:both; line-height:100%; margin-bottom:5px;}
.info p span{font-size:16px; color:#333;}
.info .img { position:absolute; right:30px ; bottom:-73px;}
.info .img img { width:100%; max-width:410px;  }

@media screen and ( max-width:1100px){
/* 1회사소개-2개요 */
	.info { padding:39px 29px; margin:0 0 80px 0; }
	.info h3:before { display:none;}
	.info h3 { font-size:20px; margin:0 0 44px 0; line-height:1.4;}
	.info .img { position:relative; bottom:-39px; margin:40px 0 0 0; text-align:right; right:-29px;}
}	

@media screen and ( max-width:650px){	
/* 1회사소개-2개요 */
	.info { padding:39px 29px; margin:0;}
	.info h3 { font-size:18px; margin:0 0 22px 0; }
	.info p {font-size:13px;}
	.info p span{font-size:14px; color:#333;}
	.info .img { position:relative; bottom:0; margin:20px 0 0 0; text-align:right; right:0;}
}

/* 1회사소개-3연혁 */
.history_top_tit { padding-right:70px; text-align:right; height:200px; background:url("/img/sub/company02_history_top.jpg") no-repeat center center; background-size:cover; margin-bottom:60px;}
.history_top_tit .t1 { font-size:30px; font-style:italic; color:#fff; padding-top:70px; text-shadow:1px 1px 1px rgba(0,0,0,0.5); font-family:Georgia, "Times New Roman", Times, serif; }
.history_top_tit .t2 { font-size:20px; font-style:italic; color:#fff; margin-top:20px; text-shadow:1px 1px 1px rgba(0,0,0,0.5); }

.history .list {padding:0 0 30px 0;}
.history .list ul {position:relative;}
.history .list ul:before { content:""; width:1px; background:#dbdbdb; display:block; position:absolute; left:476px; top:4px;
height : -webkit-calc(100% - 8px); /* for Chrome, Safari */
height :    -moz-calc(100% - 8px); /* for Firefox */
height :         calc(100% - 8px); /* for IE */
}

.history .list ul li { margin-bottom:24px; padding-left:340px; font-size:15px;}
.history .list ul li:after { content:""; display:block; clear:both;}
.history .list ul li:last-child { margin:0; }
.history .list ul li .year { color:#333; font-size:26px;}
.history .list ul li .year .month { color:#36579a; font-size:20px; display:inline-block; vertical-align:middle; margin:-4px 0 0 20px;}
.history .list ul li .txt { margin:4px 0 0 34px; position:relative; padding:0 0 0 50px;}
.history .list ul li .txt:before { content:""; width:7px; height:7px; background:#3381c5; border-radius:50%; display:block; position:absolute; left:-2px; top:7px; box-sizing:border-box;-moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.history .list ul li:first-child .txt:before,
.history .list ul li:last-child .txt:before { width:17px; height:17px; background:#fff; border:3px solid #3381c5; left:-7px; top:0px;}
.history .list ul li > div { float:left; }
.history .list ul li.img { box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.history .list ul li.img {  position:relative; height:104px; margin-top:-24px; margin-bottom:0; padding:0; }
.history .list ul li.img.right { margin-left:476px; width:724px; }
.history .list ul li.img.left { margin-right:0; width:475px; }
.history .list ul li.img.right:before { left:0;}
.history .list ul li.img.left:before {  right:0; }
.history .list ul li.img.right:before,
.history .list ul li.img.left:before { content:""; width:100%; background:#dbdbdb; height:1px; display:block; position:absolute; top:50%;}
.history .list ul li.img img { }
.history .list ul li.img p {overflow:hidden;  width:198px; height:198px; border:1px solid #dbdbdb; border-radius:50%; position:relative; position:absolute; top:-51px;}
.history .list ul li.img.right p { right:0; margin:0 0 0 0; }
.history .list ul li.img.left p { left:0;  margin:0 526px 0 0; }

@media screen and (max-width:960px) {
	/* 1회사소개-3연혁 */
	.history .list ul:before { left:137px;}
	.history .list ul li { padding:0; }
	.history .list ul li.img.left,
	.history .list ul li.img.right { margin-left: 137px;  max-width:939px; width:auto; display:none;}
	.history .list ul li.img.left p { left:inherit; right:0; margin:0;}
	.history .list ul li .txt { padding:0 0 0 25px;  width: calc(100% - 159px); line-height:1.4; word-break:keep-all;}
}

@media screen and (max-width:650px) {
	/* 1회사소개-3연혁 */
	.history .list {padding:0;}
	.history .list ul:before { left:105px;}
	.history .list ul li {font-size:14px;}
	.history .list ul li .year {font-size:22px;}
	.history .list ul li .year .month {font-size:18px; margin:-4px 0 0 10px;}
	.history_top_tit { padding: 0 30px; margin-bottom:40px;}
	.history_top_tit .t1 { font-size:25px;}
    .history_top_tit .t2 { font-size:16px;}
	.history .list ul li .txt { position:relative; margin:4px 0 0 24px; padding:0 0 0 20px; }
}

/* 1회사소개-4조직도 */
.organ {width:100%; background:url("/img/sub/company03_organ_bg.jpg") no-repeat center bottom; border:1px solid #e1e1e1; padding:50px 50px 150px 100px; }
.organ .img_pc{}

@media screen and (max-width: 1151px) {
/* 회사소개-조직도 */
.organ {padding:30px 30px 70px 30px;}
.organ .img_pc{width:100%;}
}

@media screen and (min-width:601px) {
/* 회사소개-조직도 */
.organ .img_mobile {display:none;}
}

@media screen and (max-width: 600px) {
/* 1회사소개-4조직도 */
.organ {padding:10px}
.organ {background:none}
.organ .img_pc {display:none}
.organ .img_mobile {width:100%;}
}

/* 1회사소개-5오시는 길 */
.map_wrap{width:100%; overflow:hidden; position:relative;}
.map_wrap .tit_line{width:100%; display: block; margin:0 0 15px 0;}
.map_wrap .tit_line h2 {background-color:#fff;display: inline; padding:0 10px 0 0; color:#444; font-size:20px; letter-spacing:-0.03em;}
.map_wrap .left_map{float:left; width:49%; height:350px; margin-right:20px;}
.map_wrap .left_map > *{ width:100% !important}

.map_wrap .right_roadview{float:right; width:49%; height:350px;}
.map_wrap .right_roadview object,
.map_wrap .right_roadview embed{width:100% !important}

.map_info_wrap .map_info{background-color: #f7f7f7; border-bottom: 1px solid  #ddd; padding:30px 0; }
.map_info_wrap .map_info ul:after{content: "";display: block;clear: both;	}
.map_info_wrap .map_info ul li{width: 33.33%; float: left; text-align: center; position: relative; padding: 0 10px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.map_info_wrap .map_info ul li:after{content: ""; position: absolute; left: 0;width: 1px; height: 100%; background-color: #ddd;}
.map_info_wrap .map_info ul li:first-child:after{display: none; }
.map_info_wrap .map_info ul li dl{display: inline-block; height:75px; text-align: left; padding-left: 90px; background-repeat: no-repeat; background-position: left top;  	}
.map_info_wrap .map_info ul li:nth-child(1) dl{background-image: url("/img/sub/map_icon1.png");}
.map_info_wrap .map_info ul li:nth-child(2) dl{background-image: url("/img/sub/map_icon2.png");}
.map_info_wrap .map_info ul li:nth-child(3) dl{background-image: url("/img/sub/map_icon3.png");}
.map_info_wrap .map_info ul li dl dt{color: #333; font-size: 20px; margin-bottom:10px; }
.map_info_wrap .map_info ul li dl dd{font-size: 18px; color: #666; padding-top:5px;}
.map_info_wrap .map_info ul li dl dd p:first-child{margin-top: 0; }
.map_info_wrap .map_info ul li dl dd p{font-size: 14px;}

@media (max-width:1100px){
	/* 1회사소개-5오시는 길 */
   .map_wrap .left_map{width:100%; margin:0 0 40px 0;}
   .map_wrap .left_map iframe,
   .map_wrap .right_roadview iframe {width:100%;}
   .map_wrap .right_roadview{width:100%; margin-top:20px;}
   
   .map_info_wrap .map_info{padding: 30px 0; }
   .map_info_wrap .map_info ul li dl{padding-left: 0; padding-top: 130px; background-position: center top; text-align: center; width: 100%; -webkit-background-size: 100px;background-size: 100px;}
   .map_info_wrap .map_info ul li:after{top: 0;}
}

@media (max-width:700px){
/* 1회사소개-5오시는 길 */
	.map_info_wrap .map_info ul li dl{-webkit-background-size: 80px;background-size: 80px; padding-top: 100px; }
	.map_info_wrap .map_info ul li dl dt{font-size: 17px; margin-bottom: 5px;}
	.map_info_wrap .map_info ul li dl dd{font-size: 15px;  padding-top:0;}
	.map_info_wrap .map_info ul li dl dd p{font-size: 13px; }
    .map_info_wrap .map_info ul li{float: none; width: 100%; margin-top: 20px; }
	.map_info_wrap .map_info ul li:first-child{margin-top: 0;}
	.map_info_wrap .map_info ul li:after{display: none;}
	.map_info_wrap .map_info ul li dl{height: auto; min-height: 80px; background-position: left top; padding-top: 10px; padding-left: 100px; text-align: left; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;	}
	.map_info_wrap .map_info ul li dl dd p br{display: none; }
}

/* 2도시가스- 1주요사업 내용 */
.city_gas01_box {width:100%; letter-spacing:-0.03em;}
.city_gas01_box .img1 {width:100%;  overflow: hidden; position: relative; margin-bottom:50px;}
.city_gas01_box .img1 img{width:100%;}
.city_gas01_box .city_gas01 {width:100%; overflow: hidden; position: relative;}
.city_gas01_box .city_gas01 .img2 { float: left; position: absolute; top:0; left:0; z-index:5; }
.city_gas01_box .city_gas01 article { float: right; width:70%; background-color: #f5f5f5; height: 460px; margin:20px 0 0 0; color: #333; position: relative;  box-sizing:border-box; z-index:1; }
.city_gas01_box .city_gas01 article span {width:100%; padding-left:300px; font-size:20px; color:#000;  display:inline-block; background:#fff; padding-bottom:20px; }
.city_gas01_box .city_gas01 article ul{padding:40px 30px 30px 300px;}
.city_gas01_box .city_gas01 article ul li{ font-size:15px; color:#333; line-height:20px; background:url("/img/sub/txt_icon2.png") no-repeat left 1px;  padding-left:30px;  margin-bottom:15px;}

@media screen and ( max-width:1100px){
   /* 2도시가스- 1주요사업 내용 */
   .city_gas01_box .city_gas01 article ul{padding:40px 30px 30px 330px;}
   .city_gas01_box .city_gas01 article span {padding-left:330px;}
}	

@media screen and ( max-width:960px){
   /* 2도시가스- 1주요사업 내용 */
	.city_gas01_box .city_gas01 {box-sizing:border-box; padding:0 15px; }
	.city_gas01_box .city_gas01 .img2 { width:50%; }
	.city_gas01_box .city_gas01 article { width:70%; height: auto;}
	.city_gas01_box .city_gas01 article ul{padding:40px 30px 30px 200px;}
	.city_gas01_box .city_gas01 article span {padding-left:300px; font-size:16px;}
	.city_gas01_box .city_gas01 article ul li{ font-size:14px;}
}	

@media screen and ( max-width:767px){
   /* 도시가스- 1주요사업 내용 */
    .city_gas01_box .img1 {margin-bottom:30px;}
	.city_gas01_box .city_gas01 { padding:0; }
	.city_gas01_box .city_gas01 .img2 { float: none; width:100%; display: block; overflow: hidden; position: relative;}
	.city_gas01_box .city_gas01 article { width:100%; height: auto; }
	.city_gas01_box .city_gas01 article span {padding-left:30px; font-size:16px;}
	.city_gas01_box .city_gas01 article ul{padding:30px 30px 20px 30px;}
	.city_gas01_box .city_gas01 article ul li{ font-size:14px; margin-bottom:10px;}
}

/* 2도시가스- 2주요 실적 */
.city_gas01_box2 {width:100%; letter-spacing:-0.03em;}
.city_gas01_box2 .img1 {width:100%;  overflow: hidden; position: relative; margin-bottom:50px;}
.city_gas01_box2 .img1 img{width:100%;}
.city_gas01_box2 .city_gas01 {width:100%; overflow: hidden; position: relative;}
.city_gas01_box2 .city_gas01 .img2 { float: left; position: absolute; top:0; left:0; z-index:5; }
.city_gas01_box2 .city_gas01 article { float: right; width:70%; background:url("/img/sub/city_gas02_img3.png") no-repeat #f5f5f5 right 30px bottom 15px; height: 530px; margin:20px 0 0 0; color: #333; position: relative;  box-sizing:border-box; z-index:1; }
.city_gas01_box2 .city_gas01 article span {width:100%; padding-left:300px; font-size:20px; color:#000;  display:inline-block; background:#fff; padding-bottom:20px; }
.city_gas01_box2 .city_gas01 article ul{padding:40px 30px 30px 300px;}
.city_gas01_box2 .city_gas01 article ul li{ font-size:15px; color:#333; line-height:20px; background:url("/img/sub/txt_icon2.png") no-repeat left 1px;  padding-left:30px;  margin-bottom:15px;}

@media screen and ( max-width:1100px){
   /* 2도시가스- 2주요 실적 */
   .city_gas01_box2 .city_gas01 article {background:none; background-color:#f5f5f5;}
   .city_gas01_box2 .city_gas01 article ul{padding:40px 30px 30px 330px;}
   .city_gas01_box2 .city_gas01 article span {padding-left:330px;}
}	

@media screen and ( max-width:960px){
   /* 2도시가스- 2주요 실적 */
	.city_gas01_box2 .city_gas01 {box-sizing:border-box; padding:0 15px; }
	.city_gas01_box2 .city_gas01 .img2 { width:50%; }
	.city_gas01_box2 .city_gas01 article { width:70%; height: auto;}
	.city_gas01_box2 .city_gas01 article ul{padding:40px 30px 30px 200px;}
	.city_gas01_box2 .city_gas01 article span {font-size:16px;}
	.city_gas01_box2 .city_gas01 article ul li{ font-size:14px;}
}	

@media screen and ( max-width:767px){
   /* 2도시가스- 2주요 실적 */
    .city_gas01_box2 .img1 {margin-bottom:0;}
	.city_gas01_box2 .city_gas01 { padding:0; }
	.city_gas01_box2 .city_gas01 .img2 { float: none; width:100%; display: block; overflow: hidden; position: relative;}
	.city_gas01_box2 .city_gas01 article { width:100%; height: auto; }
	.city_gas01_box2 .city_gas01 article ul{padding:30px 30px 20px 30px;}
}

/* 2도시가스- 3배관공사 */
.city_gas01_box3 {width:100%; overflow:hidden; letter-spacing:-0.03em;}
.city_gas01_box3 p{font-size:20px; color:#000; background:url("/img/sub/txt_icon3.png") no-repeat left 0;  padding:0 0 25px 27px;}
.city_gas01_box3 ul{margin-left: -20px;}
.city_gas01_box3 ul li {float: left; width: calc(25% - 20px); margin: 0 0 20px 20px; padding:10px; border:1px solid #ddd; /* box-shadow:2px 2px 6px 0px rgba(0,0,0,0.2);*/}
.city_gas01_box3 ul li:nth-child(9), 
.city_gas01_box3 ul li:nth-child(10),
.city_gas01_box3 ul li:nth-child(11),
.city_gas01_box3 ul li:nth-child(12){margin-bottom:0;}
.city_gas01_box3 ul li img{width:100%;}

@media screen and ( max-width:960px){
   /* 2도시가스- 3배관공사 */
   .city_gas01_box3 ul li{width: calc(50% - 20px);}
   .city_gas01_box3 ul li:nth-child(11), 
.city_gas01_box3 ul li:nth-child(12){margin-bottom: 0;}
}	

@media screen and ( max-width:600px){
  /* 2도시가스- 3배관공사 */
  .city_gas01_box3 ul li{float: none; width: calc(100% - 20px);}
  .city_gas01_box3 p{font-size:16px;}
  .city_gas01_box3 ul li:last-child{margin-bottom: 0;}
}

/* 2도시가스- 3예스코도시가스 4서부고객센타 운영 */
.city_gas04 {width:100%; overflow:hidden; letter-spacing:-0.03em;}
.city_gas04 p{font-size:20px; color:#000; background:url("/img/sub/txt_icon3.png") no-repeat left 0;  padding:0 0 25px 27px; clear: both;}
.city_gas04 .city_gas04_top {width:100%;}
.city_gas04 .city_gas04_top ul{margin-left: -20px;}
.city_gas04 .city_gas04_top ul li {float: left; width: calc(50% - 20px); margin: 0 0 20px 20px; border:1px solid #ddd;}
.city_gas04 .city_gas04_top ul li img{width:100%;}

.city_gas04 .city_gas04_bottom {width:100%; margin-bottom:-20px;}
.city_gas04 .city_gas04_bottom ul{margin-left: -20px;}
.city_gas04 .city_gas04_bottom ul li {float: left; width: calc(25% - 20px); margin: 0 0 20px 20px; border:1px solid #ddd;}
.city_gas04 .city_gas04_bottom ul li img{width:100%;}

@media screen and ( max-width:960px){
   /* 2도시가스- 3예스코도시가스 4서부고객센타 운영 */
   .city_gas04 .city_gas04_bottom ul li{width: calc(50% - 20px);}
}	

@media screen and ( max-width:600px){
  /* 2도시가스- 3예스코도시가스 4서부고객센타 운영 */
  .city_gas04 p{font-size:16px;}
  .city_gas04 .city_gas04_top ul li{float: none; width: calc(100% - 20px);}
  .city_gas04 .city_gas04_bottom  ul li{float: none; width: calc(100% - 20px);}
  .city_gas04 .city_gas04_bottom ul li:last-child{margin-bottom: 0;}
 }

/* 3가스시설 종합관리 - 1주요사업내용 */
.gas_care01 {width:100%; overflow:hidden; letter-spacing:-0.03em;}
.gas_care01 p{font-size:20px; color:#000; background:url("/img/sub/txt_icon3.png") no-repeat left 0;  padding:0 0 25px 27px; clear: both;}
.gas_care01 .txt_box1 {width:100%; margin-bottom:30px;}
.gas_care01 .list { width:100%; overflow:hidden; position:relative; clear:both;}
.gas_care01 .list li{ font-size:16px; color:#666; line-height:22px; background:url("/img/sub/txt_icon1.png") no-repeat left 8px; padding-left:10px; margin-bottom:5px;}
.gas_care01 .list li:last-child{margin-bottom:0;}
.gas_care01 .list li span{color:#0774bf; font-size:16px;}

.gas_care01 .left { float: left;width:35%; border:1px solid #ddd; padding:20px; text-align:center; margin-bottom:50px;}
.gas_care01 .right { float: left; width:65%; padding:0 0 0 50px; background:url("/img/sub/gas_care01_img2.jpg") no-repeat right 0 bottom 15px; margin-bottom:50px;}
.gas_care01 .list2 { width:100%; overflow:hidden; position:relative;}
.gas_care01 .list2 li{ font-size:16px; color:#333; line-height:30px; background:url("/img/sub/txt_icon4.png") no-repeat left 6px; padding-left:25px; margin-bottom:15px;}
.gas_care01 .list2 li:last-child{margin-bottom:0;}

.gas_care01 .cnt_box {width:100%; margin-top:30px; clear: both;}
.gas_care01 .cnt_left {float: left;width:48%;}
.gas_care01 .cnt_right {float: left; width:48%; margin-left:4%;}
.gas_care01 .cnt_right img{border:1px dotted #a0a0a0; border-radius:5px;}

@media screen and ( max-width:1100px){
   /* 3가스시설 종합관리 - 1주요사업내용 */
  .gas_care01 .left img { width:100%;}
  .gas_care01 .right {background:none;}
  .gas_care01 .list2 li{ font-size:14px; color:#333; line-height:22px;}
  .gas_care01 .img_box img{width:100%;}
}	

@media screen and ( max-width:767px){
   /* 3가스시설 종합관리 - 1주요사업내용 */
   .gas_care01 .left {float: none; width:100%; padding:10px;}
   .gas_care01 .right {float: none; width:100%; padding:0;}
   .gas_care01 .cnt_left {float: none; width:100%; margin-bottom:30px;}
   .gas_care01 .cnt_right {float:none; width:100%; margin-left:0;}
 }	

@media screen and ( max-width:600px){
  /* 3가스시설 종합관리 - 1주요사업내용 */
  .gas_care01 p{font-size:16px;}
  .gas_care01 .list li{ font-size:13px;}
  .gas_care01 .list li span{font-size:13px;}
  .gas_care01 .list2 li{ font-size:13px; color:#333; line-height:30px; background:url("/img/sub/txt_icon4.png") no-repeat left 5px; margin-bottom:5px;}
}

/* 3가스시설 종합관리 - 2정압기(조정기) 분해점검 */
.gas_care02 {width:100%; overflow:hidden; letter-spacing:-0.03em;}
.gas_care02 p{font-size:20px; color:#000; background:url("/img/sub/txt_icon3.png") no-repeat left 0;  padding:0 0 25px 27px; clear: both;}
.gas_care02 .left{float:left; width:53%; margin-bottom:30px;}
.gas_care02 .right{float:left; width:45%; margin-left:2%; border:1px solid #ddd; margin-bottom:30px;}
.gas_care02 .right img{width:100%;}

.gas_care02 .table_box {width:100%;}
table.gas_table01 {width:100%; color:#666; border-collapse:separate; border-spacing:0; border:none; font-size:14px;}
table.gas_table01 thead th{background-color:#f7f7f7; padding:15px 15px; border-top:5px solid #225a8a;border-bottom:1px solid #ddd; border-left:1px solid #ddd; font-size:15px; font-weight:500; color:#333; vertical-align:middle;}
table.gas_table01 thead th:first-of-type{border-top:5px solid #3381c5;}
table.gas_table01 thead th:nth-child(3){border-top:5px solid #0b2f68;}
table.gas_table01 thead th:last-child{border-right:1px solid #ddd;}
table.gas_table01 tbody td:last-child {border-right:1px solid #ddd;}
table.gas_table01 tbody td {padding:10px 15px; border:#ddd 1px solid; border-top:none; border-right:none; font-size:14px;}
table.gas_table01 .bg{background-color:#f7f7f7; color:#333;}
table.gas_table01 tbody td ul {margin:0;}
table.gas_table01 tbody td ul li {font-size:14px; color:#666; line-height:20px; background:url("/img/sub/txt_icon1.png") no-repeat left 8px; padding-left:12px; margin:7px 0;}

.gas_care02 .img_box {width:100%; margin-bottom:-20px; clear: both;}
.gas_care02 .img_box ul{margin-left: -20px;}
.gas_care02 .img_box ul li {float: left; width: calc(25% - 20px); margin: 0 0 20px 20px; border:1px solid #ddd;}
.gas_care02 .img_box ul li:nth-child(5), .gas_care02 .img_box ul li:nth-child(6), .gas_care02 .img_box ul li:nth-child(7), .gas_care02 .img_box ul li:nth-child(8) {margin-bottom:0;}
.gas_care02 .img_box ul li img{width:100%;}

@media screen and (max-width:960px){
	/* 3가스시설 종합관리 - 2정압기(조정기) 분해점검 */
	/*.table_box {overflow-x:scroll; padding-bottom:15px;}
    .info_table .gas_table01{ min-width:680px; }*/
	
	.gas_care02 .left{float:none; width:100%;}
    .gas_care02 .right{float:none; width:100%; margin-left:0;}
}

@media screen and (max-width:767px){
	/* 3가스시설 종합관리 - 2정압기(조정기) 분해점검 */
	.gas_care02 .img_box ul li {width: calc(50% - 20px);}
	.gas_care02 .img_box ul li:nth-child(5), .gas_care02 .img_box ul li:nth-child(6) {margin-bottom:20px;}
}

@media screen and (max-width:600px){
	/* 3가스시설 종합관리 - 2정압기(조정기) 분해점검 */
	.gas_care02 p{font-size:16px;}
	table.gas_table01 thead th{font-size:14px;}
	table.gas_table01 tbody td {padding:7px 10px;font-size:13px;}
}

/* 3가스시설 종합관리 - 3시설정비 안전점검 */
.gas_care03 {width:100%; overflow:hidden; letter-spacing:-0.03em;}
.gas_care03 p{font-size:20px; color:#000; background:url("/img/sub/txt_icon3.png") no-repeat left 0;  padding:0 0 25px 27px; clear: both;}
.gas_care03 .left{float:left; width:53%; margin-bottom:30px;}
.gas_care03 .right{float:left; width:45%; margin-left:2%; border:1px solid #ddd; margin-bottom:30px;}
.gas_care03 .right img{width:100%;}

.gas_care03 .table_box {width:100%;}
table.gas_table02 {width:100%; color:#666; border-collapse:separate; border-spacing:0; border:none; font-size:14px;}
table.gas_table02 thead th{background-color:#f7f7f7; padding:15px 15px; border-top:5px solid #225a8a;border-bottom:1px solid #ddd; border-left:1px solid #ddd; font-size:15px; font-weight:500; color:#333; vertical-align:middle;}
table.gas_table02 thead th:first-of-type{border-top:5px solid #3381c5;}
table.gas_table02 thead th:nth-child(3){border-top:5px solid #0b2f68;}
table.gas_table02 thead th:last-child{border-right:1px solid #ddd;}
table.gas_table02 tbody td:last-child {border-right:1px solid #ddd;}
table.gas_table02 tbody td {padding:10px 15px; border:#ddd 1px solid; border-top:none; border-right:none; font-size:14px;}
table.gas_table02 .bg{background-color:#f7f7f7; color:#333;}
table.gas_table02 tbody td ul {margin:0;}
table.gas_table02 tbody td ul li {font-size:14px; color:#666; line-height:20px; background:url("/img/sub/txt_icon1.png") no-repeat left 8px; padding-left:12px; margin:7px 0;}

.gas_care03 .img_box1 {width:100%; clear: both;}
.gas_care03 .img_box1 ul{margin-left: -20px;}
.gas_care03 .img_box1 ul li {float: left; width: calc(33.333% - 20px); margin: 0 0 20px 20px; border:1px solid #ddd;}
.gas_care03 .img_box1 ul li img{width:100%;}
.gas_care03 .img_box1 li .tt{width:100%; height:35px; line-height:35px; font-size:16px; color:#333; text-align:center; background:#f7f7f7; border-top:1px solid #ddd;}

.gas_care03 .img_box2 {width:100%; clear: both;}
.gas_care03 .img_box2 ul{margin-left: -20px;}
.gas_care03 .img_box2 ul li {float: left; width: calc(20% - 20px); margin: 0 0 20px 20px; border:1px solid #ddd;}
.gas_care03 .img_box2 ul li:nth-child(6), 
.gas_care03 .img_box2 ul li:nth-child(7), 
.gas_care03 .img_box2 ul li:nth-child(8), 
.gas_care03 .img_box2 ul li:nth-child(9), 
.gas_care03 .img_box2 ul li:nth-child(10) {margin: 0 0 30px 20px;}
.gas_care03 .img_box2 ul li img{width:100%;}
.gas_care03 .img_box2 li .tt{width:100%; height:35px; line-height:35px; font-size:16px; color:#333; text-align:center; background:#f7f7f7; border-top:1px solid #ddd;} 

.gas_care03 .img_box3 {width:100%; margin-bottom:-20px; clear: both;}
.gas_care03 .img_box3 ul{margin-left: -20px;}
.gas_care03 .img_box3 ul li {float: left; width: calc(33.333% - 20px); margin: 0 0 20px 20px; border:1px solid #ddd;}
.gas_care03 .img_box3 ul li:nth-child(10), .gas_care03 .img_box3 ul li:nth-child(11), .gas_care03 .img_box3 ul li:nth-child(12) {margin-bottom: 0;}

.gas_care03 .img_box3 ul li img{width:100%;}

@media screen and (max-width:960px){
	/* 3가스시설 종합관리 - 3시설정비 안전점검 */
	.gas_care03 .left{float:none; width:100%;}
    .gas_care03 .right{float:none; width:100%; margin-left:0;}
}

@media screen and (max-width:767px){
	/* 3가스시설 종합관리 - 3시설정비 안전점검 */
	.gas_care03 .img_box1 ul li {width: calc(100% - 20px);}
	.gas_care03 .img_box2 ul li {width: calc(50% - 20px);}
	.gas_care03 .img_box2 ul li:nth-child(5), .gas_care02 .img_box ul li:nth-child(6) {margin-bottom:20px;}
	.gas_care03 .img_box3 ul li {width: calc(50% - 20px);}
	.gas_care03 .img_box3 ul li:nth-child(9), .gas_care03 .img_box3 ul li:nth-child(10){margin-bottom: 20px;}
}

@media screen and (max-width:600px){
	/* 3가스시설 종합관리 - 3시설정비 안전점검 */
	.gas_care03 p{font-size:16px;}
    .gas_care03 .img_box1 ul li:nth-child(5), .gas_care02 .img_box ul li:nth-child(6) {margin-bottom:20px;}

	.gas_care03 .img_box2 ul li {width: calc(100% - 20px);}
	.gas_care03 .img_box2 ul li:nth-child(9), .gas_care02 .img_box ul li:nth-child(6) {margin-bottom:20px;}
	.gas_care03 .img_box2 li .tt{font-size:14px;} 

	table.gas_table02 thead th{font-size:14px;}
	table.gas_table02 tbody td {padding:7px 10px;font-size:13px;}
}

/* 3가스시설 종합관리 - 4시설보수 및 배관공사 */
.gas_care04 {width:100%; overflow:hidden; letter-spacing:-0.03em;}
.gas_care04 p{font-size:20px; color:#000; background:url("/img/sub/txt_icon3.png") no-repeat left 0;  padding:0 0 25px 27px; clear: both;}
.gas_care04 .left{float:left; width:49%; margin-bottom:30px;}
.gas_care04 .right{float:left; width:49%; margin-left:2%; margin-bottom:30px;}

.gas_care04 .table_box {width:100%;}
table.gas_table03 {width:100%; color:#666; border-collapse:separate; border-spacing:0; border:none; font-size:14px;}
table.gas_table03 thead th{background-color:#f7f7f7; padding:15px 15px; border-top:5px solid #225a8a;border-bottom:1px solid #ddd; border-left:1px solid #ddd; font-size:15px; font-weight:500; color:#333; vertical-align:middle;}
table.gas_table03 thead th:first-of-type{border-top:5px solid #3381c5;}
table.gas_table03 thead th:nth-child(3){border-top:5px solid #0b2f68;}
table.gas_table03 thead th:last-child{border-right:1px solid #ddd;}
table.gas_table03 tbody td:last-child {border-right:1px solid #ddd;}
table.gas_table03 tbody td {padding:10px 15px; border:#ddd 1px solid; border-top:none; border-right:none; font-size:14px;}
table.gas_table03 .bg{background-color:#f7f7f7; color:#333;}
table.gas_table03 tbody td ul {margin:0;}
table.gas_table03 tbody td ul li {font-size:14px; color:#666; line-height:20px; background:url("/img/sub/txt_icon1.png") no-repeat left 8px; padding-left:12px; margin:7px 0;}

.gas_care04 .img_box1 {width:100%; clear: both;}
.gas_care04 .img_box1 ul{margin-left: -25px;}
.gas_care04 .img_box1 ul li {float: left; width: calc(50% - 25px); margin: 0 0 0 25px;}
.gas_care04 .img_box1 ul li img{width:100%;}

@media screen and (max-width:960px){
    /* 3가스시설 종합관리 - 4시설보수 및 배관공사 */
	.gas_care04 .left{float:none; width:100%;}
    .gas_care04 .right{float:none; width:100%; margin-left:0;}
}

@media screen and (max-width:600px){
	/* 3가스시설 종합관리 - 4시설보수 및 배관공사 */
	.gas_care04 .img_box1 ul li {width: calc(100% - 25px);}
	.gas_care04 .img_box1 ul li:first-child {margin: 0 0 20px 25px;}
	.gas_care04 p{font-size:16px;}
    
	table.gas_table03 thead th{font-size:14px;}
	table.gas_table03 tbody td {padding:7px 10px;font-size:13px;}
}

/* 3가스시설 종합관리 - 5 주요실적 */
.gas_care05 {width:100%; letter-spacing:-0.03em;}
.gas_care05 .img1 {width:100%;  overflow: hidden; position: relative; margin-bottom:50px;}
.gas_care05 .img1 img{width:100%;}

.gas_care05 .left{float:left; width:49%; margin-bottom:40px;}
.gas_care05 .right{float:left; width:49%; margin-left:2%; margin-bottom:40px; border:1px solid #ddd;}
.gas_care05 .right img{ width:100%;}

.gas_care05 .table_box {width:100%;}
table.gas_table04 {width:100%; color:#666; border-collapse:separate; border-spacing:0; border:none; font-size:14px;}
table.gas_table04 thead th{background-color:#f7f7f7; padding:15px 15px; border-top:5px solid #225a8a;border-bottom:1px solid #ddd; border-left:1px solid #ddd; font-size:15px; font-weight:500; color:#333; vertical-align:middle;}
table.gas_table04 thead th:first-of-type{border-top:5px solid #3381c5;}
table.gas_table04 thead th:nth-child(3){border-top:5px solid #0b2f68;}
table.gas_table04 thead th:last-child{border-right:1px solid #ddd;}
table.gas_table04 tbody td:last-child {border-right:1px solid #ddd;}
table.gas_table04 tbody td {padding:10px 15px; border:#ddd 1px solid; border-top:none; border-right:none; font-size:14px;}
table.gas_table04 .bg{background-color:#f7f7f7; color:#333;}
table.gas_table04 tbody td ul {margin:0;}
table.gas_table04 tbody td ul li {font-size:14px; color:#666; line-height:20px; background:url("/img/sub/txt_icon1.png") no-repeat left 8px; padding-left:12px; margin:7px 0;}

@media screen and ( max-width:1100px){
   /* 3가스시설 종합관리 - 5 주요실적 */
   .gas_care05 .cnt_box article {background:none; background-color:#f5f5f5;}
   .gas_care05 .cnt_box article ul{padding:40px 30px 30px 330px;}
   .gas_care05 .cnt_box article span {padding-left:330px;}
}	

@media screen and ( max-width:960px){
    /* 3가스시설 종합관리 - 5 주요실적 */
    .gas_care05 .left{float:none; width:100%; margin-bottom:30px;}
    .gas_care05 .right{float:none; width:100%; margin-left:0;}
	
	.gas_care05 .table_box {overflow-x:scroll; padding-bottom:15px;}
    .gas_care05 .gas_table04 { min-width:680px; }
}	

@media screen and ( max-width:767px){
  /* 3가스시설 종합관리 - 5 주요실적 */
    .gas_care05 .img1 {margin-bottom:30px;}
	
	table.gas_table04 thead th{font-size:14px;}
	table.gas_table04 tbody td {padding:7px 10px;font-size:13px;}
}

/* 4 주택건설- 1주요 사업내용 */
.house01 {width: 100%; letter-spacing:-0.03em;} 
.house01 .img { background:url("/img/sub/house01_img1.jpg") no-repeat; height:400px; background-size:cover; }
.house01 .img img { width:100%; }
.house01 .txtBox { background:#fff; max-width:960px; box-sizing:border-box; margin:-120px auto 0 auto; padding:50px 70px 0 70px; position:relative; z-index:10;}
.house01 .txtBox dl { color:#1257a7; }
.house01 .txtBox dl dt { font-size:22px;}
.house01 .txtBox dl:after { content:""; display:block; width:1px; height:30px; background:#1257a7; margin:25px 0 15px 55px;}
.house01 .txtBox .txt {margin-bottom:30px;}
.house01 .txtBox .txt span { font-size:15px; color:#333; line-height:30px; margin:0 0 30px 0; word-break:keep-all;}
.house01 .txtBox .txt p{text-align:right; margin-top:15px; font-size:14px; color:#333; margin:10px 0 25px 0;}
.house01 .txtBox .txt p span{font-size:16px; color:#000;}

@media screen and (max-width:768px) {
/* 4 주택건설- 1주요 사업내용 */
	.house01 .img { height:246px;}
	.house01 .txtBox { width:100%; margin:20px 0 0 0;}
	.house01 .txtBox dl dd { font-size:22px;}
}
	
@media screen and (max-width:640px) and (min-width: 320px) {
/* 4 주택건설- 1주요 사업내용 */
	.house01 .txtBox {  padding:0;}
	.house01 .txtBox dl:after {    margin: 20px 0 17px 56px;}
	.house01 .txtBox dl dt { font-size:16px;}
	.house01 .txtBox .txt {margin-bottom:0;}
	.house01 .txtBox .txt span { font-size:13px; line-height:22px;}
    .house01 .txtBox .txt p{font-size:13px;}
    .house01 .txtBox .txt p span{font-size:14px;}
}

/* 4 주택건설- 2주요 사업 실적 */
.house02_menu { width:100%; height:50px; letter-spacing:-0.03em;} 
.house02_menu ul { border-bottom:1px solid #3381c5; height:40px;}
.house02_menu ul li {float:left; width:19.68%; border:1px solid #e1e1e1; box-sizing:border-box; margin:0 0.4% 0 0;  height:38px;}
.house02_menu ul li:last-child{ margin-right:0; }
.house02_menu ul li a { font-size:16px; color:#555; display:block; line-height:38px; text-align:center;  background:#f7f7f7; }
.house02_menu ul li:hover { font-size:20px; color:#2e5eaa; background:#fff;}
.house02_menu ul li.on { border:1px solid #3381c5; border-bottom-color:#fff; height:40px;}
.house02_menu ul li.on a { font-size:20px; color:#2e5eaa; background:#fff;}

@media screen and (max-width:900px){
    /* 4 주택건설- 2주요 사업 실적 */
	.house02_menu ul { border-bottom:0; height:40px;}
	.house02_menu ul li {width:49.65%; margin:0 0.6% 10px 0; height:30px;}
	.house02_menu ul li:nth-child(2), .house02_menu ul li:nth-child(4) { margin-right:0; }
	.house02_menu ul li a { font-size:14px; line-height:30px;}
	.house02_menu ul li.on { height:30px;}
	.house02_menu ul li.on a { font-size:15px;}
}

/* 4 주택건설- 2주요 사업 실적 */
.house02 {width:100%; overflow:hidden; letter-spacing:-0.03em;}
.house02 p{font-size:18px; color:#000; background:url("/img/sub/txt_icon5.png") no-repeat left 0;  padding:0 0 20px 30px; clear: both; margin-top:40px;}
.house02 .img_box1 {width:100%; overflow:hidden; border:1px solid #ddd; padding:20px; margin-bottom:50px;}
.house02 .img_box1 img{width:100%;}

.house02 .img_box2 {width:100%; clear: both;}
.house02 .img_box2 ul{margin: 0 0 -20px -20px;}
.house02 .img_box2 ul li {float: left; width: calc(33.333% - 20px); margin: 0 0 20px 20px; border:1px solid #ddd;}
.house02 .img_box2 ul li img{width:100%;}

.house02 .img_box3 {width:100%; clear: both;}
.house02 .img_box3 ul{margin: 0 0 -20px -20px;}
.house02 .img_box3 ul li {float: left; width: calc(50% - 20px); margin: 0 0 20px 20px; border:1px solid #ddd;}
.house02 .img_box3 ul li img{width:100%;}

@media screen and (max-width:767px){
	/* 4 주택건설- 2주요 사업 실적 */
	.house02 .img_box2 ul li {width: calc(50% - 20px);}
	.house02 p{font-size:16px;}
}

@media screen and (max-width:600px){
	/* 4 주택건설- 2주요 사업 실적 */
	.house02 p{font-size:15px;}
	.house02 .img_box1 {padding:10px}
  }


/* 5 건물종합관리- 1주요 사업내용 */
.building01 {width:100%; letter-spacing:-0.03em;}
.building01 .img1 {width:100%;  overflow: hidden; position: relative; margin-bottom:50px;}
.building01 .img1 img{width:100%;}
.building01 .build {width:100%; overflow: hidden; position: relative;}
.building01 .build .img2 { float: left; position: absolute; top:0; left:0; z-index:5; }
.building01 .build article { float: right; width:70%; background-color: #f5f5f5; height: 490px; margin:20px 0 0 0; color: #333; position: relative;  box-sizing:border-box; z-index:1; }
.building01 .build article span {width:100%; padding-left:280px; font-size:20px; color:#000;  display:inline-block; background:#fff; padding-bottom:20px; }
.building01 .build article span img{padding-right:7px;}
.building01 .build article ul{padding:40px 30px 30px 280px;}
.build article ul .s_tit{font-size:16px; color:#333; background:url("/img/sub/txt_icon6.png") no-repeat left 1px;  padding-left:15px; margin-bottom:10px;}
.building01 .build article ul li{ font-size:15px; color:#333; line-height:20px; background:url("/img/sub/txt_icon1.png") no-repeat left 7px;  padding-left:10px;  margin-bottom:10px;}

.building01 .txtBox { max-width:100%; box-sizing:border-box; margin:30px auto 0 auto; position:relative;}
.building01 .txtBox .l_tit{font-size:20px; color:#000; background:url("/img/sub/txt_icon5.png") no-repeat left 0;  padding:0 0 20px 25px; clear: both; margin-top:30px;}
.building01 .txtBox .s_tit{font-size:16px; color:#333; background:url("/img/sub/txt_icon6.png") no-repeat left 1px;  padding-left:15px; clear: both; margin:25px 0 10px 0;}
.building01 .txtBox .txt {}
.building01 .txtBox .txt ul { width:100%; overflow:hidden; position:relative;}
.building01 .txtBox .txt ul li{ font-size:14px; color:#666; line-height:22px; background:url("/img/sub/txt_icon1.png") no-repeat left 8px; padding-left:10px; margin-bottom:5px;}
.building01 .txtBox .txt ul li:last-child{margin-bottom:0;}
.building01 .txtBox .txt ul li span{color:#0774bf; font-size:16px;}

.building01 .box_txt { overflow: hidden; margin-bottom:15px;}
.building01 .box_txt li { float: left; margin-left: 20px; width: calc(20% - 20px);  height:70px; border:2px solid #0871b1; position: relative; text-align:center;}
.building01 .box_txt li:nth-child(1), 
.building01 .box_txt li:nth-child(5) {width: calc(17% - 20px);}
.building01 .box_txt li:nth-child(2){width: calc(26% - 20px);}
.building01 .box_txt li:first-child { margin-left: 0; }
.building01 .box_txt li:before { content: ""; display: block; width: 8px; height: 40px; background: #fff; position: absolute; top: 50%; right: -8px; margin-top:-19.5px; z-index:2; }
.building01 .box_txt li:after { content: ""; display: block; position: absolute; top: 50%; right: -23px; margin-top:-8px; width: 0; height: 0; border-top: 8px solid transparent; border-left: 15px solid #0871b1; border-bottom: 8px solid transparent; z-index:5; }
.building01 .box_txt li:last-child:before,
.building01 .box_txt li:last-child:after { display: none; }
.building01 .box_txt li >div{display: table; width: 100%; height: 100%; padding:0 5%; position: relative; }
.building01 .box_txt li >div:after{ content: ""; display: block; width: 8px; height: 40px; background: #fff; position: absolute;top: 50%;left: -8px;margin-top: -19.5px;z-index: 2;}
.building01 .box_txt li:first-child >div:after{display: none; }
.building01 .box_txt dl { display: table-cell; vertical-align: middle; }
.building01 .box_txt dt { color: #333; font-size:16px; line-height: 100%; padding-top:5px;}
.building01 .box_txt dd { line-height: 130%; font-size:18px;}

.building01 .box_txt2 { overflow: hidden; margin-bottom:15px;}
.building01 .box_txt2 li { float: left; margin-left: 20px; width: calc(30% - 20px);  height:70px; border:2px solid #0871b1; position: relative; text-align:center;}
.building01 .box_txt2 li:nth-child(1) {width: calc(70% - 20px);}
.building01 .box_txt2 li:nth-child(2) {background: #fff;}
.building01 .box_txt2 li:first-child { margin-left: 0; }
.building01 .box_txt2 li:before { content: ""; display: block; width: 8px; height: 40px; background: #fff; position: absolute; top: 50%; right: -8px; margin-top:-19.5px; z-index:2; }
.building01 .box_txt2 li:after { content: ""; display: block; position: absolute; top: 50%; right: -23px; margin-top:-8px; width: 0; height: 0; border-top: 8px solid transparent; border-left: 15px solid #0871b1; border-bottom: 8px solid transparent; z-index:5; }
.building01 .box_txt2 li:last-child:before,
.building01 .box_txt2 li:last-child:after { display: none; }
.building01 .box_txt2 li >div{display: table; width: 100%; height: 100%; padding:0 5%; position: relative; }
.building01 .box_txt2 li >div:after{ content: ""; display: block; width: 8px; height: 40px; background: #fff; position: absolute;top: 50%;left: -8px;margin-top: -19.5px;z-index: 2;}
.building01 .box_txt2 li:first-child >div:after{display: none; }
.building01 .box_txt2 dl { display: table-cell; vertical-align: middle; }
.building01 .box_txt2 dt { color: #333; font-size:16px; line-height: 100%; }
.building01 .box_txt2 dt span{ color: #0871b1; font-size:18px; line-height: 100%; }

@media screen and (max-width:1200px) {
     /* 5 건물종합관리- 1주요 사업내용 */
	.building01 .box_txt { margin-top: 20px; }
	.building01 .box_txt li { margin-left: 1%; width: 19.1%; }

	.building01 .box_txt li:before { width: 3px; height: 45px; margin-top:-22.5px; right: -3px;  z-index:2; }
	.building01 .box_txt li:after { top: 50%; right: -14px; margin-top:-8px; border-top-width: 6px; border-left-width: 8px; border-bottom-width: 6px; }
	.building01 .box_txt dt { font-size:14px; }
	.building01 .box_txt dd { font-size:16px; }

	.building01 .box_txt2 li:before { width: 3px; height: 45px; margin-top:-22.5px; right: -3px;  z-index:2; }
	.building01 .box_txt2 li:after { top: 50%; right: -14px; margin-top:-8px; border-top-width: 6px; border-left-width: 8px; border-bottom-width: 6px; }
	.building01 .box_txt2 dt { font-size:14px; }
	.building01 .box_txt2 dd { font-size:16px; }
}


@media screen and ( max-width:1100px){
  /* 5 건물종합관리- 1주요 사업내용 */
   .building01 .build article ul{padding:40px 30px 30px 330px;}
   .building01 .build article span {padding-left:330px;}
}	

@media screen and ( max-width:960px){
  /* 5 건물종합관리- 1주요 사업내용 */
	.building01 .build {box-sizing:border-box; padding:0 15px; }
	.building01 .build .img2 { width:50%; }
	.building01 .build article { width:70%; height: auto;}
	.building01 .build article ul{padding:40px 30px 30px 200px;}
	.building01 .build article span {padding-left:300px; font-size:16px;}
	.building01 .build article ul li{ font-size:14px;}
}	

@media screen and ( max-width:767px){
  /* 5 건물종합관리- 1주요 사업내용 */
    .building01 .img1 {margin-bottom:30px;}
	.building01 .build { padding:0; }
	.building01 .build .img2 { float: none; width:100%; display: block; overflow: hidden; position: relative;}
	.building01 .build article { width:100%; height: auto; }
	.building01 .build article span {padding-left:30px; font-size:16px;}
	.building01 .build article ul{padding:30px 30px 20px 30px;}
	.building01 .build article ul li{ font-size:14px; margin-bottom:10px;}

	.building01 .txtBox { width:100%; margin:20px 0 0 0;}
}

@media screen and (max-width:640px) {
   /* 5 건물종합관리- 1주요 사업내용 */
	.building01 .txtBox {  padding:0;}
	.building01 .txtBox .txt {margin-bottom:0;}
	.building01 .txtBox .txt span { font-size:13px; line-height:22px;}
    .building01 .txtBox .l_tit{font-size:16px;}
    .build article ul .s_tit{font-size:14px;}
	.building01 .txtBox .txt ul li{ font-size:13px;}
	.building01 .build article ul li{ font-size:13px}

	.building01 .box_txt li { margin:0 0 15px; width: 100%; padding:0 5%; }
	.building01 .box_txt li:nth-child(1), 
	.building01 .box_txt li:nth-child(5) {margin:0 0 15px; width: 100%; padding:0 5%;}
    .building01 .box_txt li:nth-child(2){margin:0 0 15px; width: 100%; padding:0 5%;}
	.building01 .box_txt li:before { width: 45px; height: 3px; margin:0; top: inherit; bottom:-3px; left:50%; margin-left:-22.5px;  }
	.building01 .box_txt li:after { top: inherit; right: 50%; bottom:-17px; margin:0 -5px 0 0; border-bottom: none; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 12px solid #0871b1; }
	.building01 .box_txt li >div:after{width: 45px; height: 3px; margin:0; top: inherit; top:-3px; left:50%; margin-left:-22.5px; }

	.building01 .box_txt2 li { margin:0 0 15px; width: 100%; padding:0 5%; }
	.building01 .box_txt2 li:nth-child(1) {margin:0 0 15px; width: 100%; padding:0 5%;}
	.building01 .box_txt2 li:before { width: 45px; height: 3px; margin:0; top: inherit; bottom:-3px; left:50%; margin-left:-22.5px;  }
	.building01 .box_txt2 li:after { top: inherit; right: 50%; bottom:-17px; margin:0 -5px 0 0; border-bottom: none; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 12px solid #0871b1; }
	.building01 .box_txt2 li >div:after{width: 45px; height: 3px; margin:0; top: inherit; top:-3px; left:50%; margin-left:-22.5px; }
	.building01 .box_txt2 {margin-bottom:0;}
}


/* 5 주택건설- 2 통합관리 개념도 */
.building02 {width: 100%; letter-spacing:-0.03em;} 
.building02 img { width:100%; }
.building02 .img { width:100%; }
.building02 .img2 { width:100%; margin-top:33px;}
.building02 .tit{font-size:20px; color:#000; background:url("/img/sub/txt_icon5.png") no-repeat left 0;  padding:0 0 20px 30px; clear: both; margin-top:30px;}

.building02 .box2{width: 100%; overflow:hidden; position:relative; letter-spacing:-0.03em;}
.building02 .left{float:left; width:49%;}
.building02 .right{float:left; width:49%; margin-left:2%;}
.building02 .txtNum {}
.building02 .txtNum ol{overflow:hidden; list-style-type:decimal;}
.building02 .txtNum ol li{margin-left:30px; padding:0; list-style:decimal; color:#666; line-height:30px; letter-spacing:-0.02em; font-size:16px;}

@media screen and (max-width:767px) {
    /* 5 주택건설- 2 통합관리 개념도 */
	.building02 .left{float:none; width:100%;  margin-bottom:40px;}
    .building02 .right{float:none; width:100%; margin-left:0;}
}

@media screen and (max-width:640px) {
	/* 5 주택건설- 2 통합관리 개념도 */
	.building02 .tit{font-size:16px;}
	.building02 .txtNum ol li{line-height:25px; font-size:14px;}
}

/* 5 주택건설- 3건축물 통합관리 서비스 운영계획*/
.building03 {width: 100%; letter-spacing:-0.03em;}
.building03 .tit{font-size:20px; color:#000; background:url("/img/sub/txt_icon5.png") no-repeat left 0;  padding-left:30px; margin-bottom:25px;clear: both;}

.building03 .list{width:100%; text-align:center; letter-spacing:-0.03em;}
.building03 .list ul {width:100%; display: inline-block; margin-left:-10px;}
.building03 .list ul li {float:left; width:33.333%; width: calc(33.333% - 10px); height:550px; margin:0 0 30px 10px; border: 1px solid  #e1e1e1; position: relative; }
.building03 .list ul li span.tit{position:absolute; left: 50%; margin-left: -75px; margin-top: 80px; display: block; width:150px; height:150px;  background:#084787; filter:alpha(opacity=70); opacity:0.7; 
     border-radius: 50%; padding-top:30px;}
.building03 .list ul li span.tit p{color: #fff; font-size: 17px; text-align:center; line-height:22px;  margin-left: -30px;} 
.building03 .list ul li span.tit img{display:block; text-align:center; padding:10px 0 0 20px;}
.building03 .list ul li .img img{width:100%;  }
.building03 .list ul li .cnt {padding: 20px 15px 30px 15px; position: relative;}
.building03 .list ul li .cnt dl {}
.building03 .list ul li .cnt dl dt{font-size:20px; color: #000; padding-bottom: 10px; position: relative; margin-bottom: 15px; letter-spacing:-0.03em;}
.building03 .list ul li .cnt dl dt:after {position: absolute; left: 50%; bottom: 0; margin-left: -20px; width: 40px; height: 1px; background-color: #084787; content: "";}
.building03 .list ul li .cnt dl dd{text-align:left; font-size: 14px; font-weight: 300; color: #666;}

.building03 .list .txtNum {}
.building03 .list .txtNum ol{overflow:hidden; list-style-type:decimal;}
.building03 .list .txtNum ol li{width:100%; position: relative; border:0; margin:0 0 0 20px; padding:0; list-style:decimal; color:#666; line-height:25px; letter-spacing:-0.02em; font-size:14px; height:auto;}

@media screen and (max-width:1100px){
   /* 5 주택건설- 3건축물 통합관리 서비스 운영계획*/
	.building03 .list{margin-top: 50px;}
	.building03 .list ul li{width:50%;	width: calc(50% - 10px); height:280px;}
	.building03 .list ul li span.num{width: 40px;height: 40px; line-height: 42px; margin-left: -20px; margin-top: -20px; font-size:15px; }
	}

@media screen and (max-width:650px) {
    /* 5 주택건설- 3건축물 통합관리 서비스 운영계획*/
	
	.building03 .list ul li .cnt dl dt{font-size:16px;}
	.building03 .list ul li .cnt dl dd{font-size: 13px;}

	.building03 .list{margin-top: 30px;}
	.building03 .list ul li {float:none; width:100%; width: calc(100% - 10px);}
	
	.building03 .list ul li .cnt{padding: 20px 10px 40px 10px;}
	.building03 .list ul li .cnt dl dt{font-size: 15px;}
	.building03 .list ul li .cnt dl dd{font-size: 13px;}
}

/* 5 주택건설- 4건물통합관리 서비스*/
.building04 {width: 100%; letter-spacing:-0.03em;}
.building04 .tit{font-size:20px; color:#000; background:url("/img/sub/txt_icon5.png") no-repeat left 0;  padding-left:30px; margin-bottom:25px;clear: both;}
.building04 img{width: 100%;}

/* 5 주택건설- 5원격시스템 개념도(한눈에 서비스)*/
.building05 {width: 100%; letter-spacing:-0.03em;}
.building05 .tit{font-size:20px; color:#000; background:url("/img/sub/txt_icon5.png") no-repeat left 0;  padding-left:30px; margin-bottom:25px;clear: both;}
.building05 img{width: 100%;}

/* 5 건물종합관리- 7주요 사업내용 */
.building07 {width:100%; letter-spacing:-0.03em;}
.building07 .img1 {width:100%;  overflow: hidden; position: relative; margin-bottom:50px;}
.building07 .img1 img{width:100%;}
.building07 .build {width:100%; overflow: hidden; position: relative;}
.building07 .build .img2 { float: left; position: absolute; top:0; left:0; z-index:5; }
.building07 .build article { float: right; width:70%; background-color: #f5f5f5; height: 580px; margin:20px 0 0 0; color: #333; position: relative;  box-sizing:border-box; z-index:1; }
.building07 .build article span {width:100%; padding-left:280px; font-size:20px; color:#000;  display:inline-block; background:#fff; padding-bottom:20px; }
.building07 .build article span img{padding-right:7px;}
.building07 .build article ul{padding:40px 30px 30px 280px;}
.building07 .build article ul li{ font-size:15px; color:#333; line-height:20px; background:url("/img/sub/txt_icon6.png") no-repeat left 3px;  padding-left:18px;  margin-bottom:10px;}

@media screen and ( max-width:1100px){
   /* 5 건물종합관리- 7주요 사업내용 */
   .building07 .build article ul{padding:40px 30px 30px 330px;}
   .building07 .build article span {padding-left:330px;}
}	

@media screen and ( max-width:960px){
   /* 5 건물종합관리- 7주요 사업내용 */
	.building07 .build {box-sizing:border-box; padding:0 15px; }
	.building07 .build .img2 { width:50%; }
	.building07 .build article { width:70%; height: auto;}
	.building07 .build article ul{padding:40px 30px 30px 200px;}
	.building07 .build article span {padding-left:300px; font-size:16px;}
	.building07 .build article ul li{ font-size:14px;}
}	

@media screen and ( max-width:767px){
   /* 5 건물종합관리- 7주요 사업내용 */
    .building07 .img1 {margin-bottom:30px;}
	.building07 .build { padding:0; }
	.building07 .build .img2 { float: none; width:100%; display: block; overflow: hidden; position: relative;}
	.building07 .build article { width:100%; height: auto; }
	.building07 .build article span {padding-left:30px; font-size:16px;}
	.building07 .build article ul{padding:30px 30px 20px 30px;}
	.building07 .build article ul li{ font-size:14px; margin-bottom:10px;}
}

/* 회원약관 */
.font_m {font-size:14px; color:#666;}
.font_b {font-size:16px; color:#000;}

/* 페이지 준비중 */
.page_perpare {text-align:center;}

@media (max-width:768px){
.page_perpare img {width:100%; padding:0 0 10px 0}
}