.MainName { font-size: 36px; font-weight: bold; color: #BD1A2D; letter-spacing: 0; text-align: center; height: 50px; margin: 80px 0 40px 0; background: #BD1A2D url(images/bg_column.png) no-repeat center; }
.MainName span { position: relative; display: inline-block; height: 50px; vertical-align: top; margin: 0 9px; }
.MainName span.titleLeft, .MainName span.titleRight { display: none; }
.MainName span > img { position: absolute; top: 20px; max-width: inherit; }
.titleLeft, .titleRight { width: 1px; }
.titleLeft img { right: 0; }
.titleRight img { left: 0; }
.hotMatter { width: 100%; background: #BD1A2D; border-radius: 4px; box-sizing: border-box; padding: 20px; position: relative; overflow: hidden; margin-bottom: 30px; }
.hotMatterImg { position: absolute; width: 60px; height: 60px; bottom: 21px; right: 22px; }
.hotTilte { font-size: 24px; color: #FFFFFF; letter-spacing: 0; margin-bottom: 18px; }
.hotIssues { display: flex; justify-content: space-between; }
.hotIssues a { display: block; width: 32%; height: 54px; line-height: 54px; background: rgba(255, 255, 255, 0.10); border: 1px solid rgba(255, 255, 255, 0.40); border-radius: 4px; font-size: 18px; color: #FFFFFF; letter-spacing: 0; box-sizing: border-box; padding: 0 17px; margin-top: 10px; }
.moreIssues { display: flex; flex-wrap: wrap; margin-top: 20px; }
.moreIssues a { display: block; width: auto; height: 30px; font-size: 14px; color: #FFFFFF; letter-spacing: 0; line-height: 32px; opacity: 0.8; transition: all 0.3s ease; }
.moreIssues a:hover { opacity: 1; }
.moreIssues a > span { display: -webkit-box; width: 100%; height: 30px; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; }
.moreIssues > span { font-size: 14px; color: #FFFFFF; letter-spacing: 0; line-height: 32px; opacity: 0.8; margin: 0 10px; }
.written-words { font-size: 14px; color: #FFFFFF; letter-spacing: 0; line-height: 26px; margin-top: 40px; position: relative; }
.x { display: block; width: 100%; opacity: 0.2; border: 1px solid #FFFFFF; position: absolute; top: -29px; left: -23px; }
.fw-item { width: 100%; background: #FFFFFF; border: 1px solid #E5E5E5; box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.10); border-radius: 4px; }
.itemUl-a { letter-spacing: 0; margin: 28px 28px 0 28px; position: relative; box-sizing: border-box; padding-bottom: 17px; border-bottom: 1px solid #D8D8D8; }
.itemUl-a > a { margin-right: 32px; font-size: 24px; color: #333333; }
.itemX { display: block; width: 80px; height: 6px; bottom: 0; left: 8px; position: absolute; background: #BD1A2D; }
.itemlistUl { margin-top: 20px; }
.itemlistUl li { width: 100%; height: 64px; line-height: 64px; font-size: 16px; color: #000000; letter-spacing: 0; transition: all 0.3s ease; }
.itemlistUl li > div:hover { border: 1px solid #E5E5E5; box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.10); }
.itemlistUl li > div > div { border-bottom: 1px dashed #E3E3E3; height: 64px; margin: 0 28px; }
.itemlistUl li p { width: 670px; display: -webkit-box; height: 64px; line-height: 64px; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; float: left; }
.itemlistUl li a { float: right; display: block; width: 100px; height: 36px; line-height: 36px; text-align: center; font-size: 14px; color: #FFFFFF; letter-spacing: 0; background: #BD1A2D; border: 1px solid #BD1A2D; border-radius: 4px; margin-top: 15px; }
.AffairsBtn { text-align: center; }
.AffairsBtn span { display: inline-block; width: 240px; height: 60px; background: #F7EFEF; border-radius: 4px; text-align: center; line-height: 60px; font-size: 20px; color: #BD192C; letter-spacing: 0; margin: 0 14px 0 14px; cursor: pointer; position: relative; }
.AffairsBtn span img { position: absolute; bottom: -9px; left: 109px; }
.AffairsBtnSure { background: #BD1A2D !important; color: #FFFFFF !important; }
.AffairsMain { margin-top: 32px; }
.AffairsUl { display: flex; flex-wrap: wrap; margin: 0px -14px 0 -14px; }
.AffairsUl li { display: flex; width: 379px; height: 200px; background: #FFFFFF; border: 1px solid #E6E6E6; box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.08); margin: 14px; }
.AffairsName { font-size: 24px; color: #333333; margin: 31px 0 20px 0; }
.AffairsItem { width: 224px; transition: all 0.3s ease; }
.AffairsItem a:hover { color: #BD1A2D; }
.AffairsItem a { font-size: 14px; color: #555555; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; margin-bottom: 16px; }
.AffairsImg { display: block; width: 58px; height: 58px; margin: 39px 35px; }
.moreAffairs { display: block; width: 200px; height: 50px; font-size: 16px; color: #555555; background: #FFFFFF; border: 1px solid #E1E1E1; box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.08); text-align: center; line-height: 50px; margin: 26px auto 0 auto; cursor: pointer; }
.ConvenientService { padding-bottom: 70px; }
.ConvenientUl { display: flex; flex-wrap: wrap; margin: 0px -30px 0 -20px; }
.ConvenientUl li { display: flex; width: 578px; height: 160px; background: #FFFFFF; border: 1px solid #E6E6E6; box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.08); margin: 14px 20px; }
.ConvenientTitle { width: 180px; text-align: center; }
.ConvenientImg { display: inline-block; width: 50px; height: 50px; font-size: 0; margin: 27px 0px 22px 0px; }
.ConvenientName { font-size: 22px; color: #333333; }
.ConvenientItem { width: 399px; height: 129px; border-left: 1px dashed #D8D8D8; margin-top: 16px; box-sizing: border-box; padding: 16px 27px 0 27px; }
.ConvenientItem a { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; font-size: 16px; color: #555555; margin-bottom: 16px; transition: all 0.3s ease; }
.ConvenientItem a:hover { color: #BD1A2D; }
.QuickAccess { border-top: 1px solid #F7F7F7; background: #F7F7F7; height: 400px; }
.con { display: flex; margin: 0px -20px 0 -20px; }
.con a { display: block; width: 397px; height: 168px; box-sizing: border-box; padding: 34px 0 0 93px; margin: 8px; cursor: pointer; }
._hidden { display: none; }
.page_div { width: 100%; height: 35px; margin: 0 auto; padding: 35px 0; }
.page_ul li { width: 30px; color: #cccccc; }
.last_page, .next_page { width: 70px; }
.last_page, .next_page, .page_ul  > a, .page_btn { display: inline-block; color: #666666; height: 30px; line-height: 30px; border: 1px solid #cccccc; border-radius: 5px; margin: 0px 5px; text-align: center; cursor: pointer; }
.page { cursor: pointer; }
.page_ul { }
.page_ul  > a { padding: 0 10px !important; }
.maxSpan { display: inline-block; color: #666666; height: 30px; line-height: 30px; margin: 0px 5px; font-weight: bold; }
.page_input { width: 40px; color: #666666; height: 25px; line-height: 25px; text-align: center; border: 1px solid #cccccc; }
.page_btn { width: 40px; }
.active { color: #ffffff !important; background: #e76d6d; }
.page_not { background: #eeeeee; }


@media screen and (max-width: 1200px){
	.AffairsUl { margin: 0; justify-content: space-between; }
	.AffairsUl li { width: 32%; margin: 10px 0; }
	.AffairsImg { margin: 35px 20px; }
	.ConvenientUl { margin: 0; justify-content: space-between; }
	.ConvenientUl li { width: 49%; margin: 10px 0; }
}
@media screen and (max-width: 1024px){
	.x { display: none; }
	.matterFirst { display: block; }
	.hotMatter { width: 100%; height: auto; padding: 20px; margin-bottom: 20px; }
	.hotIssues { display: flex; justify-content: space-between; }
	.hotIssues a { width: 32%; }
	.moreIssues a { width: auto; }
	.moreIssues a > span { width: auto; }
	.written-words { margin-top: 10px; }
	.fw-item { width: 100%; height: auto; margin-left: 0; }
	.itemlistUl li { width: 100%; }
	.page_div { height: auto; overflow: hidden; }
	.AffairsUl li { width: 49%; }
}
@media screen and (max-width: 768px){
	.MainName { font-size: 24px; display: flex; align-items: center; margin: 40px 0 20px; justify-content: center; }
	.MainName span.titleLeft, .MainName span.titleRight { width: auto; display: inline-flex; align-items: center; }
	.hotIssues { flex-wrap: wrap; }
	.hotIssues a { width: 100%; margin-top: 0; height: 2.4em; line-height: 2.4em; margin-bottom: 10px; }
	.moreIssues { margin-top: 0; display: block; }
	.moreIssues a > span { font-size: 16px; }
	.moreIssues > span { display: none; }
	.itemUl-a { margin: 20px 20px 0; }
	.itemlistUl li { height: auto; line-height: inherit; }
	.itemlistUl li > div > div { margin: 0 20px; display: flex; justify-content: space-between; align-items: center; height: 46px; }
	.itemlistUl li p { height: 30px; line-height: 30px; width: 100%; }
	.itemlistUl li a { flex-shrink: 0; width: 80px; height: 30px; line-height: 30px; margin-top: 0; }
	.pageCon { flex-wrap: wrap; }
	.AffairsBtn { display: flex; justify-content: space-between; }
	.AffairsBtn span { font-size: 16px; height: 40px; line-height: 40px; margin: 0; }
	.AffairsMain { margin-top: 20px; }
	.AffairsUl li { width: 100%; padding: 20px; }
	.AffairsImg { margin: 0 20px 0 0; }
	.AffairsName { margin-top: 0; }
	.ConvenientUl li { width: 100%; }
	.ConvenientName { font-size: 16px; }
}