@charset "UTF-8";
.event {
  margin-top: 80px;
}
@media (max-width: 767px) {
  .event {
    margin-top: 10.6666666667vw;
  }
}
.event__wrap {
  width: calc(100% - 100px);
  max-width: 1600px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 80px;
  margin-top: 110px;
}
@media (max-width: 767px) {
  .event__wrap {
    width: 92vw;
    grid-template-columns: 1fr;
    gap: 10.6666666667vw;
  }
}
.event__item {
  position: relative;
}
@media (hover: hover) and (min-width: 1000px) {
  .event__item img {
    transition: scale var(--speed) ease-out;
  }
  .event__item .workslist__title a {
    transition: color var(--speed) ease-out;
  }
  .event__item:hover img {
    scale: 1.05;
  }
  .event__item:hover .workslist__title a {
    color: #999;
  }
  .event__item .workslist__lists a:hover {
    text-decoration: none;
  }
}
.event__tag {
  background-color: #333;
  color: #fff;
  font-size: 1.4rem;
  width: 30px;
  height: 120px;
  writing-mode: vertical-rl;
  text-orientation: upright;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 10px;
  top: -10px;
  pointer-events: none;
  z-index: 2;
}
@media (max-width: 767px) {
  .event__tag {
    font-size: 1.2rem;
    width: 25px;
    height: 80px;
    right: 5px;
    top: -5px;
  }
}
.event__image {
  overflow: hidden;
}
.event__image img {
  width: 100%;
  aspect-ratio: 480/298;
  -o-object-fit: cover;
     object-fit: cover;
}
.event__image.finish {
  position: relative;
}
.event__image.finish::after {
  content: "このイベントは終了しました";
  background-color: rgba(0, 0, 0, 0.4);
  position: absolute;
  inset: 0;
  font-size: 1.4rem;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none;
}
@media (max-width: 767px) {
  .event__image.finish::after {
    font-size: 1rem;
    content: "このイベントは\a終了しました";
    white-space: pre;
    padding: 2.6666666667vw;
    text-align: center;
  }
}
.event__title {
  font-size: 1.8rem;
  font-family: var(--ff-shippri);
  letter-spacing: normal;
  line-height: 1.77;
  padding: 20px 0;
}
@media (max-width: 767px) {
  .event__title {
    padding: 2.6666666667vw 0;
    font-size: 1.4rem;
    line-height: 1.5;
  }
}
.event__info {
  display: grid;
  grid-template-columns: 67px auto;
}
.event__info dt,
.event__info dd {
  color: #999;
  font-size: 1.4rem;
  letter-spacing: 0.06em;
}
.event__info dd {
  padding-left: 11px;
  position: relative;
}
.event__info dd::before {
  content: "";
  width: 1px;
  background-color: #ddd;
  position: absolute;
  left: 0;
  top: 0.5em;
  bottom: 0.3em;
}

