@charset "UTF-8";
@import url("global.css");
/* ------------------------------
 Index
------------------------------ */
.archive ul.eventlist {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: min(60px,4vw);
  margin-bottom: 65px;
}
.archive ul.eventlist li {
  display: contents;
}
.archive ul.eventlist li:first-child {
  grid-column: 1 / 3;
}
.archive ul.eventlist li:first-child, .archive ul.eventlist li:nth-child(2) {
  display: block;
}
.archive ul.eventlist li.end .img figure::before {
  opacity: .6;
}
.archive ul.eventlist li.end .img figure::after {
  text-align: center;
  content: "終了しました";
  bottom: auto;
  right: 0;
  left: 0;
  top: 50%;
  width: fit-content;
  margin-inline: auto;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  padding: 10px 20px;
  border: #FFF solid 1px;
  background: none;
  opacity: 1;
}
@media (any-hover: hover) {
  .archive ul.eventlist li.end a:hover .img figure::after {
    translate: none;
  }
  .archive ul.eventlist li.end a:hover .img figure img {
    filter: none;
  }
}
.archive ul.eventlist li a {
  display: grid;
  gap: 0;
  grid-template-rows: subgrid;
  grid-row: span 4;
}
.archive ul.eventlist li a .img {
  width: 100%;
  height: 0;
  padding-top: 66.67%;
  background-color: #FFF;
  position: relative;
  overflow: hidden;
}
.archive ul.eventlist li a .img figure {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.archive ul.eventlist li a .img figure img {
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
.archive ul.eventlist li a .img figure::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #1D1D1D;
  mix-blend-mode: multiply;
  opacity: 0;
  z-index: 1;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
.archive ul.eventlist li a .img figure::after {
  content: "詳しく見る";
  color: #fff;
  position: absolute;
  bottom: 15px;
  right: 40px;
  z-index: 2;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  opacity: 0;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0.2s;
  backface-visibility: hidden;
}
.archive ul.eventlist li a .catch {
  margin-top: 15px;
  line-height: 1.5;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  color: #706D65;
}
.archive ul.eventlist li a .posttitle {
  margin-block: 15px;
  font-size: 1.0625em;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  line-height: 1.6;
  font-weight: 600;
}
.archive ul.eventlist li a .posttitle .cat {
  display: block;
  white-space: nowrap;
  width: fit-content;
  padding: 2px 8px;
  margin-bottom: 5px;
  background-color: #1A1A3F;
  color: #FFF;
  font-size: 11px;
  font-weight: normal;
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
}
.archive ul.eventlist li a .data {
  font-size: .85em;
}
.archive ul.eventlist li a .data > p {
  display: flex;
  align-items: flex-start;
}
.archive ul.eventlist li a .data > p::before {
  display: block;
  text-align: center;
  width: 15px;
  margin-right: 7px;
  font-family: 'Font Awesome 6 free','Font Awesome 6 Brands';
  font-weight: 900;
}
.archive ul.eventlist li a .data > p span {
  display: block;
}
.archive ul.eventlist li a .data > p span.h {
  width: 66px;
  flex-shrink: 0;
}
.archive ul.eventlist li a .data > p span:not([class]) {
  flex-grow: 1;
}
.archive ul.eventlist li a .data > p.day::before {
  content: "\f017";
}
.archive ul.eventlist li a .data > p.place::before {
  content: "\f3c5";
}
@media (any-hover: hover) {
  .archive ul.eventlist li a:hover .img figure img {
    filter: blur(2px);
  }
  .archive ul.eventlist li a:hover .img figure::before {
    opacity: .6;
  }
  .archive ul.eventlist li a:hover .img figure::after {
    opacity: 1;
    translate: 20px 0;
  }
}

/* ------------------------------
 Entry
------------------------------ */
.entry #contents {
  padding-top: 0;
}
.entry #post .formbtn a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: fit-content;
  padding: 15px 20px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #1A1A3F;
  color: #FFF;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.entry #post .formbtn a::after {
  content: "\f107";
  display: inline-block;
  font-family: 'Font Awesome 6 free','Font Awesome 6 Brands';
  font-weight: 900;
  font-size: 10px;
  padding-left: 120px;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
@media (any-hover: hover) {
  .entry #post .formbtn a:hover::after {
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
  }
}
.entry #sec_form {
  margin-top: 120px;
}

