@charset "UTF-8";
/*
 * htmlのフォントサイズ
 * @args ベースの画面幅
 */
/*
 * ルートのフォントサイズを基準にフォントサイズを可変にする（SPはrootPxを設定しておくこと）
 * @args 最大値（デザイン上の数値）
 */
/*
 * PC fontサイズはコンテンツエリア幅 1100px基準
 */
/*
 * スマホの時のfz設定（XDアートボードサイズで引用）
 */
/*
 * get_vwの設定
 */
/*
 * get_vwの設定(スマホ)
 */
/*
 * margin-topがマイナス値の場合、pxを%に変換
 */
/*
 * margin-topがマイナス値の場合、pxを%に変換(スマホ)
 */
/*
 * line-heightの計算
 */
/*
 * breakpointの設定
 */
#stcContents .carousel {
  overflow: hidden;
}
#stcContents .carousel .track {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition-timing-function: linear;
          transition-timing-function: linear;
}
#stcContents .carousel .imgWrap {
  width: auto !important;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
#stcContents .carousel .imgWrap img {
  display: block;
  width: auto;
  height: clamp(10px, 47.265625vw, 605px);
}
@media screen and (max-width: 767px) {
  #stcContents .carousel .imgWrap img {
    height: 135.2vw;
  }
}

#stcContents .swiper {
  width: 100%;
}
#stcContents .swiper-wrapper {
  height: auto;
}
#stcContents .swiper-button-prev,
#stcContents .swiper-button-next {
  top: clamp(10px, 7.734375vw, 99px);
  width: clamp(10px, 2.1875vw, 28px);
  height: clamp(10px, 1.484375vw, 19px);
  margin-top: 0;
}
@media screen and (max-width: 767px) {
  #stcContents .swiper-button-prev,
  #stcContents .swiper-button-next {
    top: 25.3333333333vw;
    width: 7.2vw;
    height: 5.0666666667vw;
  }
}
#stcContents .swiper-button-prev::after,
#stcContents .swiper-button-next::after {
  position: absolute;
  display: inline-block;
  content: "";
  background-repeat: no-repeat;
  background-size: contain;
  width: clamp(10px, 2.1875vw, 28px);
  height: clamp(10px, 1.484375vw, 19px);
  background-image: url(../images/nextBtn.svg);
}
@media screen and (max-width: 767px) {
  #stcContents .swiper-button-prev::after,
  #stcContents .swiper-button-next::after {
    width: 7.2vw;
    height: 5.0666666667vw;
  }
}
#stcContents .swiper-button-prev {
  left: clamp(-19px, -1.484375vw, 0px);
}
@media screen and (max-width: 767px) {
  #stcContents .swiper-button-prev {
    left: -4.8vw;
  }
}
#stcContents .swiper-button-prev::after {
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
}
#stcContents .swiper-button-next {
  right: clamp(-19px, -1.484375vw, 0px);
}
@media screen and (max-width: 767px) {
  #stcContents .swiper-button-next {
    right: -4.8vw;
  }
}
#stcContents .swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: clamp(10px, 1.171875vw, 15px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-column-gap: 11px;
     -moz-column-gap: 11px;
          column-gap: 11px;
}
@media screen and (max-width: 767px) {
  #stcContents .swiper-pagination-bullets.swiper-pagination-horizontal {
    display: none;
  }
}
#stcContents .swiper-pagination-bullets.swiper-pagination-horizontal .swiper-pagination-bullet {
  width: 6px;
  height: 6px;
  margin: 0 !important;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.7019607843);
  opacity: 1;
}
#stcContents .swiper-pagination-bullets.swiper-pagination-horizontal .swiper-pagination-bullet-active {
  background-color: #ffffff;
  opacity: 1;
}

