﻿@charset "UTF-8";
/*------------------------------
 共通・既存調整修正
------------------------------*/
div.wrapper_ {
  width: 100%;
  overflow: hidden;
}
div.wrapper_ .sp {
  display: none;
}

div.contents_ {
  display: block;
  float: none;
  width: 100%;
}

div.mainframe_ {
  display: block;
  float: none;
  width: 100%;
}

/* headerの読み込み時のかくつき調整用 */
#header_wrap {
  min-height: 122px;
}

/* パンくず
------------------------------*/
.breadcrumb {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", "HG明朝B", "MS Mincho", serif;
  background-color: #F7F7F7;
  margin-bottom: 40px;
}

.breadcrumb__inner {
  display: flex;
  flex-flow: row wrap;
  width: 1200px;
  padding: 8px 0 7px;
  margin: 0 auto;
  box-sizing: border-box;
}

.breadcrumb__arrow {
  display: inline-block;
  position: relative;
  color: #CCCCCC;
  width: 8px;
  font-size: 0;
  line-height: 20px;
  margin: 0 16px;
}
.breadcrumb__arrow::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0;
  width: 8px;
  height: 8px;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #CCCCCC;
  transform: translate3d(0, 0, 0) rotate(45deg);
}

.breadcrumb__label {
  display: inline-block;
  color: #111111;
  font-size: 13px;
  line-height: 20px;
}

.breadcrumb__item {
  display: inline-block;
  line-height: 20px;
}

a.breadcrumb__item-link {
  display: inline-block;
  color: #111111;
  font-size: 13px;
  line-height: 20px;
  text-decoration: none;
}

.breadcrumb__page-number {
  display: inline-block;
  color: #111111;
  font-size: 13px;
  line-height: 20px;
}

/*------------------------------
 地域から探すページ
------------------------------*/
/* area-content
------------------------------*/
.area-content {
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-weight: 500;
}

.area-content__inner {
  width: 1200px;
  margin: 0 auto;
}

.area-content__title {
  color: #111111;
  font-size: 32px;
  font-weight: 700;
  line-height: 46px;
  letter-spacing: 1px;
  text-align: left;
  padding: 0;
  margin: 0 auto 16px;
}

/* recommendation
------------------------------*/
.area-content__recommendation {
  width: 1200px;
  margin: 0 auto 100px;
}
.area-content__recommendation .swiper-button-next,
.area-content__recommendation .swiper-button-prev {
  background-color: #F5F5F5;
}
.area-content__recommendation .content__item__button {
  max-width: 280px;
  margin: 0 auto;
}

.area-content__recommendation-title {
  position: relative;
  color: #00146E;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px;
  letter-spacing: 2px;
  text-align: center;
  padding: 10px 0 0 0;
  margin: 0 auto 28px;
  box-sizing: border-box;
}

.area-content__recommendation-content {
  position: relative;
}

/* エリア別ページ */
.region-page .area-content__recommendation {
  margin-bottom: 60px;
}
.region-page .block-thumbnail-t.swiper-container .block-thumbnail-t--items.swiper-wrapper {
  flex-flow: row wrap;
  margin-bottom: 0;
}
.region-page .block-thumbnail-t.swiper-container .block-thumbnail-t--item {
  margin-right: 25px;
  margin-bottom: 40px;
}
.region-page .block-thumbnail-t.swiper-container .block-thumbnail-t--item:nth-child(5n) {
  margin-right: 0;
}

/* 地図エリア
------------------------------*/
.area-svg-map {
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-weight: 500;
  background-image: url(/cms/area/img/repeat_grid.jpg);
  background-size: 500px 500px;
  background-position: top center;
  background-repeat: repeat;
  margin: 0 auto 72px;
}
.area-svg-map a {
  text-decoration: none;
}

.area-svg-map__inner {
  position: relative;
  width: 1200px;
  padding: 40px 0;
  margin: 0 auto;
  box-sizing: border-box;
  z-index: 1;
}

.area-svg-map__box {
  display: flex;
  justify-content: center;
  align-items: center;
}

.svg-map__box svg,
.area-svg-map__svg-content {
  max-width: 100%;
  margin: 0 auto;
}

.svg-map__box svg a.svg-map-link:hover {
  opacity: 1;
}

/*------------------------------
 地域から探す（地方）ページ
------------------------------*/
.region-page .area-svg-map {
  margin-bottom: 0;
}
.region-page .area-svg-map__inner {
  padding: 0;
}

/* 九州エリア */
.area-kyushu-page .area-svg-map__box {
  justify-content: flex-end;
}
.area-kyushu-page .area-svg-map__inner {
  padding: 0 0 40px;
}

/* feature
------------------------------*/
.area-content__feature {
  background-color: #F7F7F7;
  padding: 70px 0 41px;
  margin-bottom: 72px;
}

.area-content__feature-title {
  position: relative;
  color: #00146E;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px;
  letter-spacing: 2px;
  text-align: center;
  padding: 10px 0 0 0;
  margin: 0 auto 28px;
}

