@charset "UTF-8";


.main_vi {width:100%; height:100%; display:inline-block  }

#main h2 {width:20%; float:left;  font-size:63px;  margin-top:-60px; font-family: 'SEBANG_Gothic_Bold'; line-height:1.2em; font-weight:800; letter-spacing:-1px;}
#main h2 span {color:#ef1120; font-size:1.3em;  vertical-align:-5px }


@media all and (max-width:1400px){
#main h2 {font-size:50px}
}
#main .arrow   {margin-top:100px}
#main  .arrow span {font-size:15px;  letter-spacing:0.5px; font-weight:500; line-height:30px; color:#999}
#main  .arrow  img {margin-left:5px; margin-top:20px;  -moz-animation: bounce 2s infinite;
  -webkit-animation: bounce 2s infinite;
  animation: bounce 2s infinite;}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
}
img.one { -moz-animation: bounce2 5s infinite;
  -webkit-animation: bounce2 5s infinite;
  animation: bounce2 5s infinite;}

@keyframes bounce2 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-50px);
  }
  100% {
    transform: translateY(0);
  }
}


.main_wrap {width:100%; display:inline-block;   padding:180px 3% 150px 3%; box-sizing:border-box; border-bottom:1px solid #ddd;  }

.main_label {width:100%; height:80px; position:absolute; left:0; top:-85px;  display:inline-block}


/*비즈니스*/

.bn ul {width:75%; float:right;  display:flex ; justify-content:space-between}
.bn ul li {width:31.5%; overflow:hidden; display:inline-block;  position:relative; cursor:pointer; transition:all 0.3s ease-out; top:0; color:#666; font-size:1.08rem; font-weight:300}
.bn ul li:nth-child(2) {margin-top:-50px}
.bn li:hover{top:-15px;}
 

.bn li .img_bg {background:url('/common/img/sub/business1_img1.png') no-repeat center; background-size:cover; width:100%; height:350px; display:inline-block;  transition:all 0.3s ease-out;}
 
.bn li .img_bg2 {background:url('/common/img/sub/business1_img2.png') no-repeat center; background-size:cover; width:100%; height:350px; display:inline-block;   transition:all 0.3s ease-out;}
 
.bn li .img_bg3 {background:url('/common/img/sub/business1_img3.png') no-repeat center; background-size:cover; width:100%; height:350px; display:inline-block;  transition:all 0.3s ease-out;}


 
.bn ul li p {font-weight:800; font-family: 'SEBANG_Gothic_Bold';  font-size:1.75em; padding-top:26px; color:#111; letter-spacing:0.5px; padding-bottom:5px}
.bn ul li span {font-weight:500; color:#333;  font-size:1.4em}


/*키워드*/
.swiper-container {width:75%; float:right}

.business .box {width:100%; }
.business .box .img_bg {background:url('/common/img/main/slide_bg1.png') no-repeat; background-size:cover; width:100%; display:inline-block; height:500px;  }
.business .box div.t_box {width:50%; text-align:left; float:right; background: linear-gradient( to bottom, #ef1120, #ef1120);  border-radius:20px 0; color:#fff; font-size:1.3rem; padding:60px 70px 80px 70px; box-sizing:border-box; margin-top:-170px; position:relative ; margin-right:50px; position:relative  }
.business .box div.t_box b {font-weight:700;  font-size:2.1rem; color:#fff; line-height:1.3em}
.business .box span.w_s_line {width:20px; margin:10px 3px;  height:1px; background-color:#fff; display:inline-block}
 
 a.plus_btn {width:50px; line-height:50px; text-align:center; display:inline-block; position:absolute; right:20px; bottom:20px;  border:2px solid #fff; border-radius:50%; font-size:30px; color:#fff !important;  }


img.one {position:absolute; top:13%; z-index:99999999999999999999; left:23%;}

/*공장*/

.plant {background-color:#f9f9f9}
.plant ul {width:75%; float:right;  display:flex ; justify-content:space-between}
.plant ul li {width:31.5%; display:inline-block;font-weight:700; font-size:1.8em ; position:relative; cursor:pointer; transition:all 0.3s ease-out; top:0;}
.plant ul li:hover{top:-15px;}
.plant ul li img { margin-bottom:20px; border-radius:5px}
.plant ul li a {font-size:18px;  line-height:3em; font-weight:400}

/*고객센터*/

.customer {border-bottom:none; background:url('/common/img/main/customer_bg.png') no-repeat; background-size:cover}
.customer ul {width:75%; float:right;  display:flex ; justify-content:space-between}
 .customer ul li {width:30%; text-align:center;  height:200px; background-color:#fff; display:inline-block; padding-top:70px; box-shadow:2px 2px 8px rgba(0,0,0,.08); border-radius:5px; border-top:2px solid #ef1120}
 .customer ul li b {font-weight:700; letter-spacing:-2px; font-size:1.8em; width:100%; display:inline-block; margin-bottom:15px; }
 .customer ul li span {font-weight:400; font-size:1.4em; }
 
  
.buttons {
  display: flex;
  flex-direction: column;
   justify-content: center;
  text-align: center;
  width: 160px;
}  

  
.btn {
  color: #da1117;
  cursor: pointer;
  font-size: 15px;
  font-weight: 400;
  line-height: 45px;
   letter-spacing:2px;
   position: relative;
  text-decoration: none;
  text-transform: uppercase;
  width: 160px;
}

.btn:hover {
  text-decoration: none; 
}

.btn-1 {
  background: #fff;
  font-weight: 600;
}
.btn-1 svg {
  height: 45px;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.btn-1 rect {
  fill: none;
  stroke:#da1117;  
  stroke-width: 4;
  stroke-dasharray: 422, 0;
  transition: all 0.35s linear;
}

.btn-1   {color:#da1117 !important}
.btn-1:hover {
  
  font-weight: 900;
  letter-spacing: 1px;
}
.btn-1:hover rect {
  stroke-width: 5;
  stroke-dasharray: 15, 310;
  stroke-dashoffset: 48;
  transition: all 1.35s cubic-bezier(0.19, 1, 0.22, 1);
}

 .m_product {background-color:#f9f9f9}

.hexagon_box_main {width:40%; float:right; display:inline-block;  position:relative; padding-bottom:40%; margin-right:16%;  margin-top:-30px; margin-bottom:-30px}
.hexagon_box_main .bg_box  {width:35%;   position:absolute; text-align:center; float:left;  box-sizing:border-box;  background:none;     padding:0 }
.hexagon_box_main .bg_box p {line-height:290px; font-size:2.3rem; font-weight:800;}
.hexagon_box_main .bg_box a {color:red !important}
.hexagon_box_main .bg_box img {width:100%}

@media all and (max-width:1600px){

.hexagon_box_main {margin-right:10%;  width:50%; padding-bottom:50% }
}

@media all and (min-width:1400px){
.hexagon_box_main img[src$=".png"] {
                   image-rendering: -moz-crisp-edges;         /* Firefox */
                   image-rendering:   -o-crisp-edges;         /* Opera */
                   image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
                   image-rendering: crisp-edges;
                  
                 }
}
 
 
.ani  {
	-webkit-animation: scale-up-center 2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both infinite;
	        animation: scale-up-center 2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both infinite;
transform: rotate(.001deg);}

 
 


@-webkit-keyframes scale-up-center {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  30% {
    -webkit-transform: scale(1.15);
            transform: scale(1.15);
  }
  
  60% {
    -webkit-transform: scale(1.15);
            transform: scale(1.15);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }

}
@keyframes scale-up-center {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  30% {
    -webkit-transform: scale(1.15);
            transform: scale(1.15);
  }
  
  60% {
    -webkit-transform: scale(1.15);
            transform: scale(1.15);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }

}
 /*new 키워드*/
.keyword {width:75%; float:right; font-size:0}

 .keyword li {width:48%; display:inline-block;font-size:1.4rem; font-weight:600}
 .keyword li:nth-child(2n) {margin-left:4%}
 .keyword li div.img_bg {width:100%; margin-bottom:20px; display:inline-block; height:250px}
