html {
    font-family: "Noto Sans KR", sans-serif;
}

/* ==============================
    Language
============================== */
header ul.language {
    width: 57.6%;
    max-width: 576px;
}
header ul.language li.lang-jp img {
    width: 46.7%;
}
header ul.language li.lang-en img {
    width: 30.1%;
}
header ul.language li.lang-zh-tw img {
    width: 48.6%;
}
header ul.language li.lang-zh-cn img {
    width: 49.5%;
}
header ul.language li.lang-ko img {
    width: 47.7%;
}
@media print, screen and (max-width: 768px) {
    header ul.language {
        width: 73vw;
        margin-right: 0;
    }
    header ul.language li.lang-jp img {
        width: 8.7vw;
    }
    header ul.language li.lang-en img {
        width: 5.57vw;
    }
    header ul.language li.lang-zh-tw img {
        width: 8.9vw;
    }
    header ul.language li.lang-zh-cn img {
        width: 9.11vw;
    }
    header ul.language li.lang-ko img {
        width: 9.11vw;
    }

}

/* ==============================
    FV
============================== */
#fv h2 {
    width: 50.4%;
    max-width: 646px;
}
#fv .date img {
    width: 55.3%;
    max-width: 708px;
}
@media print, screen and (max-width: 768px) {
    #fv h2 {
        width: 84.1vw;
    }
    #fv .date img {
        width: 88.6vw;
    }
}

/* ==============================
  Navigation
============================== */
nav ul {
    width: 54%;
    max-width: 692px;
}
nav ul li,
nav ul li:nth-of-type(4) {
    width: 31.7%;
    max-width: 220px;
}
nav ul li:nth-of-type(n + 5) {
    width: 20.3%;
    max-width: 141px;
    margin-top: 2.2%;
}
nav ul li:nth-of-type(5) {
    width: 31.7%;
    max-width: 220px;
}
@media print, screen and (max-width: 768px) {
    nav ul {
        display: block;
        width: 90vw;
    }
    nav ul li:nth-of-type(n + 5) {
        margin-top: 5vw;
        padding: 0;
    }
}


/* ==============================
  活動資訊
============================== */
#event_info h3 img {
    width: 41.9%;
}

#event_info .kickoff-event h4 {
    width: 28.1%;
}

#event_info .border-text {
    margin-left: -115px;
}

#event_info .youtube-live h4 {
    width: 34.4%;
}
#event_info .youtube-live ul.attention {
    width: 23em;
}


#event_info .greeting-event h4 {
    width: 100%;
}

@media print, screen and (max-width: 768px) {
    #event_info h3 img {
        width: 41vw;
    }

    #event_info .kickoff-event h4 {
        width: 36.7vw;
    }

    #event_info dl dt {
        width: 11.8vw;
    }
    #event_info dl dd {
        width: calc(100% - 15.3vw);
    }

    #event_info .border-text {
        margin-left: 0;
    }


    #event_info .youtube-live h4 {
        width: 33.4vw;
    }
    #event_info .youtube-live p {
        width: 80vw;
        margin-right: auto;
        margin-left: auto;
    }
    #event_info .youtube-live p .date {
        display: inline-block;
        text-align: left;
    }


    #event_info .greeting-event h4 {
        width: 86.8vw;
    }
}


/* ==============================
  任務說明
============================== */
#how_to_play h3 img {
    width: 33%;
}
#how_to_play h4 {
    width: 59.2%;
}

#how_to_play .how_to_play-box h5 img {
    width:18.7%;
}


/* How to Play */
#how_to_play .how_to_play-box li {
    width: 28.5%;
}

#how_to_play li .how_to_play-img,
#how_to_play li:nth-of-type(1) .how_to_play-img {
    width: 62.4%;
}

#how_to_play li .how_to_play-text {
    align-items: center;
}

#how_to_play li .how_to_play-text picture,
#how_to_play li:nth-of-type(1) .how_to_play-text picture {
    width: 17.5%;
    margin-right: 4.1%;
}
#how_to_play li .how_to_play-text p,
#how_to_play li:nth-of-type(1) .how_to_play-text p {
    width: calc(100% - 17.5% - 4.1%);
}

