/****************************************************
override
 *****************************************************/
@media screen and (max-width: 767.98px) {
    .globalNavigationBar {
        position: relative;
        background-color: #000;
    }
}

/****************************************************
utility
 *****************************************************/
.hoverItem {transition: filter .2s ease-out;}
.hoverItem:hover {filter: brightness(1.2); }

/****************************************************
page
 *****************************************************/
body {background: #0C0A14; }
.allContainer {position: relative; }

/**
headArea
 **/

.headArea {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 100%;
    background: url(https://static.ncsoft.jp/bns2/event/2307influencer/titleBg_m.webp) center top no-repeat;
    background-size: 100%;
    text-align: center;
}

.headArea__inner {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    padding-top: 28%;

}

.headArea__logo img {
    width: calc(276px / 2);
}

.headArea__h1 {
    padding: 0 4%;
}

.headArea__event {
    position: absolute;
    top: 4%;
    right: 0;
    width: calc(364 / 720 * 100%);
}

.headArea__preReservation {
    position: absolute;
    top: 5%;
    left: 5%;
    width: calc(140 / 720 * 100%);
}


/**
bodyArea
 **/

.bodyArea {
    width: 100%;
    background: url(https://static.ncsoft.jp/bns2/event/2307influencer/bodyBg_m.webp) center top no-repeat;
    background-size: 100%;
}

.bodyArea__inner {padding-bottom: 8%; }

.mainVideo {
    position: relative;
    background: url(https://static.ncsoft.jp/bns2/event/2307influencer/mainVideoBg_m.webp) center top no-repeat;
    background-size: 100%;
    height: 0;
    padding-top: calc(370 / 684 * 100%);
    margin-bottom: 6%;
    margin-left: auto;
    margin-right: auto;
}

.mainVideo__inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 3.5% 8% 0;
    text-align: center;
}

.sHead1 {
    width: calc(450 / 720 * 100%);
    margin: 0 auto;
    text-align: center;
}

.person {text-align: center; }
.person img {width: calc(576 / 720 * 100%);}
.person__txt {margin-top: 2px; }
.person__txt img {width: 32px; }


/**
myFooter
 **/
.myFooter {
    background: url(https://static.ncsoft.jp/bns2/event/2307influencer/footerBg_m.webp) center top no-repeat;
    background-size: 100%;
    padding-top: 16%;
    padding-bottom: 32%;
    text-align: center;
}

.sHead2 {margin-bottom: 8%;}
.ssHead img {
    width: calc(194 / 720 * 100%);
    margin-bottom: calc(16 / 720 * 100%);
}
.code {
    position: relative;
    height: 0;
    padding-top: calc(122 / 720 * 100%);
    background: url(https://static.ncsoft.jp/bns2/event/2307influencer/codeBase.webp);
    background-size: contain;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: calc(60 / 720 * 100%);
    font-family: serif;
    font-style: italic;
    font-size: 24px;
}
.code__inner {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 1%;
}
.btnArea img {width: calc(476 / 720 * 100%); margin-right: calc(32 / 720 * -100%); }



/****************************************************
PC VIEW
 *****************************************************/

@media screen and (min-width: 768px) {

    .globalNavigationBar {
        min-width: 1220px;
    }

    .box {min-width: 1220px; }
    .box__inner {width: 1220px; margin-left: auto; margin-right: auto; }

    .headArea {
        height: 560px;
        background-image: url(https://static.ncsoft.jp/bns2/event/2307influencer/titleBg.webp);
        background-size: auto;
        padding-top: 104px;
    }

    .headArea__inner {
        width: auto;
        height: auto;
        padding-top: 0;
        position: static;
        left: auto;
        top: auto;
    }

    .headArea__event {
        width: 280px;
        top: 72px;
    }

    .headArea__preReservation {
        display: none;
    }

    .bodyArea {
        background-image: url(https://static.ncsoft.jp/bns2/event/2307influencer/bodyBg.webp);
        background-size: auto;
    }

    .bodyArea__inner {
        padding-top: 24px;
        padding-bottom: 48px;
    }

    .myFooter {
        background-image: url(https://static.ncsoft.jp/bns2/event/2307influencer/footerBg.webp);
        background-size: auto;
        padding-top: 172px;
        padding-bottom: 96px;
    }

    .mainVideo {
        width: 724px;
        height: 370px;
        background: url(https://static.ncsoft.jp/bns2/event/2307influencer/mainVideoBg.webp);
        padding-top: 0;
    }

    .mainVideo__inner {padding-top: 3%; }

    .person img {width: auto; }
    .person--1 img {margin-right: -12px; }
    .person--2 img {margin-left: -12px; }
    .person__txt {margin-top: 12px; }
    .person__txt img {width: auto; }

    .sHead2 {margin-bottom: 60px; }

    .ssHead {margin-top: 48px; }
    .ssHead img {width: auto; }

    .code {
        width: 720px;
        height: 122px;
        padding-top: 0;
        margin-bottom: 72px;
        font-size: 46px;
    }

    .btnArea img {width: auto; }

}


/****************************************************
footer
 *****************************************************/
.footer{display:flex;justify-content:center;align-items:flex-end;position:absolute;bottom:0;z-index:1;width:100%;height:152px;padding-bottom:10px;background:url("https://t-statics.plaync.com/teaser/jp/img/footer_bg.png") repeat-x 50% 0 rgba(0,0,0,0); pointer-events: none; }
.footer_content{display:flex;flex-direction:column;justify-content:flex-end;align-items:center}.footer_content__copy{margin-top:14px;font-size:1.1rem;opacity:.2;color:#fff; font-size: 10px; text-align: center; padding-left: 1em; padding-right: 1em;  }
