@charset "UTF-8";

h1.page_title{
	line-height:1;
	padding:0.8em 1em;
	letter-spacing:0.05em;
	background-color:#e9eaea;
	border-radius: 4px;
	font-size: 1.3125rem;
	font-weight: bold;
}

/*p-select_menu*/

.p-select_menu{
	display: flex;
	justify-content: space-between;
	font-size: 0.875rem;
	line-height: 1;
/*	background-color: #D4EDF3;
	padding: 0.625rem 0.625rem 0.375rem;
	border-radius: 6px;*/
}
.p-select_menu a{
	text-decoration: none;
	color: #212121;
}
.p-select_menu .select_label{
	font-weight: 600;
	font-size: 1rem;
	padding: 0.625rem 1rem;
	background-color: #EDEFF2;
	/*background:linear-gradient(to bottom, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0.4) 90%);*/
	border-radius: 3px;
	margin-bottom: 0.75rem;
	width: 100%;
	text-align: center;
}
.p-select_menu .year_select,
.p-select_menu .ctg_select{
	flex: 0 0 auto;
	width: calc((100% - 30px)/2);
	padding-bottom: 0.625rem;
	/*display: flex;
	justify-content: center;
	flex-wrap: wrap;*/
}
.p-select_menu ul{
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	/*padding: 0 0.25rem;*/
	width: 100%;
}
.p-select_menu ul li{
	flex: 0 0 auto;
	margin: 0.125rem 5px;
	width: calc((100% - 50px)/5);
}
.p-select_menu ul li a{
	display: block;
	text-align: center;
	padding: 0.375rem 0 0.375rem;
	border-radius: 3px;
	border: #EDEFF2 2px solid;
	transition: background-color 0.3s;
}
.p-select_menu ul li a:hover{
	/*background-color: #B3E1EA;*/
	background-color: #f0f0f0;
}
.p-select_menu .year_select ul li.current a{
	border-color: #2296a8;
	background-color: #2296a8;
	color: #fff;
}
.p-select_menu .ctg_select ul li.current a{
	color: #fff;
	background-color: #666;
	border-color: #666;
}
.p-select_menu .ctg_select ul li.current a.ctg_eco{
	background-color: #87AE23;
	border-color: #87AE23;
}
.p-select_menu .ctg_select ul li.current a.ctg_region{
	background-color: #D48C25;
	border-color: #D48C25;
}
.p-select_menu .ctg_select ul li.current a.ctg_education{
	background-color: #2FAD9E;
	border-color: #2FAD9E;
}
.p-select_menu .ctg_select ul li.current a.ctg_culture{
	background-color: #6996DB;
	border-color: #6996DB;
}
.p-select_menu .ctg_select ul li.current a.ctg_disaster{
	background-color: #AE74BC;
	border-color: #AE74BC;
}

/*sp p-select_menu*/
.sp .p-select_menu{
	display: block;
	font-size: 0.75rem;
	margin-bottom: 2rem;
}
.sp .p-select_menu .year_select,
.sp .p-select_menu .ctg_select{
	width: 100%;
}
.sp .p-select_menu .select_label{
	font-size: 0.875rem;
}

/*article*/
article.topics_body{
	margin-bottom: 2rem;
}

article.topics_body .content{
	line-height:1.9;
	font-size:1rem;
	text-align: justify;
}
article.topics_body p {
  margin: 0 0 1em;
}
article.topics_body p.img {
  margin: 0;
}
article.topics_body p.caption {
  margin: 5px 0 20px;
	font-size: 85.7%;
}
article.topics_body .center {
  text-align: center;
}

article.topics_body p.date {
	/*font-size: 0.875rem;
  margin: -10px 0 35px 0px;
  color: #363434;
	text-align:left;*/
	/*display: none;*/
}

article.topics_body .section.narrow{
	margin-left:100px; width:500px;
}

