/* -----------------------------------
 ポップアップ
----------------------------------- */
.pp_visible {
  opacity: 1;
  visibility: visible;
  display: block;
}
.pp_hide {
  opacity: 0;
  visibility: hidden;
  display: none;
}
.pp_disp {
  display: block;
}
.pp_none {
  display: none;
}

/* 大見出し */
.g_pop_up {
  transition: .3s;
  background-image: url(../image/bg/mb/bg_common.jpg);
  background-size: contain;
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100vw;
  z-index: 9998;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}

/* 閉じるボタン */
.g_pop_up .pu_close {
  position: absolute;
  top: 20px;
  right: 20px;
}
.g_pop_up .pu_close span {
  display: block;
  position: relative;
  width: 50px;
  height: 50px;
}
.g_pop_up .pu_close span:before, .g_pop_up .pu_close span:after { /* 共通設定 */
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1px;
  height: 50px;
  background: var(--general);
}
.g_pop_up .pu_close span:before {
  transform: translate(-50%,-50%) rotate(45deg);
}
.g_pop_up .pu_close span:after {
  transform: translate(-50%,-50%) rotate(-45deg);
}

/* comming soon */
.g_pop_up .pu_cs {
  font-size: 3.6rem;
  font-weight: 600;
  /* color: var(--blue); */
  white-space: nowrap;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}

/* -----------------------------------
 サブページ - アクセス
----------------------------------- */
.s_access {
  margin-bottom: var(--bottom_margin);
}
.s_access .map {
  width: 100%;
  height: 300px;
  margin-bottom: 20px;
}
.s_access .detail .addr {
  margin-bottom: 20px;
}
.s_access .detail .means {
  margin-bottom: 20px;
}
.s_access .detail .means .list {
  list-style: disc;
  margin: 20px 0;
  padding-left: 20px;
}

/* -----------------------------------
 サブページ - ニュース
----------------------------------- */
.s_news .list  {
  /* border-top: 1px solid var(--general); */
  padding-top: 12px;
}
.s_news .list > li {
  margin-bottom: 30px;
  width: 90%;
  /* border-top: 1px solid var(--general);
  border-bottom: 1px solid var(--general); */
}
.s_news .thumbnail {
  /* padding-top: 30px; */
  /* padding-bottom: 30px; */
  /* border-bottom: 1px solid var(--general); */
}
.s_news .thumbnail .tb {
  display: none;
}
.s_news .content time {
  font-size: 1.2rem;
  display: block;
  margin-bottom: 4px;
  font-weight: 500;
}
.s_news .content h3 {
  font-size: 1.8rem;
  line-height: 3rem;
  margin-bottom: 12px;
  transition: .3s;
}
.s_news .content {
  padding-top: 20px;
  padding-bottom: 40px;
}
.s_news .content a {
  color: #0000EE;
  text-decoration: underline;
  display: inline;
}

/* -----------------------------------
 サブページ - アバウト
----------------------------------- */
.s_about {
  margin-bottom: var(--bottom_margin);
}
.s_about .kv {
  margin-bottom: 30px;
  position: relative;
}
.s_about .kv .copy {
  position: absolute;
  top: 30px;
  left: 30px;
  width: 70%;
}
.s_about .copy {
  margin-bottom: 30px;
}
.s_about .copy .head {
  font-size: 3.6rem;
  line-height: 42px;
  /* color: var( --blue); */
  margin-bottom: 30px;
}
.s_about .copy .text {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 28px
}
.s_about .copy .text p:not(:last-child) {
  margin-bottom: 15px;
}
.s_about .copy .img {
  /* margin: 10px 0 0; */
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.s_about .copy .img li {
  width: 48.5%;
  margin-bottom: 10px;
}

.s_about .detail {
  /* font-size: 1.5rem; */
}
.s_about .detail h2 {
  margin-bottom: 10px;
  font-weight: 700;
}
.s_about .detail li:not(:last-child) {
  margin-bottom: 5px;
}
.s_about .detail dt,
.s_about .detail dd {
  display: inline-block;
}

/* -----------------------------------
 サブページ - ヒストリー
----------------------------------- */
.s_history {
  margin-bottom: var(--bottom_margin);
}
.s_history .kv {
  margin-bottom: 30px;
}
.s_history .line_up {
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 30px;
}
.s_history .line_up ul {
  display: flex;
  flex-wrap: wrap;
}
.s_history .line_up ul li:not(:last-child) {
  margin-right: 10px;
}
.s_history .line_up .day_1 {
  margin-bottom: 20px;
}

.s_history .movie {
  margin-bottom: 30px;
}
.s_history .movie h3 {
  /* margin-bottom: 10px; */
}
.s_history .movie .thumbnail {
  position: relative;
  text-align: center;
}
.s_history .movie .thumbnail .btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 40px;
}
.s_history .gallery .list ul {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
}
.s_history .gallery .list li {
  width: 31%;
  margin-bottom: 10px;
}
.s_history .gallery .list li div {
  position: relative;
  padding-top: 100%;
  width: 100%;
  height: 0;
  box-sizing: border-box;
  overflow: hidden;
}
.s_history .gallery .list li img {
  position: absolute;
  top: -100%;
  right: -100%;
  bottom: -100%;
  left: -100%;
  margin: auto;
  height: 100%;
}

