@charset "utf-8";


#header .lang-menu ul li:after{display: none;}

.main-intro-slide {position:relative; overflow:hidden;}
.main-intro-slide .txt {position:absolute; left:50%; top:40%; transform:translate(-50%,-50%); z-index:10; text-align:center;}
.main-intro-slide .txt .t1 {font-size:42px; font-weight:600; color:#fff; line-height: 60px;}
.main-intro-slide .txt .t1 span {font-weight: 900;}
.main-sw {z-index:9; padding-bottom:20px; }

/* .main-sw .swiper-slide {transition-delay:0.5s;  } */
/* .main-sw .swiper-slide { width:100%; height:800px;} */
.swiper-wrapper{position: relative; width: 100%;}



.main-sw .swiper-slide .bg {height:100%;  overflow:hidden;}
.main-sw .swiper-slide.swiper-slide1 .bg {background:url("/assets/images/") no-repeat center center rgba(0, 0, 0, 0.20); background-size:cover;}
.main-sw .swiper-slide.swiper-slide2 .bg {background:url("/assets/images/main-slide-2.jpg") no-repeat center center rgba(0, 0, 0, 0.20); background-size:cover;}
.main-sw .swiper-slide.swiper-slide3 .bg {background:url("/assets/images/main-slide-3.jpg") no-repeat center center rgba(0, 0, 0, 0.20); background-size:cover;}
.main-sw .swiper-slide.swiper-slide-active .bg {box-shadow:rgb(0 0 0 / 20%) 3px 3px 10px;}


.sidebtn {z-index:16; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); color:#fff; display: inline-block; transition:0.5s; cursor:pointer; width:20px;}
.sidebtn img {max-width:100%;}
.sidebtn:hover {opacity:1;}
.sidebtn-right {margin-left:660px;}
.swiper-pagination .swiper-pagination-bullet {border:none; background:rgb(255 255 255 / 55%); opacity:1; width:10px; height:10px;}
.swiper-pagination .swiper-pagination-bullet-active {background:#fff; width:23px; height:10px; border-radius:6px;}
.main-intro-slide a {display: block; position: absolute; text-align: center; right: 47%; top: 87%; width: 20px; height: 20px;}
.main-intro-slide a.on {opacity: 0.5;}
.main-section-1 {margin-top:105px;}
.main-section-1 .con {width:1520px;}
.main-section-1 .section-tit {text-align:center;}
.main-section-1 .section-tit .t1 {color:#254C78; font-size:38px; font-weight: 800; margin-bottom:20px; position:relative;}
/* .main-section-1 .tit .t1::after {content:""; width:31px; height:6px; background:#F58120; border-radius:3px; position:absolute; left:50%; transform: translateX(-50%); bottom:-18px;} */
.main-section-1 .section-tit .t2 {color:#444444; font-size:18px; font-weight:500; line-height:32px;}
.sw-control {position:absolute; left:50%; top:45%; transform: translate(-50%,-55%); margin-top:100px; z-index:10; display:inline-flex;     align-items: center;}
.sw-control .swiper-pagination {position:static !important; width:auto !important; margin-right:10px;}
.sw-control span {display:inline-flex;     align-items: center;     justify-content: center; cursor:pointer;}
.sw-control span.swiper-play {display:inline-flex;} 
.sw-control span.swiper-stop {display:none;}
.sw-control.on span.swiper-play {display:none;} 
.sw-control.on span.swiper-stop {display:inline-flex;}

.main-wave {height:200px; background:url("/assets/images/main-wave.png") top center / cover no-repeat; position:absolute; width: 100%;  z-index:10; bottom: -0.5vw;}
.scroll-pointer {display:inline-flex; position:absolute; left:50%; transform: translate(-50%,-50%); align-items: center; justify-content: center; flex-direction: column; cursor:pointer; margin-top:80px;}
.scroll-pointer .text {color:#CCCCCC; font-size:14px; font-weight:600;}
.scroll-pointer .pointer {margin-top:10px; animation: doongdoong 1s ease-out infinite;}
.scroll-pointer:hover .text {color:#999999;}
.scroll-pointer:hover .pointer svg path {fill:#999999; stroke: #999999;}
@keyframes doongdoong {
    0%{transform:translateY(5px);}

    50%{transform:translateY(-5px);}

    100%{transform:translateY(5px);}
}

.list-img-video-box {display:flex; margin-top:60px;}
.list-img-video-box .list {display:inline-flex;     flex-direction: column;}
.list-img-video-box .list .tit {color:#444444; font-size:28px; font-weight:800; text-align:left;}
.list-img-video-box .list dl {width:225px; margin-top:40px; position:relative;}
.list-img-video-box .list dl .line-bar {position:absolute; right:0; top:0; height:3px; width:100%; background:#EEEEEE; z-index:1;}
.list-img-video-box .list dl .line-bar::after {content:""; position:absolute; left:0; top:0; height:3px; width:53px; background:#FFCC00; z-index:2;}
.list-img-video-box .list dl dd {margin-bottom:25px; cursor:pointer;}
.list-img-video-box .list dl dd span {color:#666666; font-size:17.5px; font-weight:600;}
.list-img-video-box .list dl dd.active span {color:#254C78; font-weight:700;}

.list-img-video-box .flexWrap{display: flex;}

.list-img-video-box .img {display:inline-flex; margin-right:40px;}
.list-img-video-box .img ul {width:775px; position:relative;}
.list-img-video-box .img ul li {display:none; position:relative; border-radius:30px; overflow:hidden; position:absolute; left:0; top:0;}
.list-img-video-box .img ul li.active {display:block;}
.list-img-video-box .img ul li .thumb {height:580px; position:relative; z-index:1;}
.list-img-video-box .img ul li .thumb img {object-fit:cover; width:100%; height:100%;}
.list-img-video-box .img ul li .txt {position:absolute; left:0; bottom:0; padding:40px 60px; z-index:2;}
.list-img-video-box .img ul li .txt .t1 {color:#fff; font-size:28px; font-weight:800;}
.list-img-video-box .img ul li .txt .t2 {color:#fff; font-size:20px; font-weight:600; line-height:30px; margin-top:20px;}
.list-img-video-box .video {display:inline-flex;}
.list-img-video-box .video ul {width:480px;}
.list-img-video-box .video ul li {border-radius:30px;  background:rgb(0 0 0 / 5%); position:relative; margin-bottom:40px; cursor:pointer;}
.list-img-video-box .video ul li:last-child {margin-bottom:0;}
.list-img-video-box .video ul li .thumb {height:270px; position:relative; z-index:1; border-radius:30px 30px 50px 30px; overflow:hidden;}
.list-img-video-box .video ul li .thumb img {width:100%; height:100%; object-fit:cover;}
.list-img-video-box .video ul li .open {z-index:2; position:absolute; right:0; bottom:0; height:70px; width:380px; background:#FBFBFB; border-radius:30px 0 30px 0; display:flex; height:70px;     align-items: center; justify-content: flex-start; padding-left:49px; padding-right:85px;}
.list-img-video-box .video ul li .open .t1 {font-size:17px; font-weight:700; color:#666666;}
.list-img-video-box .video ul li .open .arr {color:#FFCC00; position:absolute; right:50px; top:50%; transform: translateY(-50%); }

.video_mp4 {position:fixed;left:0;top:0;width:100%;height:100%;z-index:11111;}
.video_mp4 .mask {position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.48);}
.video_mp4 .close {position:absolute;left:50%;top:50%;margin:-313px 0 0 437px;width:43px;height:43px;cursor:pointer;}
.video_mp4 .video {position:absolute;left:50%;top:50%;margin:-260px 0 0 -480px;width:960px;height:540px;}

.movie {margin-top:30px;}
.movie ul {font-size:0; text-align:center;}
.movie ul li {display: inline-block; vertical-align: top; position:relative; cursor:pointer; width:380px; margin-right:30px;}
.movie ul li:last-child {margin-right:0;}
.movie ul li:hover {}
.movie ul li:after {content:"";  position:absolute; display:inline-block; left:0; top:0; width:381px; height:230px; background:url("../img/movie_play.png") rgba(0,0,0,0.5) no-repeat center center; border-radius:10px; background-size:20% auto;}
.movie ul li:hover:after {content:""; position:absolute; display:inline-block; left:0; top:0; width:381px; height:230px; background:url("../img/movie_play.png") rgba(0,0,0,0.1) no-repeat center center; border-radius:10px; background-size:20% auto;}
.movie ul li .movie_thum {}
.movie ul li .movie_tit {font-size:20px; font-weight:700; color:#fff; margin-top:15px;}

.main-section-2 {background:#FBFBFB; margin-top:200px;}
.main-section-2 .con {height:920px; display:flex;   flex-direction: column; align-items: center; justify-content: center; width:100%;}

.main-section-2 .section-tit .t1 {color:#254C78; font-size:38px; font-weight: 800; margin-bottom:20px; position:relative;}
.swiper-paging.swiper-pagination-bullets {background:#254C78; border-radius:28px; width:auto; padding:0 40px; margin:0 auto; text-align:center; min-width:367px;}
.swiper-paging.swiper-pagination-bullets .num {display:inline-flex;     align-items: center; margin-right:40px;}
.swiper-paging.swiper-pagination-bullets .num .current {color:#fff;}
.swiper-paging.swiper-pagination-bullets .num .bar {background:rgb(255 255 255 / 50%); width:15px; height:1px; display:inline-block; margin:0 8px;}
.swiper-paging.swiper-pagination-bullets .num .total {color:rgb(255 255 255 / 65%);}
.swiper-paging.swiper-pagination-bullets .prod-name {color:#fff; font-size:24px; font-weight:700; margin-left: 10px;}
.swiper-paging .swiper-pagination-bullet {margin:0; width:auto; height:auto; border-radius: 0; background:none; display:none;
    align-items: center;
    justify-content: center;
    align-content: center;
}
.swiper-paging .swiper-pagination-bullet.swiper-pagination-bullet-active {display:inline-flex; height:55px;}
.product-sw {/*width:850px;*/ width:100%; margin-top:40px; padding:0 40px; /*box-sizing:content-box;*/}
.product-sw .swiper-slide {margin:0 40px; /* 추가*/width:850px;}
.product-sw .swiper-slide .thumb {line-height: 0; border-radius:30px; overflow:hidden; border:1px solid #DDDDDD; background:#FBFBFB;  z-index:1; margin-top:28px; transition: 0.5s ease-out;}
.product-sw .swiper-slide .thumb img {height: 384px; mix-blend-mode: darken; width:100%;  object-fit: cover; max-width:none;}
.product-sw .swiper-slide .list {margin-top:28px; display:none;}
.product-sw .swiper-slide .list ul.t1 {}
.product-sw .swiper-slide .list ul.t1 li {color:#555555; font-size:18px; font-weight:500; line-height:28px; position:relative; padding-left:17px;}
.product-sw .swiper-slide .list ul.t1 li::before {content:"-"; position:absolute; left:0; top:0;}

.product-sw .swiper-slide.swiper-slide-active .thumb {border-radius:30px; overflow:hidden; border:1px solid #DDDDDD; background:#FBFBFB; z-index:1; margin-top:0;}
.product-sw .swiper-slide.swiper-slide-active .thumb img {height: 384px; mix-blend-mode: darken; width:100%;  object-fit: cover; max-width:none;}
.product-sw .swiper-slide.swiper-slide-active .list {margin-top:28px; display:block;}
.product-sw .swiper-slide.swiper-slide-active .list ul.t1 {}
.product-sw .swiper-slide.swiper-slide-active .list ul.t1 li {color:#555555; font-size:18px; font-weight:500; line-height:28px; position:relative; padding-left:17px;}
.product-sw .swiper-slide.swiper-slide-active .list ul.t1 li::before {content:"-"; position:absolute; left:0; top:0;}




.ps-arr-wrap {position:absolute; left:50%; top:0;  width:100%; z-index:2; transform:translateX(-50%); width:950px;}
.ps-arr {position:absolute;/*position:absolute; top:50%; transform:translateY(-50%);*/ font-size:15px; color:#CCCCCC; cursor:pointer; padding:10px; height:385px; display:inline-flex; position:absolute;     align-items: center; font-size:20px;}
.ps-arr.arr-next {right:0;}
.ps-arr.arr-prev {left:0;} 

.main-inquiry {    display: flex; justify-content: space-between; padding:150px 0;}
.main-inquiry .right {display:inline-flex; width:780px;}
.main-inquiry .left {position:relative;}
.main-inquiry .left .tit {}
.main-inquiry .left .tit .t1 {color:#254C78; font-size:38px; font-weight:800;}
.main-inquiry .left .tit .t2 {color:#444444; font-size:21px; font-weight:600; line-height:32px; margin-top:25px;}
.main-inquiry .form {margin-top:0;margin-bottom:0; width:100%;}
.main-inquiry .ic-list {position:absolute; left:0; bottom:0;}
.main-inquiry .ic-list ul li {color:#666666; font-size:16px; font-weight:500; line-height:24px; position:relative; padding-left:30px; margin-bottom:15px;}
.main-inquiry .ic-list ul li i {color:#CCCCCC; position:absolute; left:0; top:2px; font-size:20px;}
.main-inquiry .form .row.row-btn {margin-bottom:0 !important;}


.video-background {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    z-index: -99;
    z-index:1;
    overflow:hidden;
      
  }
  .video-foreground,
  .video-background iframe {
    position: absolute;
    top: 0;
    left: 0%;
    width: 150%;
    height: 100%;
    pointer-events: none;
      background:#000;
  }
  
  .main-sw .swiper-slide {/*transition-delay:0.5s;*/  width:100%; padding-bottom: 41.65%;}
  
  .video-background iframe{height: 150%; width: 100%;}
  /* .video-foreground{height: 100%; width: 100%;}
  .video-background iframe {
    position: absolute;
    top: 0;
    left: 0%;
    width: 180%;
    height: 100%;
    pointer-events: none;
      background:#000;
  } */


  /* #vidtop-content {
      top: 0;
      color: #fff;
  } */
  /* .vid-info { position: absolute; top: 0; right: 0; width: 33%; background: rgba(0,0,0,0.3); color: #fff; padding: 1rem; font-family: Avenir, Helvetica, sans-serif; } */
  /* .vid-info h1 { font-size: 2rem; font-weight: 700; margin-top: 0; line-height: 1.2; } */
  /* .vid-info a { display: block; color: #fff; text-decoration: none; background: rgba(0,0,0,0.5); transition: .6s background; border-bottom: none; margin: 1rem auto; text-align: center; } */
  
  /* @media (min-aspect-ratio: 16/9) {
    .video-foreground { height: 150%; top: -25%; }
  }
  @media (max-aspect-ratio: 16/9) {
    .video-foreground { width: 300%; left: -100%; width:400%; left:-150%; width: 500%; left: -356%;}
  } */

  @media all and (max-width: 630px) {
  .vid-info { width: 50%; padding: .5rem; }
  .vid-info h1 { margin-bottom: .2rem; }

  
  }
  @media all and (max-width: 500px) {
  .vid-info .acronym { display: none; }
  }



  .swiper-paging.swiper-pagination-bullets .num{margin-right: 0;}

  
  
  @media screen and (max-width: 1600px){

    .video_mp4 .video{transform: translate(-50%, -50%); width: 100%; margin: 0;}
    .video_mp4 .close{transform: translate(-50%, -50%); margin: 0; left: 95%; top: 10%;}

    .main-section-1 .con {width: 100%;}
    
    .list-img-video-box{flex-direction: column; flex-wrap: wrap; padding: 0 50px; box-sizing: border-box;}
    .list-img-video-box .img ul li{position: relative;}

    .list-img-video-box .list .tit{margin-bottom: 30px;}
    .list-img-video-box .flexWrap{ justify-content: space-between;}
    .list-img-video-box .list dl{width: 100%;}
    .list-img-video-box .list dl:after{content: ''; display: block; clear: both;}
    .list-img-video-box .list dl *{float: left;}
    .list-img-video-box .list dl dd,
    .list-img-video-box .list dl dt{width: 25%;}
    .list-img-video-box .list dl dd:hover{background-color: #FFCC00;}
    .list-img-video-box .list dl dd span{width: 100%; text-align: center;}

    .list-img-video-box .img ul{width: 58vw;}
    .list-img-video-box .video ul{width: 30vw;}

    .list-img-video-box .list dl dt,
    .list-img-video-box .list dl .line-bar::after{display: none;}
    
    .list-img-video-box .list dl dd{padding: 20px; box-sizing: border-box; border-radius: 20px 20px 0 0; background-color: #FBFBFB;}
    .list-img-video-box .list dl dd.active{background-color: #FFCC00;}

    .main-section-3 .con{padding: 0 30px; box-sizing: border-box; width: 100%;}

    /* .olny-main-footer .left .btn{margin: 0 auto;} */
    .olny-main-footer .left .btn{margin-left: 30px;}

    .olny-main-footer .right ul{justify-content: flex-start;}
    .olny-main-footer .right ul li{width: 20%; margin-right: 0;}
    .olny-main-footer .right ul li img{display: block; margin: 0 auto;}
    .olny-main-footer .right {width: 100%;}
    
  }
/* tablet */
  @media screen and (max-width: 1280px){
    .product-sw .swiper-slide .thumb img,
    .product-sw .swiper-slide.swiper-slide-active .thumb img {height: 220px;}
    /* .main-sw .swiper-slide{height: 650px;} */
    /* .main-sw .swiper-slide {padding-bottom: 55.65%;}
    .video-foreground{width: 200%;}
    .video-foreground{height: 100%;} */
    .main-intro-slide{overflow: visible; margin-bottom: 100px;}
    
    .scroll-pointer{margin-top: 0; top: 102%;}
    .main-wave{background: none; z-index: 0;}

    .list-img-video-box{padding: 0 1vw;}
    .list-img-video-box .img ul{width: 57vw;}
    .list-img-video-box .video ul li .open{width: 27vw; padding-left: 20px; word-break: keep-all;}
    .list-img-video-box .list dl dd span{font-size: 16px;}
    .list-img-video-box .video ul li .open .t1{font-size: 14px;}

    .main-section-1 .section-tit .t1,
    .main-section-2 .section-tit .t1,
    .main-inquiry .left .tit .t1{font-size: 34px;}
    .main-section-2 .con {height:820px;}

    .main-inquiry{justify-content: space-between; flex-wrap: wrap;}


    
    .main-inquiry .left{width: 100%; margin-bottom: 30px;}
    /* .main-inquiry .ic-list{top: 750px;} */
    .main-inquiry .ic-list{right: 0; top: 0; left: 65%;}

    .main-inquiry .left .tit .t1{margin-bottom: 50px;}
    .main-inquiry .right{width: 100%;}

    
    .olny-main-footer .con{padding-left: 0; width: 100%;}
    .olny-main-footer .right {padding-top: 35px;}

    .product-sw .swiper-slide{width: 500px;}
    .ps-arr-wrap{width: 570px; height: 100%; top: 6%;}
    .ps-arr-wrap > div{height: 0; top: 27%;}
    .swiper-paging.swiper-pagination-bullets .prod-name{font-size: 18px;}
  }
/* tablet Fin */

/* mobile */
  @media screen and (max-width: 768px){
    .product-sw .swiper-slide .thumb img,
    .product-sw .swiper-slide.swiper-slide-active .thumb img {height: 36vw;}
    /* .main-sw .swiper-slide {padding-bottom: 59.65%;}
    .video-foreground{width: 210%;}
    .video-foreground{height: 98%;} */

    /* .main-sw .swiper-slide {height:50vw;} */
    /* .main-sw .swiper-slide{height: 450px;} */
    /* .main-sw .swiper-slide {height:650px;} */
    .main-section-2 .con{height: 920px;}
    .main-intro-slide{overflow: visible; margin-bottom: 100px;}
    .scroll-pointer{top: 102%;}
	  /* .main-sw .swiper-slide {height:75vw;} */

    .video_mp4 .close{width: 23px; height: 23px; left: 93%; top: 5%;}
    
    .sw-control{margin-top: 16vw;}
    .main-intro-slide .txt .t1{line-height: 6vw;}
    .main-section-1 .section-tit .t1,
    .main-section-2 .section-tit .t1{font-size: 26px;}
    .main-section-1 .section-tit .t2{font-size: 16px; line-height: 24px; word-break: keep-all;}
    .main-section-3 .con{padding: 0 20px;}
    
    .list-img-video-box .img{margin-right: 0; width: 100%;}
    .list-img-video-box .img ul{width: 100%; margin-top: 50px;}
    .list-img-video-box .img ul li .txt{top: 0; padding: 40px 20px;}
    .list-img-video-box .img ul li .txt .t1{font-size: 24px;}
    .list-img-video-box .img ul li .txt .t2{font-size: 18px;}
    .list-img-video-box .img ul li .thumb{height: 380px;}
    .list-img-video-box .flexWrap{flex-wrap: wrap;}
    
    .list-img-video-box .list .tit{font-size: 26px; margin-bottom: 0;}
    .list-img-video-box .list dl dd{padding: 13px; margin-bottom: 0; border-radius: 0;}
    .list-img-video-box .list dl dd,
    .list-img-video-box .list dl dt{width: 50%;}
    .list-img-video-box .list dl dd:nth-of-type(1){border-radius: 10px 0 0 0 ;}
    .list-img-video-box .list dl dd:nth-of-type(2){border-radius: 0 10px 0 0;}
    .list-img-video-box .list dl dd:nth-of-type(3){border-radius: 0 0 0 10px;}
    .list-img-video-box .list dl dd:nth-of-type(4){border-radius: 0 0 10px 0;}
    .list-img-video-box .list dl dd span, .list-img-video-box .video ul li .open .t1{font-size: 13px; word-break: keep-all; line-height: 18px;}
    .list-img-video-box .video ul{display: flex; flex-wrap: wrap; width: 100%; margin-top: 35px;}
    .list-img-video-box .video ul li:nth-child(2){margin-left: 2%;}
    .list-img-video-box .video ul li{margin-bottom: 0; padding-bottom: 30px;}
    .list-img-video-box .video ul li:not(:last-child){margin-bottom: 20px;}
    .list-img-video-box .video ul li .open{width: 100%; padding-left: 15px; padding-right: 30px;}
    .list-img-video-box .video ul li .open .arr{right: 20px;}

    .list-img-video-box .video ul li .thumb{height: auto; }
    .list-img-video-box .video ul li .thumb img{object-fit: contain;}

    .main-inquiry{padding: 50px 0 150px 0;}
    .main-inquiry .left{width: 100%;}
    .main-inquiry .ic-list{top: 1070px; left: 0;}
    .main-inquiry .left .tit .t1{font-size: 26px;}

    .product-sw .swiper-slide,
    .ps-arr-wrap{width: 100%;}
    .swiper-paging.swiper-pagination-bullets{min-width: 150px;}


    .form .row .col{margin-bottom: 30px;}
    .form .row.row-btn{flex-wrap: wrap;}



    .olny-main-footer .left .btn{margin-left: 20px;}
    .olny-main-footer .right ul{flex-wrap: wrap; }
    .olny-main-footer .right ul li{width: 33.33%;}
    .olny-main-footer .right ul li img{max-width: 90px;}
    
    footer .con{margin-top: 30px;}
    footer .left{padding-left: 0; padding-top: 60px;}
    footer .left .flogo{transform: translateX(-50%); left: 50%;}
    footer .left .bot-list ul {text-align:center;}
    
    /* .product-sw .swiper-slide.swiper-slide-active .list{display: none;} */
    .swiper-paging.swiper-pagination-bullets .prod-name{font-size: 14px;}
  }
/* mobile Fin */