/* ======================================================= */
/**
 * 
 * 全適用
 * 
 */

:root {
    --postion-top-px: 20px;
    --postion-left-px: 30px;
}

/* ===== base ===== */
    html {
        font-size: 10px;
    }
    body {
        font-size: 1.4rem;

        background-color: #000;
        background-image: unset;

        height: calc(var(--vh, 1vh) * 100);
    }
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="search"],
    input[type="url"],
    textarea,
    .form-control {
        font-size: 1.6rem;
    }
    body a,
    body a:hover {
        color: #fff;
    }
    body::-webkit-scrollbar,
    body *::-webkit-scrollbar {
        display: none;
    }
    @media (max-width: 1279px) {/* 手機版面 */
        .pc_show {
            display: none !important;
        }
    }
    @media (min-width: 1280px) {/* 電腦版面 */
        .mb_show {
            display: none !important;
        }
    }


/* 下拉選單 */
    .drop-1 {
        position: relative;
        text-align: center;
    }
    .drop-1 .drop-1-show {
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .drop-1 .drop-1-show > * + * {
        margin-left: 5px;
    }
    .drop-1 .drop-1-show i:nth-child(1) {
        width: 20px;
        height: 20px;
        font-size: 20px;
        text-align: center;
    }
    .drop-1 .drop-1-show i.drop_tag {
        width: 14px;
        height: 14px;
        font-size: 14px;
        text-align: center;
        transition: ease 0.3s;
    }
    .drop-1 .drop-1-list {
        display: none;
    }
    .drop-1.active {
        background-color: var(--color-2);
        background-color: var(--color-v2-4);
    }
    .drop-1.active .drop-1-show i.drop_tag {
        transform: rotateX(180deg);
    }
    .drop-1.active .drop-1-list {
        display: block;
        border: 1px solid #fff;
        border-top: unset;
        z-index: 2;

        position: absolute;
        top: calc(100% + 1px);
        left: calc(0% - 1px);
        width: calc(100% + 2px);

        color: var(--color-6);
        background-color: var(--color-v2-4);
    }
    .drop-1.active .drop-1-item {
        display: block;
        padding: 5px 0;
        cursor: pointer;
    }
    .drop-1.active .drop-1-item:hover {
        color: var(--color-v2-4);
        background-color: var(--color-6);
    }
    /* --------------------------- */
    .drop-1.active .drop-1-item {
        border-top: 1px solid #fff0;
        border-bottom: 1px solid #fff0;
    }
    .drop-1.active .drop-1-item:hover {
        color: var(--color-6);
        background-color: unset;
        border-top: 1px solid #ffff;
        border-bottom: 1px solid #ffff;
    }
    .drop-1.active .drop-1-item:first-child:hover {
        border-top: 1px solid #fff0;
    }
    .drop-1.active .drop-1-item:last-child:hover {
        border-bottom: 1px solid #fff0;
    }



/* 設置 「 圓角 」 */
    .right-bar .right-bar-1 > div.br-1,
    .top-bar .top-bar-2 > div.br-1,
    .top-bar .top-bar-2 .white_paper-modal .close-btn.br-1 {
        border-bottom-left-radius: 10px;
    }
    .top-bar .top-bar-2 .menu-btn,
    .top-bar .top-bar-2 .menu-mb-btn {
        border-top-right-radius: 10px;
    }



/* 上方選單 */
    .top-bar {
        width: 100%;
        height: 50px;
        display: flex;
        justify-content: space-between;
        /*background-color: #fdd;*/

        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;

        position: fixed;
        top: calc(var(--postion-top-px) + 1px);
        left: calc(var(--postion-left-px) + 1px);
        width: calc(100% - var(--postion-left-px)*2 - 2px);
    }
    .top-bar .top-bar-1 {
        display: flex;
        padding: 10px;
        padding-left: 10px;

        padding: 5px;
    }
    .top-bar .top-bar-1 a {
        margin: auto;
    }
    .top-bar .top-bar-1 img {
        height: 30px;
        object-fit: contain;

        height: 40px;
    }
    .top-bar .top-bar-2 {
        display: flex;
        align-items: center;
    }
    .top-bar .top-bar-2 > div {
        border-left: 1px solid #ffffff;
        border-bottom: 1px solid #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 50px;
        height: 50px;
        padding: 10px;
        cursor: pointer;
    }
    .top-bar .top-bar-2 .menu-btn i,
    .top-bar .top-bar-2 .menu-mb-btn i {
        font-size: 2rem;
    }




/* 語言選單 */
    .top-bar .top-bar-2 .drop-1.lang-menu {
        width: 50px;
        padding-left: 0;
        padding-right: 0;
    }

/* 會員選單 */
    .top-bar .top-bar-2 .member-menu {
        min-width: 85px;
    }
    .top-bar .top-bar-2 .member-menu .drop-1-item:hover {
        color: var(--color-v2-2);
        color: #4469d6;
    }


/* 連結錢包 */
    /*.connect-btn {
        display: flex;
        align-items: center;
    }*/
    .connect-div,
    .member-div {
        position: relative;
        padding: 5px !important;
    }

/* 連結錢包 - 視窗 */
    .connect-modal,
    .connect-mb-modal {
        display: none;
        position: absolute;
        top: 0;
        right: -1px;
        background-color: var(--color-2);
        width: 250px;
        border: 1px solid #ffffff;
        border-top: unset;
        border-bottom-right-radius: 10px;
        border-bottom-left-radius: 10px;
        padding: 15px 15px 25px;
        z-index: 1;
    }
    .connect-modal.active,
    .connect-mb-modal.active {
        display: block;
        cursor: unset !important;
    }
    .connect-modal-btn,
    .connect-modal-mb-btn {
        /*padding: 10px;*/
        display: flex;
        align-items: center;
    }
    /* --------------------- */
    .connect-modal .close-btn,
    .connect-mb-modal .close-btn {
        position: absolute;
        top: 5px;
        right: 10px;
        cursor: pointer;
        font-size: 2rem;
        line-height: 1;
    }
    .connect-modal-title,
    .connect-modal-connect-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 5px 10px;
    }
    .connect-modal-title > div:nth-child(1),
    .connect-modal-connect-btn > div:nth-child(1) {
        width: calc(100% - 150px - 20px);
    }
    .connect-modal-title > div:nth-child(2),
    .connect-modal-connect-btn > div:nth-child(2) {
        width: calc(150px - 20px);
    }
    .connect-modal-title {
        letter-spacing: 3px;
    }
    .connect-modal-title-2 {
        text-align: center;
        font-size: 1.2rem;
        margin: 10px 0 30px;
        font-weight: 300;
    }
    .connect-modal-connect-btn {
        border: 1px solid #ffffff;
        cursor: pointer;
    }
    .connect-modal-connect-btn + .connect-modal-connect-btn {
        margin-top: 15px;
    }



