.sp-pv-body {
    position: absolute;
    z-index: 1;
    pointer-events: none;
}

.sp-pv-body .c-pv-block {
    pointer-events: all;
}

.sp-pv-body header {
    pointer-events: none;
    opacity: 0;
}

body {
    margin: 0;
}

button {
    background: none;
    border: none;
    outline: none;
    box-shadow: none;
}

.c-img-popup-bg {
    height: 100vh;
    width: 100vw;
}

.sp-body {
    display: none;
}

.pc-body {
    display: none;
}

.btn-general {
    opacity: 100%;
    transition: opacity 0.5s ease-out 0s
}

.btn-click {
    opacity: 0%;
    pointer-events: none;
}

.btn-hover {
    opacity: 0%;
    transition: opacity 0.5s ease-out 0s, transform 0.5s ease-out 0s;
}

.btn-general:active+.btn-hover {
    opacity: 0%;
    transform: translate(-50%, 0) scale(1);
}

.btn-general:active {
    opacity: 0%;
}

.btn-general:active+.btn-click {
    opacity: 100%;
}

.btn-hover:active+.btn-click {
    opacity: 100%;
}

.btn-checked {
    display: none;
}

.btn-notChecked {
    display: inline;
}

li img {
    vertical-align: bottom;
}

li {
    list-style: none;
}

ul {
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0px;
    unicode-bidi: isolate;
    list-style: none;
}

