/* fullpage */
#fullpage{ transition: .7s; position: relative; top: 0;}
#fullpage.up{  top: -310px;}

/* 외부 css 가져오기 */
.mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; }
.mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: absolute; outline: 0 !important; -webkit-backface-visibility: hidden; }
.mfp-container {
    text-align: center;
    position: absolute;
    width: 100%;
    top: 50%; right:0; left: 0;
    transform: translateY(-50%);
    padding: 0 8px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  .mfp-content {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: 0 auto;
    text-align: left;
    z-index: 1045;
  }
  
  .mfp-content {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: 0 auto;
    text-align: left;
    z-index: 1045;
  }
  
  .mfp-auto-cursor .mfp-content {
    cursor: auto;
  }
  
  .mfp-iframe-holder .mfp-content {
    line-height: 0;
    width: 80%;

    /* max-width: 900px; */
  }
  
  .mfp-iframe-scaler {
    width: 100%; height: 0;
    overflow: hidden;
    padding-top: 56.25%;
  }
  
  .mfp-close {
    width: 44px; height: 44px;
    line-height: 44px;
    position: absolute;
    top: 0; right: 0;
    text-decoration: none;
    text-align: center;
    opacity: 0.65;
    padding: 0 0 18px 10px;
    color: #fff;
    font-style: normal;
    font-size: 28px;
    font-family: 'Open Sans', sans-serif;
  }
  
  button.mfp-close {
    overflow: visible;
    cursor: pointer;
    background: 0 0;
    border: 0;
    -webkit-appearance: none;
    display: block;
    outline: 0;
    padding: 0;
    z-index: 1046;
    -webkit-box-shadow: none;
    box-shadow: none;
  }
  
  .mfp-close-btn-in .mfp-close {
    color: #333;
  }
  
  .mfp-iframe-holder .mfp-close, .mfp-image-holder .mfp-close {
    color: #fff;
    right: -6px;
    text-align: right;
    padding-right: 6px;
    width: 100%;
  }
  
  .mfp-iframe-holder .mfp-close {
    top:-40px;
  }
  
  .mfp-iframe-scaler iframe {
    position: absolute;
    display: block;
    top: 0; left: 0;
    width: 100%; height: 100%;
    -webkit-box-shadow: 0 0 8px rgba(0,0,0,.6);
    box-shadow: 0 0 8px rgba(0,0,0,.6);
    background: #000;
  }
  
/* 1023px */
@media (max-width: 1023px) {
    .mfp-container {
        text-align: center;
        position: absolute;
        width: 100%;
        top: 5%; right:0; left: 0;
        transform: translateY(-50%);
        padding: 0 8px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
      }

      .mfp-iframe-holder .mfp-content {
        line-height: 0;
        width: 98%;
    
        /* max-width: 900px; */
      }
}



/* section0 */
#section0, #section6{ overflow: hidden; position: relative;}
#section0 .layer{ position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 9; background-color: #333; pointer-events: scroll; opacity: .1;}
#section0 .videoWrap, #section6 .videoWrap {position:relative; width: 100%; height:100%; top: 0; left: 0; margin:0; pointer-events: none;}
#section0 .videoWrap iframe, #section0 .videoWrap object, #section0 .videoWrap embed,
#section6 .videoWrap iframe, #section6 .videoWrap object, #section6 .videoWrap embed{ position:absolute; top:0; left:0; width:100%; height:100%; opacity: 1; transform: scale(1.2); pointer-events: none; }

#section0 .fullSlogan h3{ position: relative; opacity: 0; bottom: -100px; transition: 1.5s; transition-delay: 1s;}
#section0.active .fullSlogan h3{ bottom: 0; opacity: 1;}

#section0 .fullSlogan h2{ position: relative; opacity: 0; bottom: -100px; transition: 1.5s; transition-delay: 1.5s;}
#section0.active .fullSlogan h2{ bottom: 0; opacity: 1;}

#section0 .control{ font-size: 0; position: absolute; bottom: 80px; left: 0; right: 0; margin: 0 auto; width: 170px; text-align: center; z-index: 10;}
#section0 .control li{ display: inline-block; padding: 0 5px;}
#section0 .control li a{ display: block; font-size: 18px; color: #fff; width: 40px; height: 40px; line-height: 38px; border-radius: 50%; border: 2px solid #fff; text-align: center;}
#section0 .control li i{ color: #fff; position: relative; }

#section0 .control .play-pause a.hide{ display: none;}
#section0 .control .mute-onoff a.hide{ display: none;}

.vidbox .ratio iframe, .end-video .videoWrap iframe, #cutvideo1, #cutvideo2{pointer-events: none;}
.m-play{ display: none;}

.scrolldown{ position: absolute; bottom: 40px; z-index: 11;}

/* 1023px */
@media (max-width: 1023px) {
    #section0 .layer{ display: none;}
    #section0 .videoWrap{position:relative; width: 100%; height:129.33vw; top: 0; left: 0; margin:45px 0 0; z-index: 5; }
    #section6 .videoWrap {position:relative; width: 100%; height:0; padding-top: 56.25%; top: 0; left: 0; margin:0; z-index: 5; }
    #section0 .videoWrap, #section0 .videoWrap iframe, #section0 .videoWrap object, #section0 .videoWrap embed{ pointer-events: unset;}
    #section0 .videoWrap iframe, #section0 .videoWrap object, #section0 .videoWrap embed{ opacity: 1; transform: scale(2.4);}
    #cutvideo1, #cutvideo2{position: relative; width: 120%; height: 133.33vw; top: -35.67vw;}
    #section0 .fullSlogan { top: 43%; display: block; }
    #section0 .fullSlogan p { font-size:25px; font-weight:400; font-style:normal; line-height:25px; color:rgba(255,255,255,1); letter-spacing: 1px; text-shadow:rgba(51,51,51,0.4) 1px 0px 4px; background-color:rgba(0,0,0,0); padding:0; }
    
    #section0 .control li a{ display: block; font-size: 10px; color: #fff; width: 20px; height: 20px; line-height: 17px; border-radius: 50%; border: 1px solid #fff; text-align: center;}

    #section0 .control{ bottom: 30px; display: none; }
    #section0 .fullSlogan h3{ bottom: 0; opacity: 1;}
    #section0 .fullSlogan h2{ bottom: 0; opacity: 1;}
}



/* section1 */
#section1{ overflow: hidden; }
#section1 .wrap1438{ position: relative; display: table; height: 100%;  }
#section1 .wrap1438 .vertical{ display: table-cell; vertical-align: middle;}
#section1 .deco{ width: 888px; height: 888px; border-radius: 50%; background-color: #d7eb9e; display: block; position: absolute}
#section1 .deco1{ top: -444px; left: -444px;}
#section1 .deco2{ bottom: -444px; right: -444px;}
#section1 .wrap1438 .content-wrap{ overflow: hidden; width: 100%; height: 400px; margin-bottom: 20px; position: relative; bottom: -100px; transition: 1.5s; transition-delay: .8s; opacity: 0;}
#section1 .wrap1438 div.content-wrap:nth-child(2){ bottom: -100px; transition: 1.5s; transition-delay: 1.4s; opacity: 0; margin-bottom: 0; }
#section1 .wrap1438 .img-wrap{ width:760px; height: 400px; overflow: hidden;}
#section1 .wrap1438 .center .img-wrap iframe{ position: relative;}
#section1 .wrap1438 .text-wrap{ width: calc(100% - 760px); padding: 80px 50px 0;}
#section1 .wrap1438 .text-wrap.fl{ text-align: right;}
#section1 .wrap1438 .text-wrap.fr{ text-align: left;}
#section1 .wrap1438 .text-wrap h3{ font-size: 50px; line-height: 50px; padding-bottom: 50px; margin-bottom: 40px; position: relative; letter-spacing: -0.035em;}
#section1 .wrap1438 .text-wrap h3:after{ content: ''; display: block; position: absolute; bottom: 0; width: 40px; height: 2px; background-color: #6d6d6d;}
#section1 .wrap1438 .text-wrap.fl h3:after{ right: 0;}
#section1 .wrap1438 .text-wrap h4{ font-size: 16px; line-height: 16px; padding-bottom: 30px;}
#section1 .wrap1438 .text-wrap p{ font-size: 12px; line-height: 24px;}

#section1.active .wrap1438 div.content-wrap{ bottom: 0; opacity: 1; }

/* 1023px */
@media (max-width: 1023px) {
    #section1 .wrap1438{ position: relative;  padding-top: 0; padding-bottom: 0; display: block; height: auto;}
    #section1 .wrap1438 .vertical{ display: block; }
    #section1 .wrap1438 .content-wrap{ overflow: hidden; width: 100%; height: auto; margin-bottom: 0; opacity: 1; bottom: 0; }
    #section1 .wrap1438 div.content-wrap:nth-child(2){ opacity: 1; bottom: 0;}
    #section1 .wrap1438 .img-wrap{ width:100%; height: 60.00vw; overflow: hidden;}
    #section1 .wrap1438 .center .img-wrap iframe{ position: relative;}
    #section1 .wrap1438 .text-wrap{ width: 100%; padding: 40px 0 25px;}
    #section1 .wrap1438 .text-wrap.fl{ text-align: left;}
    #section1 .wrap1438 .text-wrap h3{ font-size: 25px; line-height: 25px; padding-bottom: 25px; margin-bottom: 20px; position: relative; letter-spacing: -0.035em;}
    #section1 .wrap1438 .text-wrap h3:after{ left: 10px; width: 20px; height: 1px; }
    #section1 .wrap1438 .text-wrap h4{ font-size: 13px; line-height: 13px; padding-bottom: 15px;}
    #section1 .wrap1438 .text-wrap p{ font-size: 11px; line-height: 19px;}

}




#section2{ overflow: hidden; }
#section2 .wrap1438{ height: auto;}
#section2 .deco{ width: 888px; height: 888px; border-radius: 50%; background-color: #d7eb9e; display: block; position: absolute}
#section2 .deco1{ top: -444px; right: -444px;}

#section2 .room-tit-wrap h3{ position: relative; bottom: -100px; transition: 1.5s; transition-delay: .8s; opacity: 0;}
#section2 .room-swiper{ position: relative;  bottom: -100px; transition: 1.5s; transition-delay: 1.4s; opacity: 0;}

#section2.active .room-tit-wrap h3{ bottom: 0; opacity: 1; }
#section2.active .room-swiper{ bottom: 0; opacity: 1; }

#section2.active .room-tit-wrap{ padding-bottom: 40px;}
/* 1023px */
@media (max-width: 1023px) {
    #section2{ overflow: hidden; padding-top: 40px; padding-bottom: 40px;}
    #section2 .room-tit-wrap h3{ bottom: 0; opacity: 1; }
    #section2 .room-swiper{ bottom: 0; opacity: 1; }
}


#section3 .img-wrap{ width: 100%; height: 100%; position: relative; text-align: center;}
#section3 p{ display: block; position: absolute; top: 54%; font-size: 50px; width: 100%; transition: 1.5s; transition-delay: .8s; opacity: 0; z-index: 10; text-align: center;}

#section3.active  p{ top: 48%; opacity: 1; }
/* 1023px */
@media (max-width: 1023px) {
    #section3{ position: relative; width: 100%; height: 0; padding-top: 56.25%;}
  #section3 .img-wrap{ width: 100%; height: 0; padding-top: 56.25%; position: relative;}
  #section3 p{ top: 44%; font-size: 22px; width: 100%; opacity: 1;}

}

#section4{ background-color: #839e38; }
#section4 .wrap1438{ height: auto;}
#section4 .tit-wrap{ padding-bottom: 70px; text-align: center; position: relative; bottom: -100px; transition: 1.5s; transition-delay: .8s; opacity: 0;}
#section4 .tit-wrap h3{ font-size: 50px; line-height: 50px; padding-bottom: 30px;}
#section4 .tit-wrap p{ font-size: 18px; }
#section4 ul{ display: flex; flex-wrap: wrap; justify-content: space-between; position: relative;  bottom: -100px; transition: 1.5s; transition-delay: 1.4s; opacity: 0;}
#section4 ul li{ width: 700px; height: 300px; margin-bottom: 40px;}
#section4 ul li:nth-child(3), #section4 ul li:nth-child(4){ margin-bottom: 0;}

#section4 ul li a{ display: block; position: relative; width: 100%; height: 100%; overflow: hidden; background-color: #fff; background-position: right top; background-repeat: no-repeat; background-size: 500px 300px; padding: 70px 0;}
#section4 ul li a .num{ font-size: 50px; position: absolute; top: 15px; left: 20px; line-height: 30px; z-index: 2;}
#section4 ul li a .num:after{ position: absolute; content: ''; display: block; width: 160px; height: 160px; border-radius: 50%; background-color: #839e38; top: -90px; left: -90px; z-index: -1;}

#section4 ul li a .left{ width: 220px; height: 100%; text-align: center; padding-top: 60px; border-right: 1px solid #839e38;}
#section4 ul li a .right{ width: calc(100% - 220px);  height: 100%; padding-left: 50px; padding-top: 20px;}
#section4 ul li a .right h3{ font-size: 20px; line-height: 20px; padding-bottom: 13px;}
#section4 ul li a .right p{ font-size: 14px; padding-bottom: 35px;}
#section4 ul li:hover .btn01{  border: 1px solid #839e38; background-color: #839e38; color: #fff;   }

#section4.active .tit-wrap{ bottom: 0; opacity: 1; }
#section4.active ul{ bottom: 0; opacity: 1; }
/* 1023px */
@media (max-width: 1023px) {
  #section4{ padding-top: 40px; padding-bottom: 40px;}
  #section4 .tit-wrap{ padding-bottom: 23px; text-align: center; bottom: 0; opacity: 1;}
  #section4 .tit-wrap h3{ font-size: 25px; line-height: 25px; padding-bottom: 8px;}
  #section4 .tit-wrap p{ font-size: 11px; }
  #section4 ul{ bottom: 0; opacity: 1; }
  #section4 ul li{ width: calc(50% - 7px); height: 40.00vw; margin-bottom: 15px;}
  #section4 ul li a{ background-image: unset!important; padding: 5.33vw 0 20px;}
  #section4 ul li a .num{ font-size: 25px; position: absolute; top: 7px; left: 10px; line-height: 20px; z-index: 2;}
  #section4 ul li a .num:after{ width: 80px; height: 80px; top: -45px; left: -45px; z-index: -1;}
  #section4 ul li a .left{ width: 100%; height: 35px; padding-top: 0; border-right: unset;}
  #section4 ul li a .left img{ height: 100%; object-fit: cover;}
  #section4 ul li a .right{ width: 100%;  height:auto; padding-left: 0; padding-top: 15px; text-align: center;}
  #section4 ul li a .right h3{ font-size: 12px; line-height: 12px; padding-bottom: 5px;}
  #section4 ul li a .right p{ font-size: 10px; padding-bottom: 12px;}
}


#section5{ padding-top: 0;}
#section5 .wrap1438{ width: 1518px; height: auto;}
#section5 .tit-wrap{ padding-bottom: 70px; text-align: center; position: relative; bottom: -100px; transition: 1.5s; transition-delay: .8s; opacity: 0;}
#section5 .tit-wrap h3{ font-size: 50px; line-height: 50px; padding-bottom: 30px;}
#section5 .tit-wrap span{ font-size: 18px; padding-bottom: 30px;}
#section5 .tit-wrap ul.tab{ padding-top: 30px;}
#section5 .tit-wrap ul.tab li{ display: inline-block; padding: 0 8px;}
#section5 .tit-wrap ul.tab li a.active{ border: 1px solid #839e38; background-color: #839e38; color: #fff;   }
#section5 .tab-con{ display: none; position: relative;  bottom: -100px; transition: 1.5s; transition-delay: 1.4s; opacity: 0;}
#section5 .tab-con.fac-wrap{ display: block;}

#section5.active .tit-wrap{ bottom: 0; opacity: 1; }
#section5.active .tab-con{ bottom: 0; opacity: 1; }
/* 1023px */
@media (max-width: 1023px) {
  #section5 .wrap1438{ width: 100%;}
  #section5{ padding-top: 40px; padding-bottom: 40px;}
  #section5 .tit-wrap{ padding-bottom: 21px; bottom: 0; opacity: 1;}
  #section5 .tit-wrap h3{ font-size: 25px; line-height: 25px; padding-bottom: 8px;}
  #section5 .tit-wrap span{ font-size: 11px; padding-bottom: 15px;}
  #section5 .tit-wrap ul.tab{ padding-top: 15px;}
  #section5 .tit-wrap ul.tab li{ display: inline-block; padding: 0 3px;}
  #section5 .tit-wrap ul.tab li a.active{ border: 1px solid #839e38; background-color: #839e38; color: #fff;   }
  #section5 .tab-con{ display: none; bottom: 0; opacity: 1;}
  #section5 .tab-con.fac-wrap{ display: block;}
}

#section0 .control li.play-pause a,
#section0 .control li.mute-onoff a {display:none;}
#section0 .control li.play-pause a:nth-of-type(1),
#section0 .control li.mute-onoff a:nth-of-type(1) {display:block;}
#section0 .control li.play-pause.on a:nth-of-type(1),
#section0 .control li.mute-onoff.on a:nth-of-type(1) {display:none;}
#section0 .control li.play-pause.on a:nth-of-type(2),
#section0 .control li.mute-onoff.on a:nth-of-type(2) {display:block;}
@media (max-width: 1024px) {
    /* #section0 .videoWrap iframe {min-width:120%;height:120%;} */
}
