.tit { text-align: center; margin-bottom: 45px; font-size: 26px; color: #dfdfdf;}
.tit span { font-size: 14px; color: #9b9b9b; letter-spacing: 3px; display: block;}

.s_bnt_box { padding: 55px 0; position: relative; display: inherit; text-align: center;}
.s_bnt_box .line { height: 1px; background: #545454; position: absolute; z-index: 1; top: 50%; left: 0; width: 100%;}
.s_bnt_box a { position: relative; z-index: 2; margin: 0 -3px; display: inline-block; padding: 0 60px; background: #000; text-align: center;}
.s_bnt_box01 a { background: #303031;}
.s_bnt_box h1 { display: block; font-size: 16px; color: #fff;}
.s_bnt_box span { font-size: 12px; text-transform: uppercase; color: #565657;}

.in_about { background: #303031; text-align: center; padding-bottom: 60px;}
.in_about .in_aboutM { background: url("../img/bg_sjc.jpg") no-repeat center; background-attachment: fixed;}
.in_about .in_abL { width: 40%; height: 545px; display: table; text-align: left;}
.in_about .in_abL .in_abLm { width: 100%; height: 100%; display: table-cell; vertical-align: middle;}
.in_about .in_abL h3 { font-size: 28px; color: #fff; letter-spacing: 3px; font-weight: normal;}
.in_about .in_abL p { font-size: 14px; color: rgba(255,255,255,.5); margin-bottom: 25px; font-family: 'NTAILU';}
.in_about .in_abL h5 { font-size: 20px; color: #fff; letter-spacing: 3px; font-weight: normal;}
.in_about .in_abL span { font-size: 12px; color: #bebebe; color: rgba(190,190,190,.5); font-family: 'NTAILU';}
.in_about .in_abR { width: 50%; height: 545px; display: table; text-align: left;}
.in_about .in_abR .in_abRm { width: 100%; height: 100%; display: table-cell; vertical-align: middle;}
.in_about .in_abR .p1 { font-size: 16px; line-height: 32px; color: #fff;  color: rgba(255,255,255,.7); margin-bottom: 27px;}
.in_about .in_abR .p2 { font-size: 14px; color: #bebebe; color: rgba(190,190,190,.5); line-height: 20.2px; font-family: 'NTAILU';}

.in_ser { background: #000; padding: 60px 0; text-align: center;}
.in_ser li { float: left; width: 25%; background: url(../img/serve_jt.png) no-repeat right center; margin-right: 20px;}
.in_ser li a { background: #545454; display: block; margin-right: 50px; padding: 60px 35px;}
.in_ser li.mr0 { width: 20.4%;}
.in_ser li.mr0, .in_ser li.mr0 a { margin-right: 0;}
.in_ser li .tt { height: 40px; padding-bottom: 20px; border-bottom: 1px solid #d0d0d0; margin-bottom: 20px;}
.in_ser li .tt h5 { font-size: 23px; color: #fff; font-weight: normal;}
.in_ser li .tt span { font-size: 14px; color: #949494;}
.in_ser li p { font-size: 14px; line-height: 23px; overflow: hidden; color: #d4d4d4;}
.in_ser li .pic { position: relative; width: 100%; padding: 28.6% 0; display: block; margin-top: 35px;}
.in_ser li .pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; border-radius: 3px;
	-webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); filter: grayscale(100%);
	-o-filter: grayscale(100%); filter: gray;}
.in_ser li:hover .pic img { -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%);
	-o-filter: grayscale(0%); filter: grayscale(0%); transition: all .5s;}
.in_ser li:hover a { background: #f5f5f5; transition: all .5s;}
.in_ser li:hover .tt span { color:#999; transition: all .5s;}
.in_ser li:hover .tt h5 { color:#000; transition: all .5s;}
.in_ser li:hover p { color:#333; transition: all .5s;}

.in_case { background: #303031; padding: 60px 0; text-align: center;}
.in_case .tit2 { text-align: left;}
.in_case .tit2 h2 { font-family: Salzburg-Regular, Helvetica, sans-serif; letter-spacing: 1px; line-height: 1.2em;
	font-size: 2em; font-weight: 100; margin-bottom: 1vw; color: #fff;}
.in_case .tit2 h2 span { border-bottom: 4px solid #dd432e; padding-bottom: 2px;}
.in_case .tit2 h3 { font-family: Salzburg-Regular, Helvetica, sans-serif; letter-spacing: 1px; line-height: 1.2em;
	font-size: 1em; font-weight: 100; margin-bottom: 3vw; color: #fff;}
.in_case .tit2 h3 a { color: white; border-bottom: 1px dotted #dd432e;}
.in_case .tit2 h3 a:hover { border-bottom: 1px solid #dd432e;}
.in_caseM { position: relative; width: 80%; margin: 0 auto;}
.in_caseM .bd { position: relative; height: 100%; z-index: 0;}
.in_caseM .bd li { zoom: 1; vertical-align: middle; position: relative;}
.in_caseM .bd li a.pic { position: relative; width: 100%; padding: 27% 0; display: block;}
.in_caseM .bd li a.pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block;}
.in_caseM .prev, .in_caseM .next { position: absolute; top: 50%; margin-top: -91px; display: block; padding: 60px 10px;
	width: 30px; height: 62px; background: #222; border-radius: 3px;}
.in_caseM .prev img, .in_caseM .next img { width: 100%; height: 100%;}
.in_caseM .prev { left: -8%;}
.in_caseM .next { left: auto; right: -8%; background-position: right;}
.in_caseM .prev:hover, .in_caseM .next:hover { background: #666;}
.in_caseM .bd li a.txt { position: absolute; bottom: 10px; right: 10px; max-width: 60%; background: rgba(0, 0, 0, 0.8);
	padding: 20px; text-align: right;}
.in_caseM .bd li a.txt h3 { font-family: Salzburg-Regular, Helvetica, sans-serif; letter-spacing: 1px; line-height: 1.5em;
	color: #fff;}
.in_caseM .bd li a.txt p { line-height: 1.5em; color: #fff;}

a.in_more { font-family: Salzburg-Regular, Helvetica, sans-serif; letter-spacing: 1px; line-height: 1.2em; background: #dd432e; color: #fff;
	display: inline-block; border-radius: 3px; text-align: center; font-size: 1.75rem; padding: 14px 24px;}
a.in_more:hover { background: #aa3423; text-decoration: underline; transition: all .5s;}

.in_team { background: #000; padding: 60px 0; text-align: center;}
.in_team li { float: left; width: 20%; overflow: hidden; position: relative;}
.in_team li a.pic { position: relative; width: 100%; padding: 50% 0; display: block;}
.in_team li a.pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block;}
.in_team li a.txt { position: absolute; top: -100%; left: 0; background: #dd432e; display: block; width: 100%; height: 100%;
	text-align: center; color: #fff; transition: all .5s;}
.in_team li a.txt img { width: 19px; height: 19px; margin: 16px auto 4px auto;}
.in_team li a.txt h3 { font-weight: normal; height: 28px; text-align: center; line-height: 34px; font-size: 16px;
	margin-top: 34.8%;}
.in_team li a.txt p { font-size: 14px; text-align: center;}
.in_team li:hover a.txt { top: 0; transition: all .5s;}

.in_elegant { background: #000; padding: 60px 0; text-align: center;}
.in_elegant .in_elem { background: #6666; padding: 10px;}
.in_elegant .in_eleL { width: 49.6%;}
.in_elegant .in_eleL li { float: left; width: 49.2%; margin: 0 10px 10px 0;}
.in_elegant .in_eleL li.mr0 { margin-right: 0; float: right;}
.in_elegant .in_eleL li a.pic { position: relative; width: 100%; padding: 34% 0; display: block; overflow: hidden;}
.in_elegant .in_eleL li a.pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; transition: all .5s;}
.in_elegant .in_eleL .picb { position: relative; width: 100%; padding: 16.8% 0; display: block; overflow: hidden;}
.in_elegant .in_eleL .picb img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; transition: all .5s;}
.in_elegant .in_eleR { width: 49.6%;}
.in_elegant .in_eleR .tite { width: 49.2%; margin-right: 10px;}
/*.in_elegant .in_eleR .tite h1 { line-height: 30px; font-size: 24px; color: #fff; font-weight: lighter; font-family: arial; text-transform: uppercase;}
.in_elegant .in_eleR .tite h2 { line-height: 20px; font-size: 17px; color: #fff; font-weight: lighter;}
.in_elegant .in_eleR .tite img { margin-top: 25px; display: block;}
.in_elegant .in_eleR .tite:hover img, .in_elegant .in_eleR .tite:hover h1, .in_elegant .in_eleR .tite:hover h2 { margin-left: 4px;
	transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s;}*/
.in_elegant .in_eleR .tite a { position: relative; width: 100%; padding: 69.5% 0; display: block; overflow: hidden;}
.in_elegant .in_eleR .tite a img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; transition: all .5s;}
.in_elegant .in_eleR ul { width: 49.2%;}
.in_elegant .in_eleR li { width: 100%; margin-bottom: 10px;}
.in_elegant .in_eleR li.mb0 { margin-bottom: 0;}
.in_elegant .in_eleR li a.pic { position: relative; width: 100%; padding: 34% 0; display: block; overflow: hidden;}
.in_elegant .in_eleR li a.pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; transition: all .5s;}
.in_elegant .in_eleL li:hover a.pic img, .in_elegant .in_eleL .picb:hover img,  .in_elegant .in_eleR li:hover a.pic img,
.in_elegant .in_eleR .tite:hover a img { transition: all .5s; transform: scale(1.1);}

.in_ask { background: #303031; padding: 60px 0; text-align: center;}
.in_ask h2 { font-size: 34px; font-weight: 100; margin-bottom: 30px; letter-spacing: 1px; line-height: 1.2em; color: #fff;
	text-align: center;}
.in_ask .in_askm h3 { display: flex; justify-content: space-between; align-items: center; color: #fff;
  	background: #3d3b38; font-size: 24px; padding: 20px 30px; cursor: pointer; margin-top: 20px;}
.in_ask .in_askm li { padding: 20px 20px 0 20px; color: #fff; letter-spacing: 1px; line-height: 1.2em; font-size: 20px;}
.in_ask .in_askm li a { color: #fff; text-align: left;}
.in_ask .in_askm h3 em { background: url(../img/faq_arrow.png) no-repeat center; background-size: contain;
  	width: 25px; height: 25px; transition: all .25s ease;}
.in_ask .in_askm h3.on em { transform: rotate(180deg);}

@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: 1540px )  and ( min-width: 1280px ) {
	.in_ser li { width: 24.9%;}
	.in_elegant .in_eleL li { width: 49.1%;}
	.in_elegant .in_eleR ul { width: 49%;}
}
@media screen and ( max-width: 1500px ) {}
@media screen and ( max-width: 1440px ) and ( min-width: 1280px ) {}
@media screen and ( max-width: 1399px ) {}
@media screen and ( max-width: 1377px ) {}
@media screen and ( max-width: 1366px ) {
	.in_elegant .in_eleR ul { width: 48.9%;}
}
@media screen and ( max-width: 1323px ) {}
@media screen and ( max-width: 1280px ) {}
@media screen and ( max-width: 1024px ) {}
@media screen and ( max-width: 768px ) {}
@media screen and ( max-width: 414px ) {
	.in_about { padding-bottom: 1.5em;}
	.in_about .in_aboutM { padding: 1.5em}
	.in_about .in_abL { width: 100%; height: auto;}
	.in_about .in_abL .in_abLm { width: 97%; height: auto; padding-left: 3%;}
	.in_about .in_abL h3 { font-size: 18px; letter-spacing: 1px; line-height: 1.6;}
	.in_about .in_abL p { font-size: 11px; margin-bottom: 10px;}
	.in_about .in_abL h5 { font-size: 16px; letter-spacing: 1px;}
	.in_about .in_abL span { font-size: 11px;}
	.in_about .in_abR { width: 100%; height: auto; margin-top: 1em;}
	.in_about .in_abR .in_abRm { width: 97%; height: auto; padding-left: 3%;}
	.in_about .in_abR .p1 { font-size: 12px; line-height: 23px; margin-bottom: 0;}
	.in_about .in_abR .p2 { display: none;}

	.tit { margin-bottom: 1em; font-size: 19px;}
	.tit span { font-size: 11px;}

	.s_bnt_box { padding: 1em 0;}
	.s_bnt_box a {  padding: 0 1em; width: 26%;}
	.s_bnt_box a img { width: 100%; height: auto;}
	.s_bnt_box a {  padding: 0 .5em;}
	.s_bnt_box h1 { display: block; font-size: 16px; color: #fff;}
	.s_bnt_box span { font-size: 12px; text-transform: uppercase; color: #565657;}

	.in_ser { padding: 1.5em 0;}
	.in_ser li { width: 46%; background: none; margin: .5em;}
	.in_ser li a { margin-right: 0; padding: 20px 15px;}
	.in_ser li.mr0 { width: 46%;}
	.in_ser li.mr0, .in_ser li.mr0 a { margin-right: 0;}
	.in_ser li .tt { height: auto; padding-bottom: 10px; margin-bottom: 10px;}
	.in_ser li .tt h5 { font-size: 16px;}
	.in_ser li .tt span { font-size: 11px;}
	.in_ser li .pic { margin-top: 10px;}

	.in_case { padding: 1.5em 0;}
	.in_case .tit2 { padding: 0 1em;}
	.in_case .tit2 h2 { font-size: 1.2em; margin-bottom: 2vw;}
	.in_case .tit2 h2 span { border-bottom: 2px solid #dd432e; padding-bottom: 0;}
	.in_case .tit2 h3 { font-size: .8em;}
	.in_caseM .prev, .in_caseM .next { display: none;}
	.in_caseM { width: 100%;}
	.in_caseM .bd li a.pic { padding: 30% 0;}
	.in_caseM .bd li a.txt { max-width: 80%;}
	.in_caseM .bd li a.txt h3 { line-height: 1.2em; font-size: .7em;}
	.in_caseM .bd li a.txt p { line-height: 1.2em; font-size: .6em;}

	a.in_more { font-size: 1.5rem; margin-top: .5em;}

	.in_team { padding: 1.5em 0;}
	.in_team li { width: 50%;}

	.in_elegant { padding: 1.5em 0;}
	.in_elegant .in_elem { padding: .5em;}
	.in_elegant .in_eleL { width: 100%; margin-bottom: .5em;}
	.in_elegant .in_eleL li { float: left; width: 49%; margin: 0 .5em .5em 0;}
	.in_elegant .in_eleR { width: 100%;}
	.in_elegant .in_eleR .tite { width: 100%; margin: 0 0 .5em 0;}
	.in_elegant .in_eleR ul { width: 100%;}
	.in_elegant .in_eleR li { float: left; width: 49%; margin: 0 .5em 0 0;}
	.in_elegant .in_eleR li.mb0 { margin: 0;}

	.in_ask { padding: 1.5em 0;}
	.in_ask h2 { font-size: 1.3em; margin-bottom: 2vw; letter-spacing: 1px; line-height: 1.2em; color: #fff;
		text-align: center;}
	.in_ask .in_askm h3 { font-size: 1.1em; padding: 1em; margin-top: .5em; font-weight: normal;}
	.in_ask .in_askm li { padding: .5em .5em 0 .5em; font-size: 18px;}
}
@media screen and ( max-width: 400px ){}
@media screen and ( max-width: 393px ){
	.in_elegant .in_eleL li, .in_elegant .in_eleR li { width: 48.9%;}
}
@media screen and ( max-width: 375px ){
	.in_ser li, .in_ser li.mr0 { width: 45.9%;}
}
@media screen and ( max-width: 360px ){
	.in_ser li, .in_ser li.mr0 { width: 45.7%;}
	.in_elegant .in_eleL li, .in_elegant .in_eleR li { width: 48.8%;}
}
@media screen and ( max-width: 320px ){}