.post__header {
  width: 1200px;
  margin: 0 auto;
}
@media (max-width: 767px) {
  .post__header {
    width: 92vw;
  }
}
.post__header__type {
  background-color: #333;
  color: #fff;
  width: 140px;
  line-height: 36px;
  text-align: center;
}
@media (max-width: 767px) {
  .post__header__type {
    font-size: 1.2rem;
    width: 100px;
    line-height: 30px;
  }
}
.post__header__title {
  font-size: 4rem;
  font-family: var(--ff-shippri);
  margin-top: 40px;
}
@media (max-width: 767px) {
  .post__header__title {
    font-size: 2.6rem;
    margin-top: 5.3333333333vw;
    line-height: 1.5;
  }
}
.post__image {
  width: 1200px;
  margin: 40px auto 0;
  position: relative;
  z-index: 2;
}
.post__image img {
  width: 100%;
  aspect-ratio: 1200/742;
  -o-object-fit: cover;
     object-fit: cover;
}
@media (max-width: 767px) {
  .post__image {
    width: 100%;
  }
}
.post__image .mySwiper {
  margin-top: 20px;
}
.post__image .mySwiper .swiper-wrapper {
  justify-content: center;
  gap: 11px;
}
.post__image .mySwiper .swiper-slide {
  cursor: pointer;
}
.post__image .mySwiper .swiper-slide:not(.swiper-slide-thumb-active) {
  position: relative;
}
.post__image .mySwiper .swiper-slide:not(.swiper-slide-thumb-active)::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  aspect-ratio: 1200/742;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}
@media (hover: hover) and (min-width: 1000px) {
  .post__image .mySwiper .swiper-slide::after {
    transition: opacity var(--speed) ease-in;
  }
  .post__image .mySwiper .swiper-slide:hover::after {
    opacity: 0.5;
  }
}
.post .bg {
  position: relative;
}
.post .bg::before {
  content: "";
  position: absolute;
  left: 0;
  top: -388px;
  bottom: -340px;
  width: 100%;
  background-color: #e9f3eb;
  z-index: -1;
}
@media (max-width: 767px) {
  .post .bg::before {
    top: -51.7333333333vw;
    bottom: -52vw;
  }
}
.post__reservation {
  margin-top: 80px;
  position: relative;
  padding-bottom: 160px;
}
@media (max-width: 767px) {
  .post__reservation {
    margin-top: 10.6666666667vw;
    padding-bottom: 21.3333333333vw;
  }
}
.post__reservation a {
  --color: #8a8441;
  background-color: var(--color);
  color: #fff;
  width: 500px;
  height: 100px;
  display: grid;
  grid-template-columns: 70px auto;
  align-items: center;
  gap: 30px;
  margin: 0 auto;
  padding-left: 40px;
}
@media (max-width: 767px) {
  .post__reservation a {
    width: 92vw;
    padding-left: 5.3333333333vw;
    grid-template-columns: 9.3333333333vw auto;
    gap: 4vw;
    height: 20vw;
  }
}
.post__reservation a .text {
  line-height: 1;
}
.post__reservation a .en {
  font-size: 1.4rem;
  font-family: var(--ff-cg);
  opacity: 0.5;
}
@media (max-width: 767px) {
  .post__reservation a .en {
    font-size: 1rem;
  }
}
.post__reservation a .jp {
  font-size: 2.2rem;
  font-family: var(--ff-shippri);
  margin-top: 11px;
}
@media (max-width: 767px) {
  .post__reservation a .jp {
    font-size: 1.8rem;
    margin-top: 1.3333333333vw;
  }
}
@media (hover: hover) and (min-width: 1000px) {
  .post__reservation a {
    transition: background var(--speed) ease-in;
  }
  .post__reservation a:hover {
    background: color-mix(in srgb, var(--color), white 20%);
  }
}
.post__reserv {
  width: 1200px;
  margin: 160px auto 0;
}
@media (max-width: 767px) {
  .post__reserv {
    width: 92vw;
    margin-top: 21.3333333333vw;
  }
}
.post__consept {
  width: 1200px;
  margin: 160px auto 0;
}
@media (max-width: 767px) {
  .post__consept {
    width: 92vw;
    margin-top: 21.3333333333vw;
  }
}
.post__consept__image {
  text-align: center;
}
.post__consept__title {
  margin-top: 100px;
  font-family: var(--ff-shippri);
  font-size: 3.2rem;
  line-height: 1;
}
@media (max-width: 767px) {
  .post__consept__title {
    margin-top: 13.3333333333vw;
    font-size: 2.4rem;
    line-height: 1.7;
  }
}
.post__index {
  background-color: #f5f5f5;
  width: 1200px;
  margin: 80px auto 0;
  padding: 60px 80px;
}
@media (max-width: 767px) {
  .post__index {
    width: 92vw;
    margin-top: 10.6666666667vw;
    padding: 8vw 10.6666666667vw;
  }
}
.post__index__title {
  font-size: 2.8rem;
  font-family: var(--ff-cg);
  line-height: 1;
  color: #8a8441;
  text-align: center;
}
@media (max-width: 767px) {
  .post__index__title {
    font-size: 2rem;
  }
}
.post__index__wrap {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 30px;
}
@media (max-width: 767px) {
  .post__index__wrap {
    grid-template-columns: 1fr;
    gap: 4vw;
    margin-top: 4vw;
  }
}
.post__index__wrap li a {
  display: grid;
  grid-template-columns: 32px auto 26px;
  align-items: center;
  font-family: var(--ff-shippri);
  border-bottom: 1px solid #333;
  padding: 15px 0;
}
@media (max-width: 767px) {
  .post__index__wrap li a {
    padding: 2vw 0;
    line-height: 1.5;
  }
}
.post__index__wrap li a .num {
  color: #8a8441;
}
.post__information {
  background-color: #e9f3eb;
  position: relative;
  width: 1200px;
  margin: 120px auto 0;
  padding: 120px 150px;
}
@media (max-width: 767px) {
  .post__information {
    width: 92vw;
    margin-top: 16vw;
    padding: 8vw 6vw 8vw;
  }
}
.post__information::after {
  content: "";
  position: absolute;
  inset: 20px;
  border: 2px solid #fff;
  pointer-events: none;
}
@media (max-width: 767px) {
  .post__information::after {
    inset: 2.6666666667vw;
    border-width: 1px;
  }
}
.post__information__title {
  font-family: var(--ff-shippri);
  line-height: 1;
  text-align: center;
}
.post__information__title .en {
  color: #999;
}
@media (max-width: 767px) {
  .post__information__title .en {
    font-size: 1.2rem;
  }
}
.post__information__title .jp {
  font-size: 3.6rem;
  margin-top: 25px;
}
@media (max-width: 767px) {
  .post__information__title .jp {
    font-size: 2.6rem;
    margin-top: 3.3333333333vw;
  }
}
.post__information dl {
  display: grid;
  grid-template-columns: 180px auto;
  gap: 15px 0;
  margin-top: 60px;
}
@media (max-width: 767px) {
  .post__information dl {
    grid-template-columns: 24vw auto;
    margin-top: 8vw;
    gap: 2vw 0;
  }
}
.post__information dt,
.post__information dd {
  font-size: 1.8rem;
  font-family: var(--ff-shippri);
  line-height: 60px;
}
@media (max-width: 767px) {
  .post__information dt,
  .post__information dd {
    font-size: 1.4rem;
    line-height: 1.5;
  }
}
.post__information dt {
  background-color: #8a8441;
  color: #fff;
  text-align: center;
}
@media (max-width: 767px) {
  .post__information dt {
    padding: 2.6666666667vw 0;
  }
}
.post__information dd {
  background-color: #fff;
  padding: 0 40px;
}
@media (max-width: 767px) {
  .post__information dd {
    padding: 2.6666666667vw 2.6666666667vw;
  }
}
.post__information .post__banner {
  margin-top: 60px;
}
@media (max-width: 767px) {
  .post__information .post__banner {
    margin-top: 8vw;
  }
}
@media (hover: hover) and (min-width: 1000px) {
  .post__information .post__banner a {
    transition: opacity var(--speed-fast) ease-in;
  }
  .post__information .post__banner a:hover {
    opacity: 0.7;
  }
}
.post__information .post__reservation {
  margin-top: 60px;
  padding-bottom: 0;
}
@media (max-width: 767px) {
  .post__information .post__reservation {
    margin-top: 8vw;
  }
  .post__information .post__reservation a {
    width: 100%;
  }
}
.post__points {
  width: 1200px;
  margin: 160px auto 0;
}
@media (max-width: 767px) {
  .post__points {
    width: 92vw;
    margin-top: 21.3333333333vw;
  }
}
.post__points__title {
  font-family: var(--ff-shippri);
  line-height: 1;
  text-align: center;
}
.post__points__title .en {
  color: #999;
}
@media (max-width: 767px) {
  .post__points__title .en {
    font-size: 1.2rem;
  }
}
.post__points__title .jp {
  font-size: 3.6rem;
  margin-top: 25px;
}
@media (max-width: 767px) {
  .post__points__title .jp {
    font-size: 2.6rem;
    margin-top: 3.3333333333vw;
  }
}
.post__points__wrap {
  margin-top: 75px;
  display: grid;
  gap: 120px;
}
@media (max-width: 767px) {
  .post__points__wrap {
    margin-top: 10vw;
    gap: 16vw;
  }
}
.post__points__wrap__heading {
  font-family: var(--ff-shippri);
  font-size: 2.8rem;
  padding: 25px 0;
  margin-bottom: 20px;
  border-top: 1px dotted #ddd;
  position: relative;
  display: grid;
  grid-template-columns: 57px auto;
  align-items: start;
}
@media (max-width: 767px) {
  .post__points__wrap__heading {
    font-size: 2rem;
    padding: 3.3333333333vw 0;
    grid-template-columns: 8vw auto;
    margin-bottom: 2.6666666667vw;
  }
}
.post__points__wrap__heading::before {
  content: "";
  background: #8a8441;
  width: 50px;
  height: 1px;
  position: absolute;
  top: -1px;
  left: 0;
}
.post__points__wrap__heading .num {
  color: #8a8441;
}
.post__points__wrap__text {
  margin-top: 50px;
}
@media (max-width: 767px) {
  .post__points__wrap__text {
    margin-top: 6.6666666667vw;
    font-size: 1.4rem;
  }
}
.post__points__wrap__text hr {
  margin: 2em 0;
}
.post__points__wrap__text p + p {
  margin-top: 2em;
}
.post__access {
  width: 1200px;
  margin: 145px auto 0;
}
@media (max-width: 767px) {
  .post__access {
    width: 92vw;
    margin-top: 19.3333333333vw;
  }
}
.post__access__title {
  font-family: var(--ff-shippri);
  line-height: 1;
  text-align: center;
}
.post__access__title .en {
  color: #999;
}
@media (max-width: 767px) {
  .post__access__title .en {
    font-size: 1.2rem;
  }
}
.post__access__title .jp {
  font-size: 3.6rem;
  margin-top: 25px;
}
@media (max-width: 767px) {
  .post__access__title .jp {
    font-size: 2.6rem;
    margin-top: 3.3333333333vw;
  }
}
.post__access__map {
  aspect-ratio: 1200/600;
  margin-top: 70px;
}
@media (max-width: 767px) {
  .post__access__map {
    aspect-ratio: 600/600;
    margin-top: 9.3333333333vw;
  }
}
.post__access__map iframe {
  width: 100%;
  height: 100%;
}
.post__access .post__reservation {
  margin-top: 60px;
  padding-bottom: 0;
}
@media (max-width: 767px) {
  .post__access .post__reservation {
    margin-top: 8vw;
  }
}

