.plan-list li {
  position: relative
}

.plan-list .name {
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0
}

.plan-list .price {
  font-feature-settings: "palt";
  margin-block: 0;
  margin-left: .2em;
  font-size: .875em;
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0
}

.plan-list .price em {
  font-size: 1.8em;
  font-family: "Nunito", sans-serif;
  font-weight: 700;
  letter-spacing: .06em;
  letter-spacing: 0
}

.plan-list .txt {
  margin-top: .6em;
  font-size: .9375em;
  line-height: 1.5
}

#plan .label {
  display: inline-block;
  padding: .25em .4em;
  line-height: 1;
  background-color: #fff;
  border: 2px solid #d2cab9
}

#top .plan-list .slick-track {
  display: flex
}

#top .plan-list .slick-slide {
  height: auto !important
}

#top .plan-list .slick-slide>div {
  display: contents
}

#top .plan-list li {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  padding-top: 1.25em
}

#top .plan-list .badge {
  left: 8%
}

#top .plan-list .name {
  margin-block: .5em .4em;
  font-size: min(5.6vw, 26px)
}

#top .plan-list .txt {
  margin-bottom: 1.5em
}

#top .plan-list .btn {
  display: grid;
  grid-template-columns: 38% 1fr;
  gap: 10px;
  margin-block: auto 0
}

@media screen and (min-width: 960px) {
  #top .plan-list {
    margin-inline: -25px
  }

  #top .plan-list .slick-slide {
    padding-inline: 25px
  }

  #top .plan-list .slick-prev {
    left: -5px
  }

  #top .plan-list .slick-next {
    right: -5px
  }
}

@media screen and (max-width: 959px) {
  #top .plan-list {
    margin-inline: -4vw
  }

  #top .plan-list .slick-slide {
    padding-inline: min(3vw, 15px)
  }

  #top .plan-list .slick-prev {
    left: 4vw
  }

  #top .plan-list .slick-next {
    right: 4vw
  }
}

@media screen and (max-width: 599px) {
  #top .plan-list .btn {
    font-size: .9em
  }
}

body#plan .plan-list {
  padding-bottom: min(10%, 30px);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: min(3vw, 30px)
}

body#plan .plan-list>li {
  padding-top: 1em;
  position: relative
}

body#plan .plan-list .badge {
  left: 1em;
  width: 4.5em;
  height: 4.5em;
  font-size: .9em
}

body#plan .plan-list .name {
  margin-block: 0 .5em;
  padding-bottom: .3em;
  font-size: min(4.5vw, 22px);
  border-bottom: 1px solid #e0dad0
}

body#plan .plan-list .btn-more {
  display: block;
  width: fit-content;
  margin: auto 0 0 auto;
  padding-inline: 1em;
  background-color: #fff
}

@media screen and (min-width: 960px) {
  body#plan .plan-list>li>a {
    display: flex;
    height: 100%;
    background-color: #f5f0e6
  }

  body#plan .plan-list>li>a:hover {
    color: inherit
  }

  body#plan .plan-list>li>a:hover .btn-more {
    background-color: #e0dad0
  }

  body#plan .plan-list .img {
    width: 38%;
    min-height: 250px;
    position: relative
  }

  body#plan .plan-list .img img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    object-fit: cover
  }

  body#plan .plan-list .detail {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 30px
  }
}

@media screen and (max-width: 959px) {
  body#plan .plan-list>li {
    display: flex;
    flex-direction: column
  }

  body#plan .plan-list>li>a,
  body#plan .plan-list .detail {
    display: contents
  }

  body#plan .plan-list .name {
    margin-top: .5em
  }

  body#plan .plan-list .price {
    margin-bottom: .5em
  }

  body#plan .plan-list .price>em {
    font-size: 1.4em
  }

  body#plan .plan-list .txt {
    display: none
  }

  body#plan .plan-list .btn-more {
    width: 100%;
    background-color: #e0dad0
  }
}

@media screen and (min-width: 600px)and (max-width: 960px) {
  body#plan .plan-list {
    grid-template-columns: repeat(3, 1fr)
  }
}

