.tit {text-align: center;font-size: 70px; color: #000;}
.Vertical_Line{width: 2px; height: 100px; background: #000;margin: 2% auto}
.ent{display: none}

/*공통*/
.swiper-button-prev, .swiper-button-next{z-index: 5}
#YS{box-shadow: 1px 2px 4px 1px rgb(5 5 5 / 20%); display: flex;position: fixed;bottom: 20px;left: 20px;z-index: 99;font-size: 18px;border: none;outline: none;background:#f6f6f6 url(/img/inno_H/inno.png) no-repeat center center / 55%;;cursor: pointer;width: 80px;height: 80px;border-radius: 50%;overflow: hidden}
#YS span{font-size: 17px;padding-top: 12px; color: #fff;display: block;text-align: center;width: 100%;-webkit-animation:blink 2s ease-in-out infinite alternate;-moz-animation:blink 2s ease-in-out infinite alternate;animation:blink 2s ease-in-out infinite alternate;height: 100%;background: #fcc700;line-height: 1.7;font-weight: 600;}
#YS span img{width: 26px;}
@keyframes blink{0% {opacity:0;-webkit-opacity:0} 30% {opacity:1;-webkit-opacity:1} 70%{opacity:1;-webkit-opacity:1} 100%{opacity:0;-webkit-opacity:0} }


/*SECTION1*/
#sec1 .videowrap video{width: 100%;}
/*SECTION2*/
#sec2{overflow: hidden;padding: 15% 0 12%;}
#sec2 .sec2_wrap{display: flex;max-width: 1660px;margin-left: auto;width: 95%;}
#sec2 .txt{width: 30%;}
#sec2 .txt h2{font-size: 70px;position: relative; color: #000}
#sec2 .txt h2::before{    content: "";background: url(/theme/noodle/img/new_h/main/event_bg.png) no-repeat;max-width: 300px;width: 60%;height: auto;padding: 26%;display: block;position: absolute;bottom: 60%;background-size: contain;}
#sec2 .txt .Vertical_Line{margin: 2% 0}
#sec2 .txt p{font-size: 20px}

#sec2 .Navigation_sec2{position: relative;margin-top: 10%}
#sec2 .Navigation_sec2 .swiper-button-prev{background-image: url(/img/inno_H/arrow_prev_black.png);transform: none;}
#sec2 .Navigation_sec2 .swiper-button-pause{background-image: url(/img/inno_H/pause_black.png);position: relative; cursor: pointer}
#sec2 .Navigation_sec2 .swiper-button-next{background-image: url(/img/inno_H/arrow_next_black.png);transform: none;}
#sec2 .swiper-pagination-progressbar{width: 100%;height: 3px;bottom: 0;z-index: 2}
#sec2 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#000}
#sec2 .swiper-button-prev, #sec2 .swiper-button-next,#sec2 .swiper-button-pause{width: 40px;height: 40px;background-size: contain;bottom: auto;left: auto;position: relative;display: inline-block}
#sec2 .slidewrap{width: 70%;position: relative;}

#sec2 .swiper-slide a::after{content: ""; display: block;position: absolute;;width: 50px;height: 50px;top: 50%;left: 50%;transform: translate(-50%,-50%);background: url(/img/inno_H/circle.png) no-repeat;background-size: contain;opacity: 0}
#sec2 .swiper-slide a:hover{display: block;background-color: rgba(0,0,0,.9);position: relative;}
#sec2 .swiper-slide a:hover::after{opacity: 1;transition: opacity 0.8s}
#sec2 .swiper-slide a:hover img{opacity: 0.4;transition: opacity 0.5s}


/*SECTION3*/
#sec3{}
#sec3 .bann_wrap{display: flex}
#sec3 .bann_wrap > a{position: relative;display: block;background-color: #000}
#sec3 .bann_wrap a img{filter: grayscale(1);opacity: 0.5;transition: opacity 1s}
#sec3 .bann_wrap a .cont{position: absolute;width: 100%;bottom: 10%;padding-left: 10%;color: #fff}


#sec3 .bann_wrap a .cont h3{text-transform:uppercase;font-size: 40px;line-height: 1.3}
#sec3 .bann_wrap a .cont .line{width: 2px;height: 50px;background: #fff;margin: 2% 0}
#sec3 .bann_wrap a .cont span{font-size: 24px}
#sec3 .bann_wrap a .cont .more{position: absolute; right: 8%;background: none; border: 1px solid #fff;display: inline-block;padding: 2px 0 ;width: 60px;    bottom: 3px;}
#sec3 .bann_wrap a .cont .more::before{content: "MORE+"}
#sec3 .bann_wrap a:hover img{filter: none;opacity: 1}
#sec3 .bann_wrap a:hover .cont h3{color: #FCC700}
#sec3 .bann_wrap a:hover .cont01{color: #000}
#sec3 .bann_wrap a:hover .cont01 .line{background: #000}
#sec3 .bann_wrap a:hover .cont .more{background: #000;color: #FCC700;border: 1px solid #000}
#sec3 .bann_wrap a:hover .cont .more::before{content: "VIEW+";}


/*SECTION4*/
#sec4{}
#sec4 .img_wrap{position: relative}
#sec4 .textwrap{width: 100%; margin: auto;position: absolute; top: 25%;}
#sec4 .textwrap .box{margin: 0 10% 0 auto;max-width: 1000px;}
#sec4 .textwrap .box h3{text-align: right;font-size: 48px;line-height: 1.4}
#sec4 .textwrap .box h3 em{font-size: 56px}
#sec4 .textwrap .line{max-width: 1230px;height: 2px;background: #000;margin:2% 0 2% auto;    width: 64%;}
#sec4 .textwrap .box2{max-width: 1230px;margin-left: auto;font-size: 30px;line-height: 1.6;color: #666666;width: 64%;}
#sec4 .textwrap .box2 p{font-weight: bold;margin-top: 4%;color: #333;}

/*SECTION5*/
#sec5{padding: 5% 0}

#sec5 .swiper-container{max-width: 1400px;width: 95%;}
#sec5 .swiper-container .bg_black{width: 33.3%;height: 100%;z-index: 3; background: rgba(0,0,0,0.8);position: absolute;padding: 40px 40px 60px}
#sec5 .buttonbox{position: relative}
#sec5 .buttonbox .swiper-button-prev{background-image: url(/img/inno_H/arrow_prev_white.png);transform: none;}
#sec5 .buttonbox .swiper-button-list{background-image: url(/img/inno_H/pause_white.png);position: relative; cursor: pointer}
#sec5 .buttonbox .swiper-button-next{background-image: url(/img/inno_H/arrow_next_white.png);transform: none;}
#sec5 .swiper-container-horizontal > .swiper-pagination-progressbar{top: auto;bottom: 0px}
#sec5 .swiper-button-prev, #sec5 .swiper-button-next,#sec5 .swiper-button-list{width: 30px;height: 30px;background-size: contain;bottom: auto;left: auto;position: relative;display: inline-block}

#sec5 .swiper-container .bg_black .s_box{color: #fff;position: absolute;bottom: 18%;opacity: 0}
#sec5 .swiper-container .bg_black .s_box.on{opacity: 1;transition: opacity 2s}
#sec5 .swiper-container .bg_black .s_box h3{color: #FCC700;    font-size: 40px;font-weight: bold;}
#sec5 .swiper-container .bg_black .s_box h3 em{color: #fff;font-weight: normal}
#sec5 .swiper-container .bg_black .s_box .Vertical_Line{background: #fff;    margin: 6% 0;height: 50px;}
#sec5 .swiper-container .bg_black .s_box p{font-size: 22px}

#sec5 .swiper-pagination{position: relative;bottom: 0;max-width: 1400px;width: auto;margin: auto;display: flex}
#sec5 .swiper-pagination-bullet{flex: 1;border-radius:0;height: auto;opacity: 1;color: #fff}
#sec5 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{margin: 0;font-size: 24px;padding: 1% 0;border-right: 1px solid #fff;}
#sec5 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet:last-child{border-right: none}
#sec5 .swiper-pagination-white .swiper-pagination-bullet-active{background: #FCC700;color: #000;}

/*SECTION6*/
#sec6{background: #f6f6f6;padding: 3% 0}
#sec6 .sec6_wrap{max-width: 1400px;margin: auto;width: 95%;}
#sec6 .contact{display: flex;justify-content: space-between}
#sec6 .contact .c0{flex: 1;border-right: 2px dashed #e8e8e8;padding: 2% 0}
#sec6 .contact .ct1{padding-right:3%;}
#sec6 .contact .ct2{padding-left:3%;padding-right:3%;}
#sec6 .contact .ct3 {padding-left:3%;border-right: 0}

#sec6 .contact .c0 .title{position: relative;font-size: 30px;margin-bottom: 5%;font-weight: bold}
#sec6 .contact .c0 .title span{position: absolute;right: 0;top: 50%;transform: translateY(-50%);display: inline-block;color: #fff;background: #000;width: 20px;height: 20px;text-align: center;cursor: pointer;font-size: 14px}
#sec6 .contact .c0 .txtbox{}
#sec6 .contact .c0 .txtbox ul{}
#sec6 .contact .c0 .txtbox ul li{padding-bottom: 2%}
#sec6 .contact .c0 .txtbox ul li:last-child{padding-bottom: 0}
#sec6 .contact .c0 .txtbox ul li a{display: block;position: relative;}

#sec6 a:hover{color: #FCC700}
#sec6 .contact .c0 .txtbox ul li a::before{content: "NEW";color:#fff; background: #FCC700;display: inline-block;padding: 2px 4px;font-size: 12px;margin-right: 5px}
#sec6 .contact .c0 .txtbox ul li a span{float: right;}
#sec6 .contact .ct3 .inno{}
#sec6 .contact .ct3 .inno ul{}
#sec6 .contact .ct3 .inno ul li {}
#sec6 .contact .ct3 .inno ul li a{font-size: 24px;font-weight: bold;color: #000;display: flex;    align-items: center;}
#sec6 .contact .ct3 .inno ul li:last-child a{font-size: 34px}
#sec6 .contact .ct3 .inno ul li a span{margin-right: 10px;display: inline-block;    width: 18%;}
#sec6 .contact .ct3 .inno ul li a span img{    width: auto;max-width: 100%;display: block;margin: auto;}

/*SECTION7*/
#sec7{padding: 5% 0;overflow: hidden;background: #fffbe7;text-align: center}
#sec7 .tit{}
#sec7 .inno_tit{display: none}
#sec7 .cont08 p{    font-size: 30px;margin: 5% auto 1%;}
#sec7 .cont08 span{font-size: 22px;}
/*SECTION8*/
#sec8{;position: relative}
#sec8 .main_db{background: #000;;margin: auto;padding: 3% 5%;color: #fff;text-align: center;position: absolute;left: 60%;top: 50%;transform: translate(-50%,-50%);z-index: 10}
#sec8 .main_db .db_list{}
#sec8 .main_db .db_list li{margin: 4% 0}
#sec8 .main_db .db_list li:last-child{margin: 4% 0 0}
#sec8 .main_db .db_list .db_tit{font-size: 30px}
#sec8 .main_db .db_list .db_tit em{text-transform: uppercase;color:#FCC700 }
#sec8 .main_db .db_list .db_subject{margin:4% 0;font-size: 18px}
#sec8 .main_db .db_list .agree{text-align: left;font-size: 16px}
#sec8 .main_db .db_list .policy {margin-left: 10px;display: inline-block;color: #000; background: #fff;padding: 3px 6px;font-size: 14px}
#sec8 .main_db .db_list .db_btn {background: none;border: 1px solid #fff; padding: 6px 16px;font-size: 22px;}

#sec8 input[type=text]{width: 100%;color: #000;;padding: 15px}
#sec8 input[type=checkbox]{margin-right: 4px}

#sec8 .info_wrap{display: flex}
#sec8 .info_wrap .info {color: #fff;;width: 60%;background: url(/img/inno_H/main/sec8_bg.jpg) no-repeat center center;background-size: cover;padding-top: 6%;padding-left: 5% }
#sec8 .info_wrap .info .info_tit {font-size: 34px}
#sec8 .info_wrap .info .info_tit img{margin-right: 10px}
#sec8 .info_wrap .info .txtwrap {font-size: 26px}
#sec8 .info_wrap .info .txtwrap .listwrap {}
#sec8 .info_wrap .info .txtwrap .listwrap .list01 {}
#sec8 .info_wrap .info .txtwrap .listwrap .list li {display: flex;    align-items: center;margin: 2% 0;justify-content: space-between;font-size: 26px}
#sec8 .info_wrap .info .txtwrap .listwrap .list li .list_left {display: flex;justify-content: space-between;width: 12%;}
#sec8 .info_wrap .info .txtwrap .listwrap .list li .list_left  h4{}
#sec8 .info_wrap .info .txtwrap .listwrap .list li .list_right {width: 80%;}

#sec8 .info_wrap .info .tit02{margin-top: 4%}
#sec8 .info_wrap .info .txtwrap .list02 {margin-top: 2%}
#sec8 .info_wrap .info .txtwrap .list02 li {}
#sec8 .info_wrap .info .txtwrap .call  {color: #FCC700;    margin-top: 3%;font-weight: bold;font-size:30px }

#sec8 .mapwrap{width: 40%;}
#sec8 .mapwrap .map{width: 100% !important; height: 100% !important; margin: 0 auto !important; padding: 0 !important;border: 0 !important;}
.root_daum_roughmap .wrap_controllers {display: none}



@media (max-width:1920px){
    /*Font*/
    #sec4 .textwrap .box h3{font-size: 2.5vw;}
    #sec4 .textwrap .box h3 em {font-size: 3vw;}
    #sec4 .textwrap .box2{font-size: 1.8vw}


}
@media (max-width:1660px){
    /*Font*/
    #sec2 .txt h2{font-size:  4.5vw}
    #sec2 .txt p{font-size:1.6vw }
    #sec3 .bann_wrap a .cont h3{font-size: 2.45vw}
    #sec3 .bann_wrap a .cont span{font-size: 1.45vw}

    #sec8 .info_wrap .info .info_tit{font-size: 2.1vw}
    #sec8 .info_wrap .info .txtwrap .listwrap .list li{font-size:1.6vw }
    #sec8 .info_wrap .info .txtwrap{font-size:1.6vw }
    /*Style*/
     .Vertical_Line{height:7vw }
    #sec2 .Navigation_sec2{margin-top: 5%}
    #sec3 .bann_wrap a .cont .line {height: 3vw;}
    #sec3 .bann_wrap a .cont .more{bottom: 0;}
    #sec8 .mapwrap .map{height: 700px !important; }


}
@media (max-width:1440px){
    /*Font*/
    .tit{font-size: 5vw}
    #sec5 .swiper-container .bg_black .s_box h3{font-size:3.2vw }
    #sec5 .swiper-container .bg_black .s_box p{font-size: 1.6vw}
    #sec8 .main_db .db_list .db_tit{font-size:28px }
    #sec8 .main_db .db_list .db_btn{font-size:20px }
    #sec7 .cont08 p{font-size: 2vw}
    #sec7 .cont08 span{font-size: 1.5vw}

    /*Style*/
  #sec8 .mapwrap .map{height: 600px !important; }
    #sec8 .main_db .db_list .db_subject .ent{display: block}
}
@media (max-width:1240px){
    /*Font*/
    #sec5 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{font-size:  2vw}
    #sec6 .contact .ct3 .inno ul li a{font-size: 2vw}
    #sec6 .contact .ct3 .inno ul li:last-child a{font-size:2.8vw }
    /*Style*/
    #sec8 .mapwrap .map{height: 500px !important; }
    #sec8 .info_wrap .info .info_tit img{width: auto;height: 40px}
}
@media (max-width:1024px){
      /*Font*/
    #sec2 .layer_close{font-size: 16px}

    #sec6 .contact .c0 .title{font-size: 3vw}
    #sec8 .main_db .db_list .db_tit{font-size:2.8vw }
    #sec8 .main_db .db_list .db_subject{font-size:1.8vw }
    #sec8 .main_db .db_list .agree{font-size: 1.6vw}
    #sec8 .main_db .db_list .policy{font-size: 12px}
    #sec8 .main_db .db_list .db_btn{font-size:1.8vw  }
    #sec8 .info_wrap .info .txtwrap .call{font-size: 2.8vw}


    /*Style*/
    #sec8 .mapwrap .map{height: 480px !important; }
}
@media (max-width:850px){
    /*Style*/
    #sec8 .mapwrap .map{height: 400px !important; }
}
@media (max-width:768px){
    /*연산바로가기*/
    #YS{display: none}
    /*Font*/
    #sec2 .txt h2{font-size:  9vw}
    #sec2 .txt p{font-size:  3.3vw}
    #sec2 .layer_close{font-size: 20px}
    #sec3 .bann_wrap a .cont h3{font-size:6.2vw}
    #sec3 .bann_wrap a .cont span{font-size: 3.5vw}

    #sec4 .textwrap{top: 14%;}
    #sec4 .textwrap .box h3 em{font-size: 5.7vw}
    #sec4 .textwrap .box h3{font-size: 4.8vw}
    #sec4 .textwrap .box2{font-size: 3.8vw}

    #sec5 .swiper-container .bg_black .s_box h3{font-size: 5vw}
    #sec5 .swiper-container .bg_black .s_box p{font-size: 2.9vw}
    #sec5 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{font-size: 2.5vw}

    #sec6 .contact .c0 .title{font-size: 6vw}
    #sec6 .contact .ct3 .inno ul li a{font-size: 3.8vw}
    #sec6 .contact .ct3 .inno ul li:last-child a{font-size: 4.3vw}
    #sec7 .cont08 p{font-size: 4vw}
    #sec7 .cont08 span{font-size: 2.8vw}
    #sec8 .info_wrap .info .info_tit{font-size: 4.1vw}
    #sec8 .info_wrap .info .txtwrap .listwrap .list li{font-size: 3vw}
    #sec8 .info_wrap .info .txtwrap{font-size: 3vw}
    #sec8 .info_wrap .info .txtwrap .call{font-size:3.8vw }

    #sec8 .main_db .db_list .db_tit{font-size: 5.7vw}
    #sec8 .main_db .db_list .db_subject{font-size: 19px}
    #sec8 .main_db .db_list .agree{font-size: 16px}
    #sec8 .main_db .db_list .db_btn{font-size: 18px}
    /*Style*/
    .ent{display: block}
    .Vertical_Line{margin: 10% auto;height: 14vw;}
    .tit{font-size: 8.3vw}
    #sec1 .videowrap .mb-img{width: 100%;}
    #sec2 .sec2_wrap{flex-direction: column;width: 100%;}
    #sec2 .txt{width: 100%;padding-left: 10%}
    #sec2 .txt .Vertical_Line{display: none}
    #sec2 .slidewrap{width: 100%;}
    #sec2 .Navigation_sec2{margin: 5% 0 10%}
    #sec2 .swiper-pagination-progressbar {position: relative;margin:5% auto 0;width: 80%;}
    #sec2 .txt h2::before{padding: 18%;bottom: auto;right: 3%}

    #sec3 .bann_wrap{flex-direction: column;}
    #sec3 .bann_wrap a .cont .line{height: 6vw}

    #sec4 .textwrap .box{margin: 0 auto 0 22%}
    #sec4 .textwrap .box h3{text-align: left}
    #sec4 .textwrap .line{margin: 5% auto;width: 80%;height: 1px;}
    #sec4 .textwrap .box2{margin: auto;width: 80%;}

    #sec5{padding: 15% 0}
    #sec5 .swiper-container{width: 100%;}
    #sec5 .swiper-container .bg_black{width: 100%;height: 55%;bottom: 0;padding: 4%}
    #sec5 .swiper-container .bg_black .s_box{bottom: 25%}
    #sec5 .swiper-container .bg_black .s_box .Vertical_Line{height: 6vw;}
    #sec5 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{padding: 2% 0}

    #sec6 .contact{flex-direction: column;}
    #sec6 .sec6_wrap{width: 85%;}
    #sec6 .contact .c0{border-right: none;border-bottom:2px dashed #e8e8e8; }
    #sec6 .contact .ct1{padding: 5% 0}
    #sec6 .contact .ct2{padding: 5% 0}
    #sec6 .contact .ct3{padding: 5% 0; border-bottom:none ;text-align: center}
    #sec6 .contact .ct3 .inno ul li{max-width: 500px;margin: 2% auto;text-align: left; display: inline-block}

    #sec7{padding: 15% 0}
    #sec8 .info_wrap{flex-direction: column;}
    #sec8 .info_wrap .info{width: 100%; background: url(/img/inno_H/main/sec8_bg-m.jpg) no-repeat center center;padding: 45% 0 15%;background-size: cover}
    #sec8 .info_wrap .info .info_tit{width: 80%;margin: auto}
    #sec8 .info_wrap .info .tit02{margin-top: 5%}
    #sec8 .info_wrap .info .txtwrap{width: 80%;margin: auto}

    #sec8 .mapwrap{width: 100%;order: -1}
    #sec8 .mapwrap .map{height: 450px !important; }
    #sec8 .main_db{width: 80%;left: 50%;top: 40%}
}
@media (max-width:600px){
     /*Font*/
    #sec8 .info_wrap .info .info_tit{font-size: 5.4vw}
    #sec8 .info_wrap .info .txtwrap .listwrap .list li{font-size: 4.2vw}
    #sec8 .info_wrap .info .txtwrap{font-size: 4vw}
    #sec8 .info_wrap .info .txtwrap .call{font-size:4.8vw }
     /*Style*/
}
@media (max-width:425px){
    /*Font*/
    #sec2 .txt h2{font-size: 10.5vw}
    #sec2 .txt p{font-size:4.1vw }
    #sec2 .layer_close{font-size: 16px}
    #sec3 .bann_wrap a .cont span{font-size: 4.3vw}
    #sec3 .bann_wrap a .cont .more{font-size: 12px}
    #sec5 .swiper-container .bg_black .s_box h3{font-size: 7vw}
    #sec5 .swiper-container .bg_black .s_box p{font-size: 4.5vw}
    #sec5 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{font-size:4vw }
    #sec6 .contact .ct3 .inno ul li a{font-size: 4.5vw}
    #sec6 .contact .ct3 .inno ul li:last-child a{font-size: 5.4vw}
    #sec8 .main_db .db_list .db_tit{font-size: 6.6vw}
    #sec8 .main_db .db_list .db_subject{font-size: 16px}
    #sec8 .main_db .db_list .agree{font-size: 14px}
    #sec8 .main_db .db_list .db_btn{font-size: 16px}

    /*Style*/
    #sec2 .swiper-slide a::after{width: 35px;height: 35px;}
    #sec2 .swiper-button-prev, #sec2 .swiper-button-next, #sec2 .swiper-button-pause{width: 30px;height: 30px;}
    #sec3 .bann_wrap a .cont .more{}
    #sec8 .main_db{padding: 3% 5% 5%}
    #sec5 .swiper-container .bg_black .s_box h3 .dt{display: none}
    #sec5 .swiper-container .bg_black .s_box .Vertical_Line{display: none}
    #sec5 .swiper-container .bg_black .s_box p{margin-top: 5%}
    #sec5 .swiper-button-prev, #sec5 .swiper-button-next, #sec5 .swiper-button-list{width: 25px;height: 25px;}
    #sec5 .swiper-container .bg_black .s_box{bottom: 35%}
}

@media (max-width:350px){

}