/* 資產 - 視窗 */
    .assets-modal {
        transform: translateX(200%);
        opacity: 0;
    }
    .assets-modal.active {
        transform: translateX(0);
        opacity: 1;
    }


/* 質押啟動 Modal & 質押確認 Modal */
    #pledgeModal,
    #pledgeStartModal {

    }
    #pledgeModal .modal-content,
    #pledgeStartModal .modal-content {
        background-color: unset;
    }
    #pledgeModal .modal-body,
    #pledgeStartModal .modal-body {
        color: #fff;
        background-color: var(--color-v2-1);
        border: 1px solid #fff;
        border-radius: 10px;
    }
    #pledgeModal .img_div,
    #pledgeStartModal .img_div {
        width: 120px;
        height: 120px;
        background-size: 150%;
        background-position: center;
        background-repeat: no-repeat;
        background-image: url('../images/web/gif/質押.gif');
        margin: 0 auto 15px;
    }
    #pledgeModal .txt_div,
    #pledgeStartModal .txt_div {
        font-size: 1.2rem;
        margin-bottom: 5px;
        font-weight: 300;
        display: flex;
        justify-content: space-between;
    }
    #pledgeModal .txt_div > div,
    #pledgeStartModal .txt_div > div {
    }
    #pledgeModal .box_div,
    #pledgeStartModal .box_div {
        font-size: 1.2rem;
        border: 1px solid #fff;
        padding: 15px 5px 5px;
        line-height: 1;
    }
    #pledgeModal .box_div > div,
    #pledgeStartModal .box_div > div {
        font-weight: 300;
    }
    #pledgeModal .box_div > div:nth-child(1),
    #pledgeStartModal .box_div > div:nth-child(1) {

    }
    #pledgeModal .box_div > div:nth-child(2),
    #pledgeStartModal .box_div > div:nth-child(2) {
        font-size: 2rem;
        text-align: center;
        font-weight: 700;
        letter-spacing: 4px;
        line-height: 1.5;
    }
    #pledgeModal .box_div > div:nth-child(3),
    #pledgeStartModal .box_div > div:nth-child(3) {
        text-align: right;
    }
    #pledgeModal .btn_div,
    #pledgeStartModal .btn_div {
        font-size: 1.5rem;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        margin-top: 15px;
    }
    #pledgeModal .btn_div button,
    #pledgeStartModal .btn_div button {
        width: 90px;
        letter-spacing: 5px;
        margin: 10px auto;
        padding-left: 15px;
        padding-bottom: 5px;
    }

