#app {
    max-width: 640px;
    margin: 0 auto;
}

:root {

    --px: (1000px / 750);
}

html {
    font-size: calc(16 * var(--px));
}

.display_pc_block {
    display: block;
}

.display_pc_none {
    display: none;
}

.title_1_size {
    font-size: calc(16 * var(--px));
}

.header_box {
    width: calc(1920 * var(--px));


    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: relative;
}

.header_box_form {
    width: calc(595 * var(--px));
    background-image: url(../img/new/header_box_form.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;


}

.header_box_form_data {
    display: flex;
    flex-direction: column;
    padding-top: calc(58 * var(--px));
    padding-bottom: calc(4 * var(--px));
}

.header_box_form_data_list {
    display: flex;
    border-bottom: 0.1vw solid #EAE6D9;
}


.header_box_form_data_list_data {
    display: flex;
    padding-left: calc(25 * var(--px));
    margin-top: -0.1em;
}

.header_box_form_data_list_title {
    color: #B4832F;
    text-align-last: justify;
    position: relative;
}

.header_box_form_data_list_title::after {
    content: ":";
    position: absolute;
    right: calc(-8 * var(--px));
    text-align-last: left;
    top: 40%;
    transform: translateY(-50%);
    display: none;
}

.header_box_form_data_list_data_r {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.header_box_form_data_list_data_r_icon {
    display: flex;
    align-items: center;
    width: calc(25 * var(--px));
    height: calc(22 * var(--px));
    background-image: url(../img/header_box_form_data_list_data_r_icon.png);
    background-repeat: no-repeat;
    background-size: 87% 100%;
}

.header_box_form_data_list_data_r_icon.active {
    background-size: 100% 100%;

    background-image: url(../img/header_box_form_data_list_data_r_icon_active.png);
}

.header_box_form_data_list_data_r_text {
    display: flex;
    align-items: center;
    line-height: 1.1em;
}

.header_box_form_data_list_data_input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    border: none;
    outline: none;
    background: transparent;

    padding: 0;
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    box-shadow: none;
    width: 100%;
}

.header_box_form_data_list_data_input::-ms-clear,
.header_box_form_data_list_data_input::-ms-reveal {
    display: none;
}


.header_box_form_data_list_data_select {
    color: #5C5955;
    /* line-height: 1.4em; */
    cursor: pointer;
}

.header_box_form_data_list_data_select_a {
    line-height: 1.4em;
    position: relative;
}

.header_box_form_data_list_data_select_a select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background: transparent;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    padding: 0;
    margin: 0;
    outline: none;
    cursor: pointer;
}

.header_box_form_data_list_data_select_a select::-ms-expand {
    display: none;
}

.time_select {
    pointer-events: none;
    width: calc(59 * var(--px));
    height: calc(25 * var(--px));
    padding: calc(3 * var(--px)) calc(7 * var(--px)) !important;
    background-color: #FFFFFF !important;
    margin-right: calc(7 * var(--px)) !important;
    text-align: left;
    border: 0.1vw solid #e4d2b9 !important;
    color: #494949 !important;
    font-size: calc(13 * var(--px)) !important;
    position: relative !important;
    border-radius: calc(3 * var(--px)) !important;
    line-height: 1.5em;
    cursor: pointer;
}

.header_box_form_data_list_data_select_a::before,
.header_box_form_data_list_data_select_a::after {
    content: "";
    position: absolute;
    right: calc(37 * var(--px));
    width: 0;
    height: 0;
    border-left: calc(4 * var(--px)) solid transparent;
    border-right: calc(4 * var(--px)) solid transparent;
    z-index: 9 !important;
}

.header_box_form_data_list_data_select_a::before {
    top: calc(7 * var(--px));
    border-bottom: calc(5 * var(--px)) solid #ab865e;
}

.header_box_form_data_list_data_select_a::after {
    bottom: calc(6 * var(--px));
    border-top: calc(5 * var(--px)) solid #be9568;
}

.header_box_form_data_list_data_select_a_m {
    margin-left: calc(34 * var(--px)) !important;
}

.header_box_form_buttom {
    width: calc(466 * var(--px));
    height: calc(62 * var(--px));
    background-size: 100% 100%;
    margin: 0 auto;
    margin-bottom: calc(10 * var(--px));
    cursor: pointer;
}

.header_box_form_buttom.naming {
    background-image: url(../img/index/naming_buttom.png);
}

.header_box_form_buttom.namescore {
    background-image: url(../img/index/namescore_button.png);
}


.header_box_form_userinfo {
    width: calc(466 * var(--px));


}

