@charset "utf-8";
@media screen and (max-width: 981px) {
  body {
    font-size: 13px;
  }
  .hr {
    height: 3px;
  }
  .siteTitl,
  .copyText,
  #gronavMenu,
  .contentArt,
  .linkBox,
  main .browserBox,
  .sideBox > li {
    padding: 10px;
  }
  .siteTitl {
    font-size: 18px;
  }
  .copyText {
    font-size: 13px;
  }
  #mainImg {
    margin: 10px;
  }
  .linkBox h2 {
    font-size: 15px;
  }
  .linkButton a::after {
    width: 14px;
  }
}
@media screen and (max-width: 873px) {
  #container {
    flex-wrap: wrap;
  }
  #leftColumn {
    width: 25%;
    position: relative;
  }
  main {
    width: 75%;
  }
  #mainLeftColumn {
    width: 50%;
  }
  #rightColumn,
  .under #rightColumn {
    border-left: 1px solid #a08f7b;
    border-top: 1px solid #a08f7b;
    width: 100%;
  }
  .under #leftColumn {
    width: 25%;
  }
  .sideBox {
    display: flex;
  }
  .sideBox .menu,
  .sideBox .column {
    width: 50%;
  }
  .sideBox .menu {
    border-right: 1px solid #a08f7b;
  }
}
@media screen and (max-width: 679px) {
  body {
    font-size: 16px;
  }
  /* contents */
  #container {
    border-left: 1px solid #a08f7b;
    border-right: 1px solid #a08f7b;
    display: block;
  }
  #leftColumn,
  #mainRightColumn,
  #mainLeftColumn,
  .under #leftColumn {
    border: none;
    width: 100%;
  }
  main {
    border: none;
    display: block;
    margin: 0 auto;
    width: 100%;
  }
  #mainLeftColumn {
    padding: 10px;
  }
  .under #mainRightColumn {
    padding: 0;
  }
  #rightColumn {
    border-left: none;
    border-right: none;
  }
  .contentArt h2,
  .linkBox h2,
  main .browserBox h2 {
    font-size: 100%;
  }

  /* leftColumn */
  #gronavMenu {
    display: flex;
    flex-wrap: wrap;
    font-size: 14px;
    list-style: none;
    padding: 15px 10px;
    position: static;
    width: 100%;
    z-index: 999;
  }
  #gronavMenu li {
    border-bottom: 1px solid #dddecc;
    border-right: 1px solid #dddecc;
    margin-bottom: 0;
    width: 50%;
  }
  #gronavMenu li:nth-child(odd) {
    border-left: 1px solid #dddecc;
  }
  #gronavMenu li:nth-child(1),
  #gronavMenu li:nth-child(2) {
    border-top: 1px solid #dddecc;
  }
  #gronavMenu li a {
    border: none;
    border-radius: 0;
    padding: 8%;
  }
  #gronavMenu li a::before {
    left: 12px;
    top: 22px;
  }
  #gronavMenu li a:hover {
    background: #f7f6f0;
    border: none;
  }

  /* main */
  /* mainImg */
  #mainImg {
    margin: 15px 10px;
    padding: 0;
    transform: none;
  }
  .bx-wrapper .bx-pager,
  .bx-wrapper .bx-controls-auto {
    text-align: center;
  }
  .bx-wrapper .bx-pager.bx-default-pager a {
    height: 10px;
    width: 10px;
  }

  .eyeCatch {
    margin: 0;
    padding: 15px 10px;
  }
  .linkBox {
    padding: 15px 0;
  }
  .linkButton a::after {
    width: 20px;
  }

  /* contentArt */
  .contentArt img {
    width: 100%;
  }
  .contentArt blockquote {
    padding: 40px 15px;
  }
  .contentArt pre {
    width: 100%;
  }
  .alignleft img,
  .aligncenter img,
  .alignright img {
    width: 50%;
  }

  /* browser */
  main .browserBox {
    padding: 0;
  }
  main .browserBox h2 {
    font-weight: bold;
    margin: 15px 0;
  }

  /* slicknav */
  .slicknav_menu {
    background: none;
    display: block;
    padding: 0;
  }
  .slicknav_menu > a {
    margin: 0;
    padding: 0;
  }
  .slicknav_menu img {
    display: block;
    height: auto;
    margin-bottom: 15px;
    width: 100%;
  }
  .slicknav_menu .slicknav_menutxt {
    display: block;
    padding: 15px 10px;
    text-align: center;
    text-shadow: none;
    width: 100%;
  }
  .slicknav_menu .slicknav_icon-bar {
    display: none;
  }
  .slicknav_menu .slicknav_icon {
    display: none;
  }
  .slicknav_btn {
    float: none;
  }
  .slicknav_btn.slicknav_collapsed {
    display: block;
    width: 100%;
  }
  .slicknav_nav .slicknav_row:hover {
    background: none;
    border-radius: 0;
    color: #94816a;
  }
  .slicknav_nav ul li a {
    display: block;
    padding: 15px 10px;
  }
  .slicknav_nav .menu li {
    position: relative;
  }
  .slicknav_nav > li h2,
  .slicknav_nav > li h3 {
    margin: 0;
    font-weight: bold;
    padding: 15px 0;
    text-align: center;
  }
  .slicknav_nav .column li a:hover {
    background: #f7f6f0;
  }
  .slicknav_nav .slicknav_arrow {
    display: none;
  }
  .slicknav_nav .slicknav_row {
    margin: 0;
    padding: 0;
  }
  .none,
  .slicknav_nav > .hr {
    display: none;
  }
  .sideBox {
    display: none;
  }
  .column .underBox li {
    border-bottom: 1px solid #a08f7b;
    margin-bottom: 15px;
  }
  .column .underBox li:last-child {
    border: none;
  }

  /* footer */
  .sitemapBox {
    width: 90%;
  }
  .sitemapBox > li p {
    border: none;
    width: auto;
  }
  .sitemapBox > li {
    display: block;
    width: auto;
  }
  .copyRight {
    padding-right: 50px;
  }
  small {
    display: block;
    margin: 0 auto;
    width: 90%;
  }

  /* topButton */
  #topbtnBox {
    width: 45px;
  }

  /* under */
  /* sub-content */
  .under #mainRightColumn > h2 {
    font-size: 100%;
    padding: 15px 10px;
  }
  #rightColumn,
  .under #rightColumn {
    border-left: none;
  }

  /* panNavMenu */
  #panNavMenu {
    margin: 10px;
  }

  /* SNS */
  .snsBox {
    display: flex;
    flex-wrap: wrap;
  }
  .snsButton {
    margin: 1% 0;
    width: 25%;
  }

  /* noPage */
  #noPage {
    padding: 20% 10px;
  }
}