body {
    width: 100%;
    margin: 0;
    padding: 0;
}

* {
    box-sizing: border-box;
}


ul,
li {
    list-style: none;
}

img {
    max-width: 100%;
}

.occupy-box {
    width: 100%;
    height: 90rem;
    display: none;
}



.nav-list-wrap {
    position: absolute;
    bottom: -115rem;
    width: 100%;
    height: 115rem;
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
}


.nav-list {
    display: flex;
    justify-content: space-around;
    padding: 0;
    margin: 0;
}

.nav-list-wrap > ul {
    height: 100%;
}

.nav-list-wrap > ul > li {
    margin: 0 9rem;
    padding: 0 20rem;
    height: 100%;
    display: flex;
    align-items: center;
    font-size: 30rem;
    position: relative;
    color: #fff;
    justify-content: center;
    text-align: center;
    cursor: pointer;
}

.nav-list-wrap > ul > li:hover .expand-icon {
    transform: rotate(180deg);
}



.nav-list-wrap .expand-icon {
    width: 12rem;
    margin-left: 10rem;
    transition: all .2s;
}

.nav-list-wrap .nav-list {
    width: 870rem;
}

.nav-list-wrap .nav-active {
    color: #17AC64;
}

.nav-list-wrap .nav-active-download {
    color: #fff;
    position: relative;
}

.nav-list-wrap .nav-active::after {
    content: '';
    position: absolute;
    bottom: 22rem;
    left: 50%;
    transform: translateX(-50%);
    width: 50rem;
    height: 3rem;
    background-color: #17AC64;
    border-radius: 12rem;
}

.nav-list-wrap .nav-active-download::after {
    content: '';
    position: absolute;
    bottom: 22rem;
    left: 50%;
    transform: translateX(-50%);
    width: 50rem;
    height: 3rem;
    background-color: #fff;
    border-radius: 12rem;
}

.menu-list {
    width: 110%;
    transform: scaleY(0);
    background-color: #fff;
    position: absolute;
    left: 0;
    top: 100%;
    overflow: hidden;
    transition: all .2s;
    transform-origin: 0 0;
    opacity: 0;
    border-radius: 0 0 3rem 3rem;
    z-index: 22;
}
.nav-list-wrap ul li .menu-list p{
    width: 100%;
    margin: 0;
    padding: 0;
}
.nav-list-wrap ul li .menu-list p a{
    display: block;
    font-size: 20rem;
    line-height: 40rem;
    color: #61626D;
    text-align: center;
}

.nav-list-wrap ul li .menu-list p a:hover{
    background-color: #17AC64;
    color: #fff;
}

.nav-list-wrap ul li .menu-list .two-nav-active a{
    background-color: #17AC64;
    color: #fff;
}

.nav-list > li:hover .menu-list {
    transform: scale(1);
    opacity: 1;
}

.color-white {
    color: #fff;
}
.fs-35{
    font-size: 35rem;
}
.fs-28{
    font-size: 28rem;
}
.fs-26{
    font-size: 26rem;
}
.fs-24{
    font-size: 24rem;
}
.fs-40{
    font-size: 40rem;
}
.fs-35 {
    font-size: 35rem;
}
.fs-30 {
    font-size: 30rem;
}
.fs-25 {
    font-size: 25rem;
}
.fs-20 {
    font-size: 20rem;
}
.fs-bold{
    font-weight: bold !important;
}


.color-green {
    color: #1F8C4C;
}

.footer-contact {
    width: 100vw;
    height: 154rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 12.5vw;
    box-sizing: border-box;
    background-color: #17AC64;
}

.footer-contact-text {
    font-size: 30rem;
    margin-right: 40rem;
    color: #fff;
}

.footer-contact-send-wrap {
    /* width: 327rem; */
    height: 48rem;
    border-radius: 47rem;
    padding: 0 10rem 0 10rem;
    display: flex;
    align-items: center;
    background-color: #fff;
    justify-content: space-between;
}

.footer-contact-email-input {
    border: none;
    font-size: 18rem;
    outline: none;
}

.footer-contact-email-input:focus-visible {
    outline: none;
}

.send-button {
    width: 67rem;
    height: 38rem;
    border-radius: 30rem;
    background-color: #17AC64;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.footer-item-wrap {
    width: 100vw;
    background-color: #132728;
    /* display: grid; */
    grid-template-columns: 2fr 1fr 1fr 1fr;
    column-gap: 8%;
    justify-content: center;
    padding: 60rem 240rem 76rem;
    border-bottom: 1rem solid #17AC64;
}

.fs-20 {
    font-size: 20rem;
}

.footer-item-1 > p {
    margin-bottom: 12rem;
}

.footer-item-1 .logo-wrap {
    display: flex;
    margin-bottom: 24rem;
}

.footer-item-1 .logo-wrap > img {
    object-fit: contain;
}

.footer-item-1 .logo-wrap .logo {
    margin-right: 24rem;
}

.footer-contact-plate > img {
    margin-right: 27rem;
    margin-top: 58rem;
}

.footer-item-2 {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.footer-item-title {
    font-size: 28rem;
    font-weight: bold;
    margin-bottom: 24rem;
}

.footer-item {
    font-size: 22rem;
}

.footer-item a:hover {
    text-decoration: none;
    color: #fff;
}

.copyright-wrap {
    width: 100vw;
    text-align: center;
    line-height: 98rem;
    background-color: #0E1D1E;
}

.copyright-wrap > p {
    margin-bottom: 0;
    color: #fff;
    font-size: 24rem;
}



.nav-list-wrap .right{
    width: 250rem;
    height: 50rem;
    line-height: 50rem;
    text-align: center;
    font-size: 18rem;
    font-weight: 400;
    background-color: rgb(46,211,155);
    border-radius: 25rem;
}

.nav-list-wrap .finally{
    /* width: 250rem;
    height: 50rem;
    line-height: 50rem;
    text-align: center;
    font-size: 18rem;
    font-weight: 500;
    background-color: rgb(46,211,155);
    border-radius: 25rem; */
    margin-left: 25rem;
    margin-right: 25rem;

}



/* .nav-list-wrap .right{
    width: 440rem;
    height: 60rem;
    line-height: 60rem;
    text-align: center;
    font-size: 20rem;
    font-weight: 600;
    background-color: rgb(46,211,155);
    border-radius: 30rem;
} */


#zone-preference3 div{
    width: 100%;
    display: flex;
    justify-content: space-between;
}

