﻿
@font-face {
    font-family: 'Optima nova LT Pro Black';
    src: url('../fonts/PDF/17652.ttf');
}

@font-face {
    font-family: 'Optima nova LT Pro Condensed';
    src: url('../fonts/PDF/17654.ttf');
}

@font-face {
    font-family: 'Optima nova LT Pro Light';
    src: url('../fonts/PDF/17658.ttf');
}

@font-face {
    font-family: 'Optima nova LT Pro Medium';
    src: url('../fonts/PDF/17660.ttf');
}

@font-face {
    font-family: 'Optima nova LT Pro Regular';
    src: url('../fonts/PDF/17661.ttf');
}

@font-face {
    font-family: 'Optima nova LT Pro Light Cond';
    src: url('../fonts/PDF/17663.ttf');
}

@font-face {
    font-family: 'Optima nova LT Pro Medium Cond';
    src: url('../fonts/PDF/17666.ttf');
}

@font-face {
    font-family: 'CG Omega45';
    src: url('../fonts/PDF/cgor45w_0.ttf');
}

@font-face {
    font-family: 'CG Omega46';
    src: url('../fonts/PDF/cgor46w_0.ttf');
}

@font-face {
    font-family: 'CG Omega65';
    src: url('../fonts/PDF/cgor65w_1.ttf');
}

@font-face {
    font-family: 'CG Omega';
    src: url('../fonts/PDF/cgor46w_0.ttf');
}

@font-face {
    font-family: 'MTCORSVA';
    src: url('../fonts/PDF/MTCORSVA.ttf');
}


html {
    font-size: 16px;
}

* {
    margin: 0;
    padding: 0;
    list-style-type: none;
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    font-style: normal;
    overflow-x: hidden;
    width: 100vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;
}

header {
    width: 100%;
}

.clearfix {
    clear: both;
}

.page_bas_margin {
    margin: 0 0.75rem;
}

.top-section {
    display: flex;
    flex: 1;
    justify-content: center;
    padding: 2.5rem;
    margin-bottom: 1rem;
}

    .top-section .container {
        width: 120rem;
        height: auto;
        /* border: 0.0125rem #77181c solid;*/
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }

        .top-section .container .item-cont {
            width: 50%;
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
            padding: 0.125rem 0;
            border: 0.0125rem #77181c solid;
        }

            .top-section .container .item-cont .item-line {
                width: 100%;
                padding: 0 1.5rem;
                margin: 0.75rem 0;
            }

oh2 {
    font-family: Optima nova LT Pro Light;
    color: black;
    font-weight: 600;
    font-size: 4.166875rem;
}

/**********/
.item-tit {
    margin: 0.25rem 0;
    display: flex;
    justify-content: center; /* 水平居中文本 */
    align-items: center; /* 垂直居中文本 */
}

    .item-tit .circle-text {
        height: 5.8rem;
        width: 5.8rem;
        border-radius: 50%;
        background-color: #191e68;
        display: flex; /* 使用Flexbox布局 */
        justify-content: center; /* 水平居中文本 */
        align-items: center; /* 垂直居中文本 */
        font-family: CG Omega;
        font-size: 2.734375rem; /* 设置文字大小 */
        font-weight: 800;
        color: #f9ec00;
    }

    .item-tit oh3 {
        flex-grow: 1;
        font-family: CG Omega;
        font-size: 2.734375rem; /* 设置文字大小 */
        font-weight: bold;
        color: #004b21;
        line-height: 3.0rem;
        padding-left: 0.75rem;
    }

.item-line .item-text {
    padding-top: 1rem;
    font-family: MTCORSVA;
    font-size: 2.34375rem;
    color: #040000;
}

