@charset "utf-8";

#main-wrap { width: 100%; height: 100vh; overflow: hidden;margin: 0px auto; position: relative;}

.main_h_area {position:absolute; top:0; left:0; width:80%;}
.main_h_area .header_top:after {background: none !important;}
.main_f_area{position:absolute; bottom:0; width:100%;}

.main_h_area .gnb_ul>li>a {color:#fff}
.main_h_area  .top_shortcuts a {color:#fff}

video { width: 100%; height: 100vh; z-index: -50; overflow: hidden; position: fixed; object-fit: cover;} 
.bg-video {position: absolute;top: 0;left: 0;height: 100%;width: 100%;z-index: -50;overflow: hidden; object-fit: cover;}

main {position:absolute; width:85%; height: 85vh; left:7.5%;   top:120px  }


.main_vs{position:relative; width:100%; }
.main_vs .scroll_btn{text-indent: -999px; font-size: 0; position: absolute; width:62px; height: 39px; display: block; background: url(../images/main_circelarrow.png) no-repeat center; z-index: 11;
left:4%; top:70px}
.main_vs .scroll_btn:before{display: block; content: ''; position: absolute; top: 17px; left: 27px;
     background: url(../images/main_circel.png) no-repeat center / cover; width: 140px; height: 140px; animation: scrollDown 10000ms infinite linear;transform: translate(-50%, -50%);}

.irisslogan{color:#fff; font-size: 3.5rem;    font-family: 'onemobiletitle'; text-align: center; margin-top: 250px}
.irisslogan span {display: inline-block; margin: 0 15px; position:relative}
.irisslogan span:after{position:absolute; content: ''; width: 1px; height: 30px; background: #fff; top:10px; right:-23px }
.irisslogan span:last-child:after {display: none;}


@keyframes scrollDown {
    100% {
      transform: translate(-50%, -50%) rotate(360deg);
    }
  }


#main-wrap button {    color: inherit;    font-family: inherit;    background-color: rgba(0, 0, 0, 0);    border: none;    outline: none;}
.scroll-box {    display: inline-block;    position: absolute;    left: 48%;    bottom: 20%;    z-index: 1}
.scroll-box__text {    display: inline-block;    font-size: 1.4rem;    font-weight: 500;    line-height: 1;    color: #fff;    letter-spacing: 1.2px; margin-top: 10px;}
.scroll-box__wrap {    display: inline-block;    position: relative;    width: 100%;    height: 46px}
.scroll-icon {    display: inline-block;    position: absolute;    bottom: 0;    left: 0;    width: 100%;    height: 100%;    background-image: url("../images/mouseicon.png");
    background-position: center;    background-size: auto;    background-repeat: no-repeat;    animation: scrollAni 1.2s reverse infinite}

@-webkit-keyframes scrollAni {
    0% {
        bottom: 0
    }

    50% {
        bottom: -5px
    }

    100% {
        bottom: 0
    }
}
  

/* 메인소식 */
.main_popupArea {position:absolute; right:0; top:0px; width:350px; }
.pop_box {border:1px solid #3f4c65; border-radius: 15px; padding: 15px; color:#fff; margin-bottom: 15px;}
.pop_box dl dt {font-size: 1.9rem; font-weight: bold; margin-bottom: 10px;}
.main_popupArea a:first-child dl dt {color:#ebd26e}
.main_popupArea a:nth-child(2) dl dt {color:#97eb6e}
.pop_box dl dd {font-weight: 100; font-size: 1.6rem;}
.pop_box dl dd p {font-size: 1.3rem; color:#8890a0}
.main_popupArea a.mpopmore {color:#fff; font-size: 1.5rem;  float: right;}
.pop_box:hover{border-color: #fff;}


@media (max-width:1600px){

    .main_popupArea {right:-80px}
    .irisslogan {margin-top: 280px;}
    

}


@media (max-width:1400px){

  

    }
    
    @media (max-width:1280px){

      
        #mfooter {min-height:80px ;}
        
        .main_popupArea{display: none;}

     
    }
    
    @media (max-width:960px){
     

    }
    
    @media (max-width:768px){
    
        .irisslogan {font-size: 2.5rem;}
        .irisslogan span:after{height: 18px; top:8px; right:-20px }
    
    }

    @media (max-width:640px){
    
     
    
    }


    @media (max-width:480px){
        .irisslogan {margin-top: 250px;}
        .irisslogan span {display: block; font-size: 3rem; margin-bottom: 15px;}    
        .irisslogan span:after{display: none;}
    }