@media (max-width: 1279px) {
    #pledgeModal .txt_div,
    #pledgeStartModal .txt_div {
        font-size: 2rem;
        font-weight: 700;
        margin-bottom: 15px;
        justify-content: center;
    }
    #pledgeModal .box_div,
    #pledgeStartModal .box_div {
        border: unset;
        background-color: #604e7d;
        border-radius: 10px;
        padding: 5px;
        display: flex;
        align-items: center;
    }
    #pledgeModal .box_div > div:nth-child(2),
    #pledgeStartModal .box_div > div:nth-child(2) {
        font-size: 1.8rem;
        padding-left: 30px;
        width: calc(100% - 20px - 10px - 10px);
    }
    #pledgeModal .box_div > div:nth-child(3),
    #pledgeStartModal .box_div > div:nth-child(3) {
        width: 20px;
        font-weight: 700;
        font-size: 1.8rem;
    }
}


/* 提領完成 Modal */
    #redeemSuccessModal {

    }
    #redeemSuccessModal .modal-dialog {
        margin: auto;
        max-width: 210px;
    }
    #redeemSuccessModal .modal-content {
        height: 220px;
        border: 1px solid #fff;
        border-radius: 10px;
        background-color: var(--color-v2-3);
    }
    #redeemSuccessModal .modal-body {
        /*display: none;*/
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;

        margin: auto;
    }
    #redeemSuccessModal .img_div {
        width: 90px;
        height: 90px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        margin: -10px 0 20px;
    }
    #redeemSuccessModal .txt_div {
        letter-spacing: 3px;
        padding-left: 5px;
        font-size: 1.8rem;
        text-align: center;
        height: 48px;
        display: flex;
        align-items: center;
        font-weight: 700;
    }
    @media (max-width: 1279px) {
        #redeemSuccessModal .modal-dialog {
            max-width: 240px;
        }
        #redeemSuccessModal .modal-content {
            height: auto;
            padding: 30px 15px;
        }
        #redeemSuccessModal .img_div {
            margin: -10px 0 10px;
        }
        #redeemSuccessModal .txt_div {
            display: block;
            height: auto;
        }
        #redeemSuccessModal .btn_div {
            margin-top: 10px;
        }
        #redeemSuccessModal .btn_div button {
            border: 2px solid #fff;
            height: 40px;
            width: 95px;
            border-radius: 45px;
            font-weight: 700;
            font-size: 1.8rem;
            display: flex;
            align-items: center;
        }
        #redeemSuccessModal .btn_div .img_div {
            width: 30px;
            height: 20px;
            margin: 0;
            background-size: 170%;
        }
    }


/* 白皮書 - 系統訊息 */
    #whitePaperAlert {

    }
    #whitePaperAlert .modal-dialog {
        max-width: 180px;
    }
    #whitePaperAlert .modal-content {
        height: 220px;
        border: 1px solid #fff;
        border-radius: 10px;
        background-color: var(--color-v2-3);
    }
    #whitePaperAlert .modal-body {
        display: none;
    }
    #whitePaperAlert.t_send .modal-body.t_send,
    #whitePaperAlert.t_download .modal-body.t_download {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;

        margin: auto;
    }
    #whitePaperAlert .img_div {
        width: 90px;
        height: 90px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        margin: -20px 0 10px;
    }
    #whitePaperAlert .txt_div {
        letter-spacing: 3px;
        padding-left: 5px;
        font-size: 1.6rem;
        text-align: center;
        height: 48px;
        display: flex;
        align-items: center;
    }


/* 幫助中心 - 描述問題 - 系統訊息 */
    #helpFormAlert {

    }
    #helpFormAlert .modal-dialog {
        max-width: 220px;
    }
    #helpFormAlert .modal-content {
        height: 220px;
        border: 1px solid #fff;
        border-radius: 10px;
        background-color: var(--color-v2-3);
    }
    #helpFormAlert .modal-body {
        display: none;
    }
    #helpFormAlert.t_send .modal-body.t_send {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;

        margin: auto;
    }
    #helpFormAlert .img_div {
        width: 90px;
        height: 90px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        margin: -20px 0 10px;
    }
    #helpFormAlert .txt_div {
        letter-spacing: 3px;
        padding-left: 5px;
        font-size: 1.6rem;
        text-align: center;
        height: 48px;
        display: flex;
        align-items: center;
    }



/* metamask 切換網路 */
    .change_network-div a span:nth-child(1) { display: block; }
    .change_network-div a span:nth-child(2) { display: none; }



