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

body { overflow:hidden; overflow-y:scroll;}
@media screen and (min-width:911px) {
    #header_wrap {
        height: 730px;
        background: url(../img/main/header_bg.png) center bottom no-repeat #2c9cf2;
        position: relative;
    }
}

@media screen and (max-width:910px) {
    #header_wrap {
        height: 530px;
        background: url(../img/main/header_bg.png) center bottom no-repeat #2c9cf2;
        position: relative;
    }
}
/* 상단 메뉴 에서 쓰이는데 이해 불가... 제길*/
#header_top_nav {
	position: fixed; 
	right: 0px;left: 0px;  
	z-index: 1000; 
	-webkit-transform:translate3d(0,0,0);
	transform:translate3d(0px,0px,0px); 
	-webkit-transition:all 0.3s ease-in-out;
	-o-transion:all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;	
}

.scroll{
		background-color: #fff;
		border-bottom: 1px solid #dfe6ec;
		border-color: rgba(0,0,0,0.1);
		-webkit-transition:all 0.3s ease-in-out;
		-o-transion:all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
}
/*
.header_top { max-width:1140px; width:100%; height:50px; padding:35px 0; margin:0 auto; overflow:hidden;}
.header_top h1 { display:block; float:left; width:159px; height:50px; overflow:hidden; }
.header_top h1 a {display:block;}
.header_top h1 img { display:block; height:35px; }
.header_top h1 a span:nth-child(0) { background-image: url(img/main/logo.png); height:35px;}
.header_top h1 a span:nth-child(1) { display:block; height:15px; line-height:15px; font-size:12px; color:#014ead;}
*/
.header_top { max-width:1140px; width:100%; height:50px; padding:35px 0; margin:0 auto; overflow:hidden;}
.header_top h1 { display:block; float:left; width:159px; height:50px; overflow:hidden; }
.header_top h1 a {display:block;}
.header_top h1 a span:nth-child(1) { display:block; background: url(../img/main/logo.png) no-repeat; width:159px;height:35px; }
.header_top h1 a span:nth-child(2) { display:block; height:15px; line-height:15px; font-size:12px; color:#014ead;}


.header_top .navi { float:right; height:50px; }
.header_top .navi ul li {display:inline-block; padding-right:60px;}
.header_top .navi ul li:nth-child(3) { padding:0; }
.header_top .navi ul li.icon { display: none; padding-right: 0px;}
.header_top .navi ul li a{line-height: 50px; font-size:16px; color:#fff;  }
.header_top .navi ul li.icon  a{ font-size:25px; }
.scroll .header_top .navi ul li a{ color:#666;  }
.scroll .header_top h1 a span:nth-child(1) { display:block; background: url(../img/main/logo_2.png) no-repeat; width:159px;height:35px; }


@media screen and (min-width:911px) {
  .header_title {  max-width:1140px; width:100%; height:230px; padding-top:250px; margin:0 auto; }
  .header_title img { display:block; width:392px; height:80px; margin-bottom:30px;} 
  .header_title span { display:block; max-width:740px; line-height:55px; font-size:28px; color:#fff; font-family:'Noto Sans KR', sans-serif; }
  .header_title p { font-size:1.12rem; color:#fff;  line-height:24px; padding: 20px 0; }
  .header_phone { position:absolute; right:50%; margin-right:-674px; top:175px; width:420px; height:555px; }  
}

@media screen and (max-width:910px) {
  .header_top { max-width:328px; width:100%; height:50px; padding:35px 0; margin:0 auto; overflow:hidden;}

  .header_top .navi ul li {display: none;}
  .header_top .navi ul li.icon {
  display: inline-block;
  }

  .header_phone {display: none;}

  .header_title {  max-width:328px; width:100%; height:230px; padding-top:150px; margin:0 auto; }
  .header_title img { display:block; width:206px; height:46px; margin-bottom:30px;} 
  .header_title span { display:block; max-width:500px; line-height:35px; font-size:24px; color:#fff; font-family:'Noto Sans KR', sans-serif; }
  .header_title p { font-size:0.80rem; color:#fff;  line-height:18px; padding: 20px 0; }

}

@media screen and (min-width:911px) {
  #service_wrap { overflow:hidden; }
  .service { max-width:1140px; width:100%; min-height:300px; margin:0 auto; overflow:hidden;padding-bottom: 160px; }
  .service h2 { display: block; padding: 40px 0 10px 0; font-weight:bold;  font-size: 30px; color: #1d2236; }

  .service_contents { }
  .service_contents li {  min-width:450px; max-width:450px; height:320px; padding-top:60px; }

  .service_contents li .item dt { display:block; text-align:center; margin-bottom:30px;}
  .service_contents li .item dd { display:block; text-align:center; }
  .service_contents li .item dd h3 {display:block; line-height:2.5rem; font-size:1.30rem; font-weight:bold; color:#1d2236; margin-bottom:15px; text-align:center;}
  .service_contents li .item dd .item_txt { line-height:1.62rem; font-size:1.02rem; color:#666; text-align:center;}

  .service_contents li:nth-child(odd) { float:left;  }
  .service_contents li:nth-child(even)  { float:right;  }
}

@media screen and (max-width:910px) {
  #service_wrap { overflow:hidden; }
  .service { max-width:328px; width:100%; min-height:1081px; margin:0 auto; overflow:hidden;padding-bottom: 60px; }
  .service h2 { display: block; padding: 20px 0; font-weight:bold;  font-size: 1.20rem; color: #1d2236; }

  .service_contents li { max-width:328px; height:200px; padding-top:60px; }

  .service_contents li .item dt { display:block; text-align:center; margin-bottom:15px;}

  .service_contents li .item dt img{ width: 59px; height: 59px}

  .service_contents li .item dd { display:block; text-align:center; }
  .service_contents li .item dd h3 {display:block; line-height:22.57px; font-size:1.00rem; font-weight:bold; color:#1d2236; margin-bottom:15px; text-align:center;}
  .service_contents li .item dd .item_txt { line-height:30px; font-size:0.90rem; color:#666; text-align:center;}

  .header_phone {display: none;}
}

/* overflow:hidden 시 이미지 위로 올라감 */
#management_wrap { position:relative; background : #fafafa;overflow:hidden; }


@media screen and (min-width:911px) {
.management { max-width:1140px; width:100%; min-height:330px; margin:0 auto; padding-top: 150px; padding-bottom: 220px;} 

.management_monitor { position:absolute; right:50%; top:210px; width: 1067px; height: 625; margin-right:-1122px;}

.management_contents { max-width: 435px; width: 100%; min-height: 725px;  }
.management_contents h2 { display: block; padding: 0px 0 40px 0; font-weight:bold;  font-size: 30px; color: #1d2236; }
.management_contents ul li h3 {  display: block; padding : 20px 0; }
.management_contents ul li h3 img{ float: left; width: 37px; height: 36px; }
.management_contents ul li h3 span{ float: left;  font-size:1.30rem; font-weight:bold; color: #808c8f; padding-left: 20px; line-height: 33px;}
.management_contents ul li h3:after { content: ""; display: block; clear: both; }
.management_contents ul li p {  line-height:1.62rem; font-size:1.02rem;  color: #808080;  padding : 0 0 20px; }
}

@media screen and (max-width:910px) {
.management { max-width:328px; width:100%; min-height:330px; margin:0 auto; padding-top: 50px; padding-bottom: 50px;} 
.management_monitor { display: none;}
.management_contents { max-width: 435px; width: 100%; min-height: 725px;  }
.management_contents h2 { display: block; padding: 0px 0 40px 0; font-weight:bold;  font-size: 1.20rem; color: #1d2236; }
.management_contents ul li h3 {  display: block; padding : 20px 0; }
.management_contents ul li h3 img{ float: left; width: 28px; height: 27px; }
.management_contents ul li h3 span{ float: left;  font-size: 1.00rem; color: #808c8f; padding-left: 12px; line-height: 27px;}
.management_contents ul li h3:after { content: ""; display: block; clear: both; }
.management_contents ul li p {   font-size:0.90rem; color: #808080; line-height: 24px; padding : 0 0 20px;}  
}

#user_wrap { position:relative; overflow:hidden; }


@media screen and (min-width:911px) {
.user { max-width:1140px; width:100%; min-height:330px; margin:0 auto; padding-bottom: 220px; } 

.user_phone { position:absolute; left:50%; top:210px; width: 579px; height: 653px; margin-left:-780px;}

.user_contents { float: right; }
.user_contents {max-width: 500px; width: 100%; min-height: 725px; padding-top: 150px; }
.user_contents h2 { display: block; padding: 30px 0; font-weight:bold;  font-size: 30px; color: #1d2236; }
.user_contents ul li h3 {  display: block; padding : 20px 0; }
.user_contents ul li h3 img{ float: left; width: 37px; height: 36px; }
.user_contents ul li h3 span{  float: left; font-size:1.30rem; font-weight:bold; color: #808c8f; padding-left: 20px; line-height: 33px;}
.user_contents ul li h3:after { content: ""; display: block; clear: both; }
.user_contents ul li p {   line-height:1.62rem; font-size:1.02rem;  color: #808080; padding : 0 0 20px; }
.user:after { content: ""; display: block; clear: both; }
}

@media screen and (max-width:910px) {
  .user { max-width:328px; width:100%; min-height:130px; margin:0 auto; padding-bottom: 70px; } 
  .user_phone { display: none;}
  .user_contents {max-width: 328px; width: 100%; min-height: 325px; padding-top: 50px; }
  .user_contents h2 { display: block; padding: 30px 0; font-weight:bold;  font-size: 1.20rem; color: #1d2236; }
  .user_contents ul li h3 {  display: block; padding : 20px 0; }
  .user_contents ul li h3 img{ float: left; width: 28px; height: 27px; }
  .user_contents ul li h3 span{  float: left; font-size:1.00rem; color: #808c8f; padding-left: 12px; line-height: 27px;}
  .user_contents ul li h3:after { content: ""; display: block; clear: both; }
  .user_contents ul li p {  font-size:0.90rem; color: #808080; line-height: 24px; padding : 0 0 20px; }
  .user:after { content: ""; display: block; clear: both; }  
}

#customer_wrap { position:relative;  overflow:hidden; background: url(../img/main/bg_custom.png) center bottom no-repeat #fafafa; }

@media screen and (min-width:911px) {
  .customer { max-width:1140px; width:100%; min-height:265px; margin:0 auto; } 
  .customer div {   margin-left:auto; margin-right:auto;}
  .customer div h2{ padding-top: 20px;  font-weight:bold;  font-size: 30px; color: #1d2236; }
  .customer div ul {   margin-left:auto; margin-right:auto;}
  .customer div ul li {float:left; padding: 50px 40px 0 0;}
  .customer div ul li a {display: block;}
}

@media screen and (max-width:910px) {
  .customer { max-width:328px; width:100%; min-height:165px; margin:0 auto; } 
  .customer div {   margin-left:auto; margin-right:auto;}
  .customer div h2{ padding-top: 20px;  font-weight:bold;  font-size: 1.20rem; color: #1d2236; }
  .customer div ul {   margin-left:auto; margin-right:auto;}
  .customer div ul li {float:left; padding: 30px 30px 0 0;}
  .customer div ul li a {display: block;}  

  .customer div ul li a img {width: 118px; height: 56px;}

}


#inquire_wrap { position:relative;  overflow:hidden; background : #2c9cf2; }

@media screen and (min-width:911px) {

.inquire { max-width:1140px; width:100%; min-height:425px; margin:0 auto; } 
.inquire div h2{ padding-top: 20px;  font-weight:bold;  font-size: 30px; color: #fff; }
.inquire div p{ padding: 10px 0;  font-size: 1.02rem; color: #fff; line-height: 24px; }
.inquire:after { content: ""; display: block; clear: both; }

.inquire_contents { padding: 35px 0;  }
.inquire_contents li label { display: block; font-size: 14px; line-height: 24px; color: #fff;padding: 5px 0;  }

.inquire_contents li input[type=text] { border: 0 ; border-bottom: 1px solid #fff; font-size: 30px; line-height: 36px; font-weight: bold; }
.inquire_contents li input[type=text] { outline: none; }
.inquire_contents li:first-child  { float:left;  }
.inquire_contents li:first-child input[type=text] { width:328px; height: 55px;}
.inquire_contents li:last-child  { float:right;  }
.inquire_contents li:last-child input[type=text] { width:635px; height: 55px;}
.inquire_contents:after { content: ""; display: block; clear: both; }
.inquire  div a { display: block; width: 130px; height: 57px; background: transparent;border: 1px solid #fff; font-size: 18px; line-height: 57px; color: #fff; margin-left:auto; margin-right:auto;text-align: center;}
}

@media screen and (max-width:910px) {
.inquire { max-width:328px; width:100%; min-height:425px; margin:0 auto; } 
.inquire div h2{ padding-top: 20px;  font-weight:bold;  font-size: 1.20rem; color: #fff; }
.inquire div p{ padding: 10px 0;  font-size: 0.90rem; color: #fff; line-height: 24px; }
.inquire:after { content: ""; display: block; clear: both; }

.inquire_contents { padding: 35px 0;  }
.inquire_contents li label { display: block; font-size: 11px; line-height: 24px; color: #fff;padding: 5px 0;  }


.inquire_contents li input[type=text] { border: 0 ; border-bottom: 1px solid #fff; font-size: 15px; line-height: 10.13px; font-weight: bold;width:328px;height: 40px;} 
.inquire_contents:after { content: ""; display: block; clear: both; }
.inquire  div a { display: block; width: 73px; height: 33px; background: transparent;border: 1px solid #fff; font-size: 12px; line-height: 33px; color: #fff; margin-left:auto; margin-right:auto;text-align: center;}  
}

#footer_wrap { position:relative;  overflow:hidden;}


@media screen and (min-width:911px) {
  .footer { max-width:1140px; width:100%; min-height:280px; margin:0 auto; } 
  .footer_contents { padding: 90px; margin-left:auto; margin-right:auto;text-align: center;  font-size: 14px; line-height: 36px; color: #808080;}
}
@media screen and (max-width:910px) {
  .footer { max-width:328px; width:100%; min-height:180px; margin:0 auto; } 
  .footer_contents { padding: 30px 0; margin-left:auto; margin-right:auto;text-align: center;  font-size: 11px; line-height: 24px; color: #808080;}
}


/* 네비 메뉴에서 쓰임*/
#overlay {
    position: absolute;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    z-index: 999998;
    display: none;
}

.sidr-open #overlay {
    display: block;
}