﻿#index .banner {
	width:100%;
	height:620px
}
#index .banner .swiper-container, #index .banner .swiper-wrapper {
	height:100%
}
#index .banner .swiper-slide {
	height:100%;
	overflow:hidden;
	background-size:cover;
	background-position:center
}
#index .banner .swiper-slide img {
	height:100%;
	width:auto;
	opacity:0
}
#index .floor-top {
	display:flex;
	justify-content:space-between;
	align-items:flex-end
}
#index .floor-top .tab {
	display:flex
}
#index .floor-top .tab a {
	margin-left:55px;
	font-size:18px;
	transition:all 0.3s
}
#index .floor-top .tab a:hover, #index .floor-top .tab a.active {
	color:#01327e
}
#index .mod-title {
	display:inline-block
}
#index .mod-title i {
	display:block;
	width:40px;
	height:4px;
	background-color:#01327e
}
#index .mod-title .cn {
	display:block;
	width:100%;
	font-size:26px;
	font-weight:bold;
	line-height:26px;
	margin-top:24px;
	white-space:nowrap
}
#index .mod-title .en {
	display:block;
	width:100%;
	font-size:20px;
	font-family:'Arial';
	text-transform:uppercase;
	line-height:20px;
	margin-top:12px;
	white-space:nowrap
}
#index .more {
	display:inline-flex;
	align-items:center;
	font-family:'DIN';
	font-size:14px;
	transition:all 0.3s
}
#index .more i {
	margin-left:6px;
	font-weight:bold;
	height:14px;
	line-height:14px;
	transition:all 0.3s
}
#index .more:hover i {
	transform:rotate(90deg)
}
#index .floor1 {
	width:100%;
	padding:60px 0 70px;
	background-color:#fff
}
#index .floor1 .items {
	width:100%;
	margin-top:40px;
	display:flex;
	justify-content:space-between
}
#index .floor1 .items .item {
	display:block;
	width:24%;
	background-color:#f2f4f5;
	border:1px solid #f2f4f5;
	transition:all 0.3s
}
#index .floor1 .items .item .img {
	width:100%;
	height:auto
}
#index .floor1 .items .item .img img {
	width:100%;
	height:auto
}
#index .floor1 .items .item .text {
	width:100%;
	padding:25px 30px
}
#index .floor1 .items .item .text .title {
	font-size:20px;
	line-height:24px;
	margin-bottom:0px
}
#index .floor1 .items .item .text .desc-line {
	line-height:16px;
	color:#888;
	margin-top:10px
}
#index .floor1 .items .item:hover {
	background-color:#fff;
	border-color:#01327e
}
#index .floor2 {
	width:100%;
	padding:40px 0 70px;
	background-color:#ebedef
}
#index .floor2 .blocks {
	width:100%
}
#index .floor2 .items {
	width:100%;
	margin-top:40px;
	display:none;
	justify-content:space-between
}
#index .floor2 .items.active {
	display:flex
}
#index .floor2 .items .item {
	display:inline-flex;
	align-items:center;
	width:24%;
	height:180px;
	background-color:#fff;
	overflow:hidden
}
#index .floor2 .items .item .img {
	width:180px;
	min-width:180px
}
#index .floor2 .items .item .img img {
	width:100%;
}
#index .floor2 .items .item .text {
	width:calc(100% - 180px);
	padding:25px 30px
}
#index .floor2 .items .item .text .title {
	font-size:20px;
	line-height:24px;
}
#index .floor2 .items .item .text .desc-line {
	line-height:16px;
	color:#888;
	margin-top:10px
}
#index .floor2 .items .item:hover {
	background-color:#fff;
	border-color:#01327e
}
#index .floor3 {
	width:100%;
	padding:60px 0 50px;
	background-color:#fff
}
#index .floor3 .items {
	width:100%;
	margin-top:40px;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between
}
#index .floor3 .items .item {
	width:32.5%;
	margin-left:1.25%;
	margin-bottom:20px;
	position:relative
}
#index .floor3 .items .item:nth-child(3n+1) {
margin-left:0
}
#index .floor3 .items .item .img {
	width:100%;
	height:auto
}
#index .floor3 .items .item .img img {
	width:100%;
	height:auto;

	transform:all 0.3s
}
#index .floor3 .items .item i.mask {
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	background-color:transparent;
	transition:all 0.3s
}
#index .floor3 .items .item .con {
	width:100%;
	text-align:center;
	position:absolute;
	top:50%;
	left:0;
	margin-top:-40px;
	color:#fff;
	opacity:0;
	transition:all 0.3s
}
#index .floor3 .items .item .con i {
	display:block;
	font-size:58px;
	margin:0 auto
}
#index .floor3 .items .item .con span {
	font-size:20px;
	margin-top:20px
}
#index .floor3 .items .item:hover .img img {
	-webkit-filter:grayscale(0);
	-moz-filter:grayscale(0);
	-ms-filter:grayscale(0);
	-o-filter:grayscale(0);
	filter:grayscale(0);
	filter:gray
}
#index .floor3 .items .item:hover i.mask {
	background-color:rgba(0, 0, 0, 0.3)
}
#index .floor3 .items .item:hover .con {
	opacity:1
}
#index .about {
	width:100%;
	position:relative;
	padding:60px 0 20px;
	background-color:#ebedef
}
#index .about .img {
	width:100%;
	padding-left:calc((100% - 1660px) / 2)
}
#index .about .img img {
	width:100%;
	height:auto
}
#index .about .texts {
	width:40.6%;
	padding:70px 110px 80px 0;
	padding-left:calc((100% - 1660px) / 2);
	position:absolute;
	top:calc(50% + 20px);
	left:0;
	z-index:3;
	transform:translateY(-50%);
	background-color:#fff
}
#index .about .texts .logo {
	height:40px
}
#index .about .texts .logo img {
	height:48px
}
#index .about .texts .name {
	font-size:24px;
	font-weight:bold;
	margin-top:24px
}
#index .about .texts .desc {
	font-size:14px;
	line-height:28px;
	margin-top:24px
}
#index .thumb {
	width:100%;
	padding:0 0 120px;
	background-color:#ebedef;
	position:relative
}
#index .thumb .swiper {
	width:100%;
	height:auto;
	position:relative;
	z-index:1
}
#index .thumb .swiper .swiper-slide img {
	width:100%;
	height:auto;
	-webkit-filter:grayscale(100%);
	-moz-filter:grayscale(100%);
	-ms-filter:grayscale(100%);
	-o-filter:grayscale(100%);
	filter:grayscale(100%);
	filter:gray;
	transform:all 0.3s
}
#index .thumb .swiper .swiper-slide.swiper-slide-active img {
	-webkit-filter:grayscale(0);
	-moz-filter:grayscale(0);
	-ms-filter:grayscale(0);
	-o-filter:grayscale(0);
	filter:grayscale(0);
	filter:gray
}
#index .thumb .bar {
	width:94%;
	max-width:800px;
	height:100px;
	overflow:hidden;
	position:absolute;
	left:50%;
	bottom:60px;
	z-index:3;
	transform:translateX(-50%);
	background-color:#fff;
	padding:20px 30px 20px 40px;
	display:flex;
	justify-content:space-between;
	align-items:center
}
#index .thumb .bar .t-swiper {
	width:calc(100% - 130px);
	height:100%
}
#index .thumb .bar .t-swiper .swiper-slide {
	height:60px
}
#index .thumb .bar .t-swiper .swiper-slide .flex {
	display:flex;
	align-items:center
}
#index .thumb .bar .t-swiper .swiper-slide .flex .icon {
	width:60px;
	height:60px;
	color:#01327e
}
#index .thumb .bar .t-swiper .swiper-slide .flex .icon i {
	font-size:60px;
	height:60px
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text {
	margin-left:20px
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text .big {
	font-size:20px;
	line-height:20px;
	font-weight:bold
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text .small {
	line-height:14px;
	margin-top:10px
}
#index .thumb .bar .navigation {
	width:130px;
	display:flex;
	justify-content:space-between;
	align-items:center
}
#index .thumb .bar .navigation i {
	font-size:20px;
	transition:all 0.3s
}
#index .thumb .bar .navigation i:hover {
	color:#01327e
}
#index .thumb .bar .navigation .c-page {
	font-size:20px
}
#index .thumb .bar .navigation .c-page #current {
	font-size:30px;
	color:#01327e
}
#index .study {
	width:100%;
	padding:60px 0 40px;
	background-color:#fff
}
#index .study .items {
	width:100%;
	margin-top:40px;
	display:flex;
	justify-content:space-between
}
#index .study .items .mod {
	width:100%;
	height:40px;
	padding:0 20px;
	display:flex;
	justify-content:space-between;
	align-items:center;
	background-color:#01327e;
	color:#fff
}
#index .study .items .mod>span {
	font-size:18px
}
#index .study .items .mod .more {
	display:inline-flex;
	align-items:center;
	font-family:'DIN';
	font-weight:bold;
	font-size:14px;
	color:#fff;
	transition:all 0.3s
}
#index .study .items .mod .more i {
	margin-left:6px;
	height:14px;
	line-height:14px;
	transition:all 0.3s
}
#index .study .items .mod .more:hover i {
	transform:rotate(90deg)
}
#index .study .items>.item {
	width:36%;
	margin-right:3.2%
}
#index .study .items>.item ul {
	margin-top:20px
}
#index .study .items>.item li {
	width:100%;
	height:50px;
	border-bottom:1px solid #f2f4f5;
	line-height:50px
}
#index .study .items>.item li a {
	display:block;
	width:100%;
	transition:all 0.3s
}
#index .study .items>.item li a:hover {
	color:#01327e
}
#index .study .items>.shorts {
	width:21.6%
}
#index .study .items>.shorts .type1 {
	height:160px
}
#index .study .items>.shorts .type1 li {
	height:50px
}
#index .study .items>.shorts .type1 li img {
	width:24px
}
#index .study .items>.shorts .type1 li a {
	width:calc(100% - 36px)
}
#index .study .items>.shorts .type2 {
	margin-top:40px
}
#index .study .items>.shorts .type2 .cover {
	width:100%;
	height:170px
}
#index .study .items>.shorts .type2 .cover a {
	display:block;
	width:100%;
	height:100%;
	background-size:cover;
	background-position:center;
	background-image:url(../img/68.png)
}
#index .study .items>.shorts .type2 .cover a img {
	display:none
}
#index .study .items>.shorts .type2 li {
	height:70px;
	margin-top:10px
}
#index .study .items>.shorts .type2 li img {
	width:50px
}
#index .study .items>.shorts .type2 li a {
	width:calc(100% - 62px)
}
#index .study .items>.shorts .type2 li:first-child {
	margin-top:0
}
#index .study .items>.shorts ul {
	margin-top:20px
}
#index .study .items>.shorts li {
	width:100%;
	border-bottom:1px solid #f2f4f5;
	display:flex;
	align-items:center;
	overflow:hidden
}
#index .study .items>.shorts li img {
	flex-shrink:0;
	margin-right:12px
}
#index .study .items>.shorts li .text {
	width:100%
}
#index .study .items>.shorts li a {
	display:block;
	transition:all 0.3s
}
#index .study .items>.shorts li a:hover {
	color:#01327e
}
#index .news {
	width:100%;
	padding:60px 0 40px;
	background-color:#ebedef
}
#index .news .news-block {
	width:100%;
	margin-top:40px;
	display:flex;
	align-items:stretch;
	justify-content:space-between
}
#index .news .news-block .img {
	width:38.5%;
	background-position:center;
	background-size:cover
}
#index .news .news-block ul {
	width:60%;
	background-color:#fff;
	padding:0 90px
}
#index .news .news-block ul li {
	width:100%;
	padding:30px 0 30px;
	border-bottom:1px solid #f2f4f5
}
#index .news .news-block ul li a {
	display:flex;
	align-items:center
}
#index .news .news-block ul li a .date {
	width:70px;
	text-align:center;
	white-space:nowrap;
	transition:all 0.3s;
	flex-shrink:0
}
#index .news .news-block ul li a .date .day {
	font-size:56px;
	font-weight:bold;
	font-family:'DIN';
	line-height:56px
}
#index .news .news-block ul li a .date .mon {
	font-size:16px;
	font-family:'DIN'
}
#index .news .news-block ul li a .text {
	width:100%;
	margin-left:40px
}
#index .news .news-block ul li a .text .title {
	font-size:18px;
	font-weight:bold;
	transition:all 0.3s
}
#index .news .news-block ul li a .text .desc {
	width:100%;
	line-height:28px;
	color:#888;
	margin-top:10px;
	transition:all 0.3s
}
#index .news .news-block ul li a:hover .date, #index .news .news-block ul li a.active .date {
	color:#01327e
}
#index .news .news-block ul li a:hover .text .title, #index .news .news-block ul li a.active .text .title {
	color:#01327e
}
#index .news .news-block ul li a:hover .text .desc, #index .news .news-block ul li a.active .text .desc {
	color:#333
}
#index .news .case-block {
	width:100%;
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap
}
#index .news .case-block .item {
	display:block;
	width:calc(50% - 10px);
	margin-left:20px;
	margin-top:20px;
	background-color:#fff;
	padding:40px 30px 30px;
	border-bottom:1px solid #fff;
	transition:all 0.3s
}
#index .news .case-block .item .title {
	font-size:18px;
	font-weight:bold;
	transition:all 0.3s
}
#index .news .case-block .item .desc {
	width:100%;
	line-height:28px;
	color:#888;
	margin-top:10px;
	transition:all 0.3s
}
#index .news .case-block .item:hover {
	border-color:#01327e
}
#index .news .case-block .item:hover .title {
	color:#01327e
}
#index .news .case-block .item:hover .desc {
	color:#333
}
#index .news .case-block .item:nth-child(2n+1) {
margin-left:0
}
#index .contact {
	width:100%;
	background-image:url(../img/22.jpg);
	background-position:center;
	background-size:cover;
	padding:140px 0 120px;
	text-align:center
}
#index .contact .big {
	font-size:48px;
	font-weight:bold;
	color:#fff
}
#index .contact .small {
	font-size:32px;
	font-weight:bold;
	color:#fff;
	margin-top:10px
}
#index .contact .btn {
	display:block;
	width:200px;
	height:50px;
	background-color:#fff;
	border-radius:25px;
	line-height:50px;
	text-align:center;
	font-size:16px;
	color:#01327e;
	margin:50px auto 0
}
#about .about {
	display:flex;
	align-items:stretch;
	background-color:#fff
}
#about .about .texts {
}
#about .about .texts .slogen {
	font-size:28px;
	font-weight:bold;
	text-align:center;
	padding:30px 0 0 0
}
#about .about .texts .content {
	width:100%;
	overflow-x:hidden;
	overflow-y:auto;
	font-size:16px;
	line-height:32px;
	margin-top:30px;
	-webkit-overflow-scrolling:touch
}
#about .about .texts .content img {
	max-width:100%
}
#about .about .texts .content::-webkit-scrollbar {
width:6px;
height:6px;
background-color:#f5f5f5
}
#about .about .texts .content::-webkit-scrollbar-track {
border-radius:3px;
background-color:#f5f5f5
}
#about .about .texts .content::-webkit-scrollbar-thumb {
border-radius:3px;
background-color:#ddd
}
#about .about .texts .items {
	width:100%;
	display:flex;
	justify-content:space-between;
	margin-top:60px
}
#about .about .texts .items .item {
	color:#01327e
}
#about .about .texts .items .item .en {
	font-size:16px;
	text-transform:uppercase
}
#about .about .texts .items .item .num {
	font-size:80px;
	font-family:'DIN';
	line-height:70px
}
#about .about .texts .items .item .desc {
	font-size:16px;
	margin-top:10px
}
#about .about .img {
	width:47%;
	flex-shrink:0;
	background-image:url(../img/33.png);
	background-size:cover;
	background-position:center;
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center
}
#about .about .img i.play {
	display:block;
	width:54px;
	height:54px;
	background-image:url(../img/34.png);
	background-size:100%;
	cursor:pointer;
	transition:all 0.3s
}
#about .about .img i.play:hover {
	transform:scale(1.1)
}
#about .dev {
	width:100%;
	height:480px;
	display:flex;
	align-items:stretch;
	border-top:1px solid #ddd
}
#about .dev .imgs {
	width:600px;
	height:480px;
	position:relative;
	flex-shrink:0
}
#about .dev .imgs .swiper {
	width:100%;
	height:100%
}
#about .dev .imgs .swiper .swiper-container {
	height:100%
}
#about .dev .imgs .swiper .swiper-container .swiper-wrapper {
	height:100%
}
#about .dev .imgs .swiper .swiper-container .swiper-wrapper .swiper-slide {
	height:100%;
	background-position:center;
	background-size:cover
}
#about .dev .imgs .btns {
	position:absolute;
	top:50%;
	right:0;
	transform:translateY(-50%);
	width:70px;
	height:140px;
	z-index:3
}
#about .dev .imgs .btns a {
	display:block;
	width:70px;
	height:70px;
	text-align:center;
	line-height:70px
}
#about .dev .imgs .btns a i {
	font-size:24px
}
#about .dev .imgs .btns a.prev {
	background-color:#fff;
	color:#01327e
}
#about .dev .imgs .btns a.next {
	background-color:#01327e;
	color:#fff
}
#about .dev .years {
	width:calc(100% - 480px);
	height:480px;
	background-color:#fff;
	overflow:hidden
}
#about .dev .years .swiper-container {
	height:100%
}
#about .dev .years .swiper-container .swiper-wrapper {
	height:100%
}
#about .dev .years .swiper-container .swiper-wrapper .swiper-slide {
	width:420px;
	height:100%;
	padding:100px 70px 60px 80px;
	border-right:1px solid #ddd
}
#about .dev .years .num {
	font-size:40px;
	font-family:'DIN';
	transition:all 0.3s
}
#about .dev .years i {
	display:block;
	width:40px;
	height:2px;
	margin-top:25px;
	background-color:#333;
	transition:all 0.3s
}
#about .dev .years .content {
	width:100%;
	height:200px;
	overflow-y:auto;
	font-size:16px;
	line-height:32px;
	margin-top:50px;
	-webkit-overflow-scrolling:touch
}
#about .dev .years .content::-webkit-scrollbar {
width:6px;
height:6px;
background-color:#f5f5f5
}
#about .dev .years .content::-webkit-scrollbar-track {
border-radius:3px;
background-color:#f5f5f5
}
#about .dev .years .content::-webkit-scrollbar-thumb {
border-radius:3px;
background-color:#ddd
}
#about .dev .years .content img {
	max-width:100%
}
#about .dev .years .swiper-slide-active .num {
	color:#01327e
}
#about .dev .years .swiper-slide-active i {
	background-color:#01327e
}
#about .advantage {
	width:100%;
	padding:60px 0;
	background-color:#f2f4f5
}
#about .advantage .item {
	width:100%;
	height:360px;
	display:flex;
	justify-content:space-between;
	margin-bottom:10px
}
#about .advantage .item .swiper {
	width:42.25%;
	height:360px
}
#about .advantage .item .swiper .swiper-slide {
	height:360px;
	background-position:center;
	background-size:cover
}
#about .advantage .item .texts {
	width:57.75%;
	height:100%;
	padding:90px 110px;
	background-color:#fff
}
#about .advantage .item .texts .title {
	font-size:30px;
	font-weight:bold
}
#about .advantage .item .texts .desc {
	font-size:16px;
	line-height:32px;
	margin-top:20px
}
#about .advantage .item:nth-child(2n) {
flex-direction:row-reverse
}
#about .honor {
	width:100%;
	padding:90px 0
}
#about .honor .swiper-slide {
	width:26.4%
}
#about .honor .swiper-slide img {
	width:100%
}
#about .team {
	width:100%
}
#about .team img {
	width:100%
}
#contact .contact {
	background-color:#f2f4f5;
	width:100%
}
#contact .contact .main {
	display:flex;
	align-items:stretch
}
#contact .contact .main .texts {
	width:100%;
	background-color:#fff;
	padding:60px 5%;
	overflow:hidden
}
#contact .contact .main .texts .big {
	font-size:48px;
	line-height:48px;
	font-family:'DIN'
}
#contact .contact .main .texts .name {
	font-size:18px;
	margin-top:25px
}
#contact .contact .main .texts .icon-line {
	display:flex;
	align-items:center;
	margin-top:20px
}
#contact .contact .main .texts .icon-line i {
	font-size:20px;
	flex-shrink:0
}
#contact .contact .main .texts .icon-line span {
	font-size:14px;
	margin-left:15px
}
#contact .contact .main .texts .way {
	margin-top:30px
}
#contact .contact .main .texts .way .title {
	font-size:18px
}
#contact .contact .main .texts .way .items p, #contact .contact .main .texts .way .items a {
	font-size:16px;
	display:inline-block;
	margin-right:15px
}
#contact .contact .main .texts .way .items p span, #contact .contact .main .texts .way .items a span {
	font-family:'DIN'
}
#contact .contact .main .texts .wechat {
	width:100%;
	margin-top:70px;
	display:flex;
	align-items:stretch
}
#contact .contact .main .texts .wechat .img {
	width:120px;
	height:120px
}
#contact .contact .main .texts .wechat .img img {
	width:100%;
	height:100%
}
#contact .contact .main .texts .wechat .rights {
	width:calc(100% - 120px);
	margin-left:16px;
	position:relative
}
#contact .contact .main .texts .wechat .rights .big {
	font-size:18px;
	font-weight:bold;
	line-height:24px
}
#contact .contact .main .texts .wechat .rights .desc {
	font-size:16px;
	margin-top:10px
}
#contact .contact .main .texts .wechat .rights .small {
	margin-top:10px;
	width:100%
}
#contact .contact .main #map {
	width:50%
}
#contact .feed {
	width:100%;
	background-color:#f2f4f5;
	padding-top:10px;
	padding-bottom:100px
}
#contact .feed .main {
	background-color:#fff;
	padding:60px 55px
}
#contact .feed .main .title {
	width:100%;
	text-align:center;
	font-size:24px;
	line-height:24px
}
#contact .feed .main .form {
	width:100%;
	margin-top:40px
}
#contact .feed .main .form .input-line {
	width:100%;
	display:flex;
	justify-content:space-between
}
#contact .feed .main .form .input-line input {
	width:24.5%;
	height:50px;
	padding:0 20px;
	border:1px solid #ddd
}
#contact .feed .main .form .textarea {
	width:100%;
	height:200px;
	margin-top:20px
}
#contact .feed .main .form .textarea textarea {
	width:100%;
	height:100%;
	padding:10px 20px;
	border:1px solid #ddd;
	resize:none
}
#contact .feed .main .form .bot-line {
	width:100%;
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-top:20px
}
#contact .feed .main .form .bot-line .yzm {
	display:inline-flex
}
#contact .feed .main .form .bot-line .yzm input {
	width:200px;
	height:50px;
	padding:0 20px;
	border:1px solid #ddd
}
#contact .feed .main .form .bot-line .yzm img {
	width:150px;
	height:50px;
	margin-left:10px
}
#contact .feed .main .form .bot-line .sub-btn {
	width:240px;
	height:40px
}
#contact .feed .main .form .bot-line .sub-btn .btn {
	width:240px;
	height:40px;
	line-height:40px;
	text-align:center;
	border:1px solid #333;
	border-radius:20px;
	background-color:transparent;
	color:#333
}
#notice .contents {
	width:100%;
	background-color:#f2f4f5;
	padding-bottom:100px
}
#notice .contents .main {
	padding:10px 110px 90px;
	background-color:#fff
}
#notice .contents .main .item {
	width:100%;
	margin-top:60px
}
#notice .contents .main .item .mod {
	height:24px;
	line-height:24px;
	font-size:24px;
	border-left:4px solid #01327e;
	color:#01327e;
	padding-left:10px;
	margin-bottom:20px
}
#notice .contents .main .item .content {
	font-size:14px;
	line-height:24px
}
#notice .contents .main .item .content img {
	max-width:100%
}
#news {
	background-color:#f2f4f5
}
#news .list {
	width:100%;
	background-color:#fff
}
#news .list .item {
	width:100%;
	height:260px;
	padding:30px 0;
	transition:all 0.3s
}
#news .list .item .main {
	width:94%
}
#news .list .item a {
	display:flex;
	align-items:center;
	width:100%;
	height:100%
}
#news .list .item .img {
	width:320px;
	height:200px;
	flex-shrink:0
}
#news .list .item .img img {
	width:100%;
	height:100%
}
#news .list .item .date {
	width:70px;
	text-align:center;
	white-space:nowrap;
	transition:all 0.3s;
	flex-shrink:0;
	margin:0 30px 0 70px
}
#news .list .item .date .day {
	font-size:56px;
	font-weight:bold;
	font-family:'DIN';
	line-height:56px
}
#news .list .item .date .mon {
	font-size:16px;
	font-family:'DIN'
}
#news .list .item .texts {
	width:calc(100% - 730px)
}
#news .list .item .texts .title {
	font-size:28px;
	font-weight:bold;
	transition:all 0.3s
}
#news .list .item .texts .desc {
	line-height:28px;
	margin-top:10px
}
#news .list .item .btn {
	width:100px;
	height:30px;
	border-radius:15px;
	line-height:30px;
	text-align:center;
	background-color:#01327e;
	color:#fff;
	font-family:'DIN';
	opacity:0;
	transition:all 0.3s;
	margin-left:140px
}
#news .list .item:hover {
	background-color:#d3eeff
}
#news .list .item:hover .date {
	color:#01327e
}
#news .list .item:hover .texts .title {
	color:#01327e
}
#news .list .item:hover .btn {
	opacity:1
}
#news .load-more {
	margin-top:60px;
	margin-bottom:100px
}
#news .study-tip {
	margin-bottom:30px;
	width:100%;
	background-color:#f2f4f5
}
#news .study-tip .main {
	background-color:#fff;
	padding:25px 35px;
	font-size:14px;
	line-height:24px
}
#news .detail {
	width:100%;
	margin-bottom:100px
}
#news .detail .main {
	background-color:#fff;
	padding:70px 110px 50px
}
#news .detail .main .title {
	text-align:center;
	font-size:24px
}
#news .detail .main .date {
	text-align:center;
	margin-top:17px
}
#news .detail .main .date span {
	margin:0 10px
}
#news .detail .main .content {
	margin-top:35px;
	padding:40px 0 20px;
	line-height:24px;
	border-top:1px solid #ddd
}
#news .detail .main .content img {
	max-width:100%
}
#news .detail .main .content iframe {
	width:100%;
	min-height:500px
}
#news .detail .main .prod {
	width:100%;
	display:flex;
	padding:0 0 30px 0
}
#news .detail .main .prod p {
	height:20px;
	line-height:20px;
	margin-top:10px;
	white-space:nowrap;
	flex-shrink:0
}
#news .detail .main .prod .items {
	overflow:hidden;
	width:100%
}
#news .detail .main .prod .items a {
	float:left;
	margin-left:20px;
	margin-top:10px
}
#news .detail .main .prev-next {
	width:100%;
	padding:25px 0;
	display:flex;
	justify-content:space-between;
	align-items:center;
	border-top:1px solid #ddd
}
#news .detail .main .prev-next .lefts {
	width:80%
}
#news .detail .main .prev-next .lefts a {
	margin:10px 0;
}
#news .detail .main .prev-next .back {
	display:block;
	width:100px;
	height:30px;
	border-radius:15px;
	line-height:30px;
	text-align:center;
	background-color:#d3eeff;
	color:#01327e
}
#study {
	background-color:#f2f4f5
}
#study .study-tip {
	width:100%;
	background-color:#f2f4f5
}
#study .study-tip .main {
	background-color:#fff;
	padding:25px 35px;
	font-size:14px;
	line-height:24px
}
#study .tab {
	width:100%;
	display:flex;
	justify-content:center
}
#study .tab .item {
	display:block;
	width:33%;
	max-width:260px;
	height:50px;
	line-height:50px;
	text-align:center;
	background-color:#d3eeff;
	position:relative;
	margin:0 5px;
	white-space:nowrap
}
#study .tab .item::after {
content:'';
display:block;
width:10px;
height:10px;
transform:rotate(-45deg) translate(-50%, 20%);
background-color:transparent;
position:absolute;
bottom:0;
left:50%
}
#study .tab .item.active, #study .tab .item:hover {
	background-color:#014193;
	color:#fff
}
#study .tab .item.active::after, #study .tab .item:hover::after {
background-color:#014193
}
#sample {
	margin-top:20px
}
#sample .main {
	overflow:hidden
}
#sample .item {
	display:flex;
	align-items:center;
	width:32.5%;
	background-color:#fff;
	float:left;
	margin-left:1.25%;
	margin-bottom:20px;
	padding:20px 10px
}
#sample .item .img {
	width:120px;
	height:80px;
	flex-shrink:0
}
#sample .item .img img {
	width:100%;
	height:100%
}
#sample .item .rights {
	width:calc(100% - 120px);
	padding-left:30px
}
#sample .item .rights .date {
	color:#888;
	font-family:'DIN'
}
#sample .item .rights .name {
	display:block;
	font-size:16px;
	line-height:18px;
	margin-top:5px
}
#sample .item .rights .btn {
	display:inline-block;
	width:100px;
	height:30px;
	border-radius:15px;
	line-height:30px;
	text-align:center;
	background-color:#d3eeff;
	color:#01327e;
	font-family:'DIN';
	margin-top:12px
}
#sample .item:nth-child(3n+1) {
margin-left:0
}
#sample .load-more {
	margin-top:40px;
	margin-bottom:100px
}
#explan {
	margin-top:20px;
	margin-bottom:100px
}
#explan .main {
	background-color:#fff
}
#explan .main .item {
	width:100%;
	padding:0 120px;
	border-bottom:1px solid #f2f4f5
}
#explan .main .item .tops {
	width:100%;
	height:90px;
	display:flex;
	justify-content:space-between;
	align-items:center
}
#explan .main .item .tops .title {
	font-size:18px
}
#explan .main .item .tops .btn {
	display:flex;
	align-items:center;
	justify-content:center;
	width:100px;
	height:30px;
	border-radius:15px;
	background-color:#d3eeff;
	transition:all 0.3s
}
#explan .main .item .tops .btn::before {
content:'展开';
display:inline-block;
color:#01327e;
transition:all 0.3s
}
#explan .main .item .tops .btn i {
	color:#01327e;
	font-size:12px;
	margin-left:8px;
	transition:all 0.3s
}
#explan .main .item .tops .btn.active {
	background-color:#01327e
}
#explan .main .item .tops .btn.active::before {
content:'收起';
color:#fff
}
#explan .main .item .tops .btn.active i {
	color:#fff;
	transform:rotate(-180deg)
}
#explan .main .item .bots {
	display:none;
	padding:45px 40px;
	background-color:#f2f4f5;
	line-height:24px;
	margin-bottom:20px
}
#explan .main .item .bots img {
	max-width:100%
}
#ques {
	margin-top:20px;
	margin-bottom:100px
}
#ques .main {
	background-color:#fff;
	padding:80px 120px 70px
}
#ques .main .list {
	width:100%;
	margin-top:30px
}
#ques .main .list a {
	display:block;
	width:100%;
	height:80px;
	line-height:80px;
	border-bottom:1px solid #ddd;
	overflow:hidden
}
#ques .main .list a .date {
	width:140px;
	color:#888;
	font-family:'DIN';
	float:left
}
#ques .main .list a .title {
	font-size:18px;
	width:calc(100% - 180px);
	float:left;
	transition:all 0.3s
}
#ques .main .list a i {
	font-size:18px;
	color:#ddd;
	float:right;
	transition:all 0.3s
}
#ques .main .list a:hover .title {
	color:#014193
}
#ques .main .list a:hover i {
	color:#014193
}
#ques .load-more {
	margin-top:60px
}
#gall {
	margin-top:20px;
	margin-bottom:100px
}
#gall .main {
	background-color:#fff;
	padding:40px 110px;
	height:860px
}
#calc {
	margin-top:20px;
	margin-bottom:100px
}
#calc .main {
	background-color:#fff;
	padding:80px 120px
}
#calc .main .calc-lines {
	margin-top:60px
}
#calc .main .calc-line {
	display:flex;
	justify-content:space-between;
	align-items:stretch;
	margin-bottom:30px
}
#calc .main .calc-line .item {
	width:47.5%
}
#calc .main .calc-line .item .title {
	width:100%;
	height:50px;
	line-height:50px;
	padding:0 30px;
	background-color:#d3eeff;
	font-size:18px
}
#calc .main .calc-line .item .tops {
	width:100%;
	height:45px;
	border-bottom:1px solid #ddd;
	line-height:45px;
	font-size:16px;
	font-weight:500;
	margin-top:20px
}
#calc .main .calc-line .item .block {
	margin:20px 0
}
#calc .main .calc-line .item .block .input {
	width:100%
}
#calc .main .calc-line .item .block .input .label {
	width:100%;
	font-size:14px
}
#calc .main .calc-line .item .block .input input {
	width:100%;
	height:40px;
	border:1px solid #ddd;
	margin-top:8px;
	padding:0 10px
}
#calc .main .calc-line .item .block .input input[readonly] {
	background-color:#f2f4f5;
	border-color:#f2f4f5;
	color:#01327e
}
#calc .main .calc-line .item .block .input select {
	width:100%;
	height:40px;
	border:1px solid #ddd;
	margin-top:8px;
	padding:0 10px
}
#calc .main .calc-line .item .block1 {
	width:100%;
	display:flex;
	justify-content:space-between;
	align-items:stretch
}
#calc .main .calc-line .item .block1 .left {
	width:45%
}
#calc .main .calc-line .item .block1 .left .img {
	width:100%
}
#calc .main .calc-line .item .block1 .left .img img {
	width:100%
}
#calc .main .calc-line .item .block1 .left .inputs {
	width:100%;
	display:flex;
	justify-content:space-between;
	margin-top:29px
}
#calc .main .calc-line .item .block1 .left .inputs .input {
	width:45%;
	max-width:100px
}
#calc .main .calc-line .item .block1 .right {
	width:45%;
	display:flex;
	flex-direction:column;
	justify-content:flex-end
}
#calc .main .calc-line .item .block1 .right .input {
	margin-top:35px
}
#calc .main .calc-line .item .block2 {
	width:100%;
	display:flex;
	justify-content:space-between
}
#calc .main .calc-line .item .block2 .input {
	width:45%
}
#calc .main .calc-line .item .block2 .icon {
	width:10%;
	text-align:center;
	display:inline-flex;
	flex-direction:column;
	justify-content:flex-end;
	align-items:center
}
#calc .main .calc-line .item .block2 .icon span {
	height:40px;
	line-height:40px;
	text-align:center
}
#calc .main .calc-line .item .block3 {
	width:100%;
	display:flex;
	justify-content:space-between;
	align-items:stretch
}
#calc .main .calc-line .item .block3 .left {
	width:45%
}
#calc .main .calc-line .item .block3 .left .img {
	width:100%
}
#calc .main .calc-line .item .block3 .left .img img {
	width:100%
}
#calc .main .calc-line .item .block3 .left .inputs {
	width:100%;
	display:flex;
	justify-content:space-between;
	margin-top:29px
}
#calc .main .calc-line .item .block3 .left .inputs .input {
	width:45%;
	max-width:100px
}
#calc .main .calc-line .item .block3 .right {
	width:45%;
	display:flex;
	flex-direction:column
}
#calc .main .calc-line .item .block3 .right .input {
	margin-bottom:20px
}
#calc .main .calc-line .item .block4 {
	width:100%
}
#calc .main .calc-line .item .block4 .img {
	width:100%
}
#calc .main .calc-line .item .block4 .img img {
	width:100%
}
#calc .main .calc-line .item .block4 .inputs {
	width:100%;
	display:flex;
	margin-top:29px
}
#calc .main .calc-line .item .block4 .inputs .input {
	width:30%;
	max-width:100px;
	margin-left:5%
}
#calc .main .calc-line .item .block4 .inputs .input:first-child {
	margin-left:0
}
#calc .main .calc-line .item .block5 {
	width:100%;
	display:flex
}
#calc .main .calc-line .item .block5 .input {
	width:30%;
	margin-left:5%
}
#calc .main .calc-line .item .block5 .input:nth-child(3n+1) {
margin-left:0
}
#calc .main .table {
	width:100%;
	margin-top:60px
}
#calc .main .table table {
	width:100%;
	border:1px solid #ddd
}
#calc .main .table table th {
	height:50px;
	background-color:#d3eeff;
	font-size:16px;
	text-align:center;
	padding:0 10px
}
#calc .main .table table td {
	padding:10px 20px;
	white-space:normal;
	word-break:break-all
}
#calc .main .table table td .goods {
	display:flex;
	align-items:center
}
#calc .main .table table td .goods img {
	width:60px;
	height:60px
}
#calc .main .table table td .goods span {
	margin-left:20px
}
#calc .main .table table tbody tr {
	transition:all 0.3s
}
#calc .main .table table tbody tr:hover {
	background-color:#f4fbff
}
#prod {
	background-color:#f2f4f5
}
#prod .cate {
	width:100%;
	background-color:#f2f4f5
}
#prod .cate .main {
	background-color:#fff
}
#prod .cate .main .tops {
	display:flex;
	width:100%;
	height:60px;
	background-color:#01327e;
	overflow-x:auto;
	overflow-y:hidden;
	-webkit-overflow-scrolling:touch
}
#prod .cate .main .tops::-webkit-scrollbar {
width:6px;
height:6px;
background-color:#f5f5f5
}
#prod .cate .main .tops::-webkit-scrollbar-track {
border-radius:3px;
background-color:#f5f5f5
}
#prod .cate .main .tops::-webkit-scrollbar-thumb {
border-radius:3px;
background-color:#ddd
}
#prod .cate .main .tops .scroll {
	display:flex
}
#prod .cate .main .tops .scroll a {
	display:inline-block;
	white-space:nowrap;
	padding:0 18px;
	height:60px;
	line-height:60px;
	color:#fff;
	transition:all 0.3s
}
#prod .cate .main .tops .scroll a:hover, #prod .cate .main .tops .scroll a.active {
	background-color:#fff;
	color:#01327e
}
#prod .cate .main .tops .scroll a:first-child {
	margin-left:20px
}
#prod .cate .main .tops .scroll a:last-child {
	margin-right:20px
}
#prod .cate .main .bots {
	width:100%;
	display:block
}
#prod .cate .main .bots .scroll {
	display:none;
	padding:20px 10px
}
#prod .cate .main .bots .scroll a {
	display:inline-block;
	white-space:nowrap;
	margin-left:20px;
	height:30px;
	line-height:30px;
	transition:all 0.3s
}
#prod .cate .main .bots .scroll a:hover, #prod .cate .main .bots .scroll a.active {
	color:#01327e
}
#prod .cate .main .bots .scroll a:last-child {
	margin-right:40px
}
#prod .cate .main .bots .scroll.flex {
	display:flex !important
}
#prod .cate .main .bots .scroll.block {
	display:block !important
}
#prod .prod-tip {
	width:100%;
	background-color:#f2f4f5;
	margin-top:20px
}
#prod .prod-tip .main {
	background-color:#fff;
	padding:25px 35px;
	font-size:14px;
	line-height:24px
}
#prod .prod-list {
	width:100%;
	background-color:#f2f4f5
}
#prod .prod-list .item {
	width:100%;
	padding:20px;
	background-color:#fff;
	margin-top:10px;
	display:flex
}
#prod .prod-list .item .img {
	width:240px;
	height:240px;
	flex-shrink:0
}
#prod .prod-list .item .img img {
	width:100%;
	height:100%
}
#prod .prod-list .item .rights {
	width:calc(100% - 270px);
	margin-left:30px
}
#prod .prod-list .item .rights .title {
	font-size:20px;
	margin-top:15px
}
#prod .prod-list .item .rights .desc {
	font-size:14px;
	line-height:24px;
	margin-top:10px
}
#prod .prod-list .item .rights .bots {
	width:100%;
	display:flex;
	justify-content:space-between;
	align-items:flex-end;
	margin-top:40px
}
#prod .prod-list .item .rights .bots .labels {
	width:calc(100% - 100px);
	overflow:hidden
}
#prod .prod-list .item .rights .bots .labels .label {
	float:left;
	margin-right:80px;
	margin-top:5px
}
#prod .prod-list .item .rights .bots .more {
	display:block;
	width:100px;
	height:30px;
	line-height:30px;
	text-align:center;
	background-color:#d3eeff;
	border-radius:15px;
	color:#01327e
}
#prod .prod-list .item .rights .contact {
	width:100%;
	border-top:1px solid #ddd;
	margin-top:15px
}
#prod .prod-list .item .rights .contact .tact-item {
	margin-top:20px;
	display:inline-flex;
	align-items:center;
	flex-wrap:wrap;
	margin-right:50px
}
#prod .prod-list .item .rights .contact .tact-item .qq {
	display:flex;
	align-items:center;
	justify-content:center;
	width:100px;
	height:30px;
	background-color:#cc0001;
	border-radius:15px;
	white-space:nowrap;
	flex-shrink:0;
	margin-right:10px
}
#prod .prod-list .item .rights .contact .tact-item .qq.ismobile {
	display:none
}
#prod .prod-list .item .rights .contact .tact-item .qq i {
	font-size:16px;
	color:#fff
}
#prod .prod-list .item .rights .contact .tact-item .qq span {
	font-size:12px;
	margin-left:6px;
	color:#fff
}
#prod .prod-list .item .rights .contact .tact-item .name {
	margin-right:10px;
	height:30px;
	line-height:30px;
	white-space:nowrap;
	flex-shrink:0
}
#prod .prod-list .item .rights .contact .tact-item .name img {
	height:100%
}
#prod .prod-list .item .rights .contact .tact-item .name span {
	margin-left:4px
}
#prod .prod-list .item .rights .contact .tact-item .tel {
	font-size:18px;
	height:30px;
	line-height:30px;
	font-family:'DIN';
	white-space:nowrap;
	flex-shrink:0
}
#prod .prod-list .item .rights .contact .tact-item .tel span {
	margin-right:10px
}
#prod .hot {
	width:100%;
	margin-top:30px;
	margin-bottom:20px
}
#prod .hot .main {
	display:flex
}
#prod .hot .label {
	flex-shrink:0;
	white-space:nowrap;
	margin-top:10px;
	height:16px;
	line-height:16px
}
#prod .hot .links {
	width:100%;
	overflow:hidden
}
#prod .hot .links a {
	float:left;
	padding:0 14px;
	height:16px;
	line-height:16px;
	border-right:1px solid #333;
	margin-top:10px
}
#prod .prob {
	width:100%;
	margin-top:20px;
	margin-bottom:100px
}
#prod .prob .main {
	background-color:#fff
}
#prod .prob .tops {
	width:100%;
	height:50px;
	padding:0 20px;
	line-height:50px;
	background-color:#d3eeff;
	font-size:16px
}
#prod .prob .list {
	width:100%;
	overflow:hidden;
	padding:20px
}
#prod .prob .list a {
	display:block;
	float:left;
	width:48%;
	height:34px;
	line-height:34px;
	margin-top:8px;
	border-bottom:1px solid #f2f4f5;
	padding:0 10px;
	margin-left:4%;
	transition:all 0.3s
}
#prod .prob .list a:nth-child(2n+1) {
margin-left:0
}
#prod .prob .list a:hover {
	color:#01327e
}
#prod_detail .main {
	padding:40px 110px 20px;
	background-color:#fff;
	display:flex
}
#prod_detail .main .gallary {
	width:405px;
	flex-shrink:0
}
#prod_detail .main .gallary .view {
	width:405px;
	height:405px;
	border:1px solid #ddd
}
#prod_detail .main .gallary .view img {
	width:100%;
	height:100%;
	cursor:pointer
}
#prod_detail .main .gallary .thumb {
	width:100%;
	margin-top:10px;
	height:100px;
	display:flex
}
#prod_detail .main .gallary .thumb .btn {
	width:30px;
	height:100%;
	background-color:#f2f4f5;
	color:#fff;
	display:flex;
	flex-shrink:0;
	align-items:center;
	justify-content:center;
	transition:all 0.3s
}
#prod_detail .main .gallary .thumb .btn i {
	font-size:12px
}
#prod_detail .main .gallary .thumb .btn:hover {
	background-color:#ebf7ff;
	color:#01327e
}
#prod_detail .main .gallary .thumb .swiper {
	width:calc(100% - 60px);
	padding:0 10px
}
#prod_detail .main .gallary .thumb .swiper .swiper-slide {
	width:100px;
	height:100px;
	border:1px solid #ddd;
	cursor:pointer
}
#prod_detail .main .gallary .thumb .swiper .swiper-slide img {
	width:100%;
	height:100%
}
#prod_detail .main .info {
	width:calc(100% - 405px);
	padding-left:50px
}
#prod_detail .main .info .title {
	width:100%;
	font-size:24px;
	font-weight:bold
}
#prod_detail .main .info .num {
	width:100%;
	position:relative;
	margin-top:10px
}
#prod_detail .main .info .num .view-num {
	color:#888;
	float:left
}
#prod_detail .main .info .num .share-btn {
	display:flex;
	align-items:center;
	width:100px;
	height:24px;
	float:right
}
#prod_detail .main .info .num .share-btn i {
	font-size:20px
}
#prod_detail .main .info .num .share-btn span {
	margin-left:10px
}
#prod_detail .main .info .num .share-block {
	display:none;
	width:77px;
	height:30px;
	line-height:30px;
	position:absolute;
	top:-30px;
	right:0;
	z-index:2
}
#prod_detail .main .info .num .share-block .bdsharebuttonbox {
	width:100%;
	height:100%;
	text-align:right
}
#prod_detail .main .info .title-line {
	width:100%;
	height:40px;
	background-color:#ebf7ff;
	padding:0 20px;
	font-size:18px;
	color:#01327e;
	line-height:40px;
	margin-top:18px
}
#prod_detail .main .info .desc {
	width:100%;
	height:155px;
	overflow-y:auto;
	margin-top:20px;
	line-height:24px
}
#prod_detail .main .info .btns {
	width:100%;
	max-width:500px;
	overflow:hidden
}
#prod_detail .main .info .btns a {
	display:block;
	width:32%;
	height:40px;
	line-height:40px;
	text-align:center;
	border:1px solid #ddd;
	transition:all 0.3s;
	float:left;
	margin-left:2%;
	margin-bottom:10px
}
#prod_detail .main .info .btns a:nth-child(3n+1) {
margin-left:0
}
#prod_detail .main .info .btns a:hover {
	background-color:#01327e;
	border-color:#01327e;
	color:#fff
}
#prod_detail .main .info>.bot {
	width:100%;
	overflow:hidden;
	border-top:1px solid #ddd;
	padding-top:20px;
	display:flex;
	align-items:flex-start
}
#prod_detail .main .info .contact {
	width:100%;
	float:left
}
#prod_detail .main .info .contact .tact-item {
	margin-top:14px;
	display:inline-flex;
	align-items:center;
	flex-wrap:wrap
}
#prod_detail .main .info .contact .tact-item .qq {
	display:flex;
	align-items:center;
	justify-content:center;
	width:100px;
	height:30px;
	background-color:#cc0001;
	border-radius:15px;
	white-space:nowrap;
	flex-shrink:0;
	margin-right:10px
}
#prod_detail .main .info .contact .tact-item .qq.ismobile {
	display:none
}
#prod_detail .main .info .contact .tact-item .qq i {
	font-size:16px;
	color:#fff
}
#prod_detail .main .info .contact .tact-item .qq span {
	font-size:12px;
	margin-left:6px;
	color:#fff
}
#prod_detail .main .info .contact .tact-item .name {
	margin-right:10px;
	height:30px;
	line-height:30px;
	white-space:nowrap;
	flex-shrink:0
}
#prod_detail .main .info .contact .tact-item .name img {
	height:100%
}
#prod_detail .main .info .contact .tact-item .name span {
	margin-left:4px
}
#prod_detail .main .info .contact .tact-item .tel {
	font-size:18px;
	height:30px;
	line-height:30px;
	font-family:'DIN';
	white-space:nowrap;
	flex-shrink:0
}
#prod_detail .main .info .contact .tact-item .tel span {
	margin-right:10px
}
#prod_detail .main .info .prev-next {
	padding-left:10%;
	display:inline-flex;
	float:right;
	flex-wrap:wrap
}
#prod_detail .main .info .prev-next a {
	width:100%;
	display:block;
	height:30px;
	line-height:30px;
	margin-top:14px;
	white-space:normal
}
#contents {
	margin-top:10px
}
#contents .main {
	overflow:hidden
}
#contents .scroll {
	width:calc(100% - 240px);
	float:left
}
#contents .scroll .scroll-item {
	margin-bottom:10px;
	background-color:#fff;
	padding:20px 110px 30px
}
#contents .scroll .title-line {
	width:100%;
	height:50px;
	background-color:#ebf7ff;
	padding:0 20px;
	font-size:18px;
	color:#01327e;
	line-height:50px
}
#contents .scroll .title-line a {
	display:block;
	width:100px;
	height:30px;
	line-height:30px;
	text-align:center;
	background-color:#01327e;
	color:#fff;
	border-radius:15px;
	float:right;
	margin-top:10px;
	font-size:14px
}
#contents .scroll .content {
	width:100%;
	padding:20px 0
}
#contents .scroll .content img {
	max-width:100%
}
#contents .scroll .down-list {
	width:100%;
	overflow:hidden
}
#contents .scroll .down-list .item {
	display:block;
	float:left;
	margin-left:2%;
	width:32%;
	margin-top:10px
}
#contents .scroll .down-list .item .img {
	width:100%;
	border:1px solid #ddd;
	transition:all 0.3s
}
#contents .scroll .down-list .item .img img {
	width:100%
}
#contents .scroll .down-list .item .img:hover {
	border-color:#01327e
}
#contents .scroll .down-list .item .title {
	font-size:14px;
	margin-top:6px
}
#contents .scroll .down-list .item:nth-child(3n+1) {
margin-left:0
}
#contents .scroll .case-list .item {
	display:block;
	width:100%;
	padding:20px;
	border:1px solid #d3eeff;
	margin-top:10px
}
#contents .scroll .case-list .item .title {
	font-size:18px
}
#contents .scroll .case-list .item .desc {
	line-height:28px
}
#contents .scroll .prob-list .item {
	display:block;
	width:100%;
	padding:20px 0;
	border-bottom:1px solid #d3eeff;
	margin-top:10px
}
#contents .scroll .prob-list .item .title {
	font-size:18px
}
#contents .scroll .prob-list .item .desc {
	line-height:28px
}
#contents .scroll .recom {
	width:100%;
	margin-top:10px;
	margin-bottom:100px
}
#contents .scroll .recom .title-line {
	width:100%;
	text-align:center;
	background-color:#d3eeff
}
#contents .scroll .recom .list {
	width:100%;
	overflow:hidden;
	margin-top:10px
}
#contents .scroll .recom .list .item {
	display:block;
	width:23.5%;
	margin-left:2%;
	margin-bottom:15px;
	float:left
}
#contents .scroll .recom .list .item .img {
	width:100%
}
#contents .scroll .recom .list .item .img img {
	width:100%
}
#contents .scroll .recom .list .item .title {
	width:100%;
	height:50px;
	line-height:50px;
	text-align:center;
	font-size:16px;
	background-color:#d3eeff
}
#contents .scroll .recom .list .item:nth-child(4n+1) {
margin-left:0
}
#contents .target {
	width:240px;
	border-left:1px solid #f2f4f5;
	background-color:#fff;
	float:right;
	padding:30px 60px
}
#contents .target .item {
	position:relative;
	display:flex;
	align-items:center;
	white-space:nowrap;
	margin-top:24px
}
#contents .target .item .icon {
	width:16px;
	height:16px;
	position:relative;
	flex-shrink:0
}
#contents .target .item .icon i {
	font-size:16px;
	position:absolute;
	top:0;
	left:0;
	transition:all 0.3s
}
#contents .target .item .icon .gray {
	z-index:1;
	opacity:1;
	color:#ddd
}
#contents .target .item .icon .blue {
	z-index:2;
	opacity:0;
	color:#01327e
}
#contents .target .item span {
	margin-left:13px
}
#contents .target .item:hover .icon .gray, #contents .target .item.active .icon .gray {
	opacity:0
}
#contents .target .item:hover .icon .blue, #contents .target .item.active .icon .blue {
	opacity:1
}
#contents .target .item:first-child {
	margin-top:0
}
#contents .target.s_fixed {
	position:fixed;
	top:210px;
	z-index:3
}
#search .search-box {
	width:100%;
	margin:40px 0 30px;
	height:54px;
	position:relative;
	z-index:9
}
#search .search-box .main {
	height:100%
}
#search .search-box .left {
	width:540px;
	max-width:38.57%;
	height:100%;
	display:inline-block;
	float:left;
	border:1px solid #e6e6e6;
	border-radius:2px
}
#search .search-box .left .select {
	display:inline-block;
	float:left;
	width:90px;
	height:100%;
	padding:0 10px 0 0;
	position:relative
}
#search .search-box .left .select>span {
	display:block;
	width:100%;
	height:100%;
	line-height:54px;
	font-size:18px;
	padding:0 14px 0 14px;
	background-image:url("../img/67.png");
	background-position:right center;
	background-repeat:no-repeat;
	cursor:pointer
}
#search .search-box .left .select .sub {
	width:100%;
	position:absolute;
	top:55px;
	left:0;
	border:1px solid #e6e6e6;
	background-color:#fff;
	z-index:99;
	display:none
}
#search .search-box .left .select .sub span {
	display:block;
	width:100%;
	text-align:center;
	height:30px;
	line-height:30px;
	transition:all 0.3s;
	cursor:pointer
}
#search .search-box .left .select .sub span:hover, #search .search-box .left .select .sub span.active {
	background-color:#01327e;
	color:#fff
}
#search .search-box .left .input {
	display:inline-block;
	float:left;
	width:calc(100% - 90px);
	height:100%;
	border-left:1px solid #e6e6e6
}
#search .search-box .left .input input {
	width:100%;
	height:100%;
	padding:0 10px;
	border:none;
	background-color:#fff;
	border-radius:0;
	font-size:18px
}
#search .search-box .btn {
	display:inline-block;
	float:left
}
#search .search-box .btn button {
	width:117px;
	height:54px;
	background-color:#01327e;
	border:none;
	color:#fff;
	font-size:18px;
	display:flex;
	align-items:center;
	justify-content:center;
	cursor:pointer
}
#search .search-box .btn button span {
	display:inline-block;
	line-height:18px
}
#search .search-box .btn button i {
	display:inline-block;
	width:24px;
	height:24px;
	background-image:url("../img/66.png");
	background-size:100% 100%;
	margin-left:5px
}
#search .search-result {
	width:100%;
	padding-bottom:50px
}
#search .search-result .item {
	width:100%;
	padding:24px 0;
	border-bottom:1px solid #e6e6e6
}
#search .search-result .item .title {
	width:100%;
	line-height:16px;
	font-size:16px;
	display:flex;
	align-items:center
}
#search .search-result .item .title i {
	display:inline-block;
	width:4px;
	height:4px;
	background-color:#01327e;
	margin-right:10px
}
#search .search-result .item .title p {
	display:inline-block;
	width:calc(100% - 14px)
}
#search .search-result .item .date {
	width:100%;
	font-size:14px;
	line-height:14px;
	color:#999;
	margin-top:10px;
	padding-left:14px
}
#search .search-result .pages {
	margin-top:50px
}
#search .load-more {
	margin-bottom:100px
}
@media screen and (max-width: 1440px) {
#about .about .texts {
padding-left:calc(6vw / 2)
}
#calc .main .calc-line .item .block .input .label {
height:40px
}
}
@media screen and (max-width: 1366px) {
#sample {
margin-top:20px
}
#sample .item {
display:flex;
align-items:center;
width:49%;
background-color:#fff;
float:left;
margin-left:2%;
margin-bottom:20px;
padding:20px 10px
}
#sample .item .img {
width:120px;
height:80px;
flex-shrink:0
}
#sample .item .img img {
width:100%;
height:100%
}
#sample .item .rights {
width:calc(100% - 120px);
padding-left:30px
}
#sample .item .rights .date {
color:#888;
font-family:'DIN'
}
#sample .item .rights .name {
display:block;
font-size:16px;
line-height:18px;
margin-top:5px
}
#sample .item .rights .btn {
display:inline-block;
width:100px;
height:30px;
border-radius:15px;
line-height:30px;
text-align:center;
background-color:#d3eeff;
color:#01327e;
font-family:'DIN';
margin-top:12px
}
#sample .item:nth-child(3n+1) {
margin-left:2%
}
#sample .item:nth-child(2n+1) {
margin-left:0
}
#sample .load-more {
margin-top:40px;
margin-bottom:60px
}
#news .list {
width:100%;
background-color:#fff
}
#news .list .item {
width:100%;
height:260px;
padding:30px 0;
transition:all 0.3s
}
#news .list .item .main {
width:94%
}
#news .list .item a {
display:flex;
align-items:center;
width:100%;
height:100%
}
#news .list .item .img {
width:320px;
height:200px;
flex-shrink:0
}
#news .list .item .img img {
width:100%;
height:100%
}
#news .list .item .date {
width:70px;
text-align:center;
white-space:nowrap;
transition:all 0.3s;
flex-shrink:0;
margin:0 30px 0 70px
}
#news .list .item .date .day {
font-size:56px;
font-weight:bold;
font-family:'DIN';
line-height:56px
}
#news .list .item .date .mon {
font-size:16px;
font-family:'DIN'
}
#news .list .item .texts {
width:calc(100% - 670px)
}
#news .list .item .texts .title {
font-size:28px;
font-weight:bold;
transition:all 0.3s
}
#news .list .item .texts .desc {
line-height:28px;
margin-top:10px
}
#news .list .item .btn {
width:100px;
height:30px;
border-radius:15px;
line-height:30px;
text-align:center;
background-color:#01327e;
color:#fff;
font-family:'DIN';
opacity:0;
transition:all 0.3s;
margin-left:80px
}
#news .list .item:hover {
background-color:#d3eeff
}
#news .list .item:hover .date {
color:#01327e
}
#news .list .item:hover .texts .title {
color:#01327e
}
#news .list .item:hover .btn {
opacity:1
}
#news .load-more {
margin-top:60px;
margin-bottom:60px
}
#calc {
margin-top:20px;
margin-bottom:60px
}
#calc .main {
background-color:#fff;
padding:60px 60px
}
#calc .main .calc-lines {
margin-top:60px
}
#calc .main .calc-line {
display:flex;
justify-content:space-between;
align-items:stretch;
margin-bottom:30px
}
#calc .main .calc-line .item {
width:47.5%
}
#calc .main .calc-line .item .title {
width:100%;
height:50px;
line-height:50px;
padding:0 30px;
background-color:#d3eeff;
font-size:18px
}
#calc .main .calc-line .item .tops {
width:100%;
height:45px;
border-bottom:1px solid #ddd;
line-height:45px;
font-size:16px;
font-weight:500;
margin-top:20px
}
#calc .main .calc-line .item .block {
margin:20px 0
}
#calc .main .calc-line .item .block .input {
width:100%
}
#calc .main .calc-line .item .block .input .label {
width:100%;
font-size:14px
}
#calc .main .calc-line .item .block .input input {
width:100%;
height:40px;
border:1px solid #ddd;
margin-top:8px;
padding:0 10px
}
#calc .main .calc-line .item .block .input input[readonly] {
background-color:#f2f4f5;
border-color:#f2f4f5;
color:#01327e
}
#calc .main .calc-line .item .block .input select {
width:100%;
height:40px;
border:1px solid #ddd;
margin-top:8px;
padding:0 10px
}
#calc .main .calc-line .item .block1 {
width:100%;
display:flex;
justify-content:space-between;
align-items:stretch
}
#calc .main .calc-line .item .block1 .left {
width:45%
}
#calc .main .calc-line .item .block1 .left .img {
width:100%
}
#calc .main .calc-line .item .block1 .left .img img {
width:100%
}
#calc .main .calc-line .item .block1 .left .inputs {
width:100%;
display:flex;
justify-content:space-between;
margin-top:29px
}
#calc .main .calc-line .item .block1 .left .inputs .input {
width:45%;
max-width:100px
}
#calc .main .calc-line .item .block1 .right {
width:45%;
display:flex;
flex-direction:column;
justify-content:flex-end
}
#calc .main .calc-line .item .block1 .right .input {
margin-top:35px
}
#calc .main .calc-line .item .block2 {
width:100%;
display:flex;
justify-content:space-between
}
#calc .main .calc-line .item .block2 .input {
width:45%
}
#calc .main .calc-line .item .block2 .icon {
width:10%;
text-align:center
}
#calc .main .calc-line .item .block3 {
width:100%;
display:flex;
justify-content:space-between;
align-items:stretch
}
#calc .main .calc-line .item .block3 .left {
width:45%
}
#calc .main .calc-line .item .block3 .left .img {
width:100%
}
#calc .main .calc-line .item .block3 .left .img img {
width:100%
}
#calc .main .calc-line .item .block3 .left .inputs {
width:100%;
display:flex;
justify-content:space-between;
margin-top:29px
}
#calc .main .calc-line .item .block3 .left .inputs .input {
width:45%;
max-width:100px
}
#calc .main .calc-line .item .block3 .right {
width:45%;
display:flex;
flex-direction:column
}
#calc .main .calc-line .item .block3 .right .input {
margin-bottom:20px
}
#calc .main .calc-line .item .block4 {
width:100%
}
#calc .main .calc-line .item .block4 .img {
width:100%
}
#calc .main .calc-line .item .block4 .img img {
width:100%
}
#calc .main .calc-line .item .block4 .inputs {
width:100%;
display:flex;
margin-top:29px
}
#calc .main .calc-line .item .block4 .inputs .input {
width:30%;
max-width:100px;
margin-left:5%
}
#calc .main .calc-line .item .block4 .inputs .input:first-child {
margin-left:0
}
#calc .main .calc-line .item .block5 {
width:100%;
display:flex
}
#calc .main .calc-line .item .block5 .input {
width:30%;
margin-left:5%
}
#calc .main .calc-line .item .block5 .input:nth-child(3n+1) {
margin-left:0
}
#calc .main .table {
width:100%;
margin-top:60px
}
#calc .main .table table {
width:100%;
border:1px solid #ddd
}
#calc .main .table table th {
height:50px;
background-color:#d3eeff;
font-size:16px;
text-align:center;
padding:0 10px
}
#calc .main .table table td {
padding:10px 20px
}
#calc .main .table table td .goods {
display:flex;
align-items:center
}
#calc .main .table table td .goods img {
width:60px;
height:60px
}
#calc .main .table table td .goods span {
margin-left:20px
}
#calc .main .table table tbody tr {
transition:all 0.3s
}
#calc .main .table table tbody tr:hover {
background-color:#f4fbff
}
#index .banner {
width:100%;
height:460px
}
#index .banner .swiper-slide {
height:100%;
overflow:hidden;
background-size:cover;
background-position:center
}
#index .banner .swiper-slide img {
height:auto;
width:auto;
opacity:0
}
#index .floor-top {
display:flex;
justify-content:space-between;
align-items:flex-end
}
#index .floor-top .tab {
display:flex
}
#index .floor-top .tab a {
margin-left:55px;
font-size:18px;
transition:all 0.3s
}
#index .floor-top .tab a:hover, #index .floor-top .tab a.active {
color:#01327e
}
#index .mod-title {
display:inline-block
}
#index .mod-title i {
display:block;
width:40px;
height:4px;
background-color:#01327e
}
#index .mod-title .cn {
display:block;
width:100%;
font-size:26px;
font-weight:bold;
line-height:26px;
margin-top:24px;
white-space:nowrap
}
#index .mod-title .en {
display:block;
width:100%;
font-size:20px;
font-family:'Arial';
text-transform:uppercase;
line-height:20px;
margin-top:12px;
white-space:nowrap
}
#index .more {
display:inline-flex;
align-items:center;
font-family:'DIN';
font-weight:bold;
font-size:14px;
transition:all 0.3s
}
#index .more i {
margin-left:6px;
height:14px;
line-height:14px;
transition:all 0.3s
}
#index .more:hover i {
transform:rotate(90deg)
}
#index .floor1 {
width:100%;
padding:60px 0 70px;
background-color:#fff
}
#index .floor1 .items {
width:100%;
margin-top:40px;
display:flex;
justify-content:space-between
}
#index .floor1 .items .item {
display:block;
width:24%;
background-color:#f2f4f5;
border:1px solid #f2f4f5;
transition:all 0.3s
}
#index .floor1 .items .item .img {
width:100%;
height:auto
}
#index .floor1 .items .item .img img {
width:100%;
height:auto
}
#index .floor1 .items .item .text {
width:100%;
padding:25px 30px
}
#index .floor1 .items .item .text .title {
font-size:20px;
line-height:24px;
margin-bottom:20px
}
#index .floor1 .items .item .text .desc-line {
line-height:16px;
color:#888;
margin-top:10px
}
#index .floor1 .items .item:hover {
background-color:#fff;
border-color:#01327e
}
#index .floor2 {
width:100%;
padding:60px 0 70px;
background-color:#ebedef
}
#index .floor2 .blocks {
width:100%
}
#index .floor2 .items {
width:100%;
margin-top:40px;
display:none;
justify-content:space-between
}
#index .floor2 .items.active {
display:flex
}
#index .floor2 .items .item {
display:inline-flex;
align-items:center;
width:32.5%;
background-color:#fff
}
#index .floor2 .items .item .img {
width:180px;
flex-shrink:0
}
#index .floor2 .items .item .img img {
width:180px
}
#index .floor2 .items .item .text {
width:calc(100% - 180px);
padding:20px 20px
}
#index .floor2 .items .item .text .title {
font-size:16px;
line-height:24px;
margin-bottom:20px
}
#index .floor2 .items .item .text .desc-line {
line-height:14px;
color:#888;
margin-top:10px
}
#index .floor2 .items .item:hover {
background-color:#fff;
border-color:#01327e
}
#index .floor3 {
width:100%;
padding:60px 0 50px;
background-color:#fff
}
#index .floor3 .items {
width:100%;
margin-top:40px;
display:flex;
flex-wrap:wrap;
justify-content:space-between
}
#index .floor3 .items .item {
width:32.5%;
margin-left:1.25%;
margin-bottom:20px;
position:relative
}
#index .floor3 .items .item:nth-child(3n+1) {
margin-left:0
}
#index .floor3 .items .item .img {
width:100%;
height:auto
}
#index .floor3 .items .item .img img {
width:100%;
height:auto;
-webkit-filter:grayscale(100%);
-moz-filter:grayscale(100%);
-ms-filter:grayscale(100%);
-o-filter:grayscale(100%);
filter:grayscale(100%);
filter:gray;
transform:all 0.3s
}
#index .floor3 .items .item i.mask {
width:100%;
height:100%;
position:absolute;
top:0;
left:0;
background-color:transparent;
transition:all 0.3s
}
#index .floor3 .items .item .con {
width:100%;
text-align:center;
position:absolute;
top:50%;
left:0;
margin-top:-40px;
color:#fff;
opacity:0;
transition:all 0.3s
}
#index .floor3 .items .item .con i {
display:block;
font-size:58px;
margin:0 auto
}
#index .floor3 .items .item .con span {
font-size:20px;
margin-top:20px
}
#index .floor3 .items .item:hover .img img {
-webkit-filter:grayscale(0);
-moz-filter:grayscale(0);
-ms-filter:grayscale(0);
-o-filter:grayscale(0);
filter:grayscale(0);
filter:gray
}
#index .floor3 .items .item:hover i.mask {
background-color:rgba(0, 0, 0, 0.3)
}
#index .floor3 .items .item:hover .con {
opacity:1
}
#index .about {
width:100%;
position:relative;
padding:60px 0 20px;
background-color:#ebedef
}
#index .about .img {
width:100%;
padding-left:calc((100% - 1660px) / 2)
}
#index .about .img img {
width:100%;
height:auto
}
#index .about .texts {
width:40.6%;
padding:40px 70px 40px 40px;
padding-left:40px;
position:absolute;
top:calc(50% + 20px);
left:0;
z-index:3;
transform:translateY(-50%);
background-color:#fff
}
#index .about .texts .logo {
height:40px
}
#index .about .texts .logo img {
height:40px
}
#index .about .texts .name {
font-size:24px;
font-weight:bold;
margin-top:24px
}
#index .about .texts .desc {
font-size:14px;
line-height:28px;
margin-top:24px
}
#index .thumb {
width:100%;
padding:0 0 120px;
background-color:#ebedef;
position:relative
}
#index .thumb .swiper {
width:100%;
height:auto;
position:relative;
z-index:1
}
#index .thumb .swiper .swiper-slide img {
width:100%;
height:auto;
-webkit-filter:grayscale(100%);
-moz-filter:grayscale(100%);
-ms-filter:grayscale(100%);
-o-filter:grayscale(100%);
filter:grayscale(100%);
filter:gray;
transform:all 0.3s
}
#index .thumb .swiper .swiper-slide.swiper-slide-active img {
-webkit-filter:grayscale(0);
-moz-filter:grayscale(0);
-ms-filter:grayscale(0);
-o-filter:grayscale(0);
filter:grayscale(0);
filter:gray
}
#index .thumb .bar {
width:94%;
max-width:800px;
height:100px;
overflow:hidden;
position:absolute;
left:50%;
bottom:60px;
z-index:3;
transform:translateX(-50%);
background-color:#fff;
padding:20px 30px 20px 40px;
display:flex;
justify-content:space-between;
align-items:center
}
#index .thumb .bar .t-swiper {
width:calc(100% - 130px);
height:100%
}
#index .thumb .bar .t-swiper .swiper-slide {
height:60px
}
#index .thumb .bar .t-swiper .swiper-slide .flex {
display:flex;
align-items:center
}
#index .thumb .bar .t-swiper .swiper-slide .flex .icon {
width:60px;
height:60px;
color:#01327e
}
#index .thumb .bar .t-swiper .swiper-slide .flex .icon i {
font-size:60px;
height:60px
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text {
margin-left:20px
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text .big {
font-size:20px;
line-height:20px;
font-weight:bold
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text .small {
line-height:14px;
margin-top:10px
}
#index .thumb .bar .navigation {
width:130px;
display:flex;
justify-content:space-between;
align-items:center
}
#index .thumb .bar .navigation i {
font-size:20px;
transition:all 0.3s
}
#index .thumb .bar .navigation i:hover {
color:#01327e
}
#index .thumb .bar .navigation .c-page {
font-size:20px
}
#index .thumb .bar .navigation .c-page #current {
font-size:30px;
color:#01327e
}
#index .study {
width:100%;
padding:60px 0 40px;
background-color:#fff
}
#index .study .items {
width:100%;
margin-top:40px;
display:flex;
justify-content:space-between
}
#index .study .items .mod {
width:100%;
height:40px;
padding:0 20px;
display:flex;
justify-content:space-between;
align-items:center;
background-color:#01327e;
color:#fff
}
#index .study .items .mod>span {
font-size:18px
}
#index .study .items .mod .more {
display:inline-flex;
align-items:center;
font-family:'DIN';
font-weight:bold;
font-size:14px;
color:#fff;
transition:all 0.3s
}
#index .study .items .mod .more i {
margin-left:6px;
height:14px;
line-height:14px;
transition:all 0.3s
}
#index .study .items .mod .more:hover i {
transform:rotate(90deg)
}
#index .study .items>.item {
width:36%;
margin-right:3.2%
}
#index .study .items>.item ul {
margin-top:20px
}
#index .study .items>.item li {
width:100%;
height:50px;
border-bottom:1px solid #f2f4f5;
line-height:50px
}
#index .study .items>.item li a {
display:block;
width:100%;
transition:all 0.3s
}
#index .study .items>.item li a:hover {
color:#01327e
}
#index .study .items>.shorts {
width:21.6%
}
#index .study .items>.shorts .type1 li {
height:50px
}
#index .study .items>.shorts .type1 li img {
width:24px
}
#index .study .items>.shorts .type1 li a {
width:calc(100% - 36px)
}
#index .study .items>.shorts .type2 {
margin-top:40px
}
#index .study .items>.shorts .type2 li {
height:70px;
margin-top:10px
}
#index .study .items>.shorts .type2 li img {
width:50px
}
#index .study .items>.shorts .type2 li a {
width:calc(100% - 62px)
}
#index .study .items>.shorts .type2 li:first-child {
margin-top:0
}
#index .study .items>.shorts ul {
margin-top:20px
}
#index .study .items>.shorts li {
width:100%;
border-bottom:1px solid #f2f4f5;
display:flex;
align-items:center;
overflow:hidden
}
#index .study .items>.shorts li img {
flex-shrink:0;
margin-right:12px
}
#index .study .items>.shorts li .text {
width:100%
}
#index .study .items>.shorts li a {
display:block;
transition:all 0.3s
}
#index .study .items>.shorts li a:hover {
color:#01327e
}
#index .news {
width:100%;
padding:60px 0 40px;
background-color:#ebedef
}
#index .news .news-block {
width:100%;
margin-top:40px;
display:flex;
align-items:stretch;
justify-content:space-between
}
#index .news .news-block .img {
width:38.5%;
background-position:center;
background-size:cover
}
#index .news .news-block ul {
width:60%;
background-color:#fff;
padding:0 90px
}
#index .news .news-block ul li {
width:100%;
padding:30px 0 30px;
border-bottom:1px solid #f2f4f5
}
#index .news .news-block ul li a {
display:flex;
align-items:center
}
#index .news .news-block ul li a .date {
width:70px;
text-align:center;
white-space:nowrap;
transition:all 0.3s;
flex-shrink:0
}
#index .news .news-block ul li a .date .day {
font-size:56px;
font-weight:bold;
font-family:'DIN';
line-height:56px
}
#index .news .news-block ul li a .date .mon {
font-size:16px;
font-family:'DIN'
}
#index .news .news-block ul li a .text {
width:100%;
margin-left:40px
}
#index .news .news-block ul li a .text .title {
font-size:18px;
font-weight:bold;
transition:all 0.3s
}
#index .news .news-block ul li a .text .desc {
width:100%;
line-height:28px;
color:#888;
margin-top:10px;
transition:all 0.3s
}
#index .news .news-block ul li a:hover .date, #index .news .news-block ul li a.active .date {
color:#01327e
}
#index .news .news-block ul li a:hover .text .title, #index .news .news-block ul li a.active .text .title {
color:#01327e
}
#index .news .news-block ul li a:hover .text .desc, #index .news .news-block ul li a.active .text .desc {
color:#333
}
#index .news .case-block {
width:100%;
display:flex;
justify-content:space-between;
flex-wrap:wrap
}
#index .news .case-block .item {
display:block;
width:calc(50% - 10px);
margin-left:20px;
margin-top:20px;
background-color:#fff;
padding:40px 30px 30px;
border-bottom:1px solid #fff;
transition:all 0.3s
}
#index .news .case-block .item .title {
font-size:18px;
font-weight:bold;
transition:all 0.3s
}
#index .news .case-block .item .desc {
width:100%;
line-height:28px;
color:#888;
margin-top:10px;
transition:all 0.3s
}
#index .news .case-block .item:hover {
border-color:#01327e
}
#index .news .case-block .item:hover .title {
color:#01327e
}
#index .news .case-block .item:hover .desc {
color:#333
}
#index .news .case-block .item:nth-child(2n+1) {
margin-left:0
}
#index .contact {
width:100%;
background-image:url(../img/22.png);
background-position:center;
background-size:cover;
padding:140px 0 120px;
text-align:center
}
#index .contact .big {
font-size:48px;
font-weight:bold;
color:#fff
}
#index .contact .small {
font-size:32px;
font-weight:bold;
color:#fff;
margin-top:10px
}
#index .contact .btn {
display:block;
width:200px;
height:50px;
background-color:#fff;
border-radius:25px;
line-height:50px;
text-align:center;
font-size:16px;
color:#01327e;
margin:50px auto 0
}
#prod_detail .main {
padding:40px 60px 20px;
display:flex
}
#prod_detail .main .gallary {
width:405px;
flex-shrink:0
}
#prod_detail .main .gallary .view {
width:405px;
height:405px;
border:1px solid #ddd
}
#prod_detail .main .gallary .view img {
width:100%;
height:100%;
cursor:pointer
}
#prod_detail .main .gallary .thumb {
width:100%;
margin-top:10px;
height:100px;
display:flex
}
#prod_detail .main .gallary .thumb .btn {
width:30px;
height:100%;
background-color:#f2f4f5;
color:#fff;
display:flex;
flex-shrink:0;
align-items:center;
justify-content:center;
transition:all 0.3s
}
#prod_detail .main .gallary .thumb .btn i {
font-size:12px
}
#prod_detail .main .gallary .thumb .btn:hover {
background-color:#ebf7ff;
color:#01327e
}
#prod_detail .main .gallary .thumb .swiper {
width:calc(100% - 60px);
padding:0 10px
}
#prod_detail .main .gallary .thumb .swiper .swiper-slide {
width:100px;
height:100px;
border:1px solid #ddd;
cursor:pointer
}
#prod_detail .main .gallary .thumb .swiper .swiper-slide img {
width:100%;
height:100%
}
#prod_detail .main .info {
width:calc(100% - 405px);
padding-left:50px
}
#prod_detail .main .info .title {
width:100%;
font-size:24px;
font-weight:bold
}
#prod_detail .main .info .num {
width:100%;
position:relative;
margin-top:10px
}
#prod_detail .main .info .num .view-num {
color:#888;
float:left
}
#prod_detail .main .info .num .share-btn {
display:flex;
align-items:center;
width:100px;
height:24px;
float:right
}
#prod_detail .main .info .num .share-btn i {
font-size:20px
}
#prod_detail .main .info .num .share-btn span {
margin-left:10px
}
#prod_detail .main .info .num .share-block {
display:none;
width:77px;
height:30px;
line-height:30px;
position:absolute;
top:-30px;
right:0;
z-index:2
}
#prod_detail .main .info .num .share-block .bdsharebuttonbox {
width:100%;
height:100%;
text-align:right
}
#prod_detail .main .info .title-line {
width:100%;
height:40px;
background-color:#ebf7ff;
padding:0 20px;
font-size:18px;
color:#01327e;
line-height:40px;
margin-top:18px
}
#prod_detail .main .info .desc {
width:100%;
height:155px;
overflow-y:auto;
margin-top:20px;
line-height:24px
}
#prod_detail .main .info .btns {
width:100%;
max-width:500px;
overflow:hidden
}
#prod_detail .main .info .btns a {
display:block;
width:32%;
height:40px;
line-height:40px;
text-align:center;
border:1px solid #ddd;
transition:all 0.3s;
float:left;
margin-left:2%;
margin-bottom:10px
}
#prod_detail .main .info .btns a:nth-child(3n+1) {
margin-left:0
}
#prod_detail .main .info .btns a:hover {
background-color:#01327e;
border-color:#01327e;
color:#fff
}
#prod_detail .main .info>.bot {
width:100%;
overflow:hidden;
border-top:1px solid #ddd;
padding-top:20px
}
#prod_detail .main .info .contact {
width:63%;
float:left
}
#prod_detail .main .info .contact .tact-item {
margin-top:14px;
display:inline-flex;
align-items:center;
flex-wrap:wrap
}
#prod_detail .main .info .contact .tact-item .qq {
display:flex;
align-items:center;
justify-content:center;
width:100px;
height:30px;
background-color:#cc0001;
border-radius:15px;
white-space:nowrap;
flex-shrink:0;
margin-right:10px
}
#prod_detail .main .info .contact .tact-item .qq i {
font-size:16px;
color:#fff
}
#prod_detail .main .info .contact .tact-item .qq span {
font-size:12px;
margin-left:6px;
color:#fff
}
#prod_detail .main .info .contact .tact-item .name {
margin-right:10px;
height:30px;
line-height:30px;
white-space:nowrap;
flex-shrink:0
}
#prod_detail .main .info .contact .tact-item .name img {
height:100%
}
#prod_detail .main .info .contact .tact-item .name span {
margin-left:4px
}
#prod_detail .main .info .contact .tact-item .tel {
font-size:18px;
height:30px;
line-height:30px;
font-family:'DIN';
white-space:nowrap;
flex-shrink:0
}
#prod_detail .main .info .contact .tact-item .tel span {
margin-right:10px
}
#prod_detail .main .info .prev-next {
float:right
}
#prod_detail .main .info .prev-next a {
width:100%;
display:block;
height:30px;
line-height:30px;
margin-top:14px
}
#contents {
margin-top:10px
}
#contents .main {
overflow:hidden
}
#contents .scroll {
width:calc(100% - 240px);
float:left
}
#contents .scroll .scroll-item {
margin-bottom:10px;
background-color:#fff;
padding:20px 60px 30px
}
#contents .scroll .title-line {
width:100%;
height:50px;
background-color:#ebf7ff;
padding:0 20px;
font-size:18px;
color:#01327e;
line-height:50px
}
#contents .scroll .title-line a {
display:block;
width:100px;
height:30px;
line-height:30px;
text-align:center;
background-color:#01327e;
color:#fff;
border-radius:15px;
float:right;
margin-top:10px;
font-size:14px
}
#contents .scroll .content {
width:100%;
padding:20px 0
}
#contents .scroll .content img {
max-width:100%
}
#contents .scroll .down-list {
width:100%;
overflow:hidden
}
#contents .scroll .down-list .item {
display:block;
float:left;
margin-left:2%;
width:32%;
margin-top:10px
}
#contents .scroll .down-list .item .img {
width:100%;
border:1px solid #ddd;
transition:all 0.3s
}
#contents .scroll .down-list .item .img img {
width:100%
}
#contents .scroll .down-list .item .img:hover {
border-color:#01327e
}
#contents .scroll .down-list .item .title {
font-size:14px;
margin-top:6px
}
#contents .scroll .down-list .item:nth-child(3n+1) {
margin-left:0
}
#contents .scroll .case-list .item {
display:block;
width:100%;
padding:20px;
border:1px solid #d3eeff;
margin-top:10px
}
#contents .scroll .case-list .item .title {
font-size:18px
}
#contents .scroll .case-list .item .desc {
line-height:28px
}
#contents .scroll .prob-list .item {
display:block;
width:100%;
padding:20px 0;
border-bottom:1px solid #d3eeff;
margin-top:10px
}
#contents .scroll .prob-list .item .title {
font-size:18px
}
#contents .scroll .prob-list .item .desc {
line-height:28px
}
#contents .scroll .recom {
width:100%;
margin-top:10px;
margin-bottom:100px
}
#contents .scroll .recom .title-line {
width:100%;
text-align:center;
background-color:#d3eeff
}
#contents .scroll .recom .list {
width:100%;
overflow:hidden;
margin-top:10px
}
#contents .scroll .recom .list .item {
display:block;
width:23.5%;
margin-left:2%;
float:left
}
#contents .scroll .recom .list .item .img {
width:100%
}
#contents .scroll .recom .list .item .img img {
width:100%
}
#contents .scroll .recom .list .item .title {
width:100%;
height:50px;
line-height:50px;
text-align:center;
font-size:16px;
background-color:#d3eeff
}
#contents .scroll .recom .list .item:nth-child(4n+1) {
margin-left:0
}
#contents .target {
width:240px;
border-left:1px solid #f2f4f5;
background-color:#fff;
float:right;
padding:30px 60px
}
#contents .target .item {
position:relative;
display:flex;
align-items:center;
white-space:nowrap;
margin-top:24px
}
#contents .target .item .icon {
width:16px;
height:16px;
position:relative;
flex-shrink:0
}
#contents .target .item .icon i {
font-size:16px;
position:absolute;
top:0;
left:0;
transition:all 0.3s
}
#contents .target .item .icon .gray {
z-index:1;
opacity:1;
color:#ddd
}
#contents .target .item .icon .blue {
z-index:2;
opacity:0;
color:#01327e
}
#contents .target .item span {
margin-left:13px
}
#contents .target .item:hover .icon .gray, #contents .target .item.active .icon .gray {
opacity:0
}
#contents .target .item:hover .icon .blue, #contents .target .item.active .icon .blue {
opacity:1
}
#contents .target .item:first-child {
margin-top:0
}
#contents .target.s_fixed {
position:absolute;
top:0;
right:0
}
}
@media screen and (max-width: 1200px) {
#about .about {
display:flex;
align-items:stretch;
background-color:#fff
}
#about .about .texts {
width:53%;
padding-left:calc(6vw / 2);
padding-top:50px;
padding-bottom:50px;
padding-right:50px
}
#about .about .texts .slogen {
font-size:24px;
font-weight:bold
}
#about .about .texts .content {
width:100%;
height:px;
overflow-x:hidden;
overflow-y:auto;
font-size:16px;
line-height:32px;
margin-top:30px;
-webkit-overflow-scrolling:touch
}
#about .about .texts .content img {
max-width:100%
}
#about .about .texts .content::-webkit-scrollbar {
width:6px;
height:6px;
background-color:#f5f5f5
}
#about .about .texts .content::-webkit-scrollbar-track {
border-radius:3px;
background-color:#f5f5f5
}
#about .about .texts .content::-webkit-scrollbar-thumb {
border-radius:3px;
background-color:#ddd
}
#about .about .texts .items {
width:100%;
display:flex;
justify-content:space-between;
margin-top:40px
}
#about .about .texts .items .item {
color:#01327e
}
#about .about .texts .items .item .en {
font-size:14px;
text-transform:uppercase
}
#about .about .texts .items .item .num {
font-size:50px;
line-height:40px
}
#about .about .texts .items .item .desc {
font-size:14px;
margin-top:10px
}
#about .about .img {
width:47%;
flex-shrink:0;
background-image:url(../img/33.png);
background-size:cover;
background-position:center;
position:relative;
display:flex;
align-items:center;
justify-content:center
}
#about .about .img i.play {
display:block;
width:54px;
height:54px;
background-image:url(../img/34.png);
background-size:100%;
cursor:pointer;
transition:all 0.3s
}
#about .about .img i.play:hover {
transform:scale(1.1)
}
#about .dev {
width:100%;
height:480px;
display:flex;
align-items:stretch;
border-top:1px solid #ddd
}
#about .dev .imgs {
width:450px;
height:480px;
position:relative;
flex-shrink:0
}
#about .dev .imgs .swiper {
width:100%;
height:100%
}
#about .dev .imgs .swiper .swiper-container {
height:100%
}
#about .dev .imgs .swiper .swiper-container .swiper-wrapper {
height:100%
}
#about .dev .imgs .swiper .swiper-container .swiper-wrapper .swiper-slide {
height:100%;
background-position:center;
background-size:cover
}
#about .dev .imgs .btns {
position:absolute;
top:50%;
right:0;
transform:translateY(-50%);
width:70px;
height:140px;
z-index:3
}
#about .dev .imgs .btns a {
display:block;
width:70px;
height:70px;
text-align:center;
line-height:70px
}
#about .dev .imgs .btns a i {
font-size:24px
}
#about .dev .imgs .btns a.prev {
background-color:#fff;
color:#01327e
}
#about .dev .imgs .btns a.next {
background-color:#01327e;
color:#fff
}
#about .dev .years {
width:calc(100% - 480px);
height:480px;
background-color:#fff;
overflow:hidden
}
#about .dev .years .swiper-container {
height:100%
}
#about .dev .years .swiper-container .swiper-wrapper {
height:100%
}
#about .dev .years .swiper-container .swiper-wrapper .swiper-slide {
width:420px;
height:100%;
padding:70px 70px 60px 80px;
border-right:1px solid #ddd
}
#about .dev .years .num {
font-size:40px;
font-family:'DIN';
transition:all 0.3s
}
#about .dev .years i {
display:block;
width:40px;
height:2px;
margin-top:25px;
background-color:#333;
transition:all 0.3s
}
#about .dev .years .content {
width:100%;
height:200px;
overflow-y:auto;
font-size:16px;
line-height:32px;
margin-top:50px;
-webkit-overflow-scrolling:touch
}
#about .dev .years .content::-webkit-scrollbar {
width:6px;
height:6px;
background-color:#f5f5f5
}
#about .dev .years .content::-webkit-scrollbar-track {
border-radius:3px;
background-color:#f5f5f5
}
#about .dev .years .content::-webkit-scrollbar-thumb {
border-radius:3px;
background-color:#ddd
}
#about .dev .years .content img {
max-width:100%
}
#about .dev .years .swiper-slide-active .num {
color:#01327e
}
#about .dev .years .swiper-slide-active i {
background-color:#01327e
}
#about .advantage {
width:100%;
padding:60px 0;
background-color:#f2f4f5
}
#about .advantage .item {
width:100%;
height:360px;
display:flex;
justify-content:space-between;
margin-bottom:10px
}
#about .advantage .item .swiper {
width:42.25%;
height:360px
}
#about .advantage .item .swiper .swiper-slide {
height:360px;
background-position:center;
background-size:cover
}
#about .advantage .item .texts {
width:57.75%;
height:100%;
padding:90px 80px;
background-color:#fff
}
#about .advantage .item .texts .title {
font-size:24px;
font-weight:bold
}
#about .advantage .item .texts .desc {
font-size:16px;
line-height:32px;
margin-top:20px
}
#about .advantage .item:nth-child(2n) {
flex-direction:row-reverse
}
#about .honor {
width:100%;
padding:90px 0
}
#about .honor .swiper-slide {
width:26.4%
}
#about .honor .swiper-slide img {
width:100%
}
#about .team {
width:100%
}
#about .team img {
width:100%
}
}
@media screen and (max-width: 1024px) {
#news .list .item {
width:100%;
height:auto;
padding:30px 0;
transition:all 0.3s
}
#news .list .item .main {
width:94%
}
#news .list .item a {
display:flex;
align-items:center;
width:100%;
height:100%
}
#news .list .item .img {
width:230px;
height:144px;
flex-shrink:0
}
#news .list .item .img img {
width:100%;
height:100%
}
#news .list .item .date {
width:70px;
text-align:center;
white-space:nowrap;
transition:all 0.3s;
flex-shrink:0;
margin:0 30px 0 30px
}
#news .list .item .date .day {
font-size:56px;
font-weight:bold;
font-family:'DIN';
line-height:56px
}
#news .list .item .date .mon {
font-size:16px;
font-family:'DIN'
}
#news .list .item .texts {
width:calc(100% - 490px)
}
#news .list .item .texts .title {
font-size:28px;
font-weight:bold;
transition:all 0.3s
}
#news .list .item .texts .desc {
line-height:28px;
margin-top:10px
}
#news .list .item .btn {
width:100px;
height:30px;
border-radius:15px;
line-height:30px;
opacity:1;
margin-left:30px
}
#news .list .item:hover {
background-color:#d3eeff
}
#news .list .item:hover .date {
color:#01327e
}
#news .list .item:hover .texts .title {
color:#01327e
}
#news .list .item:hover .btn {
opacity:1
}
#news .load-more {
margin-top:40px;
margin-bottom:40px
}
#calc {
margin-top:20px;
margin-bottom:30px
}
#calc .main {
background-color:#fff;
padding:30px 30px
}
#calc .main .calc-lines {
margin-top:60px
}
#calc .main .calc-line {
display:block;
margin-bottom:30px
}
#calc .main .calc-line .item {
width:100%
}
#calc .main .calc-line .item .title {
width:100%;
height:50px;
line-height:50px;
padding:0 30px;
background-color:#d3eeff;
font-size:18px
}
#calc .main .calc-line .item .tops {
width:100%;
height:45px;
border-bottom:1px solid #ddd;
line-height:45px;
font-size:16px;
font-weight:500;
margin-top:20px
}
#calc .main .calc-line .item .block {
margin:20px 0
}
#calc .main .calc-line .item .block .input {
width:100%
}
#calc .main .calc-line .item .block .input .label {
width:100%;
font-size:14px
}
#calc .main .calc-line .item .block .input input {
width:100%;
height:40px;
border:1px solid #ddd;
margin-top:8px;
padding:0 10px
}
#calc .main .calc-line .item .block .input input[readonly] {
background-color:#f2f4f5;
border-color:#f2f4f5;
color:#01327e
}
#calc .main .calc-line .item .block .input select {
width:100%;
height:40px;
border:1px solid #ddd;
margin-top:8px;
padding:0 10px
}
#calc .main .calc-line .item .block1 {
width:100%;
display:block
}
#calc .main .calc-line .item .block1 .left {
width:100%
}
#calc .main .calc-line .item .block1 .left .img {
width:100%
}
#calc .main .calc-line .item .block1 .left .img img {
width:100%
}
#calc .main .calc-line .item .block1 .left .inputs {
width:100%;
display:flex;
justify-content:space-between;
margin-top:29px
}
#calc .main .calc-line .item .block1 .left .inputs .input {
width:45%;
max-width:unset
}
#calc .main .calc-line .item .block1 .right {
width:100%;
display:flex;
flex-direction:column;
justify-content:flex-end
}
#calc .main .calc-line .item .block1 .right .input {
margin-top:35px
}
#calc .main .calc-line .item .block2 {
width:100%;
display:flex;
justify-content:space-between
}
#calc .main .calc-line .item .block2 .input {
width:45%
}
#calc .main .calc-line .item .block2 .icon {
width:10%;
text-align:center
}
#calc .main .calc-line .item .block3 {
width:100%;
display:flex;
justify-content:space-between;
align-items:stretch
}
#calc .main .calc-line .item .block3 .left {
width:45%
}
#calc .main .calc-line .item .block3 .left .img {
width:100%
}
#calc .main .calc-line .item .block3 .left .img img {
width:100%
}
#calc .main .calc-line .item .block3 .left .inputs {
width:100%;
display:flex;
justify-content:space-between;
margin-top:29px
}
#calc .main .calc-line .item .block3 .left .inputs .input {
width:45%;
max-width:100px
}
#calc .main .calc-line .item .block3 .right {
width:45%;
display:flex;
flex-direction:column
}
#calc .main .calc-line .item .block3 .right .input {
margin-bottom:20px
}
#calc .main .calc-line .item .block4 {
width:100%
}
#calc .main .calc-line .item .block4 .img {
width:100%
}
#calc .main .calc-line .item .block4 .img img {
width:100%
}
#calc .main .calc-line .item .block4 .inputs {
width:100%;
display:flex;
margin-top:29px
}
#calc .main .calc-line .item .block4 .inputs .input {
width:30%;
max-width:100px;
margin-left:5%
}
#calc .main .calc-line .item .block4 .inputs .input:first-child {
margin-left:0
}
#calc .main .calc-line .item .block5 {
width:100%;
display:flex
}
#calc .main .calc-line .item .block5 .input {
width:30%;
margin-left:5%
}
#calc .main .calc-line .item .block5 .input:nth-child(3n+1) {
margin-left:0
}
#calc .main .table {
width:100%;
margin-top:60px;
overflow-x:auto
}
#calc .main .table table {
width:auto;
border:1px solid #ddd
}
#calc .main .table table th {
height:50px;
background-color:#d3eeff;
font-size:16px;
text-align:center;
padding:0 10px
}
#calc .main .table table td {
padding:10px 20px
}
#calc .main .table table td .goods {
display:block;
align-items:center
}
#calc .main .table table td .goods img {
width:60px;
height:60px
}
#calc .main .table table td .goods span {
display:block;
margin-left:0
}
#calc .main .table table tbody tr {
transition:all 0.3s
}
#calc .main .table table tbody tr:hover {
background-color:#f4fbff
}
#index .banner {
width:100%;
height:340px
}
#index .banner .swiper-slide {
height:100%;
overflow:hidden;
background-size:cover;
background-position:center
}
#index .banner .swiper-slide img {
height:auto;
width:auto;
opacity:0
}
#index .floor-top {
display:flex;
justify-content:space-between;
align-items:flex-end
}
#index .floor-top .tab {
display:flex
}
#index .floor-top .tab a {
margin-left:55px;
font-size:18px;
transition:all 0.3s
}
#index .floor-top .tab a:hover, #index .floor-top .tab a.active {
color:#01327e
}
#index .mod-title {
display:inline-block
}
#index .mod-title i {
display:block;
width:40px;
height:4px;
background-color:#01327e
}
#index .mod-title .cn {
display:block;
width:100%;
font-size:20px;
font-weight:bold;
line-height:20px;
margin-top:15px;
white-space:nowrap
}
#index .mod-title .en {
display:block;
width:100%;
font-size:16px;
font-family:'Arial';
text-transform:uppercase;
line-height:16px;
margin-top:12px;
white-space:nowrap
}
#index .more {
display:inline-flex;
align-items:center;
font-family:'DIN';
font-weight:bold;
font-size:14px;
transition:all 0.3s
}
#index .more i {
margin-left:6px;
height:14px;
line-height:14px;
transition:all 0.3s
}
#index .more:hover i {
transform:rotate(90deg)
}
#index .floor1 {
width:100%;
padding:30px 0 30px;
background-color:#fff
}
#index .floor1 .items {
width:100%;
margin-top:20px;
display:flex;
justify-content:space-between
}
#index .floor1 .items .item {
display:block;
width:24%;
background-color:#f2f4f5;
border:1px solid #f2f4f5;
transition:all 0.3s
}
#index .floor1 .items .item .img {
width:100%;
height:auto
}
#index .floor1 .items .item .img img {
width:100%;
height:auto
}
#index .floor1 .items .item .text {
width:100%;
padding:20px 20px
}
#index .floor1 .items .item .text .title {
font-size:16px;
line-height:16px;
margin-bottom:10px
}
#index .floor1 .items .item .text .desc-line {
line-height:14px;
color:#888;
margin-top:10px
}
#index .floor1 .items .item:hover {
background-color:#fff;
border-color:#01327e
}
#index .floor2 {
width:100%;
padding:30px 0 30px;
background-color:#ebedef
}
#index .floor2 .blocks {
width:100%
}
#index .floor2 .items {
width:100%;
margin-top:20px;
display:none;
justify-content:space-between
}
#index .floor2 .items.active {
display:block
}
#index .floor2 .items .item {
display:inline-flex;
align-items:center;
width:100%;
height:180px;
background-color:#fff;
overflow:hidden;
margin-bottom:10px
}
#index .floor2 .items .item .img {
width:180px;
min-width:180px
}
#index .floor2 .items .item .img img {
width:100%
}
#index .floor2 .items .item .text {
width:calc(100% - 180px);
padding:25px 30px
}
#index .floor2 .items .item .text .title {
font-size:20px;
line-height:24px;
margin-bottom:40px
}
#index .floor2 .items .item .text .desc-line {
line-height:16px;
color:#888;
margin-top:10px
}
#index .floor2 .items .item:hover {
background-color:#fff;
border-color:#01327e
}
#index .floor3 {
width:100%;
padding:30px 0 30px;
background-color:#fff
}
#index .floor3 .items {
width:100%;
margin-top:40px;
display:flex;
flex-wrap:wrap;
justify-content:space-between
}
#index .floor3 .items .item {
width:32.5%;
margin-left:1.25%;
margin-bottom:20px;
position:relative
}
#index .floor3 .items .item:nth-child(3n+1) {
margin-left:0
}
#index .floor3 .items .item .img {
width:100%;
height:auto
}
#index .floor3 .items .item .img img {
width:100%;
height:auto;
-webkit-filter:grayscale(100%);
-moz-filter:grayscale(100%);
-ms-filter:grayscale(100%);
-o-filter:grayscale(100%);
filter:grayscale(100%);
filter:gray;
transform:all 0.3s
}
#index .floor3 .items .item i.mask {
width:100%;
height:100%;
position:absolute;
top:0;
left:0;
background-color:transparent;
transition:all 0.3s
}
#index .floor3 .items .item .con {
width:100%;
text-align:center;
position:absolute;
top:50%;
left:0;
margin-top:-40px;
color:#fff;
opacity:0;
transition:all 0.3s
}
#index .floor3 .items .item .con i {
display:block;
font-size:28px;
margin:0 auto
}
#index .floor3 .items .item .con span {
font-size:16px;
margin-top:16px
}
#index .floor3 .items .item:hover .img img {
-webkit-filter:grayscale(0);
-moz-filter:grayscale(0);
-ms-filter:grayscale(0);
-o-filter:grayscale(0);
filter:grayscale(0);
filter:gray
}
#index .floor3 .items .item:hover i.mask {
background-color:rgba(0, 0, 0, 0.3)
}
#index .floor3 .items .item:hover .con {
opacity:1
}
#index .about {
width:100%;
position:relative;
padding:30px 0 30px;
background-color:#ebedef
}
#index .about .img {
width:100%;
padding-left:calc((100% - 1660px) / 2)
}
#index .about .img img {
width:100%;
height:auto
}
#index .about .texts {
width:50%;
padding:20px 20px 20px 20px;
padding-left:20px;
position:absolute;
top:50%;
left:0;
z-index:3;
transform:translateY(-50%);
background-color:#fff
}
#index .about .texts .logo {
height:24px
}
#index .about .texts .logo img {
height:24px
}
#index .about .texts .name {
font-size:18px;
font-weight:bold;
margin-top:10px
}
#index .about .texts .desc {
font-size:14px;
line-height:26px;
margin-top:14px
}
#index .thumb {
width:100%;
padding:0 0 120px;
background-color:#ebedef;
position:relative
}
#index .thumb .swiper {
width:100%;
height:auto;
position:relative;
z-index:1
}
#index .thumb .swiper .swiper-slide img {
width:100%;
height:auto;
-webkit-filter:grayscale(100%);
-moz-filter:grayscale(100%);
-ms-filter:grayscale(100%);
-o-filter:grayscale(100%);
filter:grayscale(100%);
filter:gray;
transform:all 0.3s
}
#index .thumb .swiper .swiper-slide.swiper-slide-active img {
-webkit-filter:grayscale(0);
-moz-filter:grayscale(0);
-ms-filter:grayscale(0);
-o-filter:grayscale(0);
filter:grayscale(0);
filter:gray
}
#index .thumb .bar {
width:94%;
max-width:800px;
height:80px;
overflow:hidden;
position:absolute;
left:50%;
bottom:60px;
z-index:3;
transform:translateX(-50%);
background-color:#fff;
padding:20px 30px 20px 40px;
display:flex;
justify-content:space-between;
align-items:center
}
#index .thumb .bar .t-swiper {
width:calc(100% - 130px);
height:100%
}
#index .thumb .bar .t-swiper .swiper-slide {
height:60px
}
#index .thumb .bar .t-swiper .swiper-slide .flex {
display:flex;
align-items:center
}
#index .thumb .bar .t-swiper .swiper-slide .flex .icon {
width:40px;
height:40px;
color:#01327e
}
#index .thumb .bar .t-swiper .swiper-slide .flex .icon i {
font-size:40px;
height:40px;
display:block
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text {
margin-left:20px
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text .big {
font-size:18px;
line-height:18px;
font-weight:bold
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text .small {
line-height:14px;
margin-top:10px
}
#index .thumb .bar .navigation {
width:130px;
display:flex;
justify-content:space-between;
align-items:center
}
#index .thumb .bar .navigation i {
font-size:20px;
transition:all 0.3s
}
#index .thumb .bar .navigation i:hover {
color:#01327e
}
#index .thumb .bar .navigation .c-page {
font-size:20px
}
#index .thumb .bar .navigation .c-page #current {
font-size:30px;
color:#01327e
}
#index .study {
width:100%;
padding:30px 0 30px;
background-color:#fff
}
#index .study .items {
width:100%;
margin-top:20px;
display:block;
justify-content:space-between
}
#index .study .items .mod {
width:100%;
height:40px;
padding:0 20px;
display:flex;
justify-content:space-between;
align-items:center;
background-color:#01327e;
color:#fff
}
#index .study .items .mod>span {
font-size:18px
}
#index .study .items .mod .more {
display:inline-flex;
align-items:center;
font-family:'DIN';
font-weight:bold;
font-size:14px;
color:#fff;
transition:all 0.3s
}
#index .study .items .mod .more i {
margin-left:6px;
height:14px;
line-height:14px;
transition:all 0.3s
}
#index .study .items .mod .more:hover i {
transform:rotate(90deg)
}
#index .study .items>.item {
width:100%;
margin-right:0;
margin-bottom:30px
}
#index .study .items>.item ul {
margin-top:20px
}
#index .study .items>.item li {
width:100%;
height:50px;
border-bottom:1px solid #f2f4f5;
line-height:50px
}
#index .study .items>.item li a {
display:block;
width:100%;
transition:all 0.3s
}
#index .study .items>.item li a:hover {
color:#01327e
}
#index .study .items>.shorts {
width:100%
}
#index .study .items>.shorts .type1 {
height:auto
}
#index .study .items>.shorts .type1 li {
height:50px
}
#index .study .items>.shorts .type1 li img {
width:24px
}
#index .study .items>.shorts .type1 li a {
width:calc(100% - 36px)
}
#index .study .items>.shorts .type2 {
margin-top:40px
}
#index .study .items>.shorts .type2 .cover {
width:100%;
height:auto !important
}
#index .study .items>.shorts .type2 .cover a {
display:block;
width:100%;
height:auto !important;
background-size:cover;
background-position:center;
background-image:none
}
#index .study .items>.shorts .type2 .cover a img {
display:block !important;
width:100%
}
#index .study .items>.shorts .type2 li {
height:70px;
margin-top:10px
}
#index .study .items>.shorts .type2 li img {
width:50px
}
#index .study .items>.shorts .type2 li a {
width:calc(100% - 62px)
}
#index .study .items>.shorts .type2 li:first-child {
margin-top:0
}
#index .study .items>.shorts ul {
margin-top:20px
}
#index .study .items>.shorts li {
width:100%;
border-bottom:1px solid #f2f4f5;
display:flex;
align-items:center;
overflow:hidden
}
#index .study .items>.shorts li img {
flex-shrink:0;
margin-right:12px
}
#index .study .items>.shorts li .text {
width:100%
}
#index .study .items>.shorts li a {
display:block;
transition:all 0.3s
}
#index .study .items>.shorts li a:hover {
color:#01327e
}
#index .news {
width:100%;
padding:30px 0 30px;
background-color:#ebedef
}
#index .news .news-block {
width:100%;
margin-top:20px;
display:flex;
align-items:stretch;
justify-content:space-between
}
#index .news .news-block .img {
display:none
}
#index .news .news-block ul {
width:100%;
background-color:#fff;
padding:0 30px
}
#index .news .news-block ul li {
width:100%;
padding:15px 0 15px;
border-bottom:1px solid #f2f4f5
}
#index .news .news-block ul li a {
display:flex;
align-items:center
}
#index .news .news-block ul li a .date {
width:70px;
text-align:center;
white-space:nowrap;
transition:all 0.3s;
flex-shrink:0
}
#index .news .news-block ul li a .date .day {
font-size:56px;
font-weight:bold;
font-family:'DIN';
line-height:56px
}
#index .news .news-block ul li a .date .mon {
font-size:16px;
font-family:'DIN'
}
#index .news .news-block ul li a .text {
width:calc(100% - 110px);
margin-left:40px
}
#index .news .news-block ul li a .text .title {
font-size:18px;
font-weight:bold;
transition:all 0.3s
}
#index .news .news-block ul li a .text .desc {
width:100%;
line-height:28px;
color:#888;
margin-top:10px;
transition:all 0.3s
}
#index .news .news-block ul li a:hover .date, #index .news .news-block ul li a.active .date {
color:#01327e
}
#index .news .news-block ul li a:hover .text .title, #index .news .news-block ul li a.active .text .title {
color:#01327e
}
#index .news .news-block ul li a:hover .text .desc, #index .news .news-block ul li a.active .text .desc {
color:#333
}
#index .news .case-block {
width:100%;
display:flex;
justify-content:space-between;
flex-wrap:wrap
}
#index .news .case-block .item {
display:block;
width:100%;
margin-left:0;
margin-top:20px;
background-color:#fff;
padding:30px 30px 30px;
border-bottom:1px solid #fff;
transition:all 0.3s
}
#index .news .case-block .item .title {
font-size:18px;
font-weight:bold;
transition:all 0.3s
}
#index .news .case-block .item .desc {
width:100%;
line-height:28px;
color:#888;
margin-top:10px;
transition:all 0.3s
}
#index .news .case-block .item:hover {
border-color:#01327e
}
#index .news .case-block .item:hover .title {
color:#01327e
}
#index .news .case-block .item:hover .desc {
color:#333
}
#index .news .case-block .item:nth-child(2n+1) {
margin-left:0
}
#index .contact {
width:100%;
background-image:url(../img/22.png);
background-position:center;
background-size:cover;
padding:140px 0 120px;
text-align:center
}
#index .contact .big {
font-size:30px;
font-weight:bold;
color:#fff
}
#index .contact .small {
font-size:24px;
font-weight:bold;
color:#fff;
margin-top:10px
}
#index .contact .btn {
display:block;
width:200px;
height:50px;
background-color:#fff;
border-radius:25px;
line-height:50px;
text-align:center;
font-size:16px;
color:#01327e;
margin:50px auto 0
}
#prod_detail .main {
padding:40px 60px 20px;
display:block
}
#prod_detail .main .gallary {
width:100%;
flex-shrink:0
}
#prod_detail .main .gallary .view {
width:100%;
height:auto;
border:1px solid #ddd
}
#prod_detail .main .gallary .view img {
width:100%;
height:auto;
cursor:pointer
}
#prod_detail .main .gallary .thumb {
width:100%;
margin-top:10px;
height:auto;
display:flex;
align-items:stretch
}
#prod_detail .main .gallary .thumb .btn {
width:30px;
height:auto;
background-color:#f2f4f5;
color:#fff;
display:flex;
flex-shrink:0;
align-items:center;
justify-content:center;
transition:all 0.3s
}
#prod_detail .main .gallary .thumb .btn i {
font-size:12px
}
#prod_detail .main .gallary .thumb .btn:hover {
background-color:#ebf7ff;
color:#01327e
}
#prod_detail .main .gallary .thumb .swiper {
width:calc(100% - 60px);
padding:0 10px
}
#prod_detail .main .gallary .thumb .swiper .swiper-slide {
width:100px;
height:auto;
border:1px solid #ddd;
cursor:pointer
}
#prod_detail .main .gallary .thumb .swiper .swiper-slide img {
width:100%;
height:100%
}
#prod_detail .main .info {
width:100%;
padding-left:0;
margin-top:20px
}
#prod_detail .main .info .title {
width:100%;
font-size:24px;
font-weight:bold
}
#prod_detail .main .info .num {
width:100%;
position:relative;
margin-top:10px
}
#prod_detail .main .info .num .view-num {
color:#888;
float:left
}
#prod_detail .main .info .num .share-btn {
display:flex;
align-items:center;
width:100px;
height:24px;
float:right
}
#prod_detail .main .info .num .share-btn i {
font-size:20px
}
#prod_detail .main .info .num .share-btn span {
margin-left:10px
}
#prod_detail .main .info .num .share-block {
display:none;
width:77px;
height:30px;
line-height:30px;
position:absolute;
top:-30px;
right:0;
z-index:2
}
#prod_detail .main .info .num .share-block .bdsharebuttonbox {
width:100%;
height:100%;
text-align:right
}
#prod_detail .main .info .title-line {
width:100%;
height:40px;
background-color:#ebf7ff;
padding:0 20px;
font-size:18px;
color:#01327e;
line-height:40px;
margin-top:18px
}
#prod_detail .main .info .desc {
width:100%;
height:auto;
overflow-y:auto;
margin-top:20px;
line-height:24px
}
#prod_detail .main .info .btns {
width:100%;
max-width:unset;
overflow:hidden;
margin-top:20px
}
#prod_detail .main .info .btns a {
display:block;
width:32%;
height:40px;
line-height:40px;
text-align:center;
border:1px solid #ddd;
transition:all 0.3s;
float:left;
margin-left:2%;
margin-bottom:10px
}
#prod_detail .main .info .btns a:nth-child(3n+1) {
margin-left:0
}
#prod_detail .main .info .btns a:hover {
background-color:#01327e;
border-color:#01327e;
color:#fff
}
#prod_detail .main .info>.bot {
width:100%;
overflow:hidden;
border-top:1px solid #ddd;
padding-top:5px;
display:block
}
#prod_detail .main .info .contact {
width:100%;
float:none
}
#prod_detail .main .info .contact .tact-item {
margin-top:14px;
display:inline-flex;
align-items:center;
flex-wrap:wrap
}
#prod_detail .main .info .contact .tact-item .qq {
display:flex;
align-items:center;
justify-content:center;
width:100px;
height:30px;
background-color:#cc0001;
border-radius:15px;
white-space:nowrap;
flex-shrink:0;
margin-right:10px
}
#prod_detail .main .info .contact .tact-item .qq i {
font-size:16px;
color:#fff
}
#prod_detail .main .info .contact .tact-item .qq span {
font-size:12px;
margin-left:6px;
color:#fff
}
#prod_detail .main .info .contact .tact-item .name {
margin-right:10px;
height:30px;
line-height:30px;
white-space:nowrap;
flex-shrink:0
}
#prod_detail .main .info .contact .tact-item .name img {
height:100%
}
#prod_detail .main .info .contact .tact-item .name span {
margin-left:4px
}
#prod_detail .main .info .contact .tact-item .tel {
font-size:18px;
height:30px;
line-height:30px;
font-family:'DIN';
white-space:nowrap;
flex-shrink:0
}
#prod_detail .main .info .contact .tact-item .tel span {
margin-right:10px
}
#prod_detail .main .info .prev-next {
width:100%;
float:none;
margin-top:20px;
padding-left:0
}
#prod_detail .main .info .prev-next a {
width:100%;
display:block;
height:30px;
line-height:30px;
margin-top:5px
}
#contents {
margin-top:10px
}
#contents .main {
overflow:hidden
}
#contents .scroll {
width:100%;
float:left
}
#contents .scroll .scroll-item {
margin-bottom:10px;
background-color:#fff;
padding:20px 60px 30px
}
#contents .scroll .title-line {
width:100%;
height:50px;
background-color:#ebf7ff;
padding:0 20px;
font-size:18px;
color:#01327e;
line-height:50px
}
#contents .scroll .title-line a {
display:block;
width:100px;
height:30px;
line-height:30px;
text-align:center;
background-color:#01327e;
color:#fff;
border-radius:15px;
float:right;
margin-top:10px;
font-size:14px
}
#contents .scroll .content {
width:100%;
padding:20px 0
}
#contents .scroll .content img {
max-width:100%
}
#contents .scroll .down-list {
width:100%;
overflow:hidden
}
#contents .scroll .down-list .item {
display:block;
float:left;
margin-left:2%;
width:32%;
margin-top:10px
}
#contents .scroll .down-list .item .img {
width:100%;
border:1px solid #ddd;
transition:all 0.3s
}
#contents .scroll .down-list .item .img img {
width:100%
}
#contents .scroll .down-list .item .img:hover {
border-color:#01327e
}
#contents .scroll .down-list .item .title {
font-size:14px;
margin-top:6px
}
#contents .scroll .down-list .item:nth-child(3n+1) {
margin-left:0
}
#contents .scroll .case-list .item {
display:block;
width:100%;
padding:20px;
border:1px solid #d3eeff;
margin-top:10px
}
#contents .scroll .case-list .item .title {
font-size:18px
}
#contents .scroll .case-list .item .desc {
line-height:28px
}
#contents .scroll .prob-list .item {
display:block;
width:100%;
padding:20px 0;
border-bottom:1px solid #d3eeff;
margin-top:10px
}
#contents .scroll .prob-list .item .title {
font-size:18px
}
#contents .scroll .prob-list .item .desc {
line-height:28px
}
#contents .scroll .recom {
width:100%;
margin-top:10px;
margin-bottom:100px
}
#contents .scroll .recom .title-line {
width:100%;
text-align:center;
background-color:#d3eeff
}
#contents .scroll .recom .list {
width:100%;
overflow:hidden;
margin-top:10px
}
#contents .scroll .recom .list .item {
display:block;
width:23.5%;
margin-left:2%;
float:left
}
#contents .scroll .recom .list .item .img {
width:100%
}
#contents .scroll .recom .list .item .img img {
width:100%
}
#contents .scroll .recom .list .item .title {
width:100%;
height:50px;
line-height:50px;
text-align:center;
font-size:16px;
background-color:#d3eeff
}
#contents .scroll .recom .list .item:nth-child(4n+1) {
margin-left:0
}
#contents .target {
display:none
}
}
@media screen and (max-width: 750px) {
#contact .contact .main {
display:block
}
#contact .contact .main .texts {
width:100%;
padding:30px 5%
}
#contact .contact .main .texts .big {
font-size:38px;
line-height:38px
}
#contact .contact .main .texts .name {
font-size:18px;
margin-top:15px
}
#contact .contact .main .texts .icon-line {
margin-top:20px
}
#contact .contact .main .texts .icon-line i {
font-size:20px
}
#contact .contact .main .texts .icon-line span {
font-size:14px;
margin-left:15px
}
#contact .contact .main .texts .way {
margin-top:30px
}
#contact .contact .main .texts .way .title {
font-size:16px
}
#contact .contact .main .texts .way .items p {
font-size:16px;
margin-right:15px
}
#contact .contact .main .texts .wechat {
width:100%;
margin-top:40px
}
#contact .contact .main .texts .wechat .img {
width:120px;
height:120px
}
#contact .contact .main .texts .wechat .rights {
width:calc(100% - 120px);
margin-left:16px
}
#contact .contact .main .texts .wechat .rights .big {
font-size:18px;
line-height:24px
}
#contact .contact .main .texts .wechat .rights .desc {
font-size:16px;
margin-top:10px
}
#contact .contact .main .texts .wechat .rights .small {
margin-top:10px;
width:100%
}
#contact .contact .main #map {
width:100%;
height:500px
}
#contact .feed {
width:100%;
padding-top:10px;
padding-bottom:50px
}
#contact .feed .main {
padding:40px 30px
}
#contact .feed .main .title {
width:100%;
font-size:20px;
line-height:20px
}
#contact .feed .main .form {
width:100%;
margin-top:40px
}
#contact .feed .main .form .input-line {
width:100%;
flex-wrap:wrap
}
#contact .feed .main .form .input-line input {
width:49%;
height:50px;
padding:0 20px;
margin-bottom:10px
}
#contact .feed .main .form .textarea {
width:100%;
height:200px;
margin-top:10px
}
#contact .feed .main .form .textarea textarea {
padding:10px 20px
}
#contact .feed .main .form .bot-line {
flex-wrap:wrap
}
#contact .feed .main .form .bot-line .yzm {
display:flex;
width:100%
}
#contact .feed .main .form .bot-line .yzm input {
width:100%
}
#contact .feed .main .form .bot-line .yzm img {
width:100px;
flex-shrink:0
}
#contact .feed .main .form .bot-line .sub-btn {
width:100%;
margin-top:20px
}
#contact .feed .main .form .bot-line .sub-btn .btn {
width:100%
}
#study .study-tip .main {
padding:20px 20px;
line-height:24px
}
#study .tab {
width:100%;
display:flex;
justify-content:center
}
#study .tab .item {
display:block;
width:33%;
max-width:260px;
height:40px;
line-height:40px;
text-align:center;
background-color:#d3eeff;
position:relative;
margin:0 5px;
white-space:nowrap
}
#study .tab .item::after {
content:'';
display:block;
width:6px;
height:6px;
transform:rotate(-45deg) translate(-50%, 20%);
background-color:transparent;
position:absolute;
bottom:0;
left:50%
}
#study .tab .item.active, #study .tab .item:hover {
background-color:#014193;
color:#fff
}
#study .tab .item.active::after, #study .tab .item:hover::after {
background-color:#014193
}
#gall {
margin-top:20px;
margin-bottom:30px
}
#gall .main {
padding:20px;
height:500px
}
#ques {
margin-top:20px;
margin-bottom:30px
}
#ques .main {
padding:20px
}
#ques .main .list {
margin-top:20px
}
#ques .main .list a {
width:100%;
height:50px;
line-height:50px
}
#ques .main .list a .date {
width:100px
}
#ques .main .list a .title {
font-size:14px;
width:calc(100% - 120px);
float:left;
transition:all 0.3s
}
#ques .main .list a i {
font-size:18px;
color:#ddd;
float:right;
transition:all 0.3s
}
#ques .main .list a:hover .title {
color:#014193
}
#ques .main .list a:hover i {
color:#014193
}
#ques .load-more {
margin-top:30px
}
#explan {
margin-top:20px;
margin-bottom:30px
}
#explan .main .item {
padding:0 20px
}
#explan .main .item .tops {
width:100%;
height:70px;
display:flex;
justify-content:space-between;
align-items:center
}
#explan .main .item .tops .title {
font-size:16px
}
#explan .main .item .tops .btn {
display:flex;
align-items:center;
justify-content:center;
width:100px;
height:30px;
border-radius:15px;
background-color:#d3eeff;
transition:all 0.3s
}
#explan .main .item .tops .btn::before {
content:'展开';
display:inline-block;
color:#01327e;
transition:all 0.3s
}
#explan .main .item .tops .btn i {
color:#01327e;
font-size:12px;
margin-left:8px;
transition:all 0.3s
}
#explan .main .item .tops .btn.active {
background-color:#01327e
}
#explan .main .item .tops .btn.active::before {
content:'收起';
color:#fff
}
#explan .main .item .tops .btn.active i {
color:#fff;
transform:rotate(-180deg)
}
#explan .main .item .bots {
display:none;
padding:20px;
background-color:#f2f4f5;
line-height:24px;
margin-bottom:20px
}
#explan .main .item .bots img {
max-width:100%
}
#sample {
margin-top:20px
}
#sample .item {
width:49%;
background-color:#fff;
margin-left:2%;
margin-bottom:20px;
padding:15px 10px
}
#sample .item .img {
width:auto;
height:60px;
flex-shrink:0
}
#sample .item .img img {
width:auto;
height:100%
}
#sample .item .rights {
width:calc(100% - 94px);
padding-left:20px
}
#sample .item .rights .date {
color:#888;
font-family:'DIN'
}
#sample .item .rights .name {
display:block;
font-size:16px;
line-height:18px;
margin-top:5px
}
#sample .item .rights .btn {
width:100px;
height:30px;
border-radius:15px;
line-height:30px;
margin-top:12px;
font-size:12px
}
#sample .item:nth-child(3n+1) {
margin-left:2%
}
#sample .item:nth-child(2n+1) {
margin-left:0
}
#sample .load-more {
margin-top:30px;
margin-bottom:30px
}
#news .list .item {
width:100%;
height:auto;
padding:20px 0;
transition:all 0.3s
}
#news .list .item .main {
width:94%
}
#news .list .item a {
display:block;
width:100%;
height:100%
}
#news .list .item .img {
width:100%;
height:auto
}
#news .list .item .img img {
width:100%;
height:auto
}
#news .list .item .date {
display:none
}
#news .list .item .texts {
width:100%;
margin-top:10px
}
#news .list .item .texts .title {
font-size:16px
}
#news .list .item .texts .desc {
line-height:28px;
margin-top:10px
}
#news .list .item .btn {
opacity:1;
margin-left:0;
margin-top:10px
}
#news .list .item:hover {
background-color:#d3eeff
}
#news .list .item:hover .date {
color:#01327e
}
#news .list .item:hover .texts .title {
color:#01327e
}
#news .list .item:hover .btn {
opacity:1
}
#news .load-more {
margin-top:30px;
margin-bottom:30px
}
#news .study-tip {
margin-bottom:15px
}
#news .study-tip .main {
padding:20px 20px;
line-height:24px
}
#news .detail {
margin-bottom:30px
}
#news .detail .main {
background-color:#fff;
padding:30px 20px 0
}
#news .detail .main .title {
text-align:center;
font-size:18px
}
#news .detail .main .date {
text-align:center;
margin-top:10px;
font-size:12px
}
#news .detail .main .date span {
margin:0 10px;
display:block
}
#news .detail .main .content {
margin-top:20px;
padding:20px 0;
line-height:24px;
border-top:1px solid #ddd
}
#news .detail .main .content img {
max-width:100%
}
#news .detail .main .prev-next {
width:100%;
padding:15px 0;
display:flex;
justify-content:space-between;
align-items:center;
border-top:1px solid #ddd
}
#news .detail .main .prev-next .lefts {
width:80%
}
#news .detail .main .prev-next .lefts a {
margin:10px 0;
display:block
}
#news .detail .main .prev-next .back {
display:block;
width:100px;
height:30px;
border-radius:15px;
line-height:30px;
text-align:center;
background-color:#d3eeff;
color:#01327e
}
#notice {
background-color:#f2f4f5
}
#notice .contents {
padding-bottom:30px
}
#notice .contents .main {
overflow:hidden;
padding:0 20px 20px;
background-color:#fff
}
#notice .contents .main .item {
width:100%;
margin-top:30px
}
#notice .contents .main .item .mod {
height:18px;
line-height:18px;
font-size:16px;
border-left:4px solid #01327e;
color:#01327e;
padding-left:10px;
margin-bottom:20px
}
#notice .contents .main .item .content {
font-size:14px;
line-height:24px
}
#notice .contents .main .item .content img {
max-width:100%
}
#calc {
margin-top:20px;
margin-bottom:20px
}
#calc .main {
background-color:#fff;
padding:20px 20px
}
#calc .main .calc-lines {
margin-top:30px
}
#calc .main .calc-line {
display:block;
margin-bottom:30px
}
#calc .main .calc-line .item {
width:100%
}
#calc .main .calc-line .item .title {
width:100%;
height:50px;
line-height:50px;
padding:0 20px;
background-color:#d3eeff;
font-size:16px
}
#calc .main .calc-line .item .tops {
width:100%;
height:45px;
border-bottom:1px solid #ddd;
line-height:45px;
font-size:16px;
font-weight:500;
margin-top:20px
}
#calc .main .calc-line .item .block {
margin:20px 0
}
#calc .main .calc-line .item .block .input {
width:100%
}
#calc .main .calc-line .item .block .input .label {
width:100%;
font-size:14px
}
#calc .main .calc-line .item .block .input input {
width:100%;
height:40px;
border:1px solid #ddd;
margin-top:8px;
padding:0 10px
}
#calc .main .calc-line .item .block .input input[readonly] {
background-color:#f2f4f5;
border-color:#f2f4f5;
color:#01327e
}
#calc .main .calc-line .item .block .input select {
width:100%;
height:40px;
border:1px solid #ddd;
margin-top:8px;
padding:0 10px
}
#calc .main .calc-line .item .block1 {
width:100%;
display:block
}
#calc .main .calc-line .item .block1 .left {
width:100%
}
#calc .main .calc-line .item .block1 .left .img {
width:100%
}
#calc .main .calc-line .item .block1 .left .img img {
width:100%;
max-width:unset
}
#calc .main .calc-line .item .block1 .left .inputs {
width:100%;
display:flex;
justify-content:space-between;
margin-top:29px
}
#calc .main .calc-line .item .block1 .left .inputs .input {
width:45%;
max-width:unset
}
#calc .main .calc-line .item .block1 .right {
width:100%;
display:flex;
flex-direction:column;
justify-content:flex-end
}
#calc .main .calc-line .item .block1 .right .input {
margin-top:35px
}
#calc .main .calc-line .item .block2 {
width:100%;
display:flex;
justify-content:space-between
}
#calc .main .calc-line .item .block2 .input {
width:45%
}
#calc .main .calc-line .item .block2 .icon {
width:10%;
text-align:center
}
#calc .main .calc-line .item .block3 {
width:100%;
display:flex;
justify-content:space-between;
align-items:stretch
}
#calc .main .calc-line .item .block3 .left {
width:45%
}
#calc .main .calc-line .item .block3 .left .img {
width:100%
}
#calc .main .calc-line .item .block3 .left .img img {
width:100%
}
#calc .main .calc-line .item .block3 .left .inputs {
width:100%;
display:flex;
justify-content:space-between;
margin-top:29px
}
#calc .main .calc-line .item .block3 .left .inputs .input {
width:45%;
max-width:100px
}
#calc .main .calc-line .item .block3 .right {
width:45%;
display:flex;
flex-direction:column
}
#calc .main .calc-line .item .block3 .right .input {
margin-bottom:20px
}
#calc .main .calc-line .item .block4 {
width:100%
}
#calc .main .calc-line .item .block4 .img {
width:100%
}
#calc .main .calc-line .item .block4 .img img {
width:100%
}
#calc .main .calc-line .item .block4 .inputs {
width:100%;
display:flex;
margin-top:29px
}
#calc .main .calc-line .item .block4 .inputs .input {
width:30%;
max-width:100px;
margin-left:5%
}
#calc .main .calc-line .item .block4 .inputs .input:first-child {
margin-left:0
}
#calc .main .calc-line .item .block5 {
width:100%;
display:flex
}
#calc .main .calc-line .item .block5 .input {
width:30%;
margin-left:5%
}
#calc .main .calc-line .item .block5 .input:nth-child(3n+1) {
margin-left:0
}
#calc .main .table {
width:100%;
margin-top:60px;
overflow-x:auto
}
#calc .main .table table {
width:100%;
table-layout:fixed;
border:1px solid #ddd
}
#calc .main .table table th {
height:50px;
background-color:#d3eeff;
font-size:16px;
text-align:center;
padding:0 10px;
white-space:nowrap
}
#calc .main .table table td {
padding:10px 20px
}
#calc .main .table table td .goods {
display:block;
align-items:center
}
#calc .main .table table td .goods img {
width:60px;
height:60px;
max-width:unset
}
#calc .main .table table td .goods span {
display:block;
margin-left:0
}
#calc .main .table table tbody tr {
transition:all 0.3s
}
#calc .main .table table tbody tr:hover {
background-color:#f4fbff
}
#about .about {
display:block;
background-color:#fff
}
#about .about .texts {
width:100%;
padding-left:3%;
padding-top:30px;
padding-bottom:30px;
padding-right:3%
}
#about .about .texts .slogen {
font-size:24px;
font-weight:bold
}
#about .about .texts .content {
width:100%;
height:px;
overflow-x:hidden;
overflow-y:auto;
font-size:16px;
line-height:32px;
margin-top:20px;
-webkit-overflow-scrolling:touch
}
#about .about .texts .content img {
max-width:100%
}
#about .about .texts .content::-webkit-scrollbar {
width:6px;
height:6px;
background-color:#f5f5f5
}
#about .about .texts .content::-webkit-scrollbar-track {
border-radius:3px;
background-color:#f5f5f5
}
#about .about .texts .content::-webkit-scrollbar-thumb {
border-radius:3px;
background-color:#ddd
}
#about .about .texts .items {
width:100%;
display:flex;
justify-content:space-between;
margin-top:40px
}
#about .about .texts .items .item {
color:#01327e
}
#about .about .texts .items .item .en {
font-size:14px;
text-transform:uppercase
}
#about .about .texts .items .item .num {
font-size:50px;
line-height:40px
}
#about .about .texts .items .item .desc {
font-size:14px;
margin-top:10px
}
#about .about .img {
width:100%;
height:400px;
flex-shrink:0;
background-image:url(../img/33.png);
background-size:cover;
background-position:center;
position:relative;
display:flex;
align-items:center;
justify-content:center
}
#about .about .img i.play {
display:block;
width:54px;
height:54px;
background-image:url(../img/34.png);
background-size:100%;
cursor:pointer;
transition:all 0.3s
}
#about .about .img i.play:hover {
transform:scale(1.1)
}
#about .dev {
width:100%;
height:auto;
display:block;
align-items:stretch;
border-top:1px solid #ddd
}
#about .dev .imgs {
width:100%;
height:480px;
position:relative;
flex-shrink:0
}
#about .dev .imgs .swiper {
width:100%;
height:100%
}
#about .dev .imgs .swiper .swiper-container {
height:100%
}
#about .dev .imgs .swiper .swiper-container .swiper-wrapper {
height:100%
}
#about .dev .imgs .swiper .swiper-container .swiper-wrapper .swiper-slide {
height:100%;
background-position:center;
background-size:cover
}
#about .dev .imgs .btns {
position:absolute;
top:50%;
right:0;
transform:translateY(-50%);
width:70px;
height:140px;
z-index:3
}
#about .dev .imgs .btns a {
display:block;
width:70px;
height:70px;
text-align:center;
line-height:70px
}
#about .dev .imgs .btns a i {
font-size:24px
}
#about .dev .imgs .btns a.prev {
background-color:#fff;
color:#01327e
}
#about .dev .imgs .btns a.next {
background-color:#01327e;
color:#fff
}
#about .dev .years {
width:100%;
height:246px;
background-color:#fff;
overflow:hidden
}
#about .dev .years .swiper-container {
height:100%
}
#about .dev .years .swiper-container .swiper-wrapper {
height:100%
}
#about .dev .years .swiper-container .swiper-wrapper .swiper-slide {
width:420px;
height:100%;
padding:30px 30px 30px 30px;
border-right:1px solid #ddd
}
#about .dev .years .num {
font-size:30px;
font-family:'DIN';
transition:all 0.3s
}
#about .dev .years i {
display:block;
width:40px;
height:2px;
margin-top:15px;
background-color:#333;
transition:all 0.3s
}
#about .dev .years .content {
width:100%;
height:auto;
overflow-y:auto;
font-size:14px;
line-height:28px;
margin-top:20px;
-webkit-overflow-scrolling:touch
}
#about .dev .years .content::-webkit-scrollbar {
width:6px;
height:6px;
background-color:#f5f5f5
}
#about .dev .years .content::-webkit-scrollbar-track {
border-radius:3px;
background-color:#f5f5f5
}
#about .dev .years .content::-webkit-scrollbar-thumb {
border-radius:3px;
background-color:#ddd
}
#about .dev .years .content img {
max-width:100%
}
#about .dev .years .swiper-slide-active .num {
color:#01327e
}
#about .dev .years .swiper-slide-active i {
background-color:#01327e
}
#about .advantage {
width:100%;
padding:30px 0;
background-color:#f2f4f5
}
#about .advantage .item {
width:100%;
height:200px;
display:flex;
justify-content:space-between;
margin-bottom:10px
}
#about .advantage .item .swiper {
width:42.25%;
height:200px
}
#about .advantage .item .swiper .swiper-slide {
height:200px;
background-position:center;
background-size:cover
}
#about .advantage .item .texts {
width:57.75%;
height:100%;
padding:30px 20px;
background-color:#fff
}
#about .advantage .item .texts .title {
font-size:16px;
font-weight:bold
}
#about .advantage .item .texts .desc {
font-size:14px;
line-height:30px;
margin-top:10px
}
#about .advantage .item:nth-child(2n) {
flex-direction:row-reverse
}
#about .honor {
width:100%;
padding:30px 0
}
#about .honor .swiper-slide {
width:29%
}
#about .honor .swiper-slide img {
width:100%
}
#about .team {
width:100%
}
#about .team img {
width:100%
}
#index .banner {
height:240px
}
#index .floor-top .tab a {
margin-left:20px;
font-size:14px
}
#index .mod-title {
display:inline-block
}
#index .mod-title i {
display:block;
width:40px;
height:4px;
background-color:#01327e
}
#index .mod-title .cn {
display:block;
width:100%;
font-size:16px;
font-weight:bold;
line-height:16px;
margin-top:10px;
white-space:nowrap
}
#index .mod-title .en {
display:block;
width:100%;
font-size:12px;
font-family:'Arial';
text-transform:uppercase;
line-height:12px;
margin-top:10px;
white-space:nowrap
}
#index .more {
display:inline-flex;
align-items:center;
font-family:'DIN';
font-weight:bold;
font-size:14px;
transition:all 0.3s
}
#index .more i {
margin-left:6px;
height:14px;
line-height:14px;
transition:all 0.3s
}
#index .more:hover i {
transform:rotate(90deg)
}
#index .floor1 {
width:100%;
padding:30px 0 30px;
background-color:#fff
}
#index .floor1 .items {
width:100%;
margin-top:20px;
display:flex;
flex-wrap:wrap;
justify-content:space-between
}
#index .floor1 .items .item {
display:block;
width:49%;
margin-bottom:10px;
background-color:#f2f4f5;
border:1px solid #f2f4f5;
transition:all 0.3s
}
#index .floor1 .items .item .img {
width:100%;
height:auto
}
#index .floor1 .items .item .img img {
width:100%;
height:auto
}
#index .floor1 .items .item .text {
width:100%;
padding:14px 14px
}
#index .floor1 .items .item .text .title {
font-size:16px;
line-height:16px;
margin-bottom:10px
}
#index .floor1 .items .item .text .desc-line {
line-height:14px;
color:#888;
margin-top:10px
}
#index .floor1 .items .item:hover {
background-color:#fff;
border-color:#01327e
}
#index .floor2 {
width:100%;
padding:2px 0 10px;
background-color:#ebedef
}
#index .floor2 .blocks {
width:100%
}
#index .floor2 .items {
width:100%;
margin-top:20px;
display:none;
justify-content:space-between
}
#index .floor2 .items.active {
display:block
}
#index .floor2 .items .item {
display:inline-flex;
align-items:center;
width:49%;
height:95px;
background-color:#fff;
overflow:hidden;
margin-bottom:10px
}
#index .floor2 .items .item .img {
width:120px;
height:110px;
min-width:110px
}
#index .floor2 .items .item .img img {
width:110px;
height:110px
}
#index .floor2 .items .item .text {
width:calc(100% - 120px);
padding:10px
}
#index .floor2 .items .item .text .title {
font-size:16px;
line-height:24px;
margin-bottom:10px
}
#index .floor2 .items .item .text .desc-line {
font-size:12px;
line-height:16px;
color:#888;
margin-top:6px
}
#index .floor2 .items .item:hover {
background-color:#fff;
border-color:#01327e
}
#index .floor3 {
width:100%;
padding:30px 0 10px;
background-color:#fff
}