.area-content__feature-content {
  position: relative;
}

.area-content__feature-content-inner {
  width: 1200px;
  margin: 0 auto;
  overflow: hidden;
}

.area-content__feature-item-box {
  display: flex;
  flex-flow: row wrap;
}

.area-content__feature-item {
  width: 374px;
  margin-right: 39px;
  margin-bottom: 39px;
}
.area-content__feature-item:nth-child(3n) {
  margin-right: 0;
}

a.area-content__feature-link {
  display: block;
  background-color: #FFFFFF;
}

.area-content__feature-picture {
  display: block;
  width: 100%;
  height: 257px;
  font-size: 0;
  line-height: 0;
  text-align: center;
}

.area-content__feature-picture-image {
  width: 100%;
  height: 100%;
  vertical-align: top;
  object-fit: cover;
}

.area-content__feature-item-title {
  color: #111111;
  font-size: 18px;
  font-weight: 500;
  line-height: 26px;
  text-align: center;
  padding: 16px 10px 14px;
}

.area-content__feature-item-title-inner {
  display: inline-block;
}

/*------------------------------
 地域から探す（都道府県）ページ
------------------------------*/
/* main-visual
------------------------------*/
.main-visual {
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-weight: 500;
  margin: 0 auto;
}

.main-visual__inner {
  position: relative;
  width: 100%;
  height: 500px;
  overflow: hidden;
}

.main-visual__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.35);
  z-index: 2;
}

.main-visual__title {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #FFFFFF;
  text-align: center;
  transform: translate(-50%, -50%);
  margin: 0 auto;
  z-index: 3;
}

.main-visual__title-text {
  display: block;
  font-size: 45px;
  font-weight: 500;
  line-height: 65px;
  letter-spacing: 1px;
  margin-bottom: 4px;
}

.main-visual__title-en-text {
  display: block;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 2px;
}

.main-visual__picture-box {
  display: block;
  position: relative;
  font-size: 0;
  line-height: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.main-visual__picture-image {
  width: 100%;
  height: 100%;
  vertical-align: top;
  object-fit: cover;
}

/* content
------------------------------*/
.content {
  color: #111111;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-weight: 500;
  margin: 0 auto;
}

.content__bg-gray {
  background-color: #F7F7F7;
  padding: 52px 0;
}

.content__inner {
  width: 1200px;
  margin: 0 auto;
}

.content__column-item-box {
  display: flex;
  flex-flow: row wrap;
  background-color: #FFFFFF;
  padding: 32px 40px;
}

.content__column-item:first-child {
  width: 560px;
  margin-right: 60px;
}
.content__column-item:last-child {
  width: calc(100% - 620px);
}

.content__column-item-picture-box {
  display: block;
  width: 100%;
  height: 331px;
  font-size: 0;
  line-height: 0;
  text-align: center;
}

.content__column-item-picture-image {
  width: 100%;
  height: 100%;
  vertical-align: top;
  object-fit: cover;
}

.content__column-item-title {
  color: #111111;
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
  text-align: left;
  padding: 0;
  margin: 0 auto 12px;
}
.content__column-item-title::before {
  display: none;
}

.content__column-item-text {
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0.5px;
  margin-bottom: 20px;
}

.content__column-item-button {
  width: 373px;
  margin: 0 auto 0 0;
}

a.content__column-item-button-link {
  display: block;
  position: relative;
  width: 100%;
  color: #4783F5;
  font-size: 16px;
  font-weight: 600;
  line-height: 52px;
  text-align: center;
  text-decoration: none;
  background-color: #FFFFFF;
  border: 1px solid #4783F5;
  border-radius: 4px;
  transition: opacity 0.3s ease 0s;
}
a.content__column-item-button-link:hover {
  opacity: 0.8;
}
a.content__column-item-button-link::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
  width: 15px;
  height: 15px;
  background-image: url(/cms/area/img/icon_right_arrow.png);
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
  transform: translateY(-50%);
}

/* 一覧ブロック */
.content__box {
  margin: 0 auto;
}
.content__box[tabindex="-1"]:focus {
  outline: none;
  box-shadow: 0 0 2px 4px rgba(0, 123, 255, 0.3); /* 青系のぼやけた影 */
  transition: box-shadow 0.2s ease;
}
.content__title {
  position: relative;
  color: #00146E;
  font-size: 20px;
  font-weight: 600;
  line-height: 29px;
  text-align: left;
  border-bottom: 1px solid #00146E;
  padding: 0 0 9px 0;
  margin: 0 auto 32px;
  box-sizing: border-box;
}

.content__item-box {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
}

.content__item {
  width: 373px;
  margin-right: 40px;
  margin-bottom: 52px;
}
.content__item:nth-child(3n) {
  margin-right: 0;
}

.content__item-image-box {
  width: 100%;
  height: 272px;
  font-size: 0;
  line-height: 0;
  margin-bottom: 12px;
}

.content__item-image {
  width: 100%;
  height: 100%;
  vertical-align: top;
  object-fit: cover;
}