#zone-preference2 div{
    width: 100%;

    justify-content: space-between;


}

#zone-preference2 div>button{
    width: 100%;

    justify-content: space-between;
    width: 45%;
    text-align: center;
    margin-left: 20rem;
    margin-top: 10rem;


}

.form-footer2 .modal .modal-content .modal-body form .form-group:nth-child(3) #fileInput4{
    width: 48rem;
    height: 48rem;
    z-index: 222;
    opacity: 0;
    position: relative;
    left: 0rem;
    border: 1px solid #ccc;
}



.form-footer2 .modal .modal-content .modal-body .form-group .custom-checkbox2{
    width: auto;
    position: absolute;
    top: 0;
    right: 0;
    line-height: 25rem;
}

.form-footer2 .modal .modal-content .modal-body .form-group .custom-checkbox .label2{
    font-size: 18rem;
    color: #000;
    font-weight: 400;
    display: inline-block;
    transform: translateY(-8rem);
}
.form-footer2 .modal .modal-content .modal-body .form-group .custom-checkbox .checkboxs2{
    width: 30rem;
    height: 30rem;
    display: inline-block;
    background-image: url('../images/nochecked.png');
    background-size :cover;
}
.form-footer2 .modal .modal-content .modal-body .form-group .custom-checkbox .nocheckboxs2{
    width: 30rem;
    height: 30rem;
    background-image: url('../images/checked.png');
    background-size :cover;
    display: none;
}

.navbar-right {
    float: left !important;
}

.navbar-brand {
    width: 95rem;
    display: inline-block;
}

.navbar-brand img {
    width: 100%;
    height: 60rem;
}

.header-box {
    line-height: 100rem;
    padding: 0 248rem 0;
    width: 100%;
    height: 100rem;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}

.navbar-toggle {
    /* margin-top: 16rem; */
    margin-bottom: 0;
}

.header-title {
    width: 765rem;
    height: 21rem;
    display: flex;
    justify-content: space-around;
    margin-left: 70rem;
    margin-right: 189rem;
    align-items: center;
}

.header-title span {
    font-family: "瀹嬩綋", "lucida console", sans-serif;
    font-size: 23rem;
    color: #999999;
}

.header-title span:hover {
    cursor: pointer;
}

.header-search {
    width: 230rem;
    overflow: hidden;
    float: right;
    display: none;
}



.nav-login {
    float: right;
    margin-top: 30rem;
}

.nav-login a {
    color: #999;
    line-height: 30rem;
    font-size: 20rem;
}

.nav-login a:hover {
    color: #1c7430;
}



.swiper-container-horizontal {
    width: 100%;
    min-width: 1200rem;
}
#swiper-content{
    margin-top: 30rem;
}

.future-img img {
    width: 100%;
}

.top-container {
    width: 100%;
    margin: 0rem auto;
    overflow: hidden;
}

.top-container img {
    width: 100%;
}

.position-container {
    width: 100%;
    margin: 30rem auto;
    overflow: hidden;
    color: #0C0C0C;
    font-size: 30rem;
    line-height: 40rem;
}

.position-container a {
    color: #0C0C0C;
}

.news-theme {
    width: 100%;
    font-size: 60rem;
    font-weight: bold;
    text-align: center;
    padding: 30rem 0;
}

.news-list {
    width: 100%;
    margin: 30rem auto;
}

.news-content {
    width: 100%;
    padding: 30rem 0;
    border-bottom: 1rem solid #ddd;
}

.news-content-title {
    width: 100%;
    margin-top: 50rem;
    font-size: 30rem;
    line-height: 40rem;
    text-align: center;
    font-weight: bold;
}

.news-content-content {
    width: 100%;
    margin-top: 30rem;
}

.news-title {
    width: 100%;
    font-size: 30rem;
    font-weight: bold;
    color: #333;
    margin: 30rem auto;
}

.news-line {
    width: 20%;
    border: 1rem solid #000;
}

.news-description {
    width: 100%;
    font-size: 16rem;
    color: #333;
    padding: 5rem;
    margin: 30rem auto;
}

.news-link {
    width: 100%;
    font-size: 20rem;
    color: #333;
}

.news-ico {
    width: 100%;
}

.news-ico img {
    width: 100%;
}

.rotation-img {
    width: 100%;
    height: 800rem;
}

.content-content {
    border: 1rem solid #4c4c4c;
}

.content-content:hover {
    box-shadow: 1rem 1rem 1rem 1rem #4c4c4c;
}

.content-box-img {
    width: 100%;
}

.content-box-img img {
    width: 100%;
}

.content-text {
    margin-top: 24rem;
    width: 100%;
    height: auto;
    text-align: left;
}

.content-text-title {
    font-size: 20rem;
    font-weight: bolder;
    color: black;
}

.content-text-price {
    margin-top: 24rem;
    font-size: 30rem;
    font-weight: bolder;
    color: #ff0000;
    margin-bottom: 20rem;
}

.content-text-button {
    display: flex;
    justify-content: space-between;
    overflow: hidden;
}

.content-text-button-box {
    width: 115rem;
    height: 35rem;
    border-radius: 30rem;
    background-color: #FFA41C;
    color: #fff;
    font-weight: bolder;
    line-height: 35rem;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16rem;
}

.content-text-button-box:hover {
    color: #fff;
    text-decoration: none;
}

