@charset "utf-8";
/* CSS Document */

/* base
-----------------------------------------------*/*,
*::before,
*::after {
  box-sizing: border-box;
}
/* ========== base style ========== */

/* common parts
-----------------------------------------------*/
/* ========== text ========== */
/* ========== border ========== */
/* ========== float ========== */
/* ========== display ========== */
/* ========== position ========== */
/* ========== overflow ========== */
/* ========== width ========== */
/* ========== margin ========== */
/* ========== background ========== */
/* ========== device displaying ========== */
/* ========== animation for ScrollTrigger.min.js  ========== */

/* other style
-----------------------------------------------*/
body.static .wrapper {margin-top: 0!important;}

/* ========== device displaying ========== */
.sp_none{ display: none; }
img.sp_none{ display: none; }
.sp_only{ display: block; }
img.sp_only{ display: block; }
@media (min-width:768px){
	.sp_none{display: block;}
	img.sp_none{display: block;}
	.tab_none { display: none; }
	img.tab_none { display: none; }
	.sp_only{display: none;}
	img.sp_only{display: none;}
	.sp_only{display: none;}
	img.sp_only{display: none;}
}
.spc_none{ display: block; }
@media (min-width:720px){.pc_none{display: block;}}
.pc_only{ display: none; }
@media (min-width:721px){.pc_none{display: none;}
.pc_only{display: block;}
.tab_none{ display: block; }
}

/* ========== animation for ScrollTrigger.min.js  ========== */
.invisible {
transition: opacity 1s ease;
opacity: 0.0;
}
.visible {
transition: opacity 1s ease;
opacity: 1.0;
}

.anime-a {
  transition: opacity 0.8s ease, visibility 0.8s ease;
}
.anime-a.visible {
  opacity: 1;
  visibility: visible;
}

/* font
-----------------------------------------------*/
:root {
  --font-bodoni: "Bodoni Moda", serif;
  --font-instrument: "Instrument Sans", sans-serif;
  --font-noto-serif: "Noto Serif JP", serif;
}

.main-hero__title,
.main-hero__txt--en,
.look__number,
.look__txt,
.look__copy {
  font-family: var(--font-bodoni);
  font-weight: 400;
}
.credit__name,
.credit__price,
.staff-credit__title,
.staff-credit__txt,
.outro__nav-title,
.outro__nav-list-link {
  font-family: var(--font-instrument);
  font-weight: 400;
}
.main-hero__season,
.credit__type {
  font-family: var(--font-instrument);
  font-weight: 500;
}
.main-hero__txt--jp {
  font-family: var(--font-noto-serif);
  font-weight: 500;
}


/* other style
-----------------------------------------------*/
body {
  margin: 0;
  padding: 0;
  color: #000;
  background: #EEEEEE;
}
img{vertical-align: top;}
picture {
  display: flex;
}

.look__link {display: flex;}

#for-parallax-wrapper {
  width: 100%;
  background: #EEEEEE;
  position: relative;
  z-index: 10; /* パララックス画像の上に確実に被さるようにする */
}

@media screen and (max-width: 768px) {
  #for-parallax-wrapper {
    padding: calc(106 / 375 * 100vw) 0 0;
  }
  .parallax-box {
    margin: calc(39 / 375 * 100vw) 0 0;
    position: relative;
    width: 100%;
    height: calc(520 / 375 * 100vw); 
    overflow: hidden;
    z-index: 1;
  }
  .parallax-box__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width: 769px) {
  #for-parallax-wrapper {
    padding: min(calc(100 / 1440 * 100vw), 100px) 0 0;
  }
  .parallax-box {
    margin: min(calc(100 / 1440 * 100vw), 100px) 0 0;
    position: relative;
    width: 100%;
    height: min(calc(520 / 1440 * 100vw), 520px); 
    overflow: hidden;
    z-index: 1
  }
  .parallax-box__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

