@import url('/css/community.css');

.wow { animation-duration: 2s; animation-name: fadeInUp; }

#content { position: relative; background-image: url(/images/21/news-bg-left-bottom.png), url(/images/21/news-bg-right-top.png); background-position: -5% 100%, 100% 0; background-size: auto; background-repeat: no-repeat; overflow: hidden; }

.content-wrraper { position: relative; }

#sub-banner img { width: 100%; }

.inside { width: 1360px; overflow: hidden; margin: 100px auto; }

.main-article { float: right; width: calc(100% - 370px); }

#side-nav { float: left; width: 290px; }
.waylink ol { margin: 10px auto; padding: 0; width: 90%; text-align: right; }
.waylink ol li { display: inline-block; color: #000; vertical-align: top; font-size: 12px; position: relative; padding-left: 13px; }
.waylink ol li:after { content: '>'; position: absolute; color: #d3d3d3; top: 0; left: 0; }
.waylink ol li:first-child { padding-left: 0; }
.waylink ol li:first-child:after { display: none; }
.waylink ol li a { color: #a3a3a3; font-weight: 400; font-size: 12px; }
.waylink ol li:last-child a { color: #989898; }

.main-article .pagetitle { line-height: 100%; color: #4f4f4f; margin-bottom: 50px; font-weight: 400; border-bottom: 1px solid #b5b5b5; padding-bottom: 15px; }
.main-article .pagetitle img { margin-right: 10px; vertical-align: bottom; }
.main-article #describe { color: #535353; font-size: 15px; }

#ssbanner-list .bxslider { overflow: hidden; }
#side-nav .side-title h2, #contact-nav h3, #ssbanner-list h3, #category-nav>h3, #contact-extra>h3 { font-size: 20px; line-height: 110%; color: #eac996; margin-bottom: 20px; }

#side-nav .sideSpan { display: inline-block; width: 30px; height: 2px; background: #bf659d; margin-right: 15px; }
#side-nav .side-title h2 b { font-weight: 400; margin-left: 10px; color: #96979f; }
#side-nav .Cate>li h3, #side-nav .Cate>li .subUL li .subULHead, #contact-nav ul li, #contact-extra ul li { overflow: hidden; position: relative; border-bottom: 1px solid #efefef; }
#contact-extra ul li { padding: 15px 0; }
#side-nav .Cate>li h3, #side-nav .Cate>li .subUL li .subULHead p { width: calc(100% - 25px); }
#side-nav .Cate>li>h3 { width: 100%; }
#side-nav .Cate>li h3 span { color: #353535; margin-right: 8px; vertical-align: bottom; font-weight: 700; font-size: 12px; }
#side-nav .Cate>li h3 b, #side-nav .Cate>li .subUL li .subULHead b { color: #565656; font-weight: 700; font-size: 20px; position: absolute; right: 0; top: 0; cursor: pointer; display: block; width: 50px; height: 53px; text-align: center; line-height: 53px; }
#side-nav .Cate>li h3 a, #side-nav .Cate>li .subUL li .subULHead p a, #side-nav .Cate>li .subUL li .sub2UL li .sub2ULHead p a, #contact-nav ul li a, #contact-extra ul li a { padding: 15px 0; }
#side-nav .Cate li a, #contact-nav ul li a, #contact-extra ul li a { font-size: 15px; display: block; color: #6e6e6e; transition: all linear .2s; }
#contact-extra ul li a { padding: 0; display: inline-block; }
#side-nav .Cate li a:hover, #side-nav .Cate li.action a, #contact-nav ul li a:hover, #contact-extra ul li a:hover { color: #c35697; }
#side-nav .Cate li ul { overflow: hidden; display: none; }
#side-nav .Cate li.action>ul { display: block; }
#side-nav .Cate>li .subUL li .subULHead p a { padding-left: 20px; color: #6e6e6e; }
#side-nav .Cate>li .subUL li.action .subULHead p a { color: #a77bb2; }
#side-nav .Cate>li .subUL li .subULHead b { color: #d3d3d3; }
#side-nav .Cate>li .subUL li .sub2UL li .sub2ULHead p a { padding-left: 35px; border-bottom: 1px solid #efefef; color: #6e6e6e; }
#side-nav .Cate>li .subUL li .sub2UL li.action .sub2ULHead p a { background: #ededed; }
#ssbanner-list .bxslider div a { background-repeat: no-repeat; background-position: 50% 50%; background-size: contain; background-color: #f6fcfd; display: block; transition: all ease-in-out .3s; width: 100%; height: 100%; }
#ssbanner-list .bxslider div a img { width: 100%; }
#ssbanner-list, #side-nav #fb-wrap, #side-nav #g-map, #side-nav #youtube, #side-nav #contact-nav, #category-nav, #contact-extra { margin-top: 50px; text-align: center; }
#side-nav #contact-nav ul li a, #side-nav #contact-extra ul li { text-align: left; }
#side-nav #contact-nav ul li a i { margin-right: 5px; }

@media screen and (min-width: 1025px) {
	#ssbanner-list .bxslider>div:nth-child(2n) a { background-color: #f7f4f8; }
	#album li:nth-child(2n), #prolay .pro-list>div:nth-child(3n-1) .p-box, #newslist li:nth-child(2n) { animation-duration: .5s; }
	#side-nav .outside-set { position: relative; overflow: hidden; }
	#side-nav .outside-set .side-title { position: relative; }
	#side-nav .outside-set .side-title h2 { position: relative; font-size: 30px; font-weight: 400; color: #333; }
	#side-nav .outside-set .side-title h2 b { display: block; float: left; margin-left: 0; transform: rotate(90deg) translateX(-65%); transform-origin: left bottom; width: 40px; color: #eac996; font-weight: 400; font-size: 40px; font-family: 'Lusitana', serif; }
	#side-nav .outside-set .Cate { margin-left: 50px; }
	#content:after { position: absolute; width: 1000px; height: 1000px; border-radius: 50%; left: -500px; top: -750px; content: ''; background: #c35697; z-index: -1; }
}
@media screen and (max-width: 1366px) {
	.inside { width: 90%; margin: 70px auto; }
	#content:after { left: -550px; top: -850px; }
}
@media screen and (max-width: 1024px) {
	#sub-banner { margin-top: 77px; }
	.main-article { width: 100%; }
	#side-nav { width: 100%; margin-top: 80px; }
	#ssbanner-list .bxslider div { width: 50%; float: left; }
	#ssbanner-list .bxslider>div:nth-child(2) a, #ssbanner-list .bxslider>div:nth-child(3) a { background-color: #f0f0f0; }
	#content { background: rgba(255, 255, 255, 0.7); z-index: 1; }
}
@media screen and (max-width: 640px) {
	.inside { margin: 20px auto; }
	.waylink ol li, .waylink ol li a, .waylink ol li .h3, .waylink ol li:after { font-size: 6pt; }
}
@media screen and (max-width: 480px) {
	.main-article .pagetitle { margin-bottom: 20px; }
	#sub-banner { margin-top: 67px; }
}