.content__item-title {
  color: #111111;
  text-align: center;
  padding: 0;
  margin: 0 auto 8px;
}

.content__item-title-furigana {
  display: block;
  font-size: 11px;
  font-weight: 500;
  line-height: 16px;
}

.content__item-title-text {
  display: block;
  font-size: 19px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: 0.3px;
}

.content__item-text {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  font-size: 14px;
  line-height: 22px;
  letter-spacing: 0.5px;
  margin-bottom: 20px;
  overflow: hidden;
}

.content__item__button {
  width: 100%;
}

a.content__item__button-link {
  display: block;
  position: relative;
  width: 100%;
  color: #4783F5;
  font-size: 17px;
  font-weight: 600;
  line-height: 48px;
  text-align: center;
  text-decoration: none;
  background-color: #FFFFFF;
  border: 1px solid #4783F5;
  border-radius: 4px;
  transition: opacity 0.3s ease 0s;
  box-sizing: border-box;
}
a.content__item__button-link:hover {
  opacity: 0.8;
}
a.content__item__button-link::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
  width: 15px;
  height: 15px;
  background-image: url(/cms/area/img/icon_right_arrow.png);
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
  transform: translateY(-50%);
}

/* 自治体を選ぶ
------------------------------*/
.municipality {
  color: #111111;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-weight: 500;
  margin: 60px auto 40px;
}

.municipality__inner {
  width: 100%;
}

.municipality__title {
  position: relative;
  color: #00146E;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px;
  letter-spacing: 2px;
  text-align: center;
  padding: 10px 0 0 0;
  margin: 0 auto 28px;
}
.municipality__title::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 52px;
  height: 6px;
  background-image: url(/cms/area/img/icon_title_top.png);
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
  transform: translateX(-50%);
  margin: 0;
}

.municipality__scroller {
  background-color: #F7F7F7;
  padding: 0 17px;
}

.municipality__item-box {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 100%;
  height: 48px;
  background-color: #F7F7F7;
  box-sizing: border-box;
  overflow: auto;
}

.municipality__item {
  flex: none;
  margin-right: 50px;
}
.municipality__item:last-child {
  margin-right: 0;
}

a.municipality__item-link {
  position: relative;
  color: #111111;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 1px;
  text-decoration: none;
  padding-right: 20px;
}
a.municipality__item-link::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 11px;
  height: 6px;
  background-image: url(/cms/area/img/icon_bottom_arrow.png);
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
  transform: translateY(-50%);
}

/* 地図エリア（都道府県ページ）
------------------------------*/
.svg-map {
  background-image: url(/cms/area/img/repeat_grid.jpg);
  background-size: 500px 500px;
  background-position: top center;
  background-repeat: repeat;
  margin: 28px auto 0;
}
.svg-map a {
  text-decoration: none;
}

.svg-map__inner {
  position: relative;
  width: 1200px;
  padding: 60px 0;
  margin: 0 auto;
  box-sizing: border-box;
  z-index: 1;
}

.svg-map__title {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 78px;
  left: 50%;
  width: 150px;
  height: 46px;
  text-align: center;
  background-image: url(/cms/area/img/icon_map_title_bg.png);
  background-size: 100% auto;
  background-position: center center;
  background-repeat: no-repeat;
  transform: translateX(-328px);
  padding: 0;
  margin: 0;
}
.svg-map__title::before {
  display: none;
}

.svg-map__title-text {
  display: inline-block;
  color: #00146E;
  font-size: 22px;
  font-weight: 700;
  line-height: 29px;
}

.svg-map__box {
  display: flex;
  justify-content: center;
  align-items: center;
}

.svg-map__svg-content {
  margin: 0 auto;
}

/* 都道府県（北海道）のみ */
.area-hokkaido-page #svg-map-hokkaido-all .svg-map__inner {
  padding: 135px 0 145px;
}
.area-hokkaido-page #svg-map-hokkaido-1 {
  margin-top: 0;
}
.area-hokkaido-page #svg-map-hokkaido-1 .svg-map__inner {
  padding: 0 0 180px;
}
.area-hokkaido-page #svg-map-hokkaido-2 {
  margin-top: 0;
}
.area-hokkaido-page #svg-map-hokkaido-2 .svg-map__inner {
  padding: 0 0 206px;
}
.area-hokkaido-page #svg-map-hokkaido-3 {
  margin-top: 0;
}
.area-hokkaido-page #svg-map-hokkaido-3 .svg-map__inner {
  padding: 0 0 302px;
}
.area-hokkaido-page #svg-map-hokkaido-4 {
  margin-top: 0;
}
.area-hokkaido-page #svg-map-hokkaido-4 .svg-map__inner {
  padding: 0 0 206px;
}
.area-hokkaido-page .svg-map__title {
  top: 92px;
  transform: translateX(-402px);
}

/* 他の地域から探す
------------------------------*/
.other-search {
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-weight: 500;
  background-image: url(/cms/area/img/repeat_grid.jpg);
  background-size: 500px 500px;
  background-position: top center;
  background-repeat: repeat;
  padding-bottom: 103px;
}