#stcContents .linkBtn {
  width: clamp(10px, 20.546875vw, 263px);
  height: clamp(10px, 3.203125vw, 41px);
  margin-inline: auto;
  background-color: #FFFFFF;
  outline: 1px solid #2A2A2A;
  outline-offset: -1px;
}
@media screen and (max-width: 767px) {
  #stcContents .linkBtn {
    width: 78.9333333333vw;
    height: 12.5333333333vw;
  }
}
#stcContents .linkBtn > a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: clamp(1px, 0.546875vw, 7px);
     -moz-column-gap: clamp(1px, 0.546875vw, 7px);
          column-gap: clamp(1px, 0.546875vw, 7px);
  width: 100%;
  height: 100%;
  font-family: "Zen Old Mincho", serif;
  font-size: clamp(1px, 1.0909090909vw, 12px);
  font-weight: 500;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .linkBtn > a {
    font-size: 3.4666666667vw;
  }
}
#stcContents .linkBtn > a {
  color: #2A2A2A;
  text-decoration: none;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}
@media screen and (max-width: 767px) {
  #stcContents .linkBtn > a {
    -webkit-column-gap: 2.1333333333vw;
       -moz-column-gap: 2.1333333333vw;
            column-gap: 2.1333333333vw;
  }
}
#stcContents .linkBtn:hover {
  background-color: #2A2A2A;
}
#stcContents .linkBtn:hover a {
  color: #FFFFFF;
}
#stcContents .linkBtn:hover span::after {
  background-color: #FFFFFF;
}
#stcContents .linkBtn span {
  position: relative;
  width: 6px;
  height: 100%;
}
#stcContents .linkBtn span::after {
  position: absolute;
  display: inline-block;
  content: "";
  top: 50%;
  right: 0;
  width: 100%;
  height: 9px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-color: #2A2A2A;
  -webkit-mask-image: url(../images/triangle.svg);
          mask-image: url(../images/triangle.svg);
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
}
#stcContents .linkText a {
  font-family: "avenir-next-lt-pro", "avenir-lt-pro", sans-serif;
  font-size: clamp(1px, 0.9090909091vw, 10px);
  font-weight: 400;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .linkText a {
    font-size: 3.2vw;
  }
}
#stcContents .linkText a {
  color: #2A2A2A;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
  text-decoration: underline;
  text-underline-offset: 1px;
  position: relative;
  padding-right: clamp(1px, 0.78125vw, 10px);
}
@media screen and (max-width: 767px) {
  #stcContents .linkText a {
    padding-right: 3.2vw;
  }
}
#stcContents .linkText a::after {
  position: absolute;
  display: inline-block;
  content: " >";
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

#stcContents .pdDetail {
  font-family: "minion-pro-display", serif;
  font-size: clamp(1px, 1.3636363636vw, 15px);
  font-weight: 400;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .pdDetail {
    font-size: 3.7333333333vw;
  }
}
#stcContents .pdDetail {
  color: #2A2A2A;
  text-align: center;
  margin-top: clamp(1px, 0.703125vw, 9px);
}
@media screen and (max-width: 767px) {
  #stcContents .pdDetail {
    margin-top: 2.6666666667vw;
  }
}
#stcContents .pdDetail > span {
  font-family: "minion-pro-display", serif;
  font-size: clamp(1px, 1vw, 11px);
  font-weight: 400;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .pdDetail > span {
    font-size: 2.9333333333vw;
  }
}
#stcContents .pdDetail > span {
  color: #2A2A2A;
  text-align: center;
  display: block;
  margin-top: clamp(1px, 0.390625vw, 5px);
}
@media screen and (max-width: 767px) {
  #stcContents .pdDetail > span {
    margin-top: 1.3333333333vw;
  }
}
#stcContents .buyBtn {
  font-family: "avenir-next-lt-pro", "avenir-lt-pro", sans-serif;
  font-size: clamp(1px, 0.8181818182vw, 9px);
  font-weight: 400;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .buyBtn {
    font-size: 2.1333333333vw;
  }
}
#stcContents .buyBtn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  place-content: center;
  place-items: center;
  width: clamp(10px, 3.59375vw, 46px);
  height: clamp(1px, 1.40625vw, 18px);
  margin-top: clamp(1px, 0.625vw, 8px);
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
  border: 1px solid #2A2A2A;
  border-radius: clamp(1px, 0.703125vw, 9px);
}
@media screen and (max-width: 767px) {
  #stcContents .buyBtn {
    width: 11.7333333333vw;
    height: 4.5333333333vw;
    margin-top: 2.1333333333vw;
    border-radius: 2.4vw;
  }
}

