.sp_header{height:auto;overflow:hidden;position:relative;z-index:10; right: 2%; top: 1.5%; float: right; width: 30%;}

@media screen and (max-width:768px){
	.sp_header{ width: 100%; right: -60%;}
}

.sp_nav{width:35px;position:relative;cursor:pointer;height:35px;}
.sp_nav span{display:block;background:#fff;width:25px;height:2px;position:absolute;left:5px;transition:all ease 0.35s}
.sp_nav span:nth-of-type(1){top:8px}
.sp_nav span:nth-of-type(2){top:16px}
.sp_nav span:nth-of-type(3){top:24px}
.sp_nav_se span:nth-of-type(1){top:16px;transform:rotate(45deg); background: #000;}
.sp_nav_se span:nth-of-type(2){width:0}
.sp_nav_se span:nth-of-type(3){top:16px;transform:rotate(-45deg); background: #000;}
.sjj_nav{position:fixed;z-index:9;background:#fff;width:100%; height: 100vh; font-size:14px;line-height:40px;top:-100%;left:0;overflow:auto;overflow-x:hidden;transition:top ease 0.35s;}
.sjj_nav .main{ padding: 2% 0;}
.nav_show{top:0; padding-top: 0;}

.sp_nav1 span{ background: #000;}

#sj_logo{ text-align: center; padding-top: 3%;}
#sj_logo img{ max-width: 35%;}

.navBox ul{position:absolute; top:56px; left: 0; height: 70px; width: 100%; text-align: center; overflow: hidden; display: none; visibility:hidden; z-index: 10;}
.navBox ul.active{ visibility: inherit; display: block;}
.navBox ul li{ display: inline-block; position:relative; height: 70px; line-height: 70px; width:130px; text-align:center; color:#737373; font-size:13px; transition:0.5s;}
.navBox ul li:before{ position: absolute; left: 50%; bottom: 10px; content: ''; width: 0; height: 2px; background: #ccc; transition:0.5s;}
.navBox ul li:hover:before{ width: 100%; left: 0;}
.navBox ul li a{ color:#737373;}
.navBox ul li:hover a{color:#5dbe8a}
.nav{ height:auto; width:100%; position: relative; text-align: center; border-bottom: 1px solid #e5e5e5;}
.nav .navBox{ display: inline-block !important; height:auto; width:10%}
.nav .navBox>a{display:block; height:55px; font-weight:700; text-align: center; position:relative; color:#737373; line-height:55px; width:100%}
.nav .navBox .f{margin: 0; float: none; font-size: 15px;}

.nav .navBox1{ float: left; display: inline-block !important; height:auto; width:10%}
.nav .navBox1>a{display:block; height:55px; font-weight:700; text-align: center; position:relative; color:#737373; line-height:55px; width:100%}

#nav_cp{ height: auto !important;}
#nav_cp li{ width: 155px; margin: 0 5px; position: relative; height: auto; line-height: 40px; font-size: 14px; text-align: left;}
#nav_cp li .pic img{ width: 100%;}
#nav_cp li::before{ position: absolute; left: 0; bottom: 0; content: ''; height: 1px; width: 50%; background: #e8334a;}

#nav_cp_part{ margin: 0 auto; padding: 4% 0 !important; width: 660px; height: 380px;}
#nav_cp_part .cp_part{ float: left; width: 165px; height: auto; font-size: 15px; cursor: pointer; position: relative;}
#nav_cp_part .cp_part .tit{ border-bottom: 1px solid #a8a8a8; height: 40px;}
#nav_cp_part .cp_part .titactive{ border-bottom: 2px solid #5dbe8a; height: 40px; color: #5dbe8a; font-weight: bold;}
#nav_cp_part .cp_part dl{ position: absolute; top: 42px; width: 165px; padding-top: 10px; opacity:0; visibility:hidden; transition:0.5s;}
#nav_cp_part .cp_part dl.active{ visibility: inherit; opacity: 1;}
#nav_cp_part .cp_part dt{ height: 30px; line-height: 30px; text-align: center; font-weight: normal;}
#nav_cp_part .cp_part dt a{ color: #737373;}
#nav_cp_part .cp_part dt:hover a{ color: #5dbe8a;}

#nav_cp_part  #cp_part_img{ width: 660px !important; padding-top: 20px;}
#nav_cp_part  #cp_part_img dt{ float: left; width: 155px; margin: 0 5px 20px; height: auto; font-size: 13px;}






#small_nav .swiper-container { width: 100%; height: auto; margin-left: auto; margin-right: auto;}
#small_nav .swiper-slide { background-position: center; position: relative;}
#small_nav .gallery-top { height: 100vh; width: 95%;}
#small_nav .gallery-top .swiper-slide ul li{ border-bottom: 1px solid #e7e7e7; height: auto; line-height: 4.5rem;}
.small_nav_cp{ position: relative; height: 4rem; line-height: 4rem; margin-top: 10px;}
.small_nav_cp .tit{ color: #737373; font-size: 1.5rem; float: left; width: 20%; height: 4rem; line-height: 4rem;}
.small_nav_cp dl{ position: absolute; left: 25%; top: 0; width: 75%; height: auto; display: none;}
.small_nav_cp .small_nav_cp_img{ display: block; z-index: 10;}
.small_nav_cp .small_nav_cp_img dt{ float: left; width: 50%; text-align: center; margin-bottom: 2%; border-bottom: none;}
.small_nav_cp .small_nav_cp_img dt .pic img{ max-width: 100%;}
.small_nav_cp dl dt{ border-bottom: 1px solid #e7e7e7; color: #636363; line-height: 4rem; font-weight: normal; font-size: 1.5rem;}
.small_nav_cp dl dt a{ color: #636363;}
.small_nav_cp:nth-of-type(2) dl{ top: -5rem;}
.small_nav_cp:nth-of-type(3) dl{ top: -10rem;}
.small_nav_cp:nth-of-type(4) dl{ top: -15rem;}

#small_nav .gallery-thumbs { border-bottom: 1px solid #e7e7e7; height: 4rem; line-height: 4rem; width: 100%; text-align: center; margin-bottom: 2%; box-sizing: border-box; transition:0.3s;}
#small_nav .gallery-thumbs .swiper-slide { height: 100%; line-height: 4rem; color: #4c4c4c; font-size: 1.4rem; text-align: center;}
#small_nav .gallery-thumbs .swiper-slide a{ color: #4c4c4c;}
#small_nav .gallery-thumbs .swiper-slide-thumb-active { border-bottom: 1px solid #5dbe8a; }
#small_nav .gallery-thumbs .swiper-slide-thumb-active a{ color: #5dbe8a;}