@media screen and (max-width: 599px) {
  body#plan .plan-list .badge {
    left: .5em;
    font-size: .8em
  }
}

#plan.detail .option {
  margin-bottom: min(10vw, 100px)
}

#plan.detail .ttl-dot-w {
  margin-block: 2em 1em
}

#plan.detail .garally {
  margin-bottom: min(10vw, 100px)
}

#plan.detail .garally-ttl {
  position: relative;
  padding-block: 1.7em 4.7em;
  font-size: min(6vw, 32px);
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0;
  text-align: center;
  background-color: #f5f0e6;
  border-top: 2px solid #e0dad0
}

#plan.detail .garally-list {
  max-width: 1200px;
  margin-top: max(-20vw, -100px);
  margin-inline: auto
}

@media screen and (min-width: 960px) {
  #plan.detail .garally-list .slick-slide {
    padding-inline: 25px
  }

  #plan.detail .garally-list .slick-prev {
    left: -5px
  }

  #plan.detail .garally-list .slick-next {
    right: -5px
  }
}

@media screen and (max-width: 959px) {
  #plan.detail .garally-list .slick-slide {
    padding-inline: min(3vw, 15px)
  }

  #plan.detail .garally-list .slick-prev {
    left: 4vw
  }

  #plan.detail .garally-list .slick-next {
    right: 4vw
  }
}

.plan-info {
  margin-bottom: min(7vw, 70px)
}

.plan-info .head {
  position: relative
}

.plan-info .head .badge {
  top: 1em;
  width: 5em;
  height: 5em;
  font-size: 1em;
  background-color: #f7e19b
}

.plan-info .head .badge.no1 {
  color: #fff;
  background-color: #bfaf89
}

.plan-info .head .badge.no2 {
  color: #fff;
  background-color: #aeaca8
}

.plan-info .head .badge.no3 {
  color: #fff;
  background-color: #ae9c91
}

.plan-info .head .badge.otoku {
  color: #fff;
  background-color: #988f7c
}

.plan-info .head .badge.blu {
  color: #fff;
  background-color: #82a5c2;
  border-color: #82a5c2
}

.plan-info .head .badge.pnk {
  color: #fff;
  background-color: #d8a7ac
}

.plan-info .head .pname {
  padding-left: 5.8rem;
  font-size: min(7vw, 38px);
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0;
  line-height: 1
}

.plan-info .head.none .pname {
  padding-left: 0 !important
}

.plan-info .head .label {
  margin-bottom: .5em;
  font-size: .8375rem
}

.plan-info .head .price {
  font-feature-settings: "palt";
  display: inline-flex;
  align-items: flex-end;
  width: 100%;
  padding-top: 1em;
  font-size: min(4vw, 20px);
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0;
  border-top: 2px solid #f5f0e6
}

.plan-info .head .price>span:not(.small) {
  display: inline-block;
  margin-right: 1em;
  padding: .2em 1.1em;
  font-size: .9em;
  background-color: #f5f0e6
}

.plan-info .head .price>em {
  font-size: 1.9em;
  font-family: "Nunito", sans-serif;
  font-weight: 700;
  letter-spacing: .06em;
  letter-spacing: 0
}

@media screen and (min-width: 600px) {
  .plan-info {
    display: grid;
    max-width: 960px;
    align-items: start;
    grid-template-columns: 1fr 38.5%;
    column-gap: 5%;
    grid-template-rows: min-content 1fr
  }

  .plan-info .head {
    grid-area: 1/1/2/2
  }

  .plan-info .img {
    grid-area: 1/2/3/3;
    padding-top: 1em
  }

  .plan-info .txt {
    grid-area: 2/1/3/2
  }
}

@media screen and (max-width: 599px) {
  .plan-info .head .badge {
    top: .2em
  }

  .plan-info .head .pname {
    padding-left: 5.2rem
  }

  .plan-info .head .price {
    justify-content: flex-end;
    padding-top: .9em
  }

  .plan-info .head .price>span {
    display: none
  }
}

.plan-cont {
  display: grid;
  margin-block: min(7vw, 50px) min(10vw, 60px)
}

