/*/////////////////////////////////////////
    Lower

    Small @media screen and (max-width: 512px)
    Medium @media screen and (min-width: 513px) and (max-width: 959px)
    Large @media screen and (min-width: 960px)
/////////////////////////////////////////*/
/*---------------------------------------
    Breadcrumb
---------------------------------------*/
ul.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  width: 98%;
  margin: 0 auto 1.5em auto;
  padding: 0;
  background-color: #c4e9ff;
}
  ul.breadcrumb li {
      line-height: 1.8;
      margin: 0;
      padding: 0;
  }
      ul.breadcrumb li i {
          padding: 0 0.5em;
      }
@media screen and (max-width: 512px) {
}
/*---------------------------------------
    Contents // Lower
---------------------------------------*/
@media screen and (max-width: 512px) {
  #lower-contents {
    max-width: 90%;
    margin: 0 auto 2em auto;
    line-height: 1.8;
  }
    #lower-contents h2 {
        text-align: center;
        line-height: 1.2em;
    }
    .lower-title-area {
        margin: 1em 0;
        border-bottom: #eee 1px solid;
    }
    .arch-frame .arch-box {
      width: 100%;
    }
}
@media screen and (min-width: 513px) and (max-width: 959px) {
  .menu-set-center {
    width: 60%;
  }
  .arch-frame::after {
    display: block;
    content: "";
    width: 49%;
  }
    .arch-frame .arch-box {
      width: 49%;
    }
}
@media screen and (min-width: 960px) {
  .menu-set-center{
    width: 60%;
  }
  .arch-frame {
    width: 98%;
    margin: 0 auto;
  }
  .arch-frame::after {
    display: block;
    content: "";
    width: 32%;
  }
    .arch-frame .arch-box {
      width: 32%;
    }
}
/*---------------------------------------
    kawabiraki101-buffet // Lower
---------------------------------------*/
@media screen and (max-width: 512px) {
  table.kawabiraki {
    margin: 1.5em auto;
    border: #0053A9 2px solid;
    font-size: 120%;
    background-color: #99ffff;
  }
    table.kawabiraki th,
    table.kawabiraki td {
      padding: 0.5em;
    }
    table.kawabiraki th {
      width: 15%;
      writing-mode: vertical-rl;
    }
  ul.kawabiraki {
    margin: 1.5em auto;
    padding: 1em;
    font-size: 110%;
    text-indent: -1.3em;
    padding-left: 2em;
    list-style: square inside;
    box-sizing: border-box;
    border: #0053A9 1px solid;
  }
    ul.kawabiraki li {
      margin: 0;
      padding: 0.5em 0;
    }
  div.kawabiraki {
    text-align: center;
    margin: 0 auto;
    padding: 0.5em;
    color: #ff6600;
    font-weight: bold;
    border-top: #0053A9 2px dotted;
    border-bottom: #0053A9 2px dotted;
  }
  div.kawabiraki-contact {
    text-align: center;
    margin: 1.5em 0;
  }
  div.paper {
    display: flex;
    justify-content: space-between;
  }
}
@media screen and (min-width: 960px) {
  table.kawabiraki {
    width: 90%;
  }
    table.kawabiraki th {
      writing-mode: horizontal-tb;
    }
  ul.kawabiraki {
    width: 80%;
  }
  div.kawabiraki {
    width: 80%;
  }
  div.paper img {
    width: 450px;
    height: auto;
  }
}
/*---------------------------------------
    Archive // Lower
---------------------------------------*/
.arch-frame {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
  .arch-frame .arch-box {
      position: relative;
      /* width: 100%; */
      height: 500px;
      padding: 1em;
      margin-bottom: 2em;
      border: #ddd 1px solid;
      box-sizing: border-box;
  }
      .arch-frame .arch-box .img_wrap {
          width: 100%;
          max-height: 45%;
          overflow: hidden;
          background-color: #eee;
      }
      .arch-frame .arch-box .content_wrap {
          position: absolute;
          bottom: 1em;
          left: 1em;
          width: calc(95% - 1em);
      }
      .arch-frame .arch-box .category,
      .single .category {
          background: #7F7F7F;
          color: #fff;
          display: inline-block;
          line-height: 1.5;
          padding: 0 1em;
          margin: 0.5em 0;
        }
          .arch-frame .arch-box .campain,
          .single .campain {
              background: #015CA7;
          }
          .arch-frame .arch-box .event,
          .single .event {
              background: #01A73C;
          }
          .arch-frame .arch-box .info,
          .single .info {
              background: #20AEE5;
          }
          .arch-frame .arch-box .news,
          .single .news {
              background: #F6A81A;
          }
          .arch-frame .arch-box .present,
          .single .present {
              background: #DF014A;
          }
          .arch-frame .arch-box .report,
          .single .report {
              background: #EB75A5;
          }
      .arch-frame .arch-box .date,
      .single .date {
          display: inline-block;
          font-size: 1.2em;
          line-height: 1.2;
      }

          .arch-frame .arch-box .content_wrap h3 {
              height: 65px;
              line-height: 1.3;
              margin: 0.5em 0;
              border-bottom: #000 1px solid;
          }
          .arch-frame .arch-box .content_wrap .comment {
              height: 110px;
          }
          .att-phone {
            font-size: 1.2em;
            text-align: center;
            margin: 1em 0;
        }
        .cancel-reserv {
            text-align: center;
            padding: 1em;
            margin: 1em 0;
            border-bottom: #00a0ff 2px solid;
            border-top: #00a0ff 2px solid;
        }
        .bus-reserv {
            width: 100%;
            background: #c4e9ff;
            box-sizing: border-box;
            padding: 1em;
        }
        .menu-set-center{
            width: 80%;
            position: relative;
            margin: 0 auto 1em auto;
            padding: 0.5em;
            box-sizing: border-box;
            text-align: center;
            background: #ebf6fc;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
        }
        .dw-btn:link,
        .dw-btn:active,
        .dw-btn:visited {
            width:90%;
            display:block;
            background:#3498db;
            color:#fff;
            font-size: 1.2em;
            font-weight:bold;
            text-align:center;
            border:2pt solid #3498db;
            padding: 1em 1em;
            margin:0.5em auto;
        }
            .dw-btn:hover {
            display:block;
            background:#fff;
            color:#3498db;
            border:2pt solid #3498db;
            }


            .dw-btn-cancel:link,
            .dw-btn-cancel:active,
            .dw-btn-cancel:visited {
                width:90%;
                display:block;
                background-color: #005ca7;
                color:#fff;
                font-size: 1.2em;
                font-weight:bold;
                text-align:center;
                border:2pt solid #005ca7;
                padding: 1em 1em;
                margin:0.5em auto;
            }
                .dw-btn-cancel:hover {
                display:block;
                background:#fff;
                color:#3498db;
                border:2pt solid #005ca7;
                }
                ul {
                  /* width: 90%; */
                  list-style: none;
                  margin: 0 0 0 1em;
                  padding: 0;
                }
                ul li {
                  margin-bottom: 20px;
                  padding-bottom: 0;
                  position: relative;
                  font-size: 90%;
                }
                ul li div.content {
                  width: 275px;
                  margin-top: 5px;
                  min-height: 77px;
                }
                ul li div.content p {
                  font-size: 14px;
                  line-height: 1.5;
                }
                ul li div.title {
                  display: block;
                  background: #FFF462;
                  border-radius: 6px;
                  border: solid 1px;
                  color: #000;
                  font-size: 17px;
                  font-weight: 600;
                  letter-spacing: 0px;
                  padding: 3px 8px;
                }
                ul li div.price {
                  display: block;
                  font-size: 19px;
                  font-weight: 600;
                  color: red;
                  margin-top: 5px;
                }
                  ul li div.price span.tax-in {
                    font-size: 80%;
                  }
                ul li div.explanation {
                  padding: 0.5em;
                  border: #ddd 1px solid;
                  border-radius: 10px;
                }
                  ul li div.explanation h2 {
                    font-size: 90%;
                    border-bottom: #ddd 3px solid;
                  }
                  ul li div.explanation br {
                    display: none;
                  }
                  ul li div.explanation dl.details  {
                    display: flex;
                    flex-direction: row;
                    flex-wrap: wrap;
                    width: 100%;
                  }
                    ul li div.explanation dl.details dt  {
                      width: 30%;
                      margin: 0 0 0.5em 0;
                      padding: 0.5em;
                      box-sizing: border-box;
                      text-align: center;
                      background-color: #eee;
                    }
                    ul li div.explanation dl.details dd  {
                      width: 70%;
                      text-align: left;
                      margin: 0 0 0.5em 0;
                      padding: 0.5em;
                      box-sizing: border-box;
                    }
                ul li div.btn {
                  border: solid 1px #000;
                  border-radius: 3px;
                  background: #000;
                  color: #fff;
                  letter-spacing: normal;
                  padding: 3px 7px;
                  margin-top: 5px;
                }
                  ul li div.btn:hover {
                    background: #fff;
                    color: #000;
                  }

                ul li span.thumbnail {
                  width: 100%;
                  height: auto;
                  position: absolute;
                  top: 0;
                  right: 0;
                }
                    ul li span.thumbnail img {
                      width: 100%;
                      height: auto;
                      margin: 0 0 20px 0;
                      padding: 0;
                      border: solid 1px #ddd;
                    }
/*---------------------------------------
    pager // Lower
---------------------------------------*/
.nav-links span,
.nav-links a {
    width: 50px;
    height: 50px;
    color: #005ca7;
    line-height: 50px;
    text-align: center;
    margin: 0 0.5em 0.5em 0;
    background-color: #fff;
}
nav.navigation {
  position: relative;
  margin: 0 0 2em 0;
  padding: 1em 1em;
  border-radius: 1em;
  background-color: #00a0ff;
}
  .nav-links {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-start;
  }
  .nav-links a:nth-child(5n) {
    margin-right: 0;
  }
  .nav-links .current {
      font-weight: bold;
      color: #fff;
      background-color: #005ca7;
  }
.paging {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: 30px 0;
}
  .paging .next, .paging .prev {
      background: #00a0ff;
      display: block;
  }
  .paging .next a, .paging .prev a {
      color: #fff;
      display: block;
      padding: 8px 20px;
  }
  .top_link {
    background: #4F81BD;
    display: block;
}
    .top_link a {
        color: #fff;
        display: block;
        text-align: center;
        padding: 0.5em 1em;
    }
@media screen and (max-width: 512px) {
        .nav-links span,
        .nav-links a {
            padding: 0;
            border-radius: 50%;
        }
}
@media screen and (min-width: 513px) and (max-width: 959px) {
  nav.navigation {
    padding: 1em 1.5em;
  }
    .nav-links {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-start;
    }
      .nav-links span,
      .nav-links a {
          width: 40px;
          height: 40px;
          line-height: 40px;
      }
}
@media screen and (min-width: 960px) {
  nav.navigation {
    padding: 1em 2.5em 0.5em 2.5em;
    border-radius: 2.5em;
    box-sizing: border-box;
  }
}