#stcContents #index {
  position: fixed;
  top: 50%;
  right: 0;
  width: 62px;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
  z-index: 15;
}
@media screen and (max-width: 767px) {
  #stcContents #index {
    left: 50%;
    top: auto;
    bottom: calc(var(--nav-height) + 10px);
    bottom: var(--nav-height);
    width: 100%;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
  }
}
#stcContents #index.active {
  opacity: 1;
  visibility: visible;
}
@media screen and (max-width: 767px) {
  #stcContents ul.indexList {
    display: grid;
    grid-template-columns: repeat(6, auto);
    background-color: #fff;
  }
}
#stcContents ul.indexList a {
  position: relative;
  display: block;
}
@media screen and (max-width: 767px) {
  #stcContents ul.indexList a::after {
    position: absolute;
    display: inline-block;
    content: "";
    background-repeat: no-repeat;
    background-size: contain;
    left: 50%;
    bottom: 1.8666666667vw;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 14px;
    height: 6px;
    background-image: url(../images/arrow.svg);
    z-index: 1;
  }
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-height) + 10px);
}
@media screen and (max-width: 767px) {
  html {
    scroll-padding-top: var(--nav-height);
  }
}

.max-w-content {
  max-width: 1280px !important;
  padding: 0;
}
.max-w-content > ul {
  max-width: 1092px;
}
@media screen and (max-width: 767px) {
  .max-w-content > ul {
    padding-left: 9px;
    padding-right: 9px;
  }
}

#stcContents {
  line-height: normal;
}
#stcContents .pc {
  display: block;
}
@media screen and (max-width: 767px) {
  #stcContents .pc {
    display: none;
  }
}
#stcContents .sp {
  display: none;
}
@media screen and (max-width: 767px) {
  #stcContents .sp {
    display: block;
  }
}
#stcContents img {
  width: 100%;
}
#stcContents section {
  margin: 0;
}
#stcContents object {
  width: 100%;
}
#stcContents a:hover {
  opacity: 0.8;
}