.topic_title {
  color: #363434;
	margin: 0 0 1.25rem;
	position: relative;
}
#main .topic_title h1 {
  margin: 0px 0 1.25rem;
	padding: 0 0 1.75rem;
  font-size: 1.5rem;
  font-weight: bold;
	letter-spacing: 0.01em;
	border-bottom: #2db2c3 2px solid;
	font-family:"Roboto","Noto Sans JP","メイリオ", Meiryo, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;
}

.sp #main .topic_title h1 {
	font-size: 1.25rem;
	line-height: 1.5;
	padding-bottom: 1rem;
}

#main .topic_title h2 {
  margin: -10px 0 20px;
  font-size: 107.7%;
  font-weight: bold;
  color: #666;
}

#main h3.p-topics_sub_header{
	font-size: 1.125rem;
	line-height: 1;
	font-weight: bold;
	padding: 1.25rem 0 1.375rem 1.875rem;
	margin: 2.5rem 0 0;
	border-top: #2db2c3 1px solid;
	position: relative;
}
#main h3.p-topics_sub_header::before{
	content: "";
	display: block;
	border-style: solid;
	border-width: 12px 8px 0px 8px;
	border-color: #2db2c3 transparent transparent transparent;
	position: absolute;
	top:1.3125rem; left: 0.25rem;
}
.sp #main h3.p-topics_sub_header{
	font-size: 0.9375rem;
}


/*link_nav_year*/
.link_nav_year{
	display: flex;
	justify-content:flex-start;
	flex-wrap: wrap;
	align-items: center;	
}
.link_nav_year .year_link{
	display: block;
	width: 5em;
	box-sizing: border-box;
	text-align: center;
	font-size:1rem;
	font-weight: bold;
	color: #666;
	margin: 0 0.25rem;
	padding: 0.6rem 0;
	border: #ccc 2px solid;
	border-radius: 6px;
	line-height: 1;
	text-decoration: none;
	background-color: #fff;
	position: relative;
}

.sp .link_nav_year .year_link{
	width: 5em;
	font-size:0.8125rem;
	padding: 0.675em 0;
	margin-bottom: 0.5rem;
}

.link_nav_year .year_link.current,
.link_nav_year .year_link.current:hover{
	background-color: #fff;
	border-color: #E6002D;
	color: #000;
}

.link_nav_year .year_link.current::before{
	content: "";
	display: block;
	position: absolute;
	top:100%;
	left: 50%;
	border-style: solid;
	border-width: 12px 10px 0px;
	margin-left: -10px;
	border-color: #E6002D transparent transparent;
}
.sp .link_nav_year .year_link.current::before{
	content: "";
	display: none;
}

.link_nav_year .year_link:hover{
	background-color: #f4f4f4;
}

.link_nav_year .go_to_index{
	margin-left: auto;
	font-size: 0.8125rem;
	padding: 0;
	border: #ccc 2px solid;
	border-radius:1.5rem;
	overflow: hidden;
}
.link_nav_year .go_to_index a{
	display: block;
	padding: 0.5rem 1.5rem 0.45rem;
	line-height: 1;
	text-decoration: none;
	color: #212121;
}
.link_nav_year .go_to_index a:hover{
	background-color: #f4f4f4;
}
.sp .link_nav_year .go_to_index{
	display: none;
}

/*p-rel_link*/

