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

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

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


/* Javascript Disabled */
div.jvd #fontsize{ display:none;}
div.jvd div#pagetype span.backbtn{ display:none;}
body div.jvd #cate-gmap{ display:none;}
body div.jvd #gmap{ display:none;}

/*
div.jvd div#topevent{ display:none;}
div.jvd div#tslider_switcher{ display:none;}
*/
/*==================================================================================================================================================
@group body,共通パーツ,各レイアウトボックス
==================================================================================================================================================*/

body{ padding:0px; font-size:90%;}
img.fluid-image { max-width: 100%;}
#content{
  width:100%;
}
.u-visuallyHidden{
  position: absolute;
  white-space: nowrap;
  width: 1px;
  height: 1px;
  overflow: hidden;
  border: 0;
  padding: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
          clip-path: inset(50%);
}
/* #main  -----------------  */
#main{
  padding:0;
}
  /* main-column ---------- */
  #main-column{
    padding:10px 0;
  }
  /* side-column ---------- */
  #side-column{
    padding-top:10px;
    padding-bottom:10px;
    position:relative;
    z-index:999;
  }
  #page-side-column{
    clear:both;
    padding-top:10px;
    padding-bottom:10px;
    position:relative;
    z-index:999;
  }
#sub{
  clear:both;
  text-align:left;
}
div.page-sub{ display:none;}

@media screen and (min-width: 768px){

  div.content-k{ background:url(../images/logo_kumamon.jpg) no-repeat left top;}
  ul.sideNav-k{ padding-top:164px;}
  div.wrapper-k div#content{ background:url(../images/logo_kumamon.jpg) no-repeat left top;}
  div.wrapper-k div#page-side-column{ padding-top:164px;}

  body{ padding:0px; font-size:90%;}
  #header{ width:100%;}

  #main{ width:100%; position:relative;}

  #main-column{ width:100%; float:right;}
  #main-columnInner{ margin-left:210px; padding:10px 5px 10px 5px;}

  #side-column{ width:210px; float:left; margin-right:-210px; display:block;}
  #page-side-column{ width:210px; float:left; margin-right:-210px; clear:none;}
  #side-columnInner{ padding:0 5px;}

  div#sub{ display:block;}
}
@media screen and (min-width: 960px){
  #content{
    width:100%;
    float:left;
  }
  #contentInner{
    margin-right:220px;
  }
  #sub{
    clear:none;
    width:220px;
    float:right;
    margin-left:-220px;
  }
}
/*==================================================================================================================================================
@group サイトロゴ
==================================================================================================================================================*/

h1#siteID{ width:100%; height:54px; text-align:center; padding:0px; background:url(../images/bg_logo_sp.jpg) no-repeat left top;}
h1#siteID a{
  display:block;
  height:54px;
  background:url(../images/logo_s.gif) no-repeat top center;
  width:144px;
  padding-top:0;
  margin:0 auto 0 0;
}

@media screen and (max-width: 768px){
  h1#siteID a img { position:relative; z-index:-9999;}
}
h1#siteID a img { width:53px; height:54px; display:block;}

div#topimage{ display:none;}

/* スマートフォン用ボタン */
#mobile-navi{ padding:5px; background:#C3E5FD; color:#002040; font-size:90%; height:26px;}
#mobile-navi span{ display:block; float:right; cursor:pointer;}

@media screen and (max-width: 480px){
  h1#siteID img.page-sitelogo{ width:100px; height:102px; display:inline;}
  h1#siteID a{
    overflow:hidden;
  }
}
@media screen and (min-width: 768px){
  h1#siteID{ width:205px; height:235px; float:left; padding:0; margin-right:-215px;}
  h1#siteID a{ width:205px; height:235px; display:block; background:none;}
  h1#siteID a img{ width:205px; height:235px; display:block; z-index:9999;}
  #mobile-navi{ display:none;}
}
/*==================================================================================================================================================
@group グローバルナビゲーション
==================================================================================================================================================*/

div#globalNavWrap{ display:none;}