.eventinformation {
  background: url(../images/openhouse/eventinformation_bg.webp) top center/cover no-repeat;
  margin-top: 160px;
  margin-bottom: -440px;
  padding-bottom: 440px;
  padding-top: 160px;
  padding-left: 50px;
  padding-right: 50px;
}
@media (max-width: 767px) {
  .eventinformation {
    margin-top: 21.3333333333vw;
    margin-bottom: -61.3333333333vw;
    padding-bottom: 61.3333333333vw;
    padding-top: 21.3333333333vw;
    padding-left: 4vw;
    padding-right: 4vw;
  }
}
.eventinformation__title {
  text-align: center;
  font-family: var(--ff-cg);
  font-size: 5.2rem;
  line-height: 1;
}
@media (max-width: 767px) {
  .eventinformation__title {
    font-size: 3.6rem;
  }
}
.eventinformation__wrap {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  max-width: 1600px;
  margin: 80px auto 0;
  gap: 0 4.17%;
}
@media (max-width: 767px) {
  .eventinformation__wrap {
    grid-template-columns: 1fr;
    gap: 10.6666666667vw;
  }
}
.eventinformation__item {
  position: relative;
}
.eventinformation__item__tag {
  background-color: #333;
  color: #fff;
  font-size: 1.4rem;
  width: 30px;
  height: 120px;
  writing-mode: vertical-rl;
  text-orientation: upright;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 10px;
  top: -10px;
  pointer-events: none;
  z-index: 2;
}
@media (max-width: 767px) {
  .eventinformation__item__tag {
    font-size: 1.2rem;
    width: 25px;
    height: 80px;
    right: 5px;
    top: -5px;
  }
}
.eventinformation__item__image {
  overflow: hidden;
}
.eventinformation__item__image img {
  width: 100%;
  aspect-ratio: 480/298;
  -o-object-fit: cover;
     object-fit: cover;
}
.eventinformation__item__image.finish {
  position: relative;
}
.eventinformation__item__image.finish::after {
  content: "このイベントは終了しました";
  background-color: rgba(0, 0, 0, 0.4);
  position: absolute;
  inset: 0;
  font-size: 1.4rem;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none;
}
.eventinformation__item__title {
  font-size: 1.8rem;
  font-family: var(--ff-shippri);
  letter-spacing: normal;
  line-height: 1.77;
  padding: 20px 0;
}
@media (max-width: 767px) {
  .eventinformation__item__title {
    padding: 2.6666666667vw 0;
    font-size: 1.4rem;
    line-height: 1.5;
  }
}
.eventinformation__item__info {
  display: grid;
  grid-template-columns: 67px auto;
}
.eventinformation__item__info dt,
.eventinformation__item__info dd {
  color: #999;
  font-size: 1.4rem;
  letter-spacing: 0.06em;
}
.eventinformation__item__info dd {
  padding-left: 11px;
  position: relative;
}
.eventinformation__item__info dd::before {
  content: "";
  width: 1px;
  background-color: #ddd;
  position: absolute;
  left: 0;
  top: 0.5em;
  bottom: 0.3em;
}