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

@media screen and (min-width: 999px) {
  .tab {
    display: none;
  }
}

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

.planTop main {
  background-image: url("../img/bg.jpg");
  background-size: cover;
  background-position: center;
}
.planTop a {
  transition: all 0.3s;
}
.planTop a:hover {
  opacity: 1;
}
.planTop h3 {
  margin-top: 110px;
  color: white;
  text-align: center;
  font-family: YakuHanMPs, "Shippori Mincho B1", serif;
  font-size: 21px;
  letter-spacing: 0.2em;
}
@media screen and (max-width: 768px) {
  .planTop h3 {
    margin-top: 25px;
    font-size: 16px;
    line-height: 24px;
  }
}
.planTop .grid {
  max-width: 600px;
  padding-right: 60px;
  margin: 100px auto 30px;
  transition: all 0.3s;
}
.planTop .grid .st0, .planTop .grid .st1, .planTop .grid .st2 {
  transition: all 0.3s;
}
@media screen and (max-width: 768px) {
  .planTop .grid {
    padding: 0 50px;
    margin: 25px auto;
    max-width: 500px;
  }
}
.planTop .btnArea {
  max-width: 900px;
  margin: 141px auto 120px;
}
@media screen and (max-width: 768px) {
  .planTop .btnArea {
    margin: 27px auto 11px;
    padding: 0 50px;
  }
}
.planTop .btnArea ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 25px 20px;
}
@media screen and (max-width: 768px) {
  .planTop .btnArea ul {
    flex-direction: column;
    align-items: center;
  }
}
.planTop .btnArea ul li {
  width: clamp(150px, 20.2vw, 202px);
  text-align: center;
  transition: all 0.3s;
  background: #020048;
}
@media screen and (max-width: 768px) {
  .planTop .btnArea ul li {
    width: 100%;
    max-width: 400px;
    background-color: unset;
  }
}
.planTop .btnArea ul li a {
  display: block;
}
.planTop .btnArea ul li.active a {
  opacity: 0.8;
}
.planTop .active .st0, .planTop .active .st1 {
  fill: #317C81;
}
.planTop .active .st2 {
  fill: white;
}
.planTop .text-wrap {
  max-width: 1000px;
  padding: 0 50px 25px;
  margin: 0 auto;
  color: white;
  font-size: 12px;
}
.planTop .text-wrap .wic {
  width: -moz-fit-content;
  width: fit-content;
  border: 1px solid white;
  letter-spacing: 0.025em;
  line-height: 24.5px;
  padding: 0 5px;
}
@media screen and (max-width: 768px) {
  .planTop .text-wrap .wic {
    width: 100%;
    text-align: right;
    border: 0;
  }
  .planTop .text-wrap .wic::before {
    content: "※";
  }
}
.planTop .text-wrap .notes {
  margin-top: 15px;
  font-size: 10px;
  line-height: 12px;
  letter-spacing: 0.01em;
}
.planTop .entry {
  padding: 34px 0 44px;
}
@media screen and (max-width: 999px) {
  .planTop .entry {
    background-color: white;
    padding: 17px 24px 28px;
  }
}
.planTop .entry .tab {
  font-size: 10px;
  line-height: 14px;
  margin-bottom: 28px;
}

