@charset "utf-8";

/* ===================================================================
CSS information

 File Name  : home.css
=================================================================== */

#contents h2{
  padding: 8px 0 5px 20px;
  border: 1px solid #ddd;
  border-radius: 5px 5px 0 0;
  background: url("../images/common/titleBg01.gif") repeat-x left bottom;
}


/* 同報無線通報内容
---------------------------*/
#musen{
  padding-bottom: 10px;
}
#musen h2{
  border-bottom: 3px solid #0b711d;
}
#musen dl{
  padding: 0 10px;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
  line-height: 1.2;

  overflow: auto;
  max-height: 23em;
  height: expression(this.offsetHeight > 300 ? "300px" : auto);
}
#musen dl dt{
  padding: 10px 0 3px 28px;
  float: left;
  background: url("../images/common/list06.gif") no-repeat 10px 0.75em;
}
#musen dl dd{
  padding: 10px 0 3px 7.7em;
  border-bottom: 1px dashed #ccc;
}
/* 日付
------------------------*/
#musen .date{
  display: block;
  float: left;
  width: 2.5em;
  text-align:right;
}




/* 新着情報
---------------------------*/
#news{
  padding-bottom: 10px;
}
#news h2{
  border-bottom: 3px solid #2a72bd;
}
#news dl{
  padding: 0 10px;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
  line-height: 1.2;

  overflow: auto;
  max-height: 23em;
  height: expression(this.offsetHeight > 300 ? "300px" : auto);
}
#news dl dt{
  padding: 10px 0 3px 28px;
  float: left;
  background: url("../images/common/list02.gif") no-repeat 10px 0.75em;
}
#news dl dd{
  padding: 10px 0 3px 7.7em;
  border-bottom: 1px dashed #ccc;
}
/* 日付
------------------------*/
#news .date{
  display: block;
  float: left;
  width: 2.5em;
  text-align:right;
}

/* Google Translate*/
html.translated-ltr #news dl dt,
html.translated-ltr #musen dl dt{
  float: none;
}
html.translated-ltr #news dl dt .date,
html.translated-ltr #musen dl dt .date{
  width: auto;
  float: none;
  display: inline;
  text-align: left;
}
html.translated-ltr #news dl dd,
html.translated-ltr #musen dl dd{
  padding: 0 0 5px 28px;
}

/* くらしの情報
---------------------------*/
#lifeInfo{
  padding-bottom: 10px;
}
#lifeInfo h2{
  border-bottom: 3px solid #ebac33;
}
#lifeInfo ul{
  padding: 5px 0 0 5px;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
  overflow: hidden;
  _zoom: 1;
}
#lifeInfo ul li{
  margin: 5px 5px 0 0;
  float: left;
  _display: inline;
}
#lifeInfo ul li img{vertical-align: bottom;}

/* 広告欄
---------------------------*/
#koukoku{
  position: relative;
}
#koukoku h2{
  border-bottom: 3px solid #666;
}
#koukoku ul{
  padding: 0 0 0 10px;
  overflow: hidden;
  _zoom: 1;
}
#koukoku ul li{
  margin: 5px 5px 0 0;
  float: left;
  overflow: hidden;
  height: 60px;
  width: 120px;
}
#koukoku ul li img{vertical-align: bottom;}
#koukoku p{
  margin-top: 10px;
  padding: 0 70px;
  text-align: center;
  color: #666;
  font-size: 93%;
}
#koukoku p{}
#koukoku div{
  position: absolute;
  top: 18px;
  right: 10px;
}
#koukoku div a{
  padding-left: 16px;
  background: url("../images/common/list03.gif") no-repeat left center;
  font-size: 93%;
}
/* leftSide
---------------------------------------*/
/*- 長泉町の人口・世帯部 -*/
#toukei{
  margin-bottom: 10px;
  padding: 2px;
  border: 1px solid #ccc;
}
#toukei h2{
  margin-bottom: 2px;
}
#toukei dl{
  padding-top: 5px;
  overflow: hidden;
  _zoom: 1;
}
#toukei dl dt{
  padding: 5px 0 0 5px;
  width: 70px;
  float: left;
  text-align: right;
}
#toukei dl dd{
  padding-left: 72px;
  color: #0071bc;
  font-size: 182%;
  font-weight: bold;
  letter-spacing: 0;
}
#toukei dl dd img{
  padding: 5px 0 0 5px;
}
#toukei p{
  padding: 5px 0 0 5px;
}
#zinkou{
  border-top: 1px dotted #999;
}
#setaisu{
  border-bottom: 1px dotted #999;
}