.swiper-slide a img {
    width: 100% !important;
    display: block !important;
}

.swiper-title {
    width: 80%;
    margin: 0 auto;
}

.swiper-title-word {
    font-size: 60rem;
    line-height: 70rem;
    font-weight: bolder;
    width: 60%;
}

.swiper-subtitle-word {
    font-size: 30rem;
    line-height: 40rem;
    width: 60%;
    margin-top: 20rem;
}

.position-absolute {
    position: absolute;
    bottom: 30rem;
}

.position-absolute div {
    color: #fff;
}

.future-container {
    max-width: 1600rem;
    min-width: 1200rem;
    overflow: hidden;
    margin: 60rem auto;
    padding: 0 20rem;
}

.future-container a {
    color: #999;
}

.future-container a:hover {
    color: #1c7430;
}

.tab-container {
    min-width: 1200rem;
    max-width: 1600rem;
    margin: 60rem auto;
    overflow: hidden;
}

.future-img img {
    width: 100% !important;
    display: block !important;
    border-radius: 10rem;
}

.future-simple-bg {
    width: 100%;
    min-width: 1200rem;
    margin: 0 auto;
    overflow: hidden;
    background-color: #f5f5f5;
}

.video-mask {
    display: none;
    position: fixed;
    top: 0rem;
    left: 0rem;
    width: 100%;
    height: 100%;
    z-index: 98;
    background-color: rgba(0, 0, 0, 0.5);
}

.future_video {
    width: 80%;
    margin: 0 auto;
}

.video-modal {
    width: 70%;
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99;
}

.video-modal .close {
    position: absolute;
    top: 0rem;
    right: 0rem;
    font-size: 20rem;
    color: red;
    width: 20rem;
    height: 20rem;
    font-weight: bold;
    text-align: center;
    line-height: 20rem;
    cursor: pointer;
    z-index: 100;
}

.web-nav {
    display: block;
}



.nav-one {
    margin-top: 150rem;
    width: 100%;
    padding: 0 160rem;
    box-sizing: border-box;
    display: flex;
    position: relative;
}

.nav-one-left {
    height: 640rem;
    width: 780rem;
}

.nav-one-border-left {
    width: 780rem;
    height: 640rem;
    position: relative;
}

.nav-one-border-left {
    width: 35rem;
    height: 35rem;
}

.nav-one-title {
    width: 100%;
    margin: 0rem auto;
    font-size: 40rem;
    font-weight: bolder;
}

.nav-one-content {
    width: 100%;
    margin: 90rem auto;
    font-size: 30rem;
    line-height: 40rem;
}

.nav-one-btn a {
    display: inline-block;
    padding: 10rem 20rem;
    font-size: 30rem;
    font-weight: bolder;
    line-height: 45rem;
    background-color: #279767;
    color: #FFF;
    border-radius: 40rem;
    cursor: pointer;
}
.nav-one-btn a:hover{
    text-decoration: none;
    color: #FFF;
}

.nav-one-right {
    width: 820rem;
    height: 640rem;
}

.nav-two {
    margin-top: 150rem;
    background-color: #f5f5f5;
    width: 100%;
    padding-left: 284rem;
    box-sizing: border-box;
    display: flex;
    align-items: center;
}

.nav-two-left {
    height: 303rem;
    width: 600rem;
}

.nav-two-right {
    height: 405rem;
    margin-left: 155rem;
}

.nav-two-line {
    margin: 47rem 0;
}

.nav-two-content {
    width: 100%;
    margin-top: 45rem;
    font-size: 30rem;
}

.tab_active {
    display: none;
}

.nav-three-title {
    width: 100%;
    text-align: center;
}

.nav-three-line {
    width: 10%;
    margin: 45rem auto;
}

.nav-three-content {
    width: 100%;
    margin: 0 auto;
    margin-top: 45rem;
    font-size: 30rem;
}

.nav-four {
    width: 100%;
    margin-top: 50rem;
    position: relative;
    top: 0;
    left: 0;
}

.tab-name {
    width: 186rem;
    height: 37rem;
    background: url(../images/chose_no_icon.png) no-repeat;
    margin-top: 26rem;
    text-align: center;
    color: #fff;
    line-height: 37rem;
    cursor: pointer;
    font-size: 23rem;
    font-weight: bolder;
}

.tab-name:hover {
    background: url(../images/chose_yes_icon.png) no-repeat;
}

.tab-texts {
    margin-top: 90rem;
}

.tab-img {
    width: 100%;
    overflow: hidden;
    text-align: center;
}

.tab-img-list {
    display: inline-block;
    width: 45%;
    margin-top: 10rem;
    margin-left: 10rem;
}

.tab-img-list img {
    width: 100%;
    border-radius: 10rem;
}

.nav-three {
    width: 80%;
    margin: 0 auto;
}

.nav-four-img1 {
    position: absolute;
    width: 508rem;
    height: 529rem;
    top: 0;
    right: 703rem;
}

.nav-four-img2 {
    position: absolute;
    width: 509rem;
    height: 318rem;
    top: 0;
    right: 160rem;
}

.nav-four-img3 {
    position: absolute;
    width: 508rem;
    height: 602rem;
    top: 563rem;
    right: 703rem;
}

.nav-four-img4 {
    position: absolute;
    width: 509rem;
    height: 612rem;
    top: 352rem;
    right: 160rem;
}

.nav-four-text {
    width: 500rem;
    height: 435rem;
    position: absolute;
    left: 160rem;
    top: 496rem;
}

.nav-four-text-title {
    font-size: 42rem;
    font-weight: bolder;
}

.nav-four-line {
    width: 100%;
    border: 2rem solid #222;
    box-sizing: border-box;
}

.nav-four-content1 {
    font-size: 25rem;
    margin: 90rem 0;
}

.nav-four-content2 {
    font-size: 25rem;
}

.nav-four-border-right {
    position: absolute;
    width: 35rem;
    height: 35rem;
    right: 160rem;
    bottom: 0;
}

