/*-----------------------
mixin
-------------------------*/
/*-----------------------
colors
-------------------------*/
/*-----------------------
common
-------------------------*/
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .is-sp {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .is-pc {
    display: none;
  }
}
img {
  width: 100%;
}

*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/*-----------------------
neighbor-info
-------------------------*/
.page-nearby-info {
  font-size: 1rem;
  color: #5C3F1C;
}

@media screen and (min-width: 1920px) {
  .info-wrapper {
    padding: 0 18.75%;
    margin-top: 6.25rem;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .info-wrapper {
    padding: 0 18.75%;
    margin-top: 6.25rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .info-wrapper {
    padding: 0 18.75%;
    margin-top: 1.875rem;
  }
}
@media screen and (max-width: 767px) {
  .info-wrapper {
    padding: 0 0.9375rem;
    margin-top: 1.875rem;
  }
}

.info-title-container {
  text-align: center;
}

.info-title {
  position: relative;
  display: inline-block;
  font-size: 3.125rem;
  font-family: "Yu Mincho", serif;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: 0.1075rem;
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .info-title {
    font-size: 3.125rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .info-title {
    font-size: 2.375rem;
  }
}
@media screen and (max-width: 767px) {
  .info-title {
    font-size: 2.375rem;
  }
}
.info-title::after {
  content: "";
  position: absolute;
  bottom: 0;
  display: block;
  height: 1px;
  width: 87.1%;
  background: #5C3F1C;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .info-title::after {
    width: 8.125rem;
  }
}
@media screen and (max-width: 767px) {
  .info-title::after {
    width: 8.125rem;
  }
}

.info-menu {
  display: grid;
  gap: 2.08%;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  justify-content: center;
  margin-top: 4.5rem;
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .info-menu {
    margin-top: 3.5rem;
  }
}
@media screen and (max-width: 767px) {
  .info-menu {
    gap: 2.8125rem;
    grid-template-columns: 1fr 1fr;
    margin-top: 1.875rem;
    grid-column-gap: 2.34375rem;
    grid-row-gap: 1.09375rem;
  }
}

.info-item {
  text-align: center;
  border: 0.3125rem solid #5C3F1C;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 7.8125vw;
  box-sizing: border-box;
  transition: background 0.3s ease, box-shadow 0.3s ease;
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .info-item {
    border: 0.2125rem solid #5C3F1C;
  }
}
@media screen and (max-width: 767px) {
  .info-item {
    height: 4.375rem;
    border: 0.185rem solid #5C3F1C;
  }
}
.info-item:hover {
  background: #E9A35B;
}

.info-item_link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: clamp(0.938rem, -0.104rem + 2.17vw, 2.5rem);
  box-sizing: border-box;
  overflow: hidden;
  color: #5C3F1C;
}
@media screen and (max-width: 767px) {
  .info-item_link {
    font-size: 1.25rem;
  }
}

.second-mainvisual {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1920/270;
}
@media screen and (max-width: 767px) {
  .second-mainvisual {
    height: 6.25rem;
  }
}
.second-mainvisual img {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  vertical-align: bottom;
}
.second-mainvisual .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(245, 245, 245, 0.7);
}
.second-mainvisual .main-text {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 18.75%;
  font-family: "Yu Mincho", serif;
  text-shadow: 4px 4px 4px rgba(0, 0, 0, 0.25);
  font-weight: 600;
  font-size: 3rem;
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .second-mainvisual .main-text {
    font-size: 3rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .second-mainvisual .main-text {
    font-size: 1.5rem;
    left: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .second-mainvisual .main-text {
    font-size: 1.5rem;
    left: 1rem;
  }
}

.breadcrumb-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 0;
  padding: 1.875rem 22.375rem;
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .breadcrumb-wrapper {
    padding: 1.09375rem 2.9375rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .breadcrumb-wrapper {
    padding: 1.09375rem 0.9375rem;
  }
}
@media screen and (max-width: 767px) {
  .breadcrumb-wrapper {
    padding: 1.09375rem 0.9rem;
  }
}

.breadcrumb {
  display: flex;
  list-style: none;
}

.breadcrumb-item {
  font-size: 1.125rem;
}
.breadcrumb-item a {
  color: #5C3F1C;
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .breadcrumb-item {
    font-size: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .breadcrumb-item {
    font-size: 1rem;
  }
}

.breadcrumb-item + .breadcrumb-item::before {
  content: ">";
  padding: 0 2rem;
}
@media screen and (max-width: 767px) {
  .breadcrumb-item + .breadcrumb-item::before {
    padding: 0 1.4rem;
  }
}

.breadcrumb-item a {
  text-decoration: none;
}

.breadcrumb-item a:hover {
  text-decoration: underline;
}

.breadcrumb-item.active {
  pointer-events: none;
  cursor: default;
}

/*-----------------------
section
-------------------------*/
.section-wrapper {
  max-width: 1000px;
  margin: 0 auto;
}

.section-title-container {
  text-align: center;
  margin-top: 3.1875rem;
  margin-bottom: 3.1rem;
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .section-title-container {
    margin-top: 1.875rem;
    margin-bottom: 1.3rem;
  }
}
@media screen and (max-width: 767px) {
  .section-title-container {
    margin-top: 1.875rem;
    margin-bottom: 1.875rem;
  }
}

.section-title {
  font-family: "Yu Mincho", serif;
  font-size: 3.125rem;
  letter-spacing: 0.1075rem;
  line-height: 1.5;
  font-weight: 800;
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .section-title {
    font-size: 3.125rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .section-title {
    letter-spacing: 0.0475rem;
    font-size: 2.375rem;
  }
}
@media screen and (max-width: 767px) {
  .section-title {
    font-size: 2.375rem;
  }
}

@media screen and (min-width: 1920px) {
  .inner {
    display: flex;
    max-width: 1000px;
    width: 100%;
    margin: 0 auto;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .inner {
    display: flex;
    margin: 0 auto;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .inner {
    display: flex;
    margin: 0 auto;
  }
}
.inner + .inner {
  padding-top: 3.875rem;
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .inner + .inner {
    padding-top: 1.875rem;
  }
}
@media screen and (max-width: 767px) {
  .inner + .inner {
    padding-top: 1.875rem;
  }
}

.message {
  color: #000;
  font-family: "Yu Mincho", serif;
  width: 50%;
}
@media screen and (max-width: 767px) {
  .message {
    width: 100%;
  }
}

.message_title {
  display: flex;
  align-items: center;
  aspect-ratio: 500/150;
  justify-content: center;
  text-align: center;
  border: 0.3125rem solid #5C3F1C;
  box-sizing: border-box;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  transition: background 0.3s ease, box-shadow 0.3s ease;
}
.message_title:hover {
  background: #E9A35B;
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .message_title {
    border: 0.2125rem solid #5C3F1C;
  }
}
@media screen and (max-width: 767px) {
  .message_title {
    aspect-ratio: 345/81;
    border-left: 0;
    border-top: 0;
    border-right: 0.1875rem solid #5C3F1C;
    border-bottom: 0.1875rem solid #5C3F1C;
  }
}

.sightseeing-1 .message_title:hover,
.sightseeing-2 .message_title:hover {
  background: none;
}

.sightseeing-1 .message_title,
.sightseeing-2 .message_title {
  pointer-events: none;
}

.message_link {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.message_title_text {
  font-size: clamp(1.125rem, 0.208rem + 1.91vw, 2.5rem);
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: 0.025rem;
  color: #000;
}
@media screen and (max-width: 767px) {
  .message_title_text {
    font-size: clamp(1.25rem, 0.296rem + 4.07vw, 2.25rem);
  }
}

.message_content {
  margin-left: 0.625rem;
  padding-top: 1.875rem;
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .message_content {
    margin-left: 1.125rem;
    padding-top: 0.625rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .message_content {
    margin-left: 1.125rem;
    padding-top: 0.625rem;
  }
}
@media screen and (max-width: 767px) {
  .message_content {
    margin-left: 0;
    padding-top: 0.625rem;
  }
}

.message_text {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: 0.02rem;
  line-height: 1.5;
  padding-bottom: 0.925rem;
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .message_text {
    font-size: 1.2rem;
    padding-bottom: 0.875rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .message_text {
    font-size: 1rem;
    padding-bottom: 0.625rem;
  }
}
@media screen and (max-width: 767px) {
  .message_text {
    font-size: 1rem;
    padding-bottom: 0.625rem;
  }
}

.access-time {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: 0.04rem;
  line-height: 1.5;
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .access-time {
    font-size: 1.25rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .access-time {
    font-size: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .access-time {
    font-size: 1rem;
  }
}

.picture {
  text-align: center;
  width: 50%;
  aspect-ratio: 500/374.113;
}
@media screen and (max-width: 767px) {
  .picture {
    width: 100%;
  }
  .picture img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    display: block;
  }
}

.picture-text {
  font-family: "Yu Mincho", serif;
  font-size: 0.875rem;
  letter-spacing: 0.025rem;
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .picture-text {
    font-size: 1rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .picture-text {
    font-size: 0.625rem;
  }
}
@media screen and (max-width: 767px) {
  .picture-text {
    border-right: 0.1875rem solid #5C3F1C;
    font-size: 0.625rem;
  }
}

.business-time {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: 0.04rem;
  line-height: 1.5;
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .business-time {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .business-time {
    font-size: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .business-time {
    font-size: 1rem;
  }
}

.holiday {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: 0.04rem;
  line-height: 1.5;
}
@media screen and (min-width: 1024px) and (max-width: 1919px) {
  .holiday {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .holiday {
    font-size: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .holiday {
    font-size: 1rem;
  }
}

.mgr {
  margin-right: 1.2rem;
}
@media screen and (max-width: 767px) {
  .mgr {
    margin-right: 0.875rem;
  }
}

.detail-wrapper {
  margin-bottom: 0.625rem;
}