/* -----------------------------------
サブページ - FAQ
----------------------------------- */
.s_faq {
  margin-bottom: var(--bottom_margin);
}
.s_faq .head {
  font-size: 1.8rem;
  margin-bottom: 10px;
}
.s_faq .list li:not(:first-child) {
  margin-top: -1px;
}

.s_faq .list dt,
.s_faq .list dd {
  padding-top: 15px;
  padding-bottom: 15px;
}
.s_faq .list dt {
  border-bottom: 1px solid var(--base_color);
  font-size: 1.6rem;
  padding-right: 35px;
  padding-left: 35px;
  position: relative;
}
.s_faq .list li:not(:first-child) dt {
  border-top: 1px solid var(--base_color);
}
.s_faq .list dt .en {
  margin-right: 10px;
  font-size: 2.8rem;
  font-weight: 600;
  position: absolute;
  top: 50%;
  left: 5px;
  transform: translateY(-50%);
}
.s_faq .list dt .triangle {
  background: var(--base_color);
  display: block;
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  height: calc(12px / 2);
  width: 12px;
  /* clip-path: polygon(50% 0, 100% 100%, 0 100%); */
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.s_faq .list dd {
  color: var(--pink);
  padding-left: 35px;
  transition: .3s;
}
.s_faq .bikou {
  margin-top: 8px;
}

.s_faq .hide {
  visibility: hidden;
  height: 0;
  padding-top: 0!important;
  padding-bottom: 0!important;
}
.s_faq .hide p {
  display: none;
}

/* -----------------------------------
サブページ - GOODS
----------------------------------- */
.s_goods {
  margin-bottom: var(--bottom_margin);
}
.s_goods .img {
  margin-bottom: 20px;
}
.s_goods .img .main {
  margin-bottom: 10px;
}
.s_goods .img .sub {
  display: flex;
  justify-content: space-between;
}
.s_goods .img .sub li {
  width: 32%;
}
.s_goods .head {
  font-size: 2.8rem;
}
.s_goods .detail .price {
  font-weight: 600;
  font-size: 2rem;
  display: block;
  margin-bottom: 5px;
}
.s_goods .detail .color {
  font-weight: 600;
  font-size: 1.3rem;
  display: block;
  margin-bottom: 5px;
}
.s_goods .detail .size {
  font-weight: 600;
  font-size: 1.3rem;
  display: block;
}

/* -----------------------------------
サブページ - チケット
----------------------------------- */
.s_ticket {
  margin-bottom: var(--bottom_margin);
}
.s_ticket .info {
  margin-top: 25px;
}
.s_ticket .info .head {
  margin-bottom: 45px;
}
.s_ticket .info .buy,
.s_ticket .info .guide {
  margin-bottom: 75px;
}
.s_ticket .info .head h2,
.s_ticket .info .buy h2,
.s_ticket .info .guide h2 {
  font-size: 1.8rem;
}
.s_ticket .info .head {
  text-align: center;
}
.s_ticket .info .head h2 {
}
.s_ticket .info .buy {
  text-align: center;
}
.s_ticket .info .buy h2,
.s_ticket .info .guide h2 {
  margin-bottom: 10px;
}
.s_ticket .info .buy ul li {
  border: 1px solid var(--base_color);
  padding: 30px 0;
  box-sizing: border-box;
}
.s_ticket .info .buy ul li:not(:last-child) {
  margin-bottom: 15px;
}
.s_ticket .info .buy li .detail {
  margin-bottom: 20px;
}
.s_ticket .info .buy li .detail h3 {
  color: var(--blue);
  font-size: 2rem;
  margin-bottom: 5px;
}
.s_ticket .info .buy li .detail p {
  font-weight: 600;
  font-size: 1.8rem;
}
.s_ticket .info .buy li .btn a {
  background: var(--blue);
  display: inline-block;
  border-radius: 30px;
  padding: 10px 60px;
  color: #fff;
  font-weight: 900;
  font-size: 1.6rem;
  box-sizing: border-box;
}

.s_ticket .info .guide h2 {
  text-align: center;
}
.s_ticket .info .guide .main {
  display: flex;
  justify-content: center;
}
.s_ticket .info .guide .main li {
  border: 1px solid var(--base_color);
  width: 48%;
  text-align: center;
}
.s_ticket .info .guide .main li a {
  padding: 25px 0;
  box-sizing: border-box;
}
.s_ticket .info .guide .main li img {
  height: 50px;
  width: auto;
  margin: 0 auto 15px;
}
.s_ticket .info .guide .main li p {
  background: var(--orange);
  display: inline-block;
  border-radius: 30px;
  padding: 5px 20px;
  color: #fff;
  font-weight: 600;
  font-size: 1.4rem;
  box-sizing: border-box;
}
.s_ticket .info .guide .sub {
  margin-top: 30px;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.s_ticket .info .guide .sub li {
  width: 30%;
  max-width: 200px;
}

.s_ticket .notes .head {
  margin-bottom: 20px;
}
.s_ticket .notes .head h2 {
  font-size: 2rem;
  margin-bottom: 5px;
}
.s_ticket .notes .head p {
  color: var(--pink);
}

.s_ticket .notes .item:not(:last-child) {
  margin-bottom: 30px;
}
.s_ticket .notes .item h3 {
  font-size: 1.8rem;
  margin-bottom: 10px;
}
.s_ticket .notes .item li {
  position: relative;
  padding-left: 20px;
}
.s_ticket .notes .item li:before {
  content: '●';
  position: absolute;
  left: 0px;
  transform: scale(0.8);
}
.s_ticket .notes .item .kome:before {
  content: '※';
}
.s_ticket .notes .item li:not(:last-child) {
  margin-bottom: 3px;
}

/* -----------------------------------
サブページ - POOL & BEACH
----------------------------------- */
#pb_body {
  background: var(--sky_blue);
}
#pb_body .s_head {
  /* color: var(--pink); */
  /* text-align: center; */
}
.s_pb {
  text-align: center;
  margin-top: 30px;
  margin-bottom: var(--bottom_margin);
}
.s_pb .pool {
  margin-bottom: 30px;
}
.s_pb .beach {
  margin-top: 20px;
}
.s_pb .head {
  color: var(--pink);
  font-size: 3.6rem;
  margin-bottom: 20px;
}
.s_pb h3 {
  font-size: 1.5rem;
  margin-bottom: 8px;
}

