@charset "UTF-8";

/*mainimg
-----------------------------------------------------------------------------------------*/
#mainimg figure img {
  min-width: 100%;
}

/*pickup
-----------------------------------------------------------------------------------------*/
.pickup {
  max-width: 75rem;
  margin: 2.25rem auto;
  overflow: hidden;
}
.pickup .wp-block-column {
  width: calc(100% / 3);
  text-align: left;
  padding: 0.625rem;
}
.pickup .wp-block-column {
  width: calc(100% / 3);
  text-align: left;
  padding: 0.625rem;
}
.pickup .wp-block-column .wp-block-group {
  height: 100%;
  align-items: center;
}
.pickup .wp-block-column a {
  display: block;
  padding: 1.25rem 1.25rem;
  height: 100%;
}
.pickup .wp-block-column a:hover {
  background: var(--wp--preset--color--brown-color-lightest);
}
.pickup .wp-block-column p {
  line-height: 1.5;
}
.pickup .wp-block-column figure {
  display: block;
  height: 16rem;
  overflow: hidden;
  border-radius: 1rem;
}
.pickup .wp-block-column figure img {
  display: block;
  width: 100%; /* 親要素の幅に合わせる */
  height: 100%; /* 親要素の高さに合わせる */
  object-fit: cover; /* 画像を覆うように調整 */
  object-position: center; /* 画像の中央部分を表示 */
  transition-duration: 0.3s;
}
.pickup .wp-block-column a:hover figure img {
  transform: scale(1.2);
  transition-duration: 1s;
}
.pickup .wp-block-column strong {
  display: block;
  font-size: 1.25rem;
  margin-top: 1rem;
  color: var(--wp--preset--color--main-color-80);
  text-align: center;
}
.pickup .wp-block-column span {
  display: block;
  font-size: 0.875rem;
  margin-top: 0.25rem;
  color: var(--wp--preset--color--gray-color-dark);
}
.pickup .btn button {
  display: block;
  font-size: 0.875rem;
  line-height: 2.5rem;
  text-align: center;
  width: 15rem;
  margin: 1.25rem auto 0 auto;
  border: 1px solid var(--wp--preset--color--main-color-100);
  background: url(images/ya_g.svg) right 0.5rem center no-repeat;
  background-size: 1rem;
  border-radius: 1.25rem;
  padding: 0;
}
@media screen and (max-width: 739px) {
  .pickup {
    margin: 0 0 1rem 0;
  }
  .pickup .wp-block-column {
    width: 100%;
    border-bottom: 1px solid var(--wp--preset--color--gray-color-lighter);
  }
  .pickup .wp-block-column a {
    padding: 0;
  }
  .pickup .wp-block-column .wp-block-group {
    flex-direction: row;
    flex-wrap: nowrap;
  }
  .pickup .wp-block-column figure {
    width: 8rem;
    height: 6rem;
    flex-shrink: 0;
    margin-right: 0.75rem;
  }
  .pickup .wp-block-column strong {
    font-size: 1rem;
    margin: 0;
    text-align: left;
  }
  .pickup .wp-block-column span {
    font-size: 0.75rem;
    margin-top: 0.125rem;
  }
  .pickup .btn button {
    width: auto;
    margin: 0;
    border: none;
    clear: both;
    height: 0;
    width: 0;
    visibility: hidden;
  }
}

