@charset "UTF-8";
@import url("reset.css");
@import url("m_menu.css");
@import url("swiper-bundle.min.css");
/*共通設定-------------------------------------------------------------------------------------------------------------------------------------*/
/*基本設定*/
html {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  line-height: 1.5;
  color: #191919; }

main {
  display: block; }

header a img, main a img, footer a img {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all  0.3s ease; }

header a:hover img, main a:hover img, footer a:hover img {
  opacity: 0.8;
  filter: alpha(opacity=80);
  -moz-opacity: 0.8; }

.fade {
  /*margin-top: 10vh;*/
  opacity: 0;
  transition: opacity 2s; }

.fade.view {
  opacity: 1; }

/*ヘッダー*/
header {
  width: 100%;
  margin: 0 auto;
  background: #0046a0;
  border-bottom: #dc0014 8px solid; }
  header #header_inner {
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center; }
    header #header_inner h1 {
      width: 20%;
      margin: 0 auto; }
    header #header_inner #inner_right {
      width: 60%;
      margin-right: 0; }
      header #header_inner #inner_right ul {
        display: inline-flex;
        width: 100%;
        margin-right: 0; }
        header #header_inner #inner_right ul li {
          margin: 0 1%;
          padding: 0 5% 0 0;
          font-size: 1em;
          border-right: solid #fff; }
          header #header_inner #inner_right ul li a {
            color: #fff;
            text-decoration-line: none; }
    header #header_inner .contact {
      width: 18%;
      margin-right: 0; }

/*メイン*/
.wave {
  position: relative;
  margin-top: -2%;
  z-index: 60; }

.banner {
  width: 100%;
  margin: 0 auto; }

.title {
  margin: 0 auto 2em;
  width: 80%; }
  .title h2 {
    font-size: 1.5em;
    padding: 1em 0 0;
    font-weight: bold;
    text-decoration: underline #dc0014 0.2em;
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    text-underline-offset: 0.5em; }
  .title p {
    margin: 1em auto; }

/*map*/
#japan-map div div.area div {
  border: 1px #ffffff solid;
  text-align: center;
  font-size: 14px;
  display: flex;
  display: -webkit-flex;
  align-items: center;
  /* 縦方向中央揃え */
  -webkit-align-items: center;
  /* 縦方向中央揃え（Safari用） */
  justify-content: center;
  /* 横方向中央揃え */
  -webkit-justify-content: center;
  /* 横方向中央揃え（Safari用） */
  border-radius: 6px;
  -webkit-border-radius: 6px;
  position: absolute;
  box-sizing: border-box;
  transition: 0.2s; }

#japan-map div div.area div:hover {
  opacity: 0.5;
  transition: 0.2s; }

#japan-map {
  display: block;
  width: 80%;
  height: 500px;
  background-color: none;
  margin-left: auto;
  position: relative;
  margin: 0 34em 3em; }

#japan-map p.area-title {
  display: none; }

/* 北海道・東北 */
#hokkaido-touhoku {
  width: 136px;
  display: block;
  height: 265px;
  position: absolute;
  left: 638px; }

#hokkaido-touhoku div.area div {
  background-color: #7478c2;
  color: #ffffff; }

#hokkaido {
  width: 133px;
  height: 70px; }

#aomori {
  width: 93px;
  height: 43px;
  left: 21px;
  top: 96px; }

#akita {
  width: 67px;
  height: 42px;
  left: 3px;
  top: 139px; }

#iwate {
  width: 67px;
  height: 42px;
  left: 70px;
  top: 139px; }

#yamagata {
  width: 67px;
  height: 42px;
  top: 181px;
  left: 3px; }

#miyagi {
  width: 67px;
  height: 42px;
  top: 181px;
  left: 70px; }

#fukushima {
  width: 67px;
  height: 42px;
  top: 223px;
  left: 70px; }

/* 関東 */
#kantou {
  width: 158px;
  display: block;
  height: 174px;
  position: absolute;
  top: 265px;
  left: 623px;
  z-index: 2; }

#kantou div.area div {
  background-color: #31beca;
  color: #ffffff; }

#ibaraki {
  width: 52px;
  height: 85px;
  top: 0px;
  left: 100px; }