.s_pb .so {
  color: var(--pink);
}
/* .s_pb .so .text {
  font-size: 2rem;
  font-weight: 900;
  display: block;
  margin-bottom: 20px;
} */
.s_pb .so .arrow {
  display: inline-block;
  position: relative;
  width: 2px;
  height: 80px;
  background: currentColor;
}
.s_pb .so .arrow:before {
  content: '';
  width: 10px;
  height: 10px;
  border: 2px solid currentColor;
  border-top: 0;
  border-right: 0;
  transform: rotate(135deg);
  transform-origin: bottom left;
  position: absolute;
  left: 50%;
  top: -12px;
  box-sizing: border-box;
}
.s_pb .so .arrow:after {
  content: '';
  width: 10px;
  height: 10px;
  border: 2px solid currentColor;
  border-top: 0;
  border-right: 0;
  transform: rotate(-45deg);
  transform-origin: bottom left;
  position: absolute;
  left: 50%;
  bottom: -0.05em;
  box-sizing: border-box;
}


/****************************** 600px ******************************/
@media (min-width: 600px){

  /* -----------------------------------
   サブページ - アバウト
  ----------------------------------- */
  .s_about .kv .copy {
    top: 50px;
    left: 50px;
    width: 60%;
  }
  .s_about .copy .text {
    font-size: 1.6rem;
    line-height: 36px;
  }

  /* -----------------------------------
   サブページ - ニュース
  ----------------------------------- */
  .s_news .list {
    padding: 0 var(--side_padding);
  }
  .s_news .list > li {
    width: 100%;
    display: flex;
    justify-content: space-between;
    /* padding-top: 30px; */
    padding-bottom: 30px;
  }
  .s_news .thumbnail {
    border-bottom: none;
    /* border-right: 1px solid var(--general); */
    padding: 0;
    width: 40%;
  }
  .s_news .thumbnail .mb {
    display: none;
  }
  .s_news .thumbnail .tb {
    display: block;
  }
  .s_news .thumbnail .tb .monitor {
    display: none;
  }
  .s_news .thumbnail .tb li:not(:first-child) {
    display: none;
  }
  .s_news .content {
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
    padding-left: 0px;
    width: 55%;
  }

  /* -----------------------------------
   サブページ - ヒストリー
  ----------------------------------- */
  .s_history .gallery .list li {
    width: 23%;
  }

  /* -----------------------------------
  サブページ - GOODS
  ----------------------------------- */
  .s_goods {
    display: flex;
    justify-content: space-between;

    margin-bottom: var(--bottom_margin);
  }
  .s_goods .img {
    width: 50%;
    margin-bottom: 0px;
  }
  .s_goods .content {
    width: 50%;
    padding-top: 30px;
    padding-left: 30px;
    box-sizing: border-box;
  }

}

