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

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

#content { position: relative; }

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

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

/* side-nav */
#side-nav { position: relative; background: #e2e2e2; z-index: 5; }
#side-nav .outside-set { margin: 0 auto; padding: 13px 0; width: 95%; text-align: center; }
#side-nav .side-title { padding: 10px 15px 10px 0; display: inline-block; vertical-align: top; border-right: 1px solid #cacaca; }
#side-nav .Cate { overflow: visible; margin-left: 15px; display: inline-block; vertical-align: top; }
#side-nav .side-title h2 { font-size: 14px; }
#side-nav .side-title h2 b { font-size: 14px; color: #e8a930; }

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

/* main-article */
.main-article .pagetitle { margin-bottom: 50px; font-weight: 400; line-height: 100%; color: #136a86; }
.main-article #describe { font-size: 15px; color: #535353; }
#ssbanner-list .bxslider { overflow: hidden; }
#contact-nav >h3 , #ssbanner-list >h3 , #category-nav >h3 { margin-bottom: 20px; font-size: 16px; line-height: 110%; color: #fff; }
#contact-nav h3 strong , #category-nav h3 strong { font-size: 24px; color: #fff; }
#side-nav .Cate >li h3 , #side-nav .Cate >li .subUL li .subULHead , #contact-nav ul li , #category-nav .Cate >li h3 , #category-nav .Cate >li .subUL li .subULHead { overflow: hidden; position: relative; border-bottom: 1px solid #5393a7; }
#contact-nav ul#extra li { padding: 15px 0; color: #fff; }
#side-nav .Cate >li h3 , #side-nav .Cate >li .subUL li .subULHead p , #category-nav .Cate >li h3 , #category-nav .Cate >li .subUL li .subULHead p { width: calc(100% - 25px); }
#side-nav .Cate >li >h3 , #category-nav .Cate >li >h3 { width: 100%; }
#side-nav .Cate >li h3 span , #category-nav .Cate >li h3 span { margin-right: 8px; vertical-align: bottom; font-weight: 700; font-size: 20px; color: #9fbcb7; }
#side-nav .Cate >li h3 b , #side-nav .Cate >li .subUL li .subULHead b , #category-nav .Cate >li h3 b , #category-nav .Cate >li .subUL li .subULHead b { position: absolute; width: 50px; height: 53px; display: block; text-align: center; line-height: 53px; font-weight: 700; font-size: 20px; color: #9fbcb7; right: 0; top: 0; cursor: pointer; }
#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 , #category-nav .Cate >li h3 a , #category-nav .Cate >li .subUL li .subULHead p a , #category-nav .Cate >li .subUL li .sub2UL li .sub2ULHead p a { padding: 15px 0; }
#side-nav .Cate li a , #contact-nav ul li a , #category-nav .Cate li a { display: block; font-size: 15px; color: #fff; transition: all linear .2s; }
#contact-nav ul#extra li a { padding: 0; display: inline-block; }
#side-nav .Cate li.action a , #category-nav .Cate li.action a { color: #d0d0d0; }
#side-nav .Cate li ul , #category-nav .Cate li ul { overflow: hidden; display: none; }
#category-nav .Cate li { position: relative; }
#contact-nav ul li a i { margin-right: 10px; width: 25px; height: 25px; background: #fff; border-radius: 50%; text-align: center; line-height: 25px; color: #3b849a; }
#category-nav .Cate li.action >ul { display: block; }
#side-nav .Cate >li .subUL li .subULHead p a , #category-nav .Cate >li .subUL li .subULHead p a { padding-left: 20px; color: #eaeaea; }
#side-nav .Cate >li .subUL li.action .subULHead p a , #category-nav .Cate >li .subUL li.action .subULHead p a { color: #95c6d6; }
#side-nav .Cate >li .subUL li .subULHead b , #category-nav .Cate >li .subUL li .subULHead b { color: #d3d3d3; }
#side-nav .Cate >li .subUL li .sub2UL li .sub2ULHead p a , #category-nav .Cate >li .subUL li .sub2UL li .sub2ULHead p a { padding-left: 35px; border-bottom: 1px solid #5393a7; color: #dedede; }
#side-nav .Cate >li .subUL li .sub2UL li.action .sub2ULHead p a , #category-nav .Cate >li .subUL li .sub2UL li.action .sub2ULHead p a { background: #ededed; color: #3b849a; }
#ssbanner-list .bxslider div a { width: 100%; height: 100%; background: #f6fcfd no-repeat 50% / contain; display: block; transition: all ease-in-out .3s; }
#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 { margin-top: 50px; text-align: center; }
#side-nav #contact-nav ul li a { text-align: left; }
#side-nav #contact-nav ul li a i { margin-right: 5px; }

/* community */
#community { margin: 50px 0; }
#community li { margin: 0 5px 5px 0; float: left; line-height: 0; }

/* g-map */
#g-map iframe { width: 100%; height: 400px; }

aside .webframe { margin: 0 auto; padding: 80px 10%; width: 80%; background: #3b849a; overflow: hidden; }

/* catalogStyle */
#catalogStyle { background: #3b849a; }
#catalogStyle h1 { padding: 100px 20px; text-align: center; line-height: 120%; color: #fff; }

/* pagenav */
#pagenav { margin: 15px 0; }

.comprehensiveW.content-wrraper .inside { margin: 0 auto; width: 100%; }

@media screen and (max-width:1366px) {
	.inside { width: 90%; }
}
@media screen and (min-width:1025px) {
	#side-nav .Cate li a:hover , #contact-nav ul li a:hover , #category-nav .Cate li a:hover { color: #d0d0d0; }
	#side-nav .Cate >li { position: relative; padding: 8px 8px 8px 0; display: inline-block; vertical-align: top; }
	#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 { padding: 2px 8px; border: 1px solid #cacaca; border-radius: 8px; font-size: 14px; color: #848484; }
	#side-nav .Cate >li .subUL li .subULHead p a { background: #fff; }
	#side-nav .Cate li >ul { overflow: visible; position: absolute; width: 150px; top: 100%; left: 0; }
	#side-nav .Cate >li >h3 { overflow: visible; border: 0; font-weight: 400; }
	#side-nav .Cate >li h3 >a:hover , #side-nav .Cate >li.action h3 a { background: #1e7b98; color: #fff; }
	#side-nav .Cate >li:hover >ul { display: block; }
	#side-nav .Cate >li .subUL li .subULHead p { width: 100%; }
	#side-nav .Cate li >ul >li { position: relative; margin-bottom: 4px; }
	#side-nav .Cate >li h3 b , #side-nav .Cate >li .subUL li .subULHead b { display: none; }
	#side-nav .Cate >li .subUL li .subULHead { border: none; }
	#side-nav .Cate >li .subUL li .subULHead p a:hover , #side-nav .Cate >li .subUL li.action .subULHead p a , #side-nav .Cate >li .subUL li .sub2UL li .sub2ULHead p a:hover { color: #2e5e6d; }
	#side-nav .Cate li .sub2UL { padding-left: 5px; top: 0; left: 100%; }
	#side-nav .Cate li ul li:hover .sub2UL { display: block; }
	#side-nav .Cate li .sub2UL li a { background: #fff; }
	aside #contact-nav { float: left; width: 47%; }
	aside #category-nav { float: right; width: 47%; }
	aside { position: relative; }
	.chooseBox { position: absolute; left: -300px; top: 100px; z-index: 5; transition: all linear .3s; }
	.chooseBox:hover { left: 0; }
	.chooseBox p { margin-right: -50px; padding: 7px 10px; float: right; width: 30px; height: 50px; background: #1d3773; border-radius: 0 15px; text-align: center; color: #fff; font-size: 30px; line-height: 50px; }
	.chooseBox .hideBox { float: left; width: 300px; }
	#youtube { top: 30px; }
	#youtube.chooseBox p { background: #e02425; }
	#youtube iframe { width: 300px; }
}
@media screen and (max-width:1024px) {
	#sub-banner { margin-top: 56px; }
	.inside { margin: 50px auto; }
	.main-article { width: 100%; }
	#content { background: rgba(255, 255, 255, .7); }
	.content-wrraper { display: flex; flex-wrap: wrap; }
	.content-wrraper >div { width: 100%; order: 1; }
	.content-wrraper .inside { width: 90%; }
	.content-wrraper #side-nav { background: #3b849a; order: 2; }
	.content-wrraper aside { width: 100%; order: 3; }
	aside .webframe { padding: 30px 10%; }
	#contact-nav , #category-nav { margin: 50px 0; }
	#side-nav .outside-set { padding: 70px 0 0; width: 80%; }
	#side-nav .side-title { display: block; border: 0; }
	#side-nav .side-title h2 { margin-bottom: 0; font-size: 16px; line-height: 110%; color: #fff; }
	#side-nav .side-title h2 b { border: none; font-size: 24px; color: #fff; }
	#side-nav .Cate { margin: 0; display: block; }
	#side-nav .Cate li.action ul { display: block; }
	#fb-wrap { text-align: center; }
	#youtube { margin: 70px 0 0; text-align: center; }
	.chooseBox p { display: none; }
	.chooseBox .hideBox { width: 300px; display: inline-block; }
	#youtube.chooseBox .hideBox { overflow: hidden; position: relative; padding: 30px 0 56.25%; width: 100%; height: 0; display: block; }
	#youtube iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
	#catalogStyle h1 { padding: 70px 20px; }
}
@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; }
	#catalogStyle h1 { padding: 50px 20px; }
}
@media screen and (max-width:480px) {
	.main-article .pagetitle { margin-bottom: 20px; }
}