.in_tit { text-align: center;}
.in_tit h5 { color: #d0b476; font-weight: normal; font-size: 14px;}
.in_tit h3 { font-size: 40px; color: #fff;}
.in_tit h3::before { content: ""; display: inline-block; width: 12px; height: 1px; background: #d0b476; margin: 0 10px 10px 0;}
.in_tit h3::after { content: ""; display: inline-block; width: 12px; height: 1px; background: #d0b476; margin: 0 0 10px 10px;}
.in_tit p { color: #8a90ac; margin: 20px 0;}

.in_tit01 { color: #fff;}
.in_tit01 h3 { font-size: 60px; letter-spacing: -3px; font-family: simhei;}
.in_tit01 h4 { font-size: 32px; line-height: 1.6; font-weight: normal;}
.in_tit01 a.more { width: 150px; height: 36px; color: #fff; margin-top: 35px; text-align: center; display: block; position: relative;}
.in_tit01 a.more::after { content: ''; position: absolute; height: 1px; width: 15%; background: #fff; left: 0px; top: 20px; z-index: 1; transition: all .5s ease;}
.in_tit01 a.more:hover::after { width: 100%;}

.in_about { background: url(../img/002.jpg) no-repeat center; padding: 80px 0;}
.in_about .in_abL { width: 38.8%; position: relative; padding: 15.5% 0; display: block;}
.in_about .in_abL img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block;}
.in_about .in_abR { width: calc(100% - 38.8% - 40px); color: #fff;}
.in_about .in_abR h3 { font-family: Impact; font-size: 50px; font-weight: normal;}
.in_about .in_abR h4 { font-size: 32px; font-weight: normal; line-height: 1.6; position: relative; padding-bottom: 15px; margin-bottom: 20px;}
.in_about .in_abR h4::before { content: ''; width: 60px; height: 1px; position: absolute; left: 0; bottom: 0; background: #fff;}
.in_about .in_abR p { line-height: 2; font-size: 14px; display: -webkit-box; overflow: hidden; -webkit-line-clamp: 4; -webkit-box-orient: vertical;
	text-overflow: ellipsis; text-align: justify;}
.in_about .in_abR li { float: left; width: 110px; margin-top: 10px; border: 1px solid #fff; border-radius: 8px; text-align: center; cursor: default;
	background: rgba(255, 255, 255, 0.05); margin-right: 12%; padding: 15px 0;}
.in_about .in_abR li.mr0 { margin-right: 0;}
.in_about .in_abR li span { display: block; margin-top: 10px;}
.in_about .in_abR li:hover img { transform: rotateY(180deg); -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); transition: all .5s ease;}
.in_about .in_abR a.more { width: 150px; height: 36px; color: #fff; margin-top: 35px; text-align: center; display: block; position: relative;}
.in_about .in_abR a.more::after { content: ''; position: absolute; height: 1px; width: 15%; background: #fff; left: 0px; top: 20px; z-index: 1;
	transition: all .5s ease;}
.in_about .in_abR a.more:hover::after { width: 100%;}

.in_product { background: url(../img/310.jpg) no-repeat center;}
.in_product li { float: left; overflow: hidden; width: calc(100% / 4); position: relative;}
.in_product li a.pic { position: relative; width: 100%; padding: 92% 0; display: block;}
.in_product li a.pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; opacity: 0; transition: all .8s ease;}
.in_product li a.txt { position: absolute; top: 0; left: 0; background: rgba(0, 7, 25, 0.2); width: 100%; height: 100%; color: #fff; display: flex;
	transition: all .8s ease; align-items: center; justify-content: center; text-align: center;}
.in_product li a.txt .txtM { width: 100%;}
.in_product li a.txt img { width: 92px; height: 92px; display: block; margin: 0 auto; margin-bottom: 5%;}
.in_product li a.txt h3 { font-size: 24px; color: #fff; position: relative; text-align: center;}
.in_product li a.txt em { height: 1px; width: 8%; background: #fff; margin: 5% auto; display: block;}
.in_product li a.txt p { line-height: 24px; font-size: 14px; width: 65%; margin: 0 auto; display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3;
	-webkit-box-orient: vertical; text-overflow: ellipsis;}
.in_product li:hover a.pic img { opacity: 1; transform: scale(1.2);}
.in_product li:hover a.txt { top: 100%;}

.in_adv { padding: 80px 0; background-image: url(../img/bg_youshi.jpg); background-repeat: no-repeat; background-position: top center;}
.in_adv li { float: left; width: calc((100% - 30px) / 3); margin-right: 15px; background: #EBEEF4; margin-top: 15px;}
.in_adv li.mr0 { margin-right: 0;}
.in_adv li a.pic { position: relative; width: 100%; padding: 26.6% 0; display: block;}
.in_adv li a.pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block;}
.in_adv li a.txt h3 { width: 58px; height: 58px; background: #EBEEF4; border-radius: 58px; margin: -25px auto 0 auto; color: #333; text-align: center;
	font-size: 30px; font-weight: normal; z-index: 99; line-height: 58px; position: relative;}
.in_adv li a.txt p { margin-bottom: 20px; text-align: center; color: #696969; font-weight: bold;}

.in_new { background: url(../img/260.jpg) no-repeat center; padding: 80px 0;}
.in_new .container { display: flex; align-items: center; justify-content: center;}
.in_new .in_newL { width: 28%;}
.in_new .in_newR { width: calc(100% - 28% - 80px); padding-left: 40px;}
.in_new .in_newR li { float: left; width: calc((100% - 40px) / 2); margin-right: 40px;}
.in_new .in_newR li.mr0 { margin-right: 0;}
.in_new .in_newR li a.top { position: relative; width: 100%; display: block;}
.in_new .in_newR li .pic { position: relative; width: 100%; padding: 37.5% 0; display: block; overflow: hidden;}
.in_new .in_newR li .pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; transition: all .8s ease;}
.in_new .in_newR li:hover .pic img { transform: scale(1.1);}
.in_new .in_newR li .txt { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); text-align: center; color: #fff;
	display: flex; align-items: center; justify-content: center; opacity: 0; transition: all .8s ease;}
.in_new .in_newR li .txt span { position: relative;}
.in_new .in_newR li .txt span::before { content: ''; width: 50%; height: 1px; position: absolute; left: 0; top: -8px; background: #fff; margin-left: 25%;
	transition: all .8s ease;}
.in_new .in_newR li:hover .txt { opacity: 1;}
.in_new .in_newR li:hover .txt span::before { width: 8%; margin-left: 46%;}
.in_new .in_newR li a.xia { width: calc(100% - 40px - 2px); padding: 20px 20px 10px; border: 1px solid rgba(255, 255, 255, .2); display: block; color: #fff;}
.in_new .in_newR li a.xia h3 { font-weight: normal; font-size: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%;}
.in_new .in_newR li a.xia p { white-space: nowrap; overflow: hidden; margin: 10px 0; opacity: 0.6; text-overflow: ellipsis;}
.in_new .in_newR li a.xia span { display: block; height: 38px; line-height: 38px; border-top: 1px solid rgba(255,255,255,.2); transition: all .8s ease;
	background: url(../img/hjt.png) no-repeat right center;}
.in_new .in_newR li:hover a.xia span { background: url(../img/bjt.png) no-repeat right center;}

@media screen and ( max-width: 1920px ) {}
@media screen and ( max-width: 1697px ) {}
@media screen and ( max-width: 1680px ) {}
@media screen and ( max-width: 1660px ) {}
@media screen and ( max-width: 1600px ) {}
@media screen and ( max-width: 1518px ) {}
@media screen and ( max-width: 1440px ) {}
@media screen and ( max-width: 1399px ) {}
@media screen and ( max-width: 1377px ) {}
@media screen and ( max-width: 1366px ) {}
@media screen and ( max-width: 1323px ) {}
@media screen and ( max-width: 1280px ) {}
@media screen and ( max-width: 1024px ) {}
@media screen and ( max-width: 768px ) {
	.in_tit h3 { font-size: 34px;}
	.in_tit p { margin: 1em 0;}

	.in_tit01 h3 { font-size: 46px; letter-spacing: 0;}
	.in_tit01 h4 { font-size: 32px; line-height: 1.4; font-weight: normal;}
	.in_tit01 a.more { margin-top: 1em;}

	.in_about { padding: 1.5em 0;}
	.in_about .in_abL { width: 100%; padding: 40% 0; display: block;}
	.in_about .in_abR { width: 100%; margin-top: .5em; display: block;}
	.in_about .in_abR h3 { font-size: 40px;}
	.in_about .in_abR h4 { font-size: 28px; line-height: 1.4; padding-bottom: .3em; margin-bottom: .3em;}
	.in_about .in_abR p { line-height: 1.6; -webkit-line-clamp: 6;}
	.in_about .in_abR li { width: calc((100% - 2em - 8px) / 4); margin-top: .5em; margin: .8em .25em 0 .25em; padding: 11px 0;}
	.in_about .in_abR li.mr0 { margin-right: .25em;}
	.in_about .in_abR li span { margin-top: .5em;}
	.in_about .in_abR a.more { margin-top: 1.8em;}

	.in_product li { width: calc(100% / 2);}
	.in_product li a.pic {padding: 70% 0;}
	.in_product li a.pic img { opacity: 1;}
	.in_product li a.txt { background: rgba(0, 7, 25, 0.6);}
	.in_product li a.txt h3 { font-size: 20px;}

	.in_adv { padding: 1.5em 0; background-size: cover;}
	.in_adv li { width: calc((100% - .5em) / 2); margin: .5em .5em 0 0;}
	.in_adv li.mr0 { margin-right: .5em;}
	.in_adv li:nth-child(2n) { margin-right: 0;}
	.in_adv li a.pic { padding: 24.6% 0;}
	.in_adv li a.txt h3 { width: 54px; height: 54px; border-radius: 54px; margin: -27px auto 0 auto; font-size: 30px; line-height: 54px;}
	.in_adv li:last-child { display: none;}

	.in_new { padding: 1.5em 0;}
	.in_new .in_newL { width: 100%; display: block;}
	.in_new .container { display: block;}
	.in_new .in_newR { width: 100%; padding-left: 0;}
	.in_new .in_newR li { width: 100%; margin: .5em 0;}
	.in_new .in_newR li a.xia { width: calc(100% - 1.6em - 2px); padding: .8em .8em .5em;}
}
@media screen and ( max-width: 414px ) {}
@media screen and ( max-width: 400px ) {}
@media screen and ( max-width: 393px ) {}
@media screen and ( max-width: 375px ) {}
@media screen and ( max-width: 360px ) {}
@media screen and ( max-width: 320px ) {}