@charset "UTF-8";
/* CSS Document */
/*共通*/
img {
  vertical-align: bottom;
}
a {
  text-decoration: none;
  color: #1D1C1C;
}
.font_10p {
  font-size: 10px;
}
/* END 共通*/


/*広報紙表示年代の切り替えボタン
---------------------------------------------------------- */
/*位置を固定*/
.kouhou_nendai_change {
  /*text-align: right;*/
  border: solid 0px;
}

/*ボタン仕様*/
.kouhou_nendai_change .change_btn {
  text-align: center;
  padding: 2px 16px;
  /*cursor: pointer;*/
  font-size: 12px;
  color: #000000;
  border-radius: 4px;
  background-color: #ffffff;
  border: solid 1px#CADC38; /*基本色*/
  transition: 0.5s; /*hover処理の時間*/
}
.kouhou_nendai_change .change_btn:hover {
  background-color: #EAF49C;
	cursor: pointer;
}

/*ボタンの左矢印*/
.kouhou_nendai_change .back_arrow {
  display: block;
  width: 8px;
  height: 8px;
  margin-right: 0px;
  border-top: solid 1px;
  border-right: solid 1px;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}
/*ボタンの右矢印*/
.kouhou_nendai_change .next_arrow {
  display: block;
  width: 8px;
  height: 8px;
  margin-left: 0px;
  border-top: solid 1px;
  border-right: solid 1px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
/*矢印と文字（並列*/
.kouhou_nendai_change .back_arrow,
.kouhou_nendai_change .next_arrow,
.kouhou_nendai_change .change_txt {
  display: inline-block;
}
.kouhou_nendai_change .back_arrow{
	margin-right: 5px;
}
.kouhou_nendai_change .next_arrow{
	margin-left: 5px;
}
/*****************************************************************

広報紙リスト

****************************************************************-*/
/*------------------------------------------------
一覧
-------------------------------------------------*/
#koho_list {
  width: 100%;
  margin-top: 20px;
  border: solid 0px;
}
/*1行*/
#koho_list .koholine_flex {
  width: 100%;
  display: flex;
  align-items: center;
  border-bottom: solid 1px #CADC38; /*基本色*/
}
@media (max-width: 900px) {
  #koho_list .koholine_flex {
    flex-direction: column;
    align-items: flex-start;
  }
}
/*ヘッダーのライン
----------------------------------------------*/
#koho_list article.header {
  border-bottom: solid 2px #CADC38; /*基本色*/
	font-weight: bold;
		  padding: 0px 4px;
	font-size: 12px;
}
/*項目
----------------------------------------------*/
#koho_list .item div{
  font-size: 12px;
  line-height: 16px;
  padding: 4px 4px;
  box-sizing: border-box;
}
/*掲載年月日*/
#koho_list .hakkou_bi {
  width: 160px;
  border: solid 0px;
}
/*号数*/
#koho_list .hakkou_no {
  width: 60px;
  border: solid 0px;
}
/*主な見出し*/
#koho_list .midashi {
  width: 200px;
  border: solid 0px;
}
/*内容*/
#koho_list .naiyou {
  flex: 1;
}
/*資料　PDFボタン枠
--------------------------------------*/
#koho_list .shiryou {
		padding: 6px 0;
  box-sizing: border-box;
  width: 140px;
  border: solid 0px;
}
@media (max-width: 900px){
	#koho_list .shiryou{
		/*margin: 5px 0 8px 0;*/
	}
}
#koho_list .link_btn {
  width: 200px;
  font-size: 12px;
  text-decoration: none;
  /*border-radius: 10px;*/
  padding: 3px 8px;
  border: solid 1px #CADC38;
  color: #000000;
}
#koho_list .link_btn:hover {
  background-color: #CADC38;
}

@media (max-width: 900px) {
  /*各項目幅100％*/
  #koho_list .item {
    width: 100%;
  }
  /*ヘッダーをなくし各項目名称を入れる
	---------------------------------------------*/
  #koho_list .header {
    display: none;
  }
  #koho_list .hakkou_bi div:before {
    content: "【発行日】";
    color: #5ab4bd;
    margin-right: 5px;
  }
  #koho_list .hakkou_no div:before {
    content: "【号数】";
    color: #5ab4bd;
    margin-right: 5px;
  }
  #koho_list .midashi div:before {
    content: "【見出し】";
    color: #5ab4bd;
    margin-right: 5px;
  }
  #koho_list .naiyou div:before {
    content: "【内容】";
    color: #5ab4bd;
    margin-right: 5px;
  }

}

/* **********************************************

ディバイスサイズ設定

********************************************** */
/* スマホ用 */
@media (max-width: 749px) {}
/* タブレット用 */
/*@media (min-width: 750px) and (max-width: 1121px) {*/
@media (max-width: 1121px) {}
/* Desktop View------------------------------- */
@media (min-width: 1122px) {}