﻿

/*** for PC Browser ***/
@media (min-width:401px)
{
/*auto generated region*/

#BaseTable
{

}
#SystemMenu
{

}
#HeaderPane
{

}
#Middle
{

}
#LeftPane
{

}
#ContentPane
{

}
#RightPane
{

}
#FooterPane
{

}
}


/*** for Smart Phone ***/
@media (max-width:400px)
{
#pagetop,
#BaseTable,
#HeaderPane,
#Middle,
#LeftPane,
#ContentPane,
#RightPane,
#FooterPane {
  width: auto;
}

#pagetop {
  min-width: 483px;
  padding-top: 0;
}

#HeaderPane .header-inner {
  width: 100%;
}
#HeaderPane .global-navi-inner {
  width: 100%;
}

#Middle {
  margin-left: 1rem;
  margin-right: 1rem;
}
#Middle #ContentPane {
  width: 100%;
}
#Middle #ContentPane > .columns {
  display: block;
}
#Middle #ContentPane .left-column {
  width: auto;
  margin-right: 0;
}
#Middle #ContentPane .main-column {
  width: auto;
}

#FooterPane .footer-inner {
  width: auto;
}

#HeaderPane .header-inner-right {
  /* display: none; */
}
#HeaderPane .header-inner-right .translation-lang,
#HeaderPane .header-inner-right .color-switch,
#HeaderPane .header-inner-right .fsize-switch
{
	display: none;
}

#FooterPane .footer-logo {
  display: none;
}
#FooterPane .footer-links {
  display: none;
}

#HeaderPane .header-inner {
  padding: 1rem 1rem 0;
}
#HeaderPane .header-inner > .columns {
  display: block;
}
#HeaderPane .header-inner-left > .columns {
  /*                display: block;
                  overflow: hidden;*/
  flex-wrap: wrap;
  justify-content: space-between;
}
#HeaderPane .header-inner-left .header-logo {
  width: 100%;
  margin: 0;
  margin-bottom: 10px;
  display: block;
}
#HeaderPane .header-inner-left .link-ijyuteijyu {
  width: 49%;
  margin: 0;
  display: block;
  /*float: left;*/
}
#HeaderPane .header-inner-left .link-ijyuteijyu > a img {
  width: 100%;
  height: auto;
}
#HeaderPane .header-inner-left .link-furusatotax {
  width: 49%;
  margin: 0;
  display: block;
  /*float: left;*/
  /*margin-left: 10px;*/
}
#HeaderPane .header-inner-left .link-furusatotax > a img {
  width: 100%;
  height: auto;
}
#HeaderPane .burger-menu-btn {
  position: absolute;
  top: 1rem;
  right: 1rem;
  display: flex;
  height: 60px;
  width: 60px;
  justify-content: center;
  align-items: center;
  z-index: 90;
  border: 2px solid;
  border-color: #000000;
  cursor: pointer;
  background-color: #ffffff;
}
#HeaderPane .burger-menu-btn span {
  content: '';
  display: block;
  height: 3px;
  width: 30px;
  border-radius: 3px;
  background-color: #000000;
  position: absolute;
  transition: all .4s;
}
#HeaderPane .burger-menu-btn span:before {
  content: '';
  display: block;
  height: 3px;
  width: 30px;
  border-radius: 3px;
  background-color: #000000;
  position: absolute;
  transition: all .4s;
  bottom: 8px;
}
#HeaderPane .burger-menu-btn span:after {
  content: '';
  display: block;
  height: 3px;
  width: 30px;
  border-radius: 3px;
  background-color: #000000;
  position: absolute;
  transition: all .4s;
  top: 8px;
}
#HeaderPane .burger-menu #menu-btn-check {
  display: none;
}
#HeaderPane .burger-menu #menu-btn-check:checked ~ .burger-menu-btn {
  background-color: #cc0000;
  border-color: #cc0000;
}
#HeaderPane .burger-menu #menu-btn-check:checked ~ .burger-menu-btn span {
  background-color: rgba(255, 255, 255, 0);
}
#HeaderPane .burger-menu #menu-btn-check:checked ~ .burger-menu-btn span:before {
  background-color: #ffffff;
  bottom: 0;
  transform: rotate(45deg);
}
#HeaderPane .burger-menu #menu-btn-check:checked ~ .burger-menu-btn span:after {
  background-color: #ffffff;
  top: 0;
  transform: rotate(-45deg);
}
#HeaderPane .burger-menu #menu-btn-check:checked ~ .burger-menu-contents {
  /*left: 0;*/
  /*opacity: 1;*/
}
#HeaderPane .burger-menu-contents {
  width: 100%;
  position: absolute;
  top: calc(1rem + 60px);
  /*left: 100%;*/
  left: 0;
  z-index: 80;
  background-color: #ffffff;
  border: 5px solid;
  border-color: #cc0000;
  padding: 0.8rem;
  display: none;
  /*transition: all 0.5s;*/
  /*opacity: 0;*/
}
#HeaderPane .burger-menu-contents ul li {
  margin-bottom: 5px;
}
#HeaderPane .burger-menu-contents ul li + li {
  border-top: 1px solid;
  border-color: #999;
}
#HeaderPane .burger-menu-contents ul li a {
  position: relative;
  display: block;
  padding: 5px 1rem;
  font-size: 20px;
}
#HeaderPane .burger-menu-contents ul li a:after {
  font-family: 'Font Awesome 5 Free';
  content: '\f054';
  font-weight: 900;
  right: 2rem;
  color: #000000;
  margin-left: .5rem;
  font-weight: bold;
  position: absolute;
}
#HeaderPane .global-navi-inner {
  position: initial;
}
#HeaderPane #globalnavi {
  border-bottom: 2px solid;
  border-bottom-color: #cc0000;
}
#HeaderPane #globalnavi .navibar-start {
  display: none;
}

