@charset "utf-8";
 
/*------------------------------------------------------------------------------------

  공통클래스
  
--------------------------------------------------------------------------------------*/  
.area{margin:0 auto;} /* width 홈페이지 컨텐츠 가로값에 맞게 변경 */
.clearfix{*zoom:1;}
.clearfix:after{clear:both; display:block; content:"";}
.blind{overflow:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0}
.text-ellipsis{overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} 
.overlay {    position: relative; }


.clfix:after	{content: "."; display: block; height:0px; clear:both; visibility:hidden}
.clfix	{display: inline-block}
.clfix	{display: block}
* html	.clfix	{height:1%} /* Hides from IE-mac */
.clfix	{zoom:1} /* for IE 5.5-7 */
 
 /* 기본 속성 */
background-blend-mode : normal; 
background-blend-mode : multiply;
background-blend-mode : screen;
background-blend-mode : overlay; 
background-blend-mode : darken; 
background-blend-mode : lighten; 
background-blend-mode : color-dodge; 
background-blend-mode : color-burn;
background-blend-mode : hard-light;
background-blend-mode : soft-light;
background-blend-mode : difference;
background-blend-mode : exclusion;
background-blend-mode : hue;
background-blend-mode : saturation;
background-blend-mode : color;
background-blend-mode : luminosity;

/* 다중 속성 */
background-blend-mode : color-dodge, exclusion; 
background-blend-mode : color-dodge, hue; 

/* 전역 속성 */
background-attachment : inherit;   /* 상속 */
background-attachment : initial;   /* 초기화 */
background-attachment : revert;    /* 원래대로 돌리기 */
background-attachment : unset;     /* 설정 해제 */
/* 출처: https://webstoryboy.tistory.com/1825 [WEBSTORYBOY:티스토리] */

/*------------------------------------------------------------------------------------

  레이아웃
  
--------------------------------------------------------------------------------------*/     
section{position:relative; clear:both;}
.site-section {  padding: 6em 0; }
.layout{position:relative; width:100%; clear:both; height:0}
.blank{position:relative; clear:both; height:8em;}
.blank10{position:relative; clear:both; height:10em;}
.clear{position:relative; clear:both; height:4em;}
.clear2{position:relative; clear:both; height:3em;}
.clear3{position:relative; clear:both; height:2em;}


@media (max-width: 768px) {  
	.blank{position:relative; clear:both; height:6em;}
	.blank10{position:relative; clear:both; height:8em;}
	.clear{position:relative; clear:both; height:3em;}
	.clear2{position:relative; clear:both; height:2em;}
	.clear3{position:relative; clear:both; height:1em;}
}

 

.site-wrap {  }
.sub-wrap { }  
.subM { margin-top:80px;}

@media (max-width: 992px) { 
	.sub-wrap {   }  
	.subM { margin-top:65px;}
	.subM.pt30 { margin-top:100px;}
}

@media (max-width: 768px) { 
	.sub-wrap {   }  
}

@media (max-width: 576px) { 
	.sub-wrap {   }  
}

  