/*info
-----------------------------------------------------------------------------------------*/
.info {
  position: relative; /* 親要素を相対配置 */
  background-position: center;
  background-size: cover;
  width: 100%;
}
.info::after {
  content: '';
  background-image: url(images/info_bg.jpg);
  background-position: center;
  background-size: cover;
  opacity: 0.2; /* 50%の透過度 */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1; /* 背景として表示 */
}
/*-------------------------data*/
.info .data {
  width: 100%;
  padding: 3rem;
}
.info .data section {
  max-width: 48rem;
  margin: 0 auto;
}
.info .data h2 {
  font-size: 2rem;
  line-height: 1.5;
  color: var(--wp--preset--color--black-color-100);
}
.info .data table {
  margin-top: 1.25rem;
}
.info .data table thead,
.info .data table th,
.info .data table td {
  border: 1px solid var(--wp--preset--color--gray-color-lighter);
}
.info .data table th {
  background: var(--wp--preset--color--main-color-100);
  padding: 0.25rem 0.125rem;
  font-size: 0.875rem;
  color: var(--wp--preset--color--white-color-100);
}
.info .data table td {
  padding: 0.625rem;
  text-align: center;
}
.info .data table td span {
  display: block;
}
.info .data table + p {
  text-align: left;
  margin-top: 0.25rem;
  color: var(--wp--preset--color--black-color-100);
  line-height: 1.75;
}
.info .data ul {
  background: var(--wp--preset--color--white-color-80);
  margin-top: 1.25rem;
  padding: 0.25rem;
  border-radius: 0.625rem;
}
.info .data li.address {
  font-size: 0.875rem;
  padding-top: 0.625rem;
  line-height: 1.75;
}
.info .data .info-block {
  background: var(--wp--preset--color--white-color-80);
  margin-top: 1.25rem;
  padding: 0.25rem;
  border-radius: 0.625rem;
}
.info .data .address {
  font-size: 0.75rem;
  padding-top: 0.625rem;
  line-height: 1.75;
  flex-wrap: wrap;
}
.info .data .address p {
  font-size: 0.875rem;
}
.info .data .address span {
  padding: 0 0.25rem;
  white-space: nowrap;
}
.info .data .tel {
  font-size: 2rem;
  line-height: 1.5;
  font-weight: bold;
  margin-bottom: -0.25rem;
}
.info .data .tel a {
  color: var(--wp--preset--color--black-color-100);
  text-align: center;
}
.info .data p {
  text-align: left;
}
@media screen and (max-width: 739px) {
  .info .data {
    width: 100%;
    padding: 2rem 1.25rem;
  }
  .info .data h2 {
    font-size: 1.5rem;
  }
  .info .data table th {
    font-size: 0.75rem;
    font-weight: bold;
  }
  .info .data table td {
    padding: 0.25rem;
    font-size: 0.875rem;
  }
  .info .data .tel {
    font-size: 1.25rem;
    line-height: 2.5rem;
    margin: 0.25rem 0;
  }
  .info .data .tel a {
    display: block;
    background: var(--wp--preset--color--white-color-100) url(images/ya_g.svg)
      right 0.5rem center no-repeat;
    background-size: 1rem;
    border: 1px solid var(--wp--preset--color--gray-color);
    border-radius: 0.25rem;
    width: 16rem;
    margin: 0 auto;
  }
}
/*topics
-----------------------------------------------------------------------------------------*/
.home-topics {
  padding: 4.5rem 0;
  width: 64rem;
  margin: 0 auto;
}
.home-topics .title {
  font-size: 2.25rem;
  line-height: 1.5;
}
.home-topics .title span {
  font-size: 1.25rem;
  display: block;
  color: var(--wp--preset--color--main-color-100);
  letter-spacing: 0.125rem;
  font-weight: bold;
}
.home-topics ul {
  text-align: left;
  border-top: 1px solid var(--wp--preset--color--gray-color-light);
}
.home-topics li {
  line-height: 1.5rem;
}
.home-topics li.wp-block-post:hover {
  background-color: var(--wp--preset--color--brown-color-lightest);
}
.home-topics li .wp-block-group {
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--wp--preset--color--gray-color-light);
  position: relative;
  background: url(images/ya_g.svg) right 0.5rem center no-repeat;
}
.home-topics .wp-block-query {
  margin: 2rem auto 2.5rem;
}
.home-topics li .wp-block-post-date {
  width: 8.75rem;
}
.home-topics li .wp-block-post-date a {
  display: block;
  padding: 1.25rem 0;
  font-size: 0.875rem;
  color: var(--wp--preset--color--main-color-100);
  letter-spacing: 0.125rem;
}
.home-topics li .wp-block-post-title {
  width: 100%;
}
.home-topics li .wp-block-post-title a {
  display: block;
  padding: 1.25rem 0;
  font-size: 1rem;
  color: var(--wp--preset--color--black-color-100);
}
.home-topics .btn a {
  display: block;
  font-size: 0.875rem;
  line-height: 2.5rem;
  text-align: center;
  width: 15rem;
  margin: 0 auto;
  padding: 0;
  background: var(--wp--preset--color--main-color-80) url(images/maruya_w.svg)
    right 0.5rem center no-repeat;
  background-size: 1.25rem;
  border-radius: 1.25rem;
}
.home-topics .btn .wp-block-button__link:hover {
  opacity: 0.6;
}
@media screen and (max-width: 739px) {
  .home-topics {
    padding: 2.5rem 1.25rem;
    margin: 0 auto;
    width: auto;
  }
  .home-topics .title {
    font-size: 1.5rem;
  }
  .home-topics .title span {
    font-size: 0.875rem;
  }
  .home-topics li .wp-block-group {
    padding: 0.625rem 0;
    flex-flow: column;
    align-items: start;
  }
  .home-topics .wp-block-query {
    margin: 0.625rem auto 1.25rem;
  }
  .home-topics li a {
    background-size: 2rem;
    background-position: right -0.25rem center;
  }
  .home-topics li .wp-block-post-date {
    width: 100%;
    text-align: left;
  }
  .home-topics li .wp-block-post-date a {
    padding: 0;
    font-size: 0.75rem;
    font-weight: bold;
    position: static;
  }
  .home-topics li .wp-block-post-title {
    width: 100%;
  }
  .home-topics li .wp-block-post-title a {
    padding: 0;
    font-size: 0.875rem;
  }
}
/*-------------------------banner*/
.banner {
  max-width: 64rem;
  padding: 0.5rem;
  border: 1px solid var(--wp--preset--color--main-color-80);
  border-radius: 0.75rem;
  margin: 3rem auto;
}
.banner .tel {
  align-items: center;
  padding: 0.5rem 3rem;
  border-radius: 0.5rem;
  background-color: var(--wp--preset--color--main-color-100);
}
.banner .tel figure {
  width: 2.5rem;
  margin-right: 0.5rem;
  line-height: 3rem;
}
.banner .tel p {
  display: block;
  font-size: 3rem;
  line-height: 1;
  font-family: sans-serif;
  color: var(--wp--preset--color--white-color-100);
  white-space: nowrap;
}
.banner .hours {
  padding: 0.25rem 1rem;
  background-color: var(--wp--preset--color--white-color-100);
}
.banner .hours p {
  padding: 0;
  font-size: 1.5rem;
  color: var(--wp--preset--color--black-color-100);
}
.banner .hours .notice {
  font-size: 1.25rem;
  color: red; /* 赤色にする */
}
.banner .comment {
  display: none;
}
.banner .wp-block-site-logo img:not([width]) {
  /* wordpressのsvgバグが直るまでの措置 */
  max-height: 6rem;
  max-width: 30rem;
  object-fit: contain;
}
@media screen and (max-width: 739px) {
  .banner {
    margin: 2rem 1rem;
    border: 1px solid var(--wp--preset--color--main-color-100);
    border-radius: 0.5rem;
  }
  .banner .logo {
    margin: 0 0 0.5rem;
  }
  .banner .tel {
    align-items: center;
    padding: 0.25rem 1rem;
    border-radius: 0.25rem;
    background-color: var(--wp--preset--color--main-color-100);
  }
  .banner .tel figure {
    width: 1.5rem;
    margin-right: 0.25rem;
    line-height: 1.875rem;
  }
  .banner .tel p {
    font-size: 1.875rem;
    color: var(--wp--preset--color--white-color-100);
  }
  .banner .hours {
    display: none;
  }
  .banner .comment {
    display: block;
    color: var(--wp--preset--color--black-color-100);
    font-size: 0.75rem;
  }
  .banner .wp-block-site-logo img:not([width]) {
    /* wordpressのsvgバグが直るまでの措置 */
    max-height: 3rem;
    max-width: 16rem;
    object-fit: contain;
  }
}
/*kanren
-----------------------------------------------------------------------------------------*/
.kanren {
  max-width: 75rem;
  margin: 0 auto;
  text-align: left;
  padding: 2rem;
  margin-top: 3rem;
  margin-bottom: 3rem;
  background: var(--wp--preset--color--brown-color-lighter);
}
.kanren h2 {
  font-size: 1.125rem;
  font-weight: bold;
  margin: 0 0.625rem;
}
.kanren ul {
  display: flex;
  flex-wrap: wrap;
}
.kanren li {
  line-height: 1.5;
  width: calc(100% / 3);
  padding: 0.25rem 0.625rem;
}
.kanren li a {
  display: block;
  padding: 0.25rem 0.25rem 0.25rem 2rem;
  background: var(--wp--preset--color--white-color-100) url(images/maruya.svg)
    0.25rem 0.25rem no-repeat;
  color: var(--wp--preset--color--black-color-100);
  border-radius: 0.25rem;
}
.kanren li a:hover {
  background-color: var(--wp--preset--color--black-color-10);
}
@media screen and (max-width: 739px) {
  .kanren h2 {
    font-size: 1rem;
  }
  .kanren {
    padding: 1.25rem 0.625rem;
    margin: 0;
  }
  .kanren li {
    width: 50%;
    font-size: 0.875rem;
    padding: 0.25rem 0.625rem;
  }
  .kanren li a {
    background-size: 1.25rem;
    padding-left: 1.5rem;
  }
}
@media screen and (max-width: 479px) {
  .kanren li {
    width: 100%;
  }
}