.plan-cont .pname {
  font-size: min(5vw, 32px);
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0;
  text-align: center
}

.plan-cont .pname>em {
  font-size: 1.18em;
  background: linear-gradient(transparent 70%, #f7e19b 0%)
}

.plan-cont .ttl-dot,
.plan-cont .ttl {
  padding-bottom: .5em;
  border-bottom: 1px solid #d2cab9
}

.plan-cont .ttl-dot::before {
  margin: 0;
  top: .6em
}

.plan-cont .image .ttl-dot {
  margin-bottom: 1em
}

.plan-cont .info {
  display: grid;
  gap: 1.5em;
  padding: 3.6%;
  background-color: #fdfcfa
}

.plan-cont .info>div>*:last-child {
  margin-bottom: 0
}

.plan-cont .info .ttl-dot,
.plan-cont .info .ttl {
  font-size: 1.125em
}

.plan-cont .info .ttl {
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0
}

.plan-cont .info .ttl .notice {
  display: inline-block;
  margin-right: .75em;
  padding-inline: .5em;
  color: #fff;
  font-size: .8em;
  line-height: 1.6;
  background-color: #ba4243;
  border: none
}

.plan-cont .info p {
  font-size: .9375em
}

.plan-cont .link {
  gap: 1em
}

.plan-cont .link>a {
  width: max(40%, 260px)
}

.plan-cont .link .btn-more {
  padding: 1.1em
}

@media screen and (min-width: 600px) {
  .plan-cont {
    grid-template-columns: repeat(2, 1fr);
    gap: 60px
  }

  .plan-cont .pname,
  .plan-cont .info {
    grid-column: 1/span 2
  }

  .plan-cont .cont .wrap {
    padding: .5em 1em
  }

  .plan-cont .info {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px 40px
  }

  .plan-cont .info .full {
    grid-column: 1/span 2
  }

  .plan-cont .link {
    gap: 20px
  }
}

@media screen and (max-width: 959px) {
  .plan-cont {
    gap: 5vw
  }
}

.plan-olist {
  margin-bottom: min(15%, 80px) !important
}

.plan-olist .slick-slide>div {
  display: contents
}

.plan-olist .slick-slide li {
  height: 100%;
  padding-inline: 1em
}

@media screen and (max-width: 599px) {
  .plan-olist .slick-slide li {
    padding-inline: 10px
  }
}

.plan-olist .slick-slide a {
  display: grid;
  grid-template-columns: 40% 1fr;
  height: 100%;
  background-color: #f5f0e6
}

.plan-olist .slick-slide .img {
  aspect-ratio: 2/3;
  position: relative
}

.plan-olist .slick-slide .detail {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 1em
}

.plan-olist .slick-slide .name {
  margin: 0;
  font-size: min(4.5vw, 20px);
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0
}

.plan-olist .slick-slide .price {
  font-feature-settings: "palt";
  margin-block: 0 1em;
  margin-left: .2em;
  font-size: .875em;
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0
}

.plan-olist .slick-slide .price em {
  font-size: 1.5em;
  font-family: "Nunito", sans-serif;
  font-weight: 700;
  letter-spacing: .06em;
  letter-spacing: 0
}

.plan-olist .slick-slide .price .label {
  border: none !important
}

@media screen and (max-width: 959px) {
  .plan-olist .slick-slide .price {
    line-height: 1.6
  }

  .plan-olist .slick-slide .price .label {
    font-size: .85em
  }
}

.plan-olist .slick-slide .btn-more {
  display: block;
  width: fit-content;
  margin: auto 0 0 auto;
  padding: .3em 1em;
  background-color: #fff;
  transition: all .3s
}

.plan-olist .slick-dots li {
  margin-inline: 0
}

.plan-olist a:hover {
  color: #282828
}

.plan-olist a:hover .btn-more {
  background-color: #e0dad0
}

.service {
  margin-top: min(8vw, 95px)
}

.service .ttl-sec+.txt {
  margin-top: 0
}

@media screen and (min-width: 600px) {
  .service-img .tab-dtl {
    display: grid;
    grid-template-columns: repeat(2, 1fr)
  }

  .service-img .tab-dtl>div:nth-child(1) {
    padding-inline: 0 2.5em;
    border-right: 1px solid #e0dad0
  }

  .service-img .tab-dtl>div:nth-child(2) {
    padding-inline: 2.5em 0
  }
}

@media screen and (max-width: 599px) {
  .service-img .tab-area {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-block: 2em;
    cursor: pointer
  }

  .service-img .tab-area>li {
    width: 100%;
    padding: .5em;
    color: #fff;
    text-align: center;
    position: relative
  }

  .service-img .tab-area>li.ladies {
    background-color: #d8a7ac
  }

  .service-img .tab-area>li.mens {
    background-color: #82a5c2
  }

  .service-img .tab-area>li::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 1em;
    bottom: 0;
    width: 0.45em;
    height: 0.45em;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    rotate: 135deg;
    margin: auto
  }

  .service-img .tab-dtl .dtl {
    display: none
  }

  .service-img .tab-dtl .dtl.active {
    display: block
  }
}