.rows .bg {
  background-color: white;
  padding-bottom: 30px;
}
.rows .bg .detail {
  max-width: 713px;
  margin: 76px auto 0;
  padding: 0 30px;
}
@media screen and (max-width: 768px) {
  .rows .bg .detail {
    margin-top: 30px;
  }
}
.rows .bg .detail-header {
  display: flex;
  align-items: flex-end;
  gap: 15px;
  padding: 20px;
}
@media screen and (max-width: 768px) {
  .rows .bg .detail-header {
    flex-direction: column;
    align-items: center;
  }
}
.rows .bg .detail-header .type {
  width: 118px;
  height: 109px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: white;
  background: #34455b;
  background: linear-gradient(152deg, rgb(128, 152, 163) 0%, rgb(52, 69, 91) 100%);
}
@media screen and (max-width: 768px) {
  .rows .bg .detail-header .type {
    order: 2;
    width: 63vw;
    margin: 0 auto;
    background: unset;
    max-width: 263px;
    text-align: center;
  }
}
.rows .bg .detail-header .type .top {
  width: 91px;
  margin: 0 auto;
  font-size: 38px;
  border-bottom: 1px solid white;
  text-align: center;
  padding-bottom: 3px;
}
@media screen and (max-width: 768px) {
  .rows .bg .detail-header .type .top {
    padding-bottom: 0;
    width: 100%;
    line-height: 55px;
    border: 0;
    background: #34455b;
    background: linear-gradient(152deg, rgb(128, 152, 163) 0%, rgb(52, 69, 91) 100%);
    font-size: 45px;
  }
}
.rows .bg .detail-header .type .top span {
  font-size: 75%;
}
.rows .bg .detail-header .type .bottom {
  padding-top: 14px;
  font-size: 16px;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .rows .bg .detail-header .type .bottom {
    color: #3C3C3C;
    font-size: 22px;
    width: 100%;
    padding: 2px 0;
    border-bottom: 1px solid #3C3C3C;
  }
}
.rows .bg .detail-header .type .bottom span {
  font-size: 24px;
}
@media screen and (max-width: 768px) {
  .rows .bg .detail-header .type .bottom span {
    font-size: 30px;
  }
}
.rows .bg .detail-header .size-wrap {
  width: 100%;
  max-width: 267px;
  color: #3C3C3C;
}
@media screen and (max-width: 768px) {
  .rows .bg .detail-header .size-wrap {
    order: 3;
    margin-top: -18px;
    width: 63vw;
  }
}
.rows .bg .detail-header .size-wrap .size {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 1px solid #3C3C3C;
  padding-bottom: 2px;
}
.rows .bg .detail-header .size-wrap .size .jp {
  font-size: 13px;
}
@media screen and (max-width: 480px) {
  .rows .bg .detail-header .size-wrap .size .jp {
    font-size: 12px;
  }
}
.rows .bg .detail-header .size-wrap .size .m2 .big {
  font-size: 34px;
}
@media screen and (max-width: 480px) {
  .rows .bg .detail-header .size-wrap .size .m2 .big {
    font-size: 30px;
  }
}
.rows .bg .detail-header .size-wrap .size .m2 .mid {
  font-size: 25px;
}
@media screen and (max-width: 480px) {
  .rows .bg .detail-header .size-wrap .size .m2 .mid {
    font-size: 21px;
  }
}
.rows .bg .detail-header .size-wrap .size .m2 .min {
  font-size: 13px;
}
@media screen and (max-width: 480px) {
  .rows .bg .detail-header .size-wrap .size .m2 .min {
    font-size: 12px;
  }
}
.rows .bg .detail-header .size-wrap ul {
  margin-top: 10px;
}
.rows .bg .detail-header .size-wrap ul li {
  margin-top: 4px;
  display: flex;
  justify-content: space-between;
}
.rows .bg .detail-header .size-wrap ul li .item {
  width: 50%;
  display: block;
  -moz-text-align-last: justify;
       text-align-last: justify;
  font-size: 13px;
  padding: 0 13px;
  position: relative;
  font-feature-settings: "palt" 1;
  letter-spacing: 0;
}
@media screen and (max-width: 480px) {
  .rows .bg .detail-header .size-wrap ul li .item {
    font-size: 11px;
    max-width: 113px;
    padding: 0 13px;
  }
}
.rows .bg .detail-header .size-wrap ul li .item::before {
  content: "■";
  position: absolute;
  left: 0;
  top: 0;
}
.rows .bg .detail-header .size-wrap ul li .item::after {
  content: "／";
  position: absolute;
  top: 0;
  right: 0;
}
.rows .bg .detail-header .size-wrap ul li .num {
  width: 50%;
  text-align: right;
  font-size: 13px;
  font-feature-settings: "palt" 1;
}
@media screen and (max-width: 480px) {
  .rows .bg .detail-header .size-wrap ul li .num {
    font-size: 11px;
    max-width: 113px;
  }
}
.rows .bg .detail-header figure {
  width: 185px;
  margin-left: 15px;
}
@media screen and (max-width: 768px) {
  .rows .bg .detail-header figure {
    order: 1;
    width: 70vw;
    max-width: 263px;
    margin-left: -25px;
  }
}
@media screen and (max-width: 768px) {
  .rows .bg .detail .madori {
    max-width: 350px;
    margin: 0 auto;
  }
}
.rows .bg .back {
  width: 200px;
  margin: 35px auto 68px;
}
@media screen and (max-width: 768px) {
  .rows .bg .back {
    margin-bottom: 20px;
  }
}
.rows .bg .back a {
  display: block;
  border: 1px solid #3B5565;
  border-radius: 25px;
  line-height: 40px;
  font-size: 15px;
  color: #3B5565;
  text-align: center;
  position: relative;
}
.rows .bg .back a::after {
  content: "";
  background-image: url("../img/arrow.png");
  background-size: cover;
  width: 5px;
  height: 8px;
  position: absolute;
  top: 50%;
  right: 5%;
  transform: translate(0, -50%);
}
.rows .bg .kome {
  max-width: 940px;
  padding: 0 20px;
  margin: 0 auto;
  font-size: 10px;
  line-height: 12px;
  letter-spacing: 0.025em;
}
.rows .entry {
  padding: 34px 0 44px;
}