.nav-five {
    margin-top: 150rem;
    width: 100%;
    height: 1190rem;
    background-color: #f5f5f5;
    padding: 0 160rem;
}

.nav-five-top {
    height: 197rem;
    padding-top: 25rem;
    box-sizing: border-box;
}

.nav-five-top-title {
    position: relative;
    width: 100%;
    text-align: center;
    font-size: 60rem;
    font-weight: bolder;
    margin-bottom: 30rem;
}

.nav-five-top-content {
    position: absolute;
    top: 0;
    right: 0;
    line-height: 90rem;
    font-size: 30rem;
}

.nav-five-bottom {
    width: 100%;
    height: 993rem;
    display: flex;
    justify-content: space-around;
}

.nav-five-bottom-left {
    width: 520rem;
    background-color: #fff;
    padding: 0 10rem;
    box-sizing: border-box;
    height: 750rem;
}

.nav-five-bottom-middle {
    width: 520rem;
    padding: 0 10rem;
    box-sizing: border-box;
}

.nav-five-bottom-middle-bottom {
    height: 750rem;
    width: 520rem;
    background-color: #fff;
    padding: 0 10rem;
    box-sizing: border-box;
    margin-top: 20rem;
}

.nav-five-bottom-middle-top {
    height: 113rem;
    width: 2rem;
    background-color: black;
    margin: 0 auto;
}

.nav-five-bottom-right {
    width: 520rem;
    background-color: #fff;
    padding: 0 10rem;
    box-sizing: border-box;
    height: 750rem;
}

.nav-five-bottom-left-img {
    width: 500rem;
    height: 387rem;
}

.tab-right {
    text-align: right;
}

.cancel-margin {
    margin-top: 0 !important;
}

.nav-five-bottom-left-title {
    font-size: 20rem;
    font-weight: bolder;
    box-sizing: border-box;
    margin-top: 20rem;
}

.nav-new-line {
    margin: 30rem 15rem;
}

.nav-five-bottom-left-content {
    font-size: 18rem;
}

.future-news-img img {
    width: 100%;
    max-height: 300rem;
    border-radius: 10rem;
}

.future-news-title {
    padding: 0 10rem;
    margin: 20rem 0 10rem 0;
    font-size: 24rem;
    font-weight: bold;
    line-height: 30rem;
}

.future-news-content {
    padding: 0 10rem;
    font-size: 18rem;
    padding-bottom: 20rem;
}

.future-news-content a {
    color: #333;
}

.future-news-bg {
    width: 100%;
    min-height: 560rem;
    background-color: #fff;
}

/* .future-news-list .future-news-item:nth-child(2){
    padding-top: 100rem;
    background: url(../images/vertical_icon.png) top center no-repeat;
} */



.future-news-link {
    padding: 10rem 15rem;
    margin-top: 20rem;
    font-size: 20rem;
    font-weight: bolder;
    line-height: 30rem;
    cursor: pointer;
}

.nav-sex {
    width: 100%;
    padding: 0 160rem;
    box-sizing: border-box;
    margin-top: 150rem;
    display: flex;
    justify-content: space-between;
}

.nav-sex-left {
    width: 780rem;
}

.nav-sex-left span {
    font-size: 20rem;
    color: #858585;
}

.left-box {
    width: 80%;
    border: 1rem solid #ccc;
    box-sizing: border-box;
    border-radius: 10rem;
    line-height: 70rem;
    padding: 0 10rem;
}

.verification {
    margin: 30rem 0;
}

.verification span {
    line-height: 35rem;
}

.verification {
    border: 0;
}

.codeimg {
    height: 34rem;
    padding: 0;
    margin: 0;
    display: block;
}

.input-width {
    width: 100%;
    border: none;
    outline: none;
    font-size: 20rem;
}


.textarea-width {
    width: 100%;
    outline: none;
    border-color: #ccc;
    border-radius: 10rem;
    font-size: 20rem;
    height: 133rem;
}


.nav-sex-title {
    font-size: 28rem;
    font-weight: bolder;
    margin-bottom: 20rem;
    color: #696969;
}