.service-img figure {
  position: relative
}

.service-img figure:not(:first-child) {
  border-left: 1px solid #f5f0e6
}

.service-img figure figcaption {
  position: absolute;
  top: 0;
  left: 0;
  padding: .133em .5em;
  color: #fff
}

.service-img figure.ladies figcaption {
  background-color: #d8a7ac
}

.service-img figure.mens figcaption {
  background-color: #82a5c2
}

.service .merit {
  margin-top: min(50vw, 60px)
}

.service .merit>.ttl {
  font-size: min(5.8vw, 32px);
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0
}

.service .merit>.ttl .sub {
  display: block;
  font-size: .563em
}

.service .merit-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: min(2.8vw, 21px);
  margin-top: min(3.3vw, 40px)
}

.service .merit-list>li {
  padding-block: 1em;
  text-align: center;
  background-color: #fff;
  border-radius: 10px
}

.service .merit-list>li img {
  width: 60px;
  height: 60px
}

.service .merit-list>li .ttl {
  margin-top: .625em;
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0;
  line-height: 1.3
}

@media screen and (min-width: 960px) {
  .service .merit-list {
    grid-template-columns: repeat(6, 1fr)
  }
}

@media screen and (max-width: 599px) {
  .service .merit-list {
    grid-template-columns: repeat(2, 1fr)
  }
}

.option {
  margin-top: min(5.8vw, 70px)
}

.option-list {
  display: grid;
  margin-top: min(4.5vw, 35px)
}

.option-list>li>a {
  display: grid;
  grid-template-columns: min(38vw, 210px) 1fr;
  height: 100%;
  background-color: #f9f5ee
}

.option-list>li>a:hover {
  color: inherit
}

.option-list .lead {
  padding: min(3.2vw, 24px)
}

.option-list .img {
  position: relative
}

.option-list .ttl {
  padding-bottom: .5em;
  font-size: min(5.4vw, 22px);
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0;
  border-bottom: 1px solid #e0dad0
}

.option-list .ttl .sub {
  font-size: .65em;
  line-height: 1.5
}

.option-list .ttl .main {
  display: block;
  margin-top: .455em;
  line-height: 1
}

.option-list .price {
  margin-block: .409em;
  font-size: min(1.467em, 22px);
  font-family: "fot-tsukuardgothic-std", sans-serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0
}

.option-list .price .yen {
  font-size: .545em
}

.option-list .txt {
  margin: 0 0 2em;
  font-size: .9em;
  font-feature-settings: "palt"
}

.option-list .btn-arrow {
  margin-block: auto 0
}

@media screen and (min-width: 960px) {
  .option-list {
    grid-template-columns: repeat(2, 1fr);
    column-gap: min(3vw, 36px)
  }

  .option-list .lead {
    display: flex;
    flex-direction: column
  }
}

@media screen and (max-width: 959px) {
  .option-list {
    row-gap: 1.5em
  }

  .option-list .txt {
    margin-bottom: 1em;
    line-height: 1.5
  }
}

@media screen and (max-width: 599px) {
  .option-list .ttl .main {
    margin-top: .3em
  }
}