@charset "utf-8";

@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);

*,
a,
span {
    font-family: 'Noto Sans TC', Arial, Helvetica, 微軟正黑體, Microsoft JhengHei, sans-serif;
}

/*====卷軸===*/
/* 細捲軸開始 */
::-webkit-scrollbar {
    height: 5px;
    overflow: visible;
    width: 5px;
}

::-webkit-scrollbar-thumb {
    background-color: #ffe6c5;
    background-clip: padding-box;
    border: solid transparent;
    border-width: 0 0 0 0px;
    min-height: 28px;
    padding: 100px 0 0;
    box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0), inset 0 -1px 0 rgba(0, 0, 0, 0);
}

::-webkit-scrollbar-thumb:hover {
    background-color: #8D8D8D;
    box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0);
}

::-webkit-scrollbar-thumb:active {
    background-color: #666666;
    box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0);
}

::-webkit-scrollbar-track {
    background-color: #1b0f07;
}

/* 細捲軸結束 */
html,
body {
    padding: 0;
    margin: 0;
    overflow-x: hidden;
    background-color: #000000;
    height: auto;
    position: relative;
}

body {
    height: auto;
    overflow: visible;
}

section {
    width: 100%;
    display: inline-block;
    margin: 0;
}

.wrapper {
    position: relative;
}

/*opening - 加入此css_star*/
.opening {
    position: fixed;
    width: 100%;
    height: 100vh;
    background-color: rgb(0, 0, 0);
    z-index: 100;
    opacity: 100;
    pointer-events: none;
}

/*影片背景*/
.op_videoArea {
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 0;
    display: block;
}

.op_videoArea video {
    object-fit: cover;
    object-position: left top;
    height: 100%;
    width: 100%;
}

.hide {
    opacity: 0;
    transition: opacity 2s ease-in-out;
}

@media (max-width:1024px) {
    .op_videoArea video {
        object-fit: contain;
        object-position: 50% 50%;
    }


}

/*opening - 加入此css_end*/

/*out_碎玻璃*/
.out_glass_1 {
    display: none;
}

.out_glass_2 {
    display: none;
}

.out_glass_3 {
    display: none;
}

.out_glass_4 {
    display: none;
}

@media (max-width:767px) {
    .out_glass_1 {
        position: absolute;
        width: 22.32%;
        height: auto;
        padding-bottom: 0%;
        top: 37.5%;
        right: 0%;
        z-index: 52;
        background-color: #065bfa00;
        display: block;
    }

    .out_glass_2 {
        position: absolute;
        width: 27.41%;
        height: auto;
        padding-bottom: 0%;
        top: 78%;
        left: 0%;
        z-index: 64;
        background-color: #065bfa00;
        /*顏色分隔*/
        display: block;
    }

    .out_glass_3 {
        position: absolute;
        width: 8.85%;
        height: auto;
        padding-bottom: 0%;
        top: 60%;
        left: 12%;
        z-index: 64;
        background-color: #065bfa00;
        display: block;
    }

    .out_glass_4 {
        position: absolute;
        width: 19.49%;
        height: auto;
        padding-bottom: 0%;
        top: 83%;
        left: 79%;
        z-index: 64;
        background-color: #065bfa00;
        /*顏色分隔*/
        display: block;
    }
}

/*右側nav*/
.right_nav {
    position: fixed;
    width: 9.16%;
    height: auto;
    padding-bottom: 31%;
    top: 15%;
    right: 2%;
    background: url(../images/right_nav_bg.png) no-repeat;
    background-size: 100%;
    z-index: 75;
    display: block;
}

.right_icon {
    position: absolute;
    width: 62.5%;
    height: auto;
    padding-bottom: 0%;
    top: 9%;
    left: 19%;
    z-index: 76;
}

.right_QR {
    position: absolute;
    width: 62.5%;
    height: auto;
    padding-bottom: 0%;
    top: 29%;
    left: 19%;
    z-index: 76;
}

.right_apple_btn {
    position: absolute;
    width: 80%;
    height: auto;
    padding-bottom: 0%;
    top: 49%;
    left: 11%;
    z-index: 76;
}

.right_apple_btn>img {
    transform: scale(1, 1);
    transition: all 0.2s ease-out;
}

.right_apple_btn>img:hover {
    transform: scale(0.9, 0.9);
}

.right_google_btn {
    position: absolute;
    width: 80%;
    height: auto;
    padding-bottom: 0%;
    top: 57%;
    left: 11%;
    z-index: 76;
}

.right_google_btn>img {
    transform: scale(1, 1);
    transition: all 0.2s ease-out;
}

.right_google_btn>img:hover {
    transform: scale(0.9, 0.9);
}

.right_apk_btn {
    position: absolute;
    width: 80%;
    height: auto;
    padding-bottom: 0%;
    top: 65%;
    left: 11%;
    z-index: 76;
}

.right_apk_btn>img {
    transform: scale(1, 1);
    transition: all 0.2s ease-out;
}

.right_apk_btn>img:hover {
    transform: scale(0.9, 0.9);
}

.right_PC_btn {
    position: absolute;
    width: 80%;
    height: auto;
    padding-bottom: 0%;
    top: 73%;
    left: 11%;
    z-index: 76;
}

.right_PC_btn>img {
    transform: scale(1, 1);
    transition: all 0.2s ease-out;
}

.right_PC_btn>img:hover {
    transform: scale(0.9, 0.9);
}

@media (max-width:1024px) {
    .right_nav {
        display: none;
    }
}


/*--↓主視覺區域↓--*/
.kv_zone {
    position: relative;
    width: 100%;
    height: auto;
    padding-bottom: 48%;
    background: url(../images/ver20251030/LV1_bg_20251030_2.png) no-repeat;
    background-size: 100%;
    padding-top: 30px;
    background-color: #0d192f;
    /*顏色分隔*/
    z-index: 50;
    overflow: hidden;
}

/*壓底*/
.KV_down {
    position: absolute;
    width: 100%;
    height: auto;
    padding-bottom: 0%;
    bottom: 0%;
    left: 0%;
    z-index: 60;
    pointer-events: none;
}

/*logo*/
.KV_logo {
    position: absolute;
    width: 12.72%;
    height: auto;
    padding-bottom: 0%;
    top: 24%;
    left: 43%;
    z-index: 63;

    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
}