.p-rel_link {
	display: flex;
	justify-content: space-between;
	line-height: 1.5;
	background-color: #EDEFF2;
	border-radius: 4px;
	margin: 1.875rem 0;
}
.p-rel_link dt {
	flex: 0 0 auto;
	width: 120px;
	padding: 0.75rem 0.875rem 0.9375rem 0.75rem;
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
#main .p-rel_link dt h3, .p-rel_link h4 {
	font-size: 1rem;
	line-height: 1.5;
	margin: 0;
}
.p-rel_link dt {
	flex: 0 0 auto;
	width: 120px;
	padding: 0.75rem 0.875rem 0.9375rem 0.75rem;
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.p-rel_link dd {
	flex: 1 0 auto;
	width: 50%;
	padding: 0.75rem 1.25rem 0.9375rem;
}
.p-rel_link ul.link li {
	margin: 0.375rem 0;
}

.sp .p-rel_link {
	display: inherit;
}
.sp .p-rel_link dt {
	width: 100%;
	padding-bottom: 0;
	text-align: left;
	padding-left: 1.25rem;
}
.sp .p-rel_link dd {
	width: 100%;
	padding: 0.375rem 1.25rem 1rem !important;
	font-size: 0.8125rem;
}

/*.article_bottom*/
article.topics_body .article_bottom{
	page-break-after:auto;
	margin-bottom:-15px;
	font-size:0.875rem;
	display: flex;
	justify-content: flex-end;
}
article.topics_body .article_bottom__inner{
	flex: 0 0 auto;
	width: auto;
	padding:15px 0px 0px 0px;
	border-top: #999 1px dotted;
	display: flex;
	justify-content: flex-start;
}
article.topics_body .article_bottom p.go_pagetop{
	padding:0px 15px 0px 5px;
	margin-left:1.5em;
	flex: 0 0 auto;
	width: auto;
}
article.topics_body .article_bottom p.link{
	flex: 0 0 auto;
	width:auto;
	line-height:1;
	background-position:0 2px;
	display: inline-block;
}
.article_bottom .go_pagetop a{
	text-decoration:none;
	background-position:0 6px;
}
.article_bottom .go_pagetop a:hover{
	text-decoration:underline;
}

/* table.data */
table.data {
  width: 100%;
  margin: 20px 0px;
}
table.data th, table.data td {
  padding: 6px 8px 6px 10px;
  border: 1px solid #CCCCCC;
}
table.data th {
  font-weight: bold;
  border-right-width: 2px;
  background-color: #EDEDED;
}

/*tags*/

.tags{
	width: auto;
	/*position: absolute;
	bottom:-2.6rem;*/
	right: 0px;
	display: flex;
	justify-content: flex-end;
}
.sp .tags{
	/*bottom:-3.5rem;*/
}
.tags li{
	width: auto;
	min-width: 6em;
	box-sizing: border-box;
	flex: 0 0 auto;
	margin: 0 0.25rem;
	padding: 0.4375rem 1rem 0.4375rem;
	line-height: 1;
	/*border-radius: 1rem;*/
	border-radius: 4px;
	color: #fff;
	text-align: center;
	font-size: 0.9375rem;
	letter-spacing: 0.1em;
}

.tags .region{
	background-color: #D48C25;
}
.tags .eco{
	background-color: #87AE23;
}
.tags .education{
	background-color: #2FAD9E;
}
.tags .culture{
	background-color: #6996DB;
}
.tags .disaster{
	background-color: #AE74BC;
}
.tags .award{
	background-color: #D41036;
}
.tags .general{
	background-color: #90979A;
}

.sp .tags li{
	font-size: 0.75rem;
	padding: 0.375rem 0.5rem;
}

/*rel_info*/

#main h2.border{
	border-top: #ccc 1px solid;
	padding-top:12px;
	margin-top:40px;
	margin-bottom:18px;
	padding-left:22px;
	font-size:115.38%;
	letter-spacing:0.05em;
	background:url(../images/bg_h2_below.png) no-repeat 0px 17px;
}
#main #anc_topics_index h2.border{
	border-top:#E6002D 2px solid;
}


/*rel_info border-box*/

.border-box.rel_info{
	border-radius: 4px;
}
.border-box.rel_info dl{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	line-height: 1.2;
}
.border-box.rel_info dl::after{
	display: none;
}
.border-box.rel_info dl>dt{
	width: 5rem;
	flex: 0 0 auto;
}
.border-box.rel_info dl>dd{
	flex: 1 0 auto;
	width: calc(100% - 5rem);
}

div#main .border-box.rel_info h3.title{
	background: none;
	padding: 0;
	margin: 0 0 0.875rem;
	font-size: 0.9375rem;
	line-height: 1.3;
}
.border-box.rel_info .content{
	padding: 0.875rem 0.9375rem 0;
}
.border-box.rel_info .content .inline li,
.border-box.rel_info .content li{
	font-size: 0.9375rem;
	line-height: 1.3;
	margin-bottom: 0.8em;
	display: inline-block;
}