#Middle #ContentPane #TopSlideshow ul li + li {
  /*padding-left: 10px;*/
}
#Middle #ContentPane #TopSlideshow img {
  width: 100%;
  min-width: 200px;
  height: auto;
  padding-right: 10px;
}
#Middle #ContentPane #TopSlideshow ul li:nth-child(odd) div{
  /*padding-right: 10px;*/
}
#Middle #ContentPane .box ul li {
  width: 100%;
}
#Middle #ContentPane .tabbox .tabs > a {
  display: none;
}
#Middle #ContentPane .tabbox .tabs-contents .tabs-contents-body dl {
  display: block;
}
#Middle #ContentPane .tabbox .tabs-contents .tabs-contents-footer .column {
  display: inline-block;
}
#Middle #ContentPane .search-lifework ul li {
  width: 32%;
  max-width: 180px;
}
#Middle #ContentPane .bn-contents-links ul {
  justify-content: center;
  border: none;
}
#Middle #ContentPane .bn-contents-links ul li {
  width: 50%;
}
#Middle #ContentPane .bn-contents-links ul li + li {
  border: none;
}
#Middle #ContentPane .bn-contents-links ul li:nth-child(n + 3) {
  border-top: 1px solid;
  border-top-color: #d3c8b4;
}
#Middle #ContentPane .town-mayor-links {
  display: block;
}
#Middle #ContentPane #TownHeadman {
  width: 100%;
  margin-bottom: 0.8rem;
}
#Middle #ContentPane #TownHeadman a {
  font-size: 25px;
  text-align: left;
  text-indent: 5rem;
}
#Middle #ContentPane #TownHeadman a small {
  text-align: left;
  text-align-last: left;
  font-size: 16px;
}
#Middle #ContentPane #TownHeadman a small br {
  display: none;
}
#Middle #ContentPane #TownCouncil {
  width: 100%;
}
#Middle #ContentPane #TownCouncil a {
  font-size: 25px;
  text-align: left;
  text-indent: 5rem;
}

#FooterPane .related-links {
  height: auto;
  padding: 2rem 1.8rem 4rem;
}
#FooterPane .related-links-inner {
  width: 100%;
}
#FooterPane .related-links-inner .is-title {
  text-align: center;
}
#FooterPane .related-links .slideshow {
  padding-right: 25px;
  padding-left: 25px;
}
#FooterPane .related-links ul li img {
  width: 100%;
  height: auto;
}
#FooterPane .banner-koukoku {
  height: auto;
  padding: 1rem 1.8rem;
}
#FooterPane .banner-koukoku-inner {
  width: 100%;
}
#FooterPane .banner-koukoku-inner .is-title {
  text-align: center;
}
#FooterPane .banner-koukoku .slideshow {
  padding-right: 25px;
  padding-left: 25px;
}
#FooterPane .banner-koukoku ul li img {
  width: 100%;
  height: auto;
}
#FooterPane .banner-koukoku .is-title a {
  display: none;
}
#FooterPane .banner-koukoku .banner-koukoku-footer-link {
  margin-top: 1.8rem;
  text-align: center;
}
#FooterPane .footer-inner {
  padding: 2rem 1rem;
}
#FooterPane .footer-inner .columns {
  padding-top: 0;
  display: block;
}
#FooterPane .footer-inner .columns.is-mobile > .column.is-half {
  width: 100%;
}
#FooterPane .footer-inner .footer-address {
  font-size: 14px;
  margin-bottom: 2rem;
}
#FooterPane .footer-inner .footer-address-title {
  font-size: 20px;
}
#FooterPane .footer-inner .footer-address a {
  display: none;
}
#FooterPane .footer-inner .town-population {
  padding-left: 5rem;
  padding-right: 4rem;
}
#FooterPane .footer-copyright {
  font-size: 12px;
  line-height: 45px;
  height: 45px;
}

#page_top {
  width: 45px;
  height: 45px;
}
#page_top a {
  width: 45px;
  height: 45px;
}
#page_top a:before {
  font-size: 30px;
  width: 30px;
  height: 30px;
}

#HeaderPane .header-breadcrumb {
  padding-left: 1rem;
  padding-right: 1rem;
}
#HeaderPane .header-breadcrumb-inner {
  width: 100%;
}
#HeaderPane .printout_btn {
  display: none;
}

#Middle > .columns {
  display: block;
}
#Middle #ContentPane.is-leftcolumn {
  margin: 0;
}
#Middle #ContentPane.is-leftcolumn + #RightPane {
  width: 100%;
}
#Middle #ContentPane .contents-pickup > .columns {
  display: block;
}
#Middle #ContentPane .contents-pickup dl {
  display: block;
}
#Middle #ContentPane .scroll-hint-icon-wrap,
#Middle #ContentPane .scroll-hint-text {
  line-height: normal;
}

/*# sourceMappingURL=sp.css.map */
}
