/**************************
*** Time: 20180327
*** author: Jamier
*** 
****************************/

@charset "utf-8";

section.publicize{
	background-color: #000;
}
.section2{
	background-color: #777;
}
.section3{
	background-color: #555;
}
.section4{
	background-color: #333;
}
.section5{
	background-color: #111;
}
.section6{
	background-color: #FFF;
}
/*   大区块控制   */
.boxWrap{
	width: 100%;
	height: 100%;
	border:4px solid #FFF;
}
.boxWrap>*{
	float: left;
	border:4px solid #FFF;
}
.boxWrap .title{ 
	background-size: 70%;
	background-position: right bottom;
	background-repeat: no-repeat;
}
.boxWrap .info {
    padding-top: 7%;
    padding-left: 9%;
    padding-right: 15%;
    font-weight: normal;
	color: #b49f7a;
	font-size: 24px;
}
.boxWrap>a{
	display: block;
	position: relative;
	-o-transition: all .20s linear;
	-webkit-transition: all .20s linear;
	-moz-transition: all .20s linear;
	transition: all .20s linear;
}



.Footer2{
	display: none;
}
a.rss {
    border-radius: 8px;
	margin: 0;
	display: inline-block;
	width: 31px;
	height: 31px;
	text-indent: -99999px;
	background-image: url(../images/rss.svg);
	background-color: #f26109;
	margin-left: 13px;
	background-size: 62%;
	background-repeat: no-repeat;
	background-position: center;
}

section.publicize::before{
	content: "滚动滑轮";
	display: block;
	position: absolute;
	z-index: 98;
	bottom:112px;
	left: 50%;
	width: 200px;
	height: 30px;
	margin-left: -100px;
	color: #e83428;
	font-size: 16px;
	text-align: center;
}
section.publicize::after {
	content: "";
	-webkit-animation-name: JUMP;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: normal;
	transition: all 0.3s ease-in-out;
	width: 26px;
	height: 36px;
	display: block;
	position: absolute;
	z-index: 98;
	background: url(../images/icon/mouse.png) center/contain;
	bottom: 150px;
	left: 50%;
	margin-left: -13px;
	opacity: 1;
}

section.publicize.ismobile::before{content: "请滑动屏幕";}
section.publicize.ismobile::after{
    -webkit-animation-name: JUMP2;
    background: url(../images/icon/hand.png) center/contain;
}

.section.publicize.removeIcon:after,.section.publicize.removeIcon:before{
	opacity: 0;
}
@keyframes 
JUMP {
	 0% {
	bottom: 150px;
	}
	50% {
	bottom: 170px;
	}
	80% {
	bottom: 150px;
	}
	 100% {
	bottom: 150px;
	}
}
 @-webkit-keyframes 
JUMP {
	 0% {
	bottom: 150px;
	}
	50% {
	bottom: 170px;
	}
	80% {
	bottom:150px;
	}
	 100% {
	bottom: 150px;
	}
}

@keyframes 
JUMP2 {
    0% {
	left: 50%;
	}
    25%{
    left: 49%;    
    }
	50% {
	left: 50%;
	}
	75% {
	left: 51%;
	}
	 100% {
	left: 50%;
	}
}
 @-webkit-keyframes 
JUMP2 {
	0% {
	left: 50%;
	}
    25%{
    left: 49%;    
    }
	50% {
	left: 50%;
	}
	75% {
	left: 51%;
	}
	 100% {
	left: 50%;
	}
}

.publicize .fotorama__html div,
.publicize .fotorama__html a {
     background: url(../images/alpha.gif); 
     text-indent: -9999px; 
}

section.publicize .fotorama__arr--prev{
	left: 4vw;
}
section.publicize .fotorama__arr--next{
	right:4vw;
}


/*----------------------------
all left
-------------------------*/


.alltitle .title {
	width: 33.3333%;
	height: 100%;
}
.alltitle .title .words {
	height: 10%;
    padding: 3vh 2.5vw;
	color: #333;
    font-size: 30px;
    font-weight: 500;
    background: #eee;
}
.alltitle .title .words:before {
	content: '';
	display: inline-block;
	position: relative;
    top: 4px;
    right: 15px;
	width: 7px;
    height: 30px;
	background: #B49F7A;
}

