/* CSS Document */
.serviceTopBox{ min-height: 515px; background: url(../images/service/bg.png) no-repeat center bottom;}

.serviceContainerOuter{ padding-top: 60px;}
.serviceContainer{ min-height: 380px;}
.serviceContainer li{ float: left; width: 25%; background: #fff; min-height: 330px; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1), z-index 0s 0.12s;}
.serviceContainer li.active{ width: 50%; min-height: 360px; margin-top: -15px; box-shadow: 0px 0px 7px 3px #57d2e4;}
.serviceContainer li a:hover{ color: #03c0dd;}
.service-title{ text-align: center; height: 100px; background: #ededee; display: flex; justify-content: center;}
.service-title span{ display: block; width: 47px; height: 47px; border-radius: 99px; margin-top: 26px;}
.service-title div{ display: block; margin-top: 23px; margin-left: 15px; text-align: left;}
.service-title div .name{ font-size: 21px; color: #656565; font-weight: bold;}
.service-title div .value{ font-size: 14px; color: #999;}
.active .service-title{ background: url(../images/service/bg1.png) center center; height: 110px;}
.active .service-title span{ margin-top: 32px;}
.active .service-title div{ margin-top: 30px;}
.active .service-title div .name{ color: #fff;}
.active .service-title div .value{ color: #fff;}
.headlineSwipter{ margin-left: 120px; overflow: hidden;}
.toutiao-swiper-container .swiper-slide{ color: #23a0e2; white-space: nowrap; width: 540px;}
.toutiao-swiper-container .swiper-slide a{ font-size: 14px; color: #0069c5; white-space: nowrap;}

/* 法人办事 */
.top-corporate-affairs{ border-right: 1px solid #e5e5e5; overflow: hidden;}
.active .top-corporate-affairs{ border: 1px solid #57d2e4; min-height: 360px;}
.top-corporate-affairs .service-title span{ background: url(../images/service/corporate-affairs.png) no-repeat center center;}
.top-corporate-affairs .c-s-navBox{ overflow: auto; zoom: 1;}
.active .top-corporate-affairs .c-s-navBox{ width: 598px;}
.top-corporate-affairs .nav1{ float: left; width: 100%;}
.active .top-corporate-affairs .nav1{ width: 40%;}
.top-corporate-affairs .nav1 .nav1-inner{ margin: 0px 20px; overflow: auto; zoom: 1;}
.top-corporate-affairs .nav1 a{ display: block; float: left; width: 50%; height: 76px; line-height: 76px; font-size: 16px; color: #333; text-align: center; border-top: 1px solid #e5e5e5;}
.top-corporate-affairs .nav1 a.f{ border-top: none;}
.active .top-corporate-affairs .service-title span{ background: url(../images/service/corporate-affairs-hover.png) no-repeat center center;}
.top-corporate-affairs .nav2{ display: none; float: left; width: 0%;}
.active .top-corporate-affairs .nav2{ width: 60%; display: block;}
.top-corporate-affairs .nav2 .nav2-inner{ overflow: auto; zoom: 1; margin-top: 15px;}
.top-corporate-affairs .nav2 a{ display:block; float: left; width: 98px; height: 98px; text-align: center; background: #f3f4f5; font-size: 16px; color: #333; font-size: 16px; color: #333; margin: 5px;}
.top-corporate-affairs .nav2 a img{ display: block; margin: 15px auto 5px;}

/* 个人办事 */
.top-personal-affairs{ overflow: hidden;}
.active .top-personal-affairs{ border: 1px solid #57d2e4; min-height: 360px;}
.top-personal-affairs .service-title span{ background: url(../images/service/personal-affairs.png) no-repeat center center;}
.top-personal-affairs .c-s-navBox{ overflow: auto; zoom: 1;}
.active .top-personal-affairs .c-s-navBox{ width: 598px;}
.top-personal-affairs .nav1{ float: left; width: 100%;}
.active .top-personal-affairs .nav1{ width: 36%;}
.top-personal-affairs .nav1 .nav1-inner{ margin: 0px 20px; overflow: auto; zoom: 1;}
.top-personal-affairs .nav1 a{ display: block; float: left; width: 50%; font-size: 16px; color: #333; text-align: center; margin-top: 15px;}
.active .top-personal-affairs .nav1 a{ margin-top: 20px;}
.top-personal-affairs .nav1 a img{ display: block; margin: 0px auto 5px;}
.active .top-personal-affairs .service-title span{ background: url(../images/service/personal-affairs-hover.png) no-repeat center center;}
.top-personal-affairs .nav2{ display: none; float: left; width: 0%;}
.active .top-personal-affairs .nav2{ width: 64%; display: block;}
.top-personal-affairs .nav2 .nav2-inner{ overflow: auto; zoom: 1; margin-top: 12px;}
.top-personal-affairs .nav2 a{ display:block; float: left; width: 170px; height: 95px; line-height: 95px; text-align: center; background: #f3f4f5; font-size: 16px; color: #333; font-size: 16px; color: #333; margin: 8px; border-radius: 5px;}
.top-personal-affairs .nav2 a img{ margin-left: 40px;}

/* 常用服务 */
.top-common-services{ border-left: 1px solid #e5e5e5; overflow: hidden;}
.active .top-common-services{ border: 1px solid #57d2e4; min-height: 360px;}
.top-common-services .service-title span{ background: url(../images/service/common-services.png) no-repeat center center;}
.top-common-services .c-s-navBox{ overflow: auto; zoom: 1;}
.active .top-common-services .c-s-navBox{ width: 598px;}
.top-common-services .nav1{ float: left; width: 100%;}
.active .top-common-services .nav1{ width: 40%;}
.top-common-services .nav1 .nav1-inner{ margin: 0px 20px; overflow: auto; zoom: 1;}
.top-common-services .nav1 a{ display: block; float: left; width: 50%; height: 76px; line-height: 76px; font-size: 16px; color: #333; text-align: center; border-top: 1px solid #e5e5e5;}
.top-common-services .nav1 a.f{ border-top: none;}
.active .top-common-services .service-title span{ background: url(../images/service/common-services-hover.png) no-repeat center center;}
.top-common-services .nav2{ display: none; float: left; width: 0%;}
.active .top-common-services .nav2{ width: 60%; display: block;}
.top-common-services .nav2 .nav2-inner{ overflow: auto; zoom: 1; margin-top: 20px;}
.top-common-services .nav2 a{ display:block; float: left; width: 170px; height: 45px; line-height: 45px; text-align: center; background: #f3f4f5; font-size: 16px; color: #333; font-size: 16px; color: #333; margin: 2px;}
.top-common-services .nav2 a:hover{ background: #03c0dd; color: #fff;}


.searchBox{ padding-top: 2px;}
.searchBox .inner{ width: 914px; height: 53px; background: #fff; border-radius: 5px; margin: 0px auto;}
.searchBox select{ width: 100px; height: 53px; line-height: 53px; border: 0px solid red; appearance:none; -moz-appearance:none; -webkit-appearance:none; background: url(../images/service/selectBg.png) no-repeat right center; margin-left: 25px; font-size: 14px; color: #0069c5;}
.searchBox input{ height: 53px; line-height: 53px; border: none; font-size: 14px; color: #999; margin-left: 20px;  width: 50%;}
.searchBox button{ height: 53px; width: 53px; background: url(../images/service/magnifier.png) no-repeat left 10px center; float: right; border: none; cursor: pointer;}

.headlineBox{ line-height: 70px; margin: 3px auto 0px; width: 1200px; overflow: hidden;}
.headlineBox img{ position: absolute; margin-top: 20px;}
.headlineBox ul{ overflow: auto; zoom: 1; margin-left: 120px;}
.headlineBox ul li{ float: left; width: 50%; color: #23a0e2;}
.headlineBox ul li a{ font-size: 14px; color: #0069c5; margin-left: 10px;}

.serviceBox1{ margin-bottom: 15px; overflow: auto; zoom: 1;}
.serviceBox1 .left{ float: left; width: 750px; min-height: 509px;}
.serviceBox1 .right{ float: right; width: 437px; min-height: 509px;}
.servieSwitchTitle{ margin: 0px 20px; border-bottom: 1px solid #eaeaea; overflow: auto; zoom: 1;}
.servieSwitchTitle li{ float: left;}
.servieSwitchTitle li a{ display: block; padding: 0px 20px; height: 55px; line-height: 55px; border-bottom: 2px solid #fff; font-size: 16px; color: #006ac0;}
.servieSwitchTitle li.hover a{ border-bottom: 2px solid #0969c3; font-weight: bold;}
.serviceNewsList{ margin: 10px 20px 0px;}
.serviceNewsList li{}
.serviceNewsList li a{ font-size: 16px; color: #333; line-height: 40px;}
.serviceNewsList li a span{ float: right; color: #999;}
.swiper-container{ width: 720px; height: 360px; margin: 15px auto 0px;}
.pagination { width: 180px; height: 40px; text-align: right; line-height: 40px; margin-top: -40px; position: relative; z-index: 101; float: right; margin-right: 30px;}
.swiper-pagination-switch { display: inline-block; width: 10px; height: 10px; border-radius: 10px; background: #a8a8a9; margin: 0 3px; cursor: pointer;}
.swiper-active-switch { background: #fff;}
.swiper-container .swiper-slide img{ width: 720px; height: 479px;}
.swiper-container .swiper-slide span{ display: block; height: 40px; line-height: 40px; margin-top: -40px; position: relative; z-index: 100; font-size: 18px; color: #fff; padding: 0px 20px; background: url(../images/opacity-bg-black.png);}
.OpenGovernAffairs{ overflow: auto; zoom: 1;}
.OpenGovernAffairs .nav{ float: left; display: flex; flex-wrap: wrap; justify-content: space-between; width: 290px; margin:15px 0px 0px 20px;}
.OpenGovernAffairs .nav li{ width: 280px; margin-bottom: 10px;}
.OpenGovernAffairs .nav li a{ display: block; min-height: 62px; font-size: 14px; color: #666; background: #eee; border: 1px solid #eee; text-align: left;line-height:62px;}
.OpenGovernAffairs .nav li img{display: block; margin: 13px 13px 10px 50px;float: left;}
.OpenGovernAffairs .latestNews{ float: right; width: 440px;}

.serviceBox2{ overflow: auto; zoom: 1; margin-bottom: 15px;}
.serviceBox2 .left{ float: left; width: 750px; min-height: 463px;}
.commBigTitle{ margin: 0px 20px; height: 64px; line-height: 64px; border-bottom: 1px solid #eaeaea;}
.commBigTitle img{ margin-top: -4px;}
.commBigTitle a{ display: inline-block; line-height: 64px; margin-left: 17px; font-size: 20px; color: #006ac0; font-weight: bold;}
.serviceBox2 .right{ float: right; width: 437px; min-height: 463px;}
.interviewLeader{ margin: 0px 20px; padding: 15px 0px 0px; min-height: 110px;}
.interviewLeader img{ position: absolute;}
.interviewLeader div{ margin-left: 140px;}
.interviewLeader div a{ font-size: 16px; color: #0969c3; display: block; line-height: 31px;}
.interviewLeader div p{ font-size: 14px; color: #999; line-height: 30px;}
.openNewsList{ margin: 0px 20px; padding: 6px 0px 10px;}
.openNewsList li{}
.openNewsList li a{ display: block; font-size: 14px; color: #333; line-height: 30px;}
.openNewsList li a span{ float: right; font-size: 14px; color: #999;}
.mengyinOnlinePlatform{ margin: 12px 20px 0px;}
.mengyinOnlinePlatform a{ display: block;}
.mengyinOnlinePlatform a img{ width: 100%;}
.interCommunication{ margin: 11px 20px 0px; display: flex; flex-wrap: nowrap; justify-content: space-between;}
.interCommunication li{ width: 190px;}
.interCommunication li a{ display: block; height: 60px; line-height: 60px; text-align: center; background: #e9f1f6; font-size: 16px; color: #006ac0;}
.interCommunication li a img{ margin-right: 13px;}

.serviceBox3{ min-height: 245px;}
.thematicColumn{ width: 1160px; margin: 0px auto;}
.thematicColumn .arrow-left{ position: relative; width: 22px; height: 51px; background: url(../images/arrows-rectangle.png) no-repeat left top; float: left; margin-top: -90px;}
.thematicColumn .arrow-right{ position: relative; width: 22px; height: 51px; background: url(../images/arrows-rectangle.png) no-repeat left bottom; float: right; margin-top: -90px;}
.thematic-swiper-container{ width: 1100px; height: 133px; margin: 20px auto 0px; overflow: hidden;}
.thematic-swiper-container .swiper-slide a{ display: block; width: 200px; margin: 0px auto;}
.thematic-swiper-container .swiper-slide a img{ width: 200px; height: 133px;}


@media screen and (max-width: 800px) {
	.serviceTopBox{ background: #5b9ee1;}
	.serviceContainerOuter{ margin: 0px 20px;}
	.serviceContainer li{ float: none; width: 100%; margin: 0px auto;}
	.serviceContainer li.active{ width: 100%;}
	.active .top-corporate-affairs .nav1{ float: none; width: 100%;}
	.active .top-corporate-affairs .nav2{ float: none; width: 100%;}
	.active .top-corporate-affairs .c-s-navBox{ width: 100%; padding-bottom: 15px;}
	.top-corporate-affairs .nav2 a{ height: 80px; line-height: 80px; float: none; width: 90%; margin: 5px auto;}
	.top-corporate-affairs .nav2 a img{ display: inline-block; margin-right: 15px;}
	
	.active .top-personal-affairs .nav1{ float: none; width: 100%;}
	.active .top-personal-affairs .nav2{ float: none; width: 100%;}
	.active .top-personal-affairs .c-s-navBox{ width: 100%; padding-bottom: 15px;}
	.top-personal-affairs .nav2 a{ height: 80px; line-height: 80px; float: none; width: 90%; margin: 8px auto;}
	.top-personal-affairs .nav2 a img{}
	
	.active .top-common-services .nav1{ float: none; width: 100%;}
	.active .top-common-services .nav2{ float: none; width: 100%;}
	.active .top-common-services .c-s-navBox{ width: 100%; padding-bottom: 15px;}
	.top-common-services .nav2 a{ float: none; width: 90%; margin: 2px auto;}
	
	
	.searchBox{ margin: 20px 20px 0px; width: auto; padding-bottom: 20px;}
	.searchBox .inner{ width: 100%;}
	.searchBox select{ margin-left: 10px; width: 90px;}
	.searchBox input{ width: 30%;}
	
	.serviceBox1{}
	.serviceBox1 .left{ float: none; width: 100%; min-height: auto; border-top: 1px solid #fff; padding-bottom: 15px;}
	.swiper-container{ width: auto; margin: 10px; height: auto;}
	.swiper-container .swiper-slide img{ width: 100%; height: auto;}
	.serviceBox1 .right{ float: none; width: 100%;}
	
	.serviceBox2 .left{ width: 100%; float: none;}
	.serviceBox2 .right{ width: 100%; float: none;}
	.OpenGovernAffairs .nav{ width: auto; float: none; margin: 15px 15px 0px;}
	.OpenGovernAffairs .nav li{ width: 50%;}
	.OpenGovernAffairs .nav li a{ margin: 0px 5px;}
	.OpenGovernAffairs .latestNews{ width: 100%; float: none;}
	.interCommunication{ margin: 11px 15px 0px;}
	.interCommunication li{ width: 50%;}
	.interCommunication li a{ margin: 0px 5px;}
	
	.serviceNewsList li a{ margin-right: 80px; white-space: nowrap; text-overflow: ellipsis; display: block; overflow: hidden;}
	.serviceNewsList li a span{ position: absolute; right: 20px;}
	.openNewsList li a{ margin-right: 80px; white-space: nowrap; text-overflow: ellipsis; display: block; overflow: hidden;}
	.openNewsList li a span{ position: absolute; right: 20px;}
	
	.serviceBox3{ overflow: hidden;}
	.thematic-swiper-container{ width: 100%; overflow: hidden;}
	.thematicColumn .arrow-left{ position: absolute; left: 0px;}
	.thematicColumn .arrow-right{ position: absolute; right: 0px;}
	.headlineBox img{ margin-left: 20px;}
	
}

@media screen and (min-width: 801px) and (max-width: 1199px) {
	.serviceTopBox{ background: #5b9ee1;}
	.serviceContainer li{ float: none; width: 600px; margin: 0px auto;}
	.serviceContainer li.active{ width: 600px;}
	
	.searchBox{ margin: 20px 20px 0px; width: auto; padding-bottom: 20px;}
	.searchBox .inner{ width: 600px;}
	.searchBox select{ margin-left: 10px; width: 90px;}
	.searchBox input{ width: 30%;}
	
	.serviceBox1{}
	.serviceBox1 .left{ float: none; width: 100%; min-height: auto; border-top: 1px solid #fff; padding-bottom: 15px;}
	.swiper-container{ width: auto; margin: 10px; height: auto;}
	.swiper-container .swiper-slide img{ width: 100%; height: auto;}
	.serviceBox1 .right{ float: none; width: 100%;}
	
	.serviceBox2 .left{ width: 100%; float: none;}
	.serviceBox2 .right{ width: 100%; float: none;}
	.OpenGovernAffairs .nav{ width: auto; float: none; margin: 15px 15px 0px;}
	.OpenGovernAffairs .nav li{ width: 25%;}
	.OpenGovernAffairs .nav li a{ margin: 0px 5px;}
	.OpenGovernAffairs .latestNews{ width: 100%; float: none;}
	
	.interCommunication{ margin: 11px 15px 0px;}
	.interCommunication li{ width: 50%;}
	.interCommunication li a{ margin: 0px 5px;}
	
	.serviceBox3{ overflow: hidden;}
	.thematic-swiper-container{ width: 100%; overflow: hidden;}
	.thematicColumn .arrow-left{ position: absolute; left: 0px;}
	.thematicColumn .arrow-right{ position: absolute; right: 0px;}
}

.gg-left-btm{position: fixed!important;left:0!important;bottom: 266px!important;height:160px!important;}