@charset "euc-jp";
/*=========================================================================================================

File Name:	r-common.css
Style Info:	デバイス別 共通スタイル

==========================================================================================================*/


/* -----Javascript Disabled-------------------- */
div.jvd div#navigation{ display:block; }
div.jvd p#mobile-navi{ display:none;}
div.jvd div#tools{ display:none;}
div.jvd ul.accordion ul{ display:block; }
div.jvd div#photogallery{ width:100%;}
div.jvd div.navigation{ width:100%;}
div.jvd div#navigationInner{ display:block;}
div.jvd ul#list-safe, div.jvd ul#list-hayabiki, div.jvd ul#list-lifeguide{ display:block;}
div.jvd h2#title-news, div.jvd h2#title-oshirase, div.jvd h2#title-event{ position:static;}
div.jvd div#content-news, div.jvd div#content-oshirase, div.jvd div#content-event{ display:block;}


  div.jvd div#headerInner{ width:960px; margin:0 auto; height:116px; background:#FFFFFF url(../images/bg_header.gif) no-repeat bottom center;}
  div.jvd div#navigationInner{ width:960px; margin:0 auto;}
  div.jvd div#life-navigationInner{ width:960px; margin:0 auto;}
  div.jvd div#topcontentInner{ width:960px; margin:0 auto; background:#F5EFE4;}
  div.jvd div#contentInner{ width:960px; margin:0 auto;}


/*==================================================================================================================================================
@group body,共通パーツ,各レイアウトボックス
==================================================================================================================================================*/

body{ padding:0; }

div#header{ background:#FFF; width:150px; float:left;}
div#content{ width:100%;}
  div#main-column{ margin:0;}
  div#side-column{ margin:0;}

    
.backBtn{ display:none;}
.title-common{ background:url(../images/bg_title_common.gif) repeat-x bottom left; padding:8px 5px 4px;}
.title-common img{ max-width:100%;}



  div#header{ width:100%; float:none;}
  div#content{ width:100%;}
  /*--トップページ--*/
    div.top div#side-column{ width:288px; float:left; clear:none; margin-right:-288px; position:relative; z-index:99999;}
    div.top div#main-column{ width:100%; float:right;}
      div.top div#main-columnInner{ margin-left:288px;}
        div.top div#content-main-column{ padding:20px 0 20px 20px;}
  div#headerInner{ width:100%;}
  div#navigationInner{ width:100%; margin:0 auto;}
  div#life-navigationInner{ width:100%; margin:0 auto;}
  div#topcontentInner{ width:100%; margin:0 auto; background:#F5EFE4;}
  div#contentInner{ width:100%; margin:0 auto;}
  div#footerInner{ width:100%; margin:0 auto;}
  /*--第二階層--*/
    div.second div#main{ position:relative;}
    div.second div#side-column{ width:220px; float:left; clear:none; margin-top:130px; margin-right:-220px; position:relative; z-index:99999;}
    div.second div#main-column{ width:100%; float:right;}
      div.second div#main-columnInner{ margin-left:220px;}
        div.second div#content-main-column{ padding:5px 0 20px 20px;}
  div#header{ width:100%;}
  div#navigation{ width:100%; background:#FFDE79;}
  div#life-navigation{ width:100%; background:#FFFFFF;}
  div#search-topWrap{ width:960px; margin:0 auto;}
  div#topcontent{ width:100%; background:#EFE6D5;}
  
  
  div#headerInner{ width:960px; margin:0 auto; height:116px; background:#FFFFFF url(../images/bg_header.gif) no-repeat bottom center;}
  div#navigationInner{ width:960px; margin:0 auto;}
  div#life-navigationInner{ width:960px; margin:0 auto;}
  div#topcontentInner{ width:960px; margin:0 auto; background:#F5EFE4;}
  div#contentInner{ width:960px; margin:0 auto;}
  div#footerInner{ width:960px; margin:0 auto;}


/*==================================================================================================================================================
@group ヘッダー
==================================================================================================================================================*/

/* -----サイトロゴ-------------------- */
h1#siteID{ width:150px;}
h1#siteID a{ display:block; width:150px; height:51px;}
h1#siteID img{ max-width:100%;}
  h1#siteID{ width:205px; padding:10px; margin-right:-225px; float:left; position:relative; z-index:99999;}
  h1#siteID a{ display:block; width:205px; height:70px;}