/* 右側選單 */
    .right-bar {
        width: 50px;
        height: calc(100% - 50px);
        color: #fff;
        /*background-color: #dfd3;*/
        position: absolute;
        top: 50px;
        right: 0;
        z-index: 2;

        display: flex;
        /*align-items: center;*/
        height: calc(100% - 50px - 50px);

        position: fixed;
        top: calc(var(--postion-top-px) + 1px + 50px);
        right: calc(var(--postion-left-px) + 1px);
    }
    .right-bar-1 {
        position: relative;
    }
    .right-bar-1 > div {
        border-left: 1px solid #ffffff;
        border-bottom: 1px solid #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50px;
        height: 50px;
        padding: 10px;
        cursor: pointer;
        border-top: 1px solid #fff0;
        margin-top: 0px;
    }
    .right-bar-1 > div:nth-child(1) {
        margin-top: 0px;
        border-top: unset;
    }
    /* ------------ */
    .right-bar-2 {
        padding: 10px 0;
        height: max-content;

        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
    }
    .right-bar-2 a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50px;
        height: 40px;
    }
    .right-bar-2 .page-icon {
        background-size: 130%;
    }
    .right-bar-2 [data-href="home-2"] .page-icon {
        background-size: 80%;
    }
    /* ------------ */
    .right-bar-3 {
        width: 50px;
        height: 50px;
        position: absolute;
        bottom: -50px;
        right: 0;

        position: fixed;
        bottom: calc(var(--postion-top-px) + 1px);
        right: calc(var(--postion-left-px) + 1px);
    }
    .right-bar-3 a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50px;
        height: 50px;
    }
    .right-bar-3 a div {

    }

/* 右側選單 - 彈出效果 */
    .right-bar .link-bounce {
        position: relative;
        font-size: 2rem;
        word-break: keep-all;
        transition: cubic-bezier(0.45, 0.36, 0.61, 1.51) 0.2s;
    }
    .right-bar .link-bounce::after {
        content: attr(data-name);
        animation: 0.15s;
        padding-left: 35px;
        opacity: 0;
    }
    .right-bar .link-bounce a {
        position: absolute;
        left: calc((50px - 24px) / 2);
    }
    .right-bar .link-bounce a i {
        width: 24px;
        text-align: center;
    }
    .right-bar .link-bounce:not(.dis):hover {
        width: 100px;
        margin-left: -50px;
        border-top-color: #ffff;
    }
    .right-bar .link-bounce:not(.dis):hover::after {
        opacity: 1;
    }



/* 左側選單 */
    .left-bar {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        z-index: 2;


        position: fixed;
        left: calc(var(--postion-left-px) + 1px);
    }
    .left-bar > a {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        border-right: 1px solid #ffffff;
        border-bottom: 1px solid #ffffff;
        width: 50px;
        height: 65px;
        padding: 5px;
        cursor: pointer;
        border-top: 1px solid #fff0;
        /*margin-top: -1px;*/
    }
    .left-bar .page-icon {
        width: 30px;
        height: 30px;
    }
    .left-bar > a:nth-child(1) {
        margin-top: 1px;
        border-top-color: #ffffff;
    }
    .left-bar > a:first-child {
        border-top-right-radius: 10px;
    }
    .left-bar > a:last-child {
        border-bottom-right-radius: 10px;
    }