@media screen and (max-width: 768px) {

  .main-hero {
    width:calc(345 / 375 * 100vw);
    margin: calc(20 / 375 * 100vw) auto 0;
  }
  .main-hero__logo {
    width:calc(102 / 375 * 100vw);
    margin: 0 auto 0;
  }
  .main-hero__logo-img {
    width: calc(102 / 375 * 100vw);
    height: calc(17 / 375 * 100vw);
  }
  .main-hero__figure {
    width: calc(345 / 375 * 100vw);
    margin: calc(20 / 375 * 100vw) 0 0;
  }
  .main-hero__visual {
    width: calc(345 / 375 * 100vw);
    height: calc(276 / 375 * 100vw);
  }
  .main-hero__title {
    margin: calc(-20 / 375 * 100vw) 0 0;
    padding: 0 0 0 calc(29 / 375 * 100vw);
    font-size: calc(40 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #BBB;
  }
  .main-hero__season {
    margin: calc(10 / 375 * 100vw) 0 0;
    padding: 0 0 0 calc(30 / 375 * 100vw);
    font-size: calc(11 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0.04em;
    color: #BBB;
  }
  .main-hero__message-wrapper {
    margin: calc(20 / 375 * 100vw) 0 0;
    padding: 0 0 0 calc(30 / 375 * 100vw);
  }
  .main-hero__message {
    margin: 0;
  }
  .main-hero__message + .main-hero__message {margin-top: calc(34 / 375 * 100vw);}
  .main-hero__txt {}
  .main-hero__txt--en {
    font-size: calc(10 / 375 * 100vw);
    line-height: 2;
    letter-spacing: 0.01em;
    color: #666;
  }
  .main-hero__txt--jp {
    font-size: calc(10 / 375 * 100vw);
    line-height: 2.1;
    letter-spacing: 0.13em;
    color: #666;
  }

  .credit {
    display: flex;
    justify-content: right;
    gap: calc(32 / 375 * 100vw);
    padding: 0 calc(24 / 375 * 100vw) 0 0;
  }
  .credit__wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin: calc(30 / 375 * 100vw) 0 0;
  }
  .credit__type {
    margin: 0;
    font-size: calc(10 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0.04em;
    color: #666;
  }
  .credit__list {
    margin: calc(20 / 375 * 100vw) 0 0;
    padding: 0;
    list-style: none;
  }
  .credit__item {
    display: flex;
    justify-content: right;
  }
  .credit__item + .credit__item {
    margin-top: calc(14 / 375 * 100vw);
  }
  a.credit__link {
    display: flex;
    gap: calc(10 / 375 * 100vw);
    font-size: calc(11 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0.04em;
    color: #666;
    text-decoration: none;
  }
  .credit__name {}
  .credit__price {
    text-decoration: underline;
  }
  a.credit__link:hover .credit__price {
    text-decoration: none;
  }

  .look {}
  .look__wrapper {
  }
  .look__primary {
    position: relative;
  }
  .look__secondary {
    position: relative;
  }
  .look__number,
  .look__txt,
  .look__copy {
    margin: 0;
  }

  #look01 {
    margin: calc(72 / 375 * 100vw) 0 0;
  }
  #look01 .look__primary {
    width: 100%;
  }
  #look01 .look__primary .look__number {
    position: absolute;
    bottom: calc(-20 / 375 * 100vw);
    left: calc(44 / 375 * 100vw);
    font-size:calc(40 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #BBB;
    z-index: 2;
  }
  #look01 .look__primary .look__txt {
    position: absolute;
    top: 50%;
    left: calc(12 / 375 * 100vw);
    transform-origin: top left; 
    transform: rotate(90deg) translateX(-50%) translateY(-100%);
    font-size:calc(10 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  #look01 .look__primary .look__img {
  }
  #look01 .look__secondary {
    background: #1F3122;
    width: 100%;
    padding: calc(90 / 375 * 100vw) calc(68 / 375 * 100vw);
  }
  #look01 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }

  #look02 {
    margin: calc(76 / 375 * 100vw) 0 0;
  }
  #look02 .look__primary {
    background: #fff;
    width: 100%;
    padding: calc(46 / 375 * 100vw) calc(34 / 375 * 100vw);
  }
  #look02 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look02 .look__primary .look__txt {
    position: absolute;
    top: 50%;
    left: calc(12 / 375 * 100vw);
    transform-origin: top left; 
    transform: rotate(90deg) translateX(-50%) translateY(-100%);
    font-size: calc(10 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look02 .look__secondary {
    background: #fff;
    width: 100%;
    padding: calc(128 / 375 * 100vw) 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: calc(15 / 375 * 100vw);
  }
  #look02 .look__secondary .look__number {
    font-size: calc(40 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look02 .look__secondary .look__copy {
    font-size: calc(20 / 375 * 100vw);
    line-height: 1.35;
    letter-spacing: 0;
    color: #666;
    text-align: center;
  }

  #look03 {
    margin: calc(96 / 375 * 100vw) 0 0;
  }
  #look03 .look__primary {
    background: #fff;
    width: 100%;
    padding: calc(50 / 375 * 100vw) calc(75 / 375 * 100vw) calc(50 / 375 * 100vw) 0;
  }
  #look03 .look__primary .look__number {
    position: absolute;
    top: 50%;
    right: calc(16 / 375 * 100vw);
    transform: translateY(-50%);
    font-size: calc(40 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look03 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look03 .look__secondary {
    background: #fff;
    width: 100%;
    padding: calc(50 / 375 * 100vw) 0 calc(50 / 375 * 100vw) calc(75 / 375 * 100vw);
  }
  #look03 .look__secondary .look__txt {
    position: absolute;
    top: 50%;
    left: calc(12 / 375 * 100vw);
    transform-origin: top left; 
    transform: rotate(90deg) translateX(-50%) translateY(-100%);
    font-size: calc(10 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look03 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }
  
  #look04 {
    margin: calc(147 / 375 * 100vw) 0 0;
  }
  #look04 .look__primary {
    width: 100%;
  }
  #look04 .look__primary .look__number {
    position: absolute;
    top: calc(23 / 375 * 100vw);
    right: calc(17 / 375 * 100vw);
    font-size: calc(40 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  #look04 .look__primary .look__txt {
    position: absolute;
    top: 50%;
    left: calc(12 / 375 * 100vw);
    transform-origin: top left; 
    transform: rotate(90deg) translateX(-50%) translateY(-100%);
    font-size: calc(10 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  #look04 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look04 .look__secondary {
    width: 100%;
  }
  #look04 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }
  
  #look05 {
    margin: calc(115 / 375 * 100vw) 0 0;
  }
  #look05 .look__primary {
    width: 100%;
  }
  #look05 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look05 .look__secondary {
    background: #F5D9E8;
    width: 100%;
    padding: calc(90 / 375 * 100vw) calc(68 / 375 * 100vw);
  }
  #look05 .look__secondary .look__number {
    position: absolute;
    bottom: calc(70 / 375 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    font-size: calc(40 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look05 .look__secondary .look__txt {
    position: absolute;
    top: 50%;
    right: calc(30 / 375 * 100vw);
    transform-origin: top right; 
    transform: rotate(90deg) translateX(50%);
    font-size: calc(10 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look05 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }
  
  #look0607 {
    margin: 0;
  }
  #look0607 .look__primary {
    background: #fff;
    width: 100%;
    padding: calc(46 / 375 * 100vw) calc(34 / 375 * 100vw);
   }
  #look0607 .look__primary .look__number {
    position: absolute;
    top:  calc(26 / 375 * 100vw);
    left:  calc(19 / 375 * 100vw);
    font-size: calc(40 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #BBB;
  }
  #look0607 .look__primary .look__txt {
    position: absolute;
    top: 50%;
    left: calc(12 / 375 * 100vw);
    transform-origin: top left; 
    transform: rotate(90deg) translateX(-50%) translateY(-100%);
    font-size: calc(10 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look0607 .look__primary .look__copy {
    position: absolute;
    bottom: calc(18 / 375 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    font-size: calc(14 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look0607 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look0607 .look__secondary {
    background: #fff;
    width: 100%;
    padding: calc(46 / 375 * 100vw) calc(34 / 375 * 100vw);
  }
  #look0607 .look__secondary .look__number {
    position: absolute;
    top:  calc(26 / 375 * 100vw);
    right:  calc(19 / 375 * 100vw);
    font-size: calc(40 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #BBB;
  }
  #look0607 .look__secondary .look__txt {
    position: absolute;
    top: 50%;
    right: calc(12 / 375 * 100vw);
    transform-origin: top right; 
    transform: rotate(90deg) translateX(50%);
    font-size: calc(10 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look0607 .look__secondary .look__copy {
    position: absolute;
    bottom: calc(18 / 375 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    font-size: calc(14 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look0607 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }

  #look08 {
    margin: calc(49 / 375 * 100vw) 0 0;
  }
  #look08 .look__primary {
    background: #EFDBC3;
    width: 100%;
    padding: calc(90 / 375 * 100vw) calc(68 / 375 * 100vw);
  }
  #look08 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look08 .look__secondary {
    width: 100%;
  }
  #look08 .look__secondary .look__number {
    position: absolute;
    bottom: calc(16 / 375 * 100vw);
    right: calc(14 / 375 * 100vw);
    font-size: calc(40 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  #look08 .look__secondary .look__txt {
    position: absolute;
    bottom: calc(72 / 375 * 100vw);
    right: calc(30 / 375 * 100vw);
    transform-origin: top right; 
    transform: rotate(90deg);
    font-size: calc(10 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  #look08 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }

  #look09 {
    margin: calc(67 / 375 * 100vw) 0 0;
  }
  #look09 .look__primary {
    background: #fff;
    width: 100%;
    padding: calc(52 / 375 * 100vw) calc(69 / 375 * 100vw) calc(132 / 375 * 100vw);
  }
  #look09 .look__primary .look__number {
    position: absolute;
    bottom: calc(77 / 375 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    font-size: calc(40 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look09 .look__primary .look__txt {
    position: absolute;
    bottom: calc(43 / 375 * 100vw);
    left: 50%;
    transform: translateX(-50%);
    font-size: calc(10 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look09 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look09 .look__secondary {
    background: #fff;
    width: 100%;
    padding: calc(38 / 375 * 100vw) calc(28 / 375 * 100vw);
  }
  #look09 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }

  #look10 {
    margin: calc(58 / 375 * 100vw) 0 0;
  }
  #look10 .look__primary {
    background: #fff;
    width: 100%;
    padding: calc(50 / 375 * 100vw) 0 calc(50 / 375 * 100vw)  calc(75 / 375 * 100vw);
  }
  #look10 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look10 .look__secondary {
    background: #E8F1F6;
    width: 100%;
    padding: calc(50 / 375 * 100vw) calc(75 / 375 * 100vw) calc(50 / 375 * 100vw) 0;
  }
  #look10 .look__secondary .look__number {
    position: absolute;
    top: 50%;
    right: calc(18 / 375 * 100vw);
    transform: translateY(-50%);
    font-size: calc(40 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look10 .look__secondary .look__txt {
    position: absolute;
    bottom: calc(40 / 375 * 100vw);
    right: calc(35 / 375 * 100vw);
    transform-origin: top right; 
    transform: rotate(90deg);
    font-size: calc(10 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look10 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }

  .all-items {
    width: calc(235 / 375 * 100vw);
    margin: calc(79 / 375 * 100vw) auto 0;
  }
  a.all-items__link {
    display: flex;
    width: calc(235 / 375 * 100vw);
  }
  .all-items__img {
    width: calc(235 / 375 * 100vw);
    height: calc(42 / 375 * 100vw);
  }

  .staff-credit {
    margin: calc(62 / 375 * 100vw) auto 0;
    text-align: center;
  }
  .staff-credit__title {
    margin: 0;
    font-size: calc(11 / 375 * 100vw);
    line-height: 2.27;
    letter-spacing: 0.04em;
    color: #666;
  }
  .staff-credit__txt {
    margin: 0;
    font-size: calc(11 / 375 * 100vw);
    line-height: 2.27;
    letter-spacing: 0.04em;
    color: #666;
  }

  .outro {
    margin: calc(62 / 375 * 100vw) 0 0;
    padding: calc(47 / 375 * 100vw) 0 calc(73 / 375 * 100vw);
    background: #000;
  }
  .outro__nav {
    margin: 0;
    font-size: calc(12 / 375 * 100vw);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  .outro__nav-item + .outro__nav-item {
    margin-top: calc(30 / 375 * 100vw);
  }
  .outro__nav-title {
    text-align: center;
  }
  .outro__nav-contents {
    margin: calc(10 / 375 * 100vw) 0 0;
  }
  .outro__nav-list {
    display: flex;
    justify-content: center;
    list-style: none;
    margin: 0;
    padding: 0;
  }
  .outro__nav-list-item {
    position: relative;
    padding: 0 calc(10 / 375 * 100vw) 0;
  }
  .outro__nav-list-item:not(:last-child)::after {
    position: absolute;
    top: 0;
    right: 0;
    content: "";
    width: calc(1 / 375 * 100vw);
    height: calc(11 / 375 * 100vw);
    background: #fff;
  }
  a.outro__nav-list-link {
    text-decoration: none;
    color: #fff;
  }
  a.outro__nav-list-link:hover {
    text-decoration: underline;
  }
  .outro__sns {
    display: flex;
    justify-content: center;
    gap: calc(10 / 375 * 100vw);
    list-style: none;
    margin: calc(58 / 375 * 100vw) 0 0;
    padding: 0;
  }
  .outro__sns-item {}
  .outro__sns-link {}
  .outro__sns-img {
    display: block;
    width: calc(40 / 375 * 100vw);
    height: calc(40 / 375 * 100vw);
  }
  .outro__logo {
    margin: calc(30 / 375 * 100vw) auto 0;
    width: calc(120 / 375 * 100vw);
  }
  .outro__logo-img {
    display: block;
    width: calc(120 / 375 * 100vw);
    height: calc(20 / 375 * 100vw);
  }
}

@media screen and (min-width: 769px) and (max-width: 1240px) {
  .credit {
    margin-right: 2vw;
  }
}

@media screen and (min-width: 769px) {

  .main-hero {
    max-width: min(calc(999 / 1240 * 100vw), 999px);
    margin: 0 auto;
    padding: 0 min(calc(157 / 1240 * 100vw), 157px);
  }
  .main-hero__logo {
    margin: min(calc(30 / 1240 * 100vw), 30px) auto 0;
    width: min(calc(102 / 1240 * 100vw), 102px);
  }
  .main-hero__logo-img {
    width: min(calc(102 / 1240 * 100vw), 102px);
    height: auto;
  }
  .main-hero__figure {
    position: relative;
    margin: min(calc(30 / 1240 * 100vw), 30px) 0 0;
    width: min(calc(685 / 1240 * 100vw), 658px);
  }
  .main-hero__visual {
    width: min(calc(685 / 1240 * 100vw), 658px);
    height: auto;
  }
  .main-hero__title {
    margin: 0;
    position: absolute;
    bottom: max(calc(-40 / 1240 * 100vw), -40px);
    right: max(calc(-160 / 1240 * 100vw), -160px);
    font-size: min(calc(80 / 1240 * 100vw), 80px);
    line-height: 1;
    letter-spacing: 0;
    color: #BBB;
  }
  .main-hero__season {
    margin: 0;
    position: absolute;
    bottom: max(calc(-30 / 1240 * 100vw), -30px);
    left: 0;
    font-size: min(calc(16 / 1240 * 100vw), 16px);
    line-height: 1;
    letter-spacing: 0.04em;
    color: #BBB;
  }
  .main-hero__message-wrapper {
    display: flex;
    margin: min(calc(80 / 1240 * 100vw), 80px) 0 0;
    gap:  min(calc(70 / 1240 * 100vw), 70px);
  }
  .main-hero__message {
    margin: 0;
  }
  .main-hero__txt {
    margin: 0;
    color: #666;
  }
  .main-hero__txt + .main-hero__txt {margin-top: min(calc(20 / 1240 * 100vw), 20px);}
  .main-hero__txt--en {
    font-size: min(calc(13.2 / 1240 * 100vw), 13.2px);
    line-height: 1.73;
    letter-spacing: 0.01em;
  }
  .main-hero__txt--jp {
    font-size: min(calc(11 / 1240 * 100vw), 11px);
    line-height: 2.09;
    letter-spacing: 0.13em;
  }

  .credit {
    display: flex;
    justify-content: right;
    gap: min(calc(40 / 1240 * 100vw), 40px);
  }
  .credit__wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin: min(calc(18 / 1240 * 100vw), 18px) 0 0;
  }
  .credit__type {
    margin: 0;
    font-size: min(calc(10 / 1240 * 100vw), 10px);
    line-height: 1;
    letter-spacing: 0.04em;
    color: #666;
  }
  .credit__list {
    margin: min(calc(18 / 1240 * 100vw), 18px) 0 0;
    padding: 0;
    list-style: none;
  }
  .credit__item {
    display: flex;
    justify-content: right;
  }
  .credit__item + .credit__item {
    margin-top: min(calc(15 / 1240 * 100vw), 15px);
  }
  a.credit__link {
    display: flex;
    gap: 10px;
    font-size: min(calc(11 / 1240 * 100vw), 11px);
    line-height: 1;
    letter-spacing: 0.04em;
    color: #666;
    text-decoration: none;
  }
  .credit__name {}
  .credit__price {
    text-decoration: underline;
  }
  a.credit__link:hover .credit__price {
    text-decoration: none;
  }

  .look {
    max-width: min(calc(1240 / 1240 * 100vw), 1240px);
    margin: min(calc(100 / 1240 * 100vw), 100px) auto 0;
  }
  .look__wrapper {
    display: flex;
  }
  .look__primary {
    position: relative;
  }
  .look__secondary {
    position: relative;
  }
  .look__number,
  .look__txt,
  .look__copy {
    margin: 0;
  }

  #look01 .look__primary {
    width: min(calc(620 / 1240 * 100vw), 620px);
  }
  #look01 .look__primary .look__number {
    position: absolute;
    bottom: max(calc(-15 / 1240 * 100vw), -15px);
    left: min(calc(58 / 1240 * 100vw), 58px);
    font-size: min(calc(40 / 1240 * 100vw), 40px);
    line-height: 1;
    letter-spacing: 0;
    color: #BBB;
  }
  #look01 .look__primary .look__txt {
    position: absolute;
    top: 50%;
    left: min(calc(30 / 1240 * 100vw), 30px);
    transform-origin: top left; 
    transform: rotate(90deg) translateX(-50%) translateY(-100%);
    font-size: min(calc(10 / 1240 * 100vw), 10px);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  #look01 .look__primary .look__img {
    width: min(calc(620 / 1240 * 100vw), 620px);
    height: min(calc(827 / 1240 * 100vw), 827px);
  }
  #look01 .look__secondary {
    background: #1F3122;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(150 / 1240 * 100vw), 150px) min(calc(112 / 1240 * 100vw), 112px);
  }
  #look01 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }

  #look02 .look__primary {
    background: #fff;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(76 / 1240 * 100vw), 76px) min(calc(57 / 1240 * 100vw), 57px);
  }
  #look02 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look02 .look__primary .look__txt {
    position: absolute;
    top: 50%;
    left: min(calc(30 / 1240 * 100vw), 30px);
    transform-origin: top left; 
    transform: rotate(90deg) translateX(-50%) translateY(-100%);
    font-size: min(calc(10 / 1240 * 100vw), 10px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look02 .look__secondary {
    background: #fff;
    width: min(calc(620 / 1240 * 100vw), 620px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: min(calc(15 / 1240 * 100vw), 15px);
  }
  #look02 .look__secondary .look__number {
    font-size: min(calc(40 / 1240 * 100vw), 40px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look02 .look__secondary .look__copy {
    font-size: min(calc(20 / 1240 * 100vw), 20px);
    line-height: 1.35;
    letter-spacing: 0;
    color: #666;
    text-align: center;
  }

  #look03 .look__primary {
    background: #fff;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(82 / 1240 * 100vw), 82px) min(calc(124 / 1240 * 100vw), 124px) min(calc(82 / 1240 * 100vw), 82px) 0;
  }
  #look03 .look__primary .look__number {
    position: absolute;
    top: 50%;
    right: min(calc(40 / 1240 * 100vw), 40px);
    transform: translateY(-50%);
    font-size: min(calc(40 / 1240 * 100vw), 40px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look03 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look03 .look__secondary {
    background: #fff;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(82 / 1240 * 100vw), 82px) 0 min(calc(82 / 1240 * 100vw), 82px) min(calc(124 / 1240 * 100vw), 124px);
  }
  #look03 .look__secondary .look__txt {
    position: absolute;
    top: 50%;
    left: min(calc(30 / 1240 * 100vw), 30px);
    transform-origin: top left; 
    transform: rotate(90deg) translateX(-50%) translateY(-100%);
    font-size: min(calc(10 / 1240 * 100vw), 10px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look03 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }
  
  #look04 .look__primary {
    width: min(calc(620 / 1240 * 100vw), 620px);
  }
  #look04 .look__primary .look__number {
    position: absolute;
    top: min(calc(30 / 1240 * 100vw), 30px);
    right: min(calc(30 / 1240 * 100vw), 30px);
    font-size: min(calc(40 / 1240 * 100vw), 40px);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  #look04 .look__primary .look__txt {
    position: absolute;
    top: 50%;
    left: min(calc(30 / 1240 * 100vw), 30px);
    transform-origin: top left; 
    transform: rotate(90deg) translateX(-50%) translateY(-100%);
    font-size: min(calc(10 / 1240 * 100vw), 10px);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  #look04 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look04 .look__secondary {
    width: min(calc(620 / 1240 * 100vw), 620px);
  }
  #look04 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }

  #look05 .look__primary {
    width: min(calc(620 / 1240 * 100vw), 620px);
  }
  #look05 .look__primary .look__img {
    width: min(calc(620 / 1240 * 100vw), 620px);
    height: min(calc(827 / 1240 * 100vw), 827px);
  }
  #look05 .look__secondary {
    background: #F5D9E8;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(150 / 1240 * 100vw), 150px) min(calc(112 / 1240 * 100vw), 112px);
  }
  #look05 .look__secondary .look__number {
    position: absolute;
    bottom: min(calc(130 / 1240 * 100vw), 130px);
    left: 50%;
    transform: translateX(-50%);
    font-size: min(calc(40 / 1240 * 100vw), 40px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look05 .look__secondary .look__txt {
    position: absolute;
    top: 50%;
    right: min(calc(40 / 1240 * 100vw), 40px);
    transform-origin: top right; 
    transform: rotate(90deg) translateX(50%);
    font-size: min(calc(10 / 1240 * 100vw), 10px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look05 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }
  
  #look0607 {
    margin-top: 0;
  }
  #look0607 .look__primary {
    background: #fff;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(76 / 1240 * 100vw), 150px) min(calc(57 / 1240 * 100vw), 112px);
   }
  #look0607 .look__primary .look__number {
    position: absolute;
    top:  min(calc(70 / 1240 * 100vw), 70px);
    left:  min(calc(55 / 1240 * 100vw), 55px);
    font-size: min(calc(40 / 1240 * 100vw), 40px);
    line-height: 1;
    letter-spacing: 0;
    color: #BBB;
  }
  #look0607 .look__primary .look__txt {
    position: absolute;
    top: 50%;
    left: min(calc(30 / 1240 * 100vw), 30px);
    transform-origin: top left; 
    transform: rotate(90deg) translateX(-50%) translateY(-100%);
    font-size: min(calc(10 / 1240 * 100vw), 10px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look0607 .look__primary .look__copy {
    position: absolute;
    bottom: min(calc(36 / 1240 * 100vw), 36px);
    left: 50%;
    transform: translateX(-50%);
    font-size: min(calc(14 / 1240 * 100vw), 14px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look0607 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look0607 .look__secondary {
    background: #fff;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(76 / 1240 * 100vw), 150px) min(calc(57 / 1240 * 100vw), 112px);
  }
  #look0607 .look__secondary .look__number {
    position: absolute;
    top:  min(calc(70 / 1240 * 100vw), 70px);
    right:  min(calc(55 / 1240 * 100vw), 55px);
    font-size: min(calc(40 / 1240 * 100vw), 40px);
    line-height: 1;
    letter-spacing: 0;
    color: #BBB;
  }
  #look0607 .look__secondary .look__txt {
    position: absolute;
    top: 50%;
    right: min(calc(30 / 1240 * 100vw), 30px);
    transform-origin: top right; 
    transform: rotate(90deg) translateX(50%);
    font-size: min(calc(10 / 1240 * 100vw), 10px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look0607 .look__secondary .look__copy {
    position: absolute;
    bottom: min(calc(36 / 1240 * 100vw), 36px);
    left: 50%;
    transform: translateX(-50%);
    font-size: min(calc(14 / 1240 * 100vw), 14px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look0607 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }

  #look08 .look__primary {
    background: #EFDBC3;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(150 / 1240 * 100vw), 150px) min(calc(112 / 1240 * 100vw), 112px);
  }
  #look08 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look08 .look__secondary {
    width: min(calc(620 / 1240 * 100vw), 620px);
  }
  #look08 .look__secondary .look__number {
    position: absolute;
    bottom: min(calc(38 / 1240 * 100vw), 38px);
    right: min(calc(32 / 1240 * 100vw), 32px);
    font-size: min(calc(40 / 1240 * 100vw), 40px);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  #look08 .look__secondary .look__txt {
    position: absolute;
    bottom: min(calc(100 / 1240 * 100vw), 100px);
    right: min(calc(50 / 1240 * 100vw), 50px);
    transform-origin: top right; 
    transform: rotate(90deg);
    font-size: min(calc(10 / 1240 * 100vw), 10px);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  #look08 .look__secondary .look__img {
    width: min(calc(620 / 1240 * 100vw), 620px);
    height: min(calc(827 / 1240 * 100vw), 827px);
  }

  #look09 .look__primary {
    background: #fff;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(86 / 1240 * 100vw), 86px) min(calc(114 / 1240 * 100vw), 114px) min(calc(218 / 1240 * 100vw), 218px);
  }
  #look09 .look__primary .look__number {
    position: absolute;
    bottom: min(calc(120 / 1240 * 100vw), 120px);
    left: 50%;
    transform: translateX(-50%);
    font-size: min(calc(40 / 1240 * 100vw), 40px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look09 .look__primary .look__txt {
    position: absolute;
    bottom: min(calc(85 / 1240 * 100vw), 85px);
    left: 50%;
    transform: translateX(-50%);
    font-size: min(calc(10 / 1240 * 100vw), 10px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look09 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look09 .look__secondary {
    background: #fff;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(63 / 1240 * 100vw), 63px) min(calc(47 / 1240 * 100vw), 47px);
  }
  #look09 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }

  #look10 .look__primary {
    background: #fff;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(82 / 1240 * 100vw), 82px) 0 min(calc(82 / 1240 * 100vw), 82px)  min(calc(124 / 1240 * 100vw), 124px);
  }
  #look10 .look__primary .look__img {
    width: 100%;
    height: auto;
  }
  #look10 .look__secondary {
    background: #E8F1F6;
    width: min(calc(620 / 1240 * 100vw), 620px);
    padding: min(calc(82 / 1240 * 100vw), 82px) min(calc(124 / 1240 * 100vw), 124px) min(calc(82 / 1240 * 100vw), 82px) 0;
  }
  #look10 .look__secondary .look__number {
    position: absolute;
    top: 50%;
    right: min(calc(40 / 1240 * 100vw), 40px);
    transform: translateY(-50%);
    font-size: min(calc(40 / 1240 * 100vw), 40px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look10 .look__secondary .look__txt {
    position: absolute;
    bottom: min(calc(72 / 1240 * 100vw), 72px);
    right: min(calc(58 / 1240 * 100vw), 58px);
    transform-origin: top right; 
    transform: rotate(90deg);
    font-size: min(calc(10 / 1240 * 100vw), 10px);
    line-height: 1;
    letter-spacing: 0;
    color: #666;
  }
  #look10 .look__secondary .look__img {
    width: 100%;
    height: auto;
  }

  .all-items {
    width: min(calc(470 / 1240 * 100vw), 470px);
    margin: min(calc(226 / 1240 * 100vw), 226px) auto 0;
  }
  a.all-items__link {
    display: flex;
    width: min(calc(470 / 1240 * 100vw), 470px);
  }
  .all-items__img {
    width: min(calc(470 / 1240 * 100vw), 470px);
    height: min(calc(84 / 1240 * 100vw), 84px);
  }

  .staff-credit {
    margin: min(calc(70 / 1240 * 100vw), 70px) auto 0;
    text-align: center;
  }
  .staff-credit__title {
    margin: 0;
    font-size: min(calc(11 / 1240 * 100vw), 11px);
    line-height: 2.27;
    letter-spacing: 0.04em;
    color: #666;
  }
  .staff-credit__txt {
    margin: 0;
    font-size: min(calc(11 / 1240 * 100vw), 11px);
    line-height: 2.27;
    letter-spacing: 0.04em;
    color: #666;
  }

  .outro {
    margin: min(calc(62 / 1240 * 100vw), 62px) 0 0;
    padding: min(calc(47 / 1240 * 100vw), 47px) 0 min(calc(73 / 1240 * 100vw), 73px);
    background: #000;
  }
  .outro__nav {
    margin: 0;
    font-size: min(calc(12 / 1240 * 100vw), 12px);
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
  }
  .outro__nav-item + .outro__nav-item {
    margin-top: min(calc(36 / 1240 * 100vw), 36px);
  }
  .outro__nav-title {
    text-align: center;
  }
  .outro__nav-contents {
    margin: min(calc(10 / 1240 * 100vw), 10px) 0 0;
  }
  .outro__nav-list {
    display: flex;
    justify-content: center;
    list-style: none;
    margin: 0;
    padding: 0;
  }
  .outro__nav-list-item {
    position: relative;
    padding: 0 min(calc(20 / 1240 * 100vw), 20px) 0;
  }
  .outro__nav-list-item:not(:last-child)::after {
    position: absolute;
    top: 0;
    right: 0;
    content: "";
    width: min(calc(1 / 1240 * 100vw), 1px);
    height: min(calc(10 / 1240 * 100vw), 10px);
    background: #fff;
  }
  a.outro__nav-list-link {
    text-decoration: none;
    color: #fff;
  }
  a.outro__nav-list-link:hover {
    text-decoration: underline;
  }
  .outro__sns {
    display: flex;
    justify-content: center;
    gap: min(calc(10 / 1240 * 100vw), 10px);
    list-style: none;
    margin: min(calc(76 / 1240 * 100vw), 76px) 0 0;
    padding: 0;
  }
  .outro__sns-item {}
  .outro__sns-link {}
  .outro__sns-img {
    display: block;
    width: min(calc(40 / 1240 * 100vw), 40px);
    height: min(calc(40 / 1240 * 100vw), 40px);
  }
  .outro__logo {
    margin: min(calc(30 / 1240 * 100vw), 30px) auto 0;
    width: min(calc(120 / 1240 * 100vw), 120px);
  }
  .outro__logo-img {
    display: block;
    width: min(calc(120 / 1240 * 100vw), 120px);
    height: min(calc(20 / 1240 * 100vw), 20px);
  }
  
}