@media only screen and (max-width:500px) {
    .wrapper {
        height: calc(5712/750*100vw);
        background: url(../images/event/Heros-Crown/m/bg1.jpg) 0 0 / 100% calc(2300/750*100vw) no-repeat, url(../images/event/Heros-Crown/m/bg2.jpg) 0 calc(2300/750*100vw) / 100% calc(3413/750*100vw) no-repeat
    }

    .wrapper.on {
        position: relative
    }

    .kv {
        height: calc(1300/750*100vw)
    }

    .s1 {
        height: calc(1360/750*100vw)
    }

    .s2 {
        height: calc(1250/750*100vw)
    }

    .s3 {
        height: calc(790/750*100vw)
    }

    .s4 {
        height: calc(970/750*100vw)
    }

    .side {
        width: calc(750/750*100vw);
        height: calc(194/750*100vw);
        background: url(../images/event/Heros-Crown/m/side.png) 0 0 / 100% 100% no-repeat;
        bottom: 0;
        top: initial;
        left: 50%;
        margin-top: 0;
        margin-left: calc(-375/750*100vw)
    }

    .side.on {
        position: absolute
    }

    .side a {
        width: calc(136/750*100vw);
        height: calc(124/750*100vw);
        background-image: url(../images/event/Heros-Crown/m/side1.png);
        background-size: calc(638/750*100vw) calc(205/750*100vw);
        background-position: 0 bottom;
        top: calc(32/750*100vw);
        left: calc(66/750*100vw)
    }

    .side a:nth-child(3) {
        background-position: calc(-160/750*100vw) 0;
        top: calc(-48/750*100vw);
        left: calc(228/750*100vw)
    }

    .side a:nth-child(4) {
        background-position: calc(-340/750*100vw) 0;
        top: calc(-48/750*100vw);
        left: calc(400/750*100vw)
    }

    .side a:nth-child(5) {
        background-position: calc(-502/750*100vw) bottom;
        top: calc(32/750*100vw);
        left: calc(566/750*100vw)
    }

    .side a.act {
        background-image: url(../images/event/Heros-Crown/m/side2.png)
    }

    .btn_top {
        width: calc(128/750*100vw);
        height: calc(128/750*100vw);
        bottom: calc(260/750*100vw);
        right: 50%;
        margin-right: calc(-64/750*100vw)
    }

    .slogan {
        height: calc(97/750*100vw);
        background: url(../images/event/Heros-Crown/m/slogan/en.png) center 0 / auto 100% no-repeat;
        top: calc(830/750*100vw)
    }

    .ar .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/ar.png) center 0/auto 100% no-repeat
    }

    .de .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/de.png) center 0/auto 100% no-repeat
    }

    .en .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/en.png) center 0/auto 100% no-repeat
    }

    .es .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/es.png) center 0/auto 100% no-repeat
    }

    .fr .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/fr.png) center 0/auto 100% no-repeat
    }

    .HK .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/hk.png) center 0/auto 100% no-repeat
    }

    .id .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/id.png) center 0/auto 100% no-repeat
    }

    .my .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/my.png) center 0/auto 100% no-repeat
    }

    .pt .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/pt.png) center 0/auto 100% no-repeat
    }

    .ru .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/ru.png) center 0/auto 100% no-repeat
    }

    .th .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/th.png) center 0/auto 100% no-repeat
    }

    .tr .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/tr.png) center 0/auto 100% no-repeat
    }

    .TW .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/tw.png) center 0/auto 100% no-repeat
    }

    .ur .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/ur.png) center 0/auto 100% no-repeat
    }

    .uz .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/uz.png) center 0/auto 100% no-repeat
    }

    .vi .slogan {
        background: url(../images/event/Heros-Crown/m/slogan/vi.png) center 0/auto 100% no-repeat
    }

    .slogan a {
        width: calc(114/750*100vw);
        height: calc(114/750*100vw);
        top: calc(-114/750*100vw);
        margin-left: calc(-57/750*100vw)
    }

    .newdownload-wrap {
        top: calc(940/750*100vw) !important
    }

    .tit1 {
        height: calc(69/750*100vw);
        background: url(../images/event/Heros-Crown/m/tit1/en.png) center 0 / auto 100% no-repeat;
        margin: calc(30/750*100vw) auto 0
    }

    .ar .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/ar.png) center 0/auto 100% no-repeat
    }

    .de .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/de.png) center 0/auto 100% no-repeat
    }

    .en .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/en.png) center 0/auto 100% no-repeat
    }

    .es .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/es.png) center 0/auto 100% no-repeat
    }

    .fr .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/fr.png) center 0/auto 100% no-repeat
    }

    .HK .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/hk.png) center 0/auto 100% no-repeat
    }

    .id .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/id.png) center 0/auto 100% no-repeat
    }

    .my .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/my.png) center 0/auto 100% no-repeat
    }

    .pt .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/pt.png) center 0/auto 100% no-repeat
    }

    .ru .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/ru.png) center 0/auto 100% no-repeat
    }

    .th .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/th.png) center 0/auto 100% no-repeat
    }

    .tr .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/tr.png) center 0/auto 100% no-repeat
    }

    .TW .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/tw.png) center 0/auto 100% no-repeat
    }

    .ur .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/ur.png) center 0/auto 100% no-repeat
    }

    .uz .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/uz.png) center 0/auto 100% no-repeat
    }

    .vi .tit1 {
        background: url(../images/event/Heros-Crown/m/tit1/vi.png) center 0/auto 100% no-repeat
    }

    .s1_swiper {
        width: calc(750/750*100vw);
        height: calc(1172/750*100vw)
    }

    .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/en.png) 0 0 / 100% 100% no-repeat
    }

    .ar .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/ar.png) center 0/auto 100% no-repeat
    }

    .de .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/de.png) center 0/auto 100% no-repeat
    }

    .en .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/en.png) center 0/auto 100% no-repeat
    }

    .es .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/es.png) center 0/auto 100% no-repeat
    }

    .fr .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/fr.png) center 0/auto 100% no-repeat
    }

    .HK .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/hk.png) center 0/auto 100% no-repeat
    }

    .id .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/id.png) center 0/auto 100% no-repeat
    }

    .my .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/my.png) center 0/auto 100% no-repeat
    }

    .pt .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/pt.png) center 0/auto 100% no-repeat
    }

    .ru .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/ru.png) center 0/auto 100% no-repeat
    }

    .th .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/th.png) center 0/auto 100% no-repeat
    }

    .tr .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/tr.png) center 0/auto 100% no-repeat
    }

    .TW .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/tw.png) center 0/auto 100% no-repeat
    }

    .ur .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/ur.png) center 0/auto 100% no-repeat
    }

    .uz .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/uz.png) center 0/auto 100% no-repeat
    }

    .vi .s1_slide1 {
        background: url(../images/event/Heros-Crown/m/s1_slide1/vi.png) center 0/auto 100% no-repeat
    }

    .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/en.png) 0 0 / 100% 100% no-repeat
    }

    .ar .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/ar.png) center 0/auto 100% no-repeat
    }

    .de .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/de.png) center 0/auto 100% no-repeat
    }

    .en .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/en.png) center 0/auto 100% no-repeat
    }

    .es .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/es.png) center 0/auto 100% no-repeat
    }

    .fr .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/fr.png) center 0/auto 100% no-repeat
    }

    .HK .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/hk.png) center 0/auto 100% no-repeat
    }

    .id .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/id.png) center 0/auto 100% no-repeat
    }

    .my .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/my.png) center 0/auto 100% no-repeat
    }

    .pt .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/pt.png) center 0/auto 100% no-repeat
    }

    .ru .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/ru.png) center 0/auto 100% no-repeat
    }

    .th .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/th.png) center 0/auto 100% no-repeat
    }

    .tr .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/tr.png) center 0/auto 100% no-repeat
    }

    .TW .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/tw.png) center 0/auto 100% no-repeat
    }

    .ur .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/ur.png) center 0/auto 100% no-repeat
    }

    .uz .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/uz.png) center 0/auto 100% no-repeat
    }

    .vi .s1_slide2 {
        background: url(../images/event/Heros-Crown/m/s1_slide2/vi.png) center 0/auto 100% no-repeat
    }

    .s1_page {
        width: calc(750/750*100vw);
        height: calc(20/750*100vw);
        z-index: 2
    }

    .s1_prev {
        width: calc(178/750*100vw);
        height: calc(178/750*100vw);
        background: url(../images/event/Heros-Crown/s2_page.png) 0 0 / calc(1558/750*100vw) calc(178/750*100vw) no-repeat;
        top: calc(-650/750*100vw);
        left: calc(-40/750*100vw)
    }

    .ar .s1_prev,
    .ur .s2_prev {
        left: initial;
        right: calc(-40/750*100vw);
        background: url(../images/event/Heros-Crown/s2_page.png) right 0 / calc(1558/750*100vw) calc(178/750*100vw) no-repeat
    }

    .s1_next {
        display: block;
        width: calc(178/750*100vw);
        height: calc(178/750*100vw);
        background: url(../images/event/Heros-Crown/s2_page.png) right 0 / calc(1558/750*100vw) calc(178/750*100vw) no-repeat;
        top: calc(-650/750*100vw);
        right: calc(-40/750*100vw)
    }

    .ar .s1_next,
    .ur .s2_next {
        right: initial;
        left: calc(-40/750*100vw);
        background: url(../images/event/Heros-Crown/s2_page.png) 0 0 / calc(1558/750*100vw) calc(178/750*100vw) no-repeat
    }

    .s1_pagination {
        margin: 0 calc(10/750*100vw)
    }

    .s1_pagination span {
        width: calc(48/750*100vw);
        height: calc(4/750*100vw);
        margin: 0 calc(10/750*100vw)
    }

    .s1_tit {
        width: calc(750/750*100vw);
        height: calc(50/750*100vw);
        top: calc(490/750*100vw);
        left: 0
    }

    .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/en.png) center 0 / auto 100% no-repeat
    }

    .ar .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/ar.png) center 0/auto 100% no-repeat
    }

    .de .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/de.png) center 0/auto 100% no-repeat
    }

    .en .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/en.png) center 0/auto 100% no-repeat
    }

    .es .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/es.png) center 0/auto 100% no-repeat
    }

    .fr .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/fr.png) center 0/auto 100% no-repeat
    }

    .HK .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/hk.png) center 0/auto 100% no-repeat
    }

    .id .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/id.png) center 0/auto 100% no-repeat
    }

    .my .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/my.png) center 0/auto 100% no-repeat
    }

    .pt .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/pt.png) center 0/auto 100% no-repeat
    }

    .ru .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/ru.png) center 0/auto 100% no-repeat
    }

    .th .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/th.png) center 0/auto 100% no-repeat
    }

    .tr .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/tr.png) center 0/auto 100% no-repeat
    }

    .TW .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/tw.png) center 0/auto 100% no-repeat
    }

    .ur .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/ur.png) center 0/auto 100% no-repeat
    }

    .uz .s1_tit1 {
        background: url(../images/event/Heros-Crown/m/tit1_1/uz.png) center 0/auto 100% no-repeat
    }

    .vi .s1_tit1 {
       /* background: url(../images/event/Heros-Crown/m/tit1_1/vi.png) center 0/auto 100% no-repeat*/
        width: calc(395 / 600 * 100vw);
        height: calc(45 / 600 * 100vw);
        top: calc(480 / 750 * 100vw);
        left: 52%;
        margin-left: calc(-260 / 750 * 100vw);
        font-size: calc(26 / 750 * 100vw);
        padding: calc(30 / 750 * 100vw) calc(62 / 750 * 100vw) calc(30 / 750 * 100vw);

    }

    .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/en.png) center 0 / auto 100% no-repeat
    }

    .ar .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/ar.png) center 0/auto 100% no-repeat
    }

    .de .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/de.png) center 0/auto 100% no-repeat
    }

    .en .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/en.png) center 0/auto 100% no-repeat
    }

    .es .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/es.png) center 0/auto 100% no-repeat
    }

    .fr .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/fr.png) center 0/auto 100% no-repeat
    }

    .HK .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/hk.png) center 0/auto 100% no-repeat
    }

    .id .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/id.png) center 0/auto 100% no-repeat
    }

    .my .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/my.png) center 0/auto 100% no-repeat
    }

    .pt .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/pt.png) center 0/auto 100% no-repeat
    }

    .ru .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/ru.png) center 0/auto 100% no-repeat
    }

    .th .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/th.png) center 0/auto 100% no-repeat
    }

    .tr .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/tr.png) center 0/auto 100% no-repeat
    }

    .TW .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/tw.png) center 0/auto 100% no-repeat
    }

    .ur .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/ur.png) center 0/auto 100% no-repeat
    }

    .uz .s1_tit2 {
        background: url(../images/event/Heros-Crown/m/tit1_2/uz.png) center 0/auto 100% no-repeat
    }

    .vi .s1_tit2 {
        width: calc(395 / 600 * 100vw);
        height: calc(45 / 600 * 100vw);
        top: calc(480 / 750 * 100vw);
        left: 52%;
        margin-left: calc(-260 / 750 * 100vw);
        font-size: calc(26 / 750 * 100vw);
        padding: calc(30 / 750 * 100vw) calc(62 / 750 * 100vw) calc(30 / 750 * 100vw)
    }

    .s1_play {
        width: calc(134/750*100vw);
        height: calc(134/750*100vw);
        top: calc(686/750*100vw);
        left: 50%;
        margin-left: calc(-67/750*100vw)
    }

    .btn_version {
        width: calc(500/750*100vw);
        height: calc(132/750*100vw);
        top: calc(962/750*100vw);
        left: 50%;
        margin-left: calc(-260/750*100vw);
        font-size: calc(32/750*100vw);
        padding: calc(36/750*100vw) calc(62/750*100vw) calc(30/750*100vw)
    }

    .tit2 {
        height: calc(66/750*100vw);
        background: url(../images/event/Heros-Crown/m/tit2/en.png) center 0 / auto 100% no-repeat;
        margin: calc(30/750*100vw) auto calc(20/750*100vw)
    }

    .ar .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/ar.png) center 0/auto 100% no-repeat
    }

    .de .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/de.png) center 0/auto 100% no-repeat
    }

    .en .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/en.png) center 0/auto 100% no-repeat
    }

    .es .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/es.png) center 0/auto 100% no-repeat
    }

    .fr .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/fr.png) center 0/auto 100% no-repeat
    }

    .HK .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/hk.png) center 0/auto 100% no-repeat
    }

    .id .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/id.png) center 0/auto 100% no-repeat
    }

    .my .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/my.png) center 0/auto 100% no-repeat
    }

    .pt .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/pt.png) center 0/auto 100% no-repeat
    }

    .ru .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/ru.png) center 0/auto 100% no-repeat
    }

    .th .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/th.png) center 0/auto 100% no-repeat
    }

    .tr .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/tr.png) center 0/auto 100% no-repeat
    }

    .TW .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/tw.png) center 0/auto 100% no-repeat
    }

    .ur .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/ur.png) center 0/auto 100% no-repeat
    }

    .uz .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/uz.png) center 0/auto 100% no-repeat
    }

    .vi .tit2 {
        background: url(../images/event/Heros-Crown/m/tit2/vi.png) center 0/auto 100% no-repeat
    }

    .s2_swiper {
        width: calc(750/750*100vw);
        height: calc(1044/750*100vw);
        margin: 0 auto
    }

    .s2_swiper .swiper-slide {
        background: url(../images/event/Heros-Crown/m/s2_box.png) 0 0 / 100% 100% no-repeat
    }

    .s2_role {
        width: calc(580/750*100vw);
        height: calc(330/750*100vw);
        top: calc(80/750*100vw);
        left: calc(83/750*100vw)
    }

    .s2_role1 {
        background: url(../images/event/Heros-Crown/m/s2_role1.png) 0 0 / 100% 100% no-repeat
    }

    .s2_role2 {
        background: url(../images/event/Heros-Crown/m/s2_role2.png) 0 0 / 100% 100% no-repeat
    }

    .s2_role3 {
        background: url(../images/event/Heros-Crown/m/s2_role3.png) 0 0 / 100% 100% no-repeat
    }

    .s2_role4 {
        background: url(../images/event/Heros-Crown/m/s2_role4.png) 0 0 / 100% 100% no-repeat
    }

    .s2_role5 {
        background: url(../images/event/Heros-Crown/m/s2_role5.png) 0 0 / 100% 100% no-repeat
    }

    .s2_text {
        width: calc(606/750*100vw);
        height: calc(480/750*100vw);
        top: calc(444/750*100vw);
        left: calc(76/750*100vw);
        padding: 0 calc(16/750*100vw) 0 0
    }

    .ar .s2_text,
    .ur .s2_text {
        padding: 0 0 0 calc(16/750*100vw)
    }

    .s2_text b {
        font-size: calc(36/750*100vw)
    }

    .s2_text p {
        font-size: calc(24/750*100vw);
        line-height: calc(30/750*100vw);
        margin: calc(10/750*100vw) 0
    }

    .s2_text p span.act:before {
        width: calc(21/750*100vw);
        height: calc(20/750*100vw)
    }

    .s2_pic {
        width: calc(590/750*100vw);
        height: calc(331/750*100vw)
    }

    .s2_text::-webkit-scrollbar {
        width: calc(2/750*100vw)
    }

    .s2_page {
        width: calc(750/750*100vw);
        height: calc(20/750*100vw);
        z-index: 2
    }

    .s2_prev {
        width: calc(178/750*100vw);
        height: calc(178/750*100vw);
        background: url(../images/event/Heros-Crown/s2_page.png) 0 0 / calc(1558/750*100vw) calc(178/750*100vw) no-repeat;
        top: calc(-650/750*100vw);
        left: calc(-40/750*100vw)
    }

    .s2_next {
        display: block;
        width: calc(178/750*100vw);
        height: calc(178/750*100vw);
        background: url(../images/event/Heros-Crown/s2_page.png) right 0 / calc(1558/750*100vw) calc(178/750*100vw) no-repeat;
        top: calc(-650/750*100vw);
        right: calc(-40/750*100vw)
    }

    .s2_pagination {
        margin: 0 calc(10/750*100vw)
    }

    .s2_pagination span {
        width: calc(48/750*100vw);
        height: calc(4/750*100vw);
        margin: 0 calc(10/750*100vw)
    }

    .tit3 {
        height: calc(110/750*100vw);
        background: url(../images/event/Heros-Crown/m/tit3/en.png) center 0 / auto 100% no-repeat;
        margin: calc(30/750*100vw) auto calc(20/750*100vw)
    }

    .ar .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/ar.png) center 0/auto 100% no-repeat
    }

    .de .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/de.png) center 0/auto 100% no-repeat
    }

    .en .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/en.png) center 0/auto 100% no-repeat
    }

    .es .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/es.png) center 0/auto 100% no-repeat
    }

    .fr .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/fr.png) center 0/auto 100% no-repeat
    }

    .HK .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/hk.png) center 0/auto 100% no-repeat
    }

    .id .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/id.png) center 0/auto 100% no-repeat
    }

    .my .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/my.png) center 0/auto 100% no-repeat
    }

    .pt .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/pt.png) center 0/auto 100% no-repeat
    }

    .ru .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/ru.png) center 0/auto 100% no-repeat
    }

    .th .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/th.png) center 0/auto 100% no-repeat
    }

    .tr .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/tr.png) center 0/auto 100% no-repeat
    }

    .TW .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/tw.png) center 0/auto 100% no-repeat
    }

    .ur .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/ur.png) center 0/auto 100% no-repeat
    }

    .uz .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/uz.png) center 0/auto 100% no-repeat
    }

    .vi .tit3 {
        background: url(../images/event/Heros-Crown/m/tit3/vi.png) center 0/auto 100% no-repeat
    }

    .s3_box {
        width: calc(750/750*100vw);
        height: calc(644/750*100vw);
        background: url(../images/event/Heros-Crown/m/s3_box/en.png) 0 0 / 100% 100% no-repeat;
        margin: 0 auto
    }

    .ar .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/ar.png) center 0/auto 100% no-repeat
    }

    .de .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/de.png) center 0/auto 100% no-repeat
    }

    .en .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/en.png) center 0/auto 100% no-repeat
    }

    .es .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/es.png) center 0/auto 100% no-repeat
    }

    .fr .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/fr.png) center 0/auto 100% no-repeat
    }

    .HK .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/hk.png) center 0/auto 100% no-repeat
    }

    .id .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/id.png) center 0/auto 100% no-repeat
    }

    .my .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/my.png) center 0/auto 100% no-repeat
    }

    .pt .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/pt.png) center 0/auto 100% no-repeat
    }

    .ru .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/ru.png) center 0/auto 100% no-repeat
    }

    .th .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/th.png) center 0/auto 100% no-repeat
    }

    .tr .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/tr.png) center 0/auto 100% no-repeat
    }

    .TW .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/tw.png) center 0/auto 100% no-repeat
    }

    .ur .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/ur.png) center 0/auto 100% no-repeat
    }

    .uz .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/uz.png) center 0/auto 100% no-repeat
    }

    .vi .s3_box {
        background: url(../images/event/Heros-Crown/m/s3_box/vi.png) center 0/auto 100% no-repeat
    }

    .s3_play {
        width: calc(134/750*100vw);
        height: calc(134/750*100vw);
        top: calc(140/750*100vw);
        margin-left: calc(-67/750*100vw)
    }

    .text {
        width: calc(580/750*100vw);
        height: calc(170/750*100vw);
        top: calc(415/750*100vw);
        margin-left: calc(-290/750*100vw);
        font-size: calc(22/750*100vw);
        line-height: calc(30/750*100vw)
    }

    .text b {
        font-size: calc(32/750*100vw);
        margin-bottom: calc(10/750*100vw)
    }

    .text::-webkit-scrollbar {
        width: calc(2/750*100vw)
    }

    .tit4 {
        height: calc(65/750*100vw);
        background: url(../images/event/Heros-Crown/m/tit4/en.png) center 0 / auto 100% no-repeat;
        margin: calc(30/750*100vw) auto calc(20/750*100vw)
    }

    .ar .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/ar.png) center 0/auto 100% no-repeat
    }

    .de .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/de.png) center 0/auto 100% no-repeat
    }

    .en .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/en.png) center 0/auto 100% no-repeat
    }

    .es .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/es.png) center 0/auto 100% no-repeat
    }

    .fr .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/fr.png) center 0/auto 100% no-repeat
    }

    .HK .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/hk.png) center 0/auto 100% no-repeat
    }

    .id .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/id.png) center 0/auto 100% no-repeat
    }

    .my .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/my.png) center 0/auto 100% no-repeat
    }

    .pt .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/pt.png) center 0/auto 100% no-repeat
    }

    .ru .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/ru.png) center 0/auto 100% no-repeat
    }

    .th .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/th.png) center 0/auto 100% no-repeat
    }

    .tr .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/tr.png) center 0/auto 100% no-repeat
    }

    .TW .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/tw.png) center 0/auto 100% no-repeat
    }

    .ur .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/ur.png) center 0/auto 100% no-repeat
    }

    .uz .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/uz.png) center 0/auto 100% no-repeat
    }

    .vi .tit4 {
        background: url(../images/event/Heros-Crown/m/tit4/vi.png) center 0/auto 100% no-repeat
    }

    .s4_box {
        width: calc(716/750*100vw);
        height: calc(424/750*100vw);
        margin: 0 auto
    }

    .s4_play {
        width: calc(134/750*100vw);
        height: calc(134/750*100vw);
        margin-top: calc(-67/750*100vw);
        margin-left: calc(-67/750*100vw)
    }

    .pop_close {
        cursor: initial;
        top: calc(-39/750*100vw);
        right: calc(0/750*100vw);
        width: calc(39/750*100vw);
        height: calc(39/750*100vw)
    }

    #vindex_play {
        width: calc(750/750*100vw);
        height: calc(422/750*100vw);
        top: 48%;
        margin-left: calc(-375/750*100vw);
        margin-top: calc(-211/750*100vw)
    }

    #vindex_play .pop_close {
        top: calc(430/750*100vw);
        right: 50%;
        margin-right: calc(-14.5/750*100vw)
    }
}