.mv {
  background-image: url("../img/title-bg.jpg");
  background-size: cover;
  background-position: center;
  position: relative;
  width: 100%;
  height: 19.1666666667vw;
  min-height: 230px;
}
@media screen and (max-width: 768px) {
  .mv {
    min-height: 67px;
  }
}
.mv h2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 246px;
}
@media screen and (max-width: 768px) {
  .mv h2 {
    width: clamp(129px, 37.7142857143vw, 278px);
  }
}
.mv::before {
  content: "image";
  font-size: 10px;
  color: #3C3C3C;
  position: absolute;
  bottom: 5px;
  left: 5px;
}

.secret .mv {
  background-image: url("../img/premium/title-bg.jpg");
}
.secret .mv::before {
  content: "";
}
.secret .mv h2 {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
}
.secret .mv h2 img {
  width: 359px;
}
@media screen and (max-width: 768px) {
  .secret .mv h2 img {
    width: clamp(170px, 48.5714285714vw, 359px);
  }
}
.secret .mv h2 span {
  display: block;
  color: white;
  font-size: 21px;
  margin-top: 30px;
  letter-spacing: 0.16em;
  font-family: YakuHanMPs, "Shippori Mincho B1", serif;
}
@media screen and (max-width: 768px) {
  .secret .mv h2 span {
    font-size: clamp(11px, 3.14vw, 16px);
    margin-top: 10px;
  }
}
.secret .contents .wrap {
  background: #B7AC9D;
  background: linear-gradient(to right, rgba(183, 172, 157, 0.35), rgba(109, 102, 80, 0.35));
  padding-top: 65px;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap {
    padding-top: 28px;
  }
}
.secret .contents .wrap h3 {
  font-size: clamp(18px, 2.1vw, 21px);
  font-family: YakuHanMPs, "Shippori Mincho B1", serif;
  letter-spacing: 0.2em;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap h3 {
    font-size: clamp(16px, 4.5vw, 21px);
    line-height: ckamp(24px, 6.8vw, 45px);
  }
}
.secret .contents .wrap .detail {
  margin-top: 60px;
  padding: 0 30px;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .detail {
    margin-top: 30px;
  }
}
.secret .contents .wrap .detail .detail-header {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 15px;
  padding: 20px;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .detail .detail-header {
    flex-direction: column;
    align-items: center;
  }
}
.secret .contents .wrap .detail .detail-header .type {
  width: 118px;
  height: 109px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: white;
  background: #837B68;
  background: linear-gradient(152deg, #AEA394 0%, #837B68 100%);
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .detail .detail-header .type {
    order: 2;
    width: 63vw;
    margin: 0 auto;
    background: unset;
    max-width: 263px;
    text-align: center;
  }
}
.secret .contents .wrap .detail .detail-header .type .top {
  width: 91px;
  margin: 0 auto;
  font-size: 38px;
  border-bottom: 1px solid white;
  text-align: center;
  padding-bottom: 3px;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .detail .detail-header .type .top {
    padding-bottom: 0;
    width: 100%;
    line-height: 55px;
    border: 0;
    background: #837B68;
    background: linear-gradient(152deg, #AEA394 0%, #837B68 100%);
    font-size: 45px;
  }
}
.secret .contents .wrap .detail .detail-header .type .top span {
  font-size: 75%;
}
.secret .contents .wrap .detail .detail-header .type .bottom {
  padding-top: 14px;
  font-size: 16px;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .detail .detail-header .type .bottom {
    color: black;
    font-size: 22px;
    width: 100%;
    padding: 2px 0;
    border-bottom: 1px solid black;
  }
}
.secret .contents .wrap .detail .detail-header .type .bottom span {
  font-size: 24px;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .detail .detail-header .type .bottom span {
    font-size: 30px;
  }
}
.secret .contents .wrap .detail .detail-header .size-wrap {
  width: 100%;
  max-width: 267px;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .detail .detail-header .size-wrap {
    order: 3;
    margin-top: -18px;
    width: 63vw;
  }
}
.secret .contents .wrap .detail .detail-header .size-wrap .size {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 1px solid black;
  padding-bottom: 2px;
}
.secret .contents .wrap .detail .detail-header .size-wrap .size .jp {
  font-size: 13px;
}
@media screen and (max-width: 480px) {
  .secret .contents .wrap .detail .detail-header .size-wrap .size .jp {
    font-size: 12px;
  }
}
.secret .contents .wrap .detail .detail-header .size-wrap .size .m2 .big {
  font-size: 34px;
}
@media screen and (max-width: 480px) {
  .secret .contents .wrap .detail .detail-header .size-wrap .size .m2 .big {
    font-size: 30px;
  }
}
.secret .contents .wrap .detail .detail-header .size-wrap .size .m2 .mid {
  font-size: 25px;
}
@media screen and (max-width: 480px) {
  .secret .contents .wrap .detail .detail-header .size-wrap .size .m2 .mid {
    font-size: 21px;
  }
}
.secret .contents .wrap .detail .detail-header .size-wrap .size .m2 .min {
  font-size: 13px;
}
@media screen and (max-width: 480px) {
  .secret .contents .wrap .detail .detail-header .size-wrap .size .m2 .min {
    font-size: 12px;
  }
}
.secret .contents .wrap .detail .detail-header .size-wrap ul {
  margin-top: 10px;
}
.secret .contents .wrap .detail .detail-header .size-wrap ul li {
  margin-top: 4px;
  display: flex;
  justify-content: space-between;
}
.secret .contents .wrap .detail .detail-header .size-wrap ul li .item {
  width: 50%;
  display: block;
  -moz-text-align-last: justify;
       text-align-last: justify;
  font-size: 13px;
  padding: 0 13px;
  position: relative;
  font-feature-settings: "palt" 1;
  letter-spacing: 0;
}
@media screen and (max-width: 480px) {
  .secret .contents .wrap .detail .detail-header .size-wrap ul li .item {
    font-size: 11px;
    max-width: 113px;
    padding: 0 13px;
  }
}
.secret .contents .wrap .detail .detail-header .size-wrap ul li .item::before {
  content: "■";
  position: absolute;
  left: 0;
  top: 0;
}
.secret .contents .wrap .detail .detail-header .size-wrap ul li .item::after {
  content: "／";
  position: absolute;
  top: 0;
  right: 0;
}
.secret .contents .wrap .detail .detail-header .size-wrap ul li .num {
  width: 50%;
  text-align: right;
  font-size: 13px;
  font-feature-settings: "palt" 1;
}
@media screen and (max-width: 480px) {
  .secret .contents .wrap .detail .detail-header .size-wrap ul li .num {
    font-size: 11px;
    max-width: 113px;
  }
}
.secret .contents .wrap .detail .detail-header figure {
  width: 185px;
  margin-left: 15px;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .detail .detail-header figure {
    order: 1;
    width: 70vw;
    max-width: 263px;
    margin-left: -25px;
  }
}
.secret .contents .wrap .detail .madori {
  width: 631px;
  margin: 20px auto 40px;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .detail .madori {
    width: 100%;
    max-width: 400px;
    margin-top: 0;
  }
}
.secret .contents .wrap .equipment {
  background-image: url("../img/premium/equipment-bg.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  padding: 75px 0;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .equipment {
    padding: 35px 0;
  }
}
.secret .contents .wrap .equipment h3 {
  color: white;
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .equipment h3 {
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.15em;
    margin-bottom: 20px;
  }
}
.secret .contents .wrap .equipment ul {
  max-width: 958px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 57px 30px;
  padding: 0 50px;
}
@media screen and (max-width: 841px) {
  .secret .contents .wrap .equipment ul {
    justify-content: center;
    gap: 30px;
  }
}
.secret .contents .wrap .equipment ul li {
  width: calc(33.3333333333% - 20px);
}
@media screen and (max-width: 841px) {
  .secret .contents .wrap .equipment ul li {
    width: calc(50% - 20px);
  }
}
@media screen and (max-width: 600px) {
  .secret .contents .wrap .equipment ul li {
    width: 100%;
    max-width: 300px;
  }
}
.secret .contents .wrap .equipment ul li figure {
  position: relative;
}
.secret .contents .wrap .equipment ul li figure figcaption {
  position: absolute;
  bottom: 8px;
  right: 8px;
  color: white;
  font-size: 10px;
}
.secret .contents .wrap .equipment ul li figure figcaption.bk {
  color: #3C3C3C;
}
.secret .contents .wrap .equipment ul li dl {
  color: white;
}
.secret .contents .wrap .equipment ul li dl dt {
  text-align: center;
  font-size: clamp(16px, 1.8vw, 18px);
  letter-spacing: 0.15em;
  line-height: 37px;
  border-bottom: 1px solid white;
}
@media screen and (max-width: 630px) {
  .secret .contents .wrap .equipment ul li dl dt {
    font-size: 14px;
  }
}
.secret .contents .wrap .equipment ul li dl dt.slim {
  letter-spacing: 0.02em;
  font-size: clamp(14px, 1.6vw, 16px);
}
@media screen and (max-width: 841px) {
  .secret .contents .wrap .equipment ul li dl dt.slim {
    font-size: clamp(16px, 1.8vw, 18px);
  }
}
@media screen and (max-width: 660px) {
  .secret .contents .wrap .equipment ul li dl dt.slim {
    font-size: 14px;
  }
}
.secret .contents .wrap .equipment ul li dl dd {
  margin-top: 5px;
  font-size: 14px;
  line-height: 21px;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 660px) {
  .secret .contents .wrap .equipment ul li dl dd {
    font-size: 12px;
  }
}
.secret .contents .wrap .equipment ul li dl dd span {
  font-size: 10px;
  letter-spacing: 0.025em;
}
.secret .contents .wrap .equipment .standard {
  background: #717062;
  background: linear-gradient(-45deg, rgba(63, 63, 63, 0.75) 23%, rgba(113, 112, 98, 0.75) 57%);
  max-width: 858px;
  margin: 60px auto 0;
  padding: 30px 55px;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .equipment .standard {
    width: clamp(250px, 71.4vw, 350px);
    padding: 17px 20px;
  }
}
.secret .contents .wrap .equipment .standard h3 {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .equipment .standard h3 {
    margin-bottom: 16px;
  }
}
.secret .contents .wrap .equipment .standard h3 span {
  font-size: 16px;
}
.secret .contents .wrap .equipment .standard ul {
  gap: 15px;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .equipment .standard ul {
    flex-direction: column;
    align-items: center;
    background-color: white;
    border-radius: 10px;
    padding: 20px 29px;
    padding-top: 10px;
    gap: 0;
  }
}
.secret .contents .wrap .equipment .standard ul li {
  width: calc(25% - 11.5px);
  height: 41px;
  background-color: white;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  text-align: center;
  flex-direction: column;
  font-size: 14px;
  line-height: 16px;
  letter-spacing: 0.05em;
  color: #3C3C3C;
}
.secret .contents .wrap .equipment .standard ul li span {
  font-size: 10px;
  letter-spacing: 0;
}
.secret .contents .wrap .equipment .standard ul li .small {
  font-size: 88%;
}
@media screen and (max-width: 768px) {
  .secret .contents .wrap .equipment .standard ul li {
    width: 100%;
    border-bottom: 1px solid #898989;
    border-radius: 0;
  }
}
.secret .other {
  padding: 52px;
  padding-bottom: 20px;
  background-color: white;
}
@media screen and (max-width: 600px) {
  .secret .other {
    padding: 22px 30px 20px;
  }
}
.secret .other .flex-box {
  display: flex;
  justify-content: center;
  gap: 25px;
}
@media screen and (max-width: 600px) {
  .secret .other .flex-box {
    flex-direction: column;
    align-items: center;
    gap: 15px;
  }
}
.secret .other .flex-box a {
  display: block;
  width: 200px;
  line-height: 40px;
  text-align: center;
  position: relative;
  border-radius: 25px;
  border: 1px solid #8195A0;
  color: #8195A0;
  font-size: 15px;
  letter-spacing: 0.05em;
}
.secret .other .flex-box a::after {
  content: "";
  background-image: url("../img/premium/arrow-bl.png");
  background-size: 100%;
  width: 5px;
  height: 8px;
  position: absolute;
  top: 50%;
  right: 5%;
  transform: translate(0, -50%);
}
.secret .other .note {
  max-width: 905px;
  margin: 67px auto 0;
  font-size: 10px;
  line-height: 12px;
  letter-spacing: 0.025em;
}
@media screen and (max-width: 768px) {
  .secret .other .note {
    margin-top: 28px;
  }
}
.secret .entry {
  padding: 50px 0;
}
@media screen and (max-width: 999px) {
  .secret .entry {
    background-color: white;
    padding: 0 0 30px;
  }
}
@media screen and (max-width: 768px) {
  .secret .entry a {
    width: 285px;
  }
}/*# sourceMappingURL=plan.css.map */