/* */
:root {
  --m-color: #0080ff;
  --m-width: 96rem;
}

body {font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;color:#444;}

/* CSS Remedy */
*,::after,::before{box-sizing:border-box}html{line-sizing:normal}body{margin:0}[hidden]{display:none}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.17rem}h4{font-size:1rem}h5{font-size:.83rem}h6{font-size:.67rem}h1{margin:.67em 0}pre{white-space:pre-wrap}hr{border-style:solid;border-width:1px 0 0;color:inherit;height:0;overflow:visible}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle;max-width:100%}audio:not([controls]){display:none}picture{display:contents}source{display:none}canvas,img,svg,video{height:auto}audio{width:100%}img{border-style:none}svg{overflow:hidden}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}

header{
  background: url(https://c5x8lj5g.user.webaccel.jp/images/bg_header.gif) repeat-x scroll 0 0;
  overflow: hidden;
  height: 150px;
}
header>div#header_div{
  width: var(--m-width);
  margin: 0 auto;
}
header>div#header_div h1{
  padding-top: 2rem;
  margin: 0;
}
main{
  background: url(https://c5x8lj5g.user.webaccel.jp/images/bg_water.jpg) no-repeat scroll 0 0;
  background-position: center top;
  overflow: hidden;
  min-height: 27rem;
}
main>section{
  width: var(--m-width);
  margin: 0 auto;
}

footer{
  background: url(https://c5x8lj5g.user.webaccel.jp/images/bg_footer.gif) no-repeat scroll 0 0;
  background-position: center top;
  overflow: hidden;
  height: 150px;
}
footer>section{
  width: var(--m-width);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
footer>section>div{
  margin-top: 1.0rem;
}
footer div#footer_info>dl{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 0.5rem;
}
footer div#footer_info>dl>dt{
  font-size: 1.2rem;
  font-weight: 600;
}
footer div#footer_info>div{
  font-size: 0.9rem;
  margin-bottom: 0.2rem;
}
footer>section div#footer_info{
  
}
div#copyright{
  background-color: var(--m-color);
  margin-top: 1.5rem;
}
div#copyright>div{
  color: #fff;
  width: var(--m-width);
  margin: 0 auto;
  padding: 0.5rem 0;
  font-size: 0.8rem;
}
#emergency{
  background-color: #ffd082;
  padding: 0.5rem 1rem;
  border: 1px solid #ff7a29;
  border-radius: 3px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: row;
}
#emergency>h2{
  background-image: url("https://c5x8lj5g.user.webaccel.jp/images/ttl_emergency.gif");
  background-repeat: no-repeat;
  text-indent: -10000em;
  width: 82px;
}
#emergency>div{
  width: calc(100% - 90px);
}
#eme_lists{
  background-color: #FFF;
  margin: 1rem 1rem;
}
#eme_lists ul{
  padding: 0.5rem 1rem;
}
#eme_lists li{
  list-style: none;
}
#eme_lists img{
  width: auto;
  height: auto;
  max-width: 300px;
}
#eme_lists a.eme_pdf{
	background-image: url(https://c5x8lj5g.user.webaccel.jp/images/icon_pdf.png);
	background-repeat: no-repeat;
	background-size: 35%;
	display: inline-block;
	padding: 1.5rem 1rem 1.5rem 5rem;
	border: 2px solid #fb483a;
	background-position: 0.5rem center;
	border-radius: 10px;
	color: #fb483a;
	font-weight: 600;
}

#eme_lists li>p{

  cursor: pointer;
  padding: 0;
  margin: 5px 10px;
  border-bottom: dotted 1px #999;
  position: relative;
  display: flex;
}
#eme_lists li>p>span:nth-child(1){
  min-width: 195px;
}
#eme_lists li>p>span:nth-child(2){
  max-width: calc(100% - 225px);
  word-wrap: break-word;
}
#eme_lists li>p:after{
  position: absolute;
  width: 16px;
  height: 16px;
  content: " ";
  background-image: url(https://c5x8lj5g.user.webaccel.jp/images/icon_triangle.png);
  rotate: 90deg;
  background-size: contain;
  background-repeat: no-repeat;
  right: 0.5rem;
  top: 0.2rem;
}
#eme_lists li>p.active:after{
  rotate: -90deg;
}