.other-search__inner {
  width: 1200px;
  margin: 0 auto;
}

.other-search__bg {
  background-color: #FFFFFF;
  border-radius: 8px;
  padding: 40px 40px 32px;
}

.other-search__box {
  width: 100%;
}

.other-search__title {
  position: relative;
  color: #00146E;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px;
  letter-spacing: 2px;
  text-align: center;
  padding: 10px 0 0 0;
  margin: 0 auto 28px;
}
.other-search__title::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 52px;
  height: 6px;
  background-image: url(/cms/area/img/icon_title_top.png);
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
  transform: translateX(-50%);
  margin: 0;
}

.other-search__item-box {
  display: flex;
  flex-flow: row wrap;
}

.other-search__item {
  width: 208px;
  margin-right: 20px;
  margin-bottom: 16px;
}
.other-search__item:nth-child(5n) {
  margin-right: 0;
}

.other-search__item-button {
  width: 100%;
}

a.other-search__item-button-link {
  display: block;
  position: relative;
  width: 100%;
  color: #4783F5;
  font-size: 16px;
  font-weight: 600;
  line-height: 52px;
  letter-spacing: 0.5px;
  text-align: center;
  text-decoration: none;
  background-color: #FFFFFF;
  border: 1px solid #4783F5;
  border-radius: 3px;
  transition: opacity 0.3s ease 0s;
}
a.other-search__item-button-link:hover {
  opacity: 0.8;
}
a.other-search__item-button-link::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
  width: 15px;
  height: 15px;
  background-image: url(/cms/area/img/icon_right_arrow.png);
  background-size: 100% auto;
  background-position: top center;
  background-repeat: no-repeat;
  transform: translateY(-50%);
}

/* swiper
------------------------------*/
.area-swiper {
  position: relative;
}

.area-swiper-wrapper {
  width: 100%;
}

.area-swiper__inner {
  overflow: hidden;
}

.area-swiper .swiper-button-prev,
.area-content__recommendation .swiper-button-prev {
  left: -44px;
  background-color: #FFFFFF;
  border-radius: 3px;
}

.area-swiper .swiper-button-next,
.area-content__recommendation .swiper-button-next {
  right: -44px;
  background-color: #FFFFFF;
  border-radius: 3px;
}

