.topicsContent {
	margin: 98px auto 0;
	width: 635px;
}

.topicNavs li {
	padding: 0 33px;
	float: left;
	font-size: 16px;
	font-weight: bold;
	letter-spacing: .2px;
}

.topicNavs li:first-child {
	padding-left: 50px;
}

.topicNavs li a {
	transition: none;
}

.topicNavs li a:hover,
.topicNavs .all.active a {
	border-bottom: 2px solid #000;
}

.topicNavs .news a,
.topicNavs .news {
	color: #5682bd;
}

.topicNavs .news a:hover {
	border-color: #5682bd;
}

.topicNavs .news.active a {
	border-bottom: 2px solid #5682bd;
}

.topicNavs .culture a,
.topicNavs .culture {
	color: #a19041;
}

.topicNavs .culture a:hover {
	border-color: #a19041;
}

.topicNavs .culture.active a {
	border-bottom: 2px solid #a19041;
}

.topicNavs .release a,
.topicNavs .release {
	color: #4d9a66;
}

.topicNavs .release a:hover {
	border-color: #4d9a66;
}

.topicNavs .release.active a {
	border-bottom: 2px solid #4d9a66;
}

.topicNavs .report a,
.topicNavs .report {
	color: #9967a7;
}
.topicNavs .report:hover a {
	border-color: #9967a7;
}

.topicNavs .report.active a {
	border-bottom: 2px solid #9967a7;
}


.topicNavs .award a,
.topicNavs .award {
	color: #f16671;
}
.topicNavs .award:hover a {
	border-color: #f16671;
}

.topicNavs .award.active a {
	border-bottom: 2px solid #f16671;
}




.topicNavs .project a,
.topicNavs .project {
	color: #7fc9ed;
}
.topicNavs .project:hover a {
	border-color: #7fc9ed;
}

.topicNavs .project.active a {
	border-bottom: 2px solid #7fc9ed;
}




.topicNavs .media a,
.topicNavs .media {
	color:  #f8c167;
}
.topicNavs .media:hover a {
	border-color:  #f8c167;
}

.topicNavs .project.media a {
	border-bottom: 2px solid  #f8c167;
}



.topicNavs .pdpr a,
.topicNavs .pdpr {
	color:  #98cebc;
}
.topicNavs .pdpr:hover a {
	border-color:  #98cebc;
}

.topicNavs .project.pdpr a {
	border-bottom: 2px solid  #98cebc;
}



.contentList {
	margin-top: 69px;
}

.contentList li {
	margin-bottom: 50px;
	display: table;
}

.contentList li a {
	display: block;
}

.contentList li a:hover {
	opacity: .6;
}

.contentList .photo {
	width: 100px;
	display: table-cell;
	vertical-align: top;
}

.contentList .photo img {
	width: 100%;
}

.contentList .info {
	padding-left: 25px;
	display: table-cell;
	vertical-align: top;
	color: #333434;
}

.times {
	margin-bottom: 16px;
	font-size: 11px;
	color: #828383;
	letter-spacing: .7px;
}

.contentList li:first-child .info .times {
	margin-bottom: 12px;
}

.times span {
	padding-top: 2px;
	margin-right: 7px;
	display: inline-block;
	width: 70px;
	text-align: center;
	color: #fff;
	font-size: 10px;
	background: #ccc;
}

.contentList .info h3 {
	color: #333434;
	font-size: 15px;
	line-height: 1.6;
}

.times .news {
	background: #7ca3d8;
}

.times .culture {
	background: #c9b96c;
}

.times .release {
	background: #78bf8f;
}

.times .report {
	background: #c098cb;
}
.times .award {

	background: #f16671;
}

.times .project {
	background: #7fc9ed;
}

.times .media {
	background: #f8c167;
}

.times .pdpr {
	background: #98cebc;
}

.pageBox {
	text-align: center;
}

.pageBox .pages {
	padding: 22px 0 95px;
	display: inline-block;
}

.pageBox .pages1 {
	padding-left: 30px;
}
.pageBox .pages li {
	float: left;
	position: relative;
	font-size: 14px;
}

.pageBox .pages a:hover {
	opacity: .6;
}