/* 網站選單 & 網頁背景 */
    .manu-area {
        width: 100%;
        height: 100%;
        font-size: 2rem;
        display: flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        z-index: 1;

        /*background-image: linear-gradient(to right, #340a6480 0%, #45127e80 15%, #435ad080 40%, #4c1e9c80 65%, #3f319680 90%);*/
    }
    
    .manu-area > div {
        width: 180px;
    }
    .manu-area a {
        display: block;
        text-align: center;
        transition: unset;
        padding: 5px 0;
        letter-spacing: 5px;
        border: 2px solid #ffffff00;

        border: 1px solid #ffffff00;
    }
    .manu-area a:hover {
        color: #fff;
        border-color: #ffff;

        color: var(--color-2);
        font-weight: 700;
    }
    .manu-area a + a {
        margin-top: 40px;
    }

    /* ------------------------- */
    .page-body {
        font-size: 2rem;
    }
    .body-area {
        height: 100%;
    }
    .loading-div,
    .page-content {
        height: 100%;

        display: flex;
        padding-top: calc(var(--postion-top-px) + 50px);
        padding-bottom: calc(var(--postion-top-px) + 50px);

        background-image: linear-gradient(to right, #340a64a0 0%, #45127ea0 15%, #435ad0a0 40%, #4c1e9ca0 65%, #3f3196a0 90%);
    }
    .page-content,
    .page-content * {
        color: #fff;
        font-weight: 700;
    }
    .loading-div:before,
    .page-content:before {
        content: '';

        width: 100%;
        height: 100%;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: top center;
        background-image: url('../images/web/全分頁用背景.png');

        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
    }
    .loading-div:after,
    .page-content:after {
        content: '';

        position: fixed;
        top: var(--postion-top-px);
        left: var(--postion-left-px);
        right: var(--postion-left-px);
        bottom: var(--postion-top-px);
        z-index: 0;

        width: calc(100% - var(--postion-left-px)*2);
        height: calc(100% - var(--postion-top-px)*2);
        border: 1px solid #ffffff;
        border-radius: 10px;
    }
    .page-content > div {
        width: calc(100% - var(--postion-left-px)*2);
        height: calc(100% - var(--postion-top-px)*2 - 50px);
        height: calc(100% - var(--postion-top-px)*2 - 50px - 1px);
        margin-left: auto;
        margin-right: auto;
        position: absolute;
        top: calc(var(--postion-top-px) + 50px);
        left: var(--postion-left-px);
        z-index: 1;
    }
    .page-content.h-active > div {
        display: none;
    }
    /* --------------------------------- */
    .loading-area {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100%;
        z-index: 3;
        transition: cubic-bezier(0.69, -0.12, 0.69, 0.55) 1s;
    }
    .loading-area.l-active {
        transform: scale(2);
        opacity: 0;
        z-index: -5;
    }
    .loading-area .loading-div .img-div {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 400px;
        height: 400px;
        max-width: 100%;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: top center;
        background-image: url('../images/web/gif/loading_2.gif');
        transform: translate(-50%, -50%);
    }
    .loading-area .loading-div {
        align-items: center;
        justify-content: center;
    }
    .loading-area .loading-div video {
        width: 450px;
        height: 450px;
    }
    @media (max-width: 1279px) {
        .loading-area .loading-div .img-div {
            background-image: url('../images/web/gif/loading_2_mb.gif');
        }
        .loading-area .loading-div video {
            width: 250px;
            height: 250px;
        }
    }



/* ===== 手機版-網站選單 ===== */
    .menu-mb-cover {
        background-color: #0000;
        position: fixed;
        width: 100vw;
        height: 100%;
        top: 0;
        left: 0;
        z-index: -1;
        transition: ease 0.5s;
    }
    .menu-mb-cover.active {
        background-color: #000a;
        z-index: 3;
    }
    .menu-mb-area {
        width: 220px;
        height: calc(100% - var(--postion-top-px)*2);
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        border: 1px solid #fff;
        opacity: 0;
        transform: translateX(100%);
        transition: .3s;
        position: fixed;
        top: var(--postion-top-px);
        right: 0;
        z-index: 4;
        overflow: hidden;
        background-color: #000;

        background-color: #3e3e3e;
    }
    .menu-mb-area.active {
        opacity: 1;
        transform: translateX(0);
    }
    .menu-mb-area .menu-mb-item {
        display: flex;
        align-items: center;
        justify-content: center;
        border-bottom: 1px solid #fff;
        min-height: 50px;
        cursor: pointer;
        position: relative;
        background-color: var(--color-v2-4);
    }
    .menu-mb-area[class*="menu-mb-area-"] .menu-mb-item:not([class*="last-item-"]) {
        /*border-bottom-color: var(--color-v2-4);*/
    }
    .menu-mb-area .menu-mb-item:first-child {
        border-bottom: 3px solid #fff !important;
    }
    .menu-mb-area .menu-mb-item:last-child {
        border-bottom: unset;
    }
    .menu-mb-area .menu-mb-item.last-item-3 {position: absolute;width: 100%;bottom: 100px;}
    .menu-mb-area .menu-mb-item.last-item-2 {position: absolute;width: 100%;bottom: 50px;}
    .menu-mb-area .menu-mb-item.last-item-1 {position: absolute;width: 100%;bottom: 0px;}
    .menu-mb-area .menu-mb-member,
    .menu-mb-area .menu-mb-connect {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .menu-mb-area .menu-mb-group {
        background-color: unset;
    }
    .menu-mb-area .menu-mb-member .img_div,
    .menu-mb-area .menu-mb-connect .img_div,
    .menu-mb-area .menu-mb-group .img_div {
        width: 40px;
        height: 40px;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }
    .menu-mb-area .menu-mb-member .img_div,
    .menu-mb-area .menu-mb-connect .img_div {
        border-radius: 50%;
    }
    .menu-mb-area .menu-mb-group .img_div {
        background-size: 110%;
    }
    .menu-mb-area .menu-mb-group a:nth-child(3) .img_div {
        background-size: 80%;
    }
    .menu-mb-area .menu-mb-item .page-icon {
        width: 35px;
        height: 35px;
        background-size: 135%;
        /*margin-right: 15px;*/
    }
    .menu-mb-area .menu-mb-item .txt_div {
        width: calc(100% - 40px - 60px);
        font-size: 1.8rem;
        font-weight: 700;
        letter-spacing: 5px;
        padding-left: 5px;
        text-align: center;
        margin-left: 15px;
        text-overflow: ellipsis;
        overflow: hidden;
        /*line-height: 1;*/

        /*margin-left: 0px;*/
        /*background-color: #add3;*/
    }
    .menu-mb-area .menu-mb-member .txt_div {
        width: calc(100% - 40px - 35px);
        letter-spacing: 2px;
        padding-left: 2px;
        margin-left: 5px;
    }
    .menu-mb-area .menu-mb-item .page-icon.page-icon-team {
        background-size: 65%;
    }
    .menu-mb-area .menu-mb-tab .menu-mb-icon {
        position: absolute;
        right: 0px;
        top: 50%;
        transform: translateY(-50%) rotate(270deg);
        background-size: 160%;
    }
    .menu-mb-area .menu-mb-tab .menu-mb-icon.menu-mb-icon-back {
        left: 0;
        right: unset;
        top: 50%;
        transform: translateY(-50%) rotate(90deg);
    }
    .menu-mb-area .menu-mb-link > div:nth-child(1),
    .menu-mb-area .menu-mb-tab > div:nth-child(1) {
        /*background-color: #ddd3;*/
    }
    /* ----------------------------------- */
    .menu-mb-area .menu-mb-item:active {
        box-shadow: inset 5px 5px 7px 0px #1115;
        background-color: #5345af;
    }


    /* ===== 手機版-網站選單 - 錢包(資產) ===== */
    .menu-mb-area-wallet .menu-mb-tab .txt_div {
        font-size: 1.2rem;
        width: calc(100% - 45px);
    }
    .menu-mb-area-wallet .menu-mb-info {
        flex-direction: column;
        height: 80px;
        line-height: 2;
    }
    .menu-mb-area-wallet .menu-mb-info,
    .menu-mb-area-wallet .menu-mb-tab-buyGBT {
        border-bottom: unset;
        margin-top: 30px;
    }
    .menu-mb-area-wallet .menu-mb-tab-buyGBT {
        background-color: unset;
    }
    .menu-mb-area-wallet .menu-mb-info .txt_div {
        margin-left: 0;
    }
    .menu-mb-area-wallet .menu-mb-info .txt_div:nth-child(1) {
        font-size: 1.5rem;
        font-weight: 300;
    }
    .menu-mb-area-wallet .menu-mb-info .txt_div:nth-child(2) {
        width: 100%;
        text-align: center;
    }
    .menu-mb-area-wallet .menu-mb-tab button {
        width: 100px;
        height: 35px;
        letter-spacing: 4px;
        padding: 3px 0px 3px 4px;
    }


    /* ===== 手機版-網站選單 - 錢包(資產) - 購買GBT ===== */
    .menu-mb-area-buyGBT .menu-mb-item {
    }
    .menu-mb-area-buyGBT .menu-mb-info,
    .menu-mb-area-buyGBT .menu-mb-input,
    .menu-mb-area-buyGBT .menu-mb-button {
        background-color: unset;
        border-bottom: unset;
    }
    .menu-mb-area-buyGBT .menu-mb-input,
    .menu-mb-area-buyGBT .menu-mb-button {
        margin-top: 30px;
    }
    .menu-mb-area-buyGBT .menu-mb-info {
        padding: 0 10px;
    }
    .menu-mb-area-buyGBT .menu-mb-info .txt_div {
        margin-left: 0;
        width: 100%;
        text-align: center;
        font-size: 1.2rem;
        height: 50px;
        line-height: 50px;
        border-bottom: 2px solid #999;
    }
    .menu-mb-area-buyGBT .menu-mb-input {

    }
    .menu-mb-area-buyGBT .menu-mb-input input {
        background-color: unset;
        width: calc(100% - 35px - 20px);
        margin-right: 5px;
        color: #fff;
        text-align: center;
        font-weight: 700;
    }
    .menu-mb-area-buyGBT .menu-mb-input .page-icon {
        background-size: 105%;
    }
    .menu-mb-area-buyGBT .menu-mb-input .page-icon.page-icon-usdt {
        background-size: 65%;
    }
    .menu-mb-area-buyGBT .menu-mb-button {
        margin-top: 50px;
    }
    .menu-mb-area-buyGBT .menu-mb-button button {
        width: 100px;
        height: 35px;
        letter-spacing: 4px;
        padding: 3px 0px 3px 4px;
        background-color: var(--color-v2-2);
    }



/* 網站選單 - 白名單 */
    .top-bar .top-bar-2 .white_paper-modal {
        display: none !important;

        position: absolute;
        top: 0;
        right: -1px;
        /*background-color: var(--color-2);*/
        width: 280px;
        height: auto;
        border: 1px solid #ffffff;
        border-top: unset;
        border-bottom-right-radius: 10px;
        border-bottom-left-radius: 10px;
        padding: 15px 15px 25px;
        border-top-right-radius: 10px;
        overflow: hidden;
    }
    .top-bar .top-bar-2 .white_paper-modal.active {
        display: block !important;
        cursor: unset !important;
    }

    /* --------------------- */
    .top-bar .top-bar-2 .white_paper-modal .close-btn {
        position: absolute;
        top: 0;
        right: 0;

        border-left: 1px solid #ffffff;
        border-bottom: 1px solid #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 50px;
        height: 50px;
        padding: 10px;
        cursor: pointer;
    }
    .top-bar .top-bar-2 .white_paper-modal-title-icon {
        width: 45px;
        height: 45px;
        background-size: 90%;
        animation: white_paper-icon 1.2s linear infinite;
        margin-bottom: 15px;
    }
    .top-bar .top-bar-2 .white_paper-modal-title {
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 0 10px;
        letter-spacing: 3px;
        font-size: 1.6rem;
    }
    .top-bar .top-bar-2 .white_paper-modal-title-2 {
        text-align: center;
        font-size: 1.2rem;
        margin: 10px 0 10px;
        font-weight: 300;
        letter-spacing: 3px;
    }
    .top-bar .top-bar-2 .white_paper-modal input {
        margin-bottom: 30px;
        height: 25px;
    }
    .top-bar .top-bar-2 .white_paper-modal input::placeholder {
        color: var(--color-4) !important;
        color: #958ec4 !important;
    }
    .top-bar .top-bar-2 .white_paper-modal .b-group {
        display: flex;
        justify-content: space-between;
    }
    .top-bar .top-bar-2 .white_paper-modal .b-group button {
        letter-spacing: 3px;
        width: 110px;
        padding-left: 13px;
        line-height: 1;
    }
    @keyframes white_paper-icon {
        0% {
            background-size: 90%;
        }
        20% {
            background-size: 90%;
        }

        30% {
            background-size: 110%;
        }
        50% {
            background-size: 110%;
        }
        70% {
            background-size: 110%;
        }

        80% {
            background-size: 90%;
        }
        100% {
            background-size: 90%;
        }
    }





/* 載入動畫 */
    .loading-page .loading-1 {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;
    }
    .loading-page img:nth-child(1) {
        max-width: 460px;
        margin: -50px 0 100px;
    }
    .loading-page img:nth-child(2) {
        max-width: 90%;
    }


/* 首次註冊時顯示 - 視窗 */
    #firstSignUp .modal-content {
        background-color: #797979;
        background-color: #79797900;
        background-color: var(--color-v2-3);
        border-color: #fff;
    }
    #firstSignUp .modal-body {
        padding: 3rem;
    }
    #firstSignUp .modal-content .m-txt,
    #firstSignUp .modal-content .m-img,
    #firstSignUp .modal-content .m-btn {
        text-align: center;
    }
    #firstSignUp .modal-content .m-img {
        height: 100px;

        background-image: url('../images/web/gif/Lv1.gif');
        background-size: 60%;
        background-position: 50% 60%;
        background-repeat: no-repeat;
    }
    #firstSignUp .modal-content a {
        margin-top: 30px;
        width: 100px;
        letter-spacing: 3px;
        padding-left: 13px;
    }
    #firstSignUp .modal-dialog {
        margin-top: 3rem;
    }
    .modal-backdrop.show {
        opacity: .8;
    }
    @media (max-width: 575px) {
        #firstSignUp .modal-body {
            padding: 1rem;
        }
    }
    @media (min-width: 576px) {
        #firstSignUp .modal-dialog {
            margin-top: 5rem;
        }
    }


