@charset "utf-8";
/* CSS Document */

@font-face {
	font-family: 'FZLTZHK';
	src: url('fonts/FZLTZHK.eot');
	src: url('fonts/FZLTZHK.eot') format('embedded-opentype'),
		 url('fonts/FZLTZHK.woff2') format('woff2'),
		 url('fonts/FZLTZHK.woff') format('woff'),
		 url('fonts/FZLTZHK.ttf') format('truetype'),
		 url('fonts/FZLTZHK.svg#FZLTZHK') format('svg');
}
@font-face {
	font-family: 'FZZZHJT';
	src: url('fonts/FZZZHJT.eot');
	src: url('fonts/FZZZHJT.eot') format('embedded-opentype'),
		 url('fonts/FZZZHJT.woff2') format('woff2'),
		 url('fonts/FZZZHJT.woff') format('woff'),
		 url('fonts/FZZZHJT.ttf') format('truetype'),
		 url('fonts/FZZZHJT.svg#FZZZHJT') format('svg');
}

html { overflow-y:scroll; }
body { background:#FFF; font-size:14px; line-height:24px; -webkit-text-size-adjust:100%; min-width: 980px; }
body, input, textarea, select { color:#343232; font-family: 'PingFangSC-Regular', 'Microsoft YaHei'; }
body, h1, h2, h3, p, ul, dl, dd, form, textarea, input, ol { margin:0; }
h1, h2, h3, h4 { font-weight: normal; }
ul, ol, td, th { padding:0; list-style:none outside; }
a { color:#FAE6AD; text-decoration:none; -webkit-tap-highlight-color:transparent; }
i, strong, em { font-style:normal; font-weight:normal; }
a:focus, input, textarea, select { outline:none; }
textarea { overflow:auto; resize:none; }
input, textarea, select { font-size:100%; }
img { border:0; vertical-align:middle; max-width: 100%; }
table { border-collapse:collapse; }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button,
input[type=submit], input[type=reset], input[type=number], input[type=tel],
input[type=text], input[type=password], button, textarea { -webkit-appearance: none !important; margin: 0; }
input[type=number] { -moz-appearance:textfield; }
input, textarea, button { border-radius:0; }

.animate { transition:all 0.3s; -webkit-transition:all 0.3s; }
.clear:after { display:block; clear:both; content:''; visibility:hidden; height:0; }.clear { zoom:1; }
.breakall { word-break:break-all; word-wrap:break-word; }
.float-left { float:left; display:inline; } .float-right { float:right; display:inline; }
.intr{font-size: 16px;line-height: 32px;}
.justify { text-align:justify; text-justify:inter-ideograph; }
.nowrap { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.noright { margin-right:0!important; padding-right:0!important; }
.noborder { border:none!important; }

.top { position: relative; overflow: hidden; text-align: center; }
	.top:before, .top:after { position: absolute; width: 100%; height: 100%; content: ''; background-color: rgba(150, 30, 35, 0.18); }
	.top:after { left: 0; top: 0; background-image:linear-gradient( to top, rgba(150,30,35,1) 0%, rgba(150,30,35,1) 18%, rgba(150,30,35,0) 62%); }
		h1 { font-family: 'FZZZHJT'; position: absolute; width: 100%; line-height: 1em; top: 50%; z-index: 1; color: #FAE6AD; font-size: 70px; letter-spacing: 4px; }
			h1 big { font-size: 40px; line-height: 48px; letter-spacing: 10px; padding-top: 10px; font-family: 'PingFangSC-Regular', 'Microsoft YaHei'; display: block; }
			h1 small { font-size: 20px; line-height: 24px; letter-spacing: 0; padding-top: 20px; font-family: 'PingFangSC-Regular', 'Microsoft YaHei'; display: block; }
.navigation { text-align: left; font-family: 'FZZZHJT'; position: absolute; left: 0; bottom: 20px; width: 100%; display: flex; justify-content: center; flex-direction: row; font-size: 24px; line-height: 70px; background-color: #961E23; z-index: 99; }
	.navigation.fixed { position: fixed; top: 0; bottom: auto; }
		.navigation a { display: block; position: relative; }
		.navigation a.current:after { content: ''; position: absolute; width: 100%; height: 4px; left: 0; bottom: 0; background-color: #FAE6AD; }
		.dropmenu, .bar { display: none; }
	.star { width: 53px; height: 53px; background: url(../image/star_yellow.svg) 50% 25px no-repeat; background-size: 16px auto; }
.bglightyellow { background-color: #F4F0E7; }
	.swiper-container { padding-bottom: 60px; }
	.container { padding: 0 30px 46px; max-width: 920px; margin: auto; }
		.title { font-family: 'FZLTZHK'; text-align: center; font-size: 30px; line-height: 40px; padding: 80px 0 48px; color: #961E23; position: relative; }
			.title:before, .title:after { width: 32px; height: 32px; background: url(../image/star_red.svg) no-repeat; background-size: 100% auto; content: ''; margin: 4px 30px 0; display: inline-block; vertical-align: top; }
		.swiper-slide { max-width: 920px; overflow: hidden; text-align: center; position: relative; }
			.swiper-slide:after { position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ''; transition: background-color 0.3s; background-color: rgba(255,255,255,0.8); z-index: 1; }
				.bglightyellow .swiper-slide:after { background-color: rgba(244,240,231,0.8); }
			.swiper-slide.swiper-slide-active:after { background-color: rgba(255,255,255,0); width: 65%; }
				.bglightyellow .swiper-slide.swiper-slide-active { background-color: rgba(244,240,231,0); }
			.swiper-image { width: 65%; box-sizing: border-box; height: 598px; transition: left 0.3s; position: relative; left: 0; display: flex; justify-content: center; align-items: center; float: left; text-align: center; }
				.swiper-image img { max-height: 100%; }
		.swiper-words { width: 31.5%; float: right; transition: opacity 0.3s; opacity: 0; margin-top: 50px;}
			.swiper-title { font-size: 16px; text-align: left; padding: 0 0 18px; }
			.scroll { height: 408px; }
			.swiper-slide.swiper-slide-active .swiper-words { opacity: 1; }
			.swiper-words .swiper-slide { width: auto; height: auto; text-align: justify; }
				.swiper-words .swiper-slide .justify { padding-right: 28px; }
			.swiper-image-prev { left: 35%; }
.swiper-lesson-button { position: absolute; left: 50%; margin-left: 222px; bottom: 102px; z-index: 1; }
	.swiper-button-next, .swiper-button-prev { position: static; float: left; margin-top: 0; width: 40px; height: 40px; background: url(../image/left.svg); background-size: 100% auto; cursor: pointer; }
	.swiper-button-next { background-image: url(../image/right.svg); }
	.number { float: left; margin: 0 20px; line-height: 36px; font-size: 30px; font-family: 'Myriad Pro'; }
.image { height: 500px; overflow: hidden; text-align: center; }
	.virtual { max-width: 1170px; padding: 0 10px 64px; display: block; margin: auto; }
.tourist { max-width: 1170px; margin: auto; padding: 0 10px; margin-bottom: 126px; }
	.tourist li { float: left; width: 33.3%; box-sizing: border-box; padding: 0 25px 0 55px; }
		.tourist .logo { width: 58px; height: 48px; background-size: auto 100%; background-position: 0 50%; margin-bottom: 39px; background-repeat: no-repeat; }
			.video { background-image: url(../image/video.svg); }
			.wechat { background-image: url(../image/wechat.svg); }
			.qrcode { background-image: url(../image/qrcode.svg); }
			.music { background-image: url(../image/music.svg); }
		.tourist p { display: none; }
.list { float: right; width: 42.4%; line-height: 50px; font-size: 16px; padding-top: 9px; }
	.newsvideo { float: left; width: 50%; }
		.newsvideo video { display: block; }
	.list li { padding-left: 37px; background: url(../image/star_red.svg) no-repeat 0 50%; background-size: 16px auto; }
		.list a { display: block; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
		.list a, .footer { color: #343232; }
		.anchor, .anchor2 { height: 0; display: block; position: relative; top: -45px; }
.footer { text-align: center; background-color: #F4F0E7; font-size: 12px; padding: 71px 0 82px; }
	.footer img { width: 165px; }
	.share { margin: 36px 0 40px; height: 32px; }
		.share a { background: url(../image/weibo_share.svg); background-size: 100% auto; display: inline-block; vertical-align: top; margin: 0 7px; width: 32px; height: 32px; position: relative; z-index: 15; }
			.share img { display: none; position: absolute; left: 50%; top: -192px; margin-left: -88px; width: auto; max-width: none; border: 1px solid #333; }
		.share a.weixin { background-image: url(../image/wechat_share.svg); }
		.share a:hover img { display: block; }
	iframe { width: 980px; height: 860px; margin: auto; display: block; margin-bottom: 86px; }
.jspContainer { overflow:hidden; position:relative; }
	.jspPane { position:absolute; }
	.jspVerticalBar { position:absolute; top:0; right:0; width:26px; height:100%; }
		.jspCap { display:none; }
		.jspTrack { background:none; position:relative; }
			.jspDrag { background-color: #999999; width: 5px; border-radius: 5px; float: right; position:relative; top:0; cursor:pointer; }
		.jspArrow { background:#50506d; text-indent:-20000px; display:block; cursor:pointer; padding:0; margin:0; }
		.jspArrow.jspDisabled { cursor:default; background:#80808d; }
			.jspVerticalBar .jspArrow { height:16px; }
	.jspHorizontalBar { position:absolute; bottom:0; left:0; width:100%; height:0; }
		.jspHorizontalBar .jspCap { float:left; }
			.jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag { float:left; height:100%; }
		.jspCorner { background:none; float:left; height:100%; }
		.jspHorizontalBar .jspArrow { width:16px; float:left; height:100%; }
@media screen and (max-width: 768px){
	body { min-width: 0; line-height: 20px; }
		.top:before, .top:after, .top img, .navigation .star, .navigation li:nth-last-of-type(1), .swiper-slide.swiper-slide-active:after, .weibo { display: none; }
	.top { height: 100vh; background: url(../image/1.jpg) no-repeat 50% 0; background-size: auto 62%; width: 100%; }
		h1 { height: 38.2%; top: auto; box-sizing: border-box; padding-top: 10vh; bottom: 0; background: #961E23; font-size: 36px; letter-spacing: 0; }
			h1 big { font-size: 24px; padding-top: 0px; letter-spacing: 0px;}
			h1 small { font-size: 14px; padding-top: 15px; }
		.arrow { width: 16px; height: 8px; background: url(../image/down.svg); background-size: 100% auto; position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 1; animation:arrow 1.8s infinite; }
	.menu { position: fixed; width: 32px; height: 29px; right: 20px; top: 11px; background: url(../image/menu.svg); background-size: 100% auto; z-index: 100; }
	.navigation { display: flex; flex-direction: column; justify-content: flex-start; transition: transform 0.3s; transform: translateX(100%); position: fixed; box-sizing: border-box; padding: 80px 0 0 37px; line-height: 38px; font-size: 16px; width: 100%; height: 100%; left: 0; top: 0; }
		.dropmenu { display: block; }
			.dropmenu a { padding-left: 17px; background: url(../image/star_yellow.svg) no-repeat 0 50%; background-size: 8px auto; }
		.navigation a.current:after { display: none; }
		.navigation.show { transform: none; }
	.container { padding: 0 10px 50px; }
		.title { font-size: 20px; line-height: 28px; padding: 30px 0; }
			.title:before, .title:after { width: 24px; height: 24px; margin: 2px 15px 0; }
		.anchor, .anchor2 { top: -50px; }
	.bar { text-align: left; display: block; position: fixed; left: 0; top: 0; background-color: #961E23; color: #FFF; font-size: 16px; text-indent: 15px; line-height: 50px; z-index: 99; width: 100%; }
	.swiper-image { width: 100%; padding: 0 10px; height: 300px; }
	.swiper-words { width: 100%; padding: 0 10px; box-sizing: border-box; margin-top: 10px; }
		.scroll { height: auto; }
		.swiper-title { padding-top: 15px; height: auto; }
		.swiper-image-prev { left: 0; }
	.swiper-lesson-button { z-index: 98; position: fixed; left: 0; top: auto; bottom: 0; width: 100%; transition: transform 0.3s; transform: translateY(101%); display: flex; justify-content: center; flex-direction: row; padding: 13px 0; background-color: rgba(150,30,35,0.8); margin-left: 0; }
		.swiper-button-next, .swiper-button-prev { width: 32px; height: 32px; }
		.swiper-button-prev { background-image: url(../image/left_white.svg); }
		.swiper-button-next { background-image: url(../image/right_white.svg); }
		.number { font-size: 25px; line-height: 32px; color: #FFF; }
		.swiper-lesson-button.current { transform: none; }
	.tourist { margin: -30px 0 50px; }
		.tourist li { float: none; width: 100%; padding: 0; text-align: center; }
			.tourist .logo { margin: 49px auto 32px; background-position: 50%; }
			.tourist p { display: block; }
			.tourist .justify { text-align: center; }
	.newsvideo, .list { float: none; width: 100%; }
		.list { font-size: 14px; line-height: 33px; }
		.list li { padding-left: 30px; }
		.virtual { padding-bottom: 40px; }
	.footer { padding: 30px 0; background-color: #FFF; }
		.share { margin: 20px 0; }
}

@keyframes arrow {
	from { bottom: 26px; }
	to { bottom: 18px; }
}