/* -----文字サイズ変更・翻訳ツール-------------------- */
div#tools{ display:none;}
div#tools img{ max-width:100%;}

  div#header-content{ width:100%; float:right;}
  div#header-contentInner{
    display:block;
    margin-right:10px;
    margin-left:245px;
    height:90px;
    background-image:url(../images/bg_header.gif);
    background-repeat:no-repeat;
    background-size:contain;
    background-position:bottom right;
  }
  div#tools{
    display:block;
    float:right;
    width:100%;
    max-width:401px;
    padding:5px 0;
    background:#F5EFE4;
    border-radius:5px;
    margin-top:20px;
  }
  /* -----文字サイズ-------------------- */
  div#fontctl{ width:41%; float:left; max-width:168px;}
  div#fontctl p{ width:50%; float:left; max-width:85px;}
  div#fontctl li{ width:14%; float:left; max-width:23px;}
  div#fontctl li a{ display:block; margin-left:2px;}
  
  /* -----翻訳-------------------- */
  div#langctl{ width:59%; float:left; max-width:237px;}
  div#langctl ul{ border-right:1px solid #FFF; border-left:1px solid #FFF;}
  div#langctl ul:after{ content:""; clear:both; display:block;}
  div#langctl li{ float:left;}
  li.lang01{ width:25%; max-width:60px;}
  li.lang02{ width:30%; max-width:68px;}
  li.lang03{ width:20%; max-width:47px;}
  li.lang04{ width:25%; max-width:60px;}
  div#langctl li a{ display:block;}
  
  /* -----コントラスト-------------------- */
  div#contrast{ width:29%; float:left; max-width:168px;}
  div#contrast p{ width:50%; float:left; max-width:85px;}
  div#contrast li{ width:14%; float:left; max-width:23px;}
  div#contrast li a{ display:block; margin-left:2px;}
  div#header-contentInner{ background:none;}

/* -----スマートフォン用コンテンツナビ-------------------- */
p#mobile-navi{ color:#000; height:40px; width:40px; float:right; padding:6px;}
a#mobile-btn{ display:block;}

/* -----グローバルナビゲーション-------------------- */
div#navigationInner{ display:none; background:#FFDE79; padding-bottom:5px; clear:both;}
ul#gmenulist li{ text-align:center;  float:left;}
ul#gmenulist li a{ display:block; text-align:center;}
ul#gmenulist li span{ display:block; padding:0px 4px;}
ul#gmenulist li img{ max-width: 100%;}


  div#navigation{clear:both;}
  p#mobile-navi{ display:none;}
  div#navigationInner{ display:block; padding:10px 0 10px;}
  ul#gmenulist li{ width:14%; border-right:1px solid #FFB359;}
  ul#gmenulist li#gnavi06{ width:14%;}
  ul#gmenulist li#gnavi07{ width:15%; border-right:none;}
  ul#gmenulist li a{ margin:0;}


/*==================================================================================================================================================
@group 簡単検索ボックス：安心・安全、早引きインデックス、市民生活ガイド
==================================================================================================================================================*/

