/**
* File Name : sub_layout.css
* Description : 서브스타일시트
* Author : Wed Project Team / Design
* Update : 2022.01.25
**/

@charset "utf-8";
@import url('http://fonts.googleapis.com/earlyaccess/notosanskr.css'); 
@import url('http://fonts.googleapis.com/earlyaccess/nanumgothic.css'); 
@import url('https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css');
@import url('http//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSans-kr.css');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

/* Layout Selector */


.sub-bottom-img {width:100%; height:286px; background:url('../images/sub/sub-bottom-img.png') no-repeat center; background-size:cover; clear:both   }
.bottom-img-info {width:1520px; margin:0 auto; padding-top:90px; text-align:center;  }
.bottom-img-info .img-info-txt {font-size:20px; color:#fff; font-weight:400; margin:0; }
.bottom-img-info .img-phone-txt  { }
.bottom-img-info .img-phone-txt p {display:inline-block; font-size:36px; color:#fff; font-weight:700; letter-spacing:-0.4px; padding:10px 0; margin:0; font-family:'Montserrat' }
.bottom-img-info .img-phone-txt a {color:#fff; font-family:'Montserrat'}
.bottom-img-info .img-phone-txt span {display:inline-block; padding:0 4px }

@media screen and (min-width: 1281px) and (max-width: 1519px){
 .sub-bottom-img {width:100%; height:auto; }
 .bottom-img-info {width:100%; margin:0 auto; padding:40px 30px; }
 .bottom-img-info .img-info-txt {font-size:18px; }
 .bottom-img-info .img-phone-txt {font-size:30px;}
}



@media screen and (min-width: 993px) and (max-width: 1280px){
 .sub-bottom-img {width:100%; height:auto; }
 .bottom-img-info {width:100%; margin:0 auto; padding:40px 30px; }
 .bottom-img-info .img-info-txt {font-size:16px; }
 .bottom-img-info .img-phone-txt {font-size:24px;}
}

@media screen and (min-width: 769px) and (max-width: 992px){
 .sub-bottom-img {width:100%; height:auto; }
 .bottom-img-info {width:100%; margin:0 auto; padding:30px 30px; }
 .bottom-img-info .img-info-txt {font-size:16px; }
 .bottom-img-info .img-phone-txt {font-size:22px;}	
}

@media screen and (min-width: 577px) and (max-width: 768px){
 .sub-bottom-img {width:100%; height:auto; }
 .bottom-img-info {width:90%; padding:30px 30px; }
 .bottom-img-info .img-info-txt {font-size:14px; }
 .bottom-img-info .img-info-txt br {display:none; }
 .bottom-img-info .img-phone-txt p {font-size:20px; }	
 .bottom-img-info .img-phone-txt span {padding:0 2px }
}

@media screen and (max-width: 576px){
 .sub-bottom-img {width:100%; height:auto; }
 .bottom-img-info {width:100%; padding:30px 40px; }
 .bottom-img-info .img-info-txt {font-size:14px; }
 .bottom-img-info .img-info-txt br {display:none; }
 .bottom-img-info .img-phone-txt p {font-size:18px; }	
 .bottom-img-info .img-phone-txt span {padding:0 2px }
 
}
	
/* Link */
a { font-family: 'Noto Sans KR','sans-serif','Nanum Gothic','NanumBarunGothic','Malgun Gothic','dotum', 'NanumSquareRound', 'Lato', 'Helvetica' ,'Spoqa Han Sans', 'Montserrat'; text-decoration:none;   outline: none } 
a:link a:visited {color:#000; text-decoration:none;}
a:hover, a:active { color:#000; text-decoration:none;}



.page-top-img { width:100%;  z-index:0;}
.sub_vimg {width:100%; padding:80px 0; height:400px; background:url('../images/sub/sub-top-img.png') no-repeat; background-position:center; background-size:cover; }

.txtdiv {width:1520px; position: relative; margin:0 auto; text-align:center; padding:80px 0; word-break:break-all;}
.txtdiv .svtxt1 {
  width:100%; 
  font-size:20px; 
  font-weight:400;
  color:#d8c650; 
  line-height:1.2; 
  padding:10px 0; 
  margin:0;
  letter-spacing:-0.6px;
}

.txtdiv .svtxt2 {
  width:100%; 
  font-size:24px;
  font-weight:400;
  color:#FFF; 
  line-height:1.2; 
  padding: 0;
  margin:0;
  letter-spacing:-0.6px;
}

.txtdiv .svtxt3 {
  width:100%;
  font-size:35px; 
  font-weight:700; 
  color:#FFF; 
  line-height:1.4; 
  padding:10px 0; 
  margin:0;
  letter-spacing:-0.4px; 
  font-family:'Montserrat'
}

.txtdiv .svtxt3 span {0 2px}

.spg-cont {width:100%;}
.spg_title_wrap {
  width:100%; 
  height:70px; 
  margin:0 auto; 
  border-bottom:1px solid #cfcfcf;  
  line-height:70px; 
  position:relative; 
  clear:both 
}
.spg_title_wrap .spg_title_hr {width:1520px; margin:0 auto; padding:0 0;}
.spg_title_wrap .spg_tit { float:left; display:inline-block; width:50%; text-align:left; font-size:22px; font-weight:500; }
.spg_title_wrap .spg_dir { float:right;display:inline-block; width:50%; text-align:right; font-size:12px; color:#666;}



.page_object {width:1520px; padding:50px 0; display:block; margin:0 auto;  text-align:center; position:relative;  }
.page_title {font-size:36px; color:#333; line-height:1.4; font-weight:700; }
.page_title_desc {font-size:18px; color:#383838; line-height:1.4; font-weight:400; padding:20px 0;}

.page-about-img {width:1520px; margin:0 auto; padding-top:30px;  position: relative;}


.snip1206 { position: relative;overflow: hidden;color: #fff;	text-align: center; margin:20px 0; cursor:pointer;}
.snip1206 * {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all 0.6s ease;
	transition: all 0.6s ease;
}

.snip1206 img {opacity: 1; width: 100%;  -webkit-transition: opacity 0.35s;	transition: opacity 0.35s; }
.snip1206:after {
	background: #000;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	opacity: 0.75;
	-webkit-transform: skew(-45deg) scaleX(0);
	transform: skew(-45deg) scaleX(0);
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.snip1206 figcaption {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 1;
}

.snip1206 .snipl_h2, .snip1206 .snipl_p {margin: 0; width: 100%;	opacity: 0;}
.snip1206 .snipl_h2 {padding: 10px 20px 0px 20px; display: inline-block; font-size: 1.6em;	font-weight: 400; text-transform: uppercase;}
.snip1206 .snipl_p {padding: 5px 50px; font-size: 0.9em;	font-weight: 500;}
.snip1206 a {left: 0; right: 0;	top: 0;	bottom: 0;	position: absolute;	z-index: 1;}
.snip1206:hover:after, .figure.snip1206.hover:after {
	-webkit-transform: skew(-45deg) scaleX(1);
	transform: skew(-45deg) scaleX(1);
	transition: all 400ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.snip1206:hover figcaption .snipl_h2, .snip1206.hover figcaption .snipl_h2, .snip1206:hover figcaption .snipl_p, .snip1206.hover figcaption .snipl_p {
	-webkit-transform: translate3d(0%, 0%, 0);
	transform: translate3d(0%, 0%, 0);
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}
.snip1206:hover figcaption .snipl_h2, .snip1206.hover figcaption .snipl_h2 {opacity: 1;}
.snip1206:hover figcaption .snipl_p, .snip1206.hover figcaption .snipl_p {opacity: 0.7;}


.page-about-in {max-width:1520px; margin:0 auto; padding:40px 0 50px 0; display:block;}
.page-about-in .about-font {font-size:18px; color:#383838; line-height:1.8; font-weight:400; text-align:left;}
.page-about-in .addr-inner {width:100%; display:block; text-align:center; }
.page-about-in .addr-inner span {display:block; font-size:18px; color:#383838; line-height:1.8; font-weight:400; text-align:center; padding:10px 0!important;}
.page-about-in .addr-inner span br {display:none; }
.page-about-in .add-img {width:100%; display:block; text-align:center; padding:0 0 20px 0;}
.page-about-in .add-img img {width:100%; }

.page-about-in .com-img {width:1520px; display:block; text-align:center; padding:0 0 50px 0;}
.page-about-in .com-img img {width:100%; }

@media screen and (min-width: 1225px) and (max-width: 1519px){

 .page-top-img { width:100%;  z-index:0;}
 .sub_vimg {width:100%; padding:80px 20px; height:400px; }
 .txtdiv {width:100%; padding:80px 0; word-break:break-all;}
 .txtdiv .svtxt1 {font-size:18px; padding:10px 0; }
 .txtdiv .svtxt2 {font-size:22px; color:#FFF; }
 .txtdiv .svtxt3 {font-size:30px; color:#FFF; padding:10px 0; }

 .spg_title_wrap {width:100%; padding:0 50px; border-bottom:1px solid #cfcfcf; }
 .spg_title_wrap .spg_title_hr {width:100%; margin:0 auto; padding:0 0;}
 .spg_title_wrap .spg_tit {float:left;  width:50%; text-align:left; font-size:22px; }
 .spg_title_wrap .spg_dir {float:right; width:50%; text-align:right; font-size:12px; color:#666;}

 .page_object {width:100%; padding:50px 40px; }
 .page_title {font-size:30px; }
 .page_title_desc {font-size:16px; padding:10px 0;}

 .page-about-img {width:100%; margin:0 auto; padding-top:30px;  position: relative;}
 .snip1206 .snipl_h2 {padding: 10px 20px 0px 20px; display: inline-block; font-size: 1.3em;	font-weight: 400; text-transform: uppercase;}
 .snip1206 .snipl_p {padding: 5px 50px; font-size: 1em;	font-weight: 500;}

  .page-about-in {width:100%; padding:20px 0;}
  .page-about-in .about-font {font-size:18px; }
  .page-about-in .addr-inner span {font-size:16px; padding:10px 0!important;}

  .page-about-in .add-img {width:100%;}
  .page-about-in .add-img img {width:100%; }

  .page-about-in .com-img {width:100%; padding:0 0 50px 0;}
  .page-about-in .com-img img {width:100%; }
  
  
}


@media screen and (min-width: 993px) and (max-width: 1224px){

 .page-top-img { width:100%;  z-index:0;}
 .sub_vimg {width:100%; padding:80px 20px; height:400px; }
 .txtdiv {width:100%; padding:80px 0; word-break:break-all;}
 .txtdiv .svtxt1 {font-size:18px; }
 .txtdiv .svtxt2 {font-size:20px; color:#FFF; }
 .txtdiv .svtxt3 {font-size:28px; color:#FFF; }

 .spg_title_wrap {width:100%; padding:0 50px; border-bottom:1px solid #cfcfcf; }
 .spg_title_wrap .spg_title_hr {width:100%; margin:0 auto; padding:0 0;}
 .spg_title_wrap .spg_tit {float:left;  width:50%; text-align:left; font-size:22px; }
 .spg_title_wrap .spg_dir {float:right; width:50%; text-align:right; font-size:12px; color:#666;}

 .page_object {width:100%; padding:50px 30px; }
 .page_title {font-size:30px; }
 .page_title_desc {font-size:18px; padding:10px 0;}

 .page-about-img {width:100%; margin:0 auto; padding-top:30px;  position: relative;}
 .snip1206 .snipl_h2 {padding: 10px 20px 0px 20px; display: inline-block; font-size: 1.3em;	font-weight: 400; text-transform: uppercase;}
 .snip1206 .snipl_p {padding: 5px 50px; font-size: 1em;	font-weight: 500;}

  .page-about-in {width:100%; padding:20px 0;}
  .page-about-in .about-font {font-size:18px; }
  .page-about-in .addr-inner span {font-size:16px; padding:10px 0!important;}

  .page-about-in .add-img {width:100%;}
  .page-about-in .add-img img {width:100%; }

  .page-about-in .com-img {width:100%; padding:0 0 40px 0;}
  .page-about-in .com-img img {width:100%; }
}


@media screen and (min-width: 769px) and (max-width: 992px){

 .sub_vimg {width:100%; padding:80px 20px; height:400px; }
 .txtdiv {width:90%; padding:80px 0; word-break:break-all;}
 .txtdiv .svtxt1 {font-size:16px; }
 .txtdiv .svtxt2 {font-size:18px; color:#FFF;}
 .txtdiv .svtxt3 {font-size:24px; color:#FFF; }

 .spg_title_wrap {
   width:100%; 
   padding:0 40px; 
   height:60px; 
   line-height:60px;
   border-bottom:1px solid #cfcfcf;
  }
 .spg_title_wrap .spg_title_hr {width:100%; margin:0 auto; padding:0 0;}
 .spg_title_wrap .spg_tit {float:left;  width:50%; text-align:left; font-size:22px; }
 .spg_title_wrap .spg_dir {float:right; width:50%; text-align:right; font-size:12px; color:#666;}	

 .page_object {width:100%; padding:50px 40px; }
 .page_title {font-size:26px; }
 .page_title_desc {font-size:15px; padding:10px 0;}

 .page-about-img {width:100%; margin:0 auto; padding-top:30px;  position: relative;}
 .snip1206 .snipl_h2 {padding: 10px 20px 0px 20px; display: inline-block; font-size: 1.3em;	font-weight: 400; text-transform: uppercase;}
 .snip1206 .snipl_p {padding: 5px 50px; font-size: 1em;	font-weight: 500;}

 .page-about-in {width:100%; padding:20px 0;}
 .page-about-in .about-font {font-size:18px; }
 .page-about-in .addr-inner span {font-size:15px; padding:10px 0!important;}

 .page-about-in .add-img {width:100%;}
 .page-about-in .add-img img {width:100%; }
 .page-about-in .com-img {width:100%; padding:0 0 30px 0;}
 .page-about-in .com-img img {width:100%; }

}



@media screen and (min-width: 577px) and (max-width: 768px){

 .sub_vimg {width:100%; padding:80px 20px; height:400px; }
 .txtdiv {width:90%; padding:80px 0; word-break:break-all;}
 .txtdiv .svtxt1 {font-size:16px; }
 .txtdiv .svtxt2 {font-size:16px; color:#FFF; }
 .txtdiv .svtxt3 {font-size:20px; color:#FFF; }	

 .spg_title_wrap {
   width:100%; 
   padding:0 30px; 
   height:50px; 
   line-height:50px;
   border-bottom:1px solid #cfcfcf;
  }
 .spg_title_wrap .spg_title_hr {width:100%; margin:0 auto; padding:0 0;}
 .spg_title_wrap .spg_tit {float:left;  width:50%; text-align:left; font-size:22px; }
 .spg_title_wrap .spg_dir {float:right; width:50%; text-align:right; font-size:12px; color:#666;}	

 .page_object {width:100%; padding:50px 30px; }
 .page_title {font-size:24px; }
 .page_title_desc {font-size:14px; padding:10px 0;}
 .page_title_desc br {display:none}

 .page-about-img {width:100%; margin:0 auto; padding-top:30px;  position: relative;}
 .snip1206 { position: relative;overflow: hidden;color: #fff;	text-align: center; margin-bottom:30px;}
 .snip1206 .snipl_h2 {padding: 10px 20px 0px 20px; display: inline-block; font-size: 1.2em;	font-weight: 400; text-transform: uppercase;}
 .snip1206 .snipl_p {padding: 5px 50px; font-size: 0.9em;	font-weight: 500;}

  .page-about-in {width:100%; padding:20px 0;}
  .page-about-in .about-font {font-size:15px; }
  .page-about-in .addr-inner span {font-size:14px; padding:10px 0!important;}

 .page-about-in .add-img {width:100%;}
 .page-about-in .add-img img {width:100%; }
 .page-about-in .com-img {width:100%; padding:0 0 20px 0;}
 .page-about-in .com-img img {width:100%; }
}

@media screen and (max-width: 576px){

 .sub_vimg {width:100%; padding:80px 0px; height:400px; }
 .txtdiv {width:80%; padding:80px 0;}
 .txtdiv .svtxt1 {font-size:15px;}
 .txtdiv .svtxt2 {font-size:15px; }
 .txtdiv .svtxt3 {font-size:18px;}	


 .spg_title_wrap {
   width:100%; 
   padding:0 20px; 
   height:50px; 
   line-height:50px;
   border-bottom:1px solid #cfcfcf;
  }

 .spg_title_wrap .spg_title_hr {width:100%; margin:0 auto; padding:0 0;}
 .spg_title_wrap .spg_tit {float:left;  width:50%; text-align:left; font-size:16px; }
 .spg_title_wrap .spg_dir {float:right; width:50%; text-align:right; font-size:12px; color:#666;}	

 .page_object {width:100%; padding:50px 20px; }
 .page_title {font-size:22px; }
 .page_title_desc {font-size:14px; padding:10px 0;}
 .page_title_desc br {display:none}

 .page-about-img {width:100%; margin:0 auto; padding-top:20px;  position: relative;}
 .snip1206 { position: relative;overflow: hidden;color: #fff;	text-align: center; margin-bottom:30px;}
 .snip1206 .snipl_h2 {padding: 10px 20px 0px 20px; display: inline-block; font-size: 1.1em;	font-weight: 400; text-transform: uppercase;}
 .snip1206 .snipl_p {padding: 5px 50px; font-size: 0.825em;	font-weight: 500;}

 .page-about-in {width:100%; padding:20px 0;}
 .page-about-in .about-font {font-size:15px; }
 .page-about-in .addr-inner span {font-size:13px; padding:10px 0!important;}
 .page-about-in .addr-inner span br {display:block; }

 .page-about-in .add-img {width:100%;}
 .page-about-in .add-img img {width:100%; }
 .page-about-in .com-img {width:100%; padding:0 0 20px 0;}
 .page-about-in .com-img img {width:100%; }

}




/***** 주요 업무 *****/
.page-product-in { width:1520px; margin:0 auto; padding:20px 0; display:block;}
.product-font-list {width:100%; margin:0 auto; padding:30px 0 10px 0; display:block;}
.product-font1 {font-size:24px; color:#111; font-weight:500; padding:0 0 10px 0; text-align:left;}
.product-font2 {font-size:18px; color:#666; font-weight:400; text-align:left;}

.page-product-item {width:1520px; margin:0 auto; padding:0; display:block;}


@media screen and (min-width: 1281px) and (max-width: 1519px){
 .page-product-in {width:100%; }
 .product-font-list {width:100%; margin:0 auto; padding:30px 0 10px 0; }
 .product-font1 {font-size:20px;}
 .product-font2 {font-size:16px;}
 .page-product-item {width:100%; padding: 0;}
 .page-product-item img {width:100%; }
}




@media screen and (min-width: 993px) and (max-width: 1280px){
 .page-product-in {width:100%;}
 .product-font-list {width:100%; margin:0 auto; padding:30px 0 10px 0; }
 .product-font1 {font-size:20px;}
 .product-font2 {font-size:16px;}
 .page-product-item {width:100%; padding: 0;}
 .page-product-item img {width:100%; }
}


@media screen and (min-width: 769px) and (max-width: 992px){
 .page-product-in {width:100%;}
 .product-font-list {width:100%; margin:0 auto; padding:30px 0 10px 0; }
 .product-font1 {font-size:18px;}
 .product-font2 {font-size:16px;}
 .page-product-item {width:100%; padding: 0;}
 .page-product-item img {width:100%; }
}



@media screen and (min-width: 577px) and (max-width: 768px){
 .page-product-in {width:100%;}
 .product-font-list {width:100%; margin:0 auto; padding:30px 0 10px 0; }
 .product-font1 {font-size:18px;}
 .product-font2 {font-size:16px;}
 .page-product-item {width:100%; padding: 0;}
 .page-product-item img {width:100%; }
}

@media screen and (max-width: 576px){
 .page-product-in {width:100%;}
 .product-font-list {width:100%; margin:0 auto; padding:30px 0 10px 0; }
 .product-font1 {font-size:16px;}
 .product-font2 {font-size:14px;}
 .page-product-item {width:100%; padding: 0;}
 .page-product-item img {width:100%; }

}

.mapdiv {width:1520px; margin:0 auto; padding:0 ; display:block;}
.addr_in {font-size:18px; color:#333; line-height:1.6; font-weight:300; text-align:center; padding:20px 0;}

.boardwrap {padding:0 0 50px 0; width:1520px; min-height:500px; margin:0 auto; display:block; }

@media screen and (min-width: 1281px) and (max-width: 1519px){
 .boardwrap {padding:0 40px 50px 40px; width:100%;  }
 .mapdiv {width:100%; }
 .mapdiv img {width:100%; }
 .addr_in {font-size:16px;}	
}




@media screen and (min-width: 993px) and (max-width: 1280px){
 .boardwrap {padding:0 40px 50px 40px; width:100%;  }
 .mapdiv {width:100%;}
 .mapdiv img {width:100%; }
 .addr_in {font-size:16px;}	
}


@media screen and (min-width: 769px) and (max-width: 992px){
 .boardwrap {padding:0 40px 30px 40px; width:100%;  } 
 .mapdiv {width:100%;}
 .mapdiv img {width:100%; }
 .addr_in {font-size:14px;}	
}

@media screen and (min-width: 577px) and (max-width: 768px){
 .boardwrap {padding:0 40px 30px 40px; width:100%;  } 
 .mapdiv {width:100%;}
 .mapdiv img {width:100%; }
 .addr_in { font-size:12px;}	
}

@media (max-width: 576px){
 .boardwrap {padding:0 20px 30px 20px; width:100%;  } 
 .mapdiv {width:100%;}
 .mapdiv img {width:100%; }
 .addr_in { font-size:12px;}	
}