#eme_lists li p span.eme_date{
    font-size: 100%;
}
#eme_lists li p span.eme_ttl{
    font-size: 120%;
    padding: 0 0 0 1.5rem;
    text-decoration: underline;
}
#eme_lists div.eme_b_div{
  display: none;
  border: 1px solid #aaa;
  border-radius: 3px;
  padding: 0.5rem 1rem;
  margin: 0 1rem;
}
#eme_lists div.eme_b_div h3.b_ttl{
    margin: 0.5rem 0 0.5rem;
    border: 1px solid #999;
    border-radius: 3px;
    padding: 0.3rem 1rem;
    background: linear-gradient(180deg, #ffffff 0%, #ffffff 50%, #f4f4f4 50%, #f4f4f4 100%);
    word-wrap: break-word;
}
#eme_lists div.eme_b_div .b_date{
  text-align: right;
  font-size: 80%;
}
#eme_lists>h3{
  padding: 1rem 2rem;
}
#topmsg{
  margin: 0 auto 2rem;
  text-align: center;
}
#topmsg>h2{
  font-size: 180%;
  display: inline-block;
  background: linear-gradient(180deg, #ffffff 0%, #ffffff 55%, #d9e9fc 80%, #d9e9fc 100%);
  padding: 1rem 5rem;
  border: 1px solid var(--m-color);
  border-radius: 5px;
  position: relative;
  line-height: 4rem;
}
#topmsg>h2:before{
  content: " ";
  width: 59px;
  height: 90px;
  /* background-image: url(https://c5x8lj5g.user.webaccel.jp/images/top_bn_01.png); */
  background-image: url(https://c5x8lj5g.user.webaccel.jp/images/top_bn_02_suu.png);
  position: absolute;
  top: 0.2rem;
  left: 0.5rem;
  background-size: contain;
  background-repeat: no-repeat;
}
#topmsg>h2:after{
  content: " ";
  width: 59px;
  height: 90px;
  /* background-image: url(https://c5x8lj5g.user.webaccel.jp/images/top_bn_02.png); */
  background-image: url(https://c5x8lj5g.user.webaccel.jp/images/top_bn_02_miruru.png); 
  position: absolute;
  top: 0.2rem;
  right: 0.5rem;
  background-size: contain;
  background-repeat: no-repeat;
}
#topmsg>div{
  text-align: center;
}
#footer_link{
  display: flex;
}
#footer_link>div{
  margin: 1rem 0 0 2rem;
}
#footer_link ul{
  list-style: none outside;
  border-left: #2292ff 1px dotted;
}
#footer_link ul li{
  margin: 3px 0;
  background: url(https://c5x8lj5g.user.webaccel.jp/images/ico_f_link.gif) no-repeat scroll 0 7px;
  padding: 2px 0 2px 15px;
}
#footer_link ul li a{
  color: #333;
  font-size: 14px;
}
#footer_link ul li.cityhall a{
  background: url(https://c5x8lj5g.user.webaccel.jp/images/ico_kumamotocity.png) no-repeat;
  padding: 1px 0 1px 25px;
  background-position: left center;
}

@media screen and (max-width: var(--m-width)) {
  header>div#header_div,
  main>section,
  footer>section,footer>section>div#copyright{
    width: 100%;
    margin: 0 auto;
  }
}
@media screen and (max-width:1550px) {
	main>section ,
  footer>section,
  div#copyright>div {
		width:100%;
	}
}
@media screen and (max-width:600px) {
  #emergency{
    flex-direction: column;
  }
  #emergency>h2{
    margin-bottom: 0;
  }
  #emergency>div{
    width: 100%;
  }
  #eme_lists li>p {
    flex-direction: column;
  }
  #eme_lists li p span.eme_ttl{
    padding-left: 0;
    max-width: calc(100% - 30px);
  }
  
  footer div#footer_info>dl>dt{
  	min-width:160px;
  }
  
}