#post {
  position: relative;
  z-index: 1;
}
#post .bgimg {
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: 0;
  height: 100svh;
  overflow: hidden;
}
#post .bgimg figure {
  height: 140%;
}
#post .bgimg::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100svh;
  background-color: #1D1D1D;
  opacity: .34;
}
#post #body_wrap > .wrapper {
  display: flex;
  justify-content: space-between;
}
#post #body_wrap #body_head {
  width: 40%;
}
#post #body_wrap #body_head #headline {
  position: sticky;
  top: 0;
  padding-top: 270px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  transition: all 0.4s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
  color: #FFF;
}
#post #body_wrap #body_head #headline.linebreak {
  color: #1D1D1D;
}
#post #body_wrap #body_head #headline.linebreak .headline .data span {
  border-color: #1D1D1D;
}
#post #body_wrap #body_head #headline .headline .catch {
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-weight: 500;
  font-size: clamp(21px, 2.5vw, 32px);
  line-height: 1.6;
  margin-bottom: 45px;
}
#post #body_wrap #body_head #headline .headline .data {
  display: flex;
  align-items: center;
  column-gap: 10px;
  font-size: min(2.8vw,13px);
  font-family: "Jost", "Zen Kaku Gothic New", sans-serif;
  margin-bottom: 20px;
}
#post #body_wrap #body_head #headline .headline .data span {
  display: block;
  width: fit-content;
  padding-left: 10px;
  border-left: #FFF solid 1px;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
#post #body_wrap #body_head #headline .headline .posttitle {
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-weight: 500;
  font-size: clamp(17px, 2.1vw, 21px);
  line-height: 1.5;
}
#post #body_wrap #body_head #headline .headline .formbtn {
  margin-top: 45px;
  display: block;
}
#post #body_wrap #body_main {
  padding-top: 100svh;
  width: 54%;
}
#post #body_wrap #body_main .thmb {
  padding-top: 160px;
}
#post #body_wrap #body_main .thmb figure {
  margin-bottom: 50px;
}
#post #body_wrap #body_main .thmb + .outline {
  padding-top: 0;
}
#post #body_wrap #body_main .outline {
  padding-top: 160px;
  border-bottom: #A2A2A2 solid 1px;
}
#post #body_wrap #body_main .outline > table {
  border-collapse: collapse;
  width: 100%;
}
#post #body_wrap #body_main .outline > table tr {
  border-top: #A2A2A2 solid 1px;
}
#post #body_wrap #body_main .outline > table th, #post #body_wrap #body_main .outline > table td {
  line-height: 1.6;
}
#post #body_wrap #body_main .outline > table th {
  padding: 20px 3vw 20px 10px;
  white-space: nowrap;
  vertical-align: top;
  width: 22%;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: 1.125em;
  font-weight: 600;
}
#post #body_wrap #body_main .outline > table td {
  font-size: .94em;
  padding-block: 20px;
}
#post #body_wrap #body_main .outline > table td a.maplink {
  display: inline-block;
  margin-left: 10px;
  font-size: 125%;
}
#post #body_wrap #body_main .outline .formbtn {
  display: none;
}
#post #body_wrap #body_main .postbody {
  margin-top: 100px;
}
#post #body_wrap #body_main .post_phgallery {
  padding-block: 100px;
}
#post #body_wrap #body_main .post_phgallery .gallery_title {
  text-align: center;
  font-family: "Jost", "Zen Kaku Gothic New", sans-serif;
  font-size: 1.19em;
}
#post #body_wrap #body_main .post_phgallery .gallery_title::after {
  content: "";
  display: block;
  margin-inline: auto;
  width: 1px;
  height: 40px;
  background-color: #1D1D1D;
}

/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-1 ( 1600px )

------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 1600px) {
  /* ------------------------------
   Index
  ------------------------------ */
  /* ------------------------------
   Entry
  ------------------------------ */
}
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-2 ( 1300px )

------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 1300px) {
  /* ------------------------------
   Index
  ------------------------------ */
  /* ------------------------------
   Entry
  ------------------------------ */
  .entry #post .formbtn a {
    width: auto;
  }
  .entry #post .formbtn a::after {
    padding-left: 20px;
  }
  .entry #sec_form {
    margin-top: 90px;
  }

  #post #body_wrap #body_head {
    width: 36%;
  }
  #post #body_wrap #body_head #headline {
    padding-top: 30svh;
  }
  #post #body_wrap #body_head #headline .headline .catch {
    margin-bottom: 35px;
  }
  #post #body_wrap #body_head #headline .headline .formbtn {
    margin-top: 35px;
  }
  #post #body_wrap #body_main {
    width: 59%;
  }
  #post #body_wrap #body_main .thmb {
    padding-top: 120px;
  }
  #post #body_wrap #body_main .thmb figure {
    margin-bottom: 45px;
  }
  #post #body_wrap #body_main .outline {
    padding-top: 120px;
  }
  #post #body_wrap #body_main .postbody {
    margin-top: 90px;
  }
  #post #body_wrap #body_main .post_phgallery {
    padding-block: 90px 20px;
  }
}
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-3 ( 959px )