.nav-sex-right-middle {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.nav-sex-right-input {
    height: 70rem;
    align-items: center;
    display: flex;
}

.nav-sex-right-input input {
    width: 100%;
    height: 70rem;
    outline: none;
    border: none;
    font-size: 20rem;
}

.nav-sex-right-input-img {
    display: inline-block;
    width: 44rem;
    height: 44rem;
}

.nav-sex-right-input-name {
    display: inline-block;
    margin-left: 20rem;
    font-size: 20rem;
    color: #858585;
}

.nav-sex-right-middle-line {
    width: 100%;
    height: 1rem;
    background-color: #ccc;
}

.nav-sex-right-bottom {
    width: 80%;
    box-sizing: border-box;
    margin-top: 30rem;
}

.nav-sex-right-bottom-img {
    width: 71rem;
    height: 71rem;
    cursor: pointer;
}

.nav-sex-right-bottom {
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.first {
    background-image: url(../images/youtube_no_icon.png);
}

.first:hover {
    background-image: url(../images/youtube_yes_icon.png);
}

.second {
    background-image: url(../images/tu_no_icon.png);
}

.second:hover {
    background-image: url(../images/tu_yes_icon.png);
}

.third {
    background-image: url(../images/face_no_icon.png);
}

.third:hover {
    background-image: url(../images/face_yes_icon.png);
}

.fourth {
    background-image: url(../images/bried_no_icon.png);
}

.fourth:hover {
    background-image: url(../images/bried_yes_icon.png);
}

.nav-seven {
    margin-top: 45rem;
    width: 80%;
}


#exampleInput,
#fileInput
{
    height: 35rem;
    border: 2px rgb(157, 144, 161) solid;
}

#fileInput4
{
    height: 35rem;
    border: 2px rgb(157, 144, 161) solid;
}

.nav-seven button {
    width: 241rem;
    height: 45rem;
    color: #FFF;
    font-size: 24rem;
    font-weight: bolder;
    background-color: #279767;
    border: none;
    outline: none;
    cursor: pointer;
    border-radius: 10rem;
}

.footer {
    /* padding-top: 80rem; */
    line-height: 130rem;
    box-sizing: border-box;
    margin-top: 20rem;
    width: 100%;
    background-image: url(../images/foot_bg.png);
    background-size: 100% 100%;
    height: 130rem;
}

.footer-text {
    font-size: 20rem;
    color: white;
    text-align: center;
}

.app-container {
    width: 100%;
    padding: 0;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    margin-top: 115rem;
}

.app_bg_1 {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    background-color: #f5f5f5;
}

.app_img_1 {
    width: 100%;
    margin: 50rem auto;
    text-align: center;
}

.app_title_1 {
    width: 100%;
    font-family: Arial;
    font-size: 45rem;
    line-height: 60rem;
    text-align: left;
    margin-top: 200rem;
    font-weight: bold;
}

.app_description_1 {
    width: 100%;
    font-family: Arial;
    font-size: 25rem;
    line-height: 40rem;
    text-align: left;
}

.app_link_1 {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    width: 100%;
    margin-top: 100rem;
    overflow: hidden;
}

.app_link_1 a {
    display: block;
    width: 33%;
    float: left;
    /* margin-right: 20rem; */
    cursor: pointer;
}

.app_link_1 a img {
    width: 100%;
}

.app_img_2 {
    width: 90%;
    margin: 50rem auto;
}

.app_img_2 img {
    width: 100%;
}

.app_img_3 {
    width: 75%;
    margin: 50rem auto;
}

.app_img_3 img {
    width: 100%;
}

.app_title_2 {
    width: 100%;
    font-size: 40rem;
    line-height: 60rem;
    text-align: left;
    margin-top: 200rem;
    font-weight: bold;
}

.app_description_2 {
    width: 100%;
    font-family: Arial;
    font-size: 25rem;
    line-height: 40rem;
    text-align: left;
}

.app_title_3 {
    width: 100%;
    font-size: 40rem;
    line-height: 60rem;
    text-align: left;
    margin-top: 100rem;
    font-weight: bold;
}

.app_description_3 {
    width: 100%;
    font-size: 25rem;
    line-height: 40rem;
    text-align: left;
}

.app_img_list {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    width: 100%;
    overflow: hidden;
    margin-top: 20rem;
}

.app_small_img {
    width: 30%;
    /* float: left; */
    margin-right: 10rem;
}

.app_small_img img {
    width: 100%;
}

.app_img_4 {
    width: 90%;
    margin: 50rem auto;
}

.app_img_4 img {
    width: 100%;
}

.app_title_4 {
    width: 100%;
    font-size: 40rem;
    line-height: 60rem;
    text-align: left;
    margin-top: 150rem;
    font-weight: bold;
}

.app_description_4 {
    width: 100%;
    font-size: 25rem;
    line-height: 40rem;
    text-align: left;
}

.app_img_5 {
    width: 50%;
    margin: 50rem auto;
}

.app_img_5 img {
    width: 100%;
}

.app_title_5 {
    width: 100%;
    font-size: 40rem;
    line-height: 60rem;
    text-align: left;
    margin-top: 150rem;
    font-weight: bold;
}

.app_description_5 {
    width: 100%;
    font-size: 25rem;
    line-height: 40rem;
    text-align: left;
}

.app_img_6 {
    width: 50%;
    margin: 50rem auto;
}

.app_img_6 img {
    width: 100%;
}

.app_title_6 {
    width: 100%;
    font-size: 40rem;
    line-height: 60rem;
    text-align: left;
    margin-top: 150rem;
    font-weight: bold;
}

.app_description_6 {
    width: 100%;
    font-size: 25rem;
    line-height: 40rem;
    text-align: left;
}

.app_img_7 {
    width: 100%;
    margin: 50rem auto;
}

.app_img_7 img {
    width: 100%;
}

.app_title_7 {
    width: 100%;
    font-size: 40rem;
    line-height: 60rem;
    text-align: left;
    margin-top: 150rem;
    font-weight: bold;
}

.app_description_7 {
    width: 100%;
    font-size: 25rem;
    line-height: 40rem;
    text-align: left;
}

.app_img_8 {
    margin: 50rem auto;
}

.app_img_8 img {
    width: 100%;
}

.app_title_8 {
    width: 100%;
    font-size: 40rem;
    line-height: 60rem;
    text-align: left;
    margin-top: 150rem;
    font-weight: bold;
}

.app_description_8 {
    width: 100%;
    font-size: 25rem;
    line-height: 40rem;
    text-align: left;
}

.app_content {
    position: absolute;
    bottom: 60rem;
    right: -380rem;

}

.app_bj_8 {
    background: #0b2e13;
    border-radius: 10rem;
    color: #fff;
    opacity: 0.5;
}

.app_content_list {
    font-size: 25rem;
    line-height: 40rem;
    text-align: left;
}

.app_content_list li {
    margin: 10rem;
}

.app_content_list li span {
    background: #1c7430;
    border-radius: 100rem;
    box-shadow: 1rem 2rem 2rem #fff;
}

.app-content{
    width: calc(100vw - 400rem);
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-around;
}

.app-content-item img{
    max-width: 100%;
}
.app-content-item-description{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 30rem;
    box-sizing: border-box;
}
.app-content-item-button{
    width: 300rem;
    padding: 15rem 40rem;
    background-color: #3D3F4F;
    color: #fff;
    border-radius: 999rem;
    font-weight: bold;
    font-size: 35rem;
    white-space: nowrap;
    text-align: center;
    margin-top: 60rem;
}
.review-info {
    width: 40%;
    margin: 30rem auto;
}

.review-title {
    font-size: 40rem;
    line-height: 60rem;
    text-align: center;
    font-weight: bold;
}

.review-decription {
    font-size: 40rem;
    line-height: 60rem;
    text-align: center;
    font-weight: bold;
}

.review-line {
    width: 30%;
    border: 1rem solid #000;
    margin: 10rem auto;
}

.reveiw_list {
    width: 100%;
    margin: 10rem auto;
    display: flex;
    flex-wrap: wrap;
}

.reveiw_list li {
    width: 22%;
    margin: 10rem;
}

.review_content_img {
    width: 100%;
}

.review_content_img img {
    width: 100%;
}

.review_content_img p {
    width: 100%;
    color: #000;
    background-color: #1c7430;
    color: #fff;
    padding: 40rem 10rem;
    font-size: 16rem;
    font-weight: bold;
}

.review_content_name {
    padding: 5rem;
    font-size: 20rem;
    font-weight: bold;
}

.review_content_other {
    padding: 5rem;
    font-size: 16rem;
    color: #666;
}

.pc-show {
    display: block;
}

.phone-show {
    display: none;
}

.phone-nav {
    display: none;
    position: fixed;
    top: 0rem;
    left: 0rem;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 98;
    color: white;
}

.phone-nav-content {
    display: none;
    position: fixed;
    top: 0rem;
    left: 0rem;
    width: 375rem;
    height: 100%;
    background-color: #279767;
    padding: 20rem;
    z-index: 99;
}



.swiper-content-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
}

.swiper-content-list .swiper-content-img {
    width: calc((100% - 40rem)/2);
    margin: 10rem;
}

.swiper-content-list .swiper-content-img img {
    width: 100%;
    border-radius: 10rem;
}

.swiper-content-pagination {
    display: flex;
    justify-content: center;
    margin-bottom: 60rem;
}

.swiper-content-pagination .swiper-pagination-bullet {
    width: auto;
    height: auto;
    border-radius: 8rem;
    font-size: 30rem;
    line-height: 45rem;
    border: 1rem solid #279767;
    color: #279767;
    background-color: white;
    padding: 2rem 30rem;
    margin: 0 20rem !important;
    opacity:1;
}
.swiper-content-pagination .swiper-pagination-bullet:hover{
    color: white;
    background-color: #279767;
}

.swiper-content-pagination .swiper-pagination-bullet-active {
    color: white;
    background-color: #279767;
}

.contact-container{
    margin-top:50rem ;
}
.app-pc{
    width: 100%;
    display: block;
}
.app-mobile{
    display: none;
}
@media (max-width: 845px) {
    .app-container{
        padding: 0;
        margin: 0;
    }
    .app-pc{
        display: none;
    }
    .app-mobile{
        display: block;
    }
    .occupy-box {
        width: 100%;
        height: 70rem;
    }

    .pc-show {
        display: none;
    }

    .phone-show {
        display: block;
    }

    /* .navbar-inverse {
        padding: 10rem 0;
    } */

   /*  .navbar-inverse .container {
        width: 100%;
    }
 */
    .navbar-header {
        width: 50%;
        float: left;
    }
/* 
    .search-box form {
        margin: 15rem 0;
    } */

    .nav-login {
        margin-top: 0rem;
    }

    .swiper-container-horizontal {
        min-width: 100%;
    }

    .navbar-brand {
        width: 60rem;
        padding: 0;
        margin: 0 15rem;
    }

    /* #top-navbar-1 {
        background: none;
        border: 0;
    } */

    #navigation {
        background: none;
        border: none;
        margin: 0;
        padding: 0;
    }

    #navbar-right {
        background-color: #222 !important;
        border: 1rem solid #222 !important;
        margin: 0 -15rem;
    }

    .navbar-toggle {
        background: #ccc;
    }

    .rotation-img {
        width: 100%;
        height: 321rem;
    }

    .future_video {
        width: 100%;
    }

    .nav-one {
        margin: 0;
        margin-top: 30rem;
        width: 100%;
        padding: 0;
        box-sizing: border-box;
        display: flex;
        position: relative;
    }

    .nav-one-left {
        height: auto;
    }

    .nav-one-left-bottom {
        position: absolute;
        top: 285rem;
        width: 100%;
        padding: 0 10rem;
    }

    .nav-one-title {
        font-size: 28rem;
        width: 100%;
    }

    .future-news-list .future-news-item:nth-child(2) {
        padding-top: 0;
        background: none;
    }

    .nav-one-right {
        height: 300rem;
        width: 100%;
        padding-left: 30rem;
        box-sizing: border-box;
    }

    .nav-one-right img {
        width: 100%;
        height: 100%;
    }

    .nav-one-left {
        width: 13%;
    }

    .nav-one-content {
        width: 100%;
        font-size: 16rem;
        line-height: 20rem;
    }

    .nav-one-content {
        margin: 30rem auto;
    }

    .future-img {
        margin-top: 20rem;
        padding: 0;
    }

    .nav-two {
        position: relative;
        top: 295rem;
        margin-top: 0;
        height: 500rem;
        width: 100%;
    }

    .nav-two-right {
        position: absolute;
        top: 0;
        left: 0;
        padding: 0 10rem;
        box-sizing: border-box;
        width: 100%;
        margin-left: 0;
        height: auto;
    }

    .nav-two-left {
        position: absolute;
        top: 180rem;
        left: 0;
        padding: 0 10rem;
        box-sizing: border-box;
        width: 100%;
    }

    .nav-two-left img {
        width: 100%;
        height: 100%;
    }

    .nav-two-title {
        margin-top: 30rem;
    }

    .nav-two-content {
        width: 100%;
        font-size: 16rem;
    }

    .nav-two-line {
        margin: 20rem 0;
    }

    .nav-three {
        width: 100%;
        padding: 0 10rem;
        box-sizing: border-box;
        height: auto;
    }

    .nav-three-title {
        font-size: 28rem;
    }

    .nav-three-content {
        width: 100%;
        font-size: 16rem;
    }

    .nav-three-line {
        margin: 20rem auto;
    }

    .nav-four {
        margin-top: 20rem;
        height: 790rem;
    }

    .nav-four-switch {
        width: 30%;
        margin-top: 0;
        position: absolute;
        left: 245rem;
    }

    .nav-four-name {
        width: 100%;
        background-size: 100% 100%;
        margin-top: 10rem;
        font-size: 14rem;
        line-height: 20rem;
        height: 20rem;
    }

    .nav-four-text {
        width: 61%;
        position: absolute;
        top: 0;
        left: 0;
        padding-left: 10rem;
        box-sizing: border-box;
        height: auto;
    }

    .nav-four-text-title {
        width: 100%;
        font-size: 28rem;
    }

    .nav-four-line {
        width: 100%;
    }

    .nav-four-content1 {
        margin: 30rem 0;
        font-size: 20rem;
    }

    .nav-four-content2 {
        font-size: 20rem;
    }

    .nav-four-imgs {
        width: 100%;
        padding: 0 10rem;
        box-sizing: border-box;
        height: 600rem;
        position: absolute;
        top: 180rem;
    }

    .nav-four-img1 {
        width: 42%;
        height: 300rem;
        position: absolute;
        right: 208rem;
    }

    .nav-four-img1 img {
        width: 100%;
        height: 100%;
    }

    .nav-four-img2 {
        position: absolute;
        right: 10rem;
        width: 50%;
        height: 250rem;
    }

    .nav-four-img2 img {
        width: 100%;
        height: 100%;
    }

    .nav-four-img3 {
        position: absolute;
        right: 208rem;
        top: 310rem;
        width: 40%;
        height: 300rem;
    }

    .nav-four-img3 img {
        width: 100%;
        height: 100%;
    }

    .nav-four-img4 {
        position: absolute;
        right: 10rem;
        top: 260rem;
        width: 50%;
        height: 250rem;
    }

    .nav-four-img4 img {
        width: 100%;
        height: 100%;
    }

    .nav-four-border-right {
        position: absolute;
        right: 10rem;
    }

    .nav-five {
        width: 100%;
        margin-top: 40rem;
        padding: 0 10rem;
        box-sizing: border-box;
        position: relative;
    }

    .nav-five-top {
        width: 100%;
    }

    .nav-five-top-title {
        width: 100%;
        font-size: 28rem;
        text-align: left;
    }

    .nav-five-top-content {
        margin-top: 15rem;
    } 

    .nav-five-bottom-middle-top {
        position: absolute;
        left: 50%;
        margin-left: -1rem;
        top: 135rem;
        height: 70rem;
    }

    .nav-five-bottom {
        overflow: hidden;
        height: auto;
        width: 100%;
        padding-left: 2%;
        box-sizing: border-box;
        word-break: break-all;
    }

    .nav-five-bottom-left {
        width: 47%;
        margin-right: 2%;
        float: left;
    }

    .nav-five-bottom-middle {
        width: 47%;
        margin-right: 2%;
        float: left;
    }

    .nav-five-bottom-right {
        width: 47%;
        margin-right: 2%;
        float: left;
    }

    .nav-five-bottom-middle-bottom {
        width: 100%;
    }

    .nav-five-bottom-left-img {
        width: 100%;
    }

    .nav-five-bottom-left-img img {
        width: 100%;
        height: 100%;
    }

    .swiper-button-prev {
        display: none;
    }

    .swiper-button-next {
        display: none;
    }

    .swiper-title-word {
        width: 100%;
        font-size: 32rem;
        line-height: 40rem;
    }

    .swiper-subtitle-word {
        width: 100%;
        font-size: 16rem;
        line-height: 20rem;
        margin: 0;
    }

    .position-absolute {
        position: absolute;
        bottom: 10rem;
    }

    .tab-container {
        width: 100%;
        max-width: 100%;
        min-width: 100%;
    }

    .tab-container,
    .future-container {
        width: 100%;
        max-width: 100%;
        min-width: 100%;
        margin: 40rem auto;
        padding: 0 20rem;
    }

    .future-simple-bg {
        min-width: 100%;
    }

    .app_title_1 {
        margin-top: 10rem;
        font-size: 28rem;
        line-height: 36rem;
    }

    .app_link_1{
        margin-top: 10rem;
        margin-bottom: 10rem;
    }

    .app_description_1{
        font-size: 16rem;
        line-height: 20rem;
        margin: 30rem 0;
    }

    .app_title_2 {
        margin-top: 10rem;
        font-size: 28rem;
        line-height: 36rem;
    }

    .app_description_2{
        font-size: 16rem;
        line-height: 20rem;
        margin: 20rem 0;
    }

    .app_title_3 {
        margin-top: 10rem;
        font-size: 28rem;
        line-height: 36rem;
    }

    .app_description_3{
        font-size: 16rem;
        line-height: 20rem;
        margin: 20rem 0;
    }

    .app_title_4 {
        margin-top: 10rem;
        font-size: 28rem;
        line-height: 36rem;
    }

    .app_description_4{
        font-size: 16rem;
        line-height: 20rem;
        margin: 20rem 0;
    }

    .app_title_5 {
        margin-top: 10rem;
        font-size: 28rem;
        line-height: 36rem;
    }

    .app_description_5{
        font-size: 16rem;
        line-height: 20rem;
        margin: 20rem 0;
    }

    .app_title_6 {
        margin-top: 10rem;
        font-size: 28rem;
        line-height: 36rem;
    }

    .app_description_6{
        font-size: 16rem;
        line-height: 20rem;
        margin: 20rem 0;
    }

    .app_title_7 {
        margin-top: 10rem;
        font-size: 28rem;
        line-height: 36rem;
    }

    .app_description_7{
        font-size: 16rem;
        line-height: 20rem;
        margin: 20rem 0;
    }

    .app_content {
        bottom: 0rem;
        right: 0rem;
    }

    .app_title_8 {
        margin-top: 10rem;
        font-size: 28rem;
        line-height: 36rem;
    }

    .app_description_8{
        font-size: 16rem;
        line-height: 20rem;
        margin: 20rem 0;
    }
    .app_img_8{
        margin: 20rem auto;
    }

    .app_content_list {
        font-size: 12rem;
        line-height: 20rem;
    }

    .review-info {
        width: 100%;
    }

    .reveiw_list li {
        width: 70%;
    }

    .tab-names {
        padding-left: 0rem;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-evenly;
        align-items: center;
    }


    .nav-seven {
        margin: 30rem 0;
        width: 100%;
        text-align: center;
    }

    .nav-sex-right-bottom {
        width: 100%;
    }

    .web-nav {
        display: none;
    }

    .news-theme{
        font-size: 30rem;
        line-height: 36rem;
        padding: 0;
        padding-top:30rem;
    }
    .news-title{
        font-size: 28rem;
        line-height: 36rem;
    }

    .phone-nav-content .nav-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 120rem;
        margin-bottom: 60rem;
    }

    .phone-nav-content .nav-header .close-nav {
        width: 30rem;
        height: 30rem;
        font-size: 40rem;
        color: white;
        line-height: 30rem;
        text-align: center;
        cursor: pointer;
    }

    .phone-nav-content .nav-main {
        padding-left: 0rem;
        list-style: none;
    }

    .phone-nav-content .nav-main li {
        padding: 10rem 0;
    }

    .phone-nav-content .nav-main .nav-item {
        display: block;
        color: white;
        font-size: 30rem;
        line-height: 30rem;
        text-decoration: none;
    }

    .phone-nav-content .nav-line {
        height: 1rem;
        background-color: #fff;
        margin: 30rem 0;
    }

    .phone-nav-content .nav-button {
        width: 100%;
        border-radius: 50rem;
        height: 50rem;
        font-size: 22rem;
        font-weight: bold;
        color: #279767;
        border: none;
        background-color: white;
    }
      /* 手机端按钮表单 */
      .phone-nav-content .right{
        width: 100%;
        height: 34px;
        line-height: 34px;
        text-align: center;
        font-weight: 600;
        background-color: rgb(46,211,155);
        border-radius: 20px;
    }
    .phone-nav-content .right .btn{
        width: 100%;
        height: 100%;
        border-radius: 20px;
        /* font-size: 20rem; */
        background-color: rgb(46,211,155);
        border: 0;
        font-weight: 600;
    }

    .nav .right .btn:focus {
        border: 0;
        outline: none;
    }


    .video-modal {
        width: 80%;
    }

    .navbar-brand img {
        height: 50rem;
        margin-left: 30rem;
    }

    .future-news-img img {
        max-height: none;
    }

    .tab-name {
        margin: 0 30rem;
        margin-top: 26rem;
    }

    .swiper-content-list .swiper-content-img {
        width: 100%;
    }

    .swiper-content-pagination .swiper-pagination-bullet {
        border-radius: 5rem;
        font-size: 16rem;
        padding: 3rem 10rem;
        margin: 0 5rem !important;
    }
}