.alltitle .title .titleBox {
	height: 90%;
    border-top: 4px solid #FFF;
    /*border-bottom: 4px solid #FFF;*/
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.alltitle .title .titleBox a {
    border: 1px solid #eee;
}
.alltitle .titleBox a {
    display: block;
    width: 100%;
    height: 100%;
    padding: 3vh 3.7vw;
    text-indent: 0;
}
.alltitle .titleBox .top {
	color: #b49f7a;
	font-size: 24px;
	font-weight: 500;
}
.alltitle .titleBox .des {
	display: block;
	margin-top: 14px;
	font-size: 16px;
	color: #666;
}









/*----------------------------
2 作品赏析
-------------------------*/

/*2-1*/
.exhibition .title{
}

/*2-2*/
.exhibition .hotBanner1{
	/*width: 66.6666%;*/
    width: 33.3333%;
	height: 50%;
}
.exhibition .hotBanner1 .titleBox {
	height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.exhibition .hotBanner1 .titleBox a {
	text-indent: -9999em;
}
/*2-3*/
.exhibition .hotBanner2{
	width: 66.6666%;
	height: 50%;
}

.exhibition a.btn:after {
	display: none;
}



.exhibition a.btn .btnPic {
    position: absolute;
    width: 29%;
    height: 40%;
    bottom: 20px;
    right: 20px;
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    -o-transition: all .20s linear;
    -webkit-transition: all .20s linear;
    -moz-transition: all .20s linear;
    transition: all .20s linear;
}


/*2-4*/
.exhibition .current {
	width: 16.66666666666667%;
	height: 25%;
	background: #333;
}
/*2-5*/
.exhibition .changes{
	width: 16.66666666666667%;
	height: 25%;
	background: #eee;
}

/*2-6*/
.exhibition .ViewRoute{
	width: 16.66666666666667%;
	height: 25%;
	background: #eee;
}
/*2-7*/
.exhibition .calendar{
	width: 16.66666666666667%;
	height: 25%;
	background: #931A12;
}

.hotBanner1,.hotBanner2{
	overflow: hidden;
}


.alltitle a.btn:hover{
	opacity: .7;
	-o-transition: all .20s linear;
	-webkit-transition: all .20s linear;
	-moz-transition: all .20s linear;
	transition: all .20s linear;
}
.alltitle a.btn:hover .btnPic {
	transform: scale(1.2);
    -o-transition: all .20s linear;
    -webkit-transition: all .20s linear;
    -moz-transition: all .20s linear;
    transition: all .20s linear;
}


/*-----------------------------
3 工艺技术
------------------------------*/
/*3-1*/
.visit .title{
}
/*3-2*/
.visit .hotBanner2 {
    width: 66.6666%;
    height: 50%;
}
.visit .hotBanner2 a {
	padding: 1px;
	border: 1px solid #E7E7E7;
}
.visit .hotBanner2 .fotorama__arr--prev, .visit .hotBanner2 .fotorama__arr--next {
	background-color: rgba(238,238,238,.6);
}
.visit .hotBanner2 .fotorama__arr--prev:hover, .visit .hotBanner2 .fotorama__arr--next:hover {
	background-color: rgba(180,159,122,.8);
}
/*3-3*/
.visit .steel {
	width: 16.66666666666667%;
	height: 25%;
}
/*3-4*/
.visit .fiberglass {
	width: 16.66666666666667%;
	height: 25%;
}
/*3-5*/
.visit a.btn.wrought {
	width: 33.3333%;
	height: 50%;
	float: right;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	position: relative;
}

.visit a.btn.wrought .info {
	color: #fff;
}
.visit a.btn.wrought .btnPic {
	display: none;
}
.visit a.btn.wrought:hover {
	opacity: 1;
}

.visit a.btn.wrought.wroughtphone {
	display: none;
}



/*3-6*/
.visit .bronze {
	width: 16.66666666666667%;
	height: 25%;
}

/*3-7*/
.visit .rocker {
	width: 16.66666666666667%;
	height: 25%;
}

.visit a.btn {
	background: #eee;
}

.visit a.btn .btnPic {
    position: absolute;
    /*width: 86%;*/
    width: 70%;
    height: 60%;
    bottom: 20px;
    right: 20px;
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    -o-transition: all .20s linear;
    -webkit-transition: all .20s linear;
    -moz-transition: all .20s linear;
    transition: all .20s linear;
}
.visit a.btn:hover{
	opacity: .7;
	-o-transition: all .20s linear;
	-webkit-transition: all .20s linear;
	-moz-transition: all .20s linear;
	transition: all .20s linear;
}



.hotBanner1 .bannerSilder{
	width: 100%;
	height: 100%;
}
.hotBanner1 .words, .hotBanner2 .words {
	display: none;
}


.mobileAdd{
	display: none;
}






.publicize .publicize-logo {
	display: none;
	position: absolute;
    top: 5.57vh;
    left: 1.57vw;
    width: 230px;
    height: 76px;
    background: rgba(255,255,255,.3)
}
















@media screen and (max-width: 1550px) {
}

@media screen and (max-width: 1366px) {
}
@media screen and (max-width: 1280px) {
	.visit a.btn .btnPic {
	    width: 73%;
    	height: 52%;
	}
}
@media screen  and (max-width: 1024px) {
	.boxWrap h2 {
		font-size: 119%;
	}
}

@media screen and (max-width: 768px) {
	section, .boxWrap{
		border: none !important;
	}


	.publicize .publicize-logo {
		display: none;
	}
	section .boxWrap a.btn {
		width: 25%;
		height: 148px;
		border: none;
		border: 4px solid #FFF;
	}
	.exhibition a.btn .btnPic,
	.visit a.btn .btnPic {
		bottom: 13px;
		right: 11px;
	}
	/*上*/
	.exhibition .current,.exhibition .exhibitionNewsletter,.exhibition a.calendar, a.ViewRoute,.exhibition .changes{
		border-top:8px solid #FFF !important;
	}
	/*右*/
	.exhibition a.calendar,
	.visit .food,.visit .visitor,.visit .Accessibility,
	.video .googleArt,
	.boxWrap .btn.child,
	.boxWrap .btn.library,
	.focusNews .link{
		border-right:8px solid #FFF !important;
	}
	/*左*/
	.exhibition .current {
		border-left:8px solid #FFF !important;
	}
	.fotorama__caption__wrap {
	  font-size: 100%;
	}

	/*------------*/
	section,.boxWrap{
		overflow: hidden;
	}
	section.publicize{
		height: 50%;
	}
	.pagination,section .boxWrap>*,footer{
		display: none;
	}
	.sbranch,.gpmep,.shop,.dbms,.jobInfo,.edm,.btn.newsZone,.gender,.lobby,.government,.opendata,.cultural,.creation,.volunteer{
		display: block !important;
		width: 25% !important;
		height: 148px !important;
	}
	section.publicize::after,section.publicize::before{
		display: none;
	}
	/*---第2 作品赏析---*/
	 a.current,.exhibition a.calendar, a.ViewRoute , a.changes ,.exhibition .hotBanner2{
	 		display: block;
	}
	a.current{border-left:8px solid #FFF;border-top:8px solid #FFF;}
	a.exhibitionNewsletter{border-right:8px solid #FFF;border-top:8px solid #FFF;}
	.exhibition a.calendar{border-left:8px solid #FFF;border-bottom:none;}
	a.changes{border-right:8px solid #FFF;border-bottom:none;}
	.exhibition .hotBanner2 {
		width: 100%;
		height: initial;
		padding: 3% 5% 5% 5%;
		margin-top: 5%;
		border: none;
	    background-color: #eee;
	}
	.exhibition .boxWrap{
		border: none;
	}
	.exhibition .hotBanner2 .words {
		display: block;
		padding: 0;
		padding-bottom: 9px;
		font-size: 24px;
		color: #b49f7a;
	}
	.alltitle .titleBox .top {
		display: none;
		font-size: 18px;
	}
	.alltitle .titleBox .des {
		display: none;
		font-size: 14px;
	}
	.boxWrap .info {
		font-size: 18px;
	}
	/*---第3 工艺技术---*/
	.visit .hotBanner2 {
		display: block;
		width: 100%;
		height: initial;
		padding: 3% 5% 5% 5%;
		border: none;
		border-top: 4px solid #FFF;
    	border-bottom: 4px solid #FFF;
		background: #eee;
	}
	.visit .hotBanner2 .words {
		display: block;
		padding: 0;
		padding-bottom: 9px;
		font-size: 24px;
		color: #b49f7a;
	}
	.visit a.btn {
		display: block;
	}
	.visit a.btn.wrought {
		display: none;
	}

	.fotorama__caption__wrap {
	  font-size: 70%;
	}

	.fotorama__dot {
		background: #b49f7a;
	}

	.Footer2 {
	    border-top: 4px solid #FFF;
	}
}
@media screen and (max-width: 480px) {

	section .boxWrap a.btn {
		width: 50%;
	}
	.exhibition a.btn .btnPic, .visit a.btn .btnPic {
		bottom: 10px;
		right: 13px;
		width: 25%;
		height: 39%;
	}
	.visit a.btn .btnPic {
	    width: 40%;
    	height: 46%;
	}
	section .boxWrap a.btn{
		height: 107px;
	}
	.visit .hotBanner2 a {
		border: none;
	}
	.exhibition .changes,
	section.visit .boxWrap .reserve,
	section.visit .boxWrap .fiberglass,
	section.visit .boxWrap .rocker {
		border-right: 8px solid #FFF !important;
	}
	section.exhibition .boxWrap a.ViewRoute,
	section.visit .boxWrap .steel,
	section.visit .boxWrap .bronze {
		border-left: 8px solid #FFF;
	}

	section.exhibition .boxWrap .current{
		border-bottom: 0px solid #FFF;
	}
	.exhibition .changes{
		border-bottom:0px solid #FFF !important ;
	}

	.alltitle .titleBox .des {
		margin-top: 0;
	}
	.visit a.btn.wrought {
		display: block;
		width: 100%;
		height: 107px;
		border-left: 8px solid #FFF;
		border-right: 8px solid #FFF;
	}
	.visit a.btn.wrought.wroughtphone {
		display: block;
	}
	.visit a.btn.wrought.wroughtpc {
		display: none;
	}
	.visit a.btn.wrought .info {
    	padding-left: 5%;
	}
}


.PCNav .PCNavClose {
	display: none;
}

@media (min-width: 769px) {
	
	.Main {
		padding-left: 320px;
	}

}