@charset "UTF-8";
h1 {
  width: 15vw;
  margin: 0 auto;
  padding-top: 4%;
  margin-bottom: 1%; }

#mainVisual {
  position: relative;
  font-family: "Fraunces", serif;
  font-weight: 400;
  color: var(--th_color);
  margin: 0 auto;
  background: var(--base_color); }
  #mainVisual img {
    vertical-align: middle;
    font-size: 0; }
  #mainVisual .slider {
    font-size: 0;
    width: 60%;
    margin: 0 auto; }
  #mainVisual .box {
    position: relative; }
    #mainVisual .box h1 {
      width: 80%;
      position: absolute;
      left: 10%;
      top: 10%;
      z-index: 2; }
    #mainVisual .box .readArea {
      width: 100%;
      position: absolute;
      bottom: 5%;
      left: 0;
      text-align: center; }
      #mainVisual .box .readArea dl dt {
        font-size: 1.4vw;
        font-weight: 500;
        line-height: 1.5;
        margin-bottom: 1%; }
      #mainVisual .box .readArea dl dd {
        font-weight: 300;
        font-size: 1.0vw; }
      #mainVisual .box .readArea ul {
        display: flex;
        justify-content: space-between;
        width: 50%;
        margin: 0 auto;
        padding-top: 5%; }
        #mainVisual .box .readArea ul li {
          width: 16%; }

#who {
  margin-bottom: 2%;
  padding-top: 5%;
  line-height: 1.5;
  overflow: hidden; }
  #who .warp {
    width: 45%; }
  #who h2 {
    font-size: 2.0vw;
    margin-bottom: 3%; }
  #who p {
    font-family: "Fraunces", serif;
    margin-bottom: 2%; }
  #who b {
    font-weight: 400;
    position: relative; }
  #who b::before {
    content: "";
    background: rgba(255, 228, 72, 0.5);
    width: 100%;
    height: 50%;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: -1; }
  #who h3 {
    font-family: "Fraunces", serif;
    font-weight: 600;
    text-align: center;
    font-size: 2.0vw;
    margin-bottom: 6%;
    color: var(--sc_color); }
  #who .video {
    margin-bottom: 3%; }

#explore {
  margin-bottom: 15%;
  padding-top: 5%;
  line-height: 1.5;
  width: 70%;
  margin: 0 auto 5% auto; }
  #explore h2 {
    margin-bottom: 2%; }
  #explore .price {
    text-align: center;
    font-family: "Fraunces", serif;
    font-size: 1.2vw;
    margin-bottom: 3%; }
  #explore dl {
    background: rgba(244, 244, 244, 0.7);
    border-radius: 10px;
    padding: 5% 5% 4% 5%;
    margin-bottom: 3%;
    position: relative; }
    #explore dl dt {
      font-family: "Fraunces", serif;
      font-weight: 400;
      font-size: 1.5vw;
      line-height: 1.3; }
    #explore dl dd {
      font-size: 1.0vw; }
    #explore dl .btn {
      position: absolute;
      right: 3%;
      bottom: 35%; }
      #explore dl .btn a {
        font-family: "Fraunces", serif;
        font-size: 0.9vw;
        color: #fff;
        white-space: nowrap;
        padding: 0.8vw 2.6vw 0.8vw 1.5vw;
        background: url("../img/common/arrow_w.svg") no-repeat right 1.2vw center var(--sc_color);
        background-size: 0.8vw;
        border-radius: 100px;
        text-align: left; }
  #explore .txt-hide {
    display: none; }
  #explore button.more {
    font-family: "Fraunces", serif;
    font-weight: 400;
    border-radius: 100px;
    font-size: 1.1vw;
    cursor: pointer;
    width: 100%;
    margin: 0 auto;
    display: block;
    background-color: var(--base_color);
    color: #fff;
    padding: 3%;
    border: none;
    outline: 0;
    transition: .5s;
    -erbkit-transition: .5s; }
  #explore button.more::after {
    content: "and more";
    transition: .2s;
    -erbkit-transition: .2s; }
  #explore button.more.on-click::after {
    content: "close"; }

#eventCalendar {
  margin-bottom: 5%; }

#calendar {
  max-width: 80%;
  margin: 0 auto;
  font-family: "Fraunces", serif;
  font-size: 0.9vw;
  background: rgba(244, 244, 244, 0.7);
  border-radius: 10px;
  padding: 3%;
  line-height: 1;
  height: 90vh; }
  #calendar h2 {
    font-size: 1.4vw; }
  #calendar .fc-daygrid-dot-event {
    flex-wrap: wrap; }
  #calendar .fc-event-title {
    white-space: normal; }
  #calendar .fc-event-title {
    font-weight: 400; }
  #calendar .fc-daygrid-event-harness div {
    margin-bottom: 1%; }
  #calendar h2 {
    color: var(--base_color); }

#about {
  font-family: "Fraunces", serif;
  font-weight: 300;
  width: 50%;
  margin: 0 auto 5% auto; }
  #about h2 {
    margin-bottom: 3%; }
  #about p {
    margin-bottom: 5%;
    line-height: 1.5;
    font-size: 1.2vw; }

#program {
  font-family: "Fraunces", serif;
  font-weight: 300;
  margin-bottom: 5%;
  background: rgba(244, 244, 244, 0.7);
  padding: 5% 0; }
  #program h2 {
    margin-bottom: 3%;
    line-height: 1; }
    #program h2 span {
      font-size: 1.8vw; }
  #program ol {
    width: 60%;
    margin: 0 auto 5% auto; }
    #program ol li {
      position: relative;
      list-style: none;
      line-height: 1.5;
      font-size: 1.2vw;
      padding-left: 1.2rem;
      margin-bottom: 1%; }
    #program ol li::before {
      content: "";
      display: block;
      width: 5px;
      height: 5px;
      border-radius: 50%;
      background: #000;
      position: absolute;
      left: 0px;
      top: calc(0.75em - 3px); }
  #program p {
    text-align: center;
    font-size: 1.4vw; }