/* (視窗) 廣告 */
    #AdvertiseModal .modal-content {
        border-radius: 10px;
        border: 1px solid #fff;
        overflow: hidden;
        padding: 0;
        padding-bottom: 20px;
        background-color: #9998;
    }
    #AdvertiseModal .modal-body {
        padding: 0;
    }
    #AdvertiseModal [data-dismiss="modal"] {
        position: absolute;
        top: 0px;
        left: 2px;
        z-index: 2;
        opacity: 1;
        width: 25px;
        height: 25px;
    }
    #AdvertiseModal [data-dismiss="modal"] span {
        color: #fff;
        display: inline-block;
        font-size: 2.5rem;
        line-height: 15px;
    }
    #AdvertiseModal .swiper {
        overflow: unset;
    }
    #AdvertiseModal .swiper-pagination {
        bottom: -15px;
    }
    #AdvertiseModal .swiper-pagination-bullet {
        
    }
    #AdvertiseModal .swiper-pagination-bullet-active {
        background-color: #fff;
    }
    #AdvertiseModal .ad_block {

    }
    #AdvertiseModal .ad_block .img_div {
        padding-bottom: 56.2%;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }
    #AdvertiseModal [class*="btn-"] {
        position: absolute;
        left: 50%;
        bottom: 0px;
        z-index: 2;
        transform: translate(-50%, -50%);
        letter-spacing: 2px;
        width: 90px;
        padding-left: 12px;
    }


