@charset "utf-8";

@font-face {font-family: 'Open Sans'; font-weight: 600; src: url("https://img.tmotor.com/font/OpenSans/Semibold/OpenSans-Semibold.eot");src: url("https://img.tmotor.com/font/OpenSans/Semibold/OpenSans-Semibold.woff") format("woff"), url("https://img.tmotor.com/font/OpenSans/Semibold/OpenSans-Semibold.ttf") format("truetype"), url("https://img.tmotor.com/font/OpenSans/Semibold/OpenSans-Semibold.svg") format("svg")}

.f60{ font-size: clamp(50px, 3vw, 65px);}
.f30{ font-size: 30px; line-height: initial;}
.f28{ font-size: 28px; line-height: initial;}
.f24{ font-size: 24px; line-height: initial;}
.f20{ font-size: 20px; line-height: initial;}


.pic_auto {position: relative; width: 100%; height: 0; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0; display: flex;}
.pic_auto .pic{height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; position: absolute; }

.section1 .container, .section2 .container, .section3 .container, .section4 .container { max-width: 1240px; min-width: auto; width: 100%; color: #000;  position: absolute; padding: 0 20px ; display: flex; flex-direction: column; align-items: center; z-index: 1;}
.section1 .container h3, .section2 .container h3, .section3 .container h3, .section4 .container h3{text-transform: uppercase; text-align: center; letter-spacing: -0.02em; line-height: 1.2em; margin-top: 3.6vw; margin-bottom: 2vw; font-weight: 700;}

.section1, .section2, .section3, .section4 {display: flex; flex-wrap: wrap; justify-content: center; background-color: #fff; position: relative;}

.section1 .pic_auto{padding-bottom: calc(100% * 900 / 1920); }
.section1 .text {display: flex; justify-content: space-between; margin-top: -2vw; width: 100%;}
.section1 .text div{width: 30%;}
.section1 .text div:last-child{padding-top: 1vw; text-align: right;}
.section1 .text div img{max-width: 65% !important; margin-bottom: 1vw;}

.section2 .container{position: relative;}
.section2 h3{ margin-bottom: 0.5vw;}
.section2 p { text-align: center;}
.section2 .test_chart{ display: flex;}
.section2 .test_chart img{ max-width: 100%;}
.section2 p.f20 {width: 60%; color: #e73838; padding-bottom: 1vw;}

.section3 .pic_auto{padding-bottom: calc(100% * 950 / 1920); }
.section3 h3{ margin-bottom: 0.5vw;}
.section3 p {text-align: center;}

.section4 {padding-bottom: 7vh;}
.section4 .container{ position: relative;}
.section4 h3 { width: 100%; display: flex; justify-content: space-between; align-items: center; padding-top: 2vh; padding-bottom: 2vh;}
.section4 h3 p{font-weight: 700;}
.section4 h3 p picture { padding-right: 20px }
.section4 h3 p:last-child { display: flex; text-align: left; align-items: center; line-height: 1.2em;}
.section4 .table_1{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); width: 100%; border-top: 1px solid #cccdce; border-bottom: 1px solid #dadbdc; padding-top: calc(1.5vh + 1vw);}
.section4 dl { text-transform: capitalize; border-bottom: 1px solid #dadbdc; margin-bottom: -1px; line-height: 1.7em; padding: calc(1.5vh + 1.5vw) 0;}
.section4 dl dt{ color:#616263; }
.section4 dl dd{ font-weight: 600; margin: 0;}

.section4 .table_2{ display: flex; width: 100%;}
.section4 .table_2 img{max-width: 100%; margin-top: calc(1vh + 1vw); margin-bottom: calc(.5vh + .5vw);}
.section4 .table_2 ul:first-child{width: 75%; display: flex; flex-wrap: wrap; justify-content: space-between; text-align: center;}
.section4 .table_2 ul:first-child li{width: 50%;}
.section4 .table_2 ul:first-child li:nth-child(odd){text-align: left;}
.section4 .table_2 ul:first-child li:nth-child(odd) p{padding-right: 18%; text-align: center;}
.section4 .table_2 ul:first-child li:nth-child(even) p{padding: 0 5%;}
.section4 .table_2 ul:last-child{width: 25%;}
.section4 .table_2 ul:last-child li {text-align: center; padding-left: 25%;}
.section4 .table_2 p{font-weight: 600;}



@media screen and (max-width: 1920px) {
    .f60{ font-size: 60px;}
}


@media screen and (max-width: 1440px) {
    .f60{ font-size: clamp(31px, 4.2vw, 65px);}
    .f30{ font-size: 26px;}
    .f28{ font-size: 24px;}
    .f24{ font-size: 20px;}
    .f20{ font-size: 18px;}

    .section1 .pic_auto{padding-bottom: calc(100% * 810 / 1440);}
    .section1 .text div:last-child{padding-top: 0;}
    .section1 .container{position: relative;}
    .section1 .container h3, .section2 .container h3, .section3 .container h3, .section4 .container h3{ margin-top: 8vw; margin-bottom: 2vw;}
    .section1 .text{margin-top: 0; margin-bottom: -20%; justify-content: space-around; }

    .section3 .pic_auto{padding-bottom: calc(100% * 950 / 1440); }
}


@media screen and (max-width: 940px) {

    .f30{ font-size: 24px;}
    .f28{ font-size: 22px;}
    .f24{ font-size: 18px;}
    .f20{ font-size: 16px;}
    .section2 .test_chart{margin: 1vh auto;}
    .section1 .container, .section3 .container{position: relative;}
    .section1 .pic_auto{ margin-top: -10vh;}
    .section1 .text { margin-bottom: 0;}

}
@media screen and (max-width: 768px) {

    .section4 .hidden-mob{ display: none; visibility: hidden;}

    .f30{ font-size: 16px;}
    .f28{ font-size: 16px;}
    .f24{ font-size: 14px;}
    .f20{ font-size: 14px;}

    .section1 .container, .section2 .container, .section3 .container, .section4 .container {position: relative;}
    .section4 .table_1 { grid-template-columns: repeat(2, minmax(0px, 1fr));}
    .section1 h3, .section2 h3, .section3 h3{ margin-top: 6vh; margin-bottom: 2vh;}
    .section1 .text{margin-top: 0;}
    .section1 .pic_auto { margin-top: -5vh;}
    .section2 p.f20{width: 100%; font-size: 12px;}
    .section1 .text div{width: 45%;}
    .section2 .test_chart { flex-direction: column; }
    
    .section4 .table_2 { flex-direction: column; }

    .section4 .container .table_2 ul{width: 100%;}

    .section4 .table_2 ul:last-child{ display: flex;}
    .section4 .table_2 ul:last-child li{padding-left:0}

    .section1 .container, .section2 .container, .section3 .container, .section4 .container {padding: 0 10px;}
}

[lang="zh-CN"] .section1 .text {margin-top: 0}
[lang="zh-CN"] section h3 {letter-spacing: 0.01em;}

@media screen and (min-width: 1023px) {
.w940 { width:100%; margin: 0 auto;}

.w940 .f60{ font-size: 44px;}
.w940 .f30{ font-size: 24px;}
.w940 .f28{ font-size: 22px;}
.w940 .f24{ font-size: 18px;}
.w940 .f20{ font-size: 16px;}

.w940 .section1 .pic_auto{padding-bottom: calc(100% * 810 / 1440); margin-top: -10vh;}
.w940 .section1 .text{margin-top: 0; justify-content: space-around;}
.w940 .section1 .text div:last-child{padding-top: 0;}
.w940 section h3 { margin-top: 8%; margin-bottom: 2%;}
.w940 .section1 .text div img{max-width: 65%;}
.w940 .section2 .test_chart{margin: calc(1vh + 1vw) auto;}
.w940 .section3 .pic_auto{padding-bottom: calc(100% * 950 / 1440); }

.w940 .section1 .container, .w940 .section3 .container{position: relative;}
}


#a_news11 img{width: auto; margin-left: 0} 
#a_news11 .pic_auto .pic{width: 100%;}
.ui-detail section img{display: inline-block;}

#product_desc{padding: 0;}
#product_desc img { width: 100% !important; margin-left: 0;}  
#product_desc section .container, .goods li {box-sizing: border-box;}