#location {
  font-family: "Fraunces", serif;
  font-weight: 300;
  background: rgba(244, 244, 244, 0.7);
  padding: 5% 0; }
  #location h2 {
    margin-bottom: 3%; }
  #location .pht {
    width: 60%;
    margin: 0 auto 2% auto; }
  #location dl {
    width: 60%;
    margin: 0 auto 2% auto; }
    #location dl dt {
      font-size: 2.0vw;
      font-family: "Fraunces", serif;
      font-weight: 500; }
    #location dl dd {
      margin-bottom: 3%; }
      #location dl dd a {
        display: block;
        background: var(--base_color);
        text-align: center;
        font-family: "Fraunces", serif;
        font-weight: 400;
        color: #fff;
        padding: 3% 0;
        border-radius: 100px; }
  #location iframe {
    width: 100%;
    height: 50vh;
    display: block; }

#note {
  font-family: "Fraunces", serif;
  padding: 2% 0; }
  #note h3 {
    font-family: "Fraunces", serif;
    font-weight: 500;
    font-size: 1.6vw; }
  #note ol {
    margin-bottom: 5%; }
    #note ol li {
      position: relative;
      list-style: none;
      line-height: 1.5;
      font-size: 1.0vw;
      padding-left: 1.2rem;
      margin-bottom: 1%; }
    #note ol li::before {
      content: "";
      display: block;
      width: 5px;
      height: 5px;
      border-radius: 50%;
      background: #000;
      position: absolute;
      left: 0px;
      top: calc(0.75em - 3px); }

#reviews {
  font-family: "Fraunces", serif;
  padding-top: 8%;
  width: 50%;
  margin: 0 auto;
  margin-bottom: 5%; }
  #reviews h2 {
    margin-bottom: 5%; }
  #reviews .review {
    margin-bottom: 10%; }
    #reviews .review ol {
      display: flex;
      justify-content: space-between;
      width: 25%;
      margin-bottom: 1%; }
      #reviews .review ol li {
        width: 16%; }
    #reviews .review dl {
      font-family: "Fraunces", serif;
      font-weight: 300; }
      #reviews .review dl dt {
        font-size: 2.0vw;
        font-weight: 400; }
  #reviews .examples {
    font-family: "Fraunces", serif;
    width: 60%;
    margin: 0 auto 5% auto; }
    #reviews .examples h3 {
      font-weight: 400;
      font-size: 2.0vw;
      margin-bottom: 3%; }
    #reviews .examples ol li {
      list-style: disc;
      margin-left: 1.5vw;
      line-height: 1.5;
      margin-bottom: 3%; }

#faq {
  font-family: "Fraunces", serif;
  padding-top: 8%;
  width: 50%;
  margin: 0 auto;
  margin-bottom: 5%; }
  #faq h2 {
    margin-bottom: 5%; }
  #faq dl {
    margin-bottom: 5%; }
    #faq dl dt {
      display: flex;
      justify-content: space-between;
      background: rgba(244, 244, 244, 0.6);
      line-height: 1.5;
      padding: 3% 5%; }
      #faq dl dt p:first-child {
        color: var(--sc_color);
        width: 7vw;
        font-size: 1.4vw; }
      #faq dl dt p:last-child {
        width: 93vw;
        font-size: 1.4vw; }
    #faq dl dd {
      display: flex;
      justify-content: space-between;
      line-height: 1.5;
      padding: 5% 5%; }
      #faq dl dd p:first-child {
        width: 7vw;
        font-size: 1.4vw; }
      #faq dl dd p:last-child {
        width: 93vw;
        padding-top: 0.5%;
        font-size: 1.1vw; }

#artist {
  font-family: "Fraunces", serif;
  width: 40%;
  margin: 0 auto;
  margin-bottom: 5%;
  overflow: hidden; }
  #artist h2 {
    margin-bottom: 5%; }
  #artist .box {
    margin-bottom: 10%; }
    #artist .box .pht {
      overflow: hidden; }
    #artist .box dl dt {
      text-align: center;
      font-size: 1.8vw;
      color: var(--sc_color);
      font-weight: 500;
      padding: 5% 0;
      line-height: 1; }
    #artist .box dl dd {
      padding: 0 0%;
      font-weight: 300;
      line-height: 1.5; }

#terms {
  font-family: "Fraunces", serif;
  padding-top: 8%;
  width: 70%;
  margin: 0 auto;
  margin-bottom: 5%;
  font-size: 1.0vw; }
  #terms h2 {
    margin-bottom: 5%; }
  #terms p {
    margin-bottom: 4%; }
  #terms dl {
    margin-bottom: 8%; }
    #terms dl dt {
      font-size: 1.8vw;
      margin-bottom: 1%;
      font-weight: 500; }
  #terms b {
    font-weight: 600; }
  #terms li {
    margin-bottom: 2%; }
  #terms ol li {
    list-style: disc;
    margin-left: 1.2rem; }
  #terms ul li {
    list-style: decimal;
    margin-left: 1.2rem; }
    #terms ul li p {
      margin-bottom: 2%; }
    #terms ul li ol li {
      list-style: disc;
      margin-left: 1.2rem; }

.video {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  /* 16:9のアスペクト比 */
  height: 0; }

.video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }