@charset "utf-8";
/*font*/
@import url('https://fonts.googleapis.com/css?family=Noto+Sans|Noto+Serif');

/* reset */
*{ outline: none !important; text-decoration:none !important;  }
html{ overflow-x: hidden;}
html,body{margin:0px;padding:0px;width:100%;font-size:16px; font-family: 'Noto Sans', sans-serif !important; color:#000;   -webkit-text-size-adjust:none; letter-spacing:0px;}
ul,ol,li,dl,dd,dt,input,h1,h2,h3,h4,h5,h6,p,b,input,button,textarea,fieldset,legend,td,th{ margin:0px; padding:0px; font-weight:normal;}
li{list-style:none}
div{box-sizing:border-box;}
fieldset,img,a{border:0px}
a{text-decoration:none; }
a:hover{text-decoration:none !important;}
legend,.blind{position:absolute; top:0; left:-10000px; width:0; height:0; overflow:hidden; font-size:0; line-height:0}
caption{display:none}
button,label{cursor:pointer}
label{vertical-align:-1px}
button{overflow:visible\9}	/* button fix for ie8 */
table{width:100%;border-collapse:collapse;border-spacing:0;text-align:left}
input::-webkit-input-placeholder{color:#666}
input::-moz-placeholder{color:#666}
input:-moz-placeholder{color:#666}
input:-ms-input-placeholder{color:#666}
textarea::-webkit-input-placeholder{color:#666}
textarea::-moz-placeholder{color:#666}
textarea:-moz-placeholder{color:#666}
textarea:-ms-input-placeholder{color:#666}
input:focus::-webkit-input-placeholder{color:transparent!important}
input:focus::-moz-placeholder{color:transparent!important}
input:focus:-moz-placeholder{color:transparent!important}
input:focus:-ms-input-placeholder{color:transparent!important}
textarea:focus::-webkit-input-placeholder{color:transparent!important}
textarea:focus::-moz-placeholder{color:transparent!important}
textarea:focus:-moz-placeholder{color:transparent!important}
textarea:focus:-ms-input-placeholder{color:transparent!important}

.clear_wrap:before,.clear_wrap:after{content:" ";display:table}
.clear_wrap:after{clear:both}
.clear_wrap{*zoom:1}
.clear_ine{clear:both}
#skip_menu{position:fixed;left:0;top:0;z-index:10000}
#skip_menu a{position:absolute;left:-10000px;top:0;font-size:12px;color:#fff;background:#000;white-space:nowrap}
#skip_menu .focus,#skip_menu a:focus{left:0;padding:5px 10px;height:auto;font-size:12px}


/*드래그 색*/
::selection { background:#448aae; color: #FFF; text-shadow: none; }
::-moz-selection { background:#448aae; color: #FFF; text-shadow: none; }
::-webkit-selection { background:#448aae; color: #FFF; text-shadow: none;  }




/* content */
.content_wrap{ color:#fff; font-size: 22px;}
.content_wrap span{font-size: 16px; }

.main_text{ position: absolute;left: 50%; top: 50%; width: 100%; text-align: center; margin-top:-235px; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); }
.main_text .logo img{width: 120px; margin: 0 auto !important;
  bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
.main_text .title{font-family: 'Noto Sans', sans-serif; font-size: 55px; line-height: 64px; font-weight: bold; letter-spacing: 1.5px; width: 100%; margin-top: 40px;
  bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
.main_text .sub{font-family: 'Noto Sans', sans-serif; font-size: 24px; font-weight: 500; letter-spacing: 0; margin-top:10px; width: 100%; line-height: 35px; margin-top: 40px;
  bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}

@media (max-width: 767px), (max-height: 640px){
  .main_text{margin-top:-165px; }
  .main_text .logo img{width: 50px; margin: 0 auto !important;
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
  .main_text .title{font-family: 'Noto Sans', sans-serif; font-size: 24px !important; line-height: 26px; font-weight: bold; letter-spacing: 1.5px; width: 100%; margin-top: 15px;
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
  .main_text .sub{font-family: 'Noto Sans', sans-serif; font-size: 16px !important; font-weight: 500; letter-spacing: 0; margin-top:10px; width: 100%; line-height: 22px; margin-top: 10px;
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
}




@media (max-width: 567px), (max-height: 567px) {
  .main_text{margin-top:-135px; }
  .main_text .logo img{width: 60px; margin: 0 auto !important;
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
  .main_text .title{font-family: 'Noto Sans', sans-serif; font-size: 22px !important; line-height: 26px; font-weight: bold !important; letter-spacing: -1px; width: 100%; margin-top: 15px;
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
  .main_text .sub{font-family: 'Noto Sans', sans-serif; font-size: 16px !important; font-weight: 500; letter-spacing: 0; margin-top:10px; width: 100%; line-height: 22px; margin-top: 10px;
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
}




/* select_box */
div#select_box { position: relative; width: 140px; height: 35px; background: url(../img/select_arrow.png) 110px center no-repeat; /* 화살표 이미지 */
  border: 1px solid #bcbcbc; bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
div#select_box label { position: absolute; font-size: 12px; color: #bcbcbc; top: 5px; left: 12px; letter-spacing: 1px;
  bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
div#select_box select#color {width: 100%; height: 40px; min-height: 40px; line-height: 40px; padding: 0 10px; opacity: 0; filter: alpha(opacity=0); /* IE 8 */}

@media (max-width: 768px) {
  div#select_box {width: 120px; height: 30px; background: url(../img/select_arrow.png) 90px center no-repeat; /* 화살표 이미지 */
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
  div#select_box label {font-size: 10px; top: 2px; left: 10px;
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
  .hide_m{ display: none !important; }
}





/* 서브페이지 */

.bg_img{width: 100%; height: 320px; text-align: center; color: #fff}
.bg_img.bg_01{ background: url(../img/bg_01.png) no-repeat center/cover; }
.bg_img.bg_02{ background: url(../img/bg_02.png) no-repeat center/cover; }
.bg_img.bg_03{ background: url(../img/bg_03.png) no-repeat center/cover; }
.bg_img.bg_04{ background: url(../img/bg_04.png) no-repeat center/cover; }
.bg_img.bg_05{ background: url(../img/bg_05.png) no-repeat center/cover; }


.sub_text .title { clear: both; font-size: 30px; padding-top:70px; padding-bottom: 5px;  font-weight: bold; display: block; text-align: center !important; }
.sub_text .sub{font-size: 20px; font-weight: 500; padding: 0 15px;}


@media (min-width: 2200px) {
.sub_text .title { clear: both; font-size: 30px; padding-top:15px; padding-bottom: 15px;  font-weight: bold; display: block; text-align: center !important; }
}

@media (max-width: 767px) {
.bg_img{margin-top: -80px;}
.sub_text .title{ font-size: 24px; padding-top:70px; padding-bottom: 0px;  font-weight: bold; display: block;  text-align: center !important;}
.sub_text .sub{font-size: 16px; font-weight: 500;}
}

@media (max-width: 567px) {
.sub_text{ padding-top: 40px !important;  text-align: center !important;}
.bg_img{width: 100%; height: 260px; text-align: center; color: #fff}

.sub_text .title{ font-size: 24px; padding-top:30px; padding-bottom: 0px;  font-weight: bold; display: block;  text-align: center !important;}
.title_text .title{ font-size: 18px !important; text-align: center; color: #444444; margin-bottom: 15px; }
.title_text .sub{ font-size: 14px !important; text-align: center; color: #888; }
}


/* 서브페이지 common */
.site_tree{ margin: 40px 0; color: #6b6b6b; font-size: 12px; }

/*popup*/
.modal-content{  border: 0;  border-radius:0 !important; padding: 0 !important ;}
.modal-body{ padding: 0 !important}
.modal-header{ border-bottom: 0 !important; padding: 25px !important; }
.modal-content img{ width: 100%;}
.popup{ padding: 15px;}
button.close{ margin-top: -30px !important;}
.close img{ width: 30px; margin-top: -10px !important;}

@media (max-width: 768px) {
.modal-content{ margin-top: 80px;}
}
/*.site_tree span:before{content:'2'; }*/
.site_tree span::after{content: ''; padding:0 20px; }
.site_tree span:first-child::after{content: url(../img/site_tree_icon.png);}
.site_tree span:last-child::after{content: none; }

.title_text { border-bottom: 0px solid #bababa; padding-bottom: 20px;
  /*margin-bottom: 30px;*/
}
.title_text div{ text-align: center; clear: both; }
.title_text .title{ font-size: 24px; text-align: center; color: #444444; margin-bottom: 15px; }
.title_text .sub{ font-size: 18px; text-align: center; color: #888; }

.nopadding{padding-right:0 !important; padding-left: 0 !important;}

/* about us */
.about_us_wrap{-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out;
-o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
.about_us_wrap img, .center_about_us_wrap img{ width: 100%;}
.about_us_wrap > div {margin: 30px 0;}

.about_us_center_text{ margin: 20px 0 20px 10px; color: #888888; font-size: 12px;  }


.paper_wrap img{ text-align: center; width: 80%; max-width: 150px; box-shadow: 5px 5px 10px #dfdfdf}
.paper_wrap > div > div{ margin: 20px 0;}
.center_about_us_wrap{ padding: 40px 0; background: #f5f5f5; margin: 60px 0; }

@media (max-width: 767px) {
.center_about_us_wrap .first_box { margin-bottom: 40px; }
}

.font_title_01{ font-size: 18px; font-weight: bold; margin: 20px 0 10px 0; color: #676767;}
.font_sub_01{ font-size: 13px; color: #79838e;   }

.font_title_02{ font-size: 16px; font-weight: bold; margin: 20px 0 40px 0; color: #676767;}

.paper_1{margin-left: 13% !important;}
@media (max-width: 767px) {
.paper_1{margin-left: -5% !important;}

.about_us_wrap{-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out;}
.paper_wrap img{  max-width: 220px; }
.about_us_wrap > div:first-child {margin-top: 0;}

}
/*}product*/
.product_list{ padding: 0 45px; margin-bottom: 80px;}

.product_list > div {box-shadow: 5px 5px 10px #dfdfdf; padding-bottom: 5px;}
.product_list a{color: inherit;}
.product_list a:hover{color:#448aae}

.product_list .icon_plus{margin-bottom: 25px !important; margin-top: -10px; height: 50px; display: block; }
.product_list .icon_plus img{ width: 25px; margin-top: 15px;}
.product_list p{margin-top: 45px; color: #676767;}
.product_list h4{margin-top: 55px; font-size: 24px; font-weight: bold; color: #3b3b3b; font-weight: 500;}
.product_list h5{margin-top: 0px; padding: 0 15px 15px 15px; font-size: 13px; line-height: 20px; color: #79838e; font-weight: 500;}

.product_list p:hover, .product_list h4:hover, .product_list h5:hover{color:#448aae}

.modal-body  p{margin-top: 20px; color: #676767;}
.modal-body h4{margin-top: 10px; font-size: 34px !important; font-weight: bold; color: #3b3b3b; font-weight: 500;}
.modal-body h5{margin-top: 0px; padding: 0 15px 15px 0; font-size: 13px; line-height: 20px; color: #79838e; font-weight: 500;}

.product_info h4 { margin-top: 35px; }

@media (max-width: 767px) {
.product_list{ padding: 0px; margin-bottom: 80px;}
.ma_b{ margin-bottom: 60px;}
}

/* technology */
.technology{ width: 100%; text-align: center; position: relative;}
.technology_arrow{ position: absolute; right: -20%; top: 55%; margin-top: -20px; width: 15px !important;}
.technology_arrow img{ width: 15px !important; padding: 0 !important; }
.technology_arrow.after{ position: absolute; left: -20% !important; top: 55% !important; margin-top: -20px !important; width: 15px !important;}


@media (min-width: 990px) {
  .technology_arrow{ right: -15% !important;
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
}

@media (max-width: 990px) {
  .technology_arrow{ right: -20%;
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
}
@media (max-width: 767px) {
  .technology_arrow{display: none !important;
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
}


.technology img{ width: 100%;padding: 0 20px;
  bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;
}
.technology_wrap{ text-align: center;}
.technology_wrap > div{ position: relative;}

.font_title_03:first-child{margin-top:0 !important; }
.font_title_03{ font-size: 18px; text-align: center; margin: 60px; color: #676767; font-weight: bold; }

.font_title_04{ font-size: 16px; margin: 20px 0 10px 0; color: #676767; margin:20px;}
.font_sub_04{ font-size: 14px; color: #79838e; margin-bottom: 40px;}

.technology_wrap_last{margin-left: 33%; }

@media (max-width: 767px) {
  .font_title_03{ margin: 40px !important; }
  .technology img{ width: 80%; padding: 0 20px;
    bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
  .technology_wrap_last{margin-left: 0% !important;}
}

.technology_wrap_2{ width: 100%; text-align: center;}
.font_title_05{ font-size: 18px; font-weight: bold; margin: 20px 0 10px 0; color: #676767; margin:20px;}

.technology_wrap_2 > div{ width: 20%; float: left;}
.technology_wrap_2 img{ width: 100%; padding: 0 5px; }

@media (max-width: 767px) {
  .technology_wrap_2 > div::before{ content: url(../img/technology_icon_arrow_2.png); position: absolute; left: 50%; margin-left: -24px; z-index: 10000; bottom:150px;  bottom: -25px; }
    
  .technology_wrap_2 > div:last-child::before{ content: ''}
  .technology_wrap_2 > div{ width: 100%; margin-bottom: 40px; }
  .technology_wrap_2 img{ width: 80%; padding: 0 20px; }

  .last_con::before{ content: url(../img/technology_icon_arrow_2.png) !important; position: absolute; left: 50%; margin-left: -24px; z-index: 10000; bottom:150px;  bottom: -25px; }
  }


/**/

.technology_wrap_3{ width: 100%; text-align: center;}
.technology_wrap_3 > div{ width: 25%; float: left;}
.technology_wrap_3 img{ width: 100%; padding: 0 10px; }


@media (max-width: 767px) {
  .technology_wrap_3 > div{ width: 100%; margin-bottom: 40px; }
  .technology_wrap_3 img{ width: 80%; padding: 0 20px; }

}


/**/

.map_wrap iframe{ width: 100%; margin-bottom: 60px; height: 450px;}

@media (max-width: 767px) {
.map_wrap iframe{ width: 100%; margin-bottom: 60px; height: 300px;}

}

/* service */
.service_wrap{color:#79838e; font-weight: 200; height: 800px; overflow-y: scroll; border: 1px solid #818482; padding: 80px 60px !important; }
.service_wrap span{color: #458bae; font-weight: 400;}
.service_wrap .black_color{ color: #444444;}


@media (max-width: 767px) {
.service_wrap{padding: 40px 30px !important; }
}
@media (max-width: 567px) {
.service_wrap{padding: 20px 15px !important; }
}



/*send_mali*/
.send_mali_wrap{color: #444444; margin-top: -35px }
.send_mali_wrap div{margin-bottom: 12px; line-height: 45px; font-size: 18px}
.send_mali_wrap span{color: #458bae;}
.send_mali_wrap input{border: 1px solid #bdbebd; width: 100%; height: 50px; }
.send_mali_wrap textarea{border: 1px solid #bdbebd; resize: none; width: 100%; height: 135px; overflow-y: scroll; line-height: 25px; }
.send_mali_wrap .explain{ color: #9c9c9c; line-height: 24px; font-size: 16px; margin-top:-30px !important;   }
.em_2{height: 50px !important; line-height: 50px !important;  }
.e_m input{height: 50px !important; line-height: 50px !important; }
.email_form input{ height: 50px !important; line-height: 50px !important; }
.email_select input{ height: 50px !important; line-height: 50px !important; }

div#select_box input{ height: 50px !important; line-height: 50px !important; }
div#select_box .email_select input{ height: 50px !important; line-height: 50px !important; }

div#select_box.email { position: relative; height: 50px; background: url(../img/select_arrow_2.png) center no-repeat !important; /* 화살표 이미지 */
  background: #fbfbfb; color:#9c9c9c !important;
  border: 1px solid #bcbcbc; bkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
.em_2{ position: relative; height: 50px; background: url(../img/select_arrow_2.png) right no-repeat !important; /* 화살표 이미지 */  background-color: #fbfbfb !important;}
div#select_box.email label{line-height: 40px !important; }
.email_be::before{content: '@'; position: absolute; right: -6px; color:#bcbcbc !important;  }

.email_form{ height: 50px !important; line-height: 45px !important; }
.email_form label{ line-height: 45px !important; }
.em_2 label{  line-height: 40px !important;}
.e_m#select_box{ height: 50px !important; }

@media (max-width: 767px) {
  .send_mali_wrap div{margin-bottom: 12px; line-height: 45px; font-size: 16px}
  .email{ clear: both; margin-right: 15px;  }
  .xs_r{ float: right !important; clear: both; }
  .email_form{ float: right !important; }
  div#select_box.email {  padding: 0 15px; float: right !important; width: 100%; }
  div#select_box{ height: 50px !important; }
  div#select_box label{ line-height: 45px !important; }
  div#select_box{ width: 100%; }
}

.map_info_wrap{ background: #f5f5f5; padding: 35px 20px; margin-top: -66px; margin-bottom: 60px !important; width: 100%; display: inline-block; }
.map_info_wrap > div:first-child{ width: 22%; margin-right: 5%; }
.map_info_wrap > div:nth-child(2){ width: 43%; }
.map_info_wrap > div:nth-child(3){ width: 25%; margin-left: 5%; }

.map_info_wrap > div:first-child{ border-right: 0px solid #e1e1e1;}
.map_info_wrap div:first-child img{ width: 100%; padding-right: 40px; }
.map_info_wrap div{ float: left; color: #888888; font-size: 14px !important; }

.map_text{ line-height: 35px; font-size: 16px !important; }
.map_title{ width: 80px !important; line-height: 35px; }


@media (max-width: 991px) {
.map_info_wrap > div:first-child{ border-right: 0px solid #e1e1e1; margin-right: 2%;}

.map_info_wrap div:first-child{ width: 100%; margin-left: 0; }
.map_info_wrap div:nth-child(2){ width: 100%; margin-left: 0; }
.map_info_wrap div:nth-child(3){ width: 100%; margin-left: 0; }

.map_info_wrap div:first-child{ width: 100%; text-align: left ; }
.map_info_wrap div:first-child img{ width: 80%; padding: 0; margin-bottom: 20px; }
.map_info_wrap div{ width: 100%; color: #888888; }
.map_title{ width: 100px !important; clear: both !important; }
}
@media (max-width: 767px) {
  .email input{ width: 100% !important}
  .map_info_wrap div:first-child{ width: 100%; text-align: left ; }
  .map_info_wrap div:first-child img{ width: 80%; padding: 0; margin-bottom: 20px; }
  .map_info_wrap div{ width: 100%; color: #888888; font-size: 14px !important;}
  .map_info_wrap .map_title{  line-height: 30px; clear: both; }

}
.facility{ margin-bottom: 60px;}

@media (max-width: 767px) {
.facility{ margin-bottom: 0px;}
}


.main_bg_03{background-image: url('../img/main_slider_04.png') !important; background-position: right center !important;}
@media (max-width: 767px) {
.main_bg_03{background-image: url('../img/main_slider_04_2.png') !important; background-position: bottom center !important;}
}