/* fullpage */
#fullpage{ transition: .7s; position: relative; top: 0;}
#fullpage.up{  top: -310px;}


/* section0 */
#section-top, #section-last{ overflow: hidden; position: relative;}
#section-top .layer{ position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 9; background-color: #333; pointer-events: scroll; opacity: .1;}
#section-top .videoWrap, #section-last .videoWrap {position:relative; width: 100%; height:100%; top: 0; left: 0; margin:0; pointer-events: none;}
#section-top .videoWrap iframe, #section-top .videoWrap object, #section-top .videoWrap embed,
#section-last .videoWrap iframe, #section-last .videoWrap object, #section-last .videoWrap embed{ position:absolute; top:0; left:0; width:100%; height:100%; opacity: 1; transform: scale(1.2); pointer-events: none; }

#section-top .fullSlogan h3{ position: relative; opacity: 0; bottom: -100px; transition: 1.5s; transition-delay: 1s;}
#section-top.active .fullSlogan h3{ bottom: 0; opacity: 1;}

#section-top .fullSlogan h2{ position: relative; opacity: 0; bottom: -100px; transition: 1.5s; transition-delay: 1.5s;}
#section-top.active .fullSlogan h2{ bottom: 0; opacity: 1;}

#section-top .control{ font-size: 0; position: absolute; bottom: 80px; left: 0; right: 0; margin: 0 auto; width: 170px; text-align: center; z-index: 10;}
#section-top .control li{ display: inline-block; padding: 0 5px;}
#section-top .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;}
#section-top .control li i{ color: #fff; position: relative; }

#section-top .control .play-pause a.hide{ display: none;}
#section-top .control .mute-onoff a.hide{ display: none;}

.section{ font-size: 0;}
.tit-wrap{ position: absolute; top: calc(50% - 100px); text-align: left; pointer-events: unset; z-index: 100; pointer-events: unset; left: 0; right: 0; margin: 0 auto;}
.tit-wrap h3{ font-size: 64px; padding-bottom: 50px; letter-spacing: 0.04em; width: 509px;}
.tit-wrap h3 img{ width: 100%;}
.tit-wrap .flex-wrap{ justify-content: flex-start; align-items: flex-start;}
.tit-wrap .line{ width: 116px; height: 2px; background-color: #fff; position: relative; top: 10px;}
.tit-wrap .text-wrap{padding-left: 30px;}
.tit-wrap .text-wrap h4{ font-size: 20px; padding-bottom: 20px; letter-spacing: 0.04em;}
.tit-wrap .text-wrap p{ font-size: 12px; line-height: 24px; opacity: .6;}
@media (max-width: 1023px) {
    #section-top .layer{ display: none;}
    #section-top .videoWrap, #section-last .videoWrap {position:relative; width: 100%; height:0; padding-top: 56.25%; top: 0; left: 0; margin:0; z-index: 5; }
    #section-top .videoWrap, #section-top .videoWrap iframe, #section-top .videoWrap object, #section-top .videoWrap embed{ pointer-events: unset;}
    #section-top .videoWrap iframe, #section-top .videoWrap object, #section-top .videoWrap embed{ opacity: 1; transform: scale(1);}
    #cutvideo1, #cutvideo2{position: relative; width: 120%; height: 133.33vw; top: -35.67vw;}
    #section-top .fullSlogan { top: 43%; display: block; }
    #section-top .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; }
    
    #section-top .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;}

    #section-top .control{ bottom: 30px; display: none; }
    #section-top .fullSlogan h3{ bottom: 0; opacity: 1;}
    #section-top .fullSlogan h2{ bottom: 0; opacity: 1;}


    .section:first-child{  margin-top: 50px;}
    .section:not(.fp-auto-height){ width: 100%; height: 56.25vw; margin-bottom: 2px;}
    .section img{ width: 100%; object-fit: cover;}
    .tit-wrap{ position: absolute; padding-top: 20.00vw; top: 0; text-align: center; pointer-events: none; z-index: 100;  left: 0; right: 0; margin: 0 auto;}
    .tit-wrap h3{ font-size: 30px; padding-bottom: 10px; letter-spacing: 0.04em; width: 300px; position: relative; left: 0; right: 0; margin: 0 auto;}
    .tit-wrap .flex-wrap{ justify-content: center; align-items: flex-start;}
    .tit-wrap .line{ width: 58px; height: 1px; background-color: #fff; position: relative; top: 5px;}
    .tit-wrap .text-wrap{padding-left: 10px;}
    .tit-wrap .text-wrap h4{ font-size: 12px; padding-bottom: 0; letter-spacing: 0.04em;}
}



#section-cut .videoWrap{ width: calc(50% - 10px); height: 0; padding-top: 28.12%; position: relative; overflow: hidden;}
#section-cut .videoWrap iframe{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; pointer-events: none;}
@media (max-width: 1023px) {
    #section-cut{ background-image: unset!important; height: auto!important; font-size: 0;}
    #section-cut .wrap1720{ width: 100%; max-width: 100%; padding: 0;}
    #section-cut .videoWrap{ width: 100%; padding-top: 56.25%; margin-bottom: 2px;}
    #section-cut .videoWrap:last-child{ margin-bottom: 0;}
    #section-last .videoWrap iframe, #section-last .videoWrap object, #section-last .videoWrap embed {transform: scale(1);}
    /* #section-cut .videoWrap iframe{ width: 110%; height: 110%; top: -5%; left: -5%;} */
    #section-cut .videoWrap iframe{ width:100%; height:100%; top:0; left:0;}
}