@charset "utf-8";
.content {
    width: 100%;
    overflow: hidden;
    .banner {
        overflow: hidden;
        position: relative;
        img {
            display: block;
            width: 100%;
        }
    }
    .footer {
        overflow: hidden;
        width: 100%;
        background: #fff;
        padding: .6rem 0;
        .m {
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            .icon {
                display: flex;
                align-items: center;
                img {
                    width: 1.4rem;
                }
                div {
                    overflow: hidden;
                    margin-left: .24rem;
                    p {
                        font-size: .16rem;
                        color: #000000;
                        padding: .08rem 0;
                    }
                }
            }
            .fr {
                display: flex;
                align-items: center;
                padding-bottom: .2rem;
                a {
                    display: block;
                    width: 1.43rem;
                    margin-left: .14rem;
                    img {
                        display: block;
                        height: .6rem;
                        width: 100%;
                    }
                }
            }
        }
    }
    .m {
        width: 14rem;
        margin: 0 auto;
    }
    .main_photo {
        overflow: hidden;
        width: 100%;
        padding: 1rem 0 .88rem 0;
        background: #E4F5EB;
        .tong_title .line {
            background: #C8E1D2;
        }
        .box {
            width: 100%;
            position: relative;
            margin-top: .7rem;
            .btn {
                cursor: pointer;
                position: absolute;
                top: 50%;
                z-index: 99;
                display: none;
                transform: translateY(-50%);
                &.prev {
                    left: 0;
                }
                &.next {
                    right: 0;
                }
            }
            .mySwiper2 {
                width: 100%;
                .swiper-slide {
                    width: 9.85rem;
                    position: relative;
                    height: 5.12rem;
                    margin: 0 .07rem;
                    &::after {
                        content: '';
                        width: 100%;
                        height: 100%;
                        background: rgba(255, 255, 255, 0.3);
                        position: absolute;
                        left: 0;
                        top: 0;
                        z-index: 9;
                    }
                    &.swiper-slide-active {
                        height: 5.4rem;
                        &::after {
                            display: none;
                        }
                        .btn{
                        	display: block;
                        }
                    }
                    .label {
                        width: 100%;
                        height: 100%;
                        position: relative;
                        img {
                            display: block;
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                        }
                        div {
                            display: flex;
                            align-items: center;
                            width: 100%;
                            height: .6rem;
                            background: rgba(0, 0, 0, .34);
                            position: absolute;
                            left: 0;
                            bottom: 0;
                            padding: 0 .3rem;
                            span {
                                display: block;
                                width: 100%;
                                letter-spacing: .01rem;
                                font-size: .16rem;
                                color: #fff;
                                overflow: hidden;
                                text-overflow: ellipsis;
                                white-space: nowrap;
                            }
                        }
                    }
                }
            }
        }
    }
    .main_video {
        overflow: hidden;
        width: 100%;
        padding: 1rem 0 .8rem 0;
        .box {
            width: 100%;
            margin-top: .95rem;
            .bot {
                display: flex;
                flex-wrap: wrap;
                .label {
                    margin-right: .22rem;
                    &:nth-child(3n) {
                        margin-right: 0;
                    }
                }
            }
            .grow {
                width: 4.52rem;
                overflow: hidden;
                .label:first-child {
                    margin-top: 0;
                }
            }
            .label {
                width: 4.52rem;
                height: 2.48rem;
                position: relative;
                margin-top: .2rem;
                overflow: hidden;
                &.on {
                    width: 9.27rem;
                    height: 5.17rem;
                    margin-top: 0;
                }
                video {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    display: block;
                }
                .play {
                    cursor: pointer;
                    width: .45rem;
                    position: absolute;
                    left: 50%;
                    top: 50%;
                    transform: translate(-50%, -50%);
                    z-index: 999;
                }
                .font {
                    display: flex;
                    align-items: center;
                    width: 100%;
                    height: .4rem;
                    background: rgba(0, 0, 0, .34);
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    padding: 0 .21rem;
                    span {
                        display: block;
                        width: 100%;
                        letter-spacing: .01rem;
                        font-size: .16rem;
                        color: #fff;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }
                }
            }
            .top {
                display: flex;
                justify-content: space-between;
            }
        }
    }
    .main_info {
        overflow: hidden;
        width: 100%;
        padding: .8rem 0 .6rem 0;
        background: #E4F5EB;
        .tong_title .line {
            background: #C8E1D2;
        }
        .box {
            overflow: hidden;
            margin-top: .8rem;
            span {
                display: block;
                font-size: .2rem;
                color: #333333;
                line-height: 1.85;
                text-indent: .4rem;
            }
        }
    }
    .main_follow {
        overflow: hidden;
        padding: .9rem 0 .7rem 0;
        .box {
            overflow: hidden;
            width: 100%;
            display: flex;
            justify-content: space-between;
            margin-top: .9rem;
            .grow {
                overflow: hidden;
                flex: 1;
                border-bottom: 1px dashed #E0DFDB;
                ul {
                    overflow: hidden;
                    li {
                        overflow: hidden;
                        &.on {
                            .info {
                                display: block;
                                opacity: 1;
                            }
                            .line {
                                display: none;
                            }
                        }
                        .info {
                            overflow: hidden;
                            padding-bottom: .3rem;
                            border-bottom: 1px dashed #E0DFDB;
                            display: none;
                            opacity: 0;
                            transition: all .2s;
                            padding-top: .2rem;
                            margin-bottom: .2rem;
                            p {
                                font-size: .28rem;
                                color: #333333;
                                line-height: 1.5;
                                font-weight: bold;
                                margin-bottom: .2rem;
                            }
                            span {
                                display: block;
                                font-size: .16rem;
                                text-indent: .32rem;
                                color: #333333;
                                line-height: 1.875;
                                em {
                                    color: #D53434;
                                }
                            }
                        }
                        .line {
                            overflow: hidden;
                            display: flex;
                            align-items: center;
                            width: 100%;
                            justify-content: space-between;
                            height: .55rem;
                            p {
                                font-size: .14rem;
                                color: #9A9A9A;
                            }
                            div {
                                display: flex;
                                align-items: center;
                                width: 4.2rem;
                                img {
                                    display: block;
                                    margin-right: .1rem;
                                }
                                span {
                                    flex: 1;
                                    font-size: .16rem;
                                    color: #333333;
                                    overflow: hidden;
                                    text-overflow: ellipsis;
                                    white-space: nowrap;
                                }
                            }
                        }
                    }
                }
            }
            .slide {
                overflow: hidden;
                position: relative;
                margin-right: .51rem;
                width: 7.9rem;
                .swiper-pagination{
                	height: .48rem;
                	display: flex;
                	align-items: center;
                	justify-content: flex-end;
                	padding-right: .18rem;
                	bottom: 0;
                	.swiper-pagination-bullet{
                		width: .16rem;
                		height: .08rem;
                		border-radius: 0;
                		background: #8995AE;
                		margin-left: .1rem;
                	}
                	.swiper-pagination-bullet-active{
                		background: #fff;
                	}
                }
                .label {
                    width: 100%;
                    position: relative;
                    img {
                        display: block;
                        width: 100%;
                    }
                    .bot {
                        display: flex;
                        align-items: center;
                        width: 100%;
                        height: .48rem;
                        background: rgba(0, 0, 0, .34);
                        position: absolute;
                        left: 0;
                        bottom: 0;
                        padding: 0 .21rem;
                        span {
                            display: block;
                            width: 100%;
                            letter-spacing: .01rem;
                            font-size: .2rem;
                            color: #fff;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            white-space: nowrap;
                        }
                    }
                }
            }
        }
    }
    .tong_title {
        width: 14rem;
        margin: 0 auto;
        position: relative;
        text-align: center;
        font-size: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        .line {
            flex: 1;
            height: 2px;
            background: #D8D8D8;
        }
        .mid {
            position: relative;
            display: inline-block;
            text-align: center;
            padding: 0 .9rem;
            &::after {
                content: '';
                width: 1.11rem;
                height: .88rem;
                background-image: url(../images/dot.png);
                background-size: 100% 100%;
                position: absolute;
                left: .14rem;
                top: 50%;
                transform: translateY(-50%);
            }
            &::before {
                content: '';
                width: 1.18rem;
                height: 1.15rem;
                background-image: url(../images/dot1.png);
                background-size: 100% 100%;
                position: absolute;
                right: .14rem;
                top: 50%;
                transform: translateY(-50%);
            }
            span {
                position: relative;
                font-size: .36rem;
                font-weight: bold;
                letter-spacing: .03rem;
                color: #6C852F;
                z-index: 9;
            }
        }
    }
}

@media (max-width: 1000px) {
	.m{
		width: 100% !important;
	}
	.content .tong_title{
		width: 100% !important;
		padding: 0 .3rem;
	}
	.content .tong_title .line{
		height: 1px;
	}
	.content .tong_title .mid{
	}
	.content .tong_title .mid span{
		font-size: .3rem;
		letter-spacing: 0;
	}
	.content .tong_title .mid::before{
		width: .8rem;
		height: .8rem;
	}
	.content .main_follow .box{
		padding: 0 .3rem;
		display: block;
	}
	.content .main_follow .box .slide{
		display: block;
		width: 100%;
	}
	.content .main_follow .box .slide .label .bot{
		height: .6rem;
		padding-right: 2rem;
	}
	.content .main_follow .box .slide .label .bot span{
		font-size: .24rem;
	}
	.content .main_follow .box .grow ul li .info span{
		font-size: .26rem;
	}
	.content .main_follow .box .grow ul li .line div span{
		font-size: .26rem;
	}
	.content .main_follow .box .grow ul li .line p{
		font-size: .24rem;
	}
	.content .main_follow .box .grow ul li .line{
		height: .7rem;
	}
	.content .main_follow .box .grow ul li .line div{
		width: 5.2rem;
	}
	.content .main_info{
		padding: .8rem .3rem;
	}
	.content .main_info .box span{
		font-size: .26rem;
	}
	.content .main_video{
		padding: .8rem .3rem;
	}
	.content .main_video .box{
		margin-top: .8rem;
	}
	.content .main_video .box .top{
		display: block;
		width: 100%;
	}
	.content .main_video .box .label.on{
		width: 100%;
	}
	.content .main_video .box .grow{
		width: 100%;
		display: block;
	}
	.content .main_video .box .label{
		width: 100%;
		height: 3.6rem;
		margin: 0;
		margin-bottom: .3rem;
	}
	.content .main_video .box .label .font{
		height: .7rem;
		span{
			font-size: .26rem;
		}
	}
	.content .main_photo .box .mySwiper2 .swiper-slide{
		width: 5rem;
		height: 4rem;
	}
	.content .main_photo .box .mySwiper2 .swiper-slide.swiper-slide-active{
		height: 4.4rem;
	}
	.content .main_photo .box .mySwiper2 .swiper-slide .label div span{
		font-size: .24rem;
	}
	.content .footer .m{
		display: block;
		width: 100%;
		padding: 0 .3rem;
	}
	.content .footer .m .icon{
		display: block;
	}
	.content .footer .m .icon img{
		width: 1rem;
		margin: 0 auto;
		display: block;
	}
	.content .footer .m .icon div{
		margin: 0;
		margin-top: .3rem;
		p{
			font-size: .2rem;
			text-align: center;
			line-height: 1.6;
		}
	}
	.content .footer .m .fr{
		justify-content: center;
		width: 100%;
		float: none;
		margin-top: .3rem;
	}
}