

.grey {
    background-color: #efefef;
}

.bn {
    height: 980px;
    position: relative;
}

.bn .maxWidth {
    font-size: 80px;
    font-weight: bold;
    letter-spacing: 8px;
}

.part_1 {
    padding: 210px 15px 150px;
}

.part_1 .top {
    display: flex;
    padding-bottom: 110px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 3px solid var(--themaGreen);
}

.part_1 .top .left {
    max-width: 810px;
    font-size: 45px;
    line-height: 60px;
}

.part_1 .top .left span {
    color: var(--themaGreen);
}

.part_1 .top .right {
    font-size: 80px;
    font-weight: bold;
    color: var(--themaGreen);
}

.part_1 .top .right span {
    display: block;
    font-size: 18px;
}

.part_1 .btm {
    display: flex;
    padding-top: 90px;
    align-items: flex-start;
    justify-content: space-between;
}


.part_1 .btm .left {
    max-width: 840px;
    color: #595757;
    font-size: 17px;
    line-height: 25px;
}

.part_1 .btm .left p {
    margin-bottom: 25px;
}

.part_1 .btm .right {
    font-size: 18px;
    line-height: 28px;
    color: #595757;
    text-align: right;
}

.part_1 .btm .right .title {
    margin-bottom: 30px;
    font-size: 20px;
    line-height: 28px;
    color: var(--themaGreen);
}

.part_2 {
    height: 696px;
    max-width: 1735px;
    margin-bottom: 250px;
}

.part_3 {
    margin-bottom: 240px;
}

.part_3 .title,.part_7 .title{
    max-width: 1065px;
    margin-bottom: 95px;
    font-size: 45px;
    line-height: 60px;
}