#tochigi {
  width: 50px;
  height: 42px;
  top: 0px;
  left: 50px; }

#gunma {
  width: 50px;
  height: 42px;
  top: 0px;
  left: 0px; }

#saitama {
  width: 100px;
  height: 43px;
  top: 42px;
  left: 0px; }

#chiba {
  width: 52px;
  height: 84px;
  top: 85px;
  left: 100px; }

#tokyo {
  width: 100px;
  height: 42px;
  top: 85px;
  left: 0px; }

#kanagawa {
  width: 67px;
  height: 42px;
  top: 127px;
  left: 0px; }

#yamanashi {
  width: 67px;
  height: 42px;
  right: 158px;
  top: 85px; }

/* 中部 */
#tyubu {
  width: 270px;
  height: 211px;
  position: absolute;
  left: 438px;
  top: 223px; }

#tyubu div.area div {
  background-color: #4ab969;
  color: #ffffff; }

#nigata {
  width: 85px;
  height: 42px;
  left: 185px; }

#toyama {
  width: 67px;
  height: 42px;
  left: 118px; }

#ishikawa {
  width: 50px;
  height: 57px;
  left: 68px; }

#fukui {
  width: 68px;
  height: 42px;
  left: 0px;
  z-index: 2; }

#nagano {
  width: 67px;
  height: 85px;
  left: 118px;
  top: 42px; }

#gifu {
  width: 50px;
  height: 55px;
  left: 68px;
  top: 57px; }

#shizuoka {
  width: 67px;
  height: 42px;
  left: 118px;
  top: 169px; }

#aichi {
  width: 50px;
  height: 57px;
  top: 112px;
  left: 68px; }

/* 近畿 */
#kinki {
  width: 186px;
  height: 211px;
  position: absolute;
  left: 320px;
  top: 223px; }

#kinki div.area div {
  background-color: #b0b72f;
  color: #ffffff; }

#kyoto {
  width: 67px;
  height: 84px;
  left: 51px; }

#shiga {
  width: 68px;
  height: 42px;
  top: 42px;
  left: 118px; }

#osaka {
  width: 67px;
  height: 85px;
  top: 84px;
  left: 51px; }

#nara {
  width: 34px;
  height: 85px;
  top: 84px;
  left: 118px; }

#mie {
  width: 34px;
  height: 85px;
  top: 84px;
  left: 152px; }

#wakayama {
  width: 113px;
  height: 42px;
  top: 169px;
  left: 61px; }

#hyougo {
  width: 51px;
  height: 98px;
  left: 0px; }

/* 中国 */
#tyugoku {
  width: 151px;
  height: 98px;
  position: absolute;
  left: 169px;
  top: 223px; }

#tyugoku div.area div {
  background-color: #ef9f27;
  color: #ffffff; }

#tottori {
  width: 50px;
  height: 49px;
  left: 101px; }

#okayama {
  width: 50px;
  height: 49px;
  top: 49px;
  left: 101px; }

#shimane {
  width: 51px;
  height: 49px;
  left: 50px; }

#hiroshima {
  width: 51px;
  height: 49px;
  top: 49px;
  left: 50px; }

#yamaguchi {
  width: 50px;
  height: 98px;
  left: 0px; }

#kagawa {
  width: 92px;
  height: 42px;
  left: 92px;
  top: 120px; }

#ehime {
  width: 92px;
  height: 42px;
  left: 0px;
  top: 120px; }

#tokushima {
  width: 92px;
  height: 42px;
  left: 92px;
  top: 162px; }

#kouchi {
  width: 92px;
  height: 42px;
  left: 0px;
  top: 162px; }

/* 四国 */
#shikoku {
  width: 184px;
  height: 84px;
  position: absolute;
  left: 169px;
  top: 350px; }

#shikoku div.area div {
  background-color: #d08f68;
  color: #ffffff; }

/* 九州・沖縄 */
#kyusyu {
  width: 152px;
  height: 247px;
  position: absolute;
  left: 0px;
  top: 235px; }

#kyusyu div.area div {
  background-color: #ff7575;
  color: #ffffff; }

#fukuoka {
  width: 50px;
  height: 50px;
  left: 101px;
  top: 0px; }