#how_to_play .point_get-box h5 img {
    width: 33.7%;
}
@media print, screen and (max-width: 768px) {
    #how_to_play h3 img {
        width: 32.2vw;
    }
    #how_to_play h4 {
        width: 77.2vw;
    }

    #how_to_play .how_to_play-box h5 img {
        width:24.4vw;
    }


    /* How to Play */
    #how_to_play .how_to_play-box li {
        position: relative;
        width: 100%;
    }

    #how_to_play li .how_to_play-img,
    #how_to_play li:nth-of-type(1) .how_to_play-img {
        width: 27.3vw;
    }

    #how_to_play li .how_to_play-text {
        position: unset;
    }

    #how_to_play li .how_to_play-text picture,
    #how_to_play li:nth-of-type(1) .how_to_play-text picture {
        width: 13vw;
        margin-right:3.7vw;
    }
    #how_to_play li .how_to_play-text p,
    #how_to_play li:nth-of-type(1) .how_to_play-text p {
        width: calc(100% - 13vw - 3.7vw);
        font-size: 4.5vw;
    }

    #how_to_play li .how_to_play-text::after {
        bottom: -15.6vw;
    }

    #how_to_play .web_app p {
        text-align: left;
    }

    #how_to_play .web_app {
        width: 100%;
    }

    #how_to_play .web_app p {
        width: 17em;
        text-align: right
    }


    #how_to_play .point_get-box h5 img {
        width: 44vw;
    }

    #how_to_play .point_get-box li .point_get-text {
        align-items: center;
    }

    #how_to_play .point_get-box li ul.attention {
        width: 74.2vw;
    }
}

/* ==============================
  任地一覽
============================== */
#spot h3 img {
    width: 57.8%;
}
@media print, screen and (max-width: 768px) {
    #spot h3 img {
        width: 56.5vw;
    }
}

/* ==============================
  上弦之鬼，襲來
============================== */
#sunset .section .inner h3 {
    margin-bottom: 5%;
}
#sunset h3 img {
    width: 35.5%;
}

#sunset .spot-box {
    width: 80.1%;
}

#sunset .spot-box h5 img {
    width: 16.7%;
}
#sunset .spot-box .spot-list-wrapper ul:first-of-type {
    flex: 30.3%;
}
#sunset .spot-box .spot-list-wrapper ul:last-of-type {
    flex: 54.2%;
}
@media print, screen and (max-width: 768px) {
    #sunset .section .inner h3 {
        margin-bottom: 6.5vw;
    }
    #sunset h3 img {
        width: 56.5vw;
    }

    #sunset dl {
        width: 65.1vw;
    }
    #sunset dl dt {
        width: 14.9vw;
    }
    #sunset dl dd {
        width: calc(100% - 17.1vw);
    }

    #sunset .spot-box {
        width: 87.2vw;
    }

    #sunset .spot-box h5 img {
        width: 17.5vw;
    }
    #sunset .spot-box p.attention {
        width: 73.6vw;
    }
}

/* ==============================
  任務報酬
============================== */
#goods h3 img {
    width: 33.8%;
}
#goods h4 {
    width: 74.4%;
}

#goods .goods-box .goods-rank img,
#goods .goods-box:nth-of-type(2) .goods-rank img,
#goods .goods-box:nth-of-type(3) .goods-rank img {
    width: 56.2%;
}

#goods .goods-box .points-text {
    width: 27.1%;
}
#goods .goods-box:nth-of-type(2) .points-text,
#goods .goods-box:nth-of-type(3) .points-text {
    width: 20.8%;
}

#goods .pick-up_location-wrapper h5 img {
    width: 34%;
    max-width: 340px;
}
@media print, screen and (max-width: 768px) {
    #goods h3 img {
        width: 33vw;
    }
    #goods h4 {
        width: 57.6vw;
    }

    #goods .goods-box .goods-rank img {
        width: 28.2vw;
    }
    #goods .goods-box:nth-of-type(2) .goods-rank img,
    #goods .goods-box:nth-of-type(3) .goods-rank img {
        width: 28.6vw;
    }

    #goods .goods-box .points-text {
        width: 14.4vw;
    }
    #goods .goods-box:nth-of-type(2) .points-text,
    #goods .goods-box:nth-of-type(3) .points-text {
        width: 10.4vw;
    }

    #goods .pick-up_location-wrapper h5 img {
        width: 44.4vw;
    }

}

/* ==============================
  使用條款
============================== */
#guidelines h3 img {
    width: 31.4%;
}

#guidelines .appli-attention-wrapper h5 img {
    width: 40.2%;
}
@media print, screen and (max-width: 768px) {
    #guidelines h3 img {
        width: 30.7vw;
    }

    #guidelines .appli-attention-wrapper h5 img {
        width: 52.4vw;
    }
}

/* ==============================
  諮詢
============================== */
#contact_us h3 img {
    width: 14.9%;
}
@media print, screen and (max-width: 768px) {
    #contact_us h3 img {
        width: 14.5vw;
    }
}

/* ==============================
  Footer
============================== */
@media print, screen and (max-width: 768px) {
    footer .inner {
        width: 90vw;
    }
    footer p {
        width: 56vw;
    }
    footer p span {
        margin-right: 0;
    }
}