/*- 緊急のリンク部 -*/
#linkKinkyu{
  margin-bottom: 10px;
  padding: 5px 0 10px 10px;
  border-radius: 5px;
  background-color: #def0f2;
}
#linkKinkyu li{
  margin-top: 5px;
}
#kinkyu01{background: url("../images/home/btnKyouryokuiOn.png") no-repeat left top;}
#kinkyu02{background: url("../images/home/btnBousaiInfoOn.png") no-repeat left top;}

/*- 開庁時間のご案内部 -*/
#openInfo{
  margin-bottom: 10px;
}
/*- 広報ながいずみ部 -*/
#kouhouInfo{
  margin-bottom: 10px;
  padding: 5px;
  border: 1px solid #91d9ff;
  border-radius: 5px;

  overflow: hidden;
  _zoom: 1;
}
#kouhouInfo h2{
  margin-bottom: 5px;
}
#kouhouInfo div{
  padding: 0 5px 0 0;
  float: left;
  width: 128px;
  font-size: 93%;
  line-height: 1.2;
}
#kouhouInfo div ul{
  padding: 8px 0;
}
#kouhouInfo div ul li{
  padding: 0.2em 0 2px 20px;
  background: url("../images/common/list01s.gif") no-repeat 3px 0.3em;
}
#kouhouInfo div p{}

/*- ボタン群 -*/
#homeNavi{
  margin-bottom: 10px;
}
#homeNavi li{}
#homeNavi li img{vertical-align: bottom;}

/*- QRコード -*/
#qr{}
#qr h2{}
#qr div{
  padding: 8px 5px;
  overflow: hidden;
  _zoom: 1;
}
#qr div p{
  float: left;
  width: 120px;
  font-size: 93%;
  letter-spacing: 0;
}
#qr div img{float: right;}

/*- 緊急連絡お知らせ -*/
#attention{
  margin: 5px 0 15px;
  padding: 10px;
  background: url("../images/common/attentionBg.gif");
}
#attentionInner{
  padding: 5px 20px;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}
#attention h2{}
#attention dl{
  margin: 5px 0 0;
  overflow: hidden;
  _zoom: 1;
}
#attention dl dt{
  padding: 5px 20px 0 10px;
  float: left;
  width: 5em;
  background: url("../images/common/list05.gif") no-repeat 98% 0.7em;;
}
#attention dl dd{
  padding: 5px 0 3px 8em;
  border-bottom: 1px dashed #999;
}

/*- 同報無線通報内容 -*/
div.musendetail{
  margin: 5px 0 15px !important;
  padding: 10px !important;
  background: url("../images/common/musenBg.gif") !important;
}
#musenInner{
  padding: 5px 20px;
  border: 1px solid #ccc;
  background-color: #f0f0f0;
}

.spGuide{
  text-align: center;
}
.spGuide a{
  padding: 10px 0;
  border: solid 1px #356aa0;
  color: #fff !important;
  display: block;
  text-decoration: none;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
  font-size: 24px;
  background-color: #28517a;
  background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #28517a), color-stop(40%, #356aa0), color-stop(100%, #3b77b3));
  background-image: -webkit-linear-gradient(bottom, #28517a, #356aa0 40%, #3b77b3);
  background-image: -moz-linear-gradient(bottom, #28517a, #356aa0 40%, #3b77b3);
  background-image: -o-linear-gradient(bottom, #28517a, #356aa0 40%, #3b77b3);
  background-image: linear-gradient(bottom, #28517a, #356aa0 40%, #3b77b3);
  box-shadow: inset 0 0 7px rgba(255, 255, 255, 0.4);
}
.spGuide a:hover{
  box-shadow: inset 0 0 5px 3px rgba(255, 255, 255, 0.4);
}