#saga {
  width: 50px;
  height: 50px;
  left: 51px;
  top: 0px; }

#nagasaki {
  width: 50px;
  height: 50px;
  left: 1px;
  top: 0px; }

#oita {
  width: 50px;
  height: 50px;
  left: 101px;
  top: 50px; }

#kumamoto {
  width: 50px;
  height: 100px;
  left: 51px;
  top: 50px; }

#miyazaki {
  width: 50px;
  height: 50px;
  left: 101px;
  top: 100px; }

#kagoshima {
  width: 68px;
  height: 49px;
  left: 83px;
  top: 150px; }

#okinawa {
  width: 50px;
  height: 50px;
  left: 1px;
  top: 197px; }

.zisseki {
  width: 80%;
  margin: 5em auto 2em; }
  .zisseki #hokkaido-tohoku {
    width: 100%;
    margin: 0 auto; }
    .zisseki #hokkaido-tohoku h3 {
      background: #7478c2;
      color: #fff;
      text-align: center;
      padding: 1em;
      border-radius: 10px; }
  .zisseki #kantou-chihou {
    width: 100%;
    margin: 0 auto; }
    .zisseki #kantou-chihou h3 {
      background: #31b5c1;
      color: #fff;
      text-align: center;
      padding: 1em;
      border-radius: 10px; }
  .zisseki #chubu-tokai {
    width: 100%;
    margin: 0 auto; }
    .zisseki #chubu-tokai h3 {
      background: #44b060;
      color: #fff;
      text-align: center;
      padding: 1em;
      border-radius: 10px; }
  .zisseki #kansai {
    width: 100%;
    margin: 0 auto; }
    .zisseki #kansai h3 {
      background: #a7af33;
      color: #fff;
      text-align: center;
      padding: 1em;
      border-radius: 10px; }
  .zisseki #chugoku-shikoku {
    width: 100%;
    margin: 0 auto; }
    .zisseki #chugoku-shikoku h3 {
      background: #eb9631;
      color: #fff;
      text-align: center;
      padding: 1em;
      border-radius: 10px; }
  .zisseki #kyushyu-okinawa {
    width: 100%;
    margin: 0 auto; }
    .zisseki #kyushyu-okinawa h3 {
      background: #fd6c6d;
      color: #fff;
      text-align: center;
      padding: 1em;
      border-radius: 10px; }
  .zisseki .table-zone {
    width: 100%;
    margin: 5em auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    .zisseki .table-zone .left-inner {
      width: 15%;
      margin: 0 auto; }
    .zisseki .table-zone .right-inner {
      width: 80%;
      margin: 0 auto; }
      .zisseki .table-zone .right-inner table {
        width: 100%;
        font-size: 0.8em;
        table-layout: fixed; }
        .zisseki .table-zone .right-inner table tr {
          margin: 1em 0;
          padding: 1em 0;
          border-top: 1px #dcdcdc solid;
          border-bottom: 1px #dcdcdc solid; }
          .zisseki .table-zone .right-inner table tr th {
            width: 10%;
            margin: 0 1em;
            padding: 1em 1em;
            text-align: left;
            align-content: flex-start;
            border-right: 1px #dcdcdc solid; }
          .zisseki .table-zone .right-inner table tr td {
            margin: 0 1em;
            padding: 1em 1em;
            text-align: left; }
            .zisseki .table-zone .right-inner table tr td dl {
              widows: 100%;
              margin: 0 auto;
              display: flex;
              flex-wrap: wrap;
              justify-content: space-between;
              text-align: left; }
              .zisseki .table-zone .right-inner table tr td dl dt {
                width: 40%;
                margin: 0 0;
                padding: 0 0;
                text-align: left; }
              .zisseki .table-zone .right-inner table tr td dl dd {
                width: 50%;
                margin: 0 0;
                text-align: left; }

/*フッター*/
footer {
  margin: 8em 0 0;
  padding: 3em 0 0;
  background-color: #0046a0;
  border-top: #dc0014 8px solid;
  position: relative; }
  footer figure {
    padding: 5em 0 0;
    width: 200px;
    margin: 0 auto; }
  footer #footer_inner {
    width: 80%;
    margin: 3em auto 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    footer #footer_inner dl {
      width: 30%; }
      footer #footer_inner dl dt {
        font-weight: bold;
        font-size: 130%; }
      footer #footer_inner dl dd {
        width: 100%;
        margin: 1.5em 0 0 1em;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        color: #fff; }
        footer #footer_inner dl dd .spot-name {
          width: 20%;
          align-content: center;
          border: solid 1px;
          padding: 0.5em 0.5em;
          text-align: center;
          font-size: 0.8em; }
        footer #footer_inner dl dd .spot-address {
          width: 70%;
          font-size: 0.8em;
          margin: 0 0.5em; }
  footer #footer_right {
    width: 65%;
    margin: 0 0 0 4em;
    z-index: 20; }
    footer #footer_right nav #f_menu {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      color: #fff; }
      footer #footer_right nav #f_menu li {
        flex: 1;
        text-align: left;
        line-height: 4em; }
        footer #footer_right nav #f_menu li .menu-under {
          font-size: 0.8em;
          line-height: 3em;
          margin: 0 0 0 0.5em; }
        footer #footer_right nav #f_menu li a {
          color: #fff;
          font-weight: bold;
          text-decoration: none; }
          footer #footer_right nav #f_menu li a:hover, footer #footer_right nav #f_menu li a:active {
            color: #bcbcbc;
            text-decoration: underline; }
  footer p {
    width: 20%;
    position: absolute;
    right: 0;
    margin-top: -10em; }
  footer address {
    width: 96%;
    text-align: center;
    font-size: 87.5%;
    font-style: normal;
    padding: 0.5em 2%;
    margin: 10em 0 0;
    background-color: #fff; }

/*TOPへ戻るボタン設定*/
#page-top {
  position: fixed;
  bottom: 10px;
  right: 20px;
  font-size: 90%;
  z-index: 999;
  font-family: "M PLUS Rounded 1c";
  font-weight: bold; }
  #page-top img {
    width: 50px;
    display: block;
    margin: 0 auto 0.5em; }
  #page-top a {
    /*コレ*/
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 80px;
    background-color: #4885FF;
    color: #FFF;
    text-decoration: none;
    text-align: center;
    margin: 10px 0;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease; }
  #page-top a:hover, #page-top a:active {
    opacity: 0.7;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7; }