#stcContents {
  opacity: 0;
  -webkit-transition: opacity 2s ease-in-out;
  transition: opacity 2s ease-in-out;
}
#stcContents .movieWrap {
  aspect-ratio: 663/442;
}
#stcContents .kvArea .kvArea_main {
  position: relative;
  margin-inline: auto;
}
#stcContents .kvArea .kvArea_title {
  position: absolute;
  top: clamp(10px, 13.75vw, 176px);
  left: clamp(10px, 32.96875vw, 422px);
  width: clamp(10px, 37.34375vw, 478px);
  z-index: 2;
}
@media screen and (max-width: 767px) {
  #stcContents .kvArea .kvArea_title {
    top: 44vw;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 84vw;
  }
}
#stcContents .kvArea .kvArea_bg {
  width: 100%;
  height: 100%;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: rgba(64, 38, 43, 0.2509803922);
  mix-blend-mode: multiply;
  z-index: 1;
}
#stcContents .kvArea .kvArea_text {
  margin-top: clamp(10px, 7.8125vw, 100px);
}
@media screen and (max-width: 767px) {
  #stcContents .kvArea .kvArea_text {
    margin-top: 8.8vw;
  }
}
#stcContents .kvArea .txtWrap > p {
  font-family: "Zen Old Mincho", serif;
  font-size: clamp(1px, 1.0909090909vw, 12px);
  font-weight: 500;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .kvArea .txtWrap > p {
    font-size: 3.2vw;
  }
}
#stcContents .kvArea .txtWrap > p {
  color: #2A2A2A;
  text-align: center;
  line-height: 1.8333333333;
  letter-spacing: 0.09em;
}
@media screen and (max-width: 767px) {
  #stcContents .kvArea .txtWrap > p {
    line-height: 2;
  }
}
#stcContents .lookArea {
  display: grid;
  grid-template-columns: 1fr;
  place-content: center;
  margin-top: clamp(10px, 7.8125vw, 100px);
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea {
    margin-top: 36.8vw;
  }
}
#stcContents .lookArea + .lookArea {
  margin-top: clamp(10px, 18.75vw, 240px);
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea + .lookArea {
    margin-top: 30.1333333333vw;
  }
}
#stcContents .lookArea .lookArea_top {
  display: grid;
  grid-template-areas: "area1 area2" "area1 area3" "area1 area4" "area5 area5";
  grid-template-columns: clamp(10px, 35.234375vw, 451px) clamp(10px, 34.53125vw, 442px);
  grid-template-rows: auto -webkit-max-content 1fr -webkit-max-content;
  grid-template-rows: auto max-content 1fr max-content;
  -webkit-column-gap: clamp(10px, 5.703125vw, 73px);
     -moz-column-gap: clamp(10px, 5.703125vw, 73px);
          column-gap: clamp(10px, 5.703125vw, 73px);
  margin-left: clamp(10px, 14.84375vw, 190px);
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea .lookArea_top {
    grid-template-areas: "area2" "area1" "area3" "area5" "area4";
    grid-template-columns: 1fr;
    grid-template-rows: unset;
    gap: unset;
    margin: 0;
  }
}
#stcContents .lookArea .lookArea_bottom {
  display: grid;
  grid-template-columns: clamp(10px, 26.171875vw, 335px) -webkit-max-content;
  grid-template-columns: clamp(10px, 26.171875vw, 335px) max-content;
  -webkit-column-gap: clamp(10px, 5.234375vw, 67px);
     -moz-column-gap: clamp(10px, 5.234375vw, 67px);
          column-gap: clamp(10px, 5.234375vw, 67px);
  place-items: center;
  margin: clamp(10px, 8.203125vw, 105px) 0 0 clamp(10px, 23.984375vw, 307px);
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea .lookArea_bottom {
    grid-template-columns: 78.9333333333vw;
    place-content: center;
    row-gap: 6.1333333333vw;
    margin: 10.6666666667vw 0 0;
  }
}
#stcContents .lookArea .lookArea_bottom .txtWrap {
  display: grid;
  row-gap: clamp(10px, 2.03125vw, 26px);
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea .lookArea_bottom .txtWrap {
    row-gap: 5.3333333333vw;
  }
}
#stcContents .lookArea .lookArea_bottom .txtWrap h4 {
  font-family: "minion-pro", serif;
  font-size: clamp(1px, 1.4545454545vw, 16px);
  font-weight: 600;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea .lookArea_bottom .txtWrap h4 {
    font-size: 4.5333333333vw;
  }
}
#stcContents .lookArea .lookArea_bottom .txtWrap h4 {
  color: #000000;
  text-align: center;
}
#stcContents .lookArea .lookArea_bottom .txtWrap > p {
  font-family: "Zen Old Mincho", serif;
  font-size: clamp(1px, 1.1818181818vw, 13px);
  font-weight: 500;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea .lookArea_bottom .txtWrap > p {
    font-size: 3.4666666667vw;
  }
}
#stcContents .lookArea .lookArea_bottom .txtWrap > p {
  color: #2A2A2A;
  line-height: 1.6923076923;
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea .lookArea_bottom .txtWrap > p {
    text-align: center;
    line-height: 1.8461538462;
  }
}
#stcContents .lookArea .linkBtn {
  margin-top: clamp(10px, 4.84375vw, 62px);
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea .linkBtn {
    margin-top: 8vw;
  }
}
#stcContents .lookArea_heading {
  grid-area: area2;
}
#stcContents .lookArea_heading .num {
  font-family: "minion-pro", serif;
  font-size: clamp(1px, 2vw, 22px);
  font-weight: 600;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea_heading .num {
    font-size: 4vw;
  }
}
#stcContents .lookArea_heading .num {
  color: #000000;
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea_heading .num {
    text-align: center;
  }
}
#stcContents .lookArea_heading .num span {
  font-family: "minion-pro", serif;
  font-size: clamp(1px, 2.6363636364vw, 29px);
  font-weight: 600;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea_heading .num span {
    font-size: 5.3333333333vw;
  }
}
#stcContents .lookArea_heading .num span {
  margin-left: 4px;
}
#stcContents .lookArea_heading h2 {
  font-family: "Zen Old Mincho", serif;
  font-size: clamp(1px, 1.7272727273vw, 19px);
  font-weight: 500;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea_heading h2 {
    font-size: 4.2666666667vw;
  }
}
#stcContents .lookArea_heading h2 {
  color: #2A2A2A;
  line-height: 1.6842105263;
  margin-top: clamp(1px, 0.3125vw, 4px);
}
@media screen and (max-width: 767px) {
  #stcContents .lookArea_heading h2 {
    line-height: 1.75;
    text-align: center;
    margin-top: 2.4vw;
  }
}
#stcContents .outfitArea {
  grid-area: area1;
}
@media screen and (max-width: 767px) {
  #stcContents .outfitArea {
    margin-top: 5.0666666667vw;
  }
}
#stcContents .staffArea {
  grid-area: area3;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: clamp(10px, 8.515625vw, 109px) -webkit-max-content;
  grid-template-rows: clamp(10px, 8.515625vw, 109px) max-content;
  row-gap: clamp(10px, 2.1875vw, 28px);
  margin-top: clamp(1px, 1.015625vw, 13px);
}
@media screen and (max-width: 767px) {
  #stcContents .staffArea {
    grid-template-rows: unset;
    row-gap: 5.3333333333vw;
    margin-top: 4.5333333333vw;
  }
}
#stcContents .profArea {
  position: relative;
  padding: clamp(10px, 1.796875vw, 23px) 0 clamp(10px, 2.109375vw, 27px);
}
@media screen and (max-width: 767px) {
  #stcContents .profArea {
    padding: 0 0 3.2vw;
  }
}
#stcContents .profArea h3 {
  font-family: "avenir-next-lt-pro", "avenir-lt-pro", sans-serif;
  font-size: clamp(1px, 2.0909090909vw, 23px);
  font-weight: 500;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .profArea h3 {
    font-size: 7.4666666667vw;
  }
}
#stcContents .profArea h3 {
  color: #2A2A2A;
}
@media screen and (max-width: 767px) {
  #stcContents .profArea h3 {
    text-align: center;
  }
}
#stcContents .profArea h3 > span {
  font-family: "avenir-next-lt-pro", "avenir-lt-pro", sans-serif;
  font-size: clamp(1px, 1.4545454545vw, 16px);
  font-weight: 400;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .profArea h3 > span {
    font-size: 3.7333333333vw;
  }
}
#stcContents .profArea h3 > span {
  margin-right: 5px;
}
@media screen and (max-width: 767px) {
  #stcContents .profArea h3 > span {
    margin-right: 2.6666666667vw;
  }
}
#stcContents .profArea::before, #stcContents .profArea::after {
  position: absolute;
  display: inline-block;
  content: "";
  background-repeat: no-repeat;
  background-size: contain;
  left: 0;
  width: clamp(10px, 33.4375vw, 428px);
  height: 1px;
  background-color: #2A2A2A;
}
@media screen and (max-width: 767px) {
  #stcContents .profArea::before, #stcContents .profArea::after {
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 78.9333333333vw;
  }
}
#stcContents .profArea::before {
  top: 0;
}
@media screen and (max-width: 767px) {
  #stcContents .profArea::before {
    display: none;
  }
}
#stcContents .profArea::after {
  bottom: 0;
}
@media screen and (max-width: 767px) {
  #stcContents .commentArea {
    width: 69.0666666667vw;
    margin-inline: auto;
  }
}
#stcContents .commentArea .txtWrap > p {
  font-family: "Zen Old Mincho", serif;
  font-size: clamp(1px, 1.0909090909vw, 12px);
  font-weight: 500;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .commentArea .txtWrap > p {
    font-size: 3.2vw;
  }
}
#stcContents .commentArea .txtWrap > p {
  color: #2A2A2A;
  line-height: 1.8333333333;
}
@media screen and (max-width: 767px) {
  #stcContents .commentArea .txtWrap > p {
    line-height: 1.8461538462;
    font-family: "Zen Old Mincho", serif;
    font-size: clamp(1px, 1.1818181818vw, 13px);
    font-weight: 500;
    font-style: normal;
    text-align: left;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  #stcContents .commentArea .txtWrap > p {
    font-size: 3.4666666667vw;
  }
}
#stcContents .commentArea .linkArea {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-column-gap: clamp(10px, 1.09375vw, 14px);
     -moz-column-gap: clamp(10px, 1.09375vw, 14px);
          column-gap: clamp(10px, 1.09375vw, 14px);
  margin-top: clamp(10px, 2.1875vw, 28px);
}
@media screen and (max-width: 767px) {
  #stcContents .commentArea .linkArea {
    display: grid;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: end;
    row-gap: 2.6666666667vw;
    margin-top: 10.9333333333vw;
  }
}
#stcContents .staffArea_detail {
  font-family: "avenir-next-lt-pro", "avenir-lt-pro", sans-serif;
  font-size: clamp(1px, 1.4545454545vw, 16px);
  font-weight: 400;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .staffArea_detail {
    font-size: 4.2666666667vw;
  }
}
#stcContents .staffArea_detail {
  margin-top: clamp(1px, 0.78125vw, 10px);
}
@media screen and (max-width: 767px) {
  #stcContents .staffArea_detail {
    text-align: center;
    margin-top: 2.4vw;
  }
}
#stcContents .itemArea {
  grid-area: area4;
  width: clamp(10px, 24.0625vw, 308px);
  height: clamp(10px, 16.875vw, 216px);
  margin: auto auto 0;
  outline: 1px solid #2A2A2A;
  outline-offset: -1px;
}
@media screen and (max-width: 767px) {
  #stcContents .itemArea {
    width: 78.9333333333vw;
    height: 55.4666666667vw;
    margin-top: 12.5333333333vw;
  }
}
#stcContents .itemArea a {
  display: grid;
  grid-template-columns: 1fr;
  place-content: center;
  justify-items: center;
}
#stcContents .slideItem {
  position: relative;
  display: grid;
  place-content: center;
  place-items: center;
  height: 100%;
}
#stcContents .slideItem .swiper {
  width: clamp(10px, 19.84375vw, 254px);
}
@media screen and (max-width: 767px) {
  #stcContents .slideItem .swiper {
    width: 65.0666666667vw;
  }
}
#stcContents .slideItem .swiper-slide:last-child {
  margin-right: 0 !important;
}
#stcContents .movieArea {
  grid-area: area5;
  width: clamp(10px, 51.796875vw, 663px);
  margin: clamp(10px, 5.78125vw, 74px) 0 0 clamp(10px, 9.21875vw, 118px);
}
@media screen and (max-width: 767px) {
  #stcContents .movieArea {
    width: 100vw;
    margin: 6.6666666667vw 0 0;
  }
}
#stcContents #item01 .itemArea .swiper-wrapper {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 767px) {
  #stcContents #item01 .lookArea_heading,
  #stcContents #item02 .lookArea_heading,
  #stcContents #item03 .lookArea_heading,
  #stcContents #item04 .lookArea_heading,
  #stcContents #item05 .lookArea_heading,
  #stcContents #item06 .lookArea_heading {
    margin-top: 0;
  }
}
#stcContents .btnArea {
  margin-top: clamp(10px, 7.03125vw, 90px);
}
@media screen and (max-width: 767px) {
  #stcContents .btnArea {
    margin-top: 16.5333333333vw;
  }
}
#stcContents .footerArea {
  position: relative;
  margin-top: clamp(10px, 12.65625vw, 162px);
  padding-top: clamp(10px, 11.328125vw, 145px);
}
@media screen and (max-width: 767px) {
  #stcContents .footerArea {
    margin-top: 14.4vw;
    padding-top: 12.8vw;
  }
}
#stcContents .footerArea::before {
  position: absolute;
  display: inline-block;
  content: "";
  width: clamp(10px, 51.40625vw, 658px);
  height: 1px;
  background-color: #2A2A2A;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
  #stcContents .footerArea::before {
    width: 78.9333333333vw;
  }
}
#stcContents .catalogArea {
  display: grid;
  grid-template-columns: clamp(10px, 51.40625vw, 658px);
  place-content: center;
}
@media screen and (max-width: 767px) {
  #stcContents .catalogArea {
    grid-template-columns: 77.8666666667vw;
  }
}
#stcContents .catalogArea h3 {
  font-family: "Zen Old Mincho", serif;
  font-size: clamp(1px, 1.0909090909vw, 12px);
  font-weight: 500;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .catalogArea h3 {
    font-size: 3.4666666667vw;
  }
}
#stcContents .catalogArea h3 {
  color: #2A2A2A;
  text-align: center;
}
#stcContents .catalogArea .imgWrap {
  width: 100%;
  margin-top: clamp(10px, 1.40625vw, 18px);
}
@media screen and (max-width: 767px) {
  #stcContents .catalogArea .imgWrap {
    margin-top: 2.6666666667vw;
  }
}
#stcContents .catalogArea .linkText {
  margin-top: 6px;
  text-align: right;
}
@media screen and (max-width: 767px) {
  #stcContents .catalogArea .linkText {
    margin-top: 2.4vw;
    padding-right: 2.6666666667vw;
  }
}
#stcContents .staffCredit {
  width: clamp(10px, 16.40625vw, 210px);
  margin-top: clamp(10px, 6.484375vw, 83px);
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  #stcContents .staffCredit {
    width: 57.6vw;
    margin-top: 11.7333333333vw;
  }
}
#stcContents .staffCredit h3 {
  font-family: "minion-pro-display", serif;
  font-size: clamp(1px, 1vw, 11px);
  font-weight: 400;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .staffCredit h3 {
    font-size: 2.6666666667vw;
  }
}
#stcContents .staffCredit h3 {
  color: #2A2A2A;
  text-align: center;
}
#stcContents .staffCredit h3:nth-child(2 of h3) {
  margin-top: clamp(10px, 2.1875vw, 28px);
}
@media screen and (max-width: 767px) {
  #stcContents .staffCredit h3:nth-child(2 of h3) {
    margin-top: 1.8666666667vw;
  }
}
#stcContents .staffCredit ul {
  display: grid;
  grid-template-columns: 1fr;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-column-gap: 12px;
     -moz-column-gap: 12px;
          column-gap: 12px;
  row-gap: 7px;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  margin-top: 7px;
}
#stcContents .staffCredit ul li {
  font-family: "minion-pro-display", serif;
  font-size: clamp(1px, 1vw, 11px);
  font-weight: 400;
  font-style: normal;
  text-align: left;
}
@media screen and (max-width: 767px) {
  #stcContents .staffCredit ul li {
    font-size: 2.9333333333vw;
  }
}
#stcContents .staffCredit ul li {
  color: #2A2A2A;
  text-align: center;
}
#stcContents .snsArea {
  margin-top: clamp(10px, 9.6875vw, 124px);
}
@media screen and (max-width: 767px) {
  #stcContents .snsArea {
    margin-top: 10.9333333333vw;
  }
}
#stcContents .snsArea ul {
  display: grid;
  grid-template-columns: repeat(3, clamp(10px, 5.625vw, 72px));
  place-content: center;
  -webkit-column-gap: clamp(10px, 3.046875vw, 39px);
     -moz-column-gap: clamp(10px, 3.046875vw, 39px);
          column-gap: clamp(10px, 3.046875vw, 39px);
}
@media screen and (max-width: 767px) {
  #stcContents .snsArea ul {
    grid-template-columns: repeat(3, 11.4666666667vw);
    -webkit-column-gap: 6.1333333333vw;
       -moz-column-gap: 6.1333333333vw;
            column-gap: 6.1333333333vw;
  }
}