/*------------------------------
 SP（スマートフォン）
------------------------------*/
@media screen and (max-width: 767px) {
  /* 767pxまでの幅の場合に適応される */
  /*------------------------------
   共通・既存調整修正
  ------------------------------*/
  div.wrapper_ .pc {
    display: none;
  }
  div.wrapper_ .sp {
    display: block;
  }

  /* headerの読み込み時のかくつき調整用 */
  #header_wrap {
    min-height: 100px;
  }

  /* パンくず
  ------------------------------*/
  .breadcrumb {
    width: 100%;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
    font-weight: 500;
    padding: 0 16px;
    margin-bottom: 16px;
    box-sizing: border-box;
  }

  .breadcrumb__scroller {
    width: 100%;
    min-height: 40px;
    overflow: auto;
  }
  .breadcrumb__scroller::-webkit-scrollbar {
    display: none;
  }
  .breadcrumb__scroller .simplebar-content {
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    min-height: 40px;
    padding: 8px 0 7px;
    margin: 0 auto;
    box-sizing: border-box;
  }

  .breadcrumb__inner {
    flex-flow: row nowrap;
    justify-content: flex-start;
    width: 100%;
    min-height: 40px;
    overflow: auto hidden;
  }

  .breadcrumb__arrow {
    flex: none;
    line-height: 18px;
    margin: 0 12px;
  }

  .breadcrumb__label {
    flex: none;
    font-size: 12px;
    line-height: 18px;
  }

  .breadcrumb__item {
    flex: none;
    height: 18px;
    line-height: 18px;
  }

  a.breadcrumb__item-link {
    color: #209191;
    font-size: 12px;
    line-height: 18px;
  }

  .breadcrumb__page-number {
    flex: none;
    font-size: 12px;
    line-height: 18px;
  }

  /*------------------------------
   地域から探すページ
  ------------------------------*/
  /* area-content
  ------------------------------*/
  .area-content__inner {
    width: auto;
  }

  .area-content__title {
    font-size: 22px;
    line-height: 32px;
    margin: 0 16px 12px;
  }

  /* SP地域エリアボタン */
  .area-content__area-box {
    background-image: url(/cms/area/img/repeat_grid.jpg);
    background-size: 500px 500px;
    background-position: top center;
    background-repeat: repeat;
    padding: 32px 25px 12px;
    margin: 0 auto 40px;
  }

  .area-content__area {
    margin-bottom: 12px;
  }

  .area-content__area-title {
    border-color: #392D27;
    border-style: solid;
    border-width: 1px 0 1px 0;
    padding: 2px 0;
    margin: 0 auto 12px;
  }
  .area-content__area-title::before {
    display: none;
  }

  a.area-content__area-link {
    display: block;
    position: relative;
    color: #392D27;
    font-size: 16px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: 0.4px;
    text-align: left;
    text-decoration: none;
    border-color: #392D27;
    border-style: solid;
    border-width: 1px 0 1px 0;
    padding: 11px 35px 9px 12px;
    box-sizing: border-box;
  }
  #area-hokkaido a.area-content__area-link {
    background-color: rgba(125, 143, 165, 0.5);
  }
  #area-tohoku a.area-content__area-link {
    background-color: rgba(181, 208, 226, 0.5);
  }
  #area-kanto a.area-content__area-link {
    background-color: rgba(193, 180, 208, 0.5);
  }
  #area-chubu a.area-content__area-link {
    background-color: rgba(205, 226, 170, 0.5);
  }
  #area-kinki a.area-content__area-link {
    background-color: rgba(239, 218, 148, 0.5);
  }
  #area-chugoku a.area-content__area-link {
    background-color: rgba(237, 190, 174, 0.5);
  }
  #area-shikoku a.area-content__area-link {
    background-color: rgba(234, 169, 101, 0.5);
  }
  #area-kyushu a.area-content__area-link {
    background-color: rgba(207, 120, 111, 0.5);
  }
  #area-okinawa a.area-content__area-link {
    background-color: rgba(208, 73, 59, 0.5);
  }
  a.area-content__area-link::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 12px;
    width: 22px;
    height: 22px;
    background-image: url(/cms/area/img/icon_circle_right_arrow.png);
    background-size: 100% auto;
    background-position: top left;
    background-repeat: no-repeat;
    transform: translateY(-50%);
  }

  .area-content__area-text {
    display: inline-block;
  }

  .area-content__area-item-box {
    display: flex;
    flex-flow: row wrap;
  }

  .area-content__area-item {
    width: calc(50% - 6px);
    margin-right: 12px;
    margin-bottom: 8px;
  }
  .area-content__area-item:nth-child(2n) {
    margin-right: 0;
  }

  a.area-content__area-item-link {
    display: block;
    position: relative;
    color: #392D27;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: 0.4px;
    background-color: #FFFFFF;
    border: 1px solid #392D27;
    border-radius: 24px;
    padding: 10px 28px 10px 16px;
    box-sizing: border-box;
  }
  a.area-content__area-item-link::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 16px;
    width: 11.5px;
    height: 11.5px;
    background-image: url(/cms/area/img/icon_right_arrow_black.png);
    background-size: 100% auto;
    background-position: top left;
    background-repeat: no-repeat;
    transform: translateY(-50%);
  }

  .area-content__area-item-text {
    display: inline-block;
  }

  /* recommendation
  ------------------------------*/
  .area-content__recommendation {
    width: auto;
    margin-bottom: 40px;
  }
  .area-content__recommendation .block-thumbnail-t.swiper-container {
    padding: 0 16px;
    margin: 0;
    box-sizing: border-box;
    overflow: initial;
  }

  .area-content__recommendation-title {
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 12px;
  }

  .area-content__recommendation-content {
    margin-bottom: 20px;
  }

  /* エリア別ページ */
  .region-page .area-content__recommendation {
    margin: 0 0 28px;
  }
  .region-page .area-content__recommendation-title {
    margin-bottom: 20px;
  }
  .region-page .block-thumbnail-t.swiper-container .block-thumbnail-t--items.swiper-wrapper {
    flex-flow: row wrap;
    margin-bottom: 0;
  }
  .region-page .block-thumbnail-t.swiper-container .block-thumbnail-t--item {
    width: calc(50% - 4px);
    flex: 0 0 calc(50% - 4px);
    max-width: calc(50% - 4px);
    margin-right: 8px;
    margin-bottom: 12px;
  }
  .region-page .block-thumbnail-t.swiper-container .block-thumbnail-t--item:nth-child(5n) {
    margin-right: 8px;
  }
  .region-page .block-thumbnail-t.swiper-container .block-thumbnail-t--item:nth-child(2n) {
    margin-right: 0;
  }

  /* 地図エリア
  ------------------------------*/
  .area-svg-map {
    display: none;
  }
  /*------------------------------
   地域から探す（地方）ページ
  ------------------------------*/
  .region-page .area-content__area-box {
    margin-bottom: 0;
  }

  /* feature
  ------------------------------*/
  .area-content__feature {
    padding: 36px 0 36px;
    margin-bottom: 40px;
  }

  .area-content__feature-title {
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 16px;
  }

  .area-content__feature-content {
    width: 100%;
  }

  .area-content__feature-content-inner {
    width: auto;
    padding: 0 15px;
  }

  .area-content__feature-item-box {
    width: 100%;
    flex-wrap: nowrap;
  }

  .area-content__feature-item {
    width: calc(50% - 8px);
    margin-right: 0;
    margin-bottom: 0;
  }
  .area-content__feature-picture {
    height: 31.47vw;
  }

  .area-content__feature-item-title {
    font-size: 12px;
    line-height: 17px;
    text-align: center;
    padding: 9px 5px 7px;
  }

  /*------------------------------
   地域から探す（都道府県）ページ
  ------------------------------*/
  /* main-visual
  ------------------------------*/
  .main-visual__inner {
    height: 163px;
  }

  .main-visual__title-text {
    font-size: 28px;
    font-weight: 600;
    line-height: 40px;
  }

  .main-visual__title-en-text {
    font-size: 12px;
    line-height: 17px;
  }

  /* content
  ------------------------------*/
  .content__bg-gray {
    padding: 20px 25px 20px;
  }

  .content__inner {
    width: auto;
  }

  .content__column-item-box {
    display: block;
    background-color: rgba(255, 255, 255, 0);
    padding: 0;
  }

  .content__column-item:first-child {
    width: auto;
    margin-right: 0;
    margin-bottom: 12px;
  }
  .content__column-item:last-child {
    width: auto;
  }

  .content__column-item-picture-box {
    height: auto;
  }

  .content__column-item-title {
    display: none;
  }

  .content__column-item-text {
    display: none;
  }

  .content__column-item-button {
    width: 100%;
    margin: 0 auto;
  }

  a.content__column-item-button-link:hover {
    opacity: 1;
  }
  a.content__column-item-button-link::before {
    right: 18px;
  }

  /* 一覧ブロック */
  .content__box {
    margin: 0 17px 8px;
  }

  .content__title {
    font-size: 17px;
    line-height: 25px;
    padding: 0 0 5px 0;
    margin-bottom: 20px;
  }

  .content__item {
    width: calc(50% - 6px);
    margin-right: 12px;
    margin-bottom: 24px;
  }
  .content__item:nth-child(3n) {
    margin-right: 12px;
  }
  .content__item:nth-child(2n) {
    margin-right: 0;
  }

  .content__item-image-box {
    height: 33.6vw;
  }

  .content__item-title-text {
    font-size: 17px;
    line-height: 25px;
  }

  .content__item-text {
    -webkit-line-clamp: 6;
    font-size: 13px;
    line-height: 22px;
    letter-spacing: 0.2px;
    margin-bottom: 12px;
  }

  a.content__item__button-link {
    font-size: 16px;
  }
  a.content__item__button-link:hover {
    opacity: 1;
  }
  a.content__item__button-link::before {
    right: 10px;
  }

  /* 自治体を選ぶ
  ------------------------------*/
  .municipality {
    margin: 36px auto 16px;
  }

  .municipality__title {
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 16px;
  }
  .municipality__item-box {
    justify-content: flex-start;
    height: 56px;
  }
  .municipality__item-box .simplebar-content {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    width: 100%;
    height: 56px;
    background-color: #F7F7F7;
    box-sizing: border-box;
  }
  .municipality__item-box::-webkit-scrollbar {
    display: none;
  }

  .municipality__item {
    margin-right: 20px;
  }
  .municipality__item:last-child {
    margin-right: 0;
  }

  a.municipality__item-link {
    font-size: 14px;
    line-height: 20px;
    padding-right: 15px;
  }
  a.municipality__item-link::before {
    width: 9px;
    height: 5px;
  }

  /* 地図エリア（都道府県ページ）
  ------------------------------*/
  .svg-map {
    display: none;
  }
  .svg-map__inner {
    width: auto;
  }

  /* 他の地域から探す
  ------------------------------*/
  .other-search {
    padding: 32px 16px 24px;
    margin-top: 8px;
  }

  .other-search__inner {
    width: auto;
  }

  .other-search__bg {
    background-color: rgba(255, 255, 255, 0);
    border-radius: 0;
    padding: 0;
  }

  .other-search__title {
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 20px;
  }
  .other-search__item {
    width: calc(50% - 4px);
    margin-right: 8px;
    margin-bottom: 8px;
  }
  .other-search__item:nth-child(5n) {
    margin-right: 8px;
  }
  .other-search__item:nth-child(2n) {
    margin-right: 0;
  }

  a.other-search__item-button-link {
    font-size: 15px;
    line-height: 46px;
    text-align: left;
    padding-left: 12px;
    box-sizing: border-box;
  }
  a.other-search__item-button-link:hover {
    opacity: 1;
  }
  a.other-search__item-button-link::before {
    right: 10px;
  }

  /* swiper
  ------------------------------*/
  .area-swiper .swiper-buttons,
  .area-content__recommendation .swiper-buttons {
    display: none;
  }

  /* scroller */
  .area-swiper-scroller-sp {
    padding: 20px 0 20px;
  }
  .area-swiper-scroller-sp .area-swiper {
    overflow: hidden;
  }
  .area-swiper-scroller-sp .area-swiper__inner {
    padding: 0 25px;
    overflow: initial;
  }
  .area-swiper-scroller-sp .content__column-item-box {
    width: 100%;
  }
}