/*共通設定ここまで-------------------------------------------------------------------------------------------------------------------------------------*/
/* pc */
@media screen and (min-width: 1600px) {
  /*ヘッダー*/
  /*メイン*/
  .sp {
    display: none; }

  #menulist02 {
    display: none; }

  /*フッター*/ }
/* tablet1 */
@media only screen and (min-width: 1024px) and (max-width: 1700px) {
  /*基本設定*/
  html {
    font-size: 90%; }

  .sp {
    display: none; }

  #menulist02 {
    display: none; }

  /*ヘッダー*/
  header {
    padding: 1em 0; }
    header #header_inner #inner_right {
      width: 55%;
      font-size: 40%; }
      header #header_inner #inner_right li {
        margin: 0 1em;
        padding: 0 1em 0 0;
        border-right: solid #fff 1px; }
        header #header_inner #inner_right li a {
          color: #fff;
          text-decoration-line: none; }
    header #header_inner .contact {
      width: 15%;
      margin-right: 0; }

  /*メイン*/
  .top-list {
    width: 80%;
    margin: 0 auto; }
    .top-list table {
      width: 100%; }

  #japan-map {
    display: block;
    width: 80%;
    height: 482px;
    background-color: none;
    margin: 2em 20%;
    position: relative; }

  .zisseki #hokkaido-tohoku h3 {
    font-size: 0.8em; }
  .zisseki #kantou-chihou h3 {
    font-size: 0.8em; }
  .zisseki #chubu-tokai h3 {
    font-size: 0.8em; }
  .zisseki #kansai h3 {
    font-size: 0.8em; }
  .zisseki #chugoku-shikoku h3 {
    font-size: 0.8em; }
  .zisseki #kyushyu-okinawa h3 {
    font-size: 0.8em; }

  /*フッター*/ }