/*slogan*/
.slogan {
    position: absolute;
    width: 33.80%;
    height: auto;
    padding-bottom: 0%;
    top: 28%;
    left: 32%;
    z-index: 63;

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

/*裝飾線*/
.KV_line {
    position: absolute;
    width: 37.34%;
    height: auto;
    padding-bottom: 0%;
    top: 63%;
    left: 30.5%;
    z-index: 63;

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

/*M1晶片備註*/
.KV_M1 {
    position: absolute;
    width: 13.22%;
    height: auto;
    padding-bottom: 0%;
    top: 82.8%;
    left: 50.5%;
    z-index: 63;
    display: none;

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

/*KV_下載區*/
.KV_app_box {
    position: absolute;
    width: 31.77%;
    height: auto;
    padding-bottom: 8.5%;
    top: 69%;
    left: 33%;
    background: url(../images/KV_app_bg.png) no-repeat;
    background-size: 100%;
    background-color: rgba(165, 42, 42, 0);
    /*顏色標記*/
    z-index: 63;

    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
}

/*KV_icon*/
.KV_icon {
    position: absolute;
    width: 18.03%;
    height: auto;
    padding-bottom: 0%;
    top: 11%;
    left: 6%;
    z-index: 64;
}

.KV_icon img {
    border-radius: 20px;
}

.game-icon {
    border-radius: 20px;
}

.right_nav .right_icon img {
    border-radius: 20px;
}

/*KV_QR*/
.KV_QR {
    position: absolute;
    width: 18.03%;
    height: auto;
    padding-bottom: 0%;
    top: 11%;
    left: 26%;
    z-index: 64;
}

/*KV_apple store*/
.KV_apple_btn {
    position: absolute;
    width: 24.42%;
    height: auto;
    padding-bottom: 0%;
    top: 15%;
    left: 46%;
    z-index: 64;
}

.KV_apple_btn>img {
    transform: scale(1, 1);
    transition: all 0.2s ease-out;
}

.KV_apple_btn>img:hover {
    transform: scale(0.9, 0.9);
}

/*KV_google play*/
.KV_google_btn {
    position: absolute;
    width: 24.42%;
    height: auto;
    padding-bottom: 0%;
    top: 49%;
    left: 46%;
    z-index: 64;
}

.KV_google_btn>img {
    transform: scale(1, 1);
    transition: all 0.2s ease-out;
}

.KV_google_btn>img:hover {
    transform: scale(0.9, 0.9);
}


/*KV_apk*/
.KV_apk_btn {
    position: absolute;
    width: 24.42%;
    height: auto;
    padding-bottom: 0%;
    top: 15%;
    left: 72%;
    z-index: 64;
}

.KV_apk_btn>img {
    transform: scale(1, 1);
    transition: all 0.2s ease-out;
}

.KV_apk_btn>img:hover {
    transform: scale(0.9, 0.9);
}


/*KV_PC下載*/
.KV_PC_btn {
    position: absolute;
    width: 24.42%;
    height: auto;
    padding-bottom: 0%;
    top: 49%;
    left: 72%;
    z-index: 64;
}

.KV_PC_btn>img {
    transform: scale(1, 1);
    transition: all 0.2s ease-out;
}

.KV_PC_btn>img:hover {
    transform: scale(0.9, 0.9);
}

/*M1晶片備註*/
.KV_M1_in {
    position: absolute;
    width: 45.22%;
    height: auto;
    padding-bottom: 0%;
    top: 79.8%;
    left: 50.5%;
    z-index: 63;
    display: block;

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}


/*裝飾箭頭*/
.KV_arr {
    position: absolute;
    width: 12.39%;
    height: auto;
    padding-bottom: 0%;
    top: 85%;
    left: 42.5%;
    z-index: 63;

    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

/*play_yt*/
.play_yt {
    position: absolute;
    width: 6.09%;
    height: auto;
    /* top: 28%;
    left: 61%; */
    top: 20%;
    left: 47%;
    z-index: 64;
    padding-bottom: 6%;
    background: url(../images/play_bg.png) repeat-x;
    background-size: 100%;

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

.play_btn {
    position: absolute;
    width: 15.38%;
    height: auto;
    top: 35%;
    left: 45%;
    z-index: 64;
    animation: breath 1.5s infinite;
    -webkit-animation: breath 1.5s infinite;
    -moz-animation: breath 1.5s infinite;
    -ms-animation: breath 1.5s infinite;
}

.play_sc {
    position: absolute;
    width: 77.31%;
    height: auto;
    top: 8%;
    left: 12%;
    z-index: 62;
    -webkit-animation: rotate 2s linear infinite;
    -moz-animation: rotate 2s linear infinite;
    -ms-animation: rotate 2s linear infinite;
    animation: rotate 2s linear infinite;
}

.top_arr {
    position: absolute;
    width: 29.01%;
    height: auto;
    padding-bottom: 0%;
    top: 67%;
    left: 36%;
    z-index: 63;

    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

/*下壓波浪*/
.bottom_nami {
    position: absolute;
    width: 100%;
    height: auto;
    padding-bottom: 0%;
    bottom: -1%;
    z-index: 60;
    display: block;
}

.bottom_nami_sp {
    display: none;
}

/*壓黑*/
.LV1_dark_mask {
    position: absolute;
    width: 100%;
    height: auto;
    padding-bottom: 50%;
    top: 0%;
    background-color: #000000;
    opacity: 0.3;
    z-index: 50;
    display: block;
}

/*影片背景*/
.videoArea {
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 0;
    display: block;
}

.videoArea video {
    object-fit: cover;
    object-position: left top;
    height: 100%;
    width: 100%;
}

/*羽毛*/
.KV_feathers_1 {
    display: none;
}

.KV_feathers_2 {
    display: none;
}

.KV_feathers_3 {
    display: none;
}

.KV_feathers_4 {
    display: none;
}

@media (max-width:1230px) {

    /*M1晶片備註*/
    .KV_M1_in {
        position: absolute;
        width: 45.22%;
        height: auto;
        padding-bottom: 0%;
        top: 77.5%;
        left: 50.5%;
    }
}

@media (max-width:1024px) {
    .kv_zone {
        position: relative;
        width: 100%;
        height: auto;
        padding-bottom: 120%;
        background: url(../images/ver20251030/LV1_bg_tb_20251030_2.png) no-repeat;
        background-size: cover;
    }

    /*-黑幕-*/
    .LV1_dark_mask {
        padding-bottom: 140%;
        display: none;
    }

    .bottom_nami {
        width: 162%;
    }

    .KV_logo {
        width: 27.72%;
        top: 37%;
        left: 38%;
        z-index: 66;
    }

    .slogan {
        width: 60.23%;
        top: 41%;
        left: 22%;
    }

    .KV_line {
        width: 68.34%;
        top: 68%;
        left: 16.5%;
    }

    /*M1晶片備註*/
    .KV_M1 {
        width: 35.22%;
        top: 83.8%;
        left: 35.5%;
        z-index: 63;
        display: block;
    }

    /*M1晶片備註*/
    .KV_M1_in {
        display: none;
    }

    .KV_app_box {
        width: 63.77%;
        padding-bottom: 14.5%;
        top: 72%;
        left: 20%;
        background: url(../images/KV_app_bg_tb.png) no-repeat;
        background-size: 100%;
    }

    .KV_google_btn {
        width: 24.42%;
        top: 56%;
        left: 46%;
    }

    .KV_PC_btn {
        width: 24.42%;
        top: 56%;
        left: 72%;
    }

    .KV_arr {
        width: 31.22%;
        top: 85.5%;
        left: 37.5%;
    }

    /*影片背景*/
    .videoArea {
        display: none;
    }

    .play_yt {
        width: 12.09%;
        top: 40%;
        left: 46%;
        padding-bottom: 12%;
        z-index: 66;
    }

    /*羽毛*/
    .KV_feathers_1 {
        position: absolute;
        width: 18.35%;
        height: auto;
        top: 61%;
        left: 28%;
        z-index: 62;
        display: block;
        pointer-events: none;

        animation: up-down-27 5s ease-in-out infinite;
        -webkit-animation: up-down-27 5s ease-in-out infinite;
    }

    .KV_feathers_2 {
        position: absolute;
        width: 4.10%;
        height: auto;
        top: 43%;
        left: 17%;
        z-index: 65;
        display: block;
        pointer-events: none;

        animation: up-down-24 8s ease-in-out infinite;
        -webkit-animation: up-down-24 8s ease-in-out infinite;
    }

    .KV_feathers_3 {
        position: absolute;
        width: 7.61%;
        height: auto;
        top: 51%;
        left: 79%;
        z-index: 65;
        display: block;
        pointer-events: none;

        animation: up-down-25 12s ease-in-out infinite;
        -webkit-animation: up-down-25 12s ease-in-out infinite;
    }

    .KV_feathers_4 {
        position: absolute;
        width: 7.03%;
        height: auto;
        top: 15%;
        left: 73%;
        z-index: 65;
        display: block;
        pointer-events: none;

        animation: up-down-26 14s ease-in-out infinite;
        -webkit-animation: up-down-26 14s ease-in-out infinite;
    }
}

@media (max-width:767px) {
    .kv_zone {
        width: 100%;
        height: auto;
        padding-bottom: 180%;

        background: url(../images/ver20251030/LV1_bg_sp_20251030_1.png) no-repeat;
        background-size: cover;
        overflow: hidden;
    }

    .KV_logo {
        width: 34.72%;
        top: 44%;
        left: 33%;
    }

    .slogan {
        width: 78.23%;
        top: 47%;
        left: 11%;
    }

    .KV_app_box {
        width: 90.77%;
        padding-bottom: 21.5%;
        top: 74%;
        left: 4%;
    }

    .KV_line {
        width: 89.34%;
        top: 70.5%;
        left: 7.5%;
    }

    .KV_M1 {
        width: 44.22%;
        top: 85.2%;
        left: 30.5%;
        z-index: 63;
    }

    .KV_arr {
        width: 43.39%;
        top: 86.8%;
        left: 30.5%;
    }

    .play_yt {
        width: 22.09%;
        top: 35%;
        left: 44%;
        padding-bottom: 22%;
    }

    .LV1_dark_mask {
        display: none;
        padding-bottom: 187%;
    }

    /*sp_下壓波浪*/
    .bottom_nami_sp {
        position: absolute;
        width: 100%;
        height: auto;
        padding-bottom: 0%;
        bottom: -1%;
        z-index: 60;
        display: block;
    }

    /*羽毛*/
    .KV_feathers_1 {
        width: 25.35%;
        top: 58%;
        left: 22%;
        z-index: 62;
        pointer-events: none;

        animation: up-down-28 5s ease-in-out infinite;
        -webkit-animation: up-down-28 5s ease-in-out infinite;
    }

    .KV_feathers_2 {
        width: 6.1%;
        top: 42%;
        left: 8%;
        z-index: 65;
        pointer-events: none;

        animation: up-down-29 8s ease-in-out infinite;
        -webkit-animation: up-down-29 8s ease-in-out infinite;
    }

    .KV_feathers_3 {
        width: 10.61%;
        top: 48%;
        left: 82%;
        z-index: 65;
        pointer-events: none;

        animation: up-down-30 12s ease-in-out infinite;
        -webkit-animation: up-down-30 12s ease-in-out infinite;
    }

    .KV_feathers_4 {
        width: 9.03%;
        top: 10%;
        left: 83%;
        z-index: 65;
        pointer-events: none;

        animation: up-down-31 14s ease-in-out infinite;
        -webkit-animation: up-down-31 14s ease-in-out infinite;
    }
}

@media (max-width: 560px) {
    .KV_M1 {
        width: 60.22%;
        top: 85.2%;
        left: 19.5%;
    }
}

@media (max-width:390px) {
    .KV_M1 {
        width: 60.22%;
        top: 85.5%;
        left: 19.5%;
    }

    .KV_arr {
        width: 43.39%;
        top: 87.8%;
        left: 30.5%;
    }

}

/*--↑主視覺區域↑--*/


/*--↓艾肯BN區↓--*/
.banner_zone {
    position: relative;
    width: 100%;
    height: auto;
    padding-bottom: 15%;
    background: url(../images/banner_zone_bg.jpg) no-repeat;
    background-size: cover;
    padding-top: 30px;
    background-color: #eb153100;
    /*顏色分隔*/
    z-index: 50;
}

.index_bg06_mc {
    width: 60%;
    height: auto;
    display: block;
    position: absolute;
    padding-bottom: 12%;
    left: 27%;
    top: 19%;
    margin-left: -7.5rem;
}

#certify .swiper-container {
    height: auto;
    overflow: hidden;
}

#certify .swiper-slide {
    width: 60%;
    height: 80%;
    padding: 0.21rem 0.15rem;
    display: block;
}

#certify .swiper-slide img {
    width: 100%;
    height: 100%;
}

/* 前ページ、次ページボタン共通のスタイル */
.swiper2-button-prev,
.swiper2-button-next {
    position: absolute;
    top: 36%;
    /*2箭頭整體位置*/
    width: 48px;
    /* ボタンの幅 */
    height: 48px;
    /* ボタンの高さ */
    background-size: 48px 48px;
    /* 背景画像としてのサイズ（＝表示したい画像サイズ） */
    z-index: 70;
    outline: none;
    display: block;
    background-color: #f00f2a;
}

/* 次ページボタンのスタイル */
.swiper2-button-next {
    background: url(../images/prev_arr.png) no-repeat;
    background-size: 100%;
    left: -8%;
    width: 72px;
    height: 54px;
    top: 19%;
}

/* 前ページボタンのスタイル */
.swiper2-button-prev {
    background: url(../images/next_arr.png) no-repeat;
    background-size: 100%;
    right: -8%;
    width: 72px;
    height: 54px;
    top: 19%;
}

@media (max-width:1440px) {
    .swiper2-button-next {
        left: -13%;
    }

    .swiper2-button-prev {
        right: -13%;
    }
}

@media (max-width:1024px) {
    .banner_zone {
        position: relative;
        width: 100%;
        height: auto;
        padding-bottom: 17%;
        background: url(../images/banner_zone_bg_tb.jpg) no-repeat;
        background-size: cover;
    }

    .index_bg06_mc {
        width: 90%;
        left: 20%;
        top: 0%;
        margin-left: -15%;
    }

    #certify .swiper-slide {
        width: 76%;
        padding: 0.105rem 0.075rem;
        display: block;
    }

    #certify .swiper-slide img {
        width: 100%;
        height: 100%;
    }

    .swiper2-button-prev,
    .swiper2-button-next {
        top: 72%;
    }

    .swiper2-button-prev {
        right: -3%;
    }

    .swiper2-button-next {
        left: -3%;
    }
}

@media (max-width:767px) {
    .banner_zone {
        position: relative;
        width: 100%;
        height: auto;
        padding-bottom: 16.5%;
        background: url(../images/banner_zone_bg_sp.jpg) no-repeat center top;
        background-size: cover;
    }

    .index_bg06_mc {
        padding-bottom: 19%;
        top: 8%;
    }

    #certify .swiper-slide {
        width: 65%;
    }

    .swiper2-button-prev,
    .swiper2-button-next {
        display: none;
    }
}