ul#globalNav{
  padding:0;
  background:none;
}
  #globalNav li{
    width:50%;
    height:48px;
    float:left;
    text-align:center;
    padding:0 0 3px 0;
  }
  #globalNav li.gnavi01{
    width:100%;
  }
    #globalNav li a{
      display:block;
      padding:1px 3px;
      background:url(../images/bg_gnavi.jpg) repeat-x;
      border-left:1px solid #54B7FB;
      border-right:1px solid #54B7FB;
    }
    #globalNav li.gnavi02 a,
    #globalNav li.gnavi04 a{ margin-right:1px;}
    #globalNav li img{ display:inline;}

@media screen and (min-width: 480px){
  #globalNav li.gnavi01{ width:50%}
  #globalNav li.gnavi02{ width:50%}
  #globalNav li.gnavi03{ width:33%}
  #globalNav li.gnavi04{ width:34%}
  #globalNav li.gnavi05{ width:33%}
  #globalNav li.gnavi05{ background:none;}
    #globalNav li.gnavi01 a,
    #globalNav li.gnavi03 a,
    #globalNav li.gnavi04 a{ margin-right:1px;}
    #globalNav li.gnavi02 a{ margin-right:0;}
}
@media screen and (min-width: 768px){
  div#globalNavBox{ float:right; width:100%;}
  div#globalNavInner{ margin-left:215px; padding:10px 5px 10px 0; position:relative;}
  div#globalNavWrap{
    display:block;
    background:url(../images/bg_gnavi.jpg) repeat-x;
  }
    #globalNav li{
      padding:1px 0;
    }
    #globalNav li.gnavi01{
      background: url(../images/bg_gnavileft.jpg) no-repeat left;
      width:20%;
    }
    #globalNav li.gnavi02,
    #globalNav li.gnavi03,
    #globalNav li.gnavi04{ width:20%}
    #globalNav li.gnavi05{
      background: url(../images/bg_gnaviright.jpg) no-repeat right;
      width:20%;
    }
      #globalNav li a{
        padding:0 0 0 0;
        border:none;
        background:none;
      }
      #globalNav li.gnavi02 a,
      #globalNav li.gnavi03 a,
      #globalNav li.gnavi04 a{ margin-right:0px;}
}
/*==================================================================================================================================================
@group 左サイド
==================================================================================================================================================*/