/* ======================================================= */
/**
 * 
 * max-width: 1279px (手機)
 * 
 */
    @media (max-width: 1279px) {

        /* 上方選單 - logo */
            .top-bar .top-bar-1 {
                padding: 0px 5px 0 5px;
            }
            .top-bar .top-bar-1 img {
                height: 30px;
            }
        /* 投資專案 & 提報專案 & 帳戶設定 */
            .topbar-loan-div, .topbar-proposal-div, .topbar-profile-div {
                display: none !important;
            }
        /* 會員選單 & 語言選單 */
            .member-div {
                display: none !important;
            }
            .top-bar .top-bar-2 .drop-1 .member-menu .v-login_addr {
                display: none;
            }
            .drop-1 .member-menu .drop-1-list,
            .drop-1.lang-menu .drop-1-list {
                left: calc(50% - 1px);
                transform: translateX(-50%);
                width: calc(100% + 2px + 50px);
            }
            .drop-1.lang-menu .drop-1-list {
                width: calc(100% + 2px + 20px);
                width: calc(100% + 2px);
            }

        /* 連結錢包 - 視窗 */
            .connect-div {
                display: none !important;
            }
            .connect-mb-cover {
                background-color: #0000;
                position: fixed;
                width: 100vw;
                height: 100%;
                top: 0;
                left: 0;
                z-index: -1;
                transition: ease 0.5s;
            }
            .connect-mb-cover.active {
                background-color: #000a;
                z-index: 3;
            }
            .connect-mb-modal {
                position: fixed;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                border-top: 1px solid #fff;
                border-radius: 10px;
                z-index: 5;
            }

        /* 質押 Modal */
            #pledgeModal .modal-body,
            #pledgeStartModal .modal-body {
                padding: 15px 10px;
            }


        /* metamask 切換網路 */
            .change_network-div a span:nth-child(1) { display: none; }
            .change_network-div a span:nth-child(2) { display: block; }

        /* 右側選單 */
            .right-bar {
                display: none !important;
            }

        /* 左側選單 */
            .left-bar {
                display: none !important;
            }

        /* 網站選單 */
            .menu-btn,
            .manu-area {
                display: none !important;
            }
            .main-content .manu-area {
                padding-left: 0px;
            }

        

            

        /* 主要顯示內容 */
            .page-content > div {
                padding-right: 0px;
                height: auto;
            }


        /* loading */
            .loading-area .loading-div .img-div {
                width: 300px;
                height: 300px;
            }

        
    }