/* ==== shared rules moved from rezoriri.css/rezoriri_x.css ==== */
@media (min-width:768px) {
    .sp-pv-body {
        left: -10000%;
        top: -10000%;
    }

    .main-bg {
        position: fixed;
        background-image: url('pc/img/Bg_Main.png');
        z-index: -10;
        height: 100vh;
        width: 100vw;
        margin: 0 0 0 0;
    }

    .option-lable-1 div {
        position: absolute;
        width: 318px;
        height: 66px;
        top: -40px;
        transform: translate(-50%, 0px);
        left: -160px;
        font-size: 12px;
        pointer-events: none;
        transition: transform 0.5s ease-out 0s;
    }

    label.option-lable-1 p {
        padding: 23px 0 0 0;
    }

    .option-lable-1 .btn-general:hover~div {
        transform: translate(-50%, 0) scale(1.05);
    }

    .option-lable-1 .btn-hover:hover~div {
        transform: translate(-50%, 0) scale(1.05);
    }

    .pc-p1-btn-right:hover~.pc-p1-qr-box {
        opacity: 100%;
    }

    .c-gotop-btn .btn-general:hover+.btn-hover {
        opacity: 0%;
        transform: translate(-39%, -39%) scale(1);
    }

    .c-gotop-btn .btn-general:hover {
        opacity: 100%;
        transform: translate(-39%, -39%) scale(1.05);
    }

    .c-gotop-btn .btn-hover:hover {
        opacity: 100%;
        transform: translate(-39%, -39%) scale(1.05);
    }

    .btn-general:hover+.btn-hover {
        opacity: 100%;
        transform: translate(-50%, 0) scale(1.05);
    }

    .btn-hover:hover {
        opacity: 100%;
        transform: translate(-50%, 0) scale(1.05);
    }

    .c-pc-content .hide-switch {
        opacity: 0;
    }

    .pc-body {
        display: block;
        min-width: 1024px;
        overflow: hidden;
    }

    #dmm_ntgnavi {
        background: url(images/bg_navimain.gif) center center repeat-x;
        border-bottom: 1px solid #ccc;
        border-top: 1px solid #ccc;
        font-size: 12px;
        font-family: 'メイリオ', 'Meiryo', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', Verdana, sans-serif;
        display: flex;
        justify-content: space-between;
    }

    #dmm_ntgnavi ul {
        list-style: none;
        margin: 2px 0;
        padding: 0;
        display: flex;
        width: 50%;
    }

    #dmm_ntgnavi ul li {
        margin: 0 6px 0 0;
        line-height: 15px;
    }

    #dmm_ntgnavi .navi_left li>a {
        display: block;
        padding: 0 3px 0 8px;
        text-decoration: none;
        border: 1px solid #eee;
        border-radius: 3px;
    }

    #dmm_ntgnavi .navi_left li>a:hover {
        background: #eee;
        border: 1px solid #666;
        border-radius: 3px;
    }

    #dmm_ntgnavi .navi_left li>a span {
        display: block;
        padding: 9px 10px 7px 28px;
        color: #333;
        font-weight: bold;
    }

    #dmm_ntgnavi .navi_left li.dmm_top img {
        margin: 8px 5px 8px 0;
    }

    #dmm_ntgnavi .navi_left li.ntg_top {
        margin-left: 10px;
    }

    #dmm_ntgnavi .navi_left li.ntg_top span {
        background: url(images/bg_bt_olgtop.gif) 0 center no-repeat;
    }

    #dmm_ntgnavi .navi_right {
        justify-content: flex-end;
        font-size: 10px;
    }

    #dmm_ntgnavi .navi_right li {
        margin: 0 10px 0 0;
        padding: 8px 5px;
    }

    #dmm_ntgnavi .arrow {
        padding-left: 14px;
        background: url(images/arrow_common.gif) no-repeat left center;
    }

    #dmm_ntgnavi .tx-point {
        font-size: 16px;
        font-weight: bold;
        color: #ff4b4b !important;
    }

    #dmm_ntgnavi p {
        margin: 0;
        line-height: 2.6em;
    }

    #dmm_ntgnavi .clear {
        clear: both;
    }

    .c-gotop-btn {
        height: 100px;
        width: 100%;
        position: fixed;
        text-align: right;
        top: calc(100vh - 120px);
        z-index: 10000;
        margin: 0;
        pointer-events: none;
        display: none;
    }

    .c-gotop-btn a {
        pointer-events: all;
    }

    .c-gotop-btn.show {
        display: block;
    }

    .c-gotop-btn img {
        right: -50px;
        height: auto;
        position: absolute;
        transform: translate(-39%, -39%);
    }

    .feature-header {
        min-height: 994px;
        margin: 0 auto;
        position: relative;
    }

    .c-img-p1-bg {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .option-1 {
        position: absolute;
        left: 50%;
        transform: translate(-50%, 0px);
        text-align: center;
    }

    .option-1 input {
        display: none;
    }

    .img-option-lable-1 {
        position: absolute;
        left: -160px;
        top: -40px;
        transform: translate(-50%, 0px);
    }

    .img-option-lable-2 {
        position: absolute;
        left: 160px;
        top: -40px;
        transform: translate(-50%, 0px);
    }

    .img-option-lable-3 {
        position: absolute;
        left: 0px;
        top: 0;
        transform: translate(-50%, 0px);
    }

    img.img-chain-up {
        left: 50%;
        transform: translate(-50%, 0);
        position: absolute;
    }

    .c-sec-gallery {
        min-height: 996px;
        margin: 0 auto;
        position: relative;
    }

    .c-img-gallery-title {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 156px;
        left: calc(50% - 410px);
    }

    .c-gallery-list {
        position: absolute;
        top: 765px;
        left: 50%;
        width: 195px;
        transform: translate(-150%, 0);
    }

    .c-gallery-list ul {
        display: flex;
    }

    .c-gallery-list li {
        margin: 0px 0px 0px 0px;
        position: relative;
    }

    .c-gallery-list li ::marker {
        display: none;
    }

    .img-gallery-cg-bg {
        height: auto;
        position: absolute;
        top: 94px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .gallery-video-box {
        position: absolute;
        overflow: hidden;
        top: 307px;
        left: calc(50% + 2px);
        transform: translate(-50%, 0);
        width: fit-content;
        height: fit-content;
    }

    .c-gallery-box video {
    }

    .c-gallery-list img {
        margin: 0px 0px;
        height: auto;
    }

    .gallery-btn-general {
        opacity: 100%;
    }

    .c-gallery-list li img:nth-child(2) {
        transform: translate(0%, -100%);
        transition: opacity 0.5s ease-out 0s, transform 0.5s ease-out 0s;
    }

    .c-gallery-list li img:nth-child(3) {
        pointer-events: none;
        transform: translate(0%, -200%);
        transition: opacity 0.5s ease-out 0s;
    }

    .c-gallery-box .gallery-item {
        transition: opacity 0.5s ease-out 0s;
    }

    .gallery-btn-hover {
        opacity: 0%;
        transform: translate(0%, -100%) scale(1) !important;
    }

    .gallery-btn-general:hover+.gallery-btn-hover {
        opacity: 100%;
        transform: translate(0%, -100%) scale(1.05) !important;
    }

    .gallery-btn-hover:hover {
        opacity: 100%;
        transform: translate(0%, -100%) scale(1.05) !important;
    }

    .gallery-btn-hover.hide-switch {
        opacity: 0;
    }

    .gallery-arrow {
        height: auto;
    }

    .img-gallery-left-arrow {
        position: absolute;
        left: calc(50% - 450px);
        top: 481px;
        transform: translate(-50%, 0);
    }

    .c-sec-story {
        margin: 0vw auto 0 auto;
        position: relative;
        min-height: 1339px;
    }

    .c-pv-block {
        position: absolute;
        top: 257px;
        overflow: hidden;
        left: calc(50%);
        transform: translate(-50%, 0px);
    }

    .c-pv-block video {
    }

    .c-img-story-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        left: 50%;
        transform: translate(-50%, 0);
        top: 50px;
    }

    .c-img-story-title {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 260px;
        left: calc(50% - 210px);
    }

    .c-img-story-text {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 440px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-story-video-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 245px;
        left: 50%;
        transform: translate(-50%, 0);
        z-index: 0;
    }

    .c-sec-campaign-login {
        position: relative;
        min-height: 1460px;
        margin: 0vw auto 0 auto;
        overflow: visible;
    }

    .c-img-campaign-login-hero-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: -275px;
        left: calc(50% + 65px);
    }

    .c-img-campaign-login-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        left: 50%;
        transform: translate(-50%, 0);
        top: -145px;
    }

    .c-img-campaign-login-title {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 310px;
        left: calc(50% - 260px);
    }

    .c-img-campaign-login-word {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 430px;
        left: calc(50% - 305px);
    }

    .c-img-campaign-login-content {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 550px;
        left: 51%;
        transform: translate(-50%, 0);
    }

    .c-sec-p5 {
        position: relative;
        min-height: 1382px;
        margin: 0vw auto 0 auto;
        overflow: visible;
    }

    .c-img-p5-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        left: 46%;
        transform: translate(-50%, 0);
        top: -120px;
    }

    .c-p5-btn img {
        height: auto;
        position: absolute;
        top: 735px;
        left: 49%;
        transform: translate(-50%, 0);
    }

    .c-sec-p5 .option-1 {
        top: 1175px;
    }

    .c-sec-campaign-draw {
        position: relative;
        min-height: 1500px;
        margin: -0vw auto 0 auto;
    }

    .c-img-campaign-draw-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 150px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .campaign-draw-num-box {
        display: flex;
        margin: 0 10px;
    }

    .campaign-draw-num {
        height: auto;
        margin: 0vw -15px;
    }

    .campaign-draw-num-container {
        display: flex;
        top: 295px;
        left: 50%;
        transform: translate(-50%, 0);
        position: absolute;
    }

    .campaign-draw-comma {
        height: auto;
    }

    .campaign-draw-comma-1 {
        margin: 0vw -35px;
    }

    .campaign-draw-comma-2 {
        margin: 0vw -35px;
    }

    .c-sec-campaign-x {
        position: relative;
        min-height: 1050px;
        margin: 0 auto 0 auto;
        overflow: visible;
    }

    .c-img-campaign-x-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 15px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .img-campaign-x-btn {
        height: auto;
        position: absolute;
        top: 720px;
        left: 49%;
        transform: translate(-50%, 0);
    }

    .c-sec-character {
        position: relative;
        min-height: 1600px;
        margin: 0vw auto 0 auto;
    }

    .c-character-list {
        width: 0px;
        position: absolute;
        top: 840px;
        left: calc(50% - 465px);
    }

    .character-list-01 {
        margin: 0 0 0 0;
    }

    .character-list-02 {
        margin: 0% -26% 0 0;
    }

    .c-sec-character ul {
        display: inline-flex;
    }

    .c-img-character-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 195px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-character-title {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 315px;
        left: calc(50% - 465px);
    }

    .character-btn-general {
        opacity: 100%;
    }

    .character-btn-hover {
        opacity: 0%;
        transform: scale(1);
    }

    .character-btn-general:hover+.character-btn-hover {
        opacity: 100%;
        transform: translate(0%, -100%) scale(1.05) !important;
    }

    .character-btn-hover:hover {
        opacity: 100%;
        transform: translate(0%, -100%) scale(1.05) !important;
    }

    .character-box {
        transition: opacity 0.5s ease-out 0s;
    }

    .c-character-list li img:nth-child(2) {
        transform: translate(0%, -100%);
        transition: opacity 0.5s ease-out 0s, transform 0.5s ease-out 0s;
    }

    .c-character-list li img:nth-child(3) {
        pointer-events: none;
        transform: translate(0%, -200%);
        transition: opacity 0.5s ease-out 0s;
    }

    .character-btn-hover.hide-switch {
        opacity: 0;
    }

    .c-character-list img {
        height: auto;
        margin: 0 -24px;
    }

    .img-character-hero {
        height: auto;
        position: absolute;
        top: 192px;
        left: 56.6%;
        transform: translate(-50%, 0);
    }

    .img-character-left-arrow {
        position: absolute;
        left: calc(50% - 350px);
        transform: translate(-50%, 0);
    }

    .img-character-right-arrow {
        position: absolute;
        left: calc(50% + 350px);
        transform: translate(-50%, 0);
    }

    .character-arrow {
        top: 1329px;
        height: auto;
    }

    .pc-sec-special {
        margin: 0 auto 0 auto;
        position: relative;
        min-height: 1350px;
        overflow: hidden;
    }

    .special-btn-general {
        opacity: 100%;
    }

    .special-btn-hover {
        opacity: 0%;
        transform: scale(1);
    }

    .special-btn-general:hover+.special-btn-hover {
        opacity: 100%;
        transform: translate(0%, -100%) scale(1.05) !important;
    }

    .special-btn-hover:hover {
        opacity: 100%;
        transform: translate(0%, -100%) scale(1.05) !important;
    }

    .special-btn-hover.hide-switch {
        opacity: 0;
    }

    .c-special-list {
        position: absolute;
        top: 980px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .pc-sec-special ul {
        display: inline-flex;
    }

    .pc-sec-special ul li {
        width: 77px;
        text-align: center;
    }

    .c-img-special-bg {
        height: auto;
        position: absolute;
        top: 100px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-special-title {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 263px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-special-content-bg {
        height: auto;
        position: absolute;
        top: 365px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-special-box {
        position: absolute;
        top: 395px;
        left: 50%;
        display: flex;
        transform: translateX(-50%);
        transition: transform 0.5s ease-out 0s;
        width: 990px;
    }

    .c-special-box div {
        position: absolute;
    }

    .special-arrow {
        top: 995px;
        height: auto;
    }

    .img-special-left-arrow {
        position: absolute;
        left: calc(50% + -275px);
        transform: translate(-50%, 0);
    }

    .img-special-right-arrow {
        position: absolute;
        left: calc(50% + 275px);
        transform: translate(-50%, 0);
    }

    .c-special-box .img-special-content {
        height: auto;
        user-select: none;
        -moz-user-select: none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        touch-action: none;
        margin: 0 15px;
    }

    .c-special-list img {
        height: auto;
    }

    .c-special-list li img:nth-child(2) {
        transform: translate(0%, -100%);
        transition: opacity 0.5s ease-out 0s, transform 0.5s ease-out 0s;
    }

    .c-special-list li img:nth-child(3) {
        pointer-events: none;
        transform: translate(0%, -200%);
        transition: opacity 0.5s ease-out 0s;
    }

    .c-sec-x {
        margin: 0 auto;
        position: relative;
        min-height: 1200px;
    }

    .c-img-x-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 185px;
        left: 51.5%;
        transform: translate(-50%, 0);
    }

    .c-x-content {
        width: 530px;
        height: 754px;
        position: absolute;
        top: 422px;
        left: 50%;
        transform: translate(-50%, 0);
        z-index: 1;
        overflow: hidden;
    }

    .img-x-btn {
        height: auto;
        position: absolute;
        top: 820px;
        left: 50.5%;
        transform: translate(-50%, 0);
    }

    .c-sec-notice {
        margin: 0 auto 0 auto;
        position: relative;
        min-height: 1300px;
        overflow: visible;
    }

    .c-img-notice-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 10px;
        left: 51.5%;
        transform: translate(-50%, 0);
    }

    .page-feature footer {
        margin: 146px 0 0 0;
    }

    .page-feature .feature-contents>section {
        min-height: 600px;
        margin: 0 auto;
        text-align: center;
        overflow: hidden;
    }

    .c-divion-bottom {
        margin: 100px 0 0 0;
    }

    .c-copyright {
        margin: 10px;
        display: block;
        color: white;
    }

    .c-img-P10-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: -140px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-sec-P12 {
        margin: 0 auto;
        position: relative;
        min-height: 1300px;
    }

    .c-img-P12-bg {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 180px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-P12-content {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 450px;
        left: 50.2%;
        transform: translate(-50%, 0);
    }

    .c-img-P12-title {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 335px;
        left: 49.5%;
        transform: translate(-50%, 0);
    }

    .c-img-P12-copy {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 1200px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .img-P12-btn {
        height: auto;
        position: absolute;
        top: 750px;
        left: calc(50% - 240px);
        transform: translate(-50%, 0);
    }

    .img-P12rule-btn {
        height: auto;
        position: absolute;
        top: 750px;
        left: calc(50% + 240px);
        transform: translate(-50%, 0);
    }

    .popup {
        top: 0;
        width: 100%;
        text-align: center;
        position: fixed;
        z-index: 10;
        height: 100vh;
        opacity: 0;
        transition: opacity 0.5s ease-out 0s;
        pointer-events: none;
    }

    .c-spec-popup.show {
        opacity: 100;
        pointer-events: all;
    }

    .c-rule-popup.show {
        opacity: 100;
        pointer-events: all;
    }

    .c-dgp-popup.show {
        opacity: 100;
        pointer-events: all;
    }

    .id-img-popup-bg {
        margin: 0;
        padding: 0;
        position: absolute;
        top: -55px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-popup-item {
        margin: 0;
        padding: 0;
        position: absolute;
        top: 50vh;
        left: 50%;
        height: auto;
        transform: translate(-50%, -50%);
    }

    .c-img-popup-ruleitem {
        margin: 0;
        padding: 0;
        position: absolute;
        top: 50vh;
        left: 50%;
        height: auto;
        transform: translate(-50%, -50%);
    }

    .c-img-spec-text-01 {
        text-align: left;
        position: absolute;
        top: calc(50vh + -255px);
        left: 50%;
        transform: translate(-50%, 0);
        font-size: 40px;
        color: #FFFFFF;
        font-weight: 900;
    }

    .c-img-spec-text-02 {
        text-align: left;
        position: absolute;
        top: calc(50vh + -110px);
        left: 50%;
        transform: translate(-50%, 0%);
        font-size: 32px;
        color: #572979;
        font-weight: 600;
    }

    .c-img-spec-text-03 {
        text-align: left;
        position: absolute;
        top: calc(50vh + -150px);
        left: 50%;
        transform: translate(-50%, 0%);
        font-size: 24px;
        width: 720px;
        color: #BBEEFF;
        font-weight: 600;
        padding: 0px 25px 0 45px;
        height: 255px;
        overflow-y: scroll;
        white-space: break-spaces;
    }

    .c-img-spec-text-03::-webkit-scrollbar {
        width: 5px;
    }

    .c-img-spec-text-03::-webkit-scrollbar-track {
        background-image: url("images/通用_ScrollBar_A1.png");
        background-repeat: repeat-y;
    }

    .c-img-spec-text-03::-webkit-scrollbar-thumb {
        background-image: url("images/通用_ScrollBar_A2.png");
        background-repeat: repeat-y;
    }

    .c-img-spec-text-03 p {
        margin: 0;
        line-height: 1.25;
    }

    .c-spec-popup-btn {
        top: calc(50vh + 110px);
        height: auto;
        position: absolute;
        transform: translate(-50%, 0);
        left: 50%;
    }

    .c-rule-popup-btn {
        top: calc(50vh + 110px);
        height: auto;
        position: absolute;
        transform: translate(-50%, 0);
        left: 50%;
    }

    .c-dgp-popup-btn {
        top: calc(50vh + 110px);
        height: auto;
        position: absolute;
        transform: translate(-50%, 0);
        left: 50%;
    }

}

@media (max-width:768px) {
    .main-bg {
        position: fixed;
        background-image: url('pc/img/Bg_Main.png');
        z-index: -10;
        height: 100vh;
        width: 100vw;
        margin: 0 0 0 0;
    }

    .c-sp-content .hide-switch {
        opacity: 0;
    }

    .sp-body {
        display: block;
    }

    header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 10px;
        border-bottom: 1px solid #ccc;
        font-family: 'メイリオ', 'Meiryo', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', Verdana, sans-serif;
    }

    .img-chain-up {
        width: 7.03vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-P10-bg {
        width: 100vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: -8%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .page-feature {
        overflow-x: visible;
        margin: 0 0px;
    }

    .page-feature h1 {
        margin-top: 0;
        margin-bottom: 0;
    }

    .page-feature .clearfix::after {
        content: "";
        display: block;
        clear: both;
    }

    .page-feature .feature-header {
        max-width: 100%;
        min-height: 117vw;
        margin: 0vw auto;
        position: relative;
        overflow: hidden;
    }

    .p1-btn {
        width: 30vw;
        height: auto;
        position: absolute;
        top: 75vw;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-gotop-btn {
        height: 100px;
        width: 100%;
        position: fixed;
        text-align: right;
        top: calc(100vh - 120px);
        z-index: 10000;
        margin: 0;
        pointer-events: none;
        display: none;
    }

    .c-gotop-btn a {
        pointer-events: all;
    }

    .c-gotop-btn.show {
        display: block;
    }

    .c-gotop-btn img {
        right: -50px;
        height: auto;
        position: absolute;
        transform: translate(-39%, -4%);
    }

    .page-feature .feature-nav {
        display: none;
    }

    .c-p1-btn .ntg-box-registration>.ntg-btn-registration {
        background-size: 272px 272px;
        height: 470px;
        width: 0;
        background-color: Transparent;
        background-repeat: no-repeat;
        border: none;
        cursor: pointer;
        overflow: hidden;
        outline: none;
    }

    .ntg-btn-registration {
        cursor: pointer;
        border: none;
        background-color: transparent;
    }

    .ntg-btn-registration:hover {
        opacity: 0.9;
    }

    .page-feature .btn-sumon {
        position: absolute;
    }

    .feature-contents {
        margin: 0 0;
    }

    .c-sec-story {
        margin: 0vw auto 0 auto;
        position: relative;
        min-height: 156vw;
    }

    .c-pv-block {
        position: absolute;
        width: 60.9375vw;
        height: 34.0625vw;
        top: 29.27%;
        left: 50%;
        transform: translate(-50%, 0);
        overflow: hidden;
    }

    .c-pv-block video {
        width: 60.9375vw;
        height: 34.0625vw;
    }

    .c-img-story-bg {
        width: 100vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        left: 50%;
        transform: translate(-50%, 0);
        top: 21vw;
    }

    .c-img-story-title {
        width: 45.62vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 43vw;
        left: 28%;
    }

    .c-img-story-text {
        width: 83vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 63vw;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-story-video-bg {
        width: 63.12vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 28.5%;
        left: 50%;
        transform: translate(-50%, 0);
        z-index: 0;
    }

    .c-sec-campaign-login {
        width: 100%;
        position: relative;
        min-height: 153vw;
        margin: 0vw auto 0 auto;
        overflow: visible;
    }

    .c-img-campaign-login-hero-bg {
        width: 100vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: -10%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-campaign-login-bg {
        width: 100vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        left: 50%;
        transform: translate(-50%, 0);
        top: -14vw;
    }

    .c-img-campaign-login-title {
        width: 56.40vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 22%;
        left: 21%;
    }

    .c-img-campaign-login-word {
        width: 56.40vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 30%;
        left: 22%;
    }

    .c-img-campaign-login-content {
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 38%;
        left: 50%;
        width: 100vw;
        transform: translate(-50%, 0);
    }

    .c-sec-p5 {
        width: 100%;
        position: relative;
        min-height: 140vw;
        margin: 0vw auto 0 auto;
        overflow: visible;
    }

    .c-img-p5-bg {
        width: 100vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        left: 50%;
        transform: translate(-50%, 0);
        top: -6vw;
    }

    .c-p5-btn img {
        width: 45vw;
        height: auto;
        position: absolute;
        top: 73vw;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-sec-campaign-draw {
        width: 100%;
        position: relative;
        min-height: 138vw;
        margin: -2vw auto 0 auto;
    }

    .c-img-campaign-draw-bg {
        width: 90.62vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 10vw;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .campaign-draw-num-box {
        display: flex;
        margin: 0 0.5vw;
    }

    .campaign-draw-num {
        width: 8.75vw;
        height: auto;
        margin: 0vw -1.2vw;
    }

    .campaign-draw-num-container {
        display: flex;
        top: 37vw;
        left: 50%;
        transform: translate(-50%, 0);
        position: absolute;
    }

    .campaign-draw-comma {
        width: 8.75vw;
        top: 36vw;
        height: auto;
    }

    .campaign-draw-comma-1 {
        margin: 0vw -4vw;
    }

    .campaign-draw-comma-2 {
        margin: 0vw -4vw;
    }

    .c-sec-campaign-x {
        width: 100%;
        position: relative;
        min-height: 145vw;
        margin: 4vw auto 0 auto;
        overflow: visible;
    }

    .c-img-campaign-x-bg {
        width: 100vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 18vw;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .img-campaign-x-btn {
        width: 36.09vw;
        height: auto;
        position: absolute;
        top: 103vw;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-sec-character {
        position: relative;
        min-height: 165vw;
        margin: 10vw auto 0 auto;
    }

    .c-character-list {
        position: absolute;
        top: 52%;
        left: 37%;
        transform: translate(-50%, 0);
    }

    .character-list-01 {
        margin: 0 0 0 0;
    }

    .character-list-02 {
        margin: 0% -26% 0 0;
    }

    .c-sec-character ul {
        display: inline-flex;
    }

    .c-img-character-bg {
        width: 100vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 22vw;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-character-btn-01{
        top:0px;
        left:30%;
    }

    .character-box {
        transition: opacity 0.5s ease-out 0s;
    }

    .c-character-list li img:nth-child(2) {
        transform: translate(0%, -100%);
        transition: opacity 0.5s ease-out 0s;
    }

    .c-character-list img {
        width: 18vw;
        height: auto;
        margin: 0 -14px 0 0;
    }

    .img-character-hero {
        width: 100vw;
        height: auto;
        position: absolute;
        top: 11%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .img-character-left-arrow {
        position: absolute;
        left: 13%;
        transform: translate(-50%, 0);
    }

    .img-character-right-arrow {
        position: absolute;
        right: 11%;
        transform: translate(50%, 0);
    }

    .character-arrow {
        top: 83.5%;
        width: 6vw;
        height: auto;
    }

    .sp-sec-special {
        margin: 0 auto 0 auto;
        position: relative;
        min-height: 138vw;
        overflow: hidden;
    }

    .c-special-list {
        position: absolute;
        top: 74%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .sp-sec-special ul {
        display: inline-flex;
    }

    .sp-sec-special ul li {
        width: 8vw;
    }

    .c-img-special-bg {
        width: 100vw;
        height: auto;
        position: absolute;
        top: 8%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-special-title {
        width: 46vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 21%;
        left: 51%;
        transform: translate(-50%, 0);
    }

    .c-img-special-content-bg {
        width: 100vw;
        height: auto;
        position: absolute;
        top: 28%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-special-box {
        position: absolute;
        top: 31.5%;
        display: flex;
        width: 100vw;
    }

    .c-special-box div {
        position: absolute;
    }

    .special-arrow {
        top: 77%;
        width: 8.437vw;
        height: auto;
    }

    .img-special-left-arrow {
        position: absolute;
        left: 27%;
        transform: translate(-50%, 0);
    }

    .img-special-right-arrow {
        position: absolute;
        right: 27%;
        transform: translate(50%, 0);
    }

    .c-special-box .img-special-content {
        width: 100vw;
        height: auto;
        user-select: none;
        -moz-user-select: none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        touch-action: none;
    }

    .c-special-list img {
        width: 6.093vw;
        height: auto;
    }

    .c-special-list li img:nth-child(2) {
        transform: translate(0%, -100%);
        transition: opacity 0.5s ease-out 0s;
    }

    .c-sec-x {
        margin: -4vw auto;
        position: relative;
        min-height: 150vw;
    }

    .c-img-x-bg {
        width: 100vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 24%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-x-content {
        width: 55.6vw;
        height: 78.77vw;
        position: absolute;
        top: 30.8%;
        left: 50.15%;
        transform: translate(-50%, 0);
        z-index: 1;
        overflow: hidden;
    }

    .img-x-btn {
        width: 36.09vw;
        height: auto;
        position: absolute;
        top: 68%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-sec-notice {
        margin: 22vw auto 0 auto;
        position: relative;
        min-height: 150vw;
        overflow: visible;
    }

    .c-img-notice-bg {
        width: 100vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 17vw;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .page-feature footer {
        margin: 146px 0 0 0;
    }

    .page-feature .feature-contents>section {
        margin: 0 auto;
        text-align: center;
        width: 100vw;
    }

    .c-divion-bottom {
        margin: 100px 0 0 0;
    }

    .c-copyright {
        margin: 10px;
        display: block;
        color: white;
    }

    .c-sec-gallery {
        position: relative;
        min-height: 118vw;
        overflow: visible;
    }

    .c-img-gallery-title {
        width: 37vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 27vw;
        left: 7%;
    }

    .c-gallery-list {
        position: absolute;
        top: 94vw;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-gallery-list ul {
        display: flex;
    }

    .c-gallery-list li {
        margin: -2vw 0 0 0;
        position: relative;
    }

    .c-gallery-list li ::marker {
        display: none;
    }

    .img-gallery-cg-bg {
        width: 100vw;
        height: auto;
        position: absolute;
        top: 21vw;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .gallery-video-box {
        position: absolute;
        width: 85vw;
        height: 48vw;
        overflow: hidden;
        top: 43vw;
        left: 7.7%;
    }

    .c-gallery-box video {
        width: 85vw;
        height: auto;
        position: absolute;
        left: 0;
        top: 0;
    }

    .c-gallery-list img {
        width: 20vw;
        margin: 0px 0vw;
        height: auto;
        opacity: 100%;
    }

    .c-gallery-list li img:nth-child(2) {
        transform: translate(0%, -100%);
        transition: opacity 0.5s ease-out 0s;
    }

    .c-gallery-box .gallery-item {
        transition: opacity 0.5s ease-out 0s;
    }

    .gallery-arrow {
        top: 68vw;
        width: 5.312vw;
        height: auto;
    }

    .img-gallery-left-arrow {
        position: absolute;
        left: 4%;
        transform: translate(-50%, 0);
    }

    .img-gallery-right-arrow {
        position: absolute;
        right: 4%;
        transform: translate(50%, 0);
    }

    .c-sec-P12 {
        margin: -4vw auto;
        position: relative;
        min-height: 125vw;
    }

    .c-img-P12-bg {
        width: 100vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 15%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-P12-content {
        width: 99vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 36%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-P12-title {
        width: 42vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 26%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-P12-copy {
        width: 50vw;
        height: auto;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 92%;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .img-P12-btn {
        width: 36.09vw;
        height: auto;
        position: absolute;
        top: 59%;
        left: 25%;
        transform: translate(-50%, 0);
    }

    .img-P12rule-btn {
        width: 36.09vw;
        height: auto;
        position: absolute;
        top: 59%;
        left: 75%;
        transform: translate(-50%, 0);
    }

    .popup {
        top: 0;
        width: 100%;
        text-align: center;
        position: fixed;
        z-index: 10;
        height: 100vh;
        opacity: 0;
        transition: opacity 0.5s ease-out 0s;
        pointer-events: none;
    }

    .c-spec-popup.show {
        opacity: 100;
        pointer-events: all;
    }

    .c-rule-popup.show {
        opacity: 100;
        pointer-events: all;
    }

    .c-dgp-popup.show {
        opacity: 100;
        pointer-events: all;
    }

    .id-img-popup-bg {
        margin: 0;
        padding: 0;
        position: absolute;
        top: -55px;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .c-img-popup-item {
        margin: 0;
        padding: 0;
        position: absolute;
        top: 50vh;
        left: 50%;
        width: 95vw;
        height: auto;
        transform: translate(-50%, -50%);
    }

    .c-img-popup-ruleitem {
        margin: 0;
        padding: 0;
        position: absolute;
        top: 50vh;
        left: 50%;
        width: 95vw;
        height: auto;
        transform: translate(-50%, -50%);
    }

    .c-img-spec-text-01 {
        text-align: left;
        position: absolute;
        top: calc(50vh + -19vw);
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 5.5vw;
        color: #FFFFFF;
        font-weight: 900;
    }

    .c-img-spec-text-02 {
        text-align: left;
        position: absolute;
        top: calc(50vh + -6vw);
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 4vw;
        color: #572979;
        font-weight: 600;
    }

    .c-img-spec-text-03 {
        text-align: left;
        position: absolute;
        top: calc(50vh - 2vw);
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 2.5vw;
        line-height: 3vw;
        width: 80vw;
        color: #BBEEFF;
        font-weight: 600;
        height: 27vw;
        overflow-y: scroll;
        padding: 0 1vw 0 4vw;
        white-space: break-spaces;
    }

    .c-spec-popup-btn {
        top: calc(50vh + 16vw);
        position: absolute;
        transform: translate(-65vw, -3vw);
        width: 30vw;
        height: auto;
    }

    .c-rule-popup-btn {
        top: calc(50vh + 16vw);
        position: absolute;
        transform: translate(-65vw, -3vw);
        width: 30vw;
        height: auto;
    }

    .c-dgp-popup-btn {
        top: calc(50vh + 16vw);
        position: absolute;
        transform: translate(-65vw, -3vw);
        width: 30vw;
        height: auto;
    }

    .popup .btn-general:hover+.btn-hover {
        opacity: 0%;
        transform: translate(-65vw, -3vw) scale(1);
    }

    .popup .btn-general:hover {
        opacity: 100%;
        transform: translate(-65vw, -3vw) scale(1.05);
    }

    .popup .btn-hover:hover {
        opacity: 100%;
        transform: translate(-65vw, -3vw) scale(1.05);
    }

}