@media (max-width:414px) {
    .index_bg06_mc {
        top: 1%;
    }

    #certify .swiper-slide {
        width: 80%;
    }
}

/*--↑艾肯BN區↑--*/


/*--↓news+角色↓--*/
.LV2 {
    position: relative;
    width: 100%;
    height: auto;
    padding-bottom: 115.7%;
    background: url(../images/LV2_bg.jpg) no-repeat;
    background-size: cover;
    padding-top: 30px;
    background-color: #065bfa;
    /*顏色分隔*/
    z-index: 50;
    overflow: hidden;
}

/*標題*/
.LV2_title_1 {
    position: absolute;
    width: 32.23%;
    height: auto;
    padding-bottom: 0%;
    top: 1%;
    left: 33.5%;
    z-index: 63;
    background-color: #065bfa00;
    /*顏色分隔*/

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

/*標題影*/
.LV2_title_1_bg {
    display: none;
}

/*新聞_tab*/
.news_tab_box {
    position: absolute;
    width: 65.41%;
    height: auto;
    padding-bottom: 5%;
    top: 9%;
    left: 17.5%;
    z-index: 63;
    background: url(../images/news_teb_bg.png) no-repeat;
    background-size: 100%;
    background-color: #065bfa00;
    /*顏色分隔*/
    display: flex;
    flex-direction: row;
    justify-content: center;

    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
}

.news_inner_tab {
    display: inline-block;
    background-color: #3e09a100;
    /*顏色標記*/
    width: 14.98%;
    height: auto;
    margin-top: 1%;
    margin-left: 1%;
    margin-right: 1%;
    padding-bottom: 5%;
}

.news_inner_tab:nth-child(1) {
    background-image: url(../images/news_teb_1_2.png);
    background-repeat: no-repeat;
    background-size: 100%;
}

.news_inner_tab:nth-child(2) {
    background-image: url(../images/news_teb_2_2.png);
    background-repeat: no-repeat;
    background-size: 100%;
}

.news_inner_tab:nth-child(3) {
    background-image: url(../images/news_teb_3_2.png);
    background-repeat: no-repeat;
    background-size: 100%;
}

.news_inner_tab:nth-child(4) {
    background-image: url(../images/news_teb_4_2.png);
    background-repeat: no-repeat;
    background-size: 100%;
}

.news_inner_tab:nth-child(1).now {
    background-image: url(../images/news_teb_1.png);
    background-repeat: no-repeat;
    background-size: 100%;
}

.news_inner_tab:nth-child(2).now {
    background-image: url(../images/news_teb_2.png);
    background-repeat: no-repeat;
    background-size: 100%;
}

.news_inner_tab:nth-child(3).now {
    background-image: url(../images/news_teb_3.png);
    background-repeat: no-repeat;
    background-size: 100%;
}

.news_inner_tab:nth-child(4).now {
    background-image: url(../images/news_teb_4.png);
    background-repeat: no-repeat;
    background-size: 100%;
}

.click img {
    transition: 0.5s ease-in-out;
}

/*新聞_主區*/
.news_con_box {
    position: absolute;
    width: 58.17%;
    height: auto;
    padding-bottom: 31%;
    top: 14%;
    left: 21%;
    z-index: 63;
    background: url(../images/news_con_bg.png) no-repeat;
    background-size: 100%;
    background-color: #065bfa00;
    /*顏色分隔*/

    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

.news_inner_con {
    position: absolute;
    width: 87%;
    height: 82%;
    /*height: auto;*/
    top: 9%;
    left: 6%;
    /*padding-bottom: 6%;*/
    background-color: #0ff06d00;
    /*顏色標記*/
    display: none;
}

.list_box {
    width: 100%;
    height: auto;
    padding-bottom: 7.4%;
    padding-top: 1%;
    background-color: #f0c70f00;
    /*顏色標記*/
    border-bottom: 1px #728996 dashed;
}

.news_type_icon {
    width: 20%;
    height: auto;
    float: left;
}

.news_type_icon>img {
    transform: scale(1, 1);
    transition: all 0.2s ease-out;
}

/*標題*/
.list_title {
    width: 67%;
    height: auto;
    padding-top: 0.7%;
    margin-left: 1%;
    line-height: 43px;
    background-color: rgba(165, 42, 42, 0);
    /*顏色標記*/
    float: left;
}

.list_title p {
    font-size: 1vw;
    color: #ffffff;
    font-weight: 600;
    margin-block-start: 0em;
    margin-block-end: 0em;

    /*文字...*/
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/*日期*/
.list_deta {
    width: 10%;
    height: auto;
    padding-top: 0.7%;
    margin-left: 0%;
    line-height: 43px;
    background-color: rgba(165, 42, 42, 0);
    /*顏色標記*/
    float: right;
}

.list_deta p {
    font-size: 1vw;
    color: #fddc6a;
    font-weight: 100;
    margin-block-start: 0em;
    margin-block-end: 0em;
}

.list_box:hover {
    background-color: #d5d9e19d;
}

.list_box:hover>.news_type_icon>img {
    transform: scale(0.9, 0.9);
}

/*more按鈕*/
.news_more_btn {
    position: absolute;
    width: 25.90%;
    height: auto;
    padding-bottom: 0%;
    bottom: 0%;
    left: 37%;
}

.news_more_btn>img {
    transform: scale(1, 1);
    transition: all 0.2s ease-out;
}

.news_more_btn>img:hover {
    transform: scale(0.9, 0.9);
}

.news_inner_con:nth-child(2) {
    background-color: #0f69f000;
    /*顏色標記*/
    display: none;
}

.news_inner_con:nth-child(3) {
    background-color: #f0c70f00;
    /*顏色標記*/
    display: none;
}

.news_inner_con:nth-child(4) {
    background-color: #f00f1a00;
    /*顏色標記*/
    display: none;
}

.news_inner_con.now {
    display: block;
}

/*下方裝飾*/
.news_con_decoration {
    position: absolute;
    width: 25.31%;
    height: auto;
    padding-bottom: 0%;
    top: 39.3%;
    left: 37.5%;
    z-index: 63;
    background-color: #065bfa00;
    /*顏色分隔*/

    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
}

/*飛行貓*/
.fly_cat_1 {
    position: absolute;
    width: 6.51%;
    height: auto;
    padding-bottom: 0%;
    top: 18.3%;
    left: 78.5%;
    z-index: 63;
    display: block;
    background-color: #065bfa00;
    /*顏色分隔*/
    animation: up-down-5 5s ease-in-out infinite;
    -webkit-animation: up-down-5 5s ease-in-out infinite;
}

.fly_cat_2 {
    position: absolute;
    width: 12.86%;
    height: auto;
    padding-bottom: 0%;
    top: 28.3%;
    left: 75.5%;
    z-index: 63;
    display: block;
    background-color: #065bfa00;
    /*顏色分隔*/
    animation: up-down-6 8s ease-in-out infinite;
    -webkit-animation: up-down-6 8s ease-in-out infinite;
}

.fly_cat_3 {
    position: absolute;
    width: 5.57%;
    height: auto;
    padding-bottom: 0%;
    top: 22.3%;
    left: 16.5%;
    z-index: 63;
    display: block;
    background-color: #065bfa00;
    /*顏色分隔*/

    animation: up-down-7 12s ease-in-out infinite;
    -webkit-animation: up-down-7 12s ease-in-out infinite;
}

.fly_boat {
    position: absolute;
    width: 12.73%;
    height: auto;
    padding-bottom: 0%;
    top: 15.3%;
    left: 9.5%;
    z-index: 62;
    display: block;
    background-color: #065bfa00;
    /*顏色分隔*/

    animation: up-down-8 12s ease-in-out infinite;
    -webkit-animation: up-down-8 12s ease-in-out infinite;
}

/*----角色_star----*/
/*標題*/
.LV2_title_2 {
    position: absolute;
    width: 32.23%;
    height: auto;
    padding-bottom: 0%;
    top: 55%;
    left: 33.5%;
    z-index: 63;
    background-color: #065bfa00;
    /*顏色分隔*/

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

/*碎玻璃*/
.glass_1 {
    position: absolute;
    width: 14.32%;
    height: auto;
    padding-bottom: 0%;
    top: 52%;
    right: 0%;
    z-index: 64;
    background-color: #065bfa00;
    /*顏色分隔*/
    display: block;

    animation: up-down 5s ease-in-out infinite;
    -webkit-animation: up-down 5s ease-in-out infinite;
}

.glass_2 {
    position: absolute;
    width: 14.41%;
    height: auto;
    padding-bottom: 0%;
    top: 74%;
    left: 0%;
    z-index: 64;
    background-color: #065bfa00;
    /*顏色分隔*/
    display: block;

    animation: up-down-2 8s ease-in-out infinite;
    -webkit-animation: up-down-2 8s ease-in-out infinite;
}

.glass_3 {
    position: absolute;
    width: 8.85%;
    height: auto;
    padding-bottom: 0%;
    top: 63%;
    left: 12%;
    z-index: 64;
    background-color: #065bfa00;
    /*顏色分隔*/
    display: block;

    animation: up-down-3 12s ease-in-out infinite;
    -webkit-animation: up-down-3 12s ease-in-out infinite;
}

.glass_4 {
    position: absolute;
    width: 23.49%;
    height: auto;
    padding-bottom: 0%;
    top: 73%;
    left: 79%;
    z-index: 64;
    background-color: #065bfa00;
    /*顏色分隔*/
    display: block;

    animation: up-down-4 12s ease-in-out infinite;
    -webkit-animation: up-down-4 12s ease-in-out infinite;
}

/*角色區*/
.job_title_2 {
    position: absolute;
    width: 2.65%;
    height: auto;
    padding-bottom: 0%;
    top: 59%;
    left: 23.5%;
    z-index: 63;
    display: block;

    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
}

/*-pc角色選項-*/
/* 2023 更新↓↓↓ */
.pc_tab_box {
    position: absolute;
    width: 14%;
    height: 33%;
    background-color: rgba(127, 255, 212, 0);
    /*顏色標記*/
    /* padding-bottom: 36%; */
    top: 61%;
    left: 19%;
    z-index: 63;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 2%;
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
}

.ch_inner_tab {
    display: inline-block;
    background-color: #3e09a100;
    /*顏色標記*/
    width: 100%;
    height: auto;
    padding-bottom: 20%;
    margin-bottom: 2%;
}

.ch_inner_tab:nth-child(1) {
    background: url(../images/ch_tab_pc_1_sp.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 50%;
    height: 10%;
    margin-left: -2%;
}

.ch_inner_tab:nth-child(2) {
    background: url(../images/ch_tab_pc_2_sp.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 50%;
    height: 10%;
}

.ch_inner_tab:nth-child(3) {
    background: url(../images/ch_tab_pc_3_sp.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 50%;
    height: 10%;
}

.ch_inner_tab:nth-child(4) {
    background: url(../images/ch_tab_pc_4_sp.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 50%;
    height: 10%;
}

.ch_inner_tab:nth-child(5) {
    background: url(../images/ch_tab_pc_5_sp.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 50%;
    height: 10%;
    margin-left: -5%;
}

.ch_inner_tab:nth-child(6) {
    background: url(../images/ch_tab_pc_6_sp.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 50%;
    height: 10%;
    margin-left: -13%;
}

.ch_inner_tab:nth-child(7) {
    background: url(../images/ch_tab_pc_7_sp.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 50%;
    height: 10%;
    margin-left: -15%;
}

.ch_inner_tab:nth-child(8) {
    background: url(../images/ch_tab_pc_8_sp.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 50%;
    height: 10%;
    margin-left: -15%;
}

.ch_inner_tab:nth-child(9) {
    background: url(../images/ch_tab_pc_9_sp.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 50%;
    height: 10%;
    margin-left: -12%;
}

.ch_inner_tab:nth-child(1).now {
    background-image: url(../images/ch_tab_pc_1_2_sp.png);
}

.ch_inner_tab:nth-child(2).now {
    background-image: url(../images/ch_tab_pc_2_2_sp.png);
}

.ch_inner_tab:nth-child(3).now {
    background-image: url(../images/ch_tab_pc_3_2_sp.png);
}

.ch_inner_tab:nth-child(4).now {
    background-image: url(../images/ch_tab_pc_4_2_sp.png);
}

.ch_inner_tab:nth-child(5).now {
    background-image: url(../images/ch_tab_pc_5_2_sp.png);
}

.ch_inner_tab:nth-child(6).now {
    background-image: url(../images/ch_tab_pc_6_2_sp.png);
}

.ch_inner_tab:nth-child(7).now {
    background-image: url(../images/ch_tab_pc_7_2_sp.png);
}

.ch_inner_tab:nth-child(8).now {
    background-image: url(../images/ch_tab_pc_8_2_sp.png);
}

.ch_inner_tab:nth-child(9).now {
    background-image: url(../images/ch_tab_pc_9_2_sp.png);
}
/* 2023 更新↑↑↑ */

.ch_inner_tab_3.now3 {}

.click {
    /*-webkit-filter: drop-shadow(0px 0px 14px rgba(240, 184, 211, 0.9));
	filter: drop-shadow(0px 0px 14px rgba(240, 184, 211, 0.9));*/
    /*pointer-events: none;*/
}

.click img {
    transition: 0.5s ease-in-out;
}

.after {
    /*pointer-events: none;*/
}

.after img {
    -webkit-filter: grayscale(1.3);
    filter: grayscale(1.3);
    transition: 0.5s ease-in-out;
}

.sp_ch_tab {
    display: none;
}

.sp_tab_bg {
    display: none;
}

/*pc_角色內容區*/
.ch_info_box {
    position: absolute;
    width: 63.02%;
    height: auto;
    padding-bottom: 34%;
    top: 61.5%;
    left: 19%;
    z-index: 62;
    background-color: #0f70f000;
    /*顏色標記*/

    display: block;
}

.ch_inner_con {
    position: absolute;
    width: 100%;
    height: auto;
    padding-bottom: 50%;
    background-color: #0ff06d00;
    /*顏色標記*/
    display: none;
    z-index: 61;
}

.ch_inner_con.now {
    display: block;
}

/*pc聖堂*/
.right_job_info {
    position: absolute;
    width: 85.54%;
    height: auto;
    padding-bottom: 6%;
    background-color: #4b0ff000;
    /*顏色標記*/
    left: 21%;
    z-index: 63;
}

.left_job_info {
    position: absolute;
    width: 23.96%;
    height: auto;
    padding-bottom: 6%;
    background-color: #cef00f00;
    /*顏色標記*/
    left: 26%;
    top: 8%;
    z-index: 64;
}

.ko_tab_bg {
    position: absolute;
    width: 21.06%;
    height: auto;
    padding-bottom: 0%;
    background-color: #cef00f00;
    /*顏色標記*/
    left: 27%;
    top: 90%;
    pointer-events: none;
    z-index: 64;
}

/*PC 玉虛*/
.right_job_info_2 {
    position: absolute;
    width: 58.75%;
    height: auto;
    padding-bottom: 6%;
    background-color: #4b0ff000;
    /*顏色標記*/
    left: 39%;
    top: -6%;
    z-index: 63;
}

.left_job_info_2 {
    position: absolute;
    width: 23.96%;
    height: auto;
    padding-bottom: 6%;
    background-color: #cef00f00;
    /*顏色標記*/
    left: 26%;
    top: 8%;
    z-index: 64;
}

/*PC 靈瓏*/
.right_job_info_3 {
    position: absolute;
    width: 50.75%;
    height: auto;
    padding-bottom: 6%;
    background-color: #4b0ff000;
    /*顏色標記*/
    left: 45%;
    top: 5%;
    z-index: 63;
}

.left_job_info_3 {
    position: absolute;
    width: 24.54%;
    height: auto;
    padding-bottom: 6%;
    background-color: #cef00f00;
    /*顏色標記*/
    left: 26%;
    top: 8%;
    z-index: 64;
}

/*PC 光刃*/
.right_job_info_4 {
    position: absolute;
    width: 65.48%;
    height: auto;
    padding-bottom: 6%;
    background-color: #4b0ff000;
    /*顏色標記*/
    left: 35%;
    top: -12%;
    z-index: 63;
}

.left_job_info_4 {
    position: absolute;
    width: 25.6%;
    height: auto;
    padding-bottom: 6%;
    background-color: #cef00f00;
    /*顏色標記*/
    left: 25.4%;
    top: 8%;
    z-index: 64;
}

/*PC 流光*/
.right_job_info_5 {
    position: absolute;
    width: 59.9%;
    height: auto;
    padding-bottom: 6%;
    background-color: #4b0ff000;
    left: 41%;
    top: 1%;
    z-index: 63;
}

.left_job_info_5 {
    position: absolute;
    width: 25.6%;
    height: auto;
    padding-bottom: 6%;
    background-color: #cef00f00;
    /*顏色標記*/
    left: 25.4%;
    top: 8%;
    z-index: 64;
}

/*PC 光昭*/
.right_job_info_6 {
    position: absolute;
    width: 59.9%;
    height: auto;
    padding-bottom: 6%;
    background-color: #4b0ff000;
    left: 41%;
    top: 1%;
    z-index: 63;
}

.left_job_info_6 {
    position: absolute;
    width: 27.11%;
    height: auto;
    padding-bottom: 6%;
    background-color: #cef00f00;
    /*顏色標記*/
    left: 24.6%;
    top: 7.3%;
    z-index: 64;
}

/*PC 炎天*/
.right_job_info_7 {
    position: absolute;
    width: 59.9%;
    height: auto;
    padding-bottom: 6%;
    background-color: #4b0ff000;
    left: 43%;
    top: 1%;
    z-index: 63;
}

.left_job_info_7 {
    position: absolute;
    width: 27.11%;
    height: auto;
    padding-bottom: 6%;
    background-color: #cef00f00;
    /*顏色標記*/
    left: 24.6%;
    top: 7.3%;
    z-index: 64;
}

/*PC 業剎*/
.right_job_info_8 {
    position: absolute;
    width: 59.9%;
    height: auto;
    padding-bottom: 6%;
    background-color: #4b0ff000;
    left: 43%;
    top: 1%;
    z-index: 63;
}

.left_job_info_8 {
    position: absolute;
    width: 27.11%;
    height: auto;
    padding-bottom: 6%;
    background-color: #cef00f00;
    /*顏色標記*/
    left: 24.6%;
    top: 7.3%;
    z-index: 64;
}

/*2023 更新↓↓↓ 飾羽 */
.right_job_info_9 {
    position: absolute;
    width: 59.9%;
    height: auto;
    padding-bottom: 6%;
    background-color: #4b0ff000;
    left: 33%;
    top: 1%;
    z-index: 63;
}

.left_job_info_9 {
    position: absolute;
    width: 27.11%;
    height: auto;
    padding-bottom: 6%;
    background-color: #cef00f00;
    /*顏色標記*/
    left: 24.6%;
    top: 7.3%;
    z-index: 64;
}
/* 2023 更新↑↑↑ 飾羽 */

/*角色背景*/
.ch_bg {
    position: absolute;
    width: 100%;
    height: auto;
    padding-bottom: 0%;
    top: 39%;
    left: 0%;
    z-index: 60;
    pointer-events: none;
    background-color: #065bfa00;
    /*顏色分隔*/
}

/*星星背景物件*/
.lv2_star_1 {
    position: absolute;
    width: 4.68%;
    height: auto;
    padding-bottom: 0%;
    top: 11%;
    left: 11.5%;
    z-index: 61;

    animation: kirakira 0.6s infinite alternate cubic-bezier(0.645, 0.045, 0.355, 1);
}

.lv2_star_2 {
    position: absolute;
    width: 4.68%;
    height: auto;
    padding-bottom: 0%;
    top: 70%;
    left: 8.5%;
    z-index: 61;

    animation: kirakira 0.9s infinite alternate cubic-bezier(0.645, 0.045, 0.355, 1);
}

.lv2_star_3 {
    position: absolute;
    width: 4.68%;
    height: auto;
    padding-bottom: 0%;
    top: 37%;
    left: 79.5%;
    z-index: 61;

    animation: kirakira 1.1s infinite alternate cubic-bezier(0.645, 0.045, 0.355, 1);
}

.lv2_star_4 {
    position: absolute;
    width: 4.68%;
    height: auto;
    padding-bottom: 0%;
    top: 79%;
    left: 79.5%;
    z-index: 61;

    animation: kirakira 0.7s infinite alternate cubic-bezier(0.645, 0.045, 0.355, 1);
}

.lv2_star_5 {
    position: absolute;
    width: 4.68%;
    height: auto;
    padding-bottom: 0%;
    top: 59%;
    left: 71.5%;
    z-index: 61;

    animation: kirakira 0.9s infinite alternate cubic-bezier(0.645, 0.045, 0.355, 1);
}

.lv2_star_6 {
    position: absolute;
    width: 4.68%;
    height: auto;
    padding-bottom: 0%;
    top: 84%;
    left: 16.5%;
    z-index: 61;

    animation: kirakira 1.3s infinite alternate cubic-bezier(0.645, 0.045, 0.355, 1);
}

@media (max-width:1260px) {
    .list_title {
        padding-top: 0%;
    }

    .list_deta {
        padding-top: 0%;
    }
}

@media (max-width:1024px) {
    .LV2 {
        position: relative;
        width: 100%;
        height: auto;
        padding-bottom: 161%;
        background: url(../images/LV2_bg_tb.jpg) no-repeat;
        background-size: cover;
    }

    /*新聞區*/
    .LV2_title_1 {
        width: 49.23%;
        top: 1%;
        left: 26.5%;
    }

    .LV2_title_1_bg {
        position: absolute;
        width: 82.23%;
        height: auto;
        padding-bottom: 0%;
        top: -3%;
        left: 16.5%;
        z-index: 62;
        display: none;
        background-color: #065bfa00;

        -webkit-animation-delay: 0.6s;
        animation-delay: 0.6s;
    }

    .news_tab_box {
        width: 88.41%;
        padding-bottom: 5%;
        top: 9%;
        left: 6.5%;
    }

    .news_inner_tab {
        width: 16.98%;
    }

    .news_con_box {
        width: 88.17%;
        padding-bottom: 47%;
        top: 14%;
        left: 7%;
    }

    .news_con_decoration {
        width: 49.31%;
        top: 41.2%;
        left: 26.5%;
    }

    .list_title {
        width: 60%;
    }

    .list_title p {
        font-size: 1.8vw;
    }

    .list_deta {
        width: 10%;
        margin-right: 3%;
    }

    .list_deta p {
        font-size: 1.8vw;
    }

    /*角色區*/
    .LV2_title_2 {
        width: 49.23%;
        top: 54%;
        left: 26.5%;
    }

    .job_title_2 {
        width: 4%;
        height: auto;
        padding-bottom: 0%;
        top: 58.5%;
        left: 14%;
    }

    /* 2023 更新↓↓↓ */
    .pc_tab_box {
        width: 18%;
        height: 27%;
        background-color: rgba(119, 15, 179, 0); /*顏色標記*/
        padding-bottom: 47%;
        top: 62.5%;
        left: 11%;
    }

    .ch_inner_tab {
        padding-bottom: 22%;
    }
    /* 2023 更新↑↑↑ */

    .ch_info_box {
        width: 92.02%;
        height: auto;
        padding-bottom: 34%;
        top: 61.5%;
        left: 5%;
        display: block;
    }

    /*角色背景*/
    .ch_bg {
        width: 133%;
        top: 41%;
        left: -26%;
    }

    /*碎玻璃*/
    .glass_1 {
        width: 14.32%;
        top: 54%;
        right: 0%;
        animation: up-down-10 12s ease-in-out infinite;
        -webkit-animation: up-down-10 12s ease-in-out infinite;
    }

    .glass_3 {
        width: 8.85%;
        top: 63%;
        left: 3%;
        animation: up-down-11 12s ease-in-out infinite;
        -webkit-animation: up-down-11 12s ease-in-out infinite;
    }

    .glass_4 {
        width: 23.49%;
        top: 89%;
        left: 89%;
        animation: up-down-12 8s ease-in-out infinite;
        -webkit-animation: up-down-12 8s ease-in-out infinite;
    }

    /*飛貓*/
    .fly_cat_1 {
        width: 6.51%;
        top: 3.3%;
        left: 90.5%;
        animation: up-down-13 5s ease-in-out infinite;
        -webkit-animation: up-down-13 5s ease-in-out infinite;
    }

    .fly_cat_2 {
        width: 14.86%;
        top: 37.3%;
        left: 83.5%;
        animation: up-down-14 8s ease-in-out infinite;
        -webkit-animation: up-down-14 8s ease-in-out infinite;
    }

    .fly_cat_3 {
        width: 6.57%;
        top: 47.3%;
        left: 16.5%;
        animation: up-down-15 12s ease-in-out infinite;
        -webkit-animation: up-down-15 12s ease-in-out infinite;
    }

    .fly_boat {
        width: 18.73%;
        top: 2.3%;
        left: 4.5%;
        animation: up-down-16 12s ease-in-out infinite;
        -webkit-animation: up-down-16 12s ease-in-out infinite;
    }

}

@media (max-width:767px) {
    .LV2 {
        width: 100%;
        height: auto;
        padding-bottom: 279%;
        background: url(../images/LV2_bg_sp.jpg) no-repeat;
        background-size: cover;
        background-color: rgba(165, 42, 42, 0);
        /*顏色標記*/
        overflow: hidden;
    }

    .LV2_title_1 {
        width: 69.23%;
        top: 1%;
        left: 17.5%;
    }

    .LV2_title_1_bg {
        width: 105.23%;
        padding-bottom: 0%;
        top: -1.5%;
        left: 0.5%;
        z-index: 62;
    }

    .news_tab_box {
        width: 121.41%;
        padding-bottom: 2%;
        top: 9%;
        left: -10.5%;
    }

    .list_box {
        width: 100%;
        height: auto;
        padding-bottom: 12.4%;
        padding-top: 0%;
    }

    .news_type_icon {
        width: 20%;
        height: auto;
        float: left;
        margin-top: 2%;
    }

    .list_title {
        width: 57%;
        line-height: 33px;
    }

    .list_title p {
        font-size: 2.8vw;
        font-weight: 600;
    }

    .list_deta {
        margin-right: 9%;
        line-height: 33px;
    }

    .list_deta p {
        font-size: 2.8vw;
        font-weight: 600;
    }

    .news_more_btn {
        width: 40.9%;
        padding-bottom: 0%;
        bottom: 2%;
        left: 30%;
    }

    .news_con_decoration {
        width: 68.31%;
        top: 41%;
        left: 16.5%;
    }

    .news_con_box {
        width: 96.17%;
        padding-bottom: 80%;
        top: 14%;
        left: 2%;
        background: url(../images/news_con_bg_sp.png) no-repeat;
        background-size: 100%;
    }

    .list_box {
        width: 100%;
        height: auto;
        padding-bottom: 11.4%;
        padding-top: 1%;
    }

    .fly_boat {
        display: none;
    }

    .fly_cat_1 {
        display: none;
    }

    .fly_cat_2 {
        width: 25.86%;
        top: 40.3%;
        left: 57.5%;
        animation: up-down-18 8s ease-in-out infinite;
        -webkit-animation: up-down-18 8s ease-in-out infinite;
    }

    .fly_cat_3 {
        width: 13.57%;
        top: 44.3%;
        left: 7.5%;
        animation: up-down-17 12s ease-in-out infinite;
        -webkit-animation: up-down-17 12s ease-in-out infinite;
    }

    /*角色區*/
    .LV2_title_2 {
        width: 69.23%;
        top: 52%;
        left: 17.5%;
    }

    .LV5_title_2 {
        display: none;
    }

    .job_title_2 {
        display: none;
    }

    /* 2023 更新↓↓↓ */
    .pc_tab_box {
        width: 90%;
        height: 10%;
        background-color: rgba(230, 24, 110, 0); /*顏色標記*/
        padding-bottom: 9%;
        top: 86%;
        left: 5%;
        z-index: 63;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        margin-bottom: 2%;
    }
    /* 2023 更新↑↑↑ */

    .sp_tab_bg {
        width: 98%;
        height: auto;
        padding-bottom: 10%;
        top: 89.5%;
        left: 1%;
        z-index: 60;
        background-color: #3f5269;
        opacity: 0.7;
        border-radius: 20px;
        display: block;
        position: absolute;
    }

    .ch_info_box {
        width: 168.02%;
        padding-bottom: 34%;
        top: 58.5%;
        left: -32%;
        display: block;
    }

    .right_job_info {
        width: 85.54%;
        padding-bottom: 6%;
        left: 14%;
    }

    .right_job_info_2 {
        width: 62.75%;
        padding-bottom: 6%;
        left: 28%;
        top: 3%;
    }

    .right_job_info_3 {
        width: 50.75%;
        padding-bottom: 6%;
        left: 35%;
        top: 12%;
    }

    .right_job_info_4 {
        width: 65.48%;
        padding-bottom: 6%;
        left: 28%;
        top: -12%;
    }

    .right_job_info_5 {
        width: 61.9%;
        padding-bottom: 6%;
        left: 34%;
        top: 5%;
    }

    .right_job_info_6 {
        width: 59.9%;
        padding-bottom: 6%;
        left: 33%;
        top: 3%;
    }

    .right_job_info_7 {
        width: 59.9%;
        padding-bottom: 6%;
        left: 33%;
        top: 3%;
    }

    .right_job_info_8 {
        width: 59.9%;
        padding-bottom: 6%;
        left: 33%;
        top: 3%;
    }

    /* 2023 更新↓↓↓ */
    .right_job_info_9 {
        width: 61.9%;
        left: 25%;
        top: 0%;
    }

    .ch_inner_tab:nth-child(1) {
        background: url(../images/ch_tab_pc_1_sp.png) no-repeat;
        background-size: 100%;
        width: 20%;
        height: auto;
    }

    .ch_inner_tab:nth-child(2) {
        background: url(../images/ch_tab_pc_2_sp.png) no-repeat;
        background-size: 100%;
        width: 20%;
        height: auto;
        margin-left: 0;
    }

    .ch_inner_tab:nth-child(3) {
        background: url(../images/ch_tab_pc_3_sp.png) no-repeat;
        background-size: 100%;
        width: 20%;
        height: auto;
    }

    .ch_inner_tab:nth-child(4) {
        background: url(../images/ch_tab_pc_4_sp.png) no-repeat;
        background-size: 100%;
        width: 20%;
        height: auto;
    }

    .ch_inner_tab:nth-child(5) {
        background: url(../images/ch_tab_pc_5_sp.png) no-repeat;
        background-size: 100%;
        width: 20%;
        height: auto;
        margin-left: 0;
    }

    .ch_inner_tab:nth-child(6) {
        background: url(../images/ch_tab_pc_6_sp.png) no-repeat;
        background-size: 100%;
        width: 20%;
        height: auto;
        margin-left: -3%;
        margin-top: -10%;
    }

    .ch_inner_tab:nth-child(7) {
        background: url(../images/ch_tab_pc_7_sp.png) no-repeat;
        background-size: 100%;
        width: 20%;
        height: auto;
        margin-left: 0%;
        margin-top: -10%;
    }

    .ch_inner_tab:nth-child(8) {
        background: url(../images/ch_tab_pc_8_sp.png) no-repeat;
        background-size: 100%;
        width: 20%;
        height: auto;
        margin-left: 0%;
        margin-top: -10%;
    }

    .ch_inner_tab:nth-child(9) {
        background: url(../images/ch_tab_pc_9_sp.png) no-repeat;
        background-size: 100%;
        width: 20%;
        height: auto;
        margin-left: 1%;
        margin-top: -10%;
    }

    /* .ch_inner_tab:nth-child(1).now {
        background: url(../images/ch_tab_pc_1_2_sp.png) no-repeat;
    }

    .ch_inner_tab:nth-child(2).now {
        background: url(../images/ch_tab_pc_2_2_sp.png) no-repeat;
    }

    .ch_inner_tab:nth-child(3).now {
        background: url(../images/ch_tab_pc_3_2_sp.png) no-repeat;
    }

    .ch_inner_tab:nth-child(4).now {
        background: url(../images/ch_tab_pc_4_2_sp.png) no-repeat;
    }

    .ch_inner_tab:nth-child(5).now {
        background: url(../images/ch_tab_pc_5_2_sp.png) no-repeat;
    }

    .ch_inner_tab:nth-child(6).now {
        background: url(../images/ch_tab_pc_6_2_sp.png) no-repeat;
    }

    .ch_inner_tab:nth-child(7).now {
        background: url(../images/ch_tab_pc_7_2_sp.png) no-repeat;
    }

    .ch_inner_tab:nth-child(8).now {
        background: url(../images/ch_tab_pc_8_2_sp.png) no-repeat;
    }

    .ch_inner_tab:nth-child(9).now {
        background: url(../images/ch_tab_pc_8_2_sp.png) no-repeat;
    } */

    .ch_bg {
        width: 238%;
        top: 40%;
        left: -94%;
    }

    .sp_tab_bg {
        /* width: 98%;
        padding-bottom: 29%;
        top: 84.8%;
        left: 1%;
        z-index: 62;
        background-color: #f1f1f147;
        opacity: 0.7; */
        display: none;
    }

    .left_job_info,
    .left_job_info_2,
    .left_job_info_3,
    .left_job_info_4,
    .left_job_info_5,
    .left_job_info_6,
    .left_job_info_7,
    .left_job_info_8,
    .left_job_info_9 {
        top: 0%;
    }

    .ko_tab_bg {
        top: 82%;
    }
    /* 2023 更新↑↑↑ */

    /*碎玻璃*/
    .glass_1 {
        display: none;
    }

    .glass_2 {
        display: none;
    }

    .glass_3 {
        display: none;
    }

    .glass_4 {
        display: none;
    }
}

/*--↑news+角色↑--*/


/*--↓雲垂美景↓--*/
.LV3 {
    position: relative;
    width: 100%;
    height: auto;
    padding-bottom: 50%;
    background: url(../images/LV3_bg.jpg) no-repeat;
    background-size: cover;
    padding-top: 30px;
    /*background-color: #11e72d;*/
    /*顏色分隔*/
    z-index: 50;
}

/*標題*/
.LV3_title {
    position: absolute;
    width: 32.23%;
    height: auto;
    padding-bottom: 0%;
    top: 3%;
    left: 33.5%;
    z-index: 63;
    background-color: #065bfa00;
    /*顏色分隔*/

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

/*-框-*/
.slider_bg {
    position: absolute;
    width: 44%;
    height: auto;
    padding-bottom: 1%;
    top: 21.9%;
    left: 27.2%;
    pointer-events: none;
    z-index: 65;
    background-color: rgba(8, 219, 71, 0);

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

/*框底色*/
.slider_bg_bg {
    display: none;
}

/*-飛男-*/
.fly_boy {
    position: absolute;
    width: 15.62%;
    height: auto;
    padding-bottom: 1%;
    top: 8.5%;
    left: 70.4%;
    pointer-events: none;
    display: block;
    z-index: 65;
    background-color: rgba(8, 219, 71, 0);

    animation: up-down-9 8s ease-in-out infinite;
    -webkit-animation: up-down-9 8s ease-in-out infinite;
}

/*-slick_slider-*/
.LV3_slider_area {
    position: absolute;
    width: 46.29%;
    height: auto;
    padding-bottom: 1%;
    top: 27%;
    left: 26%;
    z-index: 64;
    background-color: rgba(8, 219, 71, 0);

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

.game_view {
    position: absolute;
    width: 90.27%;
    height: auto;
    margin: 0 auto;
    background-color: rgba(219, 8, 8, 0);
    z-index: 65;
}

/*--slick 按鈕--*/
.prev-arrow_1 {
    position: absolute;
    top: 40%;
    right: 104%;
    z-index: 65;
    transition: all 0.3s ease;
}

.prev-arrow_1:hover {
    right: 106%;
}

.next-arrow_1 {
    position: absolute;
    top: 40%;
    left: 104%;
    z-index: 65;
    transition: all 0.3s ease;
}

.next-arrow_1:hover {
    left: 106%;
}

/*-slick dots-*/
.slide-dots {
    margin: 5%;
    padding: 0;
    text-align: center;
}

.slide-dots li {
    display: inline-block;
    margin: 0 10px;
    background-color: rgba(127, 255, 212, 0);
    /*顏色標記*/
}

.slide-dots li button {
    position: relative;
    text-indent: -9999px;
    background-color: rgba(197, 127, 255, 0);
    /*顏色標記*/
}

.slide-dots li button::before {
    background-image: url(../images/dote_1.png);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    cursor: pointer;
    height: 22.5px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 24px;
    width: 22.5px;
}

.slide-dots li.slick-active button::before {
    background-image: url(../images/dote_2.png);
}

button {
    background: none;
    border: none;
    outline: none;
    padding: 0 7px;
}

/*背景人*/
.lv3_ch_1 {
    display: none;
}

/*名牌*/
.lv3_NC_1 {
    display: none;
}

.lv3_ch_2 {
    display: none;
}

/*端木澄名牌*/
.lv3_NC_2 {
    display: none;
}


/*星星背景物件*/
.lv3_star_1 {
    position: absolute;
    width: 4.68%;
    height: auto;
    padding-bottom: 0%;
    top: 29%;
    left: 15.5%;
    z-index: 61;

    animation: kirakira 0.6s infinite alternate cubic-bezier(0.645, 0.045, 0.355, 1);
}

.lv3_star_2 {
    position: absolute;
    width: 4.68%;
    height: auto;
    padding-bottom: 0%;
    top: 56%;
    left: 8.5%;
    z-index: 61;

    animation: kirakira 0.9s infinite alternate cubic-bezier(0.645, 0.045, 0.355, 1);
}

.lv3_star_3 {
    position: absolute;
    width: 4.68%;
    height: auto;
    padding-bottom: 0%;
    top: 57%;
    left: 79.5%;
    z-index: 61;

    animation: kirakira 1.1s infinite alternate cubic-bezier(0.645, 0.045, 0.355, 1);
}

@media (max-width:1024px) {
    .LV3 {
        position: relative;
        width: 100%;
        height: auto;
        padding-bottom: 69%;
        background: url(../images/LV3_bg_tb.jpg) no-repeat;
        background-size: cover;
        background-color: rgba(8, 219, 138, 0);
        /*顏色標記*/
    }

    .LV3_title {
        width: 49.23%;
        top: 4%;
        left: 26.5%;
    }

    .slider_bg {
        width: 58.5%;
        padding-bottom: 1%;
        top: 24%;
        left: 21.5%;
    }

    .LV3_slider_area {
        width: 61.29%;
        height: auto;
        padding-bottom: 1%;
        top: 29%;
        left: 20%;
    }

    /*--slick 按鈕--*/
    .prev-arrow_1 {
        position: absolute;
        top: 31%;
        right: 104%;
        z-index: 65;
        transition: all 0.3s ease;
    }

    .prev-arrow_1:hover {
        right: 104%;
    }

    .next-arrow_1 {
        position: absolute;
        top: 31%;
        left: 104%;
        z-index: 65;
        transition: all 0.3s ease;
    }

    .next-arrow_1:hover {
        left: 104%;
    }

    .fly_boy {
        width: 20.62%;
        padding-bottom: 1%;
        top: 8.5%;
        left: 76.4%;
    }
}

@media (max-width:767px) {
    .LV3 {
        width: 100%;
        height: auto;
        padding-bottom: 160%;
        background: url(../images/LV3_bg_sp.jpg) no-repeat;
        background-size: cover;
        /*顏色標記*/
        overflow: hidden;
    }

    .LV3_title {
        width: 69.23%;
        top: 4%;
        left: 17.5%;
    }

    .slider_bg {
        width: 86.5%;
        padding-bottom: 1%;
        top: 55.7%;
        left: 6.5%;
    }

    /*-框底色-*/
    .slider_bg_bg {
        position: absolute;
        width: 86%;
        height: auto;
        padding-bottom: 1%;
        top: 57.5%;
        left: 6.8%;
        pointer-events: none;
        z-index: 63;
        display: block;

        -webkit-animation-delay: 0.6s;
        animation-delay: 0.6s;
    }

    .LV3_slider_area {
        width: 89.29%;
        height: auto;
        padding-bottom: 1%;
        top: 59%;
        left: 5%;
    }

    /*--slick 按鈕--*/
    .prev-arrow_1 {
        position: absolute;
        top: 40%;
        right: 127%;
        z-index: 65;
        transition: all 0.3s ease;
    }

    .prev-arrow_1:hover {
        right: 127%;
    }

    .next-arrow_1 {
        position: absolute;
        top: 40%;
        left: 127%;
        z-index: 65;
        transition: all 0.3s ease;
    }

    .next-arrow_1:hover {
        left: 127%;
    }

    /*飛男*/
    .fly_boy {
        display: none;
    }

    /*背景人*/
    .lv3_ch_1 {
        position: absolute;
        width: 43.68%;
        height: auto;
        padding-bottom: 0%;
        top: 19%;
        left: 12.5%;
        z-index: 61;
        display: block;

        -webkit-animation-delay: 1.6s;
        animation-delay: 1.6s;
    }

    /*名牌*/
    .lv3_NC_1 {
        position: absolute;
        width: 8%;
        height: auto;
        padding-bottom: 0%;
        top: 20%;
        left: 17.5%;
        z-index: 63;
        display: block;
        background-color: #065bfa00;
        /*顏色分隔*/

        -webkit-animation-delay: 1.6s;
        animation-delay: 1.6s;
    }

    .lv3_ch_2 {
        position: absolute;
        width: 74.68%;
        height: auto;
        padding-bottom: 0%;
        top: 15%;
        left: 15.5%;
        z-index: 61;
        display: block;

        -webkit-animation-delay: 1s;
        animation-delay: 1s;
    }

    /*名牌*/
    .lv3_NC_2 {
        position: absolute;
        width: 8%;
        height: auto;
        padding-bottom: 0%;
        top: 16%;
        left: 75.5%;
        z-index: 63;
        display: block;
        background-color: #065bfa00;
        /*顏色分隔*/

        -webkit-animation-delay: 1s;
        animation-delay: 1s;
    }

    /*星星*/
    .lv3_star_1 {
        width: 16.68%;
        top: 12%;
        left: 7.5%;
    }

    .lv3_star_2 {
        width: 9.68%;
        top: 23%;
        left: 82.5%;
    }

    .lv3_star_3 {
        width: 8.68%;
        top: 87%;
        left: 84.5%;
    }
}

/*--↑角色↑--*/


/*--↓遊戲特色↓--*/
.LV4 {
    position: relative;
    width: 100%;
    height: auto;
    padding-bottom: 57.2%;
    background: url(../images/LV4_bg.jpg) no-repeat;
    background-size: cover;
    padding-top: 30px;
    background-color: #0d192f;
    /*顏色分隔*/
    z-index: 50;
    overflow: hidden;
}

/*標題*/
.LV4_title {
    position: absolute;
    width: 32.23%;
    height: auto;
    padding-bottom: 0%;
    top: 0%;
    left: 33.5%;
    z-index: 63;
    background-color: #065bfa00;
    /*顏色分隔*/

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

/*-框-*/
.slider_bg_2 {
    position: absolute;
    width: 42.5%;
    height: auto;
    padding-bottom: 1%;
    top: 15.2%;
    left: 28.8%;
    pointer-events: none;
    z-index: 72;
    background-color: rgba(8, 219, 71, 0);

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

/*-框底色-*/
.slider_bg_2_bg {
    position: absolute;
    width: 42.2%;
    height: auto;
    padding-bottom: 1%;
    top: 17.5%;
    left: 28.8%;
    pointer-events: none;
    z-index: 64;
    background-color: rgba(8, 219, 71, 0);

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

/*大區*/
.swiper-container {
    /*width: 100%;
    height: 300px;
    margin: 20px auto;*/
}

.swiper-slide-container {
    text-align: center;
    font-size: 18px;
    background: #fff;
    height: 100%;
    max-width: 40%;
    /*主圖區RWD大小設定 */
    margin: auto;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

/*主顯示區*/
.gallery-top {
    position: absolute !important;
    height: auto;
    width: 100%;
    top: 18%;
    z-index: 71 !important;
    background-color: #237bd900;
    /*顏色標記*/
    margin: 20px auto;

    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

/*選擇區*/
.gallery-thumbs {
    position: absolute;
    height: auto;
    top: 65%;
    z-index: 71 !important;
    box-sizing: border-box;
    padding: 10px 0;
    background-color: #8D8D8D;
    transform: rotate(356.7deg);
    margin: 20px auto;
}

.gallery-thumbs .swiper-slide {
    width: 20%;
    height: 100%;
    opacity: 0.4;
}

.yao_custom {
    max-width: 100%;
    /*選擇區圖片RWD大小設定*/
}

.gallery-thumbs .swiper-slide-active {
    opacity: 1;
}

/* 前ページ、次ページボタン共通のスタイル */
.sw22_next,
.sw22_prev {
    position: absolute;
    top: 50%;
    /*2箭頭整體位置*/
    width: 48px;
    height: 48px;
    background-size: 48px 48px;
    z-index: 70;
    outline: none;
    background-color: #f00f2a;

}

/* 次ページボタンのスタイル */
.sw22_next {
    background: url(../images/next_arr.png) no-repeat;
    background-size: 100%;
    right: 10%;
    width: 72px;
    height: 54px;
}

/* 前ページボタンのスタイル */
.sw22_prev {
    background: url(../images/prev_arr.png) no-repeat;
    background-size: 100%;
    left: 10%;
    width: 72px;
    height: 54px;
}

/*裝飾*/
.lv4_decoration {
    position: absolute !important;
    width: 34.06%;
    height: auto;
    padding-bottom: 0%;
    top: 93%;
    left: 32.5%;
    z-index: 67;
    background-color: #065bfa00;
    /*顏色分隔*/
}

/*斜bg*/
.tilt_bg {
    position: absolute;
    width: 100%;
    height: auto;
    padding-bottom: 1%;
    top: 55.5%;
    left: 0%;
    pointer-events: none;
    z-index: 65;
    background-color: rgba(8, 219, 71, 0);
}

/*海明月*/
.lv4_hm {
    position: absolute;
    width: 34.06%;
    height: auto;
    padding-bottom: 0%;
    top: 15%;
    left: 60.5%;
    z-index: 63;
    background-color: #065bfa00;
    /*顏色分隔*/

    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

/*海明月名牌*/
.lv4_NC {
    display: none;
}

/*鯨魚*/
.LV4_whale {
    position: absolute;
    width: 54.71%;
    height: auto;
    padding-bottom: 0%;
    top: 22%;
    left: 6.5%;
    z-index: 63;
    background-color: #065bfa00;
    /*顏色分隔*/

    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

/*星星背景物件*/
.lv4_star_1 {
    position: absolute;
    width: 4.68%;
    height: auto;
    padding-bottom: 0%;
    top: 15%;
    left: 15.5%;
    z-index: 61;

    animation: kirakira 0.6s infinite alternate cubic-bezier(0.645, 0.045, 0.355, 1);
}

.lv4_star_2 {
    position: absolute;
    width: 4.68%;
    height: auto;
    padding-bottom: 0%;
    top: 8%;
    left: 76.5%;
    z-index: 61;

    animation: kirakira 0.9s infinite alternate cubic-bezier(0.645, 0.045, 0.355, 1);
}

@media (max-width:1440px) {
    .gallery-top {
        top: 17.2%;
    }
}

@media (max-width:1024px) {
    .LV4 {
        position: relative;
        width: 100%;
        height: auto;
        padding-bottom: 82%;
        background-color: rgba(219, 135, 8, 0);
        /*顏色標記*/
    }

    .LV4_title {
        width: 49.23%;
        top: 4%;
        left: 26.5%;
    }

    .slider_bg_2 {
        width: 56%;
        padding-bottom: 1%;
        top: 18.4%;
        left: 22.5%;
    }

    .slider_bg_2_bg {
        width: 55.2%;
        padding-bottom: 1%;
        top: 20.4%;
        left: 22.8%;
    }

    .gallery-top {
        width: 131%;
        top: 19.2%;
        left: -15%;
    }

    .gallery-thumbs {
        width: 140%;
        left: -20%;
    }

    .tilt_bg {
        width: 100%;
        padding-bottom: 1%;
        top: 59.5%;
        left: 0%;
    }

    .lv4_hm {
        width: 53.06%;
        top: 15%;
        left: 60.5%;
    }

    .LV4_whale {
        width: 78.71%;
        top: 22%;
        left: 1.5%;
    }
}

@media (max-width:767px) {
    .LV4 {
        width: 100%;
        height: auto;
        padding-bottom: 160%;
        background: url(../images/LV4_bg_sp.jpg) no-repeat;
        background-size: cover;
        background-color: rgba(219, 135, 8, 0);
        /*顏色標記*/
        overflow: hidden;
    }

    .LV4_title {
        width: 69.23%;
        top: 4%;
        left: 17.5%;
    }

    .gallery-top {
        width: 180%;
        top: 44%;
        left: -40%;
    }

    .slider_bg_2 {
        width: 77%;
        padding-bottom: 1%;
        top: 44%;
        left: 11.5%;
    }

    .slider_bg_2_bg {
        width: 76.6%;
        padding-bottom: 1%;
        top: 45.3%;
        left: 11.8%;
    }

    .gallery-thumbs {
        width: 174%;
        left: -37%;
        top: 76%;
    }

    .tilt_bg {
        width: 137%;
        padding-bottom: 1%;
        top: 72.5%;
        left: 0%;
    }

    .lv4_decoration {
        width: 83.06%;
        top: 94%;
        left: 8.5%;
    }

    .lv4_hm {
        width: 100.06%;
        top: 11%;
        left: 1.5%;
    }

    /*海明月名牌*/
    .lv4_NC {
        position: absolute;
        width: 8%;
        height: auto;
        padding-bottom: 0%;
        top: 22%;
        left: 66.5%;
        z-index: 63;
        display: block;
        background-color: #065bfa00;
        /*顏色分隔*/

        -webkit-animation-delay: 1s;
        animation-delay: 1s;
    }

    .LV4_whale {
        width: 70.71%;
        top: 27%;
        left: -0.5%;
        z-index: 61;
    }

    .LV4_whale>img {
        transform: rotate(14deg);
    }

    /*星星*/
    .lv4_star_1 {
        width: 20.68%;
        top: 13%;
        left: 9.5%;
    }

    .lv4_star_2 {
        width: 19.68%;
        padding-bottom: 0%;
        top: 34%;
        left: 79.5%;
    }

}

/*--↑遊戲特色↑--*/

/* 2024 新角色更新-聆汐 */
.ch_inner_tab:nth-child(10) {
    background: url(//static.icantw.com/ty/images/ch_tab_pc_10_sp.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 50%;
    height: 10%;
    margin-left: -12%;
}

.ch_inner_tab:nth-child(10).now {
    background-image: url(//static.icantw.com/ty/images/ch_tab_pc_10_2_sp.png);
}

.right_job_info_10 {
    position: absolute;
    width: 59.9%;
    height: auto;
    padding-bottom: 6%;
    background-color: #4b0ff000;
    left: 33%;
    top: 1%;
    z-index: 63;
}

.left_job_info_10 {
    position: absolute;
    width: 27.11%;
    height: auto;
    padding-bottom: 6%;
    background-color: #cef00f00;
    /*顏色標記*/
    left: 24.6%;
    top: 7.3%;
    z-index: 64;
}

.job_inner_con_10.now10 {
    display: block;
    animation: big 0.2s ease-in-out;
    -webkit-animation: big 0.2s ease-in-out;
}

.job_inner_con_10 {
    position: absolute;
    width: 100%;
    height: auto;
    padding-bottom: 0%;
    background-color: #0ff06d00;
    display: none;
}
.job_inner_con_10.first_block {
    padding-top: 5.5%;
    margin-left: -5%;
}

.job_inner_tab_10 {
    display: inline-block;
    background-color: #3e09a100;
    /*顏色標記*/
    width: 100%;
    height: auto;
    padding-bottom: 20%;
    margin-bottom: 2%;
}

.job_inner_tab_10:nth-child(1) {
    background: url(//static.icantw.com/ty/images/job_tab_10_2.png);
    background-repeat: no-repeat;
    background-size: 100%;
    padding-bottom: 17%;
    margin-right: 2%;
}

.job_inner_tab_10:nth-child(2) {
    background: url(//static.icantw.com/ty/images/job_tab_10_4.png);
    background-repeat: no-repeat;
    background-size: 100%;
    padding-bottom: 17%;
    margin-left: 5%;
}

.job_inner_tab_10:nth-child(1).now10 {
    background-image: url(//static.icantw.com/ty/images/job_tab_10_1.png);
    background-repeat: no-repeat;
    background-size: 100%;
    padding-bottom: 17%;
    margin-right: 2%;
}

.job_inner_tab_10:nth-child(2).now10 {
    background-image: url(//static.icantw.com/ty/images/job_tab_10_3.png);
    background-repeat: no-repeat;
    background-size: 100%;
    padding-bottom: 17%;
    margin-left: 5%;
}

@media (max-width: 767px) {
    .ch_inner_tab:nth-child(10) {
        background: url(//static.icantw.com/ty/images/ch_tab_pc_10_sp.png) no-repeat;
        background-size: 100%;
        width: 20%;
        height: auto;
        margin-left: 1%;
        margin-top: -10%;
    }

    .left_job_info_10 {
        top: 0%;
    }

    .pc_tab_box {
        height: 14%;
        top: 85%;
    }
}