.header_box_form_userinfo_list {
    font-size: calc(16 * var(--px));
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form_userinfo {
    display: flex;
    align-items: center;
}

.form_userinfo_img {
    width: calc(20 * var(--px));
    height: calc(20 * var(--px));
    margin-right: calc(10 * var(--px));
}

.form_userinfo_img>img {
    width: 100%;
    height: 100%;
}

.form_userinfo_text {
    color: #333333;
}

.form_userinfo_text span {
    color: #010101;
}

.form_userinfo_time {
    color: #AFA185;
}

.main_box_1 {
    width: calc(1920 * var(--px));
    height: calc(1031 * var(--px));
    background-image: url(https://laoguo-caiji.oss-cn-beijing.aliyuncs.com/zhice/qiming_v1/img/main_box_1.png);
    background-size: 100% 100%;
    border-top: 1px solid transparent;
}


.box_title {
    margin: 0 auto;
    margin-top: calc(63 * var(--px));
    margin-bottom: calc(53 * var(--px));
    height: calc(90 * var(--px));
    display: flex;
    justify-content: center;
}

.box_title img {
    height: 100%;
}

.main_box_1_data {
    width: calc(1200 * var(--px));
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 0 auto;
    gap: calc(8 * var(--px));

}

.main_box_1_data_item {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
}

.main_box_1_data_item_l {
    background-image: url(../img/main_box_1_data_item_l_img.png);
    background-size: 100% auto;
    background-position: center top;
    background-repeat: no-repeat;
    flex: 1;
    padding: 0 calc(25 * var(--px));
    padding-top: calc(18 * var(--px));
    padding-bottom: calc(36 * var(--px));

}

.main_box_1_data_item_l_img {
    width: calc(130 * var(--px));
    height: calc(130 * var(--px));
    margin: 0 auto;
    margin-bottom: calc(18 * var(--px));
}

.main_box_1_data_item_l_img img {
    width: 100%;
    height: 100%;

}

.main_box_1_data_item_l_title {
    font-weight: 400;
    font-size: calc(14 * var(--px));
    color: #000000;
    line-height: calc(24 * var(--px));
}

.main_box_1_data_item_r {
    width: calc(48 * var(--px));
    min-width: calc(48 * var(--px));
    background-image: url(../img/main_box_1_data_item_r_img.png);
    background-size: 100% auto;
    background-position: center top;
    background-repeat: no-repeat;
    writing-mode: vertical-rl;
    text-orientation: upright;
    text-align: center;
    display: inline-block;
    line-height: 2.8em;
    font-size: calc(20 * var(--px));
    color: #FFF6D4;
}

.main_box_2 {
    width: calc(1920 * var(--px));
    background-size: 100% auto;
    background-position: center bottom;
    border-top: 1px solid transparent;
    background-repeat: no-repeat;
    position: relative;
}

.main_box_2_title {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: calc(56 * var(--px));
    margin-bottom: calc(41 * var(--px));

}

.main_box_2_title_item {
    width: calc(448 * var(--px));
    height: calc(74 * var(--px));
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center center;
}

.main_box_2_title_l {
    background-image: url(../img/main_box_2_title_l.png);
}

.main_box_2_title_c {
    width: calc(75 * var(--px));
    height: calc(101 * var(--px));
    background-image: url(../img/main_box_2_title_c.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center center;
    margin: 0 calc(20 * var(--px));

}

.main_box_2_title_r {
    background-image: url(../img/main_box_2_title_r.png);

}

.main_box_2_remoke {
    margin: 0 auto;
    font-weight: 400;
    font-size: calc(18 * var(--px));
    line-height: calc(42 * var(--px));
    display: flex;
    align-items: center;
    justify-content: center;
}

.main_box_2_remoke p {
    color: #333333;

}

.main_box_2_data {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: calc(10 * var(--px));
    margin-top: calc(25 * var(--px));
    position: relative;
}

.main_box_2_data::after {
    content: ' ';
    width: calc(500 * var(--px));
    height: calc(6 * var(--px));
    position: absolute;
    bottom: 1%;
    right: 24%;
    background-color: #dcdcdc;
}

.main_box_2_data::before {
    content: ' ';
    width: calc(500 * var(--px));
    height: calc(6 * var(--px));
    position: absolute;
    bottom: 1%;
    left: 24%;
    background-color: red;
}

.main_box_2_data_item {
    display: flex;
    align-items: center;
    justify-content: center;
}

.main_box_2_data_item_box {
    width: calc(436 * var(--px));
    height: calc(79 * var(--px));
    border-radius: calc(8 * var(--px));
    padding: calc(18 * var(--px)) calc(22 * var(--px));
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-weight: 400;
    font-size: calc(18 * var(--px));
    line-height: calc(24 * var(--px));
}

.main_box_2_data_item_left {
    color: #C3A05D;
    border: calc(2 * var(--px)) solid #C3A05D;
}

.main_box_2_data_item_img {
    width: calc(78 * var(--px));
    height: calc(78 * var(--px));
    margin: 0 calc(26 * var(--px));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(35 * var(--px));
    font-weight: bold;
    font-family: "SimSun", "STSong", "Songti SC", serif;
    color: #C3A05D;
}

.main_box_2_data_item_img img {
    width: 100%;
    height: 100%;
}

.main_box_2_data_item_rigth {
    color: #B4B4B4;
    border: calc(2 * var(--px)) solid #B4B4B4;
}

.main_box_2_data_item_box_l {
    color: #C3A05D;
    font-size: calc(35 * var(--px));
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "SimSun", "STSong", "Songti SC", serif;
}


.main_box_2_data_item_box_f {
    color: #B4B4B4;
    font-size: calc(35 * var(--px));
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "SimSun", "STSong", "Songti SC", serif;
}


.main_box_2_data_copy {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: calc(20 * var(--px));
    margin-bottom: calc(45 * var(--px));

}

.main_box_2_data_copy_data {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: calc(40 * var(--px));
}

.main_box_2_data_copy_data_item {
    width: calc(584 * var(--px));
    background: #FFFFFF;
    box-shadow: 0px 0px calc(6 * var(--px)) 0px #E2DBD2;
    border-radius: calc(8 * var(--px));
    box-sizing: border-box;
    padding: calc(21 * var(--px)) calc(21 * var(--px));
}

.main_box_2_data_copy_data_item_title {
    font-weight: 500;
    font-size: calc(18 * var(--px));
    color: #A37335;
    line-height: calc(24 * var(--px));
    margin-bottom: calc(27 * var(--px));
    position: relative;
}

.main_box_2_data_copy_data_item_title::after {
    content: ' ';
    width: 100%;
    height: calc(10 * var(--px));
    background-image: url(../img/main_box_2_data_copy_data_item_title.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    bottom: -60%;
    left: 0;
}

.main_box_2_data_copy_data_item_text {
    font-weight: 400;
    font-size: calc(14 * var(--px));
    color: #666666;
    line-height: calc(24 * var(--px));
}

.main_box_3 {
    width: calc(1920 * var(--px));
    background-image: url(https://laoguo-caiji.oss-cn-beijing.aliyuncs.com/zhice/qiming_v1/img/main_box_3.png);
    background-size: 100% auto;
    background-position: center bottom;
    border-top: 1px solid transparent;
    background-repeat: no-repeat;
    position: relative;
    padding-bottom: calc(25 * var(--px));
}


.main_box_3_wrapper {
    width: calc(1200 * var(--px));
    margin: 0 auto;
    overflow: hidden;
    background: transparent;
    position: relative;
    border: 0.1vw solid transparent;

}

.main_box_3_data {
    display: flex;
    width: max-content;
    gap: calc(17 * var(--px));
    animation: scroll-left 20s linear infinite;
    cursor: pointer;
}

.main_box_3_data:hover {}

.main_box_3_data_item {
    flex-shrink: 0;
    width: calc(287 * var(--px));
    height: calc(555 * var(--px));
    padding: 0 calc(53 * var(--px));
    padding-top: calc(49 * var(--px));
    box-sizing: border-box;
    background-image: url(../img/main_box_3_data_item.png);
    background-size: 100% 100%;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    gap: calc(10 * var(--px));
    text-align: center;

}

.main_box_3_data_item_img {
    margin: 0 auto;
    width: calc(60 * var(--px));
    height: calc(60 * var(--px));
    border-radius: 50%;
    overflow: hidden;
}

.main_box_3_data_item_img img {
    width: 100%;
    height: 100%;
}

.main_box_3_data_item_name {
    font-family: "SimSun", "STSong", serif;
    font-weight: bold;
    font-size: calc(16 * var(--px));
    margin-top: calc(18 * var(--px));
    margin-bottom: calc(23 * var(--px));

    color: #B37D43;
}

.main_box_3_data_item_code {
    font-size: calc(14 * var(--px));
    color: #999999;
}

.main_box_3_data_item_remoke {
    font-size: calc(14 * var(--px));
    color: #666;
    white-space: normal;
    text-align: left;
    margin-top: calc(48 * var(--px));
    line-height: calc(24 * var(--px));
    text-indent: 2em;

}

@keyframes scroll-left {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

.main_box_4 {
    width: calc(1920 * var(--px));
    background-image: url(https://laoguo-caiji.oss-cn-beijing.aliyuncs.com/zhice/qiming_v1/img/main_box_4.png);
    background-size: 100% auto;
    background-position: center top;
    border-top: 1px solid transparent;
    background-repeat: no-repeat;
    position: relative;
}


.main_box_4_data {
    width: calc(1200 * var(--px));
    height: calc(403 * var(--px));
    background-image: url(../img/main_box_4_data.png);
    background-size: 100% 100%;
    background-position: center top;
    background-repeat: no-repeat;
    margin: 0 auto;
    margin-bottom: calc(62 * var(--px));
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: calc(15 * var(--px));
    padding: calc(45 * var(--px)) calc(42 * var(--px));
    box-sizing: border-box;
}

.main_box_4_data_item {
    width: calc(50% - calc(10 * var(--px)));
    box-sizing: border-box;
    border-bottom: 0.1vw solid #bea066;
    margin-bottom: calc(17 * var(--px));
}

.main_box_4_data_item_title {
    position: relative;
    padding-left: calc(57 * var(--px));
    font-weight: bold;
    font-size: calc(18 * var(--px));
    color: #1B1308;
    line-height: calc(24 * var(--px));
    margin-bottom: calc(25 * var(--px));
}

.main_box_4_data_item_title::after {
    content: ' ';
    width: calc(40 * var(--px));
    height: calc(40 * var(--px));
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    background-image: url(../img/main_box_4_data_item_title.png);
    background-size: 100% 100%;
    background-position: center center;
    background-repeat: no-repeat;
}

.main_box_4_data_item_text {
    position: relative;
    padding-left: calc(57 * var(--px));
    font-weight: 400;
    font-size: calc(16 * var(--px));
    color: #333333;
    line-height: calc(24 * var(--px));
    padding-bottom: calc(24 * var(--px));
}

.main_box_4_data_item_text::after {
    content: ' ';
    width: calc(40 * var(--px));
    height: calc(40 * var(--px));
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    background-image: url(../img/main_box_4_data_item_text.png);
    background-size: 100% 100%;
    background-position: center center;
    background-repeat: no-repeat;
}


.section_footer {
    background-image: url('../img/section_footer-bg.webp');
    background-size: cover;
    background-repeat: no-repeat;
}

.section_footer_container {
    width: 62.5vw;
    margin: 0 auto;
    padding: 2.5vw 0 1.56vw;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.section_footer-left {
    flex: 1;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.section_footer-right {
    display: block;
    width: 11.25vw;
    height: 13.125vw;
    cursor: pointer;
}

.section_footer-header {
    width: 20.05vw;
    display: flex;
    justify-content: space-between;
    gap: 1.33vw;
}

.section_footer-header-about {
    flex: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 1.33vw;
}

.section_footer-header-title {
    font-weight: 400;
    font-size: 1.25vw;
    color: #494949;
}

.section_footer-header-text {
    font-weight: 400;
    font-size: 0.83vw;
    line-height: 1.4vw;
}


.section_footer-contact {
    display: none;
}

.section_footer-btns {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.42vw;
    margin-left: 4.69vw;
}

.section_footer-btns a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 8.75vw;
    height: 1.93vw;
    background-image: url('../img/section_footer-btn-bg.webp');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    font-weight: 400;
    font-size: 0.83vw;
    color: #4D311E;
    text-decoration: none;
    user-select: none;
}

.section_footer-company {
    width: 100%;
    text-align: left;
    font-weight: 400;
    font-size: 0.73vw;
    color: #A59685;
}

.section_footer-company a {
    color: #A59685;
}


:root {
    --px: (100vw / 2245);
}

html {
    font-size: calc(20 * var(--px));
}

.display_pc_block {
    display: none;
}

.display_pc_none {
    display: block;
}


.display_pc_block {
    display: block;
}

.display_pc_none {
    display: none;
}

.title_1_size {
    font-size: calc(16 * var(--px));
}

.header_box {
    margin: 0 auto;
    width: calc(750 * var(--px));
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: relative;
    background: #ffffff;
    border: 0.5px solid #ffffff;
}


.header_box_form {
    width: calc(729 * var(--px));
    position: relative;
    margin: 0 auto;
    padding-bottom: 0.25rem;
    background-image: url(../img/new/header_box_form_top.png),
    url(../img/new/header_box_form_bottom.png),
    url(../img/new/header_box_form_middle.png);
    background-size: 100% auto,
    100% auto,
    100% 92%;
    background-repeat: no-repeat;
    background-position: center top,
    center bottom,
    center center;
    border: 0.5px solid transparent;
    position: relative;
}

.header_box_form_data {
    padding: 0 0.48rem;
    display: flex;
    flex-direction: column;
    padding-top: 0.23rem;
    padding-bottom: calc(15 * var(--px));
    font-size: 0.28rem;
}

.header_box_form_data_list {
    display: flex;
    border-bottom: 0.1vw solid #EAE6D9;
    justify-content: space-between;
    align-items: center;
    height: 0.88rem;
}

.header_box_form_data_list_data {
    display: flex;
    padding-left: calc(43 * var(--px));
    margin-top: -0.1em;
}

.header_box_form_data_list_title {
    color: #B4832F;
    text-align-last: left;
    position: relative;
}

.header_box_form_data_list_title::after {
    content: ":";
    position: absolute;
    right: calc(-8 * var(--px));
    text-align-last: left;
    top: 40%;
    transform: translateY(-50%);
}

.header_box_form_data_list_data_r {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.header_box_form_data_list_data_r_icon {
    display: flex;
    align-items: center;
    width: calc(25 * var(--px));
    height: calc(22 * var(--px));
    background-image: url(../img/header_box_form_data_list_data_r_icon.png);
    background-repeat: no-repeat;
    background-size: 87% 100%;
}

.header_box_form_data_list_data_r_icon.active {
    background-size: 100% 100%;

    background-image: url(../img/header_box_form_data_list_data_r_icon_active.png);
}

.header_box_form_data_list_data_r_text {
    display: flex;
    align-items: center;
    line-height: 1;
    border-radius: 0.5vw;
    padding: 0.2vw 0.3vw;
}

.header_box_form_data_list_data_input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    outline: none;
    background: transparent;
    padding: 0;
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    box-shadow: none;
    width: 100%;
    text-align: right;
}

.header_box_form_data_list_data_input::-ms-clear,
.header_box_form_data_list_data_input::-ms-reveal {
    display: none;
}


.header_box_form_data_list_data_select {
    color: #5C5955;
    /* line-height: 1.4em; */
    cursor: pointer;
}

.header_box_form_data_list_data_select_a {
    line-height: 1.4em;
    position: relative;
}

.header_box_form_data_list_data_select_a select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background: transparent;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    padding: 0;
    margin: 0;
    outline: none;
    cursor: pointer;
}

.header_box_form_data_list_data_select_a select::-ms-expand {
    display: none;
}

.time_select {
    pointer-events: none;
    width: calc(75 * var(--px));
    height: calc(38 * var(--px));
    padding: calc(3 * var(--px)) calc(7 * var(--px)) !important;
    background-color: #FFFFFF !important;
    margin-right: calc(7 * var(--px)) !important;
    text-align: left;
    border: 0.1vw solid #e4d2b9 !important;
    color: #494949 !important;
    font-size: calc(20 * var(--px)) !important;
    position: relative !important;
    border-radius: calc(3 * var(--px)) !important;
    line-height: 1.5em;
}

.header_box_form_data_list_data_select_a::before,
.header_box_form_data_list_data_select_a::after {
    content: "";
    position: absolute;
    right: calc(52 * var(--px));
    width: 0;
    height: 0;
    border-left: calc(8 * var(--px)) solid transparent;
    border-right: calc(8 * var(--px)) solid transparent;
    z-index: 9 !important;
}

.header_box_form_data_list_data_select_a::before {
    top: calc(10 * var(--px));
    border-bottom: calc(8 * var(--px)) solid #ab865e;
}

.header_box_form_data_list_data_select_a::after {
    bottom: calc(9 * var(--px));
    border-top: calc(7 * var(--px)) solid #be9568;
}

.header_box_form_data_list_data_select_a_m {
    margin-left: calc(34 * var(--px)) !important;
}

.header_box_form_buttom {
    width: calc(488 * var(--px));
    height: calc(93 * var(--px));
    background-image: url(../img/header_box_form_buttom.png);
    background-size: 100% 100%;
    margin: 0.2rem auto;
    /* margin-bottom: calc(20 * var(--px)); */
    cursor: pointer;
    animation: breathing123 1.5s infinite;
    margin-bottom: 0.1rem;
}

@keyframes breathing123 {
    0% {
        opacity: .9;
        transform: scale(.98)
    }

    50% {
        opacity: 1;
        transform: scale(1.12)
    }

    to {
        opacity: .9;
        transform: scale(.98)
    }
}


.header_box_form_userinfo {
    width: 87%;
    background: #c6a17a;
    border: 0.001rem solid #81511c;
    border-radius: 10rem;
}

.header_box_form_userinfo_list {
    font-size: calc(20 * var(--px));
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form_userinfo {
    display: flex;
    align-items: center;
}

.form_userinfo_img {
    width: calc(20 * var(--px));
    height: calc(20 * var(--px));
    margin-right: calc(10 * var(--px));
}

.form_userinfo_img>img {
    width: 100%;
    height: 100%;
}

.form_userinfo_text {
    color: #333333;
}

.form_userinfo_text span {
    color: #010101;
}

.form_userinfo_time {
    color: #785143;
}

.main_box_1 {
    margin: 0 auto;
    width: calc(750 * var(--px));
    height: auto;
    background-image: url(../img/main_box_1_m.png), url(../img/main_box_1_m_bottom.png);
    background-size: 100% calc(180 * var(--px)), 100% auto;
    background-position: left top, center bottom;
    background-repeat: no-repeat, no-repeat;
    border-top: 1px solid transparent;
    padding-bottom: calc(89 * var(--px));
}


.box_title {
    margin: 0 auto;
    margin-top: calc(30 * var(--px));
    margin-bottom: calc(38 * var(--px));
    height: calc(90 * var(--px));
    display: flex;
    justify-content: center;
}

.box_title img {
    height: 100%;
}

.main_box_1_data {
    width: calc(724 * var(--px));
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin: 0 auto;
}

.main_box_1_data_item {
    display: flex;
    justify-content: flex-start;
    min-height: calc(440 * var(--px));
    align-items: stretch;
    margin-bottom: calc(10 * var(--px));
;
}

.main_box_1_data_item_l {
    background-image: url(../img/main_box_1_data_item_l_img.png);
    background-size: 100% auto;
    background-position: center top;
    background-repeat: no-repeat;
    flex: 1;
    padding: 0 calc(30 * var(--px));
    padding-top: calc(21 * var(--px));
    padding-bottom: calc(43 * var(--px));
    box-sizing: border-box;
}

.main_box_1_data_item_l_img {
    width: calc(155 * var(--px));
    height: calc(155 * var(--px));
    margin: 0 auto;
    margin-bottom: calc(18 * var(--px));
}

.main_box_1_data_item_l_title {
    font-weight: 400;
    font-size: calc(17 * var(--px));
    color: #000000;
    line-height: calc(29 * var(--px));
}

.main_box_1_data_item_r {
    width: calc(57 * var(--px));
    min-width: calc(57 * var(--px));
    background-image: url(../img/main_box_1_data_item_r_img.png);
    background-size: 100% auto;
    background-position: center top;
    background-repeat: no-repeat;
    writing-mode: vertical-rl;
    text-orientation: upright;
    text-align: center;
    display: inline-block;
    line-height: 2.6em;
    font-size: calc(24 * var(--px));
    color: #FFF6D4;
}

.main_box_2 {
    width: 100%;
    background-size: 100% auto;
    background-position: center bottom;
    border-top: 1px solid transparent;
    background-repeat: no-repeat;
    position: relative;
    margin: 0 auto;
}

.main_box_2_title {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: calc(46 * var(--px));
    margin-bottom: calc(37 * var(--px));
}

.main_box_2_title_item {
    width: calc(308 * var(--px));
    height: calc(64 * var(--px));
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center center;
}

.main_box_2_title_l {
    background-image: url(../img/main_box_2_title_l_m.png);
}

.main_box_2_title_c {
    min-width: calc(75 * var(--px));
    min-height: calc(101 * var(--px));
    width: calc(75 * var(--px));
    height: calc(101 * var(--px));
    background-image: url(../img/main_box_2_title_c.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center center;
}

.main_box_2_title_r {
    background-image: url(../img/main_box_2_title_r_m.png);

}

.main_box_2_remoke {
    margin: 0 auto;
    font-weight: 400;
    font-size: calc(22 * var(--px));
    line-height: calc(42 * var(--px));
    display: flex;
    align-items: center;
    justify-content: center;
}

.main_box_2_remoke p {
    color: #333333;

}

.main_box_2_data {
    margin: 0 0.5vw;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: calc(10 * var(--px));
    margin-top: calc(32 * var(--px));
    position: relative;
}

.main_box_2_data::after {
    content: ' ';
    width: calc(364 * var(--px));
    height: calc(6 * var(--px));
    position: absolute;
    bottom: 1%;
    right: 0;
    background-color: #dcdcdc;
}

.main_box_2_data::before {
    content: ' ';
    width: calc(500 * var(--px));
    height: calc(6 * var(--px));
    position: absolute;
    bottom: 1%;
    left: 0;
    background-color: red;
}

.main_box_2_data_item {
    display: flex;
    align-items: stretch;
    justify-content: center;
}

.main_box_2_data_item_box {
    width: calc(436 * var(--px));
    height: auto;
    border-radius: calc(8 * var(--px));
    padding: calc(15 * var(--px)) calc(23 * var(--px));
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-weight: 400;
    font-size: calc(22 * var(--px));
    line-height: calc(30 * var(--px));
}

.main_box_2_data_item_left {
    color: #C3A05D;
    border: calc(2 * var(--px)) solid #C3A05D;
}

.main_box_2_data_item_img {
    width: calc(78 * var(--px));
    height: auto;
    min-width: calc(78 * var(--px));
    min-height: calc(78 * var(--px));
    margin: 0 calc(26 * var(--px));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(35 * var(--px));
    font-weight: bold;
    font-family: "SimSun", "STSong", "Songti SC", serif;
    color: #C3A05D;

}

.main_box_2_data_item_img img {
    width: calc(78 * var(--px));
    height: calc(78 * var(--px));
    min-width: calc(78 * var(--px));
    min-height: calc(78 * var(--px));
}

.main_box_2_data_item_rigth {
    color: #B4B4B4;
    border: calc(2 * var(--px)) solid #B4B4B4;
}

.main_box_2_data_item_box_l {
    color: #C3A05D;
    font-size: calc(35 * var(--px));
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "SimSun", "STSong", "Songti SC", serif;
}


.main_box_2_data_item_box_f {
    color: #B4B4B4;
    font-size: calc(35 * var(--px));
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "SimSun", "STSong", "Songti SC", serif;
}


.main_box_2_data_copy {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: calc(20 * var(--px));
    margin-bottom: calc(45 * var(--px));

}

.main_box_2_data_copy_data {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: calc(15 * var(--px));
    flex-direction: column;
}

.main_box_2_data_copy_data_item {
    width: calc(729 * var(--px));
    background: #FFFFFF;
    box-shadow: 0px 0px calc(6 * var(--px)) 0px #E2DBD2;
    border-radius: calc(8 * var(--px));
    box-sizing: border-box;
    padding: calc(21 * var(--px)) calc(21 * var(--px));
}

.main_box_2_data_copy_data_item_title {
    font-weight: 500;
    font-size: calc(18 * var(--px));
    color: #A37335;
    line-height: calc(24 * var(--px));
    margin-bottom: calc(27 * var(--px));
    position: relative;
}

.main_box_2_data_copy_data_item_title::after {
    content: ' ';
    width: 100%;
    height: calc(10 * var(--px));
    background-image: url(../img/main_box_2_data_copy_data_item_title.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    bottom: -60%;
    left: 0;
}

.main_box_2_data_copy_data_item_text {
    font-weight: 400;
    font-size: calc(14 * var(--px));
    color: #666666;
    line-height: calc(24 * var(--px));
}

.main_box_3 {
    margin: 0 auto;
    width: 100%;
    background-image: url(https://laoguo-caiji.oss-cn-beijing.aliyuncs.com/zhice/qiming_v1/img/main_box_3.png);
    background-size: 100% auto;
    background-position: center bottom;
    border-top: 1px solid transparent;
    background-repeat: no-repeat;
    position: relative;
    padding-bottom: calc(25 * var(--px));
}


.main_box_3_wrapper {
    width: calc(750 * var(--px));
    margin: 0 auto;
    overflow: hidden;
    background: transparent;
    position: relative;
    border: 0.1vw solid transparent;
}

.main_box_3_data {
    display: flex;
    width: max-content;
    gap: calc(17 * var(--px));
    cursor: pointer;
}


.main_box_3_data_item {
    flex-shrink: 0;
    width: calc(287 * var(--px));
    height: calc(555 * var(--px));
    padding: 0 calc(53 * var(--px));
    padding-top: calc(49 * var(--px));
    box-sizing: border-box;
    background-image: url(../img/main_box_3_data_item.png);
    background-size: 100% 100%;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    gap: calc(10 * var(--px));
    text-align: center;
}

.main_box_3_data_item_img {
    margin: 0 auto;
    width: calc(60 * var(--px));
    height: calc(60 * var(--px));
    border-radius: 50%;
    overflow: hidden;
}

.main_box_3_data_item_img img {
    width: 100%;
    height: 100%;
}

.main_box_3_data_item_name {
    font-family: "SimSun", "STSong", serif;
    font-weight: bold;
    font-size: calc(16 * var(--px));
    margin-top: calc(23 * var(--px));
    margin-bottom: calc(16 * var(--px));
    color: #B37D43;
}

.main_box_3_data_item_code {
    font-size: calc(14 * var(--px));
    color: #999999;
}

.main_box_3_data_item_remoke {
    font-size: calc(14 * var(--px));
    color: #666;
    white-space: normal;
    text-align: left;
    margin-top: calc(7 * var(--px));
    line-height: calc(24 * var(--px));
    text-indent: 2em;
}

@keyframes scroll-left {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

.main_box_4 {
    margin: 0 auto;
    width: calc(750 * var(--px));
    background-image: url(https://laoguo-caiji.oss-cn-beijing.aliyuncs.com/zhice/qiming_v1/img/main_box_4.png);
    background-size: 100% auto;
    background-position: center top;
    border-top: 1px solid transparent;
    background-repeat: no-repeat;
    position: relative;
}


.main_box_4_data {
    width: calc(730 * var(--px));
    height: auto;
    background-image: none;
    background-size: 100% 100%;
    background-position: center top;
    background-repeat: no-repeat;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: calc(15 * var(--px));
    padding: calc(45 * var(--px)) calc(42 * var(--px));
    box-sizing: border-box;
}

.main_box_4_data_item {
    width: calc(729 * var(--px));
    box-sizing: border-box;
    border-bottom: 0.1vw solid #bea066;
    margin-bottom: calc(17 * var(--px));
}

.main_box_4_data_item_title {
    position: relative;
    padding-left: calc(57 * var(--px));
    font-weight: bold;
    font-size: calc(18 * var(--px));
    color: #1B1308;
    line-height: calc(24 * var(--px));
    margin-bottom: calc(25 * var(--px));
}

.main_box_4_data_item_title::after {
    content: ' ';
    width: calc(40 * var(--px));
    height: calc(40 * var(--px));
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    background-image: url(../img/main_box_4_data_item_title.png);
    background-size: 100% 100%;
    background-position: center center;
    background-repeat: no-repeat;
}

.main_box_4_data_item_text {
    position: relative;
    padding-left: calc(57 * var(--px));
    font-weight: 400;
    font-size: calc(16 * var(--px));
    color: #333333;
    line-height: calc(24 * var(--px));
    padding-bottom: calc(24 * var(--px));
}

.main_box_4_data_item_text::after {
    content: ' ';
    width: calc(40 * var(--px));
    height: calc(40 * var(--px));
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    background-image: url(../img/main_box_4_data_item_text.png);
    background-size: 100% 100%;
    background-position: center center;
    background-repeat: no-repeat;
}

.section_footer {

    margin: 0 auto;
    background-image: url('../img/section_footer-bg-mobile.webp');
}

.section_footer_container {
    padding: 0;
    width: calc(750 * var(--px));
    flex-direction: column;
}

.section_footer-left {
    padding: 1.27vw 2.6vw 1.93vw;
    flex-direction: column;
}

.section_footer-right {
    display: none;
}

.section_footer-header {
    width: 100%;

}

.section_footer-header-title {
    font-size: 2vw;
}

.section_footer-header-text {
    font-size: 0.9vw;
    line-height: 1.8vw;
}


.section_footer-contact {
    display: block;
    width: 8vw;
    height: 11.6vw;
    cursor: pointer;
}

.section_footer-btns {
    margin-top: 1vw;
    margin-left: 0;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
}

.section_footer-btns a {
    width: 8.47vw;
    height: 2vw;
    font-size: 0.97vw;
    line-height: 4vw;
}

.section_footer-company {
    margin-top: 1vw;
    text-align: center;
    font-size: 1vw;
}

.header_box_form_data_list_data_b {
    background-color: #ffffff;
    padding: 0;
    border-radius: 2vw;
}

.header_box_form_data_list_data_b_r {
    padding: 0.2vw 0.5vw;
    border-radius: 2.5vw;
}


.header_box_form_data_list_data_b_r_1 {
    background-color: #cf4128;
    color: #FFFFFF;
}

.header_box_form_data_list_data_b_r_2 {
    background-color: #cf4128;
    color: #FFFFFF;
}

.header_box_form_data_list_data_b_r_3 {
    background-color: #cf4128;
    color: #FFFFFF;
}


.test_push_data {
    margin: 0 0.151rem;
    padding: 0.377rem;
    border-radius: 0.113rem;

    display: grid;
    grid-template-columns: repeat(4, auto);
    justify-content: center;
    padding-bottom: 0;
    margin-top: 0.3rem;
    gap: 0 1rem;
    margin-bottom: 0.8rem;
}

.test_push_data_item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin-bottom: 0.277rem;
}

.test_push_data_img {
    width: 1.404rem;
    height: 1.404rem;
    border-radius: 12px;
}


.test_push_data_span {
    font-weight: 500;
    font-size: 14px;
    color: #333333;
    width: 1.004rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-top: 5px;
}

html,
body {
    width: 100%;
    height: 100%;
    margin: 0 auto;
}

@media screen and (min-width: 750px) {
    .header__container {
        position: sticky;
        height: 1.14rem;

    }
}


.items-center {
    align-items: center;
}

.justify-between {
    justify-content: space-between;
}

.flex {
    display: flex;
}

.w-full {
    width: 100%;
}


.section_footer {
    background-image: url('../img/section_footer-bg-mobile.webp');

}

.section_footer_container {
    width: 100%;
    padding: 0;
    flex-direction: column;
}

.section_footer-left {
    padding: 0.47rem 0.27rem 0.37rem;
    flex-direction: column;
}


.section_footer-right {
    display: none;
}

.section_footer-header {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 1.33vw;

}

.section_footer-header-title {
    font-size: 0.3rem;
}

.section_footer-header-text {
    font-size: 0.22rem;
    line-height: 0.3225rem;
}


.section_footer-contact {
    display: block;
    width: 2.16rem;
    height: 2.52rem;
    cursor: pointer;
    min-width: 2.16rem;
}

.section_footer-btns {

    margin-top: 0.3rem;
    margin-left: 0;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
}

.section_footer-btns a {
    width: 2.06rem;
    height: 0.45rem;
    font-size: 0.2rem;
}

.section_footer-company {
    margin-top: 0.3rem;
    text-align: center;
    font-size: 0.2rem;
}

.header_box_form_data_list_data_b {
    background-color: #dcdcdc;
    border-radius: 0.225rem;
    padding: 0;
    border-radius: 0.7875rem;
    overflow: hidden;
}

.header_box_form_data_list_data_b_r {
    padding: 0 . rem 0.165rem;
    border-radius: 0.4875rem;
    overflow: hidden;
}


.section_footer-btns {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin-left: 0;
}

.section_footer-btns a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    height: 0.6rem;
    background-image: url('../img/section_footer-btn-bg.webp');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    font-weight: 400;
    font-size: 0.32rem;
    color: #4D311E;
    text-decoration: none;
    user-select: none;
}

.section_footer-company {
    color: #A59685;
}


.header_box_form_userinfo {
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    height: 0.5rem;
}

.header_box_form_userinfo_scroll {
    transition: transform 0.5s ease-in-out;
}

.header_box_form_userinfo_list {
    font-size: 0.9vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 0.5rem;
    padding: 0 0.2rem;
    line-height: 1vw;
}

.header_box_form_userinfo_list:last-child {
    border-bottom: none;
}

.header_box_form_userinfo:hover .header_box_form_userinfo_scroll {
    animation-play-state: paused;
}


.custom-area .van-picker__toolbar {
    display: none !important;
}


.gender-toggle-copy {
    color: #6d6d6d;
    font-size: .28rem;
    background: transparent !important;
    display: flex;
    justify-content: flex-end;
    gap: 0.9rem;
    align-items: center;
}

.gender-toggle-copy-item {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.gender-toggle-copy-item-icon {
    width: 0.49rem;
    height: 0.4rem;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../../aiqiming_v2/img/test_name1.png);
    margin-right: 0.1rem;
    margin-bottom: 0.1rem;
}

.gender-toggle-copy-item-icon-active {
    background-image: url(../../aiqiming_v2/img/test_name1_active.png);
}


.header_box_form::after {
    width: 0.8rem;
    display: block;
    height: 41%;
    background-image: url(../img/new/header_box_form_font.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    position: absolute;
    top: 2.5rem;
    left: 8.5%;
}

.header_box_img {

    object-fit: cover;

    object-position: top;

    width: 100%;

    height: calc(535 * var(--px));
}


.header_box_form_tab {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0 auto;
    gap: 1rem;
    position: absolute;
    top: -1.28rem;
}

.header_box_form_tab_button {
    width: 3.5rem;
    height: 1.1rem;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
    cursor: pointer;
    transition: background-image 0.2s;
}

.header_box_form_tab_button_namescore {
    background-image: url(/static/qiming_v2/img/index/namescore_type.png);
}

.header_box_form_tab_button_naming {
    background-image: url(/static/qiming_v2/img/index/naming_type.png);
}

.header_box_form_tab_button_namescore.active {
    background-image: url(/static/qiming_v2/img/index/namescore_type_active.png);
}

.header_box_form_tab_button_naming.active {
    background-image: url(/static/qiming_v2/img/index/naming_type_active.png);
}

.user_num {

    margin: 0.2rem auto;

    display: flex;

    justify-content: center;

    align-items: center;

    margin-top: 0.1rem;

    margin-bottom: 0.3rem;
}

.user_num span{
    color: red;
}

#app{
    position: relative;

}

.po_fixed{
    display: block;
    width: 1.2rem;
    height: 2rem;
    position: sticky;
    left: 100%;
    bottom: 0;
}
.po_fixed > img{
    width: 1.2rem;
    height: 2rem;
}