div#life-navigation img{ max-width:100%;}
h2.title-life-navigation{ text-align:center; padding:10px 0 5px;}
ul#list-safe,
ul#list-hayabiki,
ul#list-lifeguide{ display:none;}
ul.list-life-navigation li{
  width:33%;
  float:left;
  text-align:center;
  background:url(../images/border_dotted_lifenavi.gif) no-repeat right center;
}
ul.list-life-navigation a{
  display:block;
  margin:1px;
  padding:3px;
  background:url(../images/border_x_dotted_lifenavi.gif) no-repeat top center;
}
ul.list-life-navigation li img{ max-width:100%;}


  div#life-navigation{ display:block; padding:0 0 10px;}
  div#life-navigationInner{ display:block;}
  div#safe{ width: 30%; float:left;}
  div#hayabiki{ width: 40%; float:left; background:url(../images/dot_y_2px.gif) repeat-y left top;}
  div#lifeguide{ width: 30%; float:right; background:url(../images/dot_y_2px.gif) repeat-y left top;}
  div#lifeguideInner{ margin-left:1px;}
  ul#list-safe,
  ul#list-hayabiki,
  ul#list-lifeguide{ display:block;}
  ul.list-life-navigation li{ width:33%;}
  div#hayabiki ul.list-life-navigation li{ width:25%;}
  ul.list-life-navigation a{ padding:1px;}
  ul.list-life-navigation li img{ width:90px;}
  
  h2.title-life-navigation a.btn-life-navi{ display:none;}
  
  div#safe ul.list-life-navigation li.lnavi03,
  div#safe ul.list-life-navigation li.lnavi06,
  div#hayabiki ul.list-life-navigation li.lnavi04,
  div#hayabiki ul.list-life-navigation li.lnavi08,
  div#lifeguide ul.list-life-navigation li.lnavi03,
  div#lifeguide ul.list-life-navigation li.lnavi06{ background:none;}
  
  div#safe ul.list-life-navigation li.lnavi01 a,
  div#safe ul.list-life-navigation li.lnavi02 a,
  div#safe ul.list-life-navigation li.lnavi03 a,
  div#hayabiki ul.list-life-navigation li.lnavi01 a,
  div#hayabiki ul.list-life-navigation li.lnavi02 a,
  div#hayabiki ul.list-life-navigation li.lnavi03 a,
  div#hayabiki ul.list-life-navigation li.lnavi04 a,
  div#lifeguide ul.list-life-navigation li.lnavi01 a,
  div#lifeguide ul.list-life-navigation li.lnavi02 a,
  div#lifeguide ul.list-life-navigation li.lnavi03 a{ background:none;}
  div#life-navigationInner{ background:url(../images/dot_y_2px.gif) repeat-y right top;}
  div#safe{ width: 288px; background:url(../images/dot_y_2px.gif) repeat-y left top;}
  div#hayabiki{ width: 384px;}
  div#lifeguide{ width: 288px;}
  div#lifeguideInner{ margin-left:0;}
  ul.list-life-navigation li{ width:96px;}
  ul.list-life-navigation a{ padding:1px;}
  ul.list-life-navigation li img{ width:90px;}



/*==================================================================================================================================================
@group キーワード検索ボックス
==================================================================================================================================================*/

/* -----検索ボックス：トップページ用-------------------- */
div#search-top{ clear:both; padding:10px; background:#FFDE79;}
div#search-top img{ max-width:100%;}

div#search-top h2{ width:100px; float:left;}
div#search-top div#inputBoxWrapper{ width:100%; float:right;}
div#search-top div#inputBox{}

div#search-top div#search-formWrap{ width:100%; float:left;}
div#search-top div#inputBox p#search-form{ padding:0 0 0 5px; margin-right:64px;}
div#search-top div#inputBox p#search-form input{ width:100%; border:1px solid #FFB359; line-height:1.5em; height:22px;}
div#search-top p#submit-btn{ padding:0; text-align:right; float:right; margin-left:-64px; width:50px; padding:0 7px; background:#FE9E1A;}
div#search-top p#submit-btn input{ max-width:100%;}

  div#search-top h2{  margin-right:-100px}
  div#search-top div#inputBox{ margin-left:100px;}
  div#search-top{ padding:5px;}
  div#search-top h2{ width:134px; background:url(../images/bg_title_search.gif) no-repeat left center; padding-left:30px; margin-right:-164px}
  div#search-top div#inputBox{ margin-left:164px;}
  div#search-top div#inputBox p#search-form{ margin-right:89px; padding-top:0px;}
  div#search-top p#submit-btn{ padding:0 20px; width:46px; border-bottom:4px solid #B96806; margin-left:-96px; margin-top:0px;}
  div#search-top div#search-top{ padding:10px;}
  div#search-top div#inputBox p#search-form{ margin-right:96px; padding-top:0px;}
  div#search-top p#submit-btn{ padding:0 20px; width:46px; border-bottom:4px solid #B96806; margin-left:-96px; margin-top:0px;}
  div#search-top{ padding:10px 15px;  margin:0 auto;}