------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 959px) {
  /* ------------------------------
   Index
  ------------------------------ */
  .archive ul.eventlist {
    grid-template-columns: repeat(2, 1fr);
    gap: 50px 5vw;
    margin-bottom: 50px;
  }
  .archive ul.eventlist li:nth-child(2) {
    display: contents;
  }

  /* ------------------------------
   Entry
  ------------------------------ */
}
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-4 ( 644px )

------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 644px) {
  /* ------------------------------
   Index
  ------------------------------ */
  .archive ul.eventlist {
    display: block;
  }
  .archive ul.eventlist li {
    margin-bottom: 30px;
    display: block;
  }
  .archive ul.eventlist li:nth-child(2) {
    display: block;
  }
  .archive ul.eventlist li a .posttitle .cat {
    padding: 2px 8px;
    margin-right: 8px;
    font-size: 10px;
  }
  .archive ul.eventlist li a .data {
    padding: 10px 20px;
    background-color: #E5E5E5;
  }
  .archive ul.eventlist li a .data > p span.h {
    display: none;
  }

  /* ------------------------------
   Entry
  ------------------------------ */
  .entry #post .formbtn a {
    padding: 12px 15px;
  }
  .entry #sec_form {
    margin-top: 65px;
  }

  #post {
    padding-top: 84svh;
  }
  #post .bgimg {
    height: 84svh;
  }
  #post #body_wrap::before {
    content: "";
    display: block;
    background: #F1F1EF url("../img/bg_texture.jpg") repeat;
    background-size: 375px 375px;
    -webkit-transform: translateY(-9px);
    transform: translateY(-9px);
    -webkit-border-top-right-radius: 8px;
    border-top-right-radius: 8px;
    -webkit-border-top-left-radius: 8px;
    border-top-left-radius: 8px;
    width: 100%;
    height: 10px;
  }
  #post #body_wrap > .wrapper {
    display: block;
  }
  #post #body_wrap #body_head {
    width: auto;
  }
  #post #body_wrap #body_head #headline {
    position: static;
    display: block;
    height: auto;
    padding-block: 20px 30px;
    color: #1D1D1D;
  }
  #post #body_wrap #body_head #headline .headline .catch {
    margin-bottom: 0;
    position: absolute;
    z-index: -1;
    left: 0;
    right: 0;
    top: 70px;
    height: calc( 84svh - 120px );
    -webkit-writing-mode: vertical-rl;
    -moz-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    white-space: nowrap;
    line-height: 1.4;
    letter-spacing: .1em;
    display: inline-block;
    white-space: normal;
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #post #body_wrap #body_head #headline .headline .data {
    margin-bottom: 5px;
  }
  #post #body_wrap #body_head #headline .headline .data span {
    border-color: #1D1D1D;
  }
  #post #body_wrap #body_head #headline .headline .formbtn {
    display: none;
  }
  #post #body_wrap #body_main {
    padding-top: 0;
    width: auto;
  }
  #post #body_wrap #body_main .thmb {
    padding-top: 0;
  }
  #post #body_wrap #body_main .thmb figure {
    margin-inline: -5vw;
    margin-bottom: 25px;
  }
  #post #body_wrap #body_main .outline {
    padding-top: 0;
    border-bottom: #A2A2A2 solid 1px;
  }
  #post #body_wrap #body_main .outline > table tr:first-child {
    border-top: none;
  }
  #post #body_wrap #body_main .outline > table th, #post #body_wrap #body_main .outline > table td {
    line-height: 1.5;
    display: block;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  #post #body_wrap #body_main .outline > table th {
    padding: 20px 0 0;
  }
  #post #body_wrap #body_main .outline > table td {
    padding-block: 3px 20px;
  }
  #post #body_wrap #body_main .outline .formbtn {
    margin-top: 30px;
    display: block;
  }
  #post #body_wrap #body_main .postbody {
    margin-top: 50px;
  }
  #post #body_wrap #body_main .post_phgallery {
    padding-block: 50px 0;
  }
  #post #body_wrap #body_main .post_phgallery .gallery_title::after {
    height: 26px;
  }
}