#index .floor3 .items {
width:100%;
margin-top:20px;
display:flex;
flex-wrap:wrap;
justify-content:space-between
}
#index .floor3 .items .item {
width:49%;
margin-left:2%;
margin-bottom:10px;
position:relative
}
#index .floor3 .items .item:nth-child(3n+1) {
margin-left:2%
}
#index .floor3 .items .item:nth-child(2n+1) {
margin-left:0
}
#index .floor3 .items .item .img {
width:100%;
height:auto
}
#index .floor3 .items .item .img img {
width:100%;
height:auto;
-webkit-filter:grayscale(0);
-moz-filter:grayscale(0);
-ms-filter:grayscale(0);
-o-filter:grayscale(0);
filter:grayscale(0);
filter:gray;
transform:all 0.3s
}
#index .floor3 .items .item i.mask {
width:100%;
height:100%;
position:absolute;
top:0;
left:0;
background-color:rgba(0, 0, 0, 0.3);
transition:all 0.3s
}
#index .floor3 .items .item .con {
width:100%;
text-align:center;
position:absolute;
top:50%;
left:0;
margin-top:-30px;
color:#fff;
opacity:1;
transition:all 0.3s
}
#index .floor3 .items .item .con i {
display:block;
font-size:28px;
margin:0 auto
}
#index .floor3 .items .item .con span {
font-size:14px;
margin-top:14px
}
#index .about {
width:100%;
position:relative;
padding:30px 0 30px;
background-color:#ebedef
}
#index .about .img {
width:100%;
padding-left:0
}
#index .about .img img {
width:100%;
height:auto
}
#index .about .texts {
width:100%;
padding:20px 20px 20px 20px;
padding-left:20px;
position:relative;
top:0;
left:0;
z-index:3;
transform:translateY(0);
background-color:#fff
}
#index .about .texts .logo {
height:24px
}
#index .about .texts .logo img {
height:24px
}
#index .about .texts .name {
font-size:18px;
font-weight:bold;
margin-top:10px
}
#index .about .texts .desc {
font-size:14px;
line-height:26px;
margin-top:14px
}
#index .thumb {
width:100%;
padding:0 0 70px;
background-color:#ebedef;
position:relative
}
#index .thumb .swiper {
width:100%;
height:auto;
position:relative;
z-index:1
}
#index .thumb .swiper .swiper-slide img {
width:100%;
height:auto;
-webkit-filter:grayscale(100%);
-moz-filter:grayscale(100%);
-ms-filter:grayscale(100%);
-o-filter:grayscale(100%);
filter:grayscale(100%);
filter:gray;
transform:all 0.3s
}
#index .thumb .swiper .swiper-slide.swiper-slide-active img {
-webkit-filter:grayscale(0);
-moz-filter:grayscale(0);
-ms-filter:grayscale(0);
-o-filter:grayscale(0);
filter:grayscale(0);
filter:gray
}
#index .thumb .bar {
width:94%;
max-width:800px;
height:88px;
overflow:hidden;
position:absolute;
left:50%;
bottom:30px;
z-index:3;
transform:translateX(-50%);
background-color:#fff;
padding:10px 20px 10px 20px;
display:flex;
justify-content:space-between;
align-items:center
}
#index .thumb .bar .t-swiper {
width:calc(100% - 100px);
height:100%
}
#index .thumb .bar .t-swiper .swiper-slide {
height:40px
}
#index .thumb .bar .t-swiper .swiper-slide .flex {
display:flex;
align-items:center
}
#index .thumb .bar .t-swiper .swiper-slide .flex .icon {
width:30px;
height:30px;
color:#01327e
}
#index .thumb .bar .t-swiper .swiper-slide .flex .icon i {
font-size:30px;
height:30px;
display:block
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text {
margin-left:20px
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text .big {
font-size:14px;
line-height:14px;
font-weight:bold
}
#index .thumb .bar .t-swiper .swiper-slide .flex .text .small {
line-height:14px;
margin-top:10px
}
#index .thumb .bar .navigation {
width:70px;
display:flex;
justify-content:space-between;
align-items:center
}
#index .thumb .bar .navigation i {
font-size:14px;
transition:all 0.3s
}
#index .thumb .bar .navigation i:hover {
color:#01327e
}
#index .thumb .bar .navigation .c-page {
font-size:12px
}
#index .thumb .bar .navigation .c-page #current {
font-size:14px;
color:#01327e
}
#index .study {
width:100%;
padding:30px 0 30px;
background-color:#fff
}
#index .study .items {
width:100%;
margin-top:20px;
display:block;
justify-content:space-between
}
#index .study .items .mod {
width:100%;
height:40px;
padding:0 14px;
display:flex;
justify-content:space-between;
align-items:center;
background-color:#01327e;
color:#fff
}
#index .study .items .mod>span {
font-size:16px
}
#index .study .items .mod .more {
display:inline-flex;
align-items:center;
font-family:'DIN';
font-weight:bold;
font-size:14px;
color:#fff;
transition:all 0.3s
}
#index .study .items .mod .more i {
margin-left:6px;
height:14px;
line-height:14px;
transition:all 0.3s
}
#index .study .items .mod .more:hover i {
transform:rotate(90deg)
}
#index .study .items>.item {
width:100%;
margin-right:0;
margin-bottom:30px
}
#index .study .items>.item ul {
margin-top:10px
}
#index .study .items>.item li {
width:100%;
height:50px;
padding:0 14px;
border-bottom:1px solid #f2f4f5;
line-height:50px
}
#index .study .items>.item li a {
display:block;
width:100%;
transition:all 0.3s
}
#index .study .items>.item li a:hover {
color:#01327e
}
#index .study .items>.shorts {
width:100%
}
#index .study .items>.shorts .type1 li {
padding:0 14px;
height:50px
}
#index .study .items>.shorts .type1 li img {
width:24px
}
#index .study .items>.shorts .type1 li a {
width:calc(100% - 36px)
}
#index .study .items>.shorts .type2 {
margin-top:30px
}
#index .study .items>.shorts .type2 li {
padding:0 14px;
height:70px;
margin-top:10px
}
#index .study .items>.shorts .type2 li img {
width:50px
}
#index .study .items>.shorts .type2 li a {
width:calc(100% - 62px)
}
#index .study .items>.shorts .type2 li:first-child {
margin-top:0
}
#index .study .items>.shorts ul {
margin-top:10px
}
#index .study .items>.shorts li {
width:100%;
border-bottom:1px solid #f2f4f5;
display:flex;
align-items:center;
overflow:hidden
}
#index .study .items>.shorts li img {
flex-shrink:0;
margin-right:12px
}
#index .study .items>.shorts li .text {
width:100%
}
#index .study .items>.shorts li a {
display:block;
transition:all 0.3s
}
#index .study .items>.shorts li a:hover {
color:#01327e
}
#index .news {
width:100%;
padding:30px 0 30px;
background-color:#ebedef
}
#index .news .news-block {
width:100%;
margin-top:20px;
display:flex;
align-items:stretch;
justify-content:space-between
}
#index .news .news-block .img {
display:none
}
#index .news .news-block ul {
width:100%;
background-color:#fff;
padding:0
}
#index .news .news-block ul li {
width:100%;
padding:15px 0 15px;
border-bottom:1px solid #f2f4f5
}
#index .news .news-block ul li a {
display:flex;
align-items:center
}
#index .news .news-block ul li a .date {
width:70px;
text-align:center;
white-space:nowrap;
transition:all 0.3s;
flex-shrink:0
}
#index .news .news-block ul li a .date .day {
font-size:28px;
font-weight:bold;
font-family:'DIN';
line-height:28px
}
#index .news .news-block ul li a .date .mon {
font-size:14px;
font-family:'DIN'
}
#index .news .news-block ul li a .text {
width:calc(100% - 95px);
margin-left:14px
}
#index .news .news-block ul li a .text .title {
font-size:14px;
font-weight:bold;
transition:all 0.3s
}
#index .news .news-block ul li a .text .desc {
width:100%;
font-size:12px;
line-height:20px;
color:#888;
margin-top:5px;
transition:all 0.3s
}
#index .news .news-block ul li a:hover .date, #index .news .news-block ul li a.active .date {
color:#01327e
}
#index .news .news-block ul li a:hover .text .title, #index .news .news-block ul li a.active .text .title {
color:#01327e
}
#index .news .news-block ul li a:hover .text .desc, #index .news .news-block ul li a.active .text .desc {
color:#333
}
#index .news .case-block {
width:100%;
display:flex;
justify-content:space-between;
flex-wrap:wrap
}
#index .news .case-block .item {
display:block;
width:100%;
margin-left:0;
margin-top:10px;
background-color:#fff;
padding:15px;
border-bottom:1px solid #fff;
transition:all 0.3s
}
#index .news .case-block .item .title {
font-size:14px;
font-weight:bold;
transition:all 0.3s
}
#index .news .case-block .item .desc {
width:100%;
font-size:12px;
line-height:20px;
color:#888;
margin-top:5px;
transition:all 0.3s
}
#index .news .case-block .item:hover {
border-color:#01327e
}
#index .news .case-block .item:hover .title {
color:#01327e
}
#index .news .case-block .item:hover .desc {
color:#333
}
#index .news .case-block .item:nth-child(2n+1) {
margin-left:0
}
#index .contact {
width:100%;
background-image:url(../img/22.jpg);
background-position:center;
background-size:cover;
padding:50px 0 40px;
text-align:center
}
#index .contact .big {
font-size:20px;
font-weight:bold;
color:#fff
}
#index .contact .small {
font-size:14px;
font-weight:bold;
color:#fff;
margin-top:10px
}
#index .contact .btn {
display:block;
width:120px;
height:40px;
background-color:#fff;
border-radius:20px;
line-height:40px;
text-align:center;
font-size:14px;
color:#01327e;
margin:20px auto 0
}
#prod .cate .main .tops {
height:50px
}
#prod .cate .main .tops::-webkit-scrollbar {
display:none
}
#prod .cate .main .tops .scroll {
display:flex
}
#prod .cate .main .tops .scroll a {
display:inline-block;
white-space:nowrap;
padding:0 14px;
height:50px;
line-height:50px;
color:#fff;
transition:all 0.3s
}
#prod .cate .main .tops .scroll a:hover, #prod .cate .main .tops .scroll a.active {
background-color:#fff;
color:#01327e
}
#prod .cate .main .tops .scroll a:first-child {
margin-left:14px
}
#prod .cate .main .tops .scroll a:last-child {
margin-right:14px
}
#prod .cate .main .bots {
display:flex;
width:100%;
height:50px;
overflow-x:auto;
overflow-y:hidden;
-webkit-overflow-scrolling:touch
}
#prod .cate .main .bots .scroll {
display:none;
padding:0
}
#prod .cate .main .bots .scroll a {
display:inline-block;
white-space:nowrap;
margin-left:20px;
height:50px;
line-height:50px;
transition:all 0.3s
}
#prod .cate .main .bots .scroll a:hover, #prod .cate .main .bots .scroll a.active {
color:#01327e
}
#prod .cate .main .bots .scroll a:last-child {
margin-right:20px
}
#prod .cate .main .bots .scroll.flex {
display:flex !important
}
#prod .cate .main .bots .scroll.block {
display:flex !important
}
#prod .prod-tip {
width:100%;
background-color:#f2f4f5;
margin-top:20px
}
#prod .prod-tip .main {
background-color:#fff;
padding:20px;
font-size:14px;
line-height:24px
}
#prod .prod-list {
width:100%;
background-color:#f2f4f5
}
#prod .prod-list .item {
width:100%;
padding:20px;
background-color:#fff;
margin-top:10px;
display:block
}
#prod .prod-list .item .img {
width:100%;
height:auto;
flex-shrink:0
}
#prod .prod-list .item .img img {
width:100%;
height:100%
}
#prod .prod-list .item .rights {
width:100%;
margin-left:0
}
#prod .prod-list .item .rights .title {
font-size:16px;
margin-top:10px
}
#prod .prod-list .item .rights .desc {
font-size:14px;
line-height:20px;
margin-top:10px
}
#prod .prod-list .item .rights .bots {
width:100%;
display:block;
margin-top:10px
}
#prod .prod-list .item .rights .bots .labels {
width:100%;
overflow:hidden
}
#prod .prod-list .item .rights .bots .labels .label {
float:left;
margin-right:80px;
margin-top:5px
}
#prod .prod-list .item .rights .bots .more {
display:block;
width:100px;
height:30px;
line-height:30px;
margin-top:15px
}
#prod .prod-list .item .rights .contact {
width:100%;
border-top:1px solid #ddd;
margin-top:15px
}
#prod .prod-list .item .rights .contact .tact-item {
margin-top:20px;
display:inline-flex;
align-items:center;
flex-wrap:wrap;
margin-right:50px
}
#prod .prod-list .item .rights .contact .tact-item .qq {
display:none;
align-items:center;
justify-content:center;
width:100px;
height:30px;
background-color:#cc0001;
border-radius:15px;
white-space:nowrap;
flex-shrink:0;
margin-right:10px
}
#prod .prod-list .item .rights .contact .tact-item .qq.ismobile {
display:flex
}
#prod .prod-list .item .rights .contact .tact-item .qq i {
font-size:16px;
color:#fff
}
#prod .prod-list .item .rights .contact .tact-item .qq span {
font-size:12px;
margin-left:6px;
color:#fff
}
#prod .prod-list .item .rights .contact .tact-item .name {
margin-right:10px;
height:30px;
line-height:30px;
white-space:nowrap;
flex-shrink:0
}
#prod .prod-list .item .rights .contact .tact-item .name img {
height:100%
}
#prod .prod-list .item .rights .contact .tact-item .name span {
margin-left:4px
}
#prod .prod-list .item .rights .contact .tact-item .tel {
font-size:18px;
height:30px;
line-height:30px;
font-family:'DIN';
white-space:nowrap;
flex-shrink:0
}
#prod .prod-list .item .rights .contact .tact-item .tel span {
margin-right:10px
}
#prod .hot {
width:100%;
margin-top:30px;
margin-bottom:20px
}
#prod .hot .main {
display:block
}
#prod .hot .label {
width:100%;
flex-shrink:0;
white-space:nowrap;
margin-top:10px;
height:16px;
line-height:16px;
padding-left:14px
}
#prod .hot .links {
width:100%;
overflow:hidden
}
#prod .hot .links a {
float:left;
padding:0 14px;
height:16px;
line-height:16px;
margin-top:10px
}
#prod .prob {
width:100%;
margin-top:20px;
margin-bottom:30px
}
#prod .prob .main {
background-color:#fff
}
#prod .prob .tops {
width:100%;
height:40px;
padding:0 14px;
line-height:40px;
background-color:#d3eeff;
font-size:16px
}
#prod .prob .list {
width:100%;
overflow:hidden;
padding:8px 14px
}
#prod .prob .list a {
display:block;
float:left;
width:100%;
height:34px;
line-height:34px;
margin-top:8px;
border-bottom:1px solid #f2f4f5;
padding:0;
margin-left:0;
transition:all 0.3s
}
#prod .prob .list a:nth-child(2n+1) {
margin-left:0
}
#prod .prob .list a:hover {
color:#01327e
}
#prod_detail .main {
padding:20px 20px 20px;
display:block
}
#prod_detail .main .gallary {
width:100%;
flex-shrink:0
}
#prod_detail .main .gallary .view {
width:100%;
height:auto;
border:1px solid #ddd
}
#prod_detail .main .gallary .view img {
width:100%;
height:auto;
cursor:pointer
}
#prod_detail .main .gallary .thumb {
width:100%;
margin-top:10px;
height:auto;
display:flex;
align-items:stretch
}
#prod_detail .main .gallary .thumb .btn {
width:20px;
height:auto;
background-color:#f2f4f5;
color:#fff;
display:flex;
flex-shrink:0;
align-items:center;
justify-content:center;
transition:all 0.3s
}
#prod_detail .main .gallary .thumb .btn i {
font-size:12px
}
#prod_detail .main .gallary .thumb .btn:hover {
background-color:#ebf7ff;
color:#01327e
}
#prod_detail .main .gallary .thumb .swiper {
width:calc(100% - 40px);
padding:0 10px
}
#prod_detail .main .gallary .thumb .swiper .swiper-slide {
width:100px;
height:auto;
border:1px solid #ddd;
cursor:pointer
}
#prod_detail .main .gallary .thumb .swiper .swiper-slide img {
width:100%;
height:100%
}
#prod_detail .main .info {
width:100%;
padding-left:0;
margin-top:20px
}
#prod_detail .main .info .title {
width:100%;
font-size:16px;
font-weight:bold
}
#prod_detail .main .info .num {
width:100%;
position:relative;
margin-top:10px
}
#prod_detail .main .info .num .view-num {
color:#888;
float:left
}
#prod_detail .main .info .num .share-btn {
display:none
}
#prod_detail .main .info .title-line {
width:100%;
height:40px;
background-color:#ebf7ff;
padding:0 14px;
font-size:16px;
color:#01327e;
line-height:40px;
margin-top:18px
}
#prod_detail .main .info .desc {
width:100%;
height:auto;
overflow-y:auto;
margin-top:14px;
line-height:24px
}
#prod_detail .main .info .btns {
width:100%;
max-width:unset;
overflow:hidden;
margin-top:20px
}
#prod_detail .main .info .btns a {
display:block;
width:49%;
height:40px;
line-height:40px;
text-align:center;
border:1px solid #ddd;
transition:all 0.3s;
float:left;
margin-left:2%;
margin-bottom:10px
}
#prod_detail .main .info .btns a:nth-child(3n+1) {
margin-left:2%
}
#prod_detail .main .info .btns a:nth-child(2n+1) {
margin-left:0
}
#prod_detail .main .info>.bot {
width:100%;
overflow:hidden;
border-top:1px solid #ddd;
padding-top:5px
}
#prod_detail .main .info .contact {
width:100%;
float:none
}
#prod_detail .main .info .contact .tact-item {
margin-top:14px;
display:inline-flex;
align-items:center;
flex-wrap:wrap
}
#prod_detail .main .info .contact .tact-item .qq {
display:none;
align-items:center;
justify-content:center;
width:100px;
height:30px;
background-color:#cc0001;
border-radius:15px;
white-space:nowrap;
flex-shrink:0;
margin-right:10px
}
#prod_detail .main .info .contact .tact-item .qq.ismobile {
display:flex
}
#prod_detail .main .info .contact .tact-item .qq i {
font-size:16px;
color:#fff
}
#prod_detail .main .info .contact .tact-item .qq span {
font-size:12px;
margin-left:6px;
color:#fff
}
#prod_detail .main .info .contact .tact-item .name {
margin-right:10px;
height:30px;
line-height:30px;
white-space:nowrap;
flex-shrink:0
}
#prod_detail .main .info .contact .tact-item .name img {
height:100%
}
#prod_detail .main .info .contact .tact-item .name span {
margin-left:4px
}
#prod_detail .main .info .contact .tact-item .tel {
font-size:18px;
height:30px;
line-height:30px;
font-family:'DIN';
white-space:nowrap;
flex-shrink:0
}
#prod_detail .main .info .contact .tact-item .tel span {
margin-right:10px
}
#prod_detail .main .info .prev-next {
width:100%;
float:none;
margin-top:20px
}
#prod_detail .main .info .prev-next a {
display:block;
height:30px;
line-height:30px;
margin-top:5px
}
#contents {
margin-top:10px
}
#contents .main {
overflow:hidden
}
#contents .scroll {
width:100%;
float:left
}
#contents .scroll .scroll-item {
margin-bottom:10px;
background-color:#fff;
padding:20px 20px 20px
}
#contents .scroll .title-line {
width:100%;
height:40px;
background-color:#ebf7ff;
padding:0 14px;
font-size:16px;
color:#01327e;
line-height:40px
}
#contents .scroll .title-line a {
display:block;
width:80px;
height:30px;
line-height:30px;
text-align:center;
background-color:#01327e;
color:#fff;
border-radius:15px;
float:right;
margin-top:5px;
font-size:12px
}
#contents .scroll .content {
width:100%;
padding:20px 0
}
#contents .scroll .content img {
max-width:100%
}
#contents .scroll .down-list {
width:100%;
overflow:hidden
}
#contents .scroll .down-list .item {
display:block;
float:left;
margin-left:2%;
width:49%;
margin-top:10px
}
#contents .scroll .down-list .item .img {
width:100%;
border:1px solid #ddd;
transition:all 0.3s
}
#contents .scroll .down-list .item .img img {
width:100%
}
#contents .scroll .down-list .item .img:hover {
border-color:#01327e
}
#contents .scroll .down-list .item .title {
font-size:14px;
margin-top:6px
}
#contents .scroll .down-list .item:nth-child(3n+1) {
margin-left:2%
}
#contents .scroll .down-list .item:nth-child(2n+1) {
margin-left:0
}
#contents .scroll .case-list .item {
display:block;
width:100%;
padding:14px;
border:1px solid #d3eeff;
margin-top:10px
}
#contents .scroll .case-list .item .title {
font-size:14px
}
#contents .scroll .case-list .item .desc {
font-size:12px;
line-height:22px
}
#contents .scroll .prob-list .item {
display:block;
width:100%;
padding:6px 0;
border-bottom:1px solid #d3eeff;
margin-top:10px
}
#contents .scroll .prob-list .item .title {
font-size:14px
}
#contents .scroll .prob-list .item .desc {
font-size:12px;
line-height:22px
}
#contents .scroll .recom {
width:100%;
margin-top:10px;
margin-bottom:30px
}
#contents .scroll .recom .title-line {
width:100%;
text-align:center;
background-color:#d3eeff
}
#contents .scroll .recom .list {
width:100%;
overflow:hidden;
margin-top:10px
}
#contents .scroll .recom .list .item {
display:block;
width:49%;
margin-left:2%;
margin-bottom:10px;
float:left
}
#contents .scroll .recom .list .item .img {
width:100%
}
#contents .scroll .recom .list .item .img img {
width:100%
}
#contents .scroll .recom .list .item .title {
width:100%;
height:40px;
line-height:40px;
text-align:center;
font-size:16px;
background-color:#d3eeff
}
#contents .scroll .recom .list .item:nth-child(4n+1) {
margin-left:2%
}
#contents .scroll .recom .list .item:nth-child(2n+1) {
margin-left:0
}
#contents .target {
display:none
}
#search .search-box {
width:100%;
margin:40px 0 30px;
height:40px;
position:relative;
z-index:9
}
#search .search-box .container {
height:100%
}
#search .search-box .left {
width:calc(100% - 80px);
max-width:unset;
height:100%;
display:inline-block;
float:left;
border:1px solid #e6e6e6;
border-radius:0
}
#search .search-box .left .select {
display:inline-block;
float:left;
width:70px;
height:100%;
padding:0 10px 0 0;
position:relative
}
#search .search-box .left .select>span {
display:block;
width:100%;
height:100%;
line-height:40px;
font-size:14px;
padding:0 14px 0 14px;
background-image:url("../img/67.png");
background-position:right center;
background-repeat:no-repeat;
background-size:6px 4px;
cursor:pointer
}
#search .search-box .left .select .sub {
width:100%;
position:absolute;
top:41px;
left:0;
border:1px solid #e6e6e6;
background-color:#fff;
z-index:99;
display:none
}
#search .search-box .left .select .sub span {
display:block;
width:100%;
text-align:center;
height:30px;
line-height:30px;
transition:all 0.3s;
cursor:pointer
}
#search .search-box .left .select .sub span:hover, #search .search-box .left .select .sub span.active {
background-color:#01327e;
color:#fff
}
#search .search-box .left .input {
display:inline-block;
float:left;
width:calc(100% - 70px);
height:100%;
border-left:1px solid #e6e6e6
}
#search .search-box .left .input input {
width:100%;
height:100%;
padding:0 10px;
border:none;
background-color:#fff;
border-radius:0;
font-size:14px
}
#search .search-box .btn {
display:inline-block;
float:left
}
#search .search-box .btn button {
width:80px;
height:40px;
background-color:#01327e;
border:none;
color:#fff;
font-size:14px;
display:flex;
align-items:center;
justify-content:center;
cursor:pointer
}
#search .search-box .btn button span {
display:inline-block;
line-height:14px
}
#search .search-box .btn button i {
display:inline-block;
width:16px;
height:16px;
background-image:url("../img/66.png");
background-size:100% 100%;
margin-left:5px
}
#search .search-result {
width:100%;
padding-bottom:30px
}
#search .search-result .item {
width:100%;
padding:14px 0;
border-bottom:1px solid #e6e6e6
}
#search .search-result .item .title {
width:100%;
line-height:14px;
font-size:14px;
display:flex;
align-items:center
}
#search .search-result .item .title i {
display:inline-block;
width:4px;
height:4px;
background-color:#01327e;
margin-right:10px
}
#search .search-result .item .title p {
display:inline-block;
width:calc(100% - 14px)
}
#search .search-result .item .date {
width:100%;
font-size:12px;
line-height:12px;
color:#999;
margin-top:10px;
padding-left:14px
}
#search .search-result .pages {
margin-top:30px
}
#search .load-more {
margin-bottom:30px
}
}
@media screen and (max-width: 480px) {
#contact .contact .main {
display:block
}
#contact .contact .main .texts {
width:100%;
padding:20px 20px
}
#contact .contact .main .texts .big {
font-size:24px;
line-height:24px
}
#contact .contact .main .texts .name {
font-size:18px;
margin-top:10px
}
#contact .contact .main .texts .icon-line {
margin-top:10px
}
#contact .contact .main .texts .icon-line i {
font-size:20px
}
#contact .contact .main .texts .icon-line span {
font-size:14px;
margin-left:15px
}
#contact .contact .main .texts .way {
margin-top:10px
}
#contact .contact .main .texts .way .title {
font-size:16px
}
#contact .contact .main .texts .way .items p {
font-size:16px;
margin-right:15px
}
#contact .contact .main .texts .wechat {
width:100%;
margin-top:20px
}
#contact .contact .main .texts .wechat .img {
width:120px;
height:120px
}
#contact .contact .main .texts .wechat .rights {
width:calc(100% - 120px);
margin-left:16px
}
#contact .contact .main .texts .wechat .rights .big {
font-size:14px;
line-height:24px
}
#contact .contact .main .texts .wechat .rights .desc {
font-size:14px;
margin-top:10px
}
#contact .contact .main .texts .wechat .rights .small {
margin-top:10px;
width:100%
}
#contact .contact .main #map {
width:100%;
height:300px
}
#contact .feed {
width:100%;
padding-top:10px;
padding-bottom:30px
}
#contact .feed .main {
padding:20px 20px
}
#contact .feed .main .title {
width:100%;
font-size:16px;
line-height:24px
}
#contact .feed .main .form {
width:100%;
margin-top:40px
}
#contact .feed .main .form .input-line {
width:100%;
flex-wrap:wrap
}
#contact .feed .main .form .input-line input {
width:49%;
height:40px;
padding:0 10px;
margin-bottom:10px
}
#contact .feed .main .form .textarea {
width:100%;
height:200px;
margin-top:0
}
#contact .feed .main .form .textarea textarea {
padding:10px 10px
}
#contact .feed .main .form .bot-line {
flex-wrap:wrap
}
#contact .feed .main .form .bot-line .yzm {
display:flex;
width:100%
}
#contact .feed .main .form .bot-line .yzm input {
width:100%;
padding:0 10px
}
#contact .feed .main .form .bot-line .yzm img {
width:100px;
flex-shrink:0
}
#contact .feed .main .form .bot-line .sub-btn {
width:100%;
margin-top:20px
}
#contact .feed .main .form .bot-line .sub-btn .btn {
width:100%
}
#ques {
margin-top:20px;
margin-bottom:30px
}
#ques .main .list a {
width:100%;
height:50px;
line-height:50px
}
#ques .main .list a .date {
width:100px
}
#ques .main .list a .title {
font-size:14px;
width:calc(100% - 120px);
float:left;
transition:all 0.3s
}
#ques .main .list a i {
font-size:18px;
color:#ddd;
float:right;
transition:all 0.3s
}
#ques .main .list a:hover .title {
color:#014193
}
#ques .main .list a:hover i {
color:#014193
}
#ques .load-more {
margin-top:30px
}
#sample {
margin-top:20px
}
#sample .item {
width:100%;
margin-left:0;
margin-bottom:10px;
padding:15px 10px
}
#sample .item .img {
width:auto;
height:60px;
flex-shrink:0
}
#sample .item .img img {
width:auto;
height:100%
}
#sample .item .rights {
width:calc(100% - 94px);
padding-left:20px
}
#sample .item .rights .date {
color:#888;
font-family:'DIN'
}
#sample .item .rights .name {
display:block;
font-size:16px;
line-height:18px;
margin-top:5px
}
#sample .item .rights .btn {
width:100px;
height:30px;
border-radius:15px;
line-height:30px;
margin-top:12px;
font-size:12px
}
#sample .item:nth-child(3n+1) {
margin-left:2%
}
#sample .item:nth-child(2n+1) {
margin-left:0
}
#sample .load-more {
margin-top:20px;
margin-bottom:30px
}
#about .about .texts {
padding-top:20px;
padding-bottom:20px
}
#about .about .texts .slogen {
font-size:20px
}
#about .about .texts .content {
width:100%;
height:auto;
overflow-x:hidden;
overflow-y:auto;
font-size:14px;
line-height:26px;
margin-top:20px
}
#about .about .texts .items {
width:100%;
display:flex;
justify-content:space-between;
margin-top:20px
}
#about .about .texts .items .item {
color:#01327e
}
#about .about .texts .items .item .en {
font-size:14px;
text-transform:uppercase
}
#about .about .texts .items .item .num {
font-size:40px;
line-height:30px
}
#about .about .texts .items .item .desc {
font-size:14px;
margin-top:10px
}
#about .about .img {
width:100%;
height:200px;
flex-shrink:0;
background-image:url(../img/33.png);
background-size:cover;
background-position:center;
position:relative;
display:flex;
align-items:center;
justify-content:center
}
#about .about .img i.play {
display:block;
width:40px;
height:40px;
background-image:url(../img/34.png);
background-size:100%;
cursor:pointer;
transition:all 0.3s
}
#about .about .img i.play:hover {
transform:scale(1.1)
}
#about .dev {
width:100%;
height:auto
}
#about .dev .imgs {
width:100%;
height:200px;
position:relative;
flex-shrink:0
}
#about .dev .imgs .swiper {
width:100%;
height:100%
}
#about .dev .imgs .swiper .swiper-container {
height:100%
}
#about .dev .imgs .swiper .swiper-container .swiper-wrapper {
height:100%
}
#about .dev .imgs .swiper .swiper-container .swiper-wrapper .swiper-slide {
height:100%;
background-position:center;
background-size:cover
}
#about .dev .imgs .btns {
position:absolute;
top:50%;
right:0;
transform:translateY(-50%);
width:40px;
height:80px;
z-index:3
}
#about .dev .imgs .btns a {
display:block;
width:40px;
height:40px;
text-align:center;
line-height:40px
}
#about .dev .imgs .btns a i {
font-size:18px
}
#about .dev .imgs .btns a.prev {
background-color:#fff;
color:#01327e
}
#about .dev .imgs .btns a.next {
background-color:#01327e;
color:#fff
}
#about .dev .years {
width:100%;
height:246px;
background-color:#fff;
overflow:hidden
}
#about .dev .years .swiper-container {
height:100%
}
#about .dev .years .swiper-container .swiper-wrapper {
height:100%
}
#about .dev .years .swiper-container .swiper-wrapper .swiper-slide {
width:300px;
height:100%;
padding:20px 20px 20px 20px;
border-right:1px solid #ddd
}
#about .dev .years .num {
font-size:28px
}
#about .dev .years i {
display:block;
width:40px;
height:2px;
margin-top:10px;
background-color:#333;
transition:all 0.3s
}
#about .dev .years .content {
width:100%;
height:140px;
overflow-y:auto;
font-size:14px;
line-height:28px;
margin-top:10px;
-webkit-overflow-scrolling:touch
}
#about .dev .years .content::-webkit-scrollbar {
width:6px;
height:6px;
background-color:#f5f5f5
}
#about .dev .years .content::-webkit-scrollbar-track {
border-radius:3px;
background-color:#f5f5f5
}
#about .dev .years .content::-webkit-scrollbar-thumb {
border-radius:3px;
background-color:#ddd
}
#about .dev .years .content img {
max-width:100%
}
#about .dev .years .swiper-slide-active .num {
color:#01327e
}
#about .dev .years .swiper-slide-active i {
background-color:#01327e
}
#about .advantage {
width:100%;
padding:20px 0;
background-color:#f2f4f5
}
#about .advantage .item {
width:100%;
height:200px;
display:flex;
justify-content:space-between;
margin-bottom:10px
}
#about .advantage .item .swiper {
width:42.25%;
height:200px
}
#about .advantage .item .swiper .swiper-slide {
height:200px;
background-position:center;
background-size:cover
}
#about .advantage .item .texts {
width:57.75%;
height:100%;
padding:20px 20px;
background-color:#fff
}
#about .advantage .item .texts .title {
font-size:16px;
font-weight:bold
}
#about .advantage .item .texts .desc {
font-size:14px;
line-height:24px;
margin-top:10px;
height:120px;
overflow-y:auto;
-webkit-overflow-scrolling:touch
}
#about .advantage .item .texts .desc::-webkit-scrollbar {
width:6px;
height:6px;
background-color:#f5f5f5
}
#about .advantage .item .texts .desc::-webkit-scrollbar-track {
border-radius:3px;
background-color:#f5f5f5
}
#about .advantage .item .texts .desc::-webkit-scrollbar-thumb {
border-radius:3px;
background-color:#ddd
}
#about .advantage .item:nth-child(2n) {
flex-direction:row-reverse
}
#about .honor {
width:100%;
padding:30px 0
}
#about .honor .swiper-slide {
width:29%
}
#about .honor .swiper-slide img {
width:100%
}
#about .team {
width:100%
}
#about .team img {
width:100%
}
#index .banner {
height:160px
}
}
.apage {
	line-height: 25px;
	background: #ffffff;
	padding: 0 5px;
	text-align: center;
	padding:20px
}
.apage a {
	border: 1px solid #cccccc;
	padding: 5px 14px;
	margin-right: 5px;
	margin: 0 3px;
}
.apage .num_btns {
	float: right;
	font-family: Tahoma;
}
.apage a:hover, .apage .cur {
	border: 1px solid #01327e;
	background-color: #01327e;
	color: #fff;
	text-decoration: none;
}
.apage .cust_txt {
	float: left;
}
.apage .oran_pg_fp {
	background: url(../images/first_page.gif) 4px 4px no-repeat;
	padding-right: 9px;
}
.apage .oran_pg_pp {
	background: url(../images/pre_page.gif) 4px 4px no-repeat;
	padding-right: 5px;
}
.apage .oran_pg_np {
	background: url(../images/next_page.gif) 8px 4px no-repeat;
	padding-right: 12px;
}
.apage .oran_pg_lp {
	background: url(../images/last_page.gif) 8px 4px no-repeat;
	padding-right: 12px;
}
.apage select {
	font-size: 8px;
	margin-top: 5px;
}
.apage .oran_pg_txt {
	height: 15px;
	border: solid 1px #d4e3e9;
	width: 20px;
	margin-left: 5px;
}
.apage .oran_pg_btn {
	height: 15px;
	border: solid 1px #d4e3e9;
	margin-left: 5px;
	font-size: 9px;
	background: #5984ac;
	color: #fff;
}