@media (max-width: 845px) {
    .header-search{
        width:200rem;
        display: block;
    }
    .header-search .logo-wrap .logo{
        width:50rem;
    }
    .reason-intro-wrap {
        width: calc(100vw - 20rem);
        padding: 24rem 0 0 0;
    }
    .para-title {
        margin-bottom: 15rem;
        font-size: var(--mobile-title) !important;
        font-weight: bold;
        padding: 10rem;
        margin-bottom: 0;
    }
    .para-content {
        font-size: var(--mobile-content) !important;
    }
    .mode-wrap {
        width: calc(100vw - 20rem);
        margin: 0 auto;
        padding: 0;
    }
    .fs-30{
        font-size: 15rem;
    }
    .watering-duration-wrap {
        width: calc(100vw - 20rem);
    }
    .img-wrap {
        width: calc(100vw - 20rem);
    }
    .watering-duration-wrap .img-wrap .drop-img {
        width: 135rem;
        bottom: -30rem;
        right: -24rem;
    }
    .weather-genius-wrap {
        width: 100%;
    }
    .weather-genius-wrap-bottom {
        display: flex;
        flex-direction: column-reverse;
        background-color: transparent;
        height: auto;
        padding: 0;
        border-radius: 0;
    }
    .weather-genius-wrap-bottom-right {
        padding: 10rem;
        box-sizing: border-box;
        font-size: var(--mobile-content) !important;
        margin-bottom: 10rem;
    }
    .weather-genius-wrap .para-title {
        font-weight: normal;
        padding: 0 10rem;
        box-sizing: border-box;
        margin-bottom: 10rem;
    }
    .et-master-wrap {
        width: calc(100vw - 20rem);
        padding: 10rem 0;
    }
    .water-save-tech {
        width: calc(100vw - 20rem);
        padding: 10rem 0;
    }
    .product-history{
        width: calc(100vw - 20rem);
    }
    .learn-link {
        margin-top: 0;
        font-size: 15rem;
    }
    .product-history2 {
        width: 100vw;
        padding: 10rem 0;
        /*display: grid;*/
        /*grid-template-columns: 1fr 1fr 1fr;*/
        /*column-gap: 16rem;*/
    }
    
    .product-history2 .rate-item > img {
        margin-bottom: 8rem;
    }
    
    .product-history2 .rate-item-title {
        font-size: 7rem;
        font-weight: bold;
        margin-bottom: 6rem;
    }
    
    .product-history2 .rate-item-content {
        font-size: 5rem;
        text-align: center;
    }
    
    .product-history2 .rate-item .rate-icon {
        width: 32rem;
    }
    
    .product-history2 .rate-item .support-icon {
        width: 27rem;
    }
    
    .product-history2 .rate-item .free-icon {
        width: 26rem;
    }
      
    
}