/* tablet2  */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  #menulist {
    display: none; }

  #menulist02 {
    display: none; }

  .contact {
    display: none; }

  /*基本設定*/
  html {
    font-size: 80%;
    position: relative; }

  /*ヘッダー*/
  header {
    padding: 2em 0 2em; }
    header #header_inner {
      align-content: flex-start; }
      header #header_inner #inner_right li {
        padding: 0 2em 0 0;
        font-size: 0.7em; }
        header #header_inner #inner_right li a {
          color: #fff;
          text-decoration-line: none; }
      header #header_inner .contact {
        width: 15%;
        margin-right: 0; }

  /*メイン*/
  .pc {
    display: none; }

  .top-list {
    display: none; }

  /*map*/
  #japan-map {
    display: block;
    width: 80%;
    height: auto;
    margin: 2em auto; }

  #hokkaido-touhoku, #kantou, #tyubu, #kinki, #tyugoku, #shikoku, #kyusyu {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: auto;
    position: static;
    margin: 1em auto; }

  #japan-map div div.area {
    font-size: 14px;
    display: flex;
    flex-wrap: wrap;
    width: 100%; }

  #japan-map div div.area a {
    height: auto;
    width: 25%; }

  #japan-map div div.area div {
    display: block;
    border-radius: 0px;
    position: static;
    height: auto;
    font-size: 16px;
    width: 100%;
    padding: 0.5em 0.3em 0.5em 0.3em; }

  .zisseki {
    width: 80%; }
    .zisseki .table-zone .left-inner {
      width: 30%;
      text-align: left;
      margin: 1em auto 1.5em 0; }
    .zisseki .table-zone .right-inner {
      width: 100%; }

  /*フッター*/
  footer #footer_inner {
    width: 90%;
    margin: 3em auto 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    footer #footer_inner dl {
      width: 50%; }
      footer #footer_inner dl dt {
        font-size: 120%; }
    footer #footer_inner #footer_right {
      display: none; } }
/* tablet3  */
@media only screen and (max-width: 767px) {
  #menulist {
    display: none; }

  .contact {
    display: none; }

  #menulist02 {
    display: none; }

  .pc {
    display: none; }

  /*基本設定*/
  html {
    font-size: 85%;
    position: relative; }

  /*ヘッダー*/
  header #header_inner h1 {
    width: 50%;
    margin: 1em auto 1em 1em; }
  header #header_inner .contact {
    width: 15%;
    margin-right: 0; }

  /*メイン*/
  .top-list {
    display: none; }

  /*map*/
  #japan-map {
    display: block;
    width: 80%;
    height: auto;
    margin: 2em auto; }

  #hokkaido-touhoku, #kantou, #tyubu, #kinki, #tyugoku, #shikoku, #kyusyu {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: auto;
    position: static;
    margin: 1em auto; }

  #japan-map div div.area {
    font-size: 14px;
    display: flex;
    flex-wrap: wrap;
    width: 100%; }

  #japan-map div div.area a {
    height: auto;
    width: 25%; }

  #japan-map div div.area div {
    display: block;
    border-radius: 0px;
    position: static;
    height: auto;
    font-size: 16px;
    width: 100%;
    padding: 0.5em 0.3em 0.5em 0.3em; }

  .zisseki {
    width: 90%; }
    .zisseki .table-zone {
      font-size: 0.6em; }
      .zisseki .table-zone .left-inner {
        width: 40%;
        text-align: left;
        margin: 1em auto 1.5em 0; }
      .zisseki .table-zone .right-inner {
        width: 100%; }

  /*フッター*/
  footer figure {
    padding: 0; }
  footer #footer_inner {
    width: 90%;
    margin: 2em auto 0;
    flex-direction: column; }
    footer #footer_inner dl {
      width: 100%;
      text-align: center; }
      footer #footer_inner dl dt {
        font-size: 120%; }
    footer #footer_inner #footer_right {
      display: none; }
  footer p {
    display: none; } }
/* smartPhone1 */
@media only screen and (max-width: 499px) {
  /*基本設定*/
  html {
    font-size: 80%; }

  #menulist02 {
    display: none; }

  /*ヘッダー*/
  #message {
    width: 200px; }

  /*メイン*/
  /*フッター*/ }