.bg-light { background:#fafafa !important; } 
.bg-black { background:#121212 !important; } 
.bg-primary {    background-color: var(--primary) !important; } 
.bg-yellow { background-color:#ffaa00!important } 
.bg-red { background-color:#ed1c24!important }   
.bg-blue { background:#0083b9 !important; }
.bg-bluesky { background:#f5faff !important ;}  
.bg-darkblue { background:#001478 !important; }  
.bg-lightblue { background:#dcefff !important; } 
.bg-mint { background:#40c5e3 !important; } 
.bg-green { background-color:#53bb2c!important } 
.bg-bgreen  {  background-color: #059d94 !important; }
.bg-ygreen  {  background-color: #5e9704 !important; }
.bg-organe { background-color:#ee3b02!important }  

.bg-green { background-color:#53bb2c!important } 


.border-gray {	border-color:#ccc!important; }

.text-primary,
.text-primary a:not(.btn),
.text-primary h1,
.text-primary h2,
.text-primary h3,
.text-primary h4,
.text-primary h5,
.text-primary h6,
.text-primary .h1,
.text-primary .h2,
.text-primary .h3,
.text-primary .h4,
.text-primary .h5,
.text-primary .h6,
.text-primary .display-1,
.text-primary .display-2,
.text-primary .display-3,
.text-primary .display-4 {  color: var(--primary) !important; }
.text-primary .text-muted {  color: rgba(23, 79, 132, 0.7) !important; }
 
.text-secondary,
.text-secondary a:not(.btn),
.text-secondary h1,
.text-secondary h2,
.text-secondary h3,
.text-secondary h4,
.text-secondary h5,
.text-secondary h6,
.text-secondary .h1,
.text-secondary .h2,
.text-secondary .h3,
.text-secondary .h4,
.text-secondary .h5,
.text-secondary .h6,
.text-secondary .display-1,
.text-secondary .display-2,
.text-secondary .display-3,
.text-secondary .display-4 {  color: #ed1c24 !important; } 
.text-secondary:hover,
.text-secondary:focus 
a.text-secondary:hover,
a.text-secondary:focus {
    color: #ed1c24 !important;
}

.text-yellow,
.text-yellow a:not(.btn),
.text-yellow h1,
.text-yellow h2,
.text-yellow h3,
.text-yellow h4,
.text-yellow h5,
.text-yellow h6,
.text-yellow .h1,
.text-yellow .h2,
.text-yellow .h3,
.text-yellow .h4,
.text-yellow .h5,
.text-yellow .h6,
.text-yellow .display-1,
.text-yellow .display-2, 
.text-yellow .display-3,
.text-yellow .display-4 {  color: #ffaa00 !important; } 

.text-orange  {  color: #fd7e14 !important; }
.text-pink  {  color: #ed0c7b !important; }
.text-purple  {  color: #6f42c1 !important; }
.text-bgreen  {  color: #059d94 !important; }
.text-ygreen  {  color: #5e9704 !important; }
.text-darkblue  {  color: #0083b9 !important; }
.text-blue  {  color: #004fc6  ; color: var(--primary) !important;} 
.text-skyblue { color:#3bb5f0 !important; } 
.text-mint { color:#4edaf9 !important; } 

 

strong { font-weight: 700; } 


/*------------------------------------------------------------------------------------

  섹션-공통
  
--------------------------------------------------------------------------------------*/     
.section {  
	position: relative; 
	display: -webkit-box;
	display: flex;  
	flex-wrap:wrap;
	align-items: center !important; 
	justify-content: center !important; 
  }
 
.area {
	  padding-top:8em;
	  padding-bottom:8em;  
}
 
@media (max-width: 992px) {

 
	.area { 
		padding-top:7em;
		padding-bottom:7em; 
	}
	
}

@media (max-width: 768px) {
	.area { 
		padding-top:6em;
		padding-bottom:6em;  
	} 
}

@media (max-width: 576px) {
	.area { 
		padding-top:5em;
		padding-bottom:5em;
	}    
}

 

 
 
/*------------------------------------------------------------------------------------

  메인 타이틀-공통
  
--------------------------------------------------------------------------------------*/   
 .main-title { 
  position: relative;  
  z-index:9;   
  margin-bottom:40px; 
} 
.main-title h1,
.main-title h2,
.main-title h3,
.main-title h4,
.main-title h5,
.main-title h6  { position: relative; font-weight: 200; } 
.main-title strong {   font-weight: 800; }  
.main-title .section-title {  letter-spacing:-1px;   margin-bottom:30px;  }
.main-title .section-area {  line-height:1.4;  font-weight: 400 !important; }   
.main-title .section-text {  line-height:1.7;  font-weight: 400 !important; } 
.main-title span {  }    
 
@media (max-width: 1240px) {  
	.main-title p {   }   
}

@media (max-width: 992px) {  
	.main-title .section-title { margin-bottom:20px; } 
	.main-title  br  {  display:none ; }  
	.main-title .section-title br  {  display:block ; }   
	.main-title .section-text {   }  
}
@media (max-width: 768px) {  
	.main-title .section-text {   } 
}
@media (max-width: 576px) {  
	.main-title .section-text {   } 
	.main-title br  {  display:none !important; }  
}



 
 
 
 

 
 

 
 
/*------------------------------------------------------------------------------------

  컨텐츠 메인 서브 내용
  
--------------------------------------------------------------------------------------*/   
.text-title p,
.text-title .p,
.ttp {   font-size:1.3rem;  font-weight:500 !important; line-height:1.6; letter-spacing:-.25px; color:#333; } 

@media screen and (max-width: 1400px) {
    .text-title p,
    .text-title .p,
    .ttp  {  font-size: calc(0.95rem + 0.3vw) !important;  }
} 
@media (max-width: 1240px) {  
    .text-title p br,
    .text-title .p br,
    .ttp br {	display:  ;  }   
} 

.text-section p,
.text-section .p,
.tsp   {   font-size:1.2rem;  font-weight:500 !important;  line-height:1.6; letter-spacing:-.25px; color:#333 } 

@media screen and (max-width: 1400px) {
    .text-section p,
    .text-section .p,
    .tsp  {  font-size: calc(0.85rem + 0.25vw) !important; }
} 
@media (max-width: 1240px) {  
    .text-section p br,
    .text-section .p br,
    .tsp br  {  }  
}

 






/*------------------------------------------------------------------------------------

  오버레이 공통
  
--------------------------------------------------------------------------------------*/
.overlay {    position: relative; }
.overlay:before {
      position: absolute;
      content: "";
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgba(0, 0, 0, .7);
      z-index: 1; }  




/*------------------------------------------------------------------------------------

  기타 공통
  
--------------------------------------------------------------------------------------*/
.img,
.blog-img,
.user-img {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center; 
  overflow:hidden; 
  border-radius:.3rem!important }

 
.rounded-img {
    position: relative;
	overflow:hidden;
	border-radius:20px;
} 
@media (max-width: 992px) { 
	.rounded-img { 
		border-radius:10px;
	} 
}

.hover-img img { 
  transition: 0.3s;
}
.hover-img:hover img {
  transform: scale(1.1); 
}
  

.jm-sticky-top {
  position: -webkit-sticky;
  position: sticky;
  top: 8em; }
 
@media (max-width: 992px) { 
	.jm-sticky-top {
	  position:relative; 
	  top: 0; }
}


 

/*------------------------------------------------------------------------------------

  Spinner
  
--------------------------------------------------------------------------------------*/
#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s linear .5s;
    z-index: 99999;
}

#spinner.show {
    transition: opacity .5s ease-out, visibility 0s linear 0s;
    visibility: visible;
    opacity: 1;
} 

 


 

  








 

/*------------------------------------------------------------------------------------

  main-qna 
  
--------------------------------------------------------------------------------------*/ 
 
.main-qna { 	position:relative; }   
.main-qna .b_list_form	  { border-bottom:1px solid #8aa5c2; } 
.main-qna .b_list_form .b_title span {color:#8aa5c2; font-weight:400;  }
.main-qna .b_list_form .btn_more .btn-plus { border: 1px solid #8aa5c2; border-radius: 5px 5px 0 5px; color:#8aa5c2; background:#fff;  }
.main-qna .b_list_form:hover .btn_more .btn-plus,
.main-qna .b_list_form .btn_more:hover .btn-plus,
.main-qna .b_list_form .btn_more .btn-plus:hover { background:var(--primary);  border: 1px solid var(--primary);  }







/*------------------------------------------------------------------------------------

  main-compare 
  
--------------------------------------------------------------------------------------*/ 

.main-compare {  position: relative;  background:#f7f7f7; }
.main-compare  > .container { 
	position: relative; 
	z-index: 9; }   
	

.compare-item {
    position: relative; 
	text-align: center;
	}   

.compare-info { 
	position:absolute;
	top:0; right:0;
	left:0; bottom:0;
	display:block;
	padding:40px 20px;
	content:'';
	z-index:11;	
	} 
.compare-img {
    position: relative; 
	overflow:hidden;
	border-radius:20px; 
	} 
.compare-img.overlay:before {
      position: absolute;
      content: "";
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgba(0, 0, 0, .4);
      z-index: 1; }  

	
.c-title  { font-weight:500; margin-top:5vh; margin-bottom:10px; line-height:1.1; color: #fff;} 
.c-title strong { font-weight:800;  }  
.c-explain {  position:relative; margin:0 0 20px 0;   } 
.c-explain p { font-weight:500;  letter-spacing:-0.5px;  font-size: calc(0.95rem + 0.3vw) !important; color: #fff;
	position:relative; margin:0 0 3px 0; 
	white-space: break-word;
	/* text-overflow: ellipsis; overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical; */ } 

@media screen and (max-width: 1024px) {  
	.compare-info { 
		padding:20px 25px;	
		} 
}
@media screen and (max-width: 992px) {  
	.main-compare br {
		display:none
		} 
	.compare-info { 
		padding:30px 35px;	
		} 
}
 
 

.main-compare .compare-item {
    position: relative;
	margin-bottom:0 !important;
	z-index:10}  
.compare-carousel {
	position: relative; }
.compare-carousel.owl-carousel {
	position: relative; 
	}
.compare-carousel.owl-carousel .owl-item {
	position: relative; 
	opacity: 1; z-index:10;
	-webkit-transition: .3s all ease;
	-o-transition: .3s all ease;
	transition: .3s all ease;
	margin-top:0px; 
	overflow:hidden;
	border-radius:20px;
	}
 
 











 
 
 
 
/*------------------------------------------------------------------------------------

  main-inquiry 
  
--------------------------------------------------------------------------------------*/ 

.main-inquiry {  position: relative;  background:url(../img/customer/subvisual.jpg) center center; background-attachment:fixed; background-size:cover;}
.main-inquiry  > .container { 
	position: relative; 
	z-index: 9; }  
.main-inquiry-right { 
	position: relative; 
	z-index: 10; } 
	
@media screen and (max-width: 992px) { 
	.main-inquiry-right br {
		display:none
		} 
}

@media screen and (max-width: 767px) { 
	.main-inquiry {  background-attachment:scroll;  }  
} 	
	








 
 
 
 
/*------------------------------------------------------------------------------------

  main-sb 
  
--------------------------------------------------------------------------------------*/ 

.main-sb {  position: relative; padding:3em 0; }
.main-sb1 {  position: relative;  background:var(--primary) ;} 

.main-sb1 {  position: relative;  background:var(--primary) url(../img/main/main-sb-bg.png) center center; background-size:cover; background-blend-mode:overlay}
.main-sb2 {  position: relative;  background:#212121 ;} 
.main-sb .container { 
	position: relative; 
	z-index: 9; } 
.main-sb-right { 
	position: relative; 
	z-index: 10; } 

.main-sb .btn {  font-weight: 500 !important; }	
.main-sb .main-sb-tel { line-height:1; margin-top:10px; text-align: right;}
.main-sb .main-sb-tel h1.display-2 a, 
.main-sb .main-sb-tel h1.display-3 a { font-weight:200 !important; letter-spacing: -1px; }

.main-sb1 .main-sb-title { color:#fff }
.main-sb1 .main-sb-title strong { font-weight:800; }
.main-sb1 .main-sb-tel a { color:#ffea01 }

.main-sb2 .main-sb-title { color:#fff }
.main-sb2 .main-sb-title strong { font-weight:800; }
.main-sb2 .main-sb-tel a { color:#ffaa00 }

.main-sb .main-sb-img { position:absolute; display:block; right:0; z-index:9; }
.main-sb1 .main-sb-img {   top:50%; 
	-webkit-transform: translateY(-35%);
	-ms-transform: translateY(-35%%);
	transform: translateY(-35%%); }
	
.main-sb2 .main-sb-img {   top:50%; 
	-webkit-transform: translateY(-65%);
	-ms-transform: translateY(-65%);
	transform: translateY(-65%); }
.main-sb .main-sb-img img{ width:500px; }

	
@media screen and (max-width: 992px) { 
	.main-sb .main-sb-img img{ width:380px; }
	.main-sb-right br {
		display:none
	} 
}
	
@media screen and (max-width: 767px) { 
	.main-sb  { padding:2em 0; text-align:center} 
	.main-sb .btn-holder  {   justify-content: center; }
	.main-sb .main-sb-img { position:relative; margin:auto;}
	.main-sb1 .main-sb-img {   top:auto; margin:auto;
		-webkit-transform: translateY(-20%);
		-ms-transform: translateY(-20%);
		transform: translateY(-20%); }
		
	.main-sb2 .main-sb-img {   top:auto; margin:auto;
		-webkit-transform: translateY(-20%);
		-ms-transform: translateY(-20%);
		transform: translateY(-20%); }
	.main-sb .main-sb-img img{ width:300px; }
	.main-sb-right br {
		display:none
	} 
	.main-sb .main-sb-tel { text-align: center;}
}

 
 
 
 
 
 
.contact-form-wrapper {
  background: #f5f5f5;
  padding: 50px;
  border-radius: 10px
}
@media (max-width: 992px) {
  .contact-form-wrapper {
    padding: 40px;
  }
}
@media (max-width: 767px) {
  .contact-form-wrapper {
    padding: 30px
  }
}
@media (max-width: 575px) {
  .contact-form-wrapper {
    padding: 20px
  }
} 
 
 
 
 
 
 
 

 
 
 
 
 
 
 


/*------------------------------------------------------------------------------------

  Call To Action
  
--------------------------------------------------------------------------------------*/ 

.callto { background:url(../img/main/call-bg.jpg) center center; background-attachment:fixed; background-size:cover; }
.callto .section {
	z-index: 5;
	position: relative; 
	padding:100px 0;}

.callto__text h6 {  
	color: #ffaa00; 
	text-transform: uppercase;
	letter-spacing: ;
	display: block;
	margin-bottom: 30px;
}
.callto__text h2 { 
	color: #ffffff;
	font-weight: 100; 
	text-transform: uppercase;
	letter-spacing:-0.5px ;
	margin-bottom: 36px;
} 
.callto__text .btn  {color:#fff ; font-size: calc(1rem + 0.3vw); } 

@media (max-width: 992px) {
	.callto { background-attachment:scroll; }   
	.callto .section {  
		padding:80px 0;} 
}

@media (max-width: 767px) {   
	.callto .section {  
		padding:60px 0;} 
}
 









/*------------------------------------------------------------------------------------

  하단
  
--------------------------------------------------------------------------------------*/ 

.foot-cust { }
.foot-cust * { color:#fff;}
.foot-cust * a:hover { color:var(--primary) ;}
.foot-cust .display-4 a { color:#d0ef00 !important; }
.foot-cust.overlay:before {
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, .65);
	z-index: 1; } 
	
.foot-cust .section {
	z-index: 5;
	position: relative; }
.foot-cust_text h6 {  
	text-transform: uppercase; 
	display: block; }
.foot-cust_text h2 {   	margin-bottom: 36px;}
.foot-cust_text h2 strong{  } 
 





 


 
 
/*------------------------------------------------------------------------------------

  Footer
  
--------------------------------------------------------------------------------------*/ 
  
footer {  background:#1b1b1b;  } 
.footer *{ color:#F3F3F3;  } 
.footer span,
.footer span a,
.footer a,
.footer a span { color:#fff } 
.footer .home {display:none} 
.footer-logo a img{   	width:100%; 	max-width:160px;}    

.footer-quick {border-width:0 0 1px 0; border-color:rgba(255,255,255,.5); border-style:solid;  display:block;  text-align:right;}  
.footer-quick li { position:relative; display:inline-block;  margin:0 20px 0 0;  }  
.footer-quick li:after {  position:absolute; display:block; top:25%; bottom:0; content:''; width:0px; height:50%; background:rgba(255,255,255,.2);  right:-10px;}   
.footer-quick li:last-child:after {   display:none; }   
.footer-quick li a  {      color:#F3F3F3; font-size: calc(0.85rem + 0.15vw);   }  
.footer-quick li a:hover {      color: #fff !important; }  

.footer-content .footer-links h6 { color:#fff; margin-bottom: 20px; font-size:120%;}
.footer-content .footer-links { text-align:center; margin-bottom: 30px;}
.footer-content .footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
} 
.footer-content .footer-links ul a {   color:#F3F3F3 ;  
	transition: 0.3s;  
	display: inline-block;
	line-height: 1 ;
}
.footer-content .footer-links ul a:hover {  color: #fff;}  
.footer-info li {  display:inline-block;  margin:0 1.5em 2px 0; font-size: calc(0.85rem + 0.15vw);  }   
.footer-info li a:hover {      color: var(--primary); }      
.copy{  font-size: calc(0.85rem + 0.15vw);  margin-top: 20px; } 

@media (max-width: 992px) {  
	.copy{   margin-bottom:80px; }  

}

@media (max-width: 767px) { 
	.footer-logo {  display: none; }  
	.footer-quick {   text-align:left;}    
	.footer-quick li { margin:0 10px 0 0;  }   
	.footer-quick li a { font-size:.95rem; }   
	.footer-content .footer-links h6 { margin-bottom: 5px; font-size:110%;}
	.footer-content .footer-links { margin-bottom: 20px; text-align:left; }
	.footer-content .footer-links a{  padding-left:0}
	.footer-info li {  margin:0 1em 2px 0;  font-size:.95rem; }    
	.copy{font-size:.9rem;  margin-top: 0px; margin-bottom:40px; }
}
@media (max-width: 576px) {  
	.footer_logo a{  max-width:140px; 	} 
	.footer-quick li a { font-size:.9rem; }   
	.footer-info {  margin-bottom: 60px;} 
	.footer-info li {  font-size:.9rem;  }    
	.copy{ font-size:.8rem;  }
}
   
 
 
 
 
 
 
 
/*------------------------------------------------------------------------------------

  Right - Tel / Inquiry / Top
  
--------------------------------------------------------------------------------------*/ 
#st-backtotop * { position:relative; box-sizing:border-box;} 
#st-backtotop { position: fixed; bottom: 10px; right:10px; text-decoration: none;  z-index: 92; cursor: pointer;  /* display: none ; */ }
#st-backtotop > div {  } 	
#st-backtotop > div,
#st-backtotop > div a{ color: #fff; color: #333;   width:80px; height:80px;  text-align:center; margin-bottom:1px; 
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
	 position: relative; 
	display: -webkit-box;
	display: flex;  
	flex-wrap:wrap;
	flex-direction:column;
	align-items: center !important; 
	justify-content: center !important; font-size:1rem; color: #fff; font-weight: 500;}
	
#st-backtotop > div i{ font-size:2rem; }
#st-backtotop > div img{ width:60%;  }
#st-backtotop > div span { margin-top: 3px;   display: none !important } 

.st-btn { background:#fff;   position: relative; 	display: none !important } 
.st-btn:last-child { } 
.st-btn a {  
	 position: relative;  
	display: -webkit-box;
	display: flex;  
	flex-wrap:wrap; 
	align-items: center !important;  
	color: #444 !important;  } 
.st-btn a i{ font-size:2rem; 	border-radius:50%;  margin-bottom: 3px; display: block ; color: #444 !important; }  
.st-btn a img {  width: 60%; height: auto; text-align: center;  }  
.st-btn:hover {   background:var(--primary); } 
.st-btn:hover a{  color: #fff !important; } 
.st-btn:hover a i{  color: #fff !important; } 


.st-tel { background-color: var(--primary);  border-radius:50%;    }
.st-tel i{ color: #fff;  }	

.st-inqu { background-color: #fff;  border: 1px solid var(--primary);  border-radius:50%;   }
.st-inqu i{ color: var(--primary);  } 
.st-inqu span { color: var(--primary);   } 

.st-pay { background-color: #fff;  border: 1px solid var(--primary);  border-radius:50%;   }
.st-pay i{ color: var(--primary);  } 
.st-pay span { color: var(--primary);   } 

.st-facebook { background-color: #fff;  border: 1px solid var(--primary);   border-radius:50%;    }
.st-facebook i{ color: var(--primary);   }

.st-google { background-color: #fff;  border: 1px solid var(--primary);   border-radius:50%;   }
.st-google i{ color: var(--primary);  } 

.st-apple { background-color: #fff;  border: 1px solid var(--primary);   border-radius:50%;    }
.st-apple i{ color: var(--primary);   }
 
.st-top { background: #f1f1f1;  background-color: rgba(0,0,0,.45); text-transform:uppercase; border-radius:50%;  }
.st-top i  {   color: #fff;  } 
.st-top:hover {  background-color: rgba(0,0,0,.75);  } 
.st-top:hover i {   color: #ffaa00;  } 

/* .st-inqu:hover {   background:rgba(0,0,0,1); }
.st-inqu:hover i{   color: var(--primary); }  */

/* .st-kakao { background: #fee500;   }
.st-kakao:hover {   }  */

 
 
 @media (max-width: 992px) { 
	#st-backtotop {  bottom: 110px; right:5px; } 
	#st-backtotop > div,
	#st-backtotop > div a{ width:70px; height:70px; }
	#st-backtotop > div i{ font-size:1.7rem;   } 
	#st-backtotop > div a span {display: none; } 
	.st-btn { display: none !important ; } 
 }
 
  @media (max-width: 768px) {  
	#st-backtotop > div,
	#st-backtotop > div a{ width:60px; height:60px; }
	#st-backtotop > div i{   } 
	.st-top { display: none !important ; } 
 }
 
 
  @media (max-width: 576px) {  
	#st-backtotop > div,
	#st-backtotop > div a{ width:50px; height:50px; }
	#st-backtotop > div i{  font-size:1.5rem;   } 
 }
 




/*---------------------
  footer-menu-bottom
-----------------------*/

.footer-menu-bottom{  display:none ; } 
 @media (max-width: 992px) { 
	.footer-menu-bottom{ padding-top:0px; height:auto; text-align:left; display:block; z-index:2000;  } 
	/* .footer-menu-bottom > div {  height:auto;  line-height:1.1; color:#fff;   border-radius:60px; text-align:center; margin:auto; letter-spacing: -1px; font-size: calc(0.9rem + 0.25vw); padding:5px 0; }*/
	.footer-menu-bottom a i{ vertical-align:middle;   }
	.footer-menu-bottom a img {  width: 26px; height: auto; text-align: center;  }  
	.footer-menu-bottom.menu-num1 a{ }
	.footer-menu-bottom.menu-num2 a{ }  
	/* .footer-menu-bottom a:nth-child(1){ background:var(--primary); background:#00bf2d; color:#fff;  }
	.footer-menu-bottom a:nth-child(2){ background:#ed1c24; color:#fff; }
	.footer-menu-bottom a:nth-child(3){ background:#ed1c24; color:#fff;  }*/
	.footer-menu-bottom a:nth-child(1) i{line-height:1; } 
	.footer-menu-bottom i{line-height:1; } 
	.footer-menu-fixed {position:fixed; bottom:0; left:0; width:100%; padding:0px 0%; background:rgba(0,0,0,.2); z-index:2000; }
	.footer-menu-wrap{ width:100%; max-width:992px; margin: 0 auto;  }
	.footer-menu-wrap .googleapple{ width:100%; max-width:992px; margin: 0 auto;  }
	.footer-menu-wrap .googleapple div {  height:auto;  line-height:1.1; color:#fff;  border-radius:60px; text-align:center; margin:auto; letter-spacing: -1px; font-size: calc(1rem + 0.25vw); padding:10px 0 10px 20px; font-weight: bold }
	.footer-menu-wrap .google{ position:relative; background:#00bf2d ; color:#fff;  }
	.footer-menu-wrap .google::before{ display: block; content: url("../img/common/icon-mo-10.svg"); position: absolute; left:20px; top:2px; width: 28px; height:28px;}
	.footer-menu-wrap .apple{ position:relative; background:#ed1c24;  color:#fff;  }
	.footer-menu-wrap .apple::before{ display: block; content: url("../img/common/icon-mo-11.svg"); position: absolute; left:20px; top:2px; width: 28px; height:28px;}
	.footer-menu-wrap .point{ position:relative; background:#ffea00;   height:auto;  line-height:1.1; color:#fff;  border-radius:60px; text-align:center; margin:auto; padding:10px 0; }
	.footer-menu-wrap .point a{ position:relative; color:#111; letter-spacing: -1px; font-size: calc(1rem + 0.25vw);  font-weight: bold }
	.footer-menu-wrap .point::before{ display: block; content: url("../img/common/icon-mo-12.svg"); position: absolute; left:20px; top:2px; width: 28px; height:28px;}
 }
 

#btmMenuBar{  display:none ;  }
 
@media (max-width: 992px) { 
	#btmMenuBar{ background-color: #fff;position: fixed; top: 62px; left: 50% ; padding: 15px 0 5px; border-top: 1px solid #ececec; transform: translateX(-50%); width: 100%; z-index:2000; display:block;  border-bottom: 1px solid #ececec; }
	#btmMenuBar .head_inner{}
	#btmMenuBar .head_inner ul{ display: flex; padding: 5px 0; align-items: flex-end; justify-content: space-between; }
	#btmMenuBar .head_inner ul li{flex-grow: 1; width:25%;}
	#btmMenuBar .head_inner ul li a{ height: 45px; display: flex; flex-direction: column; align-items: center; justify-content: end;gap: 1px;}
	#btmMenuBar .head_inner ul li a span{flex-grow:1; display:flex; align-items:center; justify-content:center; }
	#btmMenuBar .head_inner ul li a img{ width: 35px; position:relative; transform-origin: center center;}
	#btmMenuBar .head_inner ul li a p{color: #333; font-size: calc(0.85rem + 0.2vw);  font-weight: 500;} 
}
 



 


 
 

 

 
 
/*------------------------------------------------------------------------------------

  문의
  
--------------------------------------------------------------------------------------*/
.estimate .input_field  { position: relative;}
.estimate .input_field input, 
.estimate .input_field textarea {
  width: 100%;
  position: relative;
  height: 50px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #afafaf !important;
  padding:0 15px; 
  background: transparent;
  color: #111; 
  line-height:;
  background:#fff;
  font-size: calc(1rem + 0.1vw);
}

	.estimate-quick .input_field input, 
	.estimate-quick .input_field textarea { 
	  border: 1px solid #888 !important; 
	  color: #fff;  
	  background:rgba(0,0,0,0.3);
	} 
.estimate .input_field textarea {  padding:18px;}
.estimate .input_field input::placeholder, 
.estimate .input_field textarea::placeholder {
  color: #444;
  font-weight: 400; 
}  
	
	.estimate-quick .input_field input::placeholder, 
	.estimate-quick .input_field textarea::placeholder {
	  color: #fff;
	  font-weight: 400; 
	}
.estimate .input_field input:focus, 
.estimate .input_field textarea:focus {  outline: none;}
.estimate .input_field textarea {  height: 100px;}

.estimate .esti-txt { padding:15px 0; margin: 20px 0; }
.estimate .esti-txt p { } 

.estimate .esti-ct  { position:relative; margin:10px 0 10px}
.estimate .esti-ct h6 { position:relative; font-weight: 500; }
.estimate .esti-ct h6 .check::after { 
	position:relative;
	content: "\F151";  
	right:auto;   
	color:#e8006d;
	font-weight:400; 
	font-size:.85rem;
	margin-left:5px;
	 font-family: 'bootstrap-icons';  
	 display:inline-block;
}
	 
	.estimate-quick .esti-ct h6 { color:#fff; } 

.estimate .nice-select { 
	height: 50px;
	line-height: 50px;
	outline: none;
	padding-left: 15px;
	padding-right: 30px;
	position: relative;
	float:none !important;
	text-align: left !important;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	white-space: nowrap;
	width: auto;
	background: transparent;
	border: 1px solid #afafaf!important;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background:#fff;
	margin-bottom: ;
	width: 100%;
	color: #111;
	font-size: calc(1rem + 0.1vw); 
} 
	.estimate-quick .nice-select {  
	  border: 1px solid #888!important;  
	  color: #fff; 
	  background:rgba(0,0,0,0.3);
	}

.estimate .nice-select .option {  color: #111;  font-size: calc(1rem + 0.1vw); }
.estimate .nice-select .list {
	background-color: #fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	box-shadow: none;
	border: 1px solid #afafaf !important;
	margin-top: 0px;
	z-index:93;
	font-size: calc(1rem + 0.1vw); }
	
	.estimate-quick .nice-select .option {  color: #fff; }
	.estimate-quick .nice-select .list {
		background-color: #fff; 
		border: 1px solid #888 !important; }
	 
.estimate .nice-select .option:hover, 
.estimate .nice-select .option.focus, 
.estimate .nice-select .option.selected.focus {      background-color: #f6f6f6; }
.estimate .nice-select .option.selected {     font-weight: 400 !important;   }
	 
.estimate .nice-select::after {
	content: "\f107";
	display: block;
	margin-top: -5px;
	pointer-events: none;
	position: absolute;
	right: 15px;
	top: 50%;
	transition: all 0.15s ease-in-out;
	font-family:'bootstrap-icons';
    font-family: 'icomoon';
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	color: #222;
	font-size: 1.4rem;  
}


.estimate .esti-item  { padding:15px 0; }
.estimate .esti-item.row  {  align-items: start; 
	padding-right: 0;
    padding-left: 0;	
	margin-right: 0;
    margin-left: 0;
} 
 
.estimate .esti-item > div { 	
	padding-right: 0;
    padding-left: 0;	
	margin-right: 0;
    margin-left: 0;
}
.estimate .esti-item.row .row {  align-items: center;  	
	margin-right: -5px;
    margin-left: -5px;
} 

	.estimate-quick .esti-item.row  {  align-items:  ;  
	}  
	.estimate-quick .esti-item.row .row {  align-items:  ;  
	} 
	
	.estimate-quick .esti-item.row p {  color: #fff !important; 
	} 

.estimate .esti-item.row .row > .col, 
.estimate .esti-item.row .row > [class*="col-"]  {  
	padding-right: 5px;
    padding-left: 5px; 
} 

.estimate .protect  { background:#fff; border: 1px solid #ccc; padding:15px ;  } 
.estimate  p.protect { color:; font-size: calc(1rem + 0.1vw); font-weight:400; } 
.estimate .essential { color:#e8006d; }


.estimate-quick .esti-item  { padding:5px 0; }



@media screen and (max-width:768px){   
	.estimate .protect  {padding:15px ; } 
	.estimate .esti-item  { padding:5px 0; }
	.estimate .esti-item.row .row {  align-items: center;  	
		margin-right: -2px;
		margin-left: -2px;
	} 
	.estimate .esti-item.row .row > .col, 
	.estimate .esti-item.row .row > [class*="col-"]  {  
		padding-right: 2px;
		padding-left: 2px; 
	}
}
 

.estimate input,   
.estimate button  {  /*font-size:1.05rem;*/} 

@media screen and (max-width:768px){  
	.estimate input,   
	.estimate button  { /* font-size:1rem; */} 
}

@media screen and (max-width:576px){ 
	.estimate input, 
	.estimate button  {/*  font-size:.95rem; */} 
}
 
 
 
 
.estimate .radio-wrapper .select-radio .radio {
	margin:0.5rem; 
	margin:0.5rem 1rem 0.5rem 0.5rem; 
	display:inline-block
}

.estimate .radio-wrapper .form-check .form-check-label { 
    padding-left: 0; 
} 
.estimate .radio-wrapper .select-radio .radio label {
	cursor:pointer;
	margin-left:-2px; 
	color:#222;
	font-size:1.1rem;
	line-height:1.4em;
} 

	.estimate-quick .radio-wrapper .select-radio .radio label { 
		color:#fff; 
	} 

.estimate .radio-wrapper .select-radio .radio input[type="radio"] {
	position:absolute;
	opacity:0;
	cursor:pointer
}
.estimate .radio-wrapper .select-radio .radio input[type="radio"]+.radio-label:before {
	content:'';
	background:#fff;
	border-radius:100%;
	border:1px solid #afafaf;
	display:inline-block;
	width:1.4em;
	height:1.4em;
	position:relative; 
	margin-right:10px;
	vertical-align:top;
	cursor:pointer;
	text-align: ;
	transition:all 250ms ease
}
.estimate .radio-wrapper .select-radio .radio input[type="radio"]:checked+.radio-label:before {
	background-color:var(--primary);
	box-shadow:inset 0 0 0 4px #f4f4f4
}
.estimate .radio-wrapper .select-radio .radio input[type="radio"]:focus+.radio-label:before {
	outline:none;
	border-color:var(--primary)
}
.estimate .radio-wrapper .select-radio .radio input[type="radio"]:disabled+.radio-label:before {
	box-shadow:inset 0 0 0 4px #f4f4f4;
	border-color:#afafaf;
	background:#b4b4b4
}
.estimate .radio-wrapper .select-radio .radio input[type="radio"]+.radio-label:empty:before {
	margin-right:0
}
@media (max-width: 1240px) { 
	.estimate .radio-wrapper {		display:block	} 
}
@media screen and (max-width:992px){ 
	.estimate .estimate-wrapper { 		padding:50px; 	}
}
@media screen and (max-width:768px){ 
	.estimate .estimate-wrapper { 		padding:30px; 	}
	.estimate .radio-wrapper .select-radio .radio label { 
		font-size:1rem; 
	} 
}
@media screen and (max-width:576px){ 
	.estimate .estimate-wrapper { 		padding:20px; 	}
	.estimate .radio-wrapper .select-radio .radio label { 
		font-size:.95rem; 
	} 
}
@media screen and (max-width:340px){ 
	.estimate .estimate-wrapper { 		padding:10px; 	}
}




.a_group > .row ,
.a_group .row.addrow { padding:8px 0; background:#fff; margin:0; width:100%; border-bottom:1px solid #ccc; }
.a_group > .row:nth-child(2n) ,
.a_group .row.addrow:nth-child(2n)  {  }
.a_group .a_group_field   { background:#f2f9fd; border-top:1px solid #ccc; }
.estimate .a_group .esti-item  { padding:3px 0; }
.estimate .a_group .esti-item.row  { border-bottom:none !important; } 
.estimate .radio-wrapper .select-radio .radio { 
	margin:0.25rem 0.5rem 0.25rem 0.25rem;  
}
.estimate .a_group .radio-wrapper .select-radio .radio label {  
	font-size:1rem;
	line-height:1.2em;
} 
.estimate .a_group .radio-wrapper .select-radio .radio input[type="radio"]+.radio-label:before { 
	width:1.2em;
	height:1.2em; 
}

@media screen and (max-width:992px){ 
	.a_group .a_group_field   { display:none !important; }
}



.file_input label {
    position:relative;
    cursor:pointer;
    display:inline-block;
    vertical-align:middle;
    overflow:hidden;
    width:;
    height:50px;
    background:#222;
    font-size:1rem;
    color:#fff;
    text-align:center;
    line-height:50px;
	top:3px; 
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.file_input label input {
    position:absolute;
    width:0;
    height:0;
    overflow:hidden; 
	border:transparent;
}
.file_input input[type=text] {
    vertical-align:middle;
    display:inline-block;
    width:;
    height:50px;
    line-height:50px;
    font-size:1.1rem;
    padding:0;
    border:0;
    border:1px solid #afafaf;
  padding-left: 18px;
  padding-right: 30px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

input.disabled  {
	color:#222;
	background-color:#f4f4f4 !important
}
input:not(:disabled):not(.disabled).active  {
	color:#222;
	background-color:#f4f4f4;
	border-color:#f4f4f4
}
input:not(:disabled):not(.disabled).active:focus {
	box-shadow:0 0 0 .2rem rgba(0, 123, 255, .5)
}


 


 
 
/*---------------------
  form-control
-----------------------*/
.form-control {
	display:block;
	width:100%;
	height:calc(1.5em + .75rem + 2px);
	padding:.375rem .75rem;
	font-size: calc(0.9rem + 0.2vw); 
	font-weight:400;
	line-height:1.5;
	color:#111;
	background-color:#fff;
	background-clip:padding-box;
	border:1px solid #afafaf;
	border-radius:.25rem;
	transition:border-color .15s ease-in-out, box-shadow .15s ease-in-out
}
@media (prefers-reduced-motion:reduce) {
.form-control {
	transition:none
}
}
.form-control::-ms-expand {
	background-color:transparent;
	border:0
}
.form-control:-moz-focusring {
	color:transparent;
	/* text-shadow:0 0 0 #111;*/
}
.form-control:focus {
	color:#111;
	background-color:#fff;
	border-color:#afafaf;
	outline:0;
	/* box-shadow:0 0 0 .2rem rgba(0, 123, 255, .25); */
}
.form-control::-webkit-input-placeholder {
	color:#444;
	opacity:1
}
.form-control::-moz-placeholder {
	color:#444;
	opacity:1
}
.form-control:-ms-input-placeholder {
	color:#444;
	opacity:1
}
.form-control::-ms-input-placeholder {
	color:#444;
	opacity:1
}
.form-control::placeholder {
	color:#444;
	opacity:1
}
.form-control:disabled, .form-control[readonly] {
	background-color:#e9ecef;
	opacity:1
}
select.form-control:focus::-ms-value {
	color:#111;
	background-color:#fff
}
 
 
 
 
 
 
 
 
 
/*---------------------
  Search  
-----------------------*/

.search-wrap {   }
.search-wrap input{background:#fff;  }
.search-con {  text-align:center;  font-weight:500 }
.search-text {  font-weight:500 ; color:#444 ; margin-bottom:15px; }
.search-text span{  color:#000  }
.search-count {   font-weight:500;  color:#444 ;margin-bottom:25px;   }
.search-count .keyword{   color:#000; }
.search-count .count{   color:#dd0000; }


.top_search-wrap {	
	border:1px solid #ccc; 
	border-radius:50px; 
	background-color:#fff;
	background:#fff; 
	padding:0;
}

.top_search {   
	display:flex;
	align-items:center;
	justify-content:space-between;
}
.top_search .site-btn {   
	display: inline-block;
	background:transparent;
	border: none; 
	padding: 0; 
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:50px;
	width:48px; height:48px; 
	background:#2d2d2d;
	margin-right:-1px;
}
.top_search .site-btn2 {    
	border-radius:60px;
	width:60px; height:60px;  
}
.top_search .site-btn i{ 
	color: var(--primary);
	font-weight: 800; 
	padding: 2px;
	text-transform: uppercase;
	display: inline-block; 
	border: none;
}
.top_search .input-group-text {
	display:-ms-flexbox;
	display:flex;
	-ms-flex-align:center;
	align-items:center;
	padding:.25rem .75rem;
	padding:0;
	margin-bottom:0;
	font-size:1rem;
	font-weight:400; 
	color:#111; 
	text-align:center;
	white-space:nowrap;
	background-color:#fff; 
	border:transparent;
	border-radius:.25rem;
	border-radius:50px;
}
.top_search .form-control {
	display:inline-block;
	width:100%;
	height:calc(2em + 1rem);
	padding:.75rem 1rem;
	font-size: calc(0.9rem + 0.2vw); 
	font-weight:500; 
	color:#666; 
	background-color:transparent;
	background-clip:padding-box; 
	border:transparent;
	border-radius:50px;
	outline:0;
	background-color:#fff;
	 text-indent:10px;
} 
.top_search .form-control:focus {
	color:#111;
	background-color:transparent;
	background-color:#fff;
	border-color:transparent;
	outline:0;
	box-shadow:0 0 0 .2rem rgba(0, 123, 255, .0)
}
.top_search .form-control::-webkit-input-placeholder {
	color:#444;
	font-weight:500;
	opacity:1
}
.top_search .form-control::-moz-placeholder {
	color:#444;
	font-weight:500;
	opacity:1
}
.top_search .form-control:-ms-input-placeholder {
	color:#444;
	font-weight:500;
	opacity:1
}
.top_search .form-control::-ms-input-placeholder {
	color:#444;
	font-weight:500;
	opacity:1
}
.top_search .form-control::placeholder {
	color:#444;
	font-weight:500;
	opacity:1
}
.top_search .form-control:disabled, .form-control[readonly] {
	background-color:transparent;
	background-color:#fff;
	opacity:1
}
.top_search  select.form-control:focus::-ms-value {
	color:#111;
	background-color:transparent;
	background-color:#fff;
}