.pageBox .pages span,
.pageBox .pages a,
.pageBox .pages .dots {
	padding: 0px 10px 0 5px;
	min-width: 13px;
	display: inline-block;
	color: #666;
	font-family: 'Roboto', sans-serif;
}

.pageBox .cur span {
	font-weight: bold;
	color: #000;
}

.pageBox .pages svg {
	fill: #695b5b;
	width: 21px;
	height: 36px;
	position: absolute;
	top: -8px;
	right: -15px;
	transform: scale(.4);
}

.pageBox .pages .prev svg {
	right: auto;
	left: -15px;
}

@media all and (min-width: 0) and (max-width: 767px) {
	.topicsContent {
		margin: 68px 0 0;
		width: auto;
	}

	.ListBox {
		margin-bottom: 22px;
		text-align: center;
	}

	.navsList {
		display: inline-block;
		position: relative;
	}

	.ListBox .navsList:before,
	.ListBox .navsList:after {
		width: 7px;
		height: 1px;
		position: absolute;
		right: 14px;
		top: 11px;
		display: block;
		content: "";
		background: #7d7d7d;
		transform: rotate(45deg);
		transition: all .6s ease;
	}

	.ListBox .navsList:after {
		right: 9px;
		transform: rotate(-45deg);
	}

	.showPull .ListBox .navsList:before {
		transform: rotate(-45deg);
	}

	.showPull .ListBox .navsList:after {
		transform: rotate(45deg);
	}

	.ListBox ul,
	.ListBox p {
		padding-right: 16px;
		padding-bottom: 2px;
		width: 130px;
		text-align: center;
		font-size: 16px;
		font-weight: bold;
		letter-spacing: 1px;
	}

	.ListBox p {
		border-bottom: 2px solid #000;
		padding: 0 0px 4px 13px;
		text-align: left;
		box-sizing: border-box;
	}

	.ListBox ul {
		padding-bottom: 15px;
		position: absolute;
		z-index: 10;
		display: none;
		background: #fff;
	}

	.ListBox ul li {
		margin-top: 15px;
	}

	.Navs .topicNavs li {
		padding: 18px 0 5px !important;
		display: none;
		font-size: 24px;
		letter-spacing: 1px;
	}

	.Navs .topicNavs .active  {
		display: block !important;
	}

	.topicNavs li a:hover,
	.topicNavs li a.active {
		border: none;
	}

	.contentList {
		margin-top: 28px;
	}

	.contentList li {
		margin-bottom: 45px;
	}

	.contentList .info {
		padding-left: 22px;
	}

	.contentList .info h3 {
		font-size: 14px !important;
		line-height: 1.5 !important;
	}

	.contentList .info p {
		margin-bottom: 14px;
	}

	.contentList li:first-child .info .times {
		margin-bottom: 15px;
	}

	.pageBox .pages {
		padding: 13px 0 89px 0px;
	}

	.pageBox .pages1 {
		padding-left: 21px;
	}

	.pageBox .pages .dots {
		margin-top: 0;
	}

	.pageBox .pages span,
	.pageBox .pages a,
	.pageBox .pages .dots {
		padding: 0px 11px 0 13px;
		min-width: auto;
	}

	.pageBox .pages svg {
		right: -30px;
	}

	.pageBox .pages .prev svg {
		right: auto;
		left: -30px;
	}

}


/*******************************************************************
	topics detail
********************************************************************/
.detail {
	margin: 56px auto 88px;
	width: 800px;
}

.detailTitle .titleMsg {
	text-align: right;
}

.detailTitle h2 {
	padding: 6px 0 22px;
	position: relative;
	font-size: 24px;
	letter-spacing: .6px;
}

.detailTitle h2:after {
	width: 100%;
	height: 1px;
	position: absolute;
	left: 0;
	bottom: 0;
	content: "";
	background: #000000;
}

.photoBox {
	margin: 78px auto 72px;
	width: 560px;
}

.photoBox img {
	width: 100%;
}

.detailInfo {
	padding-bottom: 33px;
	font-size: 13px;
	color: #040404;
	border-bottom: 1px solid #7d7d7d;
}

.detailInfo h3 {
	margin-bottom: 28px;
	color: #000;
	font-size:20px;
}

