@font-face {
    font-family: 'Cafe24Ohsquare';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/Cafe24Ohsquare.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.main_vi_txt {width:100%;position:absolute; bottom:50%;  color:#fff; left:50%;transform:translateX(-50%); text-align:center; }
.main_vi_txt p { font-size:30px; text-shadow:1px 2px 0  rgba(0,0,0,0.1)}
.main_vi_txt span { font-size:45px; font-weight:600; color:#fff;  text-shadow:1px 2px 0 0 rgba(0,0,0,0.1)}
.main_vi_txt .big {font-size:32px;}

.sub_vi_txt {position:absolute; bottom:25%;  color:#fff; text-align:center; left:50%;transform:translateX(-50%);}
.sub_vi_txt span { font-size:33px; font-weight:600; text-shadow:1px 2px 3px  rgba(0,0,0,0.2)}
.sub_vi_txt p { font-size:16px; font-weight:300; margin-top:5px;}


/* 슬라이드  slide_box_wrap */
/*.vi_box_wrap  {position:absolute; bottom:0%;width:1200px; left:19%;}*/
.vi_box_wrap  {position:relative; width:1200px; margin:0 auto;}
.vi_box_wrap ul li {width:23%; float:left; margin-right:2.6%;}
.vi_box_wrap ul li:last-child {float:right; margin:0;}


.box_list {position:absolute; /*overflow:hidden;*/ top:560px; width:1200px; margin:0 auto;}
.box_list li {float:left;}
.box_list li.customer_box {margin-right:0; background:rgba(255,255,255,0.9); box-shadow:1px 2px 0  rgba(0,0,0,0.1); padding:30px; box-sizing:border-box;}
.box_list li.customer_box h3 {text-align:center; font-size:24px; font-weight:600; margin-bottom:15px;}
.box_list li.customer_box p.customer_num {text-align:center; font-size:35px; font-weight:600; line-height:1.2em;}
.box_list li.customer_box p.customer_time {text-align:center; font-size:18px; font-weight:400; line-height:1.3em; margin-top:10px; color:#666}

.box_list li a {display:block; position:Relative; bottom:0; transition: all 0.3s ease-out;}
.box_list li img {}
.box_list li img.box_bg {}

.box_list li .box_tit {font-size:25px; font-weight:600; color:#fff; line-height:100%; letter-spacing:-0.3pt; text-align:center; position:absolute; width:85%; left:7.5%;top:100px; z-index:9999; text-shadow:2px 2px 3px rgba(0,0,0,0.2)}
.box_list li .box_txt {font-size:16px; font-weight:400; color:#fff; opacity:0.9; position:absolute; text-align:center; top:140px; z-index:9999; width:85%; left:7.5%;  text-shadow:2px 2px 3px rgba(0,0,0,0.1) }
.box_list li i {font-size:30px; color:#fff; opacity:0.8; position:absolute; left:45%; bottom:130px; z-index:9999; text-align:center;}

.box_list li a:hover {bottom:25px; transition: all 0.3s ease-out;}

.text_box_sm {font-size:15px; color:#666; line-height:1.4em}
.text_box {font-size:16.5px; color:#555; line-height:1.6em}
.text_box2 {font-size:18px; color:#555;}
.text_box3 {font-size:20px; color:#333;}
.text_box4 {font-size:22px; color:#333;}
.text_box5 {font-size:24px; color:#333;}
.color_wh{color:#fff !important;}
.c {text-align:center;}

.f_400 {font-weight:400 !important}
.f_500 {font-weight:500 !important}


.main_con_wrap  { width:100%; float:left;}
.main_con_wrap h2 {font-size:38px; letter-spacing:0; width:100%; float:left; margin-bottom:50px; text-align:center;}

#section1 {width:100%; float:left; background:#f5f5f5;  padding:5% 0;}
#section1 .section1_wrap {width:1200px; margin:0 auto; }

#section2 {width:100%; float:left;  }
#section2 .section2_wrap {width:100%; margin:0 auto; display:inline-block; padding : 100px 0; background : url('/common/img/main/s2_bg.png') no-repeat top center; text-align:Center;   background-attachment: fixed; }

#section3 {width:100%; float:left;  padding:5% 0;}
#section3 .section3_wrap {width:1200px; margin:0 auto;}


/*  s1_box_left */
#section1 .s1_box_left {width:33.3%; float:left;height:245px;  background:#fff; border:1px solid #ddd; border-right:none; padding:35px 30px; box-sizing:border-box;}


#section1 .divide_ul {}
#section1 .divide_ul li {width:49%; float:Left;  height:350px; margin-right:1%;}
#section1 .divide_ul li:nth-child(2) {width:49%; float:Right; margin-right:0;  margin-top:180px;}
#section1 .divide_ul li:nth-child(3) {width:49%; margin-top:180px;}
#section1 .divide_ul li:nth-child(4) {width:49%; float:Right; margin-right:0; margin-top:180px; }

#section1 .divide_ul .img_container>img  {width:100%; max-height:350px;}
#section1 .divide_ul h3{font-size:30px; font-weight:600;}


#section1 .img_container {
  position: relative;
  width: 100%;
  float:left;
  overflow:hidden;
}

#section1 .img_container .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  transition: background 0.3s ease;
}

#section1 .img_container:hover .overlay {
  display: block;
  background: rgba(0, 0, 0, .3);
}


#section1 .img_container:hover img {transform:scale(1.1); transition:ease-in-out 0.4s}

/*
.img_container img {
  position: absolute;
  width: 100%;
  top:0;
  left: 0;
}
*/

#section1 .title_h2 {
  position: absolute;
  left: 40px;
  top: 50px;
  font-weight: 800;
  font-family: 'Cafe24Ohsquare';
  font-size: 30px;
  text-align: center;
  text-transform: uppercase;
  color: white;
  z-index: 1;
  letter-spacing:1px;
  transition: top .5s ease;
  text-shadow:1px 1px 3px rgba(0,0,0,0.1)
}

#section1 .title_p {
  position: absolute;
  left: 40px;
  top: 90px;
  font-weight: 400;
  font-size: 20px;
  text-align: center;
  letter-spacing:0;
  color: #fff;
  opacity:0.8;
  z-index: 1;
  transition: top .3s ease;
}



#section1 .img_container:hover .title {
  top: 90px;
}

#section1 .button {
  position: absolute;
  right:40px;
  top: 250px;
  text-align: center;
  opacity: 0;
  transition: opacity .3s ease;
}

#section1 .button a {
  padding: 10px 35px;
  width:220px;
  text-align: left;
  color: #fff;
  font-weight:500;
  border: solid 1px white;
  z-index: 1;
}

#section1 .button a:hover {
  background:rgba(255,255,255,0.55);
  transition: 0.25s ease-in-out;
}




#section1 .img_container:hover .button {
  opacity: 1;
}
/*
#section1 .button a:hover {
  padding: 10px 0;
  text-align: center;
  color: #333;
  transition:0.2s ease-in;
  background:#fff;
  font-weight:500;
  border: solid 1px white;
  z-index: 1;
}
*/

/*  s1_box_right  */
#section1 .s1_box_right {width:33.3%; float:right; height:245px;  border:1px solid #ddd; background:#b0060a;  padding:35px 30px 21px 30px; box-sizing:border-box;}

#section1 .s1_box_right .sp_1 {font-size:26px;  font-weight:800; color:#2870e8; letter-spacing:0.5px; padding:0; float:right;}
#section1 .s1_box_right .sp_2 {font-size:22px;  font-weight:500; color:#333; letter-spacing:0px}

#section1 .s1_box_right p.p_tit {color:#666; font-size:17px; font-weight:400;  line-height:40px; display:inline-block}
#section1 .s1_box_right p.p_text {color:#888; font-weight:300; margin-top:10px;}

#section1 .s1_box_right_bt {width:100%; float:left; border:1.5px solid rgba(255,255,255,0.5); padding:12px 20px; box-sizing:border-box; margin-top:6px; color:#fff; box-shadow:1px 2px 2px rgba(0,0,0,0.1	)}

.sub_con .text_box_bg {background:#f9f9f9; text-align:center; padding:20px 0;}



/* section2 */
#section2 .section2_wrap h3 {font-size:30px; color:#fff;	 text-shadow:1px 2px 3px rgba(0,0,0,0.1)}
#section2 .section2_wrap p {font-size:20px; color:#fff;	}

.sns-icons {width:100%; float:left; margin:15px 0; }
.sns-icons ul li {float:left; text-align:center; margin-right:8px;}
.sns-icons ul li a {display:block; margin:0 auto;  width:45px;	height:45px; border-radius:100px;}
.sns-icons ul li i {font-size:20px; margin-top:12px; color:#fff;}

.sns-icons a:hover {box-shadow:3px 5px 10px rgba(0,0,0,0.35); transition:0.2s ease-in; opacity:0.85}

.sns-icon-facebook {background:#3B5998}
.sns-icon-linkedin {background:#007bb6}
.sns-icon-instagram {background:#d32d84}
.sns-icon-twitter {background:#55ACEE}
.nbsp_span {margin:0 5px}