.stplan {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.textstrg {
    width: 80%;
    padding: 0.125rem 2rem;
    border-radius: 4rem;
    border: 0.2rem black solid;
    margin: 1rem 0;
    text-align: center;
    font-family: "MTCORSVA";
    font-size: 2.083125rem;
    font-weight: 600;
}

    .textstrg.color01 {
        border: none;
        background-color: #f9ec00;
        color: #000000;
    }

    .textstrg.color02 {
        border: none;
        background-color: #004b21;
        color: #f9ec00;
    }

    .textstrg.color03 {
        border: none;
        background-color: #8d0b11;
        color: #fff100;
    }

/******/
.bot-section {
    display: flex;
    flex: 1;
    justify-content: center;
    padding: 2.5rem;
}

    .bot-section .container {
        width: 120rem;
        height: auto;
        /*border: 0.0125rem #77181c solid;*/
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background-image: url("../Images/Transformation.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center bottom; /* 例如，将图片居中 */
    }

.sc_tit {
    font-family: 'Optima nova LT Pro Black; color: black; font-weight: 600';
    font-size: 8.333125em;
    color: #f9ec00;
    padding-top: 3.5rem;
    text-align: center;
    line-height: 7.8125rem;
    padding-bottom: 2rem;
}

.bot-section .container .item-cont {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0.125rem 0;
}

    .bot-section .container .item-cont .textline {
        width: 100%;
        padding: 0 0.75rem;
        margin: 0.75rem 0;
        text-align: center;
    }

.text_pl {
    width: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: white;
    font-family: "MTCORSVA";
    font-size: 3.84rem;
    margin: 1rem;
}
/*****/
@media (min-width: 1128px) and (max-width: 1366px) {
    html {
        font-size: 12px;
    }

    .top-section .bot-section {
        padding: 0px;
    }

    .top-section .container,
    .bot-section .container {
        width: 100%;
    }
}

@media (min-width: 1024px) and (max-width: 1120px) {
    html {
        font-size: 14px;
    }

    .top-section .bot-section {
        padding: 0px;
    }

    .top-section .container,
    .bot-section .container {
        width: 100%;
    }

    .sc_tit {
        font-size: 7.333125em;
    }
}
/*****/
@media (min-width:900px) and (max-width:1000px) {
    html {
        font-size: 14px;
    }

    .top-section .bot-section {
        padding: 0px;
    }

    .top-section .container,
    .bot-section .container {
        width: 100%;
    }
}
/*****/
@media (min-width:820px) and (max-width:880px) {
    html {
        font-size: 7px;
    }

    .top-section .bot-section {
        padding: 0px;
    }

    .top-section .container,
    .bot-section .container {
        width: 100%;
    }

    .sc_tit {
        font-size: 7.333125em;
    }

    .text_pl {
        font-size: 3.0rem;
    }
}
/*****/
@media (min-width:780px) and (max-width:810px) {
    html {
        font-size: 6.8px;
    }

    .top-section .bot-section {
        padding: 0px;
    }

    .top-section .container,
    .bot-section .container {
        width: 100%;
    }

    .sc_tit {
        font-size: 7.333125em;
    }

    .text_pl {
        font-size: 4.0rem;
    }
}

/*****/
@media (min-width: 768px) and (max-width:768px) {
    html {
        font-size: 12px;
    }

    .top-section .bot-section {
        padding: 0px;
    }

    .top-section .container,
    .bot-section .container {
        width: 100%;
    }

    .sc_tit {
        font-size: 7.333125em;
    }

    .text_pl {
        font-size: 4.0rem;
    }
}


/*****/
@media (min-width:720px) and (max-width:770px) {
    html {
        font-size: 7px;
    }

    .top-section .bot-section {
        padding: 0px;
    }

    .top-section .container,
    .bot-section .container {
        width: 100%;
    }

    .sc_tit {
        font-size: 7.333125em;
    }

    .text_pl {
        font-size: 2.81rem;
    }
}
/*****/
@media (min-width: 540px) and (max-width:710px) {
    html {
        font-size: 6px;
    }

    .top-section .bot-section {
        padding: 0px;
    }

    .top-section .container,
    .bot-section .container {
        width: 100%;
    }

    .sc_tit {
        font-size: 6.333125em;
    }

    .text_pl {
        font-size: 2.5rem;
    }
}



/*****/
@media (min-width:414px) and (max-width:450px) {
    html {
        font-size: 5px;
    }

    .top-section .bot-section {
        padding: 0px;
    }

    .top-section .container,
    .bot-section .container {
        width: 100%;
    }
}
/*****/
@media (min-width:300px) and (max-width:412px) {
    html {
        font-size: 4px;
    }

    .top-section .bot-section {
        padding: 0px;
    }

    .top-section .container,
    .bot-section .container {
        width: 100%;
    }

    .sc_tit {
        font-size: 6.333125em;
    }

    .text_pl {
        font-size: 2rem;
    }
}
