@charset "utf-8";
.section-inner .cont_center {
  width:1200px;
  margin:0 auto;
}
@media screen and (max-width:1200px) {
  .section-inner .cont_center {width:100%;}
}
/*main slide layout*/
html,  body {height: 100%; overflow:hidden;}
.XSwitchBody {overflow:auto;}
#container,  .sections,  .section {position: relative;height: 100%;}
.section {background-color: #000;background-size: cover;background-position: 50% 50%;}
.pages {position: fixed;right: 20px;top: calc(50% - 70px);list-style: none;}
.pages li {width: 8px;height: 8px;border-radius: 50%;background: #fff;margin: 18px 0 18px 7px;box-sizing:content-box;}
.pages li.active {margin-left: 0;width: 14px;height: 14px;border: 4px solid #FFFFFF;background: none;}
ul.pages li {position:relative;text-shadow: 0 0 5px rgba(0,0,0,.4);cursor:pointer;}
ul.pages li:before {font-size:14px;color:rgba(255,255,255,1);position:absolute;left:-130px;top:0;line-height:0.5;width:100px;text-align:right;}
ul.pages li.active:before {font-size:17px;color:rgba(255,255,255,1);}
ul.pages li:first-child:before {content:'COMPANY'}
ul.pages li:nth-child(2):before {content:'PRODUCTS'}
ul.pages li:nth-child(3):before {content:'BUSINESS'}
ul.pages li:nth-child(4):before {content:'CONTACTUS'}
.section:before {content:'';display:inline-block;position:absolute;background:rgba(255,255,255,.2);width:1px; height:100%;right:30px;z-index:1;}
#section1:before {background:rgba(162,162,162,.6)}

@media screen and (max-width:1200px) {
  ul.pages li:before,.section:before {display:none;}
}

.section-inner {height:100%;}
#section0 { background:#000;position:relative;}
/* #section1 {  } */
#section1 { 
  background-color:#cfd2d8;
  background-image:url('/images/section1_back.png'); 
  background-repeat:no-repeat;
  background-position:center center;
}
#section2 { background:#000; }
#section3 { background-image:url('/images/section3_back.png'); }

/*main-owl-carousel*/
.main-owl {height:100% !important;}

/*section0*/
#section0 .section-inner {height:100%;}
#section0 .section-inner .section1_txt {position:absolute;top:50%;margin-top:-110px;width:100%;text-align:center;padding:0 20px}
#section0 h1 {
  position: relative;
  color: #fff;
  font-size: 22px;
  text-align: center;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -1px;
  text-shadow: 0 0 10px rgba(0,0,0,.6);
}

/* #section0 h1:after {content:'';display:inline-block;left:50%;top: 190px;width:28px;height:28px;background:url('../images/point1.png') no-repeat;position:absolute;left:calc(50% - 11px);} */
#section0 h2 {
  position: relative;
  color: #fff;
  font-size: 14px;
  text-align: center;
  font-weight: 400;
  margin-top: 40px;
  line-height: 1.8;
  text-shadow: 0 0 5px rgba(0,0,0,.6);
  word-break: keep-all;
}
.go_btn {display:inline-block;padding: 15px 30px;border-radius: 40px;font-size: 16px;font-weight:400;color:#fff;border:2px solid #fff;margin-top:50px;transition:all .4s ease-in-out;}
.go_btn:hover{background:#fff;border:1px solid #fff !important;color:#333 !important;}
.main_visual_slide {z-index:0 !important;}
.gallery-cell {background-size:cover;}
.main_visual_img1 {background-image:url(../images/main1.png); background-position:center center;}
.main_visual_img2 {background-image:url(../images/main2.png); background-position:center center;}
.main_visual_img3 {background-image:url(../images/main3.png); background-position:center center;}
.owl-stage,.owl-carousel.owl-loaded,.owl-stage-outer,.owl-stage,.owl-item,.gallery-cell,.slide_wrap {height:100%;}
/* @media screen and (max-width: 767px){
  #section0 .section-inner .section1_txt {margin-top: -120px;}
  #section0 h1 {font-size:22px;}
  #section0 h1:after {top:85px;background-size:60%;}
  .go_btn {padding: 15px 30px;font-size: 16px;}
  #section0 .section-inner .section1_txt {left:0;padding:0 20px;}
} */

@media screen and (min-width:768px) {
  #section0 h1 {font-size:40px}
  #section0 h2 {font-size:18px}
}
@media screen and (min-width:1366px) {
  #section0 h1 {font-size:80px}
  #section0 h2 {font-size:22px}
  .go_btn {padding:20px 50px;font-size:20px;}
  #section0 .section-inner .section1_txt {margin-top:-210px}
}
/*section1*/
#section1 .section-inner .section1_txt {position: absolute;top: 50%;margin-top: -165px;width: 100%;padding:0 20px;text-align: left;}
#section1 h1 {
  color: #000;
  font-size: 25px;
  text-align: left;
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: -2px;
}
#section1 h2 {position: relative;z-index:1;width:380px;color: #000;font-size: 16px;text-align: left;font-weight: 500;word-break: keep-all;letter-spacing:-1px;line-height: 1.5;}
#section1 .go_btn {
  color: #000;
  border: 2px solid #000;
  margin-top: 10px;
  font-weight: 500;
  /* float:left; */
}
#section1 .business-area-box {position:relative;float:left;margin-bottom:1px;width:25%;height:60px;width:100%; margin-right:20px;}
#section1 .business-area-box:last-child {margin-right:0;}
#section1 .business-area-box:before {content: '';position: absolute;width: 100%;height: 100%;left: 0;top: 0;transition:background .4s ease-in-out;}
#section1 .business_img {position:absolute;right:0;top:80px;}
.business-box1:before {content:'';display:inline-block;position:absolute;left:0;width:100%;height:100%;background:#1f2d4a;opacity:.8}
.business-box2:before {content:'';display:inline-block;position:absolute;left:0;width:100%;height:100%;opacity:.8;background:#273044;}
.business-box3:before {content:'';display:inline-block;position:absolute;left:0;width:100%;height:100%;opacity:.8;background:#5d3134}
.business-box4:before {content:'';display:inline-block;position:absolute;left:0;width:100%;height:100%;opacity:.8;background:#58610f;}
.business-box1 {background-image:url('../images/business1.png');position:relative;background-size:cover;background-position:center;}
.business-box2 {background-image:url('../images/business2.png');position:relative;background-size:cover;background-position:center;}
.business-box3 {background-image:url('../images/business3.png');position:relative;background-size:cover;background-position:center;}
.business-box4 {background-image:url('../images/business4.png');position:relative;background-size:cover;background-position:center;}
#section1 .business-area-box:hover:before {background: rgba(0,0,0,.2);}
.business-wrap {/*float:left;*/width: 100%;height: 250px;margin-top:28px;}
.business-wrap:after {clear:both;content:'';display:block;}
#section1 .business-area-box dl {width: 100%;position: absolute;text-align:center;cursor: pointer;height: 100%;margin:0;padding-top:4px;}
#section1 .business-area-box dt {color:#fff;text-align:center;font-size:19px;font-weight:500;margin-top:14px}
#section1 .business-area-box dd {display:none;color:#fff;text-align:center;font-size:18px;line-height:1.4;margin-top:20px;font-weight:100;}



@media screen and (min-width:768px) {
  #section1 .business-area-box {width:47%;height:200px;margin-bottom:0;margin-right:0px;margin-bottom:1px;margin-right: 1px;}
  #section1 .business-area-box dd {display:inline-block;}
  #section1 .business-area-box dl {border:none;width:90%;height:86%;margin:5%;padding-top:0;}
  #section1 .business-area-box dt {color:#fff;text-align:center;font-size:30px;font-weight:500;margin-top:35px}
  #section1 .section-inner .section1_txt {margin-top:-250px;}
  #section1 h1 {font-size:40px;}
  #section1 h2 {font-size:20px;}
}
@media screen and (min-width:1366px) {
  #section1 h1 {font-size:70px;}
  #section1 .section-inner .section1_txt {width:1200px;margin-top:-250px;}
  #section1 h2 {font-size:22px}
  #section1 .go_btn {margin-top:30px;}
  .business-wrap {margin-top:90px;width:1200px;}
  #section1 .business-area-box {width:calc(25% - 15px);height:250px;margin-bottom:0;}
  #section1 .business-area-box dt {margin-top:70px}
}

/*section2*/
.products-wrap {display: block;width: 100%;height: 100%;}
.products-wrap li {position:relative;width:50%;height:100%;float:left;}
.products1-img,.products2-img,.products3-img {position:absolute;top:0;width:100%;height:100%;background-size:cover;opacity:.6;transition:opacity .4s ease-in-out;border-left: 1px solid rgba(255,255,255,.6);
}
.products1-img {border-left:none;}
.products1-img {background:url('../images/products-bg1.png') no-repeat;background-size:cover;background-position:center center}
.products2-img {background:url('../images/products-bg2.png') no-repeat;background-size:cover;}
.products3-img {background:url('../images/products-bg3.png') no-repeat;background-size:cover;}
.products1:hover .products1-img,.products2:hover .products2-img,.products3:hover .products3-img{opacity:1;}

#section2 .section-inner {display:inline-block;color:#fff;}
#section2 .product-txt-wrap {width:100%;text-align: center;margin-top: -90px;height: 450PX;margin-bottom: 50px;position: absolute;top: 50%;}
#section2 .product-txt-wrap h1 {line-height:1;display: inline-block;position:relative;width:100%;font-size: 25px;font-weight:500;}
#section2 .product-txt-wrap h1:before {content:'';display:inline-block;width:28px;height:28px;background:url('../images/point1.png') no-repeat;position:absolute;left:calc(50% - 11px);top:45px;}
#section2 .product-txt-wrap h2 {word-break: keep-all;letter-spacing:1px;display: block;width:100%;font-size: 15px;font-weight: 400;margin-top:60px;height:42px}

@media screen and (min-width:768px) {
  #section2 .product-txt-wrap h1 {font-size:40px;}
  #section2 .product-txt-wrap h2 {font-size:20px;}
  #section2 .product-txt-wrap h1:before {top:60px}
}
@media screen and (min-width:1366px) {
  #section2 .product-txt-wrap h1 {font-size:60px;}
  #section2 .product-txt-wrap {margin-top:-150px;}
  #section2 .product-txt-wrap h1:before {top:82px}
  #section2 .product-txt-wrap h2 {font-size:22px}
}
/*section3*/
#section3 .section-inner{/*background-image: url('../images/main3.png');*/height:100%;background-repeat: no-repeat;background-size: cover;background-position: center center;}
#section3 .section-inner .section1_txt {position: absolute;width:1200px;padding:0 20px;top: 50%;margin-top: -176px;text-align: center;}
#section3 h1 {
  transition: all .5s;
  display: block;
  color: #fff;
  font-size: 25px;
  text-align: left;
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: -1px;
}
#section3 h2 {
  position: relative;
  z-index: 1;
  width: 380px;
  color: #fff;
  font-size: 16px;
  text-align: left;
  font-weight: 500;
  letter-spacing: -1px;
  line-height: 1.5;
}
#section3 ul.contact {margin-top:20px;}
#section3 ul.contact:after {clear:both;display:block;content:'';}
#section3 ul.contact div span:not(.num) {display:none}
#section3 ul.contact li {float:left;background-color: #fff;display: inline-block;width: 100%;margin-right: 20px;margin-top: 1px;height: 60px;}
#section3 ul.contact li:nth-child(even) {margin-right: 0;}
#section3 ul.contact li a {width:100%;display: block;padding:22px;height: 100%;box-shadow: 0 1px 1px #e3e3e3;text-align: left;position: relative;}
#section3 ul.contact li a:after {content: '';display: none;right: -5px;top: 10px;width: 28px;height: 28px;background: url(../images/point2.png) no-repeat;background-size: 50%;position: absolute;}
#section3 ul.contact li a strong{font-size: 18px;display: inline-block;line-height: 1;color: #000;position: relative;font-weight:500;}
#section3 ul.contact li a div  {float: right;text-align: right;display: block;position: relative;}
#section3 ul.contact li a div .num {font-size: 20px;line-height: 1;display: block;color: #000;margin-top: -3px;margin-bottom: 6px;}
#section3 ul.contact li a div span {font-size: 16px;color: #666;line-height: 26px;}
#section3 ul.contact li a span.lw {top: 0;left: 0;width: 0;height: 1px;}
#section3 ul.contact li a span.lh {bottom: 0;left: 0;width: 1px;height: 0;}
#section3 ul.contact li a span.rw {right: 0;bottom: 0;width: 0;height: 1px;}
#section3 ul.contact li a span.rh {top: 0;right: 0;width: 1px;height: 0;}
/* #section3 ul.contact li a:after {content: '';display: block;clear: both;} */
@media screen and (min-width:768px) {
  #section3 ul.contact li a:after {display:block}
  #section3 h1 {font-size:40px;}
  #section3 h2 {font-size:18px;}
  #section3 ul.contact div span:not(.num) {display:block;}
  #section3 ul.contact li  {width:calc(50% - 12px);margin-top:20px;height:130px;}
  #section3 ul.contact li a {padding: 38px 50px 0 30px;}
  #section3 ul.contact li a div .num {font-size:30px;}
  #section3 ul.contact li a strong {font-size:24px;}
  #section3 .section-inner .section1_txt {margin-top:-250px;}
  #section3 ul.contact li a {padding:20px 50px 0 30px}
  #section3 ul.contact li a div .num {margin-top:10px;}
  #section3 ul.contact li a div span {line-height:22px;}
  #section3 ul.contact li a div {float:none; text-align:left;}
  #section3 ul.contact li a div.bottom {position:absolute;bottom:17px;}
}
@media screen and (max-width:1200px) {
  #section3 .section-inner .section1_txt {width:100%;}
  
}
@media screen and (min-width:1366px) {
  #section3 h1 {font-size:80px}
  #section3 h2 {font-size:22px;}
  #section3 .section-inner .section1_txt {margin-top:-300px}
  #section3 ul.contact li a div {
    float:right; 
    text-align:right;
    position:relative;
    top:0;
  }
  #section3 ul.contact li a div.bottom {
    position:relative;
    float:right;
    top:17px;
  }
  #section3 ul.contact li:nth-child(4) a div.bottom {top:4px;}
  #section3 ul.contact li a strong {
    float:left;
    position: relative;
    top: 15px;
  }
  #section3 ul.contact li {height:130px}
  #section3 ul.contact li a {padding:40px 50px 40px 30px;position:relative}
  #section3 ul.contact li a div .num {margin-top:0;}
  #section3 ul.contact li:nth-child(3) a div {margin-top:10px}
 
}
/* @media (max-width: 799px){
  #section3 ul.contact li {float:left;width: 100%;height: 75px;margin-top: 8px;margin-right: 0;}
  #section3 ul.contact li a {padding: 20px;}
  #section3 ul.contact li a {display: block;padding: 39px 42px;height: 100%;box-shadow: 0 1px 1px #e3e3e3;text-align: left;position: relative;}
}

@media screen and (max-width: 414px){
  #section3 h2 {font-size: 18px;margin-top: 10px;}
  #section3 h1, #section3 h2 {display:none;}

  #section3 .section-inner .section1_txt {margin-top:-265px;}
  #section3 ul.contact li a strong {width:100%;font-size:15px;margin-bottom: 8px;}
  #section3 ul.contact li a div {width:100%;text-align:left;}
  #section3 ul.contact li a div .num {margin-bottom:0;font-size:18px;}
  #section3 ul.contact li a div span {    font-size: 13px;
    line-height: 1;}
}

@media screen and (max-width: 1023px){
  #section3 .section-inner .section1_txt {width:100%;padding: 20px;}
  #section3 ul.contact li a {padding: 10px 50px 10px 20px;}
  
} */