.detailInfo .info p {
	letter-spacing: .3px;
	line-height: 1.69;
	margin-bottom: 22px;
}
.detailInfo .info img{
	width: 100%;
}
.detailInfo img {
    width: 100%;
}
.detailInfo .info figure{
	margin-left: 0;
	margin-right: 0;
}
.detailInfo .info .matter {
	margin-bottom: 67px;
}

.detailInfo .info a {
	text-decoration: underline;
}

.detailInfo .info a:hover {
	text-decoration: none;
}

.latestBox {
	margin: 0 auto;
	width: 880px;
}

.latestBox h4 {
	text-align: center;
	font-size: 28px;
	letter-spacing: 1.5px;
}

.latestBox h4 span {
	font-weight: normal;
}

.detailList {
	margin: 53px 0 3px;
}

.detailList li {
	margin-bottom: 62px;
	width: 46.8%;
	float: left;
}

.detailList li:nth-child(2n) {
	float: right;
}


.detailList li:nth-child(3) {
	clear: both;
}

.detailList .info {
	padding-left: 22px;
}

.detailList .info h3 {
	font-size: 13px;
	line-height: 1.67;
	font-weight: normal;
}

.detailList .info .times,
.detailList li:first-child .info .times {
	margin-bottom: 17px;
}

.latestBox .return {
	margin: 0 auto 100px;
}

@media all and (min-width: 0) and (max-width: 767px) {
	.detail {
		margin: 18px auto 49px;
		width: auto;
	}

	.detailTitle h2 {
		padding: 17px 0 19px;
 		font-size: 23px;
	}

	.detailTitle .titleMsg .times {
		margin: 0;
	}

	.photoBox {
		margin: 43px 27px 38px;
		width: auto;
	}

	.detailInfo {
		padding-bottom: 22px;
	}

	.detailInfo h3 {
		margin-bottom: 19px;
		letter-spacing: .3px;
	}

	.detailInfo .info p {
		line-height: 1.61;
		margin-bottom: 21px;
	}

	.detailInfo .info a:hover {
		text-decoration: underline;
	}

	.detailInfo .info .matter {
		margin-bottom: 62px;
	}

	.latestBox {
		width: auto;
	}

	.detailList {
		margin: 34px 0 16px;
	}

	.detailList li {
		margin-bottom: 35px;
		width: auto;
		float: none;
	}

	.detailList .info .times,
	.detailList li:first-child .info .times {
		margin-bottom: 15px;
	}

	.detailList li:nth-child(2n) {
		float: none;
	}
	.detailInfo .info p iframe{ width:100% !important;}

}


@media all and (-ms-high-contrast:none){
	.times span {
		padding-top: 5px;
	}
}


.detailTitle{ margin-bottom: 40px;}
.detailInfo figcaption{ margin-top: 10px;}
.detailInfo .info{ margin-bottom: 40px;}


/*RESEARCH RESULT*/
.category-research_result .pc.topicNavs{
	box-shadow: 0px 0px 18px -5px rgb(109 109 109 / 60%);
	padding: 15px 60px 40px;
	border-radius:10px;
	margin-bottom: 75px;
	position:relative;
}
.category-research_result .topicNavs::after{
	content:"";
	width:30%;
	display:block;
}
.category-research_result .topicNavs li{
	width: 23%;
	box-sizing:border-box;
	font-size: 13px;
	font-weight: normal;
	letter-spacing: .2px;
	text-align:center;
	padding: 0;
}
.category-research_result .topicNavs li a{
	box-shadow: 0px 2px 18px -5px rgb(109 109 109 / 60%);
	border-radius:50px;
	width:100%;
	box-sizing:border-box;
	display:block;
	padding: 10px 5px;
	transition:.3s;
}
.category-research_result .topicNavs li a:hover{
	background:rgb(204 224 255 / 60%);
	color:#003c81;
	border-bottom:none;
}
.category-research_result .topicNavs li{
	margin-right: calc(6% / 3);
}
.category-research_result .topicNavs li{
	margin-top:25px;
}

.research-box .times span {
	padding: 2px 5px 0;
	display: inline-block;
	width: auto;
	background: #003c81;
}

.researchBox .topicNavs li a:hover,
.researchBox .topicNavs .all.active a {
	background:rgb(204 224 255 / 60%);
	color:#003c81;
	border-bottom:none;
}