.index_company{
}
.index_company-bg{
    padding-top: 4%;
    overflow: hidden;
    height: 100%;
    background: #f5f5f5 url(/skin/images/companybg.jpg) no-repeat center / cover;
}
.index_company_inner{
    background: #fff;
    padding:3.5%;
}
.index_company_inner img{
    width: 100%;
}
.index_company_sec .warpper{
    padding:0 3% 5%;
}
.index_company_sec_left{
    float: left;
}
.index_company_sec_left .fir{
    font-size:52px;
    font-weight: 700;
    color:#212121;
    font-family: cll2;
    text-transform: uppercase;
}
.index_company_sec_left .sec{
    font-size:14px;
    font-weight: 700;
    color:#302f2f;
    margin-top: -1%;
}
.index_company_sec_left .line{
    width: 20px;
    height: 5px;
    background: #c99e7d;
    margin: 3% 0;
}
.index_company_sec_left .thr{
    font-size:32px;
    font-weight: lighter;
    color:#302f2f;
    display: inline-block;
    border-bottom:1px solid #e7e7e7;
    padding-bottom: 1.5%;
}
.index_company_sec_left .thr span{
    font-weight: 700;
}
.index_company_sec_right{
    float: right;
    width: 60%;
}
.index_company_sec_right .fir{
    font-size:30px;
    font-weight: 700;
    color:#302f2f;
}
.index_company_sec_right .sec{
    font-size: 16px;
    line-height: 29px;
    color: #838383;
    text-align: justify;
    margin-top: 3%;
}
.index_company_sec_right .sec span{
    color:#005aad;
    font-weight: 700;
}
.index_company_thr{
    margin:4% 0 5% 0;
    height: 410px;
}
.index_company_thr .warpper{
    height: 100%;
    display: flex;
    justify-content: space-between;
}
.index_company_thr_list{
    width: 49%;
    height: 100%;
    overflow: hidden;
    position: relative;
}
.index_company_thr_list .text{
    position: absolute;
    width: 100%;
    padding: 0 6%;
    bottom: 16%;
    left: 0;
    color: #fff;
}
.index_company_thr_list:hover .pic{
    -webkit-transform: scale(1.03) translate3d(0,0,0);
    -moz-transform: scale(1.03) translate3d(0,0,0);
    -ms-transform: scale(1.03) translate3d(0,0,0);
    -o-transform: scale(1.03) translate3d(0,0,0);
    transform: scale(1.03) translate3d(0,0,0);
}
.index_company_thr_list .text .fir{
    font-size:30px;
    font-weight: 700;
    margin-bottom: 2%;
}
.index_company_thr_list .text .sec{
    font-size:14px;
    text-transform: uppercase;
}
.index_company_thr_list .bo{
    position: absolute;
    width: 100%;
    left:50%;
    top:50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    text-align:center;
    color:#fff;
    text-transform: uppercase;
    font-size:14px;
}
.index_company_thr_list .bo img{
    margin: 0 auto;
    margin-bottom: 1.5%;
}


