@charset "UTF-8";
@media screen and (max-width: 768px) {
  .only-pc {
    display: none !important;
  }
}

@media screen and (min-width: 769px) {
  .only-sp {
    display: none !important;
  }
}

body {
  color: #3E3A39;
  max-width: 1920px;
  margin: auto;
}

.hero {
  width: 100%;
}
.hero .hero-wrapper .hero-contents .hero-content.only-pc {
  background-image: url("../img/top_flower1.png"), url("../img/top_tori1.png"), url("../img/top_flower2.png");
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-position: left 10%, right 24% top 8%, right 10%;
  background-size: 19%, 4%, 18%;
}
@media screen and (min-width: 769px) {
  .hero .hero-wrapper .hero-contents .hero-content:first-child {
    padding: 3% 20% 0;
  }
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__header {
  display: none;
}
@media screen and (min-width: 769px) {
  .hero .hero-wrapper .hero-contents .hero-content .hero-content__header {
    display: inline;
  }
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__header .hero-content__text {
  text-align: center;
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .swiper {
  width: 100%;
}
@media screen and (min-width: 769px) {
  .hero .hero-wrapper .hero-contents .hero-content .hero-content__body .swiper {
    margin-top: 3%;
    margin-bottom: 4%;
  }
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .swiper .swiper-button-next, .hero .hero-wrapper .hero-contents .hero-content .hero-content__body .swiper .swiper-button-prev {
  color: #39AB49;
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list {
  padding-inline-start: 0px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.8em;
  /* ドロップダウンメニュー */
}
@media screen and (min-width: 769px) {
  .hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 0;
  }
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .hero__list__item {
  list-style: none;
  /* メニューアイテムのホバースタイル */
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .hero__list__item:hover .drop-menu-list {
  transform: scaleY(1) !important; /* ドロップダウンメニューの表示 */
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu {
  position: relative;
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list {
  font-size: 13px;
  padding: 10% 10% 25%;
  border-radius: 15px;
  background-color: #FBEADD;
  left: -44%;
  position: absolute;
  top: 115%;
  transform: scaleY(0); /* ドロップダウンメニューの非表示 */
  transform-origin: center top; /* 変形を適応する基準を設定 */
  transition: transform 0.3s; /* 表示の変化をアニメーション化 */
  width: 180%;
  z-index: 2;
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list:before {
  content: "";
  position: absolute;
  left: 45%;
  top: -20px;
  display: block;
  background: #EDCFBC;
  height: 20px;
  width: 35px;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
@media screen and (min-width: 960px) {
  .hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list {
    font-size: 16px;
  }
}
@media screen and (min-width: 1280px) {
  .hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list {
    font-size: 20px;
  }
}
@media screen and (min-width: 1536px) {
  .hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list {
    font-size: 22px;
  }
}
@media screen and (min-width: 1920px) {
  .hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list {
    font-size: 24px;
  }
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list.__green {
  font-size: 13px;
  padding: 10% 10% 25%;
  border-radius: 15px;
  background-color: #F1F4CC;
  left: -44%;
  position: absolute;
  top: 115%;
  transform: scaleY(0); /* ドロップダウンメニューの非表示 */
  transform-origin: center top; /* 変形を適応する基準を設定 */
  transition: transform 0.3s; /* 表示の変化をアニメーション化 */
  width: 180%;
  z-index: 2;
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list.__green:before {
  content: "";
  position: absolute;
  left: 45%;
  top: -20px;
  display: block;
  background: #C0DC97;
  height: 20px;
  width: 35px;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
@media screen and (min-width: 960px) {
  .hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list.__green {
    font-size: 16px;
  }
}
@media screen and (min-width: 1280px) {
  .hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list.__green {
    font-size: 20px;
  }
}
@media screen and (min-width: 1536px) {
  .hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list.__green {
    font-size: 22px;
  }
}
@media screen and (min-width: 1920px) {
  .hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list.__green {
    font-size: 24px;
  }
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list .drop-menu-item {
  border-bottom: dashed 1px #63654F;
  list-style: none;
  transition: opacity 0.3s; /* 不透明度の変化をアニメーション化 */
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list .drop-menu-item a {
  padding: 6% 0 4%;
  display: inline-block;
  display: flex;
  justify-content: space-between;
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list .drop-menu-item a span {
  display: inline-block;
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list .drop-menu-item a span:first-child {
  margin-left: 8%;
}
.hero .hero-wrapper .hero-contents .hero-content .hero-content__body .hero__nav .hero__list .drop-menu .drop-menu-list .drop-menu-item a span:last-child {
  margin-right: 8%;
}

.info {
  margin: 3rem 0 0;
}
@media screen and (min-width: 769px) {
  .info {
    margin: 0 auto;
    width: 51.647%;
    max-width: 980px;
  }
}
.info__head-wrapper {
  position: relative;
}
.info__head-sub {
  position: absolute;
  text-align: center;
  top: 7rem;
  left: 14.43rem;
  font-size: 2.33333333rem;
  letter-spacing: 0.07rem;
}
@media screen and (min-width: 769px) {
  .info__head-sub {
    font-size: 4.02298851rem;
    letter-spacing: 0.12068966rem;
    top: 11rem;
    left: 28.2rem;
  }
}
.info__head-title {
  position: absolute;
  top: 15rem;
  left: 16.7rem;
  font-size: 3.41666667rem;
  letter-spacing: 0.24166667rem;
}
@media screen and (min-width: 769px) {
  .info__head-title {
    font-size: 6.7816092rem;
    top: 26rem;
    left: 26rem;
    letter-spacing: 0.98333333rem;
  }
}
.info .category {
  width: 56.25rem;
  margin: 12.5rem auto 0;
}
@media screen and (max-width: 768px) {
  .info .category:nth-child(2) {
    margin: 5.29166667rem auto 0;
  }
}
@media screen and (min-width: 769px) {
  .info .category {
    width: auto;
    margin: 8.56321839rem 0 0;
  }
}
.info .category .card {
  margin-top: 4.58333333rem;
}
@media screen and (max-width: 768px) {
  .info .category .card:first-child {
    margin-top: 0;
  }
}
@media screen and (min-width: 769px) {
  .info .category .card {
    width: 53.79310345rem;
    margin-top: 10.11494253rem;
  }
}
@media screen and (min-width: 769px) {
  .info .category .card-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
@media screen and (min-width: 769px) {
  .info .category .card img {
    object-fit: cover;
    width: 100%;
    height: 29.51593087rem;
  }
}
.info .category .card__title {
  font-size: 2.66666667rem;
  letter-spacing: 0.08rem;
  margin-top: 1.99rem;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media screen and (min-width: 769px) {
  .info .category .card__title {
    text-align: initial;
    font-size: 2.75862069rem;
    letter-spacing: 0.07rem;
    margin-top: 2.4137931rem;
  }
}
.info .category .card__introduction {
  font-size: 2rem;
  letter-spacing: 0.1rem;
  padding: 1.75rem 2.04166667rem;
  background-color: #F8F1E8;
  margin-top: 1.25rem;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
@media screen and (min-width: 769px) {
  .info .category .card__introduction {
    font-size: 2.29885057rem;
    letter-spacing: 0.06896552rem;
    margin-top: 2.18390805rem;
    padding: 0;
    background-color: transparent;
  }
}
.info .category .card__limit-date {
  margin-top: 1.33333333rem;
  font-size: 2rem;
  font-weight: 700;
  position: relative;
  color: #fff;
  background-color: #E56D6A;
  display: inline-block;
  padding: 1rem 3rem 1rem 1rem;
}
@media screen and (min-width: 769px) {
  .info .category .card__limit-date {
    margin-top: 2.64367816rem;
    padding: 1rem 3rem 1rem 1rem;
    font-size: 2.52873563rem;
    letter-spacing: 0.07586207rem;
  }
}
.info .category .card__limit-date:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-color: transparent #fff transparent transparent;
  border-width: 2.5rem 1.66666667rem 2.5rem 0;
}
@media screen and (min-width: 769px) {
  .info .category .card__limit-date:after {
    border-width: 2.87356322rem 1.72413793rem 2.87356322rem 0;
  }
}
.info .category h2 {
  margin-bottom: 8.33333333rem;
  display: flex;
  font-size: 3.16666667rem;
  font-weight: 500;
  letter-spacing: 0.57rem;
}
@media screen and (min-width: 769px) {
  .info .category h2 {
    margin-bottom: 0;
    padding: 1rem 0;
    font-size: 4.02298851rem;
    letter-spacing: 0.58333333rem;
  }
}
.info .category h2 .dot__foot, .info .category h2 .dot__head {
  display: block;
  flex: 1;
  background-image: linear-gradient(to right, #000 2px, transparent 2px);
  background-size: 10px 2px;
  background-repeat: repeat-x;
  background-position: center;
}
.info .category h2 .dot__head {
  margin-right: 1rem;
}
.info .category h2 .dot__foot {
  margin-left: 1rem;
}