.part_3 .title font{ color:#104536}

.part_3 .mid {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.part_3 .mid > div {
    max-width: 723px;
}

.part_3 .lefTxt {
    height: 100%;
    padding-top: 50px;
    padding-bottom: 40px;
    border-top: 3px solid var(--themaGreen);
    border-bottom: 3px solid var(--themaGreen);
}

.part_3 .lefTxt .title {
    margin-bottom: 120px;
    font-size: 30px;
    line-height: 35px;
    color: var(--themaGreen);
}

.part_3 .lefTxt p {
    margin-bottom: 26px;
    font-size: 17px;
    line-height: 25px;
    color: #595757;
}

.grey .grey_title {
	font-weight:bold;
    font-size: 45px;
    line-height: 60px;
    color: #231916;
}

.part_5 .maxWidth {
    padding-top: 90px;
    border-top: 3px solid var(--themaGreen);
}

.part_5 ul {
    margin-top: 60px;
    padding-bottom: 335px;
    font-size: 0;
}

.part_5 li {
    display: inline-block;
    margin-bottom: 20px;
    width: calc((100% - 64px) / 5);
    margin-right: 16px;

}

.part_5 li img{ max-height:225px;}

.part_5 li a:hover{ background:#104536;}

.part_5 li:nth-child(5n) {
    margin-right: 0;
}

.part_5 li a {
    display: flex;
    cursor: pointer;
    overflow: hidden;
	padding:70px 0;
    background-color: white;
}

.part_5 li a img {
    display: block;
    margin: auto;
}

.part_4 .maxWidth {
    padding-top: 130px;
}


.part_4 .tab {
    position: relative;
    width: 100%;
}

.part_4 .eventList {
    padding-bottom: 105px;
}

.part_4 .eventList li {
    display: none;
}

.part_4 .eventList li.on {
    display: flex;
    align-items: top;
    justify-content: space-between;
}

.part_4 .eventList li .left {
    padding-top: 100px;
    padding-left: 120px;
    flex: 1;
    box-sizing: border-box;
}

.part_4 .eventList li .left > p {
    display: inline-block;
}

.part_4 .eventList li .left .time {
    position: relative;
	font-weight:bold;
    margin-bottom: 80px;
    font-size: 60px;
    line-height: 40px;
    z-index: 1;
}

.part_4 .eventList li .left .time::before {
    content: "";
    position: absolute;
    width: 68px;
    height: 68px;
    left: -30px;
    top: -45px;
    z-index: -1;
    background-color: var(--themaGreen);
}

.part_4 .eventList li .left .txt {
    font-size: 20px;
}

.part_4 .eventList li .right {
    flex: 1;
}

.part_4 .yearList {
    margin-top: 35px;
    margin-bottom: 85px;
    border-top: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
}

.part_4 .yearList li {
    display: inline-block;
    margin-right: 75px;
    color: #595757;
    text-align: left;
    font-size: 18px;
    line-height: 66px;
    cursor: pointer;
    font-weight: 600;
}

.part_4 .yearList li:first-child {
    margin-left: 15px;
}

.part_4 .yearList li.on {
    color: var(--themaGreen);
}

.part_6 { padding-bottom:10%;}

.part_6 .swiper-slide {
    width: auto;
    margin-top: 65px;
}

.part_6 .mySwiper {
    overflow: hidden;
}

.part_6 .swiper-pagination {
    position: relative;
    margin-top: 65px;
}

.swiper-pagination-bullet {
    position: relative;
    margin: 0 12px;
    opacity: 1;
    background-color: var(--themaGreen);
}

.swiper-pagination-bullet-active::after {
    position: absolute;
    content: "";
    width: 24px;
    height: 24px;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    border: 1px solid var(--themaGreen);
}


.part_7{ margin:200px 0; overflow:hidden;}

.part_7 ul li{ border:solid 3px #e9e9e9; overflow:hidden;display:inline-block; padding:60px 0; height:180px;text-align:center; width: calc((100% - 207px) / 5); margin-bottom:40px; position:relative;}

.part_7 ul li span{ font-size:25px; color:#104536; font-weight:bold;}

.part_7 ul li p{font-size:18px; color:#595757; margin-top:35px;padding: 0 50px;}

.part_7 ul li:not(:nth-child(5n)) { margin-right:40px;}


@media (max-width:1024px) {
.bn{ height:auto; padding:30% 0;}
.bn .maxWidth{ position:static;transform:none; font-size:60px;letter-spacing:5px;}
.part_1{ padding:15% 15px 10%;}
.part_1 .top .left,.part_3 .title,.part_7 .title{ font-size:36px; line-height:50px; width:60%;}
.part_1 .top .right{ font-size:65px;}
.part_1 .btm .left,.part_3 .lefTxt{ width:60%;}
.part_1 .top{ padding-bottom:10%;}
.part_1 .btm{ padding-top:10%;}
.part_1 .btm .right{ width:25%;}
.part_3 .rightPic{width:35%;}
.part_2{ margin-bottom:10%;}
.grey .grey_title{ font-size:34px;}
.part_4 .eventList li .left{ padding-left:15px; padding-top:0; margin-left:15px;}
.part_5 ul{ padding:0 0 20%; margin-top:5%;}
.part_7 ul li{width: calc((100% - 107px) / 3);}
.part_7 ul li:not(:nth-child(5n)) { margin-right:0;}
.part_7 ul li:not(:nth-child(3n)) { margin-right:40px;}
}


@media (max-width:768px) {
.bn .maxWidth{font-size:50px;}
.part_1 .top .left,.part_3 .title,.part_7 .title{ font-size:30px; line-height:40px; margin-bottom:10%;}
.part_1 .top,.part_1 .btm,.part_3 .mid{ display:block}
.part_1 .top .left,.part_1 .top .right,.part_1 .btm .left,.part_1 .btm .right,.part_3 .lefTxt,.part_3 .rightPic,.part_3 .title,.part_7 .title{ width:100%;}
.part_1 .top .right,.part_1 .btm .right{ margin-top:5%;}
.part_3 .lefTxt,.part_3 .rightPic{ max-width:inherit}
.part_3 .lefTxt .title{ font-size:24px; line-height:30px; margin-bottom:10%;}
.part_3 .lefTxt{ padding:10% 0;}
.part_3 .rightPic{ margin-top:10%;}
.part_3{ margin-bottom:20%;}
.part_4 .maxWidth{ padding-top:10%;}
.part_4 .eventList{ padding-bottom:15%;}
.part_4 .eventList li.on{ display:block;}
.part_4 .eventList li .left .time{ font-size:46px; margin-bottom:10%;}
.part_4 .eventList li .right{ margin-top:10%;}
.grey .grey_title{ font-size:28px;}
.part_5 li{ width: calc((100% - 50px) / 3);}
.part_5 li:not(:nth-child(5n)){ margin-right:0}
.part_5 li:not(:nth-child(3n)){ margin-right:25px;}
.part_5 .maxWidth{ padding-top:10%;}
.part_4 .yearList { padding:25px 0;}
.part_4 .yearList li{ width:24%; margin-right:0;line-height:45px;}
.part_4 .yearList li:first-child{ margin-left:0}
.part_4 .eventList li .left .txt{ font-size:18px;}
.part_4 .eventList li .left .time::before{ width:50px; height:50px; top:-30px;}
.part_6 .swiper-slide img{ height:450px;}
.part_6{ padding-bottom:25%;}
}

@media (max-width:640px) {
.bn .maxWidth{font-size:30px;}
.part_1 .top .left,.part_3 .title,.part_7 .title{ font-size:24px; line-height:34px;}
.part_1 .top .right{ font-size:55px;}
.part_1 .top .right span{ font-size:16px;}
.part_1 .btm .left,.part_3 .lefTxt p{ font-size:15px;}
.part_1 .btm .right .title{ font-size:18px;}
.part_1 .btm .right{ font-size:16px;}
.grey .grey_title{ font-size:26px;}
.part_4 .yearList li{ width:32.33%; font-size:15px;}
.part_4 .yearList{ padding:2.5% 0;}
.part_4 .eventList li .left .time{ font-size:32px;}
.part_4 .eventList li .left .txt{ font-size:16px;}
.part_5 li{ width: calc((100% - 25px) / 2);}
.part_5 li a{ padding:35px 0;}
.part_5 li:not(:nth-child(5n)),.part_5 li:not(:nth-child(3n)){ margin-right:0}
.part_5 li:not(:nth-child(2n)){ margin-right:25px;}
.part_6 .swiper-slide img{ height:250px;}
.part_7 ul li{ width: calc((100% - 42px) / 2); height:150px;}
.part_7 ul li:not(:nth-child(5n)) { margin-right:0;}
.part_7 ul li:not(:nth-child(3n)) { margin-right:0;}
.part_7 ul li:not(:nth-child(2n)) { margin-right:25px;}
.part_7 ul li span{ font-size:20px;}
.part_7 ul li p{ font-size:14px; padding:0 15px;}
.part_7{ margin:15% 0;}

}