/* ======================================================= */
/**
 * 
 * min-width: 1280px (1280px)
 * 
 */
    @media (min-width: 1280px) {

        /* 網站選單 */
            .menu-mb-btn,
            .manu-mb-area {
                display: none !important;
            }

        /* 連結錢包 - 視窗 */
            .connect-mb-div {
                display: none !important;
            }

        /* 資產 - 視窗 */
            .assets-modal-btn {
                position: relative
            }
            .assets-modal {
                position: absolute;
                top: -2px;
                right: -1px;
                background-color: var(--color-v2-3);
                width: 250px;
                border: 1px solid #ffffff;
                /*border-right: unset;*/
                padding: 15px 0px 20px;
                z-index: 1;
                font-size: 1.2rem;
                cursor: unset !important;
                transition: ease 0.5s;
            }
            .assets-modal.active {

            }
            .assets-modal .close-btn {
                position: absolute;
                top: 5px;
                right: 10px;
                cursor: pointer;
                font-size: 2rem;
                line-height: 1;
            }
            .assets-modal .profile_div {
                display: flex;
                align-items: center;
                padding: 0 15px;
                margin-bottom: 20px;
            }
            .assets-modal .profile_div .img_div {
                width: 50px;
                height: 50px;
                border: 2px solid #fff;
                border-radius: 10px;
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat;

                background-color: #fff;
            }
            .assets-modal .profile_div .txt_div {
                width: calc(100% - 50px - 40px);
                height: 50px;
                margin-left: 20px;
                display: flex;
                flex-direction: column;
                justify-content: center;
            }
            .assets-modal .profile_div .txt_div > div {
                text-align: center;
                display: block;
                text-overflow: ellipsis;
                overflow: hidden;
                white-space: nowrap;
            }
            .assets-modal .profile_div .txt_div > div:nth-child(1) {
                font-size: 1.5rem;
            }
            .assets-modal .profile_div .txt_div > div:nth-child(2) {

            }
            .assets-modal .balance_div {
                text-align: center;
                background-color: var(--color-v2-4);
                letter-spacing: 3px;
            }
            .assets-modal .balance_div + .balance_div {
                margin-top: 10px;
            }
            .assets-modal .balance_div > div:nth-child(1) {
                font-size: 1.5rem;
            }
            .assets-modal .balance_div > div:nth-child(2) {
                font-weight: 700;
                font-size: 1.8rem;
                line-height: 2;
            }
            .assets-modal .button_div {
                margin-top: 15px;
                text-align: center;
            }
            .assets-modal .button_div > button {
                width: auto;
                height: auto;
                letter-spacing: 4px;
                padding: 5px 10px 5px 14px;
            }


        /* 質押 Modal */
            #pledgeModal .modal-body,
            #pledgeStartModal .modal-body {
                padding: 15px 80px 30px;
            }


    }


/* ======================================================= */
/**
 * 
 * min-width: 1920px (1920px)
 * 
 */
    @media (min-width: 1920px) {

    }