/*------------------------------
 タブレット（768px〜1024px）
------------------------------*/
@media screen and (min-width: 768px) and (max-width: 1024px) {
  /*------------------------------
   共通・既存調整修正
  ------------------------------*/
  div.wrapper_ .pc {
    display: none;
  }
  div.wrapper_ .sp {
    display: block;
  }

  /* パンくず
  ------------------------------*/
  .breadcrumb {
    width: 100%;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
    font-weight: 500;
    padding: 0 16px;
    margin-bottom: 16px;
    box-sizing: border-box;
  }

  .breadcrumb__scroller {
    width: 100%;
    min-height: 40px;
    overflow: auto;
  }
  .breadcrumb__scroller::-webkit-scrollbar {
    display: none;
  }
  .breadcrumb__scroller .simplebar-content {
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    min-height: 40px;
    padding: 8px 0 7px;
    margin: 0 auto;
    box-sizing: border-box;
  }

  .breadcrumb__inner {
    flex-flow: row nowrap;
    justify-content: flex-start;
    width: 100%;
    min-height: 40px;
    overflow: auto hidden;
  }

  .breadcrumb__arrow {
    flex: none;
    line-height: 18px;
    margin: 0 12px;
  }

  .breadcrumb__label {
    flex: none;
    font-size: 12px;
    line-height: 18px;
  }

  .breadcrumb__item {
    flex: none;
    height: 18px;
    line-height: 18px;
  }

  a.breadcrumb__item-link {
    color: #209191;
    font-size: 12px;
    line-height: 18px;
  }

  .breadcrumb__page-number {
    flex: none;
    font-size: 12px;
    line-height: 18px;
  }

  /*------------------------------
   地域から探すページ
  ------------------------------*/
  /* area-content
  ------------------------------*/
  .area-content__inner {
    width: auto;
  }
  .area-content__title {
    font-size: 22px;
    line-height: 32px;
    margin: 0 16px 12px;
  }
  .area-content__inner {
    width: auto;
  }    
  .area-content__area-box {
    background-image: url(/cms/area/img/repeat_grid.jpg);
    background-size: 500px 500px;
    background-position: top center;
    background-repeat: repeat;
    padding: 32px 25px 12px;
    margin: 0 auto 40px;
  }

  .area-content__area {
    margin-bottom: 12px;
  }

  .area-content__area-title {
    border-color: #392D27;
    border-style: solid;
    border-width: 1px 0 1px 0;
    padding: 2px 0;
    margin: 0 auto 12px;
  }
  .area-content__area-title::before {
    display: none;
  }

  a.area-content__area-link {
    display: block;
    position: relative;
    color: #392D27;
    font-size: 16px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: 0.4px;
    text-align: left;
    text-decoration: none;
    border-color: #392D27;
    border-style: solid;
    border-width: 1px 0 1px 0;
    padding: 11px 35px 9px 12px;
    box-sizing: border-box;
  }
  #area-hokkaido a.area-content__area-link {
    background-color: rgba(125, 143, 165, 0.5);
  }
  #area-tohoku a.area-content__area-link {
    background-color: rgba(181, 208, 226, 0.5);
  }
  #area-kanto a.area-content__area-link {
    background-color: rgba(193, 180, 208, 0.5);
  }
  #area-chubu a.area-content__area-link {
    background-color: rgba(205, 226, 170, 0.5);
  }
  #area-kinki a.area-content__area-link {
    background-color: rgba(239, 218, 148, 0.5);
  }
  #area-chugoku a.area-content__area-link {
    background-color: rgba(237, 190, 174, 0.5);
  }
  #area-shikoku a.area-content__area-link {
    background-color: rgba(234, 169, 101, 0.5);
  }
  #area-kyushu a.area-content__area-link {
    background-color: rgba(207, 120, 111, 0.5);
  }
  #area-okinawa a.area-content__area-link {
    background-color: rgba(208, 73, 59, 0.5);
  }
  a.area-content__area-link::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 12px;
    width: 22px;
    height: 22px;
    background-image: url(/cms/area/img/icon_circle_right_arrow.png);
    background-size: 100% auto;
    background-position: top left;
    background-repeat: no-repeat;
    transform: translateY(-50%);
  }

  .area-content__area-text {
    display: inline-block;
  }

  .area-content__area-item-box {
    display: flex;
    flex-flow: row wrap;
  }

  .area-content__area-item {
    width: calc(50% - 6px);
    margin-right: 12px;
    margin-bottom: 8px;
  }
  .area-content__area-item:nth-child(2n) {
    margin-right: 0;
  }

  a.area-content__area-item-link {
    display: block;
    position: relative;
    color: #392D27;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: 0.4px;
    background-color: #FFFFFF;
    border: 1px solid #392D27;
    border-radius: 24px;
    padding: 10px 28px 10px 16px;
    box-sizing: border-box;
  }
  a.area-content__area-item-link::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 16px;
    width: 11.5px;
    height: 11.5px;
    background-image: url(/cms/area/img/icon_right_arrow_black.png);
    background-size: 100% auto;
    background-position: top left;
    background-repeat: no-repeat;
    transform: translateY(-50%);
  }

  .area-content__area-item-text {
    display: inline-block;
  }

  .area-content__recommendation {
    width: auto;
    margin-bottom: 40px;
  }
  .area-content__recommendation-content {
    margin-bottom: 20px;
  }
  /* recommendation
  ------------------------------*/
  .area-content__recommendation {
    width: auto;
    margin-bottom: 40px;
  }
  .area-content__recommendation .block-thumbnail-t.swiper-container {
    padding: 0 16px;
    margin: 0;
    box-sizing: border-box;
    overflow: initial;
  } 
  /* エリア別ページ */
  .region-page .area-content__recommendation {
    margin: 0 0 28px;
  }
  .region-page .area-content__recommendation-title {
    margin-bottom: 20px;
  }
  .region-page .block-thumbnail-t.swiper-container .block-thumbnail-t--items.swiper-wrapper {
    flex-flow: row wrap;
    margin-bottom: 0;
  }
  .region-page .block-thumbnail-t.swiper-container .block-thumbnail-t--item {
    width: calc(50% - 4px);
    flex: 0 0 calc(50% - 4px);
    max-width: calc(50% - 4px);
    margin-right: 8px;
    margin-bottom: 12px;
  }
  .region-page .block-thumbnail-t.swiper-container .block-thumbnail-t--item:nth-child(5n) {
    margin-right: 8px;
  }
  .region-page .block-thumbnail-t.swiper-container .block-thumbnail-t--item:nth-child(2n) {
    margin-right: 0;
  }  


  /*------------------------------
   地域から探す（地方）ページ
  ------------------------------*/
  .area-content__feature-content {
    width: 100%;
  }

  .area-content__feature-content-inner {
    width: auto;
    padding: 0 15px;
  }  
  .area-content__feature-item-box {
    width: 100%;
    flex-wrap: wrap;
    gap: 16px;
  }

  .area-content__feature-item {
    width: calc(50% - 8px);
    margin-right: 0;
    margin-bottom: 0;
  }
  /* 地図エリア（都道府県ページ）
  ------------------------------*/
  .svg-map {
    display: none;
  }
  .svg-map__inner {
    width: auto;
  }  
  /*------------------------------
   地域から探す（都道府県）ページ
  ------------------------------*/

  .content__inner {
    width: auto;
  }
  .content__column-item-box {
    display: block;
    background-color: rgba(255, 255, 255, 0);
    padding: 0;
  }

  .content__column-item:first-child {
    width: auto;
    margin-right: 0;
    margin-bottom: 12px;
  }
  .content__column-item:last-child {
    width: auto;
  }

  .content__column-item-picture-box {
    height: auto;
  }

  .content__column-item-title {
    display: none;
  }

  .content__column-item-text {
    display: none;
  }

  .content__column-item-button {
    width: 100%;
    margin: 0 auto;
  }


  .content__box {
    margin: 0 17px 8px;
  }
  .content__item {
    width: calc(50% - 6px);
    margin-right: 12px;
    margin-bottom: 24px;
  }
  .content__item:nth-child(3n) {
    margin-right: 12px;
  }  
  .content__item:nth-child(2n) {
    margin-right: 0;
  }
  .municipality {
    margin: 36px auto 16px;
  }

  .municipality__title {
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 16px;
  }
  .municipality__item-box {
    justify-content: flex-start;
    height: 56px;
  }
  .municipality__item-box .simplebar-content {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    width: 100%;
    height: 56px;
    background-color: #F7F7F7;
    box-sizing: border-box;
  }
  .municipality__item-box::-webkit-scrollbar {
    display: none;
  }

  .municipality__item {
    margin-right: 20px;
  }
  .municipality__item:last-child {
    margin-right: 0;
  }

  a.municipality__item-link {
    font-size: 14px;
    line-height: 20px;
    padding-right: 15px;
  }
  a.municipality__item-link::before {
    width: 9px;
    height: 5px;
  }


  /* 他の地域から探す
  ------------------------------*/
  .other-search {
    padding: 32px 16px 24px;
    margin-top: 8px;
  }
  .other-search__inner {
    width: auto;
  }
  .other-search__bg {
    background-color: rgba(255, 255, 255, 0);
    border-radius: 0;
    padding: 0;
  }  
  .other-search__item {
    width: calc(50% - 4px);
    margin-right: 8px;
    margin-bottom: 8px;
  }
  .other-search__item:nth-child(5n) {
    margin-right: 8px;
  }
  .other-search__item:nth-child(2n) {
    margin-right: 0;
  }
  /* swiper
  ------------------------------*/
  .swiper-buttons {
    display: none;
  }

  /* scroller */
  .area-swiper-scroller-sp {
    padding: 20px 0 20px;
  }
  .area-swiper-scroller-sp .area-swiper {
    overflow: hidden;
  }
  .area-swiper-scroller-sp .area-swiper__inner {
    padding: 0 25px;
    overflow: initial;
  }
  .area-swiper-scroller-sp .content__column-item-box {
    width: 100%;
  }  
}