/* -----検索ボックス：共通ページ用-------------------- */
div#search-second{ clear:both; padding:10px; background:#FFDE79;}
div#search-second img{ max-width:100%;}

div#search-second h2{ width:80px; float:left; margin-right:-80px; padding:5px 0;}
div#search-second div#inputBoxWrapper{ width:100%; float:right;}
div#search-second div#inputBox{ margin-left:80px;}

div#search-second div#search-formWrap{ width:100%; float:left;}
div#search-second div#inputBox p#search-form{ padding:0 0 0 5px; margin-right:64px;}
div#search-second div#inputBox p#search-form input{ width:100%; border:1px solid #FFB359; line-height:1.5em; height:22px;}
div#search-second p#submit-btn{ padding:0; text-align:right; float:right; margin-left:-64px; width:50px; padding:0 7px; background:#FE9E1A;}
div#search-second p#submit-btn input{ max-width:100%;}

  div#search-second{ padding:5px;}
  div#search-second h2{ width:109px; background:url(../images/bg_title_second_search.gif) no-repeat left center; padding-left:20px; margin-right:-129px}
  div#search-second div#inputBox{ margin-left:135px;}
  div#search-second div#inputBox p#search-form{ margin-right:70px; padding-top:4px;}
  div#search-second p#submit-btn{ padding:0 10px; width:55px; border-bottom:4px solid #B96806; margin-left:-89px; margin-top:2px;}
  div#search-secondWrap{ position:absolute; top:0; left:0; width:220px; padding-top:20px;}
  div#search-second{ padding:0px;}
  div#search-second h2{ margin-right:0;}
  div#search-second div#inputBox{ margin-left:0;}
  div#search-second div#inputBox p#search-form{ margin:0; padding:0 0 5px;}
  div#search-second p#submit-btn{ float:none; clear:both; margin:10px auto;}
  div#search-second div#inputBox p#search-form input{ width:90%; margin:0 auto; display:block;}


/*==================================================================================================================================================
@group 左サイド
==================================================================================================================================================*/

/* -----Facebookページ-------------------- */
div#fb{ clear:both;}
h2#title-fb{ background:url(../images/bg_title_fb.gif) repeat-x bottom left; padding-bottom:3px;}
h2#title-fb img{ max-width:100%;}

div.fbbanner{ text-align:center; padding-bottom:20px;}





/* -----広報あらお-------------------- */
p#kouhou-content{ border:1px solid #DFD0B9; margin:5px; background:url(../images/bg_magazine.jpg) no-repeat right center;}
p#kouhou-content a{ display:block;}

  /*--第二階層--*/
  div.second div#kouhou{ width:33%; float:left;}
  div.second div#kouhouInner{ margin:0 5px;}
  /*--第二階層--*/
  div.second div#kouhou{ width:100%; float:none; clear:both;}
  div.second div#kouhouInner{ margin:0px;}


/* -----市長室・市議会-------------------- */
div#sonota{ margin-top:20px; margin-bottom:10px;}
li#sntnavi-l01,li#sntnavi-l02{ float:left; width:100%; height:40px;}
li#sntnavi-l01 a,li#sntnavi-l02 a{}
li#sntnavi-l01{ width:100%; background:url(../images/bg_btn_mayor.jpg) no-repeat right center;}
li#sntnavi-l02{ width:100%; background:url(../images/bg_btn_gikai.jpg) no-repeat right center;}
li#sntnavi-l01{ width:50%; margin-bottom:10px; background:url(../images/bg_btn_mayor.jpg) no-repeat right top;}
li#sntnavi-l01 a{ display:block; margin:0 5px;}
li#sntnavi-l01 a span{ display:block; border-bottom:2px solid #997437;}
li#sntnavi-l02{ width:50%; background:url(../images/bg_btn_gikai.jpg) no-repeat right top;}
li#sntnavi-l02 a{ display:block; margin:0 5px;}
li#sntnavi-l02 a span{ display:block; border-bottom:2px solid #997437;}
li#sntnavi-l01{ }
li#sntnavi-l02{ }
li#sntnavi-l01{ }
li#sntnavi-l02{ }
li#sntnavi-l01{ }
li#sntnavi-l02{ }
li#sntnavi-l01{ width:100%;}
li#sntnavi-l01 a span{ border-bottom:none;}
li#sntnavi-l02{ width:100%;}
li#sntnavi-l02 a span{ border-bottom:none;}