/*rel_info*/
.bn-box.border.rel_info{
}
.sp .bn-box.border.rel_info{
	min-height: auto !important;
}
.bn-box.border.rel_info .img{
	float:left; width:150px;
}

.bn-box.border.rel_info .txt{
	padding-left:170px;
}
#main .bn-box h3.title{
	background: url("/common/image/arrow_red_large.png") no-repeat 0px 0.3125em;
  padding: 0 0 0 20px;
  margin: 0.875rem 0;
}

/*topics_index*/
.topics_index_switch ul{
	display: flex;
	justify-content: flex-start;
	border-bottom: #999 1px solid;
	margin-bottom: 1.5rem;
	line-height: 1;
}
.topics_index_switch li{
	flex: 0 0 auto;
	margin: 0 0.25em -1px;
	padding: 0.9em 0 0.9em;
	line-height: 1;
	text-align: center;
	width: 6em;
	border: #999 1px solid;
	border-radius: 4px 4px 0 0;
	background: #ededed;
	color: #666;
	cursor: pointer;
	font-size: 0.875rem;
	font-weight: bold;
	position: relative;
}

.topics_index_switch li.current{
	background: #fff;
	color: #212121;
	border-bottom-color: #fff;
	font-weight: bold;
}
.topics_index_switch li.current::before{
	content: "";
	position: absolute;
	top:1px;
	left: 3%;
	width: 94%;
	height: 2px;
	background-color: #E6002D;
}

/*sp topics_index_switch*/
/*.sp .topics_index_switch li{
	font-size: 0.75rem;
	padding: 0.5rem 0 0.5625rem;
	margin: 0 2px -1px;
	flex: 0 0 auto;
	width: 3.25rem;
}*/
.sp .topics_index_switch ul{
	flex-wrap: wrap;
	border-bottom: none;
	margin-bottom: 0.5rem;
}
.sp .topics_index_switch li{
	font-size: 0.75rem;
	padding: 0.5rem 0 0.5625rem;
	margin: 0 2px 6px;
	flex: 0 0 auto;
	width: calc((100% - 20px)/5);
	border-radius: 4px;
}
.sp .topics_index_switch li.current{
	border-color: #E6002D;
}
.sp .topics_index_switch li.current::before{
	display: none;
}
/**/
.topics_index_body{
	display: none;
}
.topics_index_body.current{
	display: block;
}

.topics_index_body ul.link>li{
	font-size: 0.9375rem;
	padding: 0.6em 0 0.6em;
	margin: 0;
	background-image: linear-gradient(to right, #b5b5b5, #b5b5b5 1px, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 2px);
  background-size: 2px 1px;
  background-position: bottom;
  background-repeat: repeat-x;
	cursor: pointer;
}
.topics_index_body ul.link>li:hover{
	background-color: #FFF8D7;
}

.topics_index_body ul.link li a{
	display: inline-block;
	background: url(/common/image/arrow_red.png) no-repeat 0 0.35em;
	padding-left: 12px;
}
.topics_index_body ul.link li a:hover{
	text-decoration: none;
}

.topics_index_body .tags{
	display: inline-block;
	position: static;
}
.topics_index_body .tags li.tag{
	font-size: 0.875rem;
	display: inline-block;
	color: #fff;
	line-height: 1;
	border-radius: 1.25em;
	padding: 0.3125em 1em 0.25em;
	margin: 0;
	min-width: auto;
	background-image: none;
	
}

.sp .topics_index_body .tags{
	display: none;
}

/*icon_new*/
img.icon_new{
	margin:0 0 0 5px;
	vertical-align:-2px;
}

h1 img.icon_new {
	vertical-align:0px;
}

@media print {
	#main{
		float: none;
	}
	.article_bottom{
		display: none;
	}
}