@charset "utf-8";

/*テスト用*/
/* 災害情報（TopIndex用）
-------------------------------------------------------------------------*/
#saigai{ 
	display:none;/**/
	width: 94%;
	max-width: 1164px;
	margin:4% auto 4%;
	padding: 5%;
	background: #ffffff;
	border:solid 2px #222222;
	box-sizing: border-box;
}
#saigai h1{ 
}
/*情報テキストBOX*/
#saigai_contents{
  width: 100%;
  overflow: hidden;
  border:solid 1px #222222;
  white-space: nowrap;
}
#saigai_contents_txt p{
  display: inline-block;
  padding-left: 0;
  /*animation: marquee-move 200s linear infinite;*/
  margin: 0;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  line-height: 1;
  /*追加*/
  animation: marquee-move linear infinite;/**/
  /* 速度設定：1文字あたり0.2秒にする場合 */
  /* 計算式: --text-length(文字数) * 0.2s */
  animation-duration: calc(var(--text-length) * 0.2s);/**/
}

@keyframes marquee-move {
  0% { transform: translate(0, 0); }
  100% { transform: translate(-100%, 0); }
}
/*関連リンク*/
.saigai_link_box{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.saigai_link_top{
	width: 100%;
	min-width: 250px;
	margin: 0 auto 8%;
}
.saigai_link_top a{ margin: 0 auto; }

.saigai_link_menu {
	display: flex;
	flex-wrap: wrap;
	width: 270px;
	padding: 15px 20px;
	background-color: #dfdfdf;
	border-radius: 10px;
	box-sizing: border-box;
}
.saigai_link_menu h4 { 
	width: 100%;
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1;
	padding-bottom: 12px;
}
.saigai_link_btn { width: 100%; }
.btn_saigai1{ width: 250px; }
.btn_saigai2{ width: 220px;}
.btn_saigai3{ width: clamp(140px,100%,220px);}
.saigai_link_btn:first-of-type { margin-bottom: 15px; }

@media (min-width: 680px){ 
#saigai{ width: 90%; }
.saigai_link_box{ flex-wrap: nowrap; justify-content: flex-start; }
.saigai_link_top,.saigai_link_top a { margin: 0; }
.saigai_link_top { width: clamp( 250px,47.5%,260px ); }
.saigai_link_menu { width: 47.5%; margin-left: 5%; }
}
@media (min-width: 768px){
#saigai{ padding: 3%; }
.saigai_link_box { justify-content: flex-start; flex-wrap: nowrap; }
.saigai_link_top { width: clamp( 250px,23%,252px ); }
.saigai_link_menu { margin-left: 3%; width: 70% }
.saigai_link_btn { width: 220px; margin-right: 3%;}
.saigai_link_btn:first-child { margin-bottom: 0; }
.saigai_link_btn:last-of-type { margin-right: 0%; }
}

@media (min-width: 920px){.saigai_link_btn:first-of-type { margin-bottom: 0; }
}

@media (min-width: 960px){
#saigai{ 
	margin: clamp( 15px,2.5%,39px ) auto 2%;
	padding: clamp( 18px,3% ,39px );
	border:solid 3px #222222;
}
#saigai_contents_txt p{
  padding-top: 0.9em;
  padding-bottom: 0.9em;
  font-size: 1.8rem;
}
.saigai_link_menu {
	align-items: center;
	width: clamp( 540px,72% ,660px );
	padding: 20px 30px;	
	 }

.saigai_link_menu h4 { font-size: 2.2rem; }
}
@media (min-width: 1150px){
.saigai_link_menu { margin-left: 5%; }
.saigai_link_menu h4 { 
	width: 92px;
	margin-right: 5%;
	padding-bottom: 0;
}
.saigai_link_btn { margin-right: 5%;}
}