div.sidebox{ clear:both; padding-top:10px;}
  div.sidebox h4{ background:url(../images/bg_title-side-column.jpg) no-repeat right top;}
  div.sideboxInner{ padding:10px 8px; border:1px solid #C4E5FD; background:#EDF7FF;}
  div.sideboxInner2{ padding:10px 8px; border:1px solid #C4E5FD; background:#FFFFFF;}/* #sub  -----------------  */

/* 人口情報 */
  dl.populationList{
    font-size:90%;
    margin: 0;
    padding: 0;
    border: #EDF7FF solid 1px;
    border-width: 0 1px 1px;
    overflow:hidden;
    background:url(../images/bg_dt_jinkou.gif) repeat-y top left #FFF;
  }
  dl.populationList dt{
    margin: 0;
    padding: 0.5em;
    border-left: none;
    border-top: #EDF7FF solid 1px;
    font-size: 100%;
    line-height: 1.6em;
    font-weight:bold;
  }
  dl.populationList dd{
    margin: -2.7em 0 0 58px;
    padding: 0.5em;
    border-left: #EDF7FF solid 1px;
    border-bottom: none;
    line-height: 1.6em;
  }



table#populationTable{ border-collapse:collapse; width:100%; font-size:90%;}
  table#populationTable th,table#populationTable td{ padding:7px; border-right:1px solid #EDF7FF; border-bottom:1px solid #EDF7FF;}
  table#populationTable th{ background:#DDDDDD; width:3.5em;}
  table#populationTable td{ background:#FFFFFF;}
p#population-desc{ text-align:center; padding:5px; font-size:80%;}
  p#population-desc span{ display:block;  text-align:left;}
  span.jinko-f{ display:inline; font-size:80%;}


div#page-side-column #population{ display:none;}

@media screen and (min-width: 480px){
  div.sidebox{ clear:both; padding-top:10px;}
  div.sidebox h4{ background:url(../images/bg_title-side-column.jpg) no-repeat right top;}
  div.sideboxInner{ padding:10px; border:1px solid #C4E5FD; background:#EDF7FF;}

  #population{ width:49%; float:right; clear:none;}
      span.jinko-f{ display:inline; font-size:80%;}
}
@media screen and (min-width: 768px){
  div#page-side-column #population{ display:block;}
  #population{ width:100%; float:none; clear:both;}
      span.jinko-f{ display:block; font-size:80%;}
}

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

.subbox{
  padding-bottom:10px;
  clear:both;
}
  h4.title-sub{ background:url(../images/bg_title-sub.jpg) no-repeat right top;}
  .subboxInner{ border-right:1px solid #B7DF9F; border-bottom:1px solid #B7DF9F; border-left:1px solid #B7DF9F; background:#F1F9EC; padding:10px 15px;}
    .subboxInner ul li{ text-align:center;}

  /* 文字サイズの変更・言語の変更 */
  #fontsize{ display:none;}
  #language{ display:none;}
  h4#title-fontsize,
  h4#title-language{
    background:url(../images/bg_sub-titlebar.jpg) no-repeat right top;
    text-align:left;
  }
  div#fontctl{ padding-bottom:10px;}
    div#fontctl ul.fc{ height:24px;}
    div#fontctl ul li{ float:right; text-align:center;}
    li#flarge{ width:33%; background:url(../images/bg_fontl.jpg) no-repeat right top;}
    li#fmedium{ width:34%; background:url(../images/bg_fontm.jpg) repeat-x left top;}
    li#fsmall{ width:33%; background:url(../images/bg_fonts.jpg) no-repeat left top;}
      a.flarge{ display:block;}
      a.fmedium{ display:block; border-right:1px solid #FFF; border-left:1px solid #FFF;}
      a.fsmall{ display:block;}

  div.languageInner{ padding-bottom:10px;}
    div.languageInner ul li{ float:left; text-align:center;}
    li.lang01{ width:33%; background:url(../images/bg_language.jpg) no-repeat right top;}
    li.lang02{ width:34%; background:url(../images/bg_language.jpg) repeat-x left top;}
    li.lang03{ width:33%; background:url(../images/bg_language.jpg) no-repeat left top;}
    li.lang04{ width:33%; background:url(../images/bg_language.jpg) no-repeat right top;}
    li.lang05{ width:34%; background:url(../images/bg_language.jpg) repeat-x left top;}
    li.lang06{ width:33%; background:url(../images/bg_language.jpg) no-repeat left top;}
    li.lang07{ width:33%; background:url(../images/bg_language.jpg) no-repeat left bottom;}
    li.lang08{ width:67%; background:url(../images/bg_language.jpg) repeat-x right bottom;}
      a.lang01{ display:block; border-bottom:1px solid #FFF;}
      a.lang02{ display:block; border-right:1px solid #FFF; border-left:1px solid #FFF; border-bottom:1px solid #FFF;}
      a.lang03{ display:block; border-bottom:1px solid #FFF;}
      a.lang04{ display:block; border-bottom:1px solid #FFF;}
      a.lang05{ display:block; border-right:1px solid #FFF; border-left:1px solid #FFF; border-bottom:1px solid #FFF;}
      a.lang06{ display:block; border-bottom:1px solid #FFF;}
      a.lang07{ display:block;}
      a.lang08{ display:block; border-left:1px solid #FFF;}


  /* 広報うき */
  h4#title-kouhou{ background:url(../images/bg_title-kouhou.jpg) no-repeat right top;}
    p#kouhou-cover{ width:100%;}
      p#kouhou-cover span#kouhou-image{ display:block; width:149px; padding:5px; background:#C7DEB6; margin:0 auto 10px;}
      p#kouhou-cover span#kouhou-link{ display:block; width:100%; border:1px solid #FFAB2D; text-align:center;}
        p#kouhou-cover span#kouhou-link a{ display:block; background:url(../images/bg_btn_kouhou_link.jpg) repeat-x;}
      p#furusatomail{ background:#FFF; padding:10px; margin:10px 0 0; text-align:center;}

      #links li{ height:43px; padding-bottom:5px;}
      #links li#umifesta{ height:76px;}
      #links li#photo-arao{ height:91px;}
      #links li#michinoeki{ height:64px;}

/* 携帯サイト */
#mobile{  display:none;}
p#mobile-qrcode{ width:80px; float:left;}


@media screen and (min-width: 480px){
  #subInner{ padding:10px 5px;}
  #fontsize-kouhouWrap{
    width:49%;
    float:left;
  }
  #fontsize{
    width:100%;
  }
  #osusume{
    width:49%;
    float:right;
    clear:none;
  }
    #osusume li{ width:100%; float:left; text-align:center;}

  #links{
    width:49%;
    float:left;
    clear:none;
  }
    #links li{ width:100%; float:left; text-align:center;}

    /* 文字サイズの変更・言語の変更 */
      div#fontctl ul li{ float:right; text-align:center;}
      li#flarge{ width:33%; background:url(../images/bg_fontl.jpg) no-repeat right top;}
      li#fmedium{ width:34%; background:url(../images/bg_fontm.jpg) repeat-x left top;}
      li#fsmall{ width:33%; background:url(../images/bg_fonts.jpg) no-repeat left top;}
        a.flarge{ display:block;}
        a.fmedium{ display:block; border-right:1px solid #FFF; border-left:1px solid #FFF;}
        a.fsmall{ display:block;}


    /* 広報うき */
    h4#title-kouhou{ background:url(../images/bg_title-kouhou.jpg) no-repeat right top;}
      p#kouhou-cover{ width:100%;}
        p#kouhou-cover span#kouhou-image{ display:block; width:149px; padding:5px; background:#C7DEB6; margin:0 auto 10px;}
        p#kouhou-cover span#kouhou-link{ display:block; width:100%; border:1px solid #FFAB2D; text-align:center;}
          p#kouhou-cover span#kouhou-link a{ display:block; background:url(../images/bg_btn_kouhou_link.jpg) repeat-x;}
        p#furusatomail{ background:#FFF; padding:10px; margin:10px 0 0; text-align:center;}

    #mobile{ width:49%; float:left; clear:none;}
}
@media screen and (min-width: 768px){

  #subInner{ padding:10px 5px;}
  #fontsize-kouhouWrap{
    width:33%;
    float:left;
  }
  #fontsize{
    width:100%;
  }
  #osusume{
    width:66%;
    float:right;
    clear:none;
  }
    #osusume li{ width:190px; float:left;}
    #osusume li a{ display:block; padding:0 5px 5px 0;}
    #osusume li img{ display:block;}

  #links{
    width:66%;
    float:right;
    clear:none;
  }
    #links li{ width:190px; float:left;}
    #links li a{ display:block; padding:0 5px 5px 0;}
    #links li img{ display:block;}

  #mobile{ width:66%; float:right; clear:none;}
    #mobile{  display:block;}
}
@media screen and (min-width: 960px){
  #subInner{ padding:10px 8px;}
  #fontsize-kouhouWrap{
    width:100%;
    float:none;
  }
  #fontsize{ padding-bottom:0; display:block;}
  #language{ padding-bottom:0; display:block;}
  #osusume,
  #links,
  #mobile{
    width:100%;
    float:none;
    clear:both;
    padding-top:0;
  }
}
/*==================================================================================================================================================
@group 広告欄
==================================================================================================================================================*/

#ad{
  clear:both;
  text-align:center;
  padding:10px;
  background:#EDF7FF;
}
  #ad li{ text-align:center;}

@media screen and (min-width: 480px){
  #ad{ margin-bottom:20px;}
  #ad li{ text-align:center; width:160px; float:left; padding-right:5px;}
}
@media screen and (min-width: 768px){
  #ad{ margin-bottom:20px;}
  #ad li{ text-align:center; width:160px; float:left; padding-right:5px;}
}
@media screen and (min-width: 960px){
  #ad ul{ max-width:825px; margin:0 auto;}
}
/*==================================================================================================================================================
@group フッター
==================================================================================================================================================*/

#footer{
  clear:both;
  border-top:5px solid #C4E5FD;
  border-bottom:5px solid #C4E5FD;
  padding:10px 0 0;
}
  h5#faddress{ text-align:center; border-bottom:1px solid #CCC; padding-bottom:5px;}
  address{ text-align:center; padding:5px 0 10px; border-bottom:1px solid #CCC; clear:both;}

  p#copy{ font-size:75%; text-align:center; color:#FFF; background:#006AB0; text-align:center;}

  ul#footer-menu{ padding:5px; margin:0; text-align:center; list-style-type:none; border-top:5px solid #C4E5FD;}
  ul#footer-menu li{ background:url(../images/bg_fmenu.gif) no-repeat left center; padding:2px 10px 0 12px; font-size:90%; float:left; margin-bottom:5px;}
  address span{ display:block;}

@media screen and (min-width: 768px){
  #footer{ padding:0; text-align:left;}
  h5#faddress{ text-align:left; border:none; padding:7px 15px 15px 15px; width:229px; float:left;}
  div#footer-content{ float:left;}
  ul#footer-menu{ text-align:left;}
  address{ padding:5px 10px 0; border:none; text-align:left; line-height:1.5em;}
  address span{ display:inline;}
  address span#txt-address{ display:block;}
  address span#txt-tel{ display:block;}
}


/*==================================================================================================================================================
@group 599以下
==================================================================================================================================================*/

@media screen and (max-width: 959px){
  div#wrapper{ font-size:115%; line-height:1.7;}
}

/*==================================================================================================================================================
@group 連携中枢都市圏情報
==================================================================================================================================================*/

.tsktitlebar{ background:url(../images/dot_2px.gif) repeat-x bottom left; margin-bottom:5px;}

#tsk-column{ padding:5px;}
#tsk-column .tsktitlebar{ height:30px; background:url(../images/bg_gradbar.jpg) repeat-x top left;}
#tsk-column .tsktitlebar h3{ background:url(../images/bg_gradbar.jpg) repeat-x top left;}
#tsk-column img{ max-width:100%;}
#tsk-column h3{ text-align:left; float:left;}

#tsk-about{ text-align:right; float:right; width:50%; padding-right:4px; background:url(../images/bg_gradend.jpg) no-repeat right top;}

#tsk-column iframe{ width:100%; height: 300px; border:1px solid #E3BCBB;}


/*==================================================================================================================================================
@group 翻訳
==================================================================================================================================================*/
li.lang00{
  display: block;
  width: 100%;
  background: url(../images/bg_language.jpg) repeat-x left top;
  border-bottom: 1px solid #ffffff;
}
div.languageInner ul li a{
  color: #000000;
  text-decoration: none;
}
div.languageInner.if_IE{
  display: none;
}
@media all and (-ms-high-contrast: none) {
  /* ここに書く */
  div#language .languageInner.other_IE{
    display: none;
  }
  div#language .languageInner.if_IE{
    display: block;
  }
  li.lang01{
    border-radius: 0 0 0 10px;
  }
  li.lang03{
    border-right: 1px solid #FFF;
    border-left: 1px solid #FFF;
  }
  li.lang04{
    border-radius: 0 0 10px 0;
  }
}
a.gflag {vertical-align:middle;font-size:100%;padding:1px 0;background-repeat:no-repeat;background-image:url(//gtranslate.net/flags/16.png);}
a.gflag img {border:0;}
a.gflag:hover {background-image:url(//gtranslate.net/flags/16a.png);}
#goog-gt-tt {display:none !important;}
.goog-te-banner-frame {display:none !important;}
.goog-te-menu-value:hover {text-decoration:none !important;}
body {top:0 !important;}
#google_translate_element2 {display:none!important;}
#langctl img{ width: 100%; height: auto;}