@charset "utf-8";
/* CSS Document */

@font-face {
	font-family: "FZDBSJW";
	src: url("fonts/FZDBSJW.eot");
	src: url("fonts/FZDBSJW.eot?#iefix") format("embedded-opentype"),
		 url("fonts/FZDBSJW.woff") format("woff"),
		 url("fonts/FZDBSJW.ttf") format("truetype"),
		 url("fonts/FZDBSJW.svg#FZDBSJW") format("svg");
	font-style: normal;
	font-weight: normal;
}

html { overflow-y:scroll; }
body { background:#283C32; font-size:14px; line-height:20px; -webkit-text-size-adjust:100%; }
body, input, textarea, select { color:#8B9995; font-family: 'PingFangSC-Regular', 'Microsoft YaHei', '微软雅黑', sans-serif; }
body, h1, h2, h3, p, ul, dl, dd, form, textarea, input, ol { margin:0; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; }
ul, ol, td, th { padding:0; list-style:none outside; }
a { color:#8B9995; text-decoration:none; -webkit-tap-highlight-color:transparent; transition: color 0.3s; }
a:hover { color: #F3C57C; }
button, input { -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; }
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; }
.justify { text-align:justify; text-justify:inter-ideograph; }
.nowrap, .nowrap li { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.noright { margin-right:0!important; padding-right:0!important; }
.noborder { border:none!important; }

.header { position: fixed; width: 100%; left: 0; top: 0; z-index: 99; background: url(../image/menu_bg@2x.png) 50%; height: 90px; background-size: auto 100%; letter-spacing: 1.88px; }
	.navigation { font-size: 24px; line-height: 70px; display: flex; justify-content: center; font-family: FZDBSJW; }
		.navigation a { display: block; padding: 0 28px; color: #F3C57C; }
		.navigation a:hover, .navigation a.current { background: url(../image/menu_over@2x.png) no-repeat 50% 54px; background-size: auto 2px; }
.poster { padding-top: 70px; display: flex; justify-content: center; background: url(../image/poster@2x.jpg) 50% no-repeat; background-size: cover; height: 846px; color: #F3C57C; }
	.poster dt { padding-top: 99px; }
	.poster dd { padding-top: 142px; margin-left: -29px; width: 454px; }
		.poster h1 { font-family: FZDBSJW; font-size: 72px; line-height: 82px; letter-spacing: 5.62px; text-align: center; }
		.poster h2 { font-family: FZDBSJW; font-size: 27px; line-height: 31px; letter-spacing: 11px; text-align: center; }
		.rectangle { margin: 10px 0 18px; background: url(../image/line2.svg) no-repeat 50%; height: 2px; background-size: auto 2px; }
		.host { border: 1px solid #F3C57C; margin-top: 51px; padding: 0 23px 17px; }
			.host p { line-height: 30px; padding-top: 16px; }
				.host p:nth-of-type(1) { padding: 16px 3px 20px; margin: 0 -3px 20px; border-bottom: 1px solid #F3C57C; }
.gray { background-color: #BABABA; color: #281F18; }
	.auto888 { margin-left: auto; margin-right: auto; max-width: 888px; padding: 0 20px; }
	.auto1000 { margin-left: auto; margin-right: auto; max-width: 1000px; padding: 0 20px; }
.title { font-family: FZDBSJW; font-size: 24px; line-height: 27px; letter-spacing: 1.88px; text-align: center; padding: 80px 0 14px; color: #F3C57C; }
	.gray .title { color: #336354; }
	.line { height: 2px; background-position: 50%; background-size: auto 2px; background-repeat: no-repeat; }
		.line1 { background-image: url(../image/line1@2x.png); }
		.line2 { background-image: url(../image/line2.svg); }
		.line3 { background-image: url(../image/line3.svg); }
		.line4 { background-image: url(../image/line4.svg); }
		.line5 { background-image: url(../image/line5.svg); }
		.line6 { background-image: url(../image/line6@2x.png); }
.foreword { display: flex; flex-direction: row-reverse; justify-content: space-between; padding: 57px 0 80px; align-items: center; }
	.foreword dd { width: 565px; }
	.foreword dt { margin-right: 10px; width: 241px; color: #336354; text-align: center; }
		.foreword .my-gallery figure { margin: 0; width: auto; height: auto; float: none; }
			.foreword .my-gallery a { width: 241px; height: 163px; }
				.foreword .my-gallery img { position: static; visibility: visible; transform: none; width: 100%; height: auto; }
		.foreword p { margin: 21px 0 8px; }
		.foreword small { font-size: 12px; }
.my-gallery { overflow: hidden; }
	figcaption { display: none; }
	.my-gallery figure { float: left; margin: 0 36px 36px 0; }
		.my-gallery figure:nth-of-type(4n) { margin-right: 0; }
		.my-gallery a { display: block; position: relative; width: 195px; overflow: hidden; height: 195px; background-size: cover; background-repeat: no-repeat; background-position: 50%; }
			.my-gallery img { width: 195px; height: 195px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
	.pswp__caption { transition: transform 0.3s; background-color: transparent; }
		.pswp--zoomed-in .pswp__caption { transform: translateY(100%); }
		.pswp__caption__center { max-width: 90%; }
.lesson1 { background: url(../image/bg1@2x.jpg) 50% no-repeat; background-attachment: fixed; background-size: auto 934px; padding-bottom: 44px; }
	.moreword { margin: 30px 0 21px; overflow: hidden; }
		.moreword span { display: block; }
		.moreword h3 {font-size:14px; margin-bottom:6px; font-weight:bold;}
		.moreword p {margin-bottom:10px;}
	.text-center { text-align: center; }
	.more { display: none; vertical-align: top; }
		.more span { width: 24px; height: 24px; display: inline-block; vertical-align: top; background: url(../image/show@2x.png); background-size: 24px auto; }
			.more.hide span { background-image: url(../image/hide@2x.png); }
		.more i { border: 1px solid #F3C57C; margin-left: 8px; display: inline-block; vertical-align: top; line-height: 22px; padding: 0 9px; border-radius: 12px; color: #F3C57C; }
			.gray .more i { border-color: #336354; color: #336354; }
	.text-center + .my-gallery { margin-top: 50px; }
.lesson2 { background: url(../image/bg2@2x.jpg) 50% no-repeat #BABABA; background-attachment: fixed; background-size: auto 934px; padding-bottom: 44px; }
	.lesson3 { background: url(../image/bg3_1920@2x.jpg) 50%; background-attachment: fixed; background-size: 1920px auto; padding-bottom: 44px; }
	.lesson4 { padding-bottom: 80px; }
.feeds { background: url(../image/bg_news@2x.jpg) 50% no-repeat; background-attachment: fixed; background-size: auto 584px; padding-bottom: 80px; }
	.feeds ul { width: 630px; height: 373px; margin: 34px auto 0; line-height: 30px; padding-top: 22px; background: url(../image/box1.svg); background-size: cover; }
		.feeds li { margin-left: 90px; width: 380px; }
.virtual { background: url(../image/side1.png) no-repeat 0 50% fixed, url(../image/side2.png) no-repeat 100% 50% fixed; background-color: #BABABA; background-size: 159px auto; padding-bottom: 80px; }
	.virtualbox { width: 916px; margin: 33px auto 0; background: url(../image/box2.svg) 50% no-repeat; background-size: 100% auto; padding: 17px; }
.guidebox { width: 959px; height: 599px; background: url(../image/daolan@2x.png); background-size: 100% auto; margin: 56px auto 80px; }
	.guidebox .justify { width: 543px; margin: auto; padding: 130px 0 0; }
.weibo { padding-bottom: 80px; }
	.weibo iframe { width: 980px; height: 860px; margin: 60px auto 0; display: block; }
.footer { padding: 80px 0; }
	.logo { width: 165px; height: 62px; background: url(../image/logo.svg) no-repeat; background-size: contain; margin: 0 auto 35px; }
	.footer a { width: 34px; height: 34px; display: inline-block; vertical-align: top; margin: 0 5px; background-size: contain; }
		.icon-weibo { background-image: url(../image/weibo.svg); }
		.icon-weixin { background-image: url(../image/weixin.svg); position: relative; }
			.icon-weixin img { display: none; width: 86px; height: 86px; position: absolute; left: 48px; top: -25px; }
			.icon-weixin:hover img { display: block; }
	.copy { font-size: 12px; color: #F3C57C; margin-top: 38px; line-height: 17px; }
@media (max-width: 1080px){
	.navigation { font-size: 20px; }
		.navigation a { padding: 0 24px; }
}
@media (max-width: 940px){
	.virtual, .weibo, .navigation li:nth-of-type(5), .navigation li:nth-of-type(7) { display: none; }
	.header { background: none; height: 100vh; transform: translateX(-100%); transition: transform 0.3s; background: url(../image/bg3_1920@2x.jpg) 50%; background-size: cover; }
		.header.show { transform: translateX(0); }
		.navigation { flex-direction: column; line-height: 52px; padding-top: 80px; }
	.icon-menu { position: fixed; z-index: 100; right: 24px; top: 24px; width: 32px; height: 32px; background: url(../image/icon_menu.svg) no-repeat 50%; background-size: 32px auto; }
		.icon-menu.close { background-image: url(../image/icon_close.svg); background-size: 24px auto; }
	.poster { flex-direction: column; height: auto; padding-top: 0; position: relative; }
		.poster dt { padding-top: 300px; }
			.poster img { height: auto; max-width: 100%; }
			.poster-title { position: absolute; top: 0; width: 100%; }
				.poster-title h1:before { display: block; content: ''; width: 165px; height: 62px; background: url(../image/logo.svg); margin: 42px auto 32px; }
		.poster dd { margin: 0; width: 100%; padding-top: 0; }
			.host { margin: -240px 20px 20px; }
	.title { padding-top: 40px; }
		.title span { display: block; height: 7px; overflow: hidden; }
	.foreword { flex-direction: column; padding: 28px 20px 40px; }
		.foreword dd { width: auto; margin-top: 20px; }
	.my-gallery { display: flex; justify-content: space-between; flex-wrap: wrap; }
		.my-gallery figure { float: none; margin: 0 0 18px; width: calc(48vw - 20px); height: calc(48vw - 20px); }
			.my-gallery a { width: 100%; height: 100%; }
			.my-gallery img { width: 100%; height: 100%; }
		.text-center + .my-gallery { margin-top: 25px; }
	.lesson3, .lesson2, .lesson1 { padding-bottom: 24px; }
		.moreword { height: 180px; }
		.more { display: inline-block; }
	.feeds, .lesson4 { padding-bottom: 40px; }
	.feeds ul { width: auto; height: auto; background: none; padding: 0; }
		.feeds li { margin: 0 20px; width: auto; }
	.guide { background-color: #BABABA; }
		.guide .title { color: #336354; }
		.guidebox { width: auto; height: auto; background: none; margin: 28px 0 0; }
			.guidebox .justify { width: auto; height: auto; margin: 0 20px; padding: 0 0 40px; color: #281F18; }
	.footer { padding: 40px 0; }
}














/*首页前言展览介绍展览动态虚拟展厅参观导览微博热议古蜀华章四川古代文物菁华序章自然造物第一章伴月三星：三星堆文化时期第二章金沙光芒：十二桥文化时期展览动态虚拟展厅参观导览微博热议第三章马家风尚：青羊宫文化时期尾章水润天府*/