/****************************** 1025px ******************************/
@media (min-width: 1025px){

  /* -----------------------------------
   ポップアップ
  ----------------------------------- */
  .g_pop_up {
    background-image: url(../image/bg/pc/bg_common.jpg);
  }
  /* comming soon */
  .g_pop_up .pu_cs {
    font-size: 5rem;
  }

  /* -----------------------------------
   サブページ - アクセス
  ----------------------------------- */
  .s_access .map {
    height: 500px;
    max-width: 1000px;
    margin-bottom: 30px;
  }
  .s_access .detail {
    font-size: 1.6rem;
  }
  .s_access .detail .addr {
    margin-bottom: 30px;
  }
  .s_access .detail .means {
    margin-bottom: 30px;
  }

  /* -----------------------------------
   サブページ - ニュース
  ----------------------------------- */
  .s_news .list > li {
    padding-left: 50px;
    padding-right: 50px;
    box-sizing: border-box;
  }
  .s_news .thumbnail {
  }
  .s_news .content {
  }
  .s_news .content time {
    margin-bottom: 6px;
    font-size: 1.6rem;
  }
  .s_news .content h3 {
    font-size: 2.4rem;
    line-height: 3.2rem;
    margin-bottom: 18px;
  }
  .s_news .content .text {
    font-size: 1.6rem;
  }
  .s_news .thumbnail .tb .monitor {
    display: block;
  }
  .s_news .thumbnail .tb ul {
    display: flex;
    padding: 20px 0 0;
    justify-content: space-between;
  }
  .s_news .thumbnail .tb li {
    width: 31%;
  }
  .s_news .thumbnail .tb li:not(:first-child) {
    display: block;
  }

  /* -----------------------------------
   サブページ - アバウト
  ----------------------------------- */
  .s_about {
    margin-bottom: var(--bottom_margin);
  }
  .s_about .kv {
    margin-bottom: 60px;
  }
  .s_about .kv .copy {
    top: 100px;
    left: 120px;
    width: 50%;
  }

  .s_about .copy {
    margin-bottom: 50px;
  }
  .s_about .copy .head {
    font-size: 6rem;
    /* line-height: 56px; */
    /* margin-bottom: 50px; */
    text-align: center;
  }
  .s_about .copy .head h2 {
    display: inline-block;
    text-align: left;
  }
  .s_about .copy .text {
    text-align: center;
    font-size: 1.8rem;
    font-weight: 700;
    /* line-height: 56px */
  }
  .s_about .copy .text br {
    /* display: none; */
  }
  .s_about .copy .text p:not(:last-child) {
    margin-bottom: 50px;
  }
  .s_about .copy .img {
    margin-bottom: 25px;
  }
  .s_about .copy .img li {
    margin-bottom: 25px;
    width: 32%;
  }

  .s_about {
    text-align: center;
  }
  .s_about .detail {
    display: inline-block;
    text-align: left;
    font-size: 1.6rem;
  }

  /* -----------------------------------
   サブページ - ヒストリー
  ----------------------------------- */
  .s_history .kv {
    margin-bottom: 60px;
    max-width: 900px;
  }
  .s_history .line_up,
  .s_history .movie {
    max-width: 750px;
    margin-bottom: 60px;
  }
  .s_history .line_up {
    font-size: 1.7rem;
  }
  .s_history .movie .thumbnail .btn {
    width: 50px;
  }
  .s_history .line_up time,
  .s_history .line_up ul {
    line-height: 3rem;
  }
  .s_history .line_up ul li:not(:last-child) {
    margin-right: 15px;
  }
  .s_history .gallery .list li {
    width: 16%;
  }

  /* -----------------------------------
  サブページ - FAQ
  ----------------------------------- */
  .s_faq .list {
    width: 90%;
    margin: 0 auto;
  }
  .s_faq .list dt,
  .s_faq .list dd {
    padding-top: 25px;
    padding-bottom: 25px;
  }
  .s_faq .list dt {
    padding-right: 50px;
    padding-left: 50px;
  }
  .s_faq .list dt .en {
    font-size: 3.2rem;
  }
  .s_faq .list dt .triangle {
    height: calc(20px / 2);
    width: 20px;
  }
  .s_faq .list dd {
    padding-left: 50px;
    padding-right: 50px;
  }


    /* -----------------------------------
    サブページ - GOODS
    ----------------------------------- */
    .s_goods {
      display: flex;
      justify-content: space-between;

      margin-bottom: var(--bottom_margin);
    }
    .s_goods .img {
    }
    .s_goods .content {
      padding-top: 60px;
      padding-left: 60px;
    }
    .s_goods .head {
      font-size: 3.6rem;
    }
    .s_goods .detail .price {
      font-weight: 600;
      font-size: 2.8rem;
      display: block;
      margin-bottom: 15px;
    }
    .s_goods .detail .color {
      font-size: 1.6rem;
      margin-bottom: 10px;
    }
    .s_goods .detail .size {
      font-size: 1.6rem;
    }

    /* -----------------------------------
    サブページ - チケット
    ----------------------------------- */
    .s_ticket {
      width: 90%;
      margin: 0 auto var(--bottom_margin);
    }
    /* .s_ticket .info .head, */
    .s_ticket .info .buy {
      margin-bottom: 80px;
    }
    .s_ticket .info .guide {
      margin-bottom: 120px;
    }
    .s_ticket .info .head h2,
    .s_ticket .info .buy h2,
    .s_ticket .info .guide h2 {
      font-size: 2.4rem;
    }
    .s_ticket .info .head h2 {
      margin-bottom: 10px;
    }
    .s_ticket .info .buy h2,
    .s_ticket .info .guide h2 {
      margin-bottom: 20px;
    }
    .s_ticket .info .buy ul li {
      display: flex;
      align-items: center;
    }
    .s_ticket .info .buy li .detail {
      width: 50%;
      margin-bottom: 0px;
    }
    .s_ticket .info .buy li .btn {
      width: 50%;
    }
    .s_ticket .info .guide .main {
      justify-content: center;
    }
    .s_ticket .info .guide .main li {
      width: 250px;
    }
    .s_ticket .info .guide .main li:not(:last-child) {
      margin-right: 10px;
    }
    .s_ticket .info .guide .main li a {
      padding: 30px 0;
    }
    .s_ticket .info .guide .sub {
      margin-top: 50px;
      justify-content: space-evenly;
    }

    /* -----------------------------------
    サブページ - POOL & BEACH
    ----------------------------------- */
    #pb_body .s_head {
      text-align: left;
    }
    #pb_body .s_head h1 {
      display: inline-block;
    }
    #pb_body .s_head .st {
      /* margin-top: 50px; */
      display: inline-block;
    }
    .s_pb {
      margin-top: 50px;
    }
    .s_pb .pool {
      margin-bottom: 50px;
    }
    .s_pb .beach {
      margin-top: 50px;
    }
    .s_pb .head {
      font-size: 4rem;
      margin-bottom: 30px;
    }
    .s_pb h3 {
      font-size: 1.8rem;
      margin-bottom: 12px;
    }

}

/****************************** 1400px ******************************/
@media (min-width: 1400px){

  /* -----------------------------------
   サブページ - アバウト
  ----------------------------------- */
  .s_about .kv .copy {
    top: 100px;
    left: 12%;
    width: 50%;
  }

  /* -----------------------------------
   サブページ - ニュース
  ----------------------------------- */
  .s_news .list > li {
    display: flex;
  }
  .s_news .thumbnail {
    border-bottom: none;
  }
  .s_news .thumbnail .tb ul {
    padding: 40px 0;
  }
  /* モニター用 */
  .active {
  	opacity: .8;
  }
  .s_news .content {
  }
  .s_news .content time {
    margin-bottom: 6px;
    font-size: 1.6rem;
  }
  .s_news .content h3 {
    font-size: 2.8rem;
    line-height: 3.6rem;
  }

  /* -----------------------------------
  サブページ - FAQ
  ----------------------------------- */
  .s_faq .list {
    width: 80%;
  }

  /* -----------------------------------
  サブページ - チケット
  ----------------------------------- */
  .s_ticket {
    width: 80%;
  }
  .s_ticket .info .head h2,
  .s_ticket .info .buy h2,
  .s_ticket .info .guide h2 {
    font-size: 2.8rem;
  }

}