/*HOME标题*/
.home-title {
    padding:0 0 0.6rem 0;
}
.home-title h6 {
    font-size: var(--fs70);
    color: #000;
    font-family: "MiSans-Regular";
}
.home-title h3 {
    font-size: var(--fs18);
    color: #333;
    line-height: 1.8;
    padding:0.4rem 0 0 0;
}
.home-title p {
    font-size: var(--fs16);
    color: #777;
    line-height: 1.8;
    margin: 0 0 00.3rem 0;
}
@media screen and (max-width:1024px){
.home-title {
    margin: 0.3rem 0;
    padding: 0;
}
.home-title h6 {

}
.home-title h3 {
    font-size: var(--fs14);
    padding:0.2rem 0 0 0;
}
.home-title p {
    line-height: 1.8;
    margin: 0 0 00.3rem 0;
}0
}
/*HOME标题*/
.color-word {
    display: flex;
    overflow: hidden;
    position: relative;
}
.color-word i {position: absolute;width: 100%;height: 110%;left: 0;top: -5%;transform-origin: 100% 50%;transform: translateZ(0);background: rgba(255,255,255,0.7);}
.color-word.active i {animation: indppTitleRight 5.6s ease both;}
@keyframes indppTitleLeft{0%{transform: translateX(0);}100%{transform: translateX(-110%);}}
@keyframes indppTitleRight{0%{transform: translateX(0);}100%{transform: translateX(110%);}}


/*三耐价值体系*/
.three {
    padding:1.2rem 0;
}

.three-swiper {}
.three-swiper ul {
    display:flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.3rem 2%;
}
.three-swiper ul li {
    width:32%;
}
.three-swiper ul li img {
    width: 100%;
}
@media screen and (max-width:1024px) {
.three {
    padding:0.6rem 0;
}

.three-swiper {}
.three-swiper ul {
    display:flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.3rem 2%;
}
.three-swiper ul li {
    width:32%;
}
.three-swiper ul li img {
    width: 100%;
}
}
/*三耐价值体系*/


/*栏目板块标题*/
.about-title {
    padding:0 0 0.5rem 0;
}
.about-title p {
    font-size:var(--fs36);
    color: #1d1d1f;
    *text-transform: uppercase;
}
.about-title h3 {
    position: relative;
    font-size: var(--fs70);
    color: #1d1d1f;
    margin:0.3rem 0 0.3rem 0;
}

.about-title h4 {
    font-size: var(--fs18);
    color:#666;
    line-height: 1.8;
    
}
.about-title p span {
    color:#e4002b;
    font-family: "MiSans-Medium";
}
@media screen and (max-width:1024px) {
.about-title {
    padding:8% 0;
}
.about-title p {
}
.about-title h3 {
    margin: 0.15rem 0 0.15rem 0;
}
.about-title h4 {
    color:#999;
    line-height: 1.8;
    
}
}
/*栏目板块标题*/


/*耐科技产品研发系统*/
.technology {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding:1.2rem 0;
}
.technology .about-title h3 {
    color: #fff;
}
.technology .about-title h4 {
    color: #fff;
    font-size: var(--fs18);
    font-family: "MiSans-Light";
}
.technology .technology-item {}
.technology .technology-item {}
.technology .technology-item .icon {}
.technology .technology-item .icon ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: stretch;
    gap: 0.8rem 2%;
}
.technology .technology-item .icon ul li {
    width: 23.5%;
}
.technology .technology-item .icon ul li .photo {
    position: relative;
    display: inline-flex;
}
.technology .technology-item .icon ul li .photo::before {
    content: "";
    position: absolute;
    left: -10%;
    top: -10%;
    /* transform: translate(-50%, -50%); */
    width: 120%;
    height: 120%;
    z-index: 2;
    background: url(../images/join/support-circle.png) no-repeat center center / 100%;
    /* transition: all 3s; */
    animation: rotateAni 4s linear infinite;
}
.technology .technology-item .icon ul li .photo img {
    width: 0.5rem;
}

.technology .technology-item .icon ul li .word {
    margin: 0.2rem 0 0 0;
}
.technology .technology-item .icon ul li .word h5 {
    font-size: var(--fs16);
    color: #fff;
    font-family: "MiSans-Light";
}

.technology .video-bg {
    position: absolute;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: #021725;
}
.technology .video-bg video {
    opacity: 0.1;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media (max-width: 1024px){
.technology {
    position: relative;
    padding:1.2rem 0;
}
.technology .about-title h3 {
    color: #fff;
}
.technology .about-title h4 {
    color: #fff;
    font-size: var(--fs14);
    font-family: "MiSans-Light";
}
.technology .technology-item {}
.technology .technology-item {}
.technology .technology-item .icon {}
.technology .technology-item .icon ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: center;
    gap: 0.8rem 2%;
}
.technology .technology-item .icon ul li {
    width: 32%;
}
.technology .technology-item .icon ul li .photo {}
.technology .technology-item .icon ul li .photo img {
    width: 0.5rem;
}

.technology .technology-item .icon ul li .word {
    margin: 0.2rem 0 0 0;
}
.technology .technology-item .icon ul li .word h5 {
    font-size: var(--fs14);
    color: #fff;
    font-family: "MiSans-Light";
}

.technology .video-bg {
    position: absolute;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: #021725;
}
.technology .video-bg video {
    opacity: 0.1;
}
}
/*耐科技产品研发系统*/


/*三大优势解析*/
.adv-three {
    padding:1.2rem 0 0 0;
}
.adv-three .adv-three-item {}
.adv-three .adv-three-item .photo {}
.adv-three .adv-three-item .photo ul {}
.adv-three .adv-three-item .photo ul li {
    text-align: center;
}
.adv-three .adv-three-item .photo ul li figure {
    position: relative;
    padding-top: 44.3%;
    border-radius: 0.2rem;
    overflow: hidden;
    box-shadow: 20px 20px 80px 0px rgba(0, 0, 0, 0.1);
}
.adv-three .adv-three-item .photo ul li figure img,
.adv-three .adv-three-item .photo ul li figure video{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.6s ease;
}

.adv-three .adv-three-item .icon-tags {
    margin:0.6rem 0;
}
.adv-three .adv-three-item .icon-tags ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.3rem 2%;
}
.adv-three .adv-three-item .icon-tags ul li {
    display: flex;
    gap: 10%;
    width:32%;
    padding:0.4rem;
    background:#f6f6f6;
    border-radius: 0.2rem;
}
.adv-three .adv-three-item .icon-tags ul li:hover {
    background:#e4002b;
}
.adv-three .adv-three-item .icon-tags ul li .shuzi {
    font-size: 1.2rem;
    color: #d5d5d5;
    line-height: 1;
    font-family: "MiSans-Medium";
}
.adv-three .adv-three-item .icon-tags ul li:hover .shuzi {
    color: #fff;
}
.adv-three .adv-three-item .icon-tags ul li .info {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
}
.adv-three .adv-three-item .icon-tags ul li .info h6 {
    position:relative;
    padding:0 0 0 0.8rem;
    font-size: var(--fs18);
    color: #000;
    line-height: 1.4;
    font-family: "MiSans-Medium";
    transition: transform 1s;
}
.adv-three .adv-three-item .icon-tags ul li:hover .info h6 {
    color: #fff;
}
.adv-three .adv-three-item .icon-tags ul li .info h6::before {
    position:absolute;
    top:50%;
    left:10%;
    transform: translate(-50%, -50%);
    content: "";
    width: 0.6rem;
    height: 0.6rem;
    display: inline-block;
    vertical-align: middle;
}
.adv-three .adv-three-item .icon-tags ul li.one .info h6::before {
    background: url(../images/technology/adv-three-01.svg) no-repeat center center /100%;
}
.adv-three .adv-three-item .icon-tags ul li.two .info h6::before {
    background: url(../images/technology/adv-three-02.svg) no-repeat center center /100%;
}
.adv-three .adv-three-item .icon-tags ul li.three .info h6::before {
    background: url(../images/technology/adv-three-03.svg) no-repeat center center /100%;
}
.adv-three .adv-three-item .icon-tags ul li .info p {
    font-size:var(--fs14);
    color: #666;
    line-height: 1.6;
    transition: transform 1s;
}
.adv-three .adv-three-item .icon-tags ul li:hover .info p {
    color: #fff;
}
@media (max-width: 1024px){
.adv-three {
    padding: 0.6rem 0 0 0;
}
.adv-three .adv-three-item {}
.adv-three .adv-three-item .photo {}
.adv-three .adv-three-item .photo ul {}
.adv-three .adv-three-item .photo ul li {
    text-align: center;
}
.adv-three .adv-three-item .photo ul li figure {
    border-radius: 0.2rem;
    overflow:hidden;
    box-shadow: 20px 20px 80px 0px rgba(0, 0, 0, 0.1);
}
.adv-three .adv-three-item .photo ul li figure img {
    width:100%;
}

.adv-three .adv-three-item .icon-tags {
    margin:0.3rem 0;
}
.adv-three .adv-three-item .icon-tags ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.3rem 2%;
}
.adv-three .adv-three-item .icon-tags ul li {
    display: flex;
    gap: 10%;
    width: 100%;
    padding:0.4rem;
    background:#f6f6f6;
    border-radius: 0.2rem;
}
.adv-three .adv-three-item .icon-tags ul li .shuzi {
    font-size: var(--fs70);
    color: #d5d5d5;
    line-height: 1;
    font-family: "MiSans-Medium";
}

.adv-three .adv-three-item .icon-tags ul li .info {
}
.adv-three .adv-three-item .icon-tags ul li .info h6 {
    padding:0 0 0 0.6rem;
}
.adv-three .adv-three-item .icon-tags ul li:hover .info h6 {
    color: #fff;
}
.adv-three .adv-three-item .icon-tags ul li .info h6::before {
    position:absolute;
    top:50%;
    left:10%;
    transform: translate(-50%, -50%);
    content: "";
    width: 0.5rem;
    height: 0.5rem;
    display: inline-block;
    vertical-align: middle;
}
.adv-three .adv-three-item .icon-tags ul li.one .info h6::before {
    background: url(../images/technology/adv-three-01.svg) no-repeat center center /100%;
}
.adv-three .adv-three-item .icon-tags ul li.two .info h6::before {
    background: url(../images/technology/adv-three-02.svg) no-repeat center center /100%;
}
.adv-three .adv-three-item .icon-tags ul li.three .info h6::before {
    background: url(../images/technology/adv-three-03.svg) no-repeat center center /100%;
}
.adv-three .adv-three-item .icon-tags ul li .info p {
    font-size:var(--fs14);
    color: #666;
    line-height: 1.6;
    transition: transform 1s;
}

}
/*三大优势解析*/

/*精准匹配消费者对瓷砖功能*/
.details {
    width: 100%;
    overflow: hidden;
    padding:1.2rem 0;
}
.details .title {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
}
.details .title h6 {
    font-size: var(--fs70);
    color: #000;
    *font-family: "MiSans-Medium";
}
.details .title p {
    font-size: var(--fs18);
    color: #666;
    line-height: 1.8;
    font-family: "MiSans-Regular";
}

.details .photo {
    margin:0.8rem 0 0 0;
}
.details .photo .details-swiper {
    overflow: hidden;
}
.details .photo .details-swiper ul {}
.details .photo .details-swiper ul li {}
.details .photo .details-swiper ul li  figure {
    position: relative;
    width: 100%;
    padding-top: 160%;
}
.details .photo .details-swiper ul li  figure img {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    object-fit: cover;
    transition: all 0.6s ease;
}

@media (max-width: 1024px){
.details {
    padding: 0.4rem 0;
}
.details .title {;
}
.details .title h6 {
    font-size: var(--fs48);
}
.details .title p {
    margin: 0.4rem 0 0 0;
    font-size: var(--fs14);
}
.details .photo {
    margin:0.4rem 0 0 0;
}
.details .photo .details-swiper {}
.details .photo .details-swiper ul {}
.details .photo .details-swiper ul li {}
.details .photo .details-swiper ul li  figure {
    padding-top: 160%;
}
.details .photo .details-swiper ul li  figure img {
}
}
/*精准匹配消费者对瓷砖功能*/