/* -----市政に参加するメニュー-------------------- */
ul#shisei-list li{ width:100%;}
ul#shisei-list a{ display:block; margin:5px;}
ul#shisei-list img{ display:block; max-width:100%;}

  ul#shisei-list li{ width:50%; float:left;}
  ul#shisei-list img{ max-width:130px;}
  ul#shisei-list img{ max-width:100%;}
  div#shisei{ padding-bottom:20px;}
  ul#shisei-list li{ width:33%;}
  ul#shisei-list img{ max-width:130px;}
  div.top ul#shisei-list li{ width:100%;}
  div.second ul#shisei-list li{ width:33%;}
  ul#shisei-list img{ max-width:120px;}
  /*--第二階層--*/
  div.second div#shisei{ width:100%; float:left;}
  div.second div#shiseiInner{ margin:0 5px;}
  div.second ul#shisei-list li{ width:33%;}
  div.second ul#shisei-list img{ max-width:140px;}
  /*--トップページ--*/
  div.top div#shisei{ width:100%; float:none; clear:both;}
  div.top div#shiseiInner{ margin:0;}
  div.top ul#shisei-list li{ width:100%;}
  div.top ul#shisei-list img{ max-width:163px;}
  /*--第二階層--*/
  div.second div#shisei{ width:100%; float:none; clear:both;}
  div.second div#shiseiInner{ margin:0;}
  div.second ul#shisei-list li{ width:100%;}
  div.second ul#shisei-list img{ max-width:163px;}

/* -----人口情報-------------------- */
div#population{ clear:both;}
div#population-content{ padding:15px;}
div#population-content li{ display:inline-block;}

  /*--第二階層--*/
  div.second div#population{ clear:none; width:33%; float:left;}
  div.second div#populationInner{ margin:0 5px;}
  div.second div#population-content li{ display:block;}
  div.second div#population{ clear:both; width:100%; float:none;}
  div.second div#populationInner{ margin:0;}



/*==================================================================================================================================================
@group 広告欄
==================================================================================================================================================*/

div#ad-column{ clear:both; padding-bottom:20px;}
h2#title-ad span{ display:block; padding:10px; background:#FFDE79; text-align:center;}
div#content-ad-column{ background:#FFEEBC;}
div#content-ad-columnInner{ padding:10px;}
div#ad-column ul li{ width:33%; float:left; max-width:145px;}
div#ad-column ul li a{ display:block; padding:2px; max-width:160px;}
div#ad-column ul li a img{ max-width:100%;}

  div#ad-column ul li{ width:20%;}
  h2#title-ad{ width:140px; float:left; margin-right:-140px; position:relative; z-index:99999;}
  div#content-ad-column{ width:100%; float:right; background:url(../images/bg_ad.gif) repeat-y top left #FFEEBC;}
  div#content-ad-columnInner{ margin-left:140px;}
  h2#title-ad{ padding-top:15px;}
  div#ad-column ul li{ width:16.5%;}


/*==================================================================================================================================================
@group フッター
==================================================================================================================================================*/

div#footer{ padding:0; font-size:smaller; line-height:1.4em; background:#FFDE79;}
div#footerNav{ padding:10px 10px 5px; background:#FFEEBC; margin:0;}
div#footerNav ul{ text-align:center;}
div#footerNav ul li{ padding:0; display:inline-block;}
div#footerNav ul li a{ display:block;}

div#footer-content{ padding:15px; min-height:120px;}
strong#fc-sitename{ display:block; padding-bottom:10px;}
address span{ display:block; line-height:1.75}

  div#footer-content{ padding:15px 130px 15px 15px; background:url(../images/bg_footer.gif) no-repeat right center;}
  div#footer{ font-size:100%;}
  span#fc-text-note{ display:block; text-indent:4em;}


p#copy{
  clear:both;
  font-size:78%;
  text-align:center;
  border-top:2px solid #D4D0C8;
  word-wrap:break-word;
  padding:10px 0;
  background:#402000;
  color:#FFFFFF;
}

  p#copy{ font-size:100%;}