.warpper{
  width:1420px;
  margin:0 auto;
}






@media (max-width: 768px){
    .footerbox{
        display: none;
    }
    .mobile-footer{
        display: block;
    }
    .topper{
        display: none;
    }
    .allnav {
        height: 60px;
    }
    .allnav h1 img{
        width: 195px;
    }
    .sbanner{
        height: 150px;
    }
    .sbanner-crumbs .inner{
        padding: 0 9%;
        line-height: 35px;
    }
    .message-inner .text{
        width: 100%;
    }
    .message-inner .liuyanform{
        width: 100%;
        margin-top: 5%;
    }
    .message-inner .text .fir{
        font-size: 25px;
        line-height: 25px;
    }
    .message-inner .text .sec{
        margin-top: 16px;
        font-size: 24px;
        line-height: 33px;
        padding-bottom: 4px;
    }
    .contact-map{
        height: 200px;
    }
    .info {
        padding: 6% 0 23% 0;
    }
    .goback{
        height: 70px;
        width: 70px;
        background-size: contain;
    }
    .allnav .small-button{
        width: 33px;
    }
    .allnav .small-button .small-button-inner span{
        height: 1px;
    }
    .allnav .small-button .small-button-inner span:nth-child(2) {
        margin: 7px 0;
    }
    .bannerbox .banner-img img {
        max-width: 42%;
    }
    .jinyan .warpper{
        flex-wrap: wrap;
    }
    .jinyan .jinyan-list{
        width: 48%;
        height: 215px;
        margin-bottom: 2%;
    }
    .jinyan .jinyan-list .fir span{
        font-size: 35px;
    }
    .jinyan .jinyan-list .sec{
        font-size: 15px;
    }
    .jinyan .jinyan-list:after{
        background: url(../img/jinyan-list-icon.png) no-repeat bottom 4% right;
        background-size: 85px;
    }
    .jinyan .jinyan-list:nth-of-type(1) .imgbox{
        background-size: 52px;
    }
    .jinyan .jinyan-list:nth-of-type(2) .imgbox{
        background-size: 52px;
    }
    .jinyan .jinyan-list:nth-of-type(3) .imgbox{
        background-size: 52px;
    }
    .jinyan .jinyan-list:nth-of-type(4) .imgbox{
        background-size: 52px;
    }
    .jinyan .jinyan-list:nth-of-type(1):hover .imgbox{
        background-size: 52px;
    }
    .jinyan .jinyan-list:nth-of-type(2):hover .imgbox{
        background-size: 52px;
    }
    .jinyan .jinyan-list:nth-of-type(3):hover .imgbox{
        background-size: 52px;
    }
    .jinyan .jinyan-list:nth-of-type(4):hover .imgbox{
        background-size: 52px;
    }


    .company-fir{
        border-radius: 50px 0 0 0;
    }
    .company-fir .tbox .fir{
        line-height: 22px;
        margin-right: 2%;
        font-size: 14px;
    }
    .company-fir .tbox .sec .t1{
        font-size: 20px;
        line-height: 18px;
    }
    .company-fir .tbox .sec .t2{
        font-size: 31px;
        line-height: 42px;
    }
    .company-fir .tbox .sec{
        margin-right: 2%;
    }
    .company-fir .tbox .thr{
        font-size: 16px;
        line-height: 28px;
        padding-left: 2%;
    }
    .company-fir .title-img {
        max-width: 65%;
    }
    .company-fir .des{
        font-size: 16px;
        line-height: 27px;
    }
    .all-tel .sec {
        font-size: 24px;
    }
    .company-fir .abox .zxbutton {
        line-height: 40px;
    }
    .zxbutton{
        width: 111px;
        font-size: 14px;
    }
    .company-fir .c-left{
        width: 100%;
    }
    .company-fir .c-right{
        display: none;
    }
    .index_pro_type-list .img img {
        max-width: 36%;
        max-height: 52%;
    }
    .index_pro_type-list .title{
        font-size: 16px;
    }
    .index_pro_type-list{
        width: 24.1%;
    }
    .index_pro_type-list:last-child{
        display: none;
    }
    .index_pro_type-list:nth-child(4n){
        border-right: 1px solid #e5e5e5;
    }
    .index_pro_list {
        width: 50%;
        margin-bottom: 2%;
    }
    .all_pro .imgbox {
        height: 160px;
    }
    .all_pro .text-left {
        width: 100%;
    }
    .all_pro .text-left .fir{
        font-size: 15px;
    }
    .all_pro span{
        font-size: 12px;
        line-height: 25px;
        width: 68px;
    }

    .index_youshi_bg{
        border-radius: 0 50px 0 0;
    }
    .index_youshi_bg.fir{
        display: none;
    }
    .index_youshi_bg.sec{
        display: block;
        padding:5% 0;
    }
    .index_case_box .slide-right .shuzi{
        display: none;
    }
    .index_case_box .slide-right .fir{
        display: none;
    }
    .case-button-right{
        display: none;
    }
    .index_case_box .slide-right .imgbox{
        width: 100%;
        height: 56px;
    }
    .index_case_box {
        height: 316px;
        padding: 1%;
    }
    .index_case_box .slide-left{
        width: 75%;
    }
    .index_case_box .slide-right{
        width: 25%;
        padding:0 0 0 2%;
    }
    .case-button-left{
        font-size: 16px;
    }
    .case-button-left em{
        font-size: 32px;
    }
    .index_case_box .slide-left .imgbox .text .fir{
        font-size: 15px;
    }
    .all_title .fir{
        font-size: 20px;
    }
    .index_company-bg{
        border-radius: 50px 0 0 0;
    }
    .index_company_inner{
        padding: 2.5%;
    }
    .index_company_sec_left{
        width: 100%;
    }
    .index_company_sec_right{
        width: 100%;
        margin-top: 4%;
    }
    .index_company_sec_left .fir{
        font-size: 30px;
    }
    .index_company_sec_right .fir{
        font-size:22px;
    }
    .index_company_sec_left .line{
        margin: 2% 0;
    }
    .index_company_sec_left .thr{
        font-size: 22px;
        display: block;
    }
    .index_company_sec_right .sec{
        margin-top: 1%;
    }
    .index_company_thr{
        height: 145px;
    }
    .index_company_thr_list .text .fir{
        font-size: 16px;
    }
    .index_company_thr_list .bo img{
        width: 55px;
    }
    .index_news{
        border-radius: 0 50px 0 0;
        padding-bottom: 25%;
    }
    .index_news_left {
        width: 100%;
    }
    .index_news_right{
        display: none;
    }
    .index_news_left .imgbox{
        width: 105px;
        height: 112px;
    }
    .index_news_left .text{
        width: -webkit-calc(100% - 120px);
        width: -moz-calc(100% - 120px);
        width: calc(100% - 120px);
    }
    .index_news .text-inner .fir{
        font-size: 16px;
    }
    .index_news .text-inner .sec{
        line-height: 20px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }
    .bannerbox .swiper-pagination-bullet{
        width: 8px;
        height: 8px;
    }
    .allnav{
        -webkit-transition: all 0.4s;
        -moz-transition: all 0.4s;
        -ms-transition: all 0.4s;
        -o-transition: all 0.4s;
        transition: all 0.4s;
    }
    .allnav.sroller{
        position: fixed;
        left: 0;
        top: 0;
        z-index: 888;
        box-shadow: 0px 0px 10px #333333;
    }


    .company-inner-fir-box {
        height: auto;
        margin-top: 16%;
    }
    .company-inner-fir-box .c-left {
         width: 100%;
     }
    .company-inner-fir-box .c-right {
        width: 100%;
        margin-top: 5%;
    }
    .company-inner-fir-box .img-button{
        width: 100%;
        display: block;
        right:0;
        top: -11%;
    }
    .company-inner-fir-box .img-button-inner{
        text-align: center;
    }
    .company-inner-fir-box .img-button .b-list{
        display: inline-block;
        width: 128px;
        padding: 2% 0;
    }
    .company-inner-fir-box .img-button .b-list .imgbox.dz{
        background-size: contain;
    }
    .company-inner-fir-box .img-button .b-list .imgbox.js{
        background-size: contain;
    }
    .company-inner-fir-box .img-button .b-list.active .imgbox.dz{
        background-size: contain;
    }
    .company-inner-fir-box .img-button .b-list.active .imgbox.js{
        background-size: contain;
    }
    .company-inner-fir-box .img-button .b-list .imgbox{
        height: 30px;
    }
    .company-inner-fir-box .img-button .b-list .title{
        font-size: 16px;
    }

    .company-inner-fir-box .c-right .text-list .fir{
        font-size: 18px;
    }
    .company-inner-fir-box .c-right .text-list .des{
        line-height: 27px;
        margin-top: 1%;
    }

    .swiper-container-honor .imgbox{
        height: 129px;
    }

    .swiper-container-honor .title{
        font-size: 15px;
    }
    .company-inner-sec .honor-more{
        margin: 6% auto 0 auto;
        line-height: 43px;
        width: 133px;
        font-size: 14px;
    }

    .swiper-container-fengcai .swiper-slide {
        width: 71% !important;
    }
    .swiper-container-fengcai .imgbox{
        height: 177px;
    }
    .company-inner-thr {
        margin-bottom: 25%;
    }
    .fengcaibox .swiper-pagination{
        bottom: -19%;
    }
    .swiper-container-fengcai .imgbox .title{
        line-height: 40px;
    }
    .pro-type .pro-type-list{
        width: 49%;
        margin-right: 0;
    }
    .pro-type .pro-type-list a {
        line-height: 45px;
    }
    .de-page-mian .page-inner a{
        min-width: 30px;
        height: 30px;
        line-height: 30px;
        margin-top: 0;
    }
    .de-page-mian{
        margin-top: 7%;
    }

    .pro-inner-bottom{
        display: none;
    }

    .index_pro_box .warpper {
        padding-bottom: 8%;
    }

    .pro-des-left{
        width: 100%;
    }
    .pro-des-top{
        height: auto;
    }
    .pro-des-imgbox {
        width: 100%;
    }
    .pro-des-text{
        width:100%;
        margin-top: 4%;
    }
    .pro-des-text .title{
        font-size: 18px;
    }
    .des-tumb .imgbox{
        height: 63px;
    }
    .case-inner-right{
        width: 100%;
        margin-top: 3%;
    }
    .fangan{
        width: 66%;
    }
    .other-case{
        overflow: hidden;
    }
    .other-case-list {
        float: left;
        width: 50%;
        padding: 0 1%;
    }
    .other-case-list .imgbox{
        height: 145px;
    }

    .des-tumb{
        position: inherit;
        left:inherit;
        bottom:inherit;
        margin-top: 6%;
    }
    .pro-des-text .line{
        margin: 4% 0 5% 0;
    }
    .case-inner-item ul li{
        width: 50%;
    }
    .case-inner-item ul li .img{
        height: 133px;
    }
    .case-inner-item ul li .case-inner-title{
        line-height: 40px;
        font-size: 15px;
    }
    .zhutu{
        width: 100%;
    }
    .news-inner-list .text {
        width: 100%;
    }
    .news-inner-list .imgbox {
        width: 100%;
        height: 158px;
    }
    .news-inner-list .text .title{
        font-size: 16px;
        margin-top: 16px;
    }
    .news-inner-list .text .con{
        margin-top: 3px;
        margin-bottom: 34px;
    }
    .news-inner-list .text .more .kan{
        width: 123px;
        line-height: 35px;
        margin-top: -7px;
    }
    .news-inner-list .text .con{
        margin-bottom: 5%;
    }

    .news-detail-title .h3{
        font-size:18px;
    }
    .honor-inner-list{
        width: 50%;
        margin-right: 0;
    }
    .honor-inner-list .imgbox {
        height: 139px;
    }
    .honor-inner-list .title{
        font-size: 15px;
        padding: 0 5% 6% 5%;
        margin-top: 0;

    }
    .sbanner-crumbs .inner{
        font-size: 12px;
    }

    .sbanner-text-inner{
        width: 80%;
        height: 91px;
        background-size: 100% 100%;
        padding-left: 6%;
        top: 8%;
    }
    .sbanner-text-inner .fir{
        font-size: 18px;
        margin-top: 5%;
    }
    .sbanner-text-inner .sec{
        font-size: 14px;
        margin-top: 1%;
    }



    .guding-title .fir{
        font-size: 22px;
    }
    .guding-item{
        flex-wrap: wrap;
        justify-content: left;
    }
    .guding-list {
        width: 49.7%;
        margin-right: 0.5%;
        margin-bottom: 0.5%;
    }
    .guding-list:nth-child(2n){
        margin-right: 0;
    }
    .guding-list .imgbox .title{
        font-size: 16px;
        line-height: 31px;
    }
    .guding-title .sec{
        font-size: 16px;
        margin: 0 0 5px 0;
    }
    .guding-list .text{
        font-size: 14px;
        line-height: 21px;
        height: 168px;
    }
    .guding-title .thr{
        font-size: 14px;
    }
    .changjin-list{
        width: 49.5%;
        height: 116px;
    }
    .changjin-list .title{
        font-size: 16px;
        line-height: 35px;
        width: 101px;
    }
    .zhuanzhu .fir{
        font-size: 26px;
        line-height: 32px;
    }
    .zhuanzhu .thr{
        font-size: 14px;
    }
    .zhuanzhu .sec{
        font-size: 12px;
        margin: 0 0 3px 0;
    }
    .g-honor-list{
        height: 71px;
    }
    #fu{
        display: none;
    }
	.warpper {
    width: 100%;
    padding: 0 3%;
}
}

