/* --------------------------------------------------
Top
-------------------------------------------------- */
body #wrapper #top .image-container { position: relative; }
body #wrapper #top .image-container .imagearea img { height: 100svh; object-fit: cover; object-position: center; }
body #wrapper #top .image-container .titlearea { width: 78.84%; position: absolute; left: 0; right: 0; margin: 0 auto; top: 70.27%; transform: translate(0, -50%); }
body #wrapper #top .image-container .titlearea h2 { position: relative; }
body #wrapper #top .image-container .titlearea h2 img { opacity: 0; transform: translate(-10%, 0); aspect-ratio: 634 / 272; }
body #wrapper #top .image-container .titlearea h2 img:nth-child(n+2) { position: absolute; left: 0; top: 0; }
body #wrapper #top .textarea { padding: 40px 6.05% 80px; }
body #wrapper #top .textarea .staff-credit { margin: 0 0 64px; }
body #wrapper #top .textarea .staff-credit p { font-weight: 300; font-size: 0.87rem; line-height: 1.8; letter-spacing: .08em; }
body #wrapper #top .textarea .lead-text p { text-align: justify; font-family: noto-sans-cjk-jp, sans-serif; font-weight: 300; font-size: 1.31rem; line-height: 1.87; letter-spacing: .03em; }
body.is-loaded #wrapper #top .image-container .titlearea h2 img { opacity: 1; transform: none; transition: opacity 1.4s ease 1s, transform 1.4s ease 1s; }
body.is-loaded #wrapper #top .image-container .titlearea h2 img:nth-child(2) { transition-delay: 1.3s; }
body.is-loaded #wrapper #top .image-container .titlearea h2 img:nth-child(3) { transition-delay: 1.6s; }

@media screen and (orientation: landscape) { body #wrapper #top .image-container .imagearea img { height: 100vh; }
  body #wrapper #top .image-container .titlearea { width: 41.53%; left: 9.72%; right: auto; margin: 0; top: 50.97%; } }
@media screen and (min-width: 768px) { body #wrapper #top .textarea { padding: 60px 0 117px; width: 80.56%; margin: 0 auto; display: flex; }
  body #wrapper #top .textarea .staff-credit { margin: 0; width: 42.24%; }
  body #wrapper #top .textarea .staff-credit p { font-size: 1rem; }
  body #wrapper #top .textarea .lead-text { flex: 1; }
  body #wrapper #top .textarea .lead-text p { font-size: 1.5rem; } }
/* --------------------------------------------------
header
-------------------------------------------------- */
body #wrapper:not(.menu-open) header .header-inner #menu-toggle a i::before, body #wrapper:not(.menu-open) header .header-inner #menu-toggle a i::after { background: #FFFFFF; }
body #wrapper:not(.menu-open) header .header-inner #menu-toggle a::before { background: #FFFFFF; }

@media screen and (min-width: 768px) { body #wrapper header .header-inner #menu-wrapper .menu-inner .level-1 > li { color: #FFFFFF; }
  body #wrapper header .header-inner #menu-wrapper .menu-inner .level-1 > li .level-2 > li { color: #FFFFFF; } }
/* --------------------------------------------------
Contents
-------------------------------------------------- */
@keyframes hoverline { 0% { transform: scale(1); transform-origin: right; }
  33.3% { transform: scale(0, 1); transform-origin: right; }
  66.6% { transform: scale(0, 1); transform-origin: left; }
  100% { transform: scale(1); transform-origin: left; } }
@keyframes arrow1 { 0% { opacity: 0; }
  20% { opacity: 0; }
  25% { opacity: 1; }
  95% { opacity: 1; }
  100% { opacity: 0; } }
@keyframes arrow2 { 0% { opacity: 0; }
  40% { opacity: 0; }
  45% { opacity: 1; }
  95% { opacity: 1; }
  100% { opacity: 0; } }
body { background: #F0EFEB; }
body #wrapper #look-wrapper { padding: 0 0 23.26%; }
body #wrapper #look-wrapper .inner { display: flex; flex-direction: column; row-gap: calc(var(--vw) * (0.233 * 100)); }
body #wrapper #look-wrapper .inner .type .type-head { position: relative; margin: 0 0 12.79%; }
body #wrapper #look-wrapper .inner .type .type-head .main-image img { aspect-ratio: 600 / 750; }
body #wrapper #look-wrapper .inner .type .type-head .sub-image img { aspect-ratio: 500 / 623; }
body #wrapper #look-wrapper .inner .type .type-head .type-name { font-family: instrument-serif, sans-serif; color: #337D84; font-size: 12.79vw; line-height: 0.96; letter-spacing: -.02em; position: absolute; z-index: 3; }
body #wrapper #look-wrapper .inner .type .type-head .type-name .row { display: block; }
body #wrapper #look-wrapper .inner .type .type-head .type-name .row span { display: inline-block; opacity: 0; transform: rotateY(95deg); }
body #wrapper #look-wrapper .inner .type .type-head .type-name .row span.is-show { opacity: 1; transform: none; transition: opacity .4s ease 0s, transform .6s ease 0s; }
body #wrapper #look-wrapper .inner .type .type-items { margin: 0 0 3.49rem; }
body #wrapper #look-wrapper .inner .type .type-items .item-list { display: flex; flex-wrap: wrap; column-gap: 2.33%; row-gap: calc(var(--vw) * (0.035 * 100)); }
body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single { width: calc((100% - 2.33%) / 2); }
body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .imagearea { position: relative; }
body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .imagearea img { aspect-ratio: 42 / 48; }
body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .imagearea .toggle-icon { display: block; width: 9.52%; aspect-ratio: 1; position: absolute; right: 4.76%; bottom: 4.17%; }
body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .imagearea .toggle-icon::before, body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .imagearea .toggle-icon::after { display: block; content: ""; background: #000000; position: absolute; }
body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .imagearea .toggle-icon::before { left: calc((100% - 1px) / 2); top: 0; bottom: 0; width: 1px; }
body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .imagearea .toggle-icon::after { left: 0; right: 0; top: calc((100% - 1px) / 2); height: 1px; }
body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .textarea { padding: 0.7rem 0.87rem 0; }
body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .textarea .credit ul li { font-size: 1.13rem; line-height: 1.38; letter-spacing: .08em; min-height: calc(4.15em + 0.35rem); }
body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .textarea .credit ul li span { display: block; }
body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .textarea .credit ul li span.brand { margin: 0 0 0.35rem; }
body #wrapper #look-wrapper .inner .type .type-items .toggle-contents { display: none; padding: calc(var(--vw) * (0.035 * 100)) 0 0; }
body #wrapper #look-wrapper .inner .type .type-items .type-link-btn { width: 83.72%; height: 5.23rem; margin: 3.49rem auto 0; color: #337D84; text-align: center; font-family: instrument-serif, sans-serif; font-size: 1.74rem; line-height: 1.15; letter-spacing: -0.02em; }
body #wrapper #look-wrapper .inner .type .type-items .type-link-btn a { height: 100%; display: flex; justify-content: center; align-items: center; border: 1px solid #337D84; border-radius: 2.62rem; }
body #wrapper #look-wrapper .inner .type .type-items > .type-link-btn { margin: 4.36rem auto 0; }
body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn { color: #337D84; font-family: instrument-serif, sans-serif; text-align: center; font-size: 2.18rem; }
body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn a { display: table; margin: 0 auto; }
body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn a .text { display: table; margin: 0 auto 0.87rem; }
body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn a .text .close { display: none; }
body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn a .toggle-icon { display: table; margin: 0 auto; width: 2.62rem; position: relative; }
body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn a .toggle-icon img { aspect-ratio: 50 / 39; animation: arrow1 2s linear 0s infinite; }
body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn a .toggle-icon img:nth-child(2) { position: absolute; left: 0; top: 0; animation-name: arrow2; }
body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn.is-open a .text .open { display: none; }
body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn.is-open a .text .close { display: inline; }
body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn.is-open a .toggle-icon { transform: scale(1, -1); }
body #wrapper #look-wrapper .inner .type#type1 .type-head .main-image { margin: 0 0 4.19%; }
body #wrapper #look-wrapper .inner .type#type1 .type-head .sub-image { width: 84.65%; }
body #wrapper #look-wrapper .inner .type#type1 .type-head .type-name { left: 7.21%; top: 51.53%; }
body #wrapper #look-wrapper .inner .type#type2 .type-head .main-image { margin: 0 0 4.42%; }
body #wrapper #look-wrapper .inner .type#type2 .type-head .sub-image { width: 84.65%; margin: 0 0 0 auto; }
body #wrapper #look-wrapper .inner .type#type2 .type-head .type-name { left: 3.26%; top: 53.85%; }
body #wrapper #look-wrapper .inner .type#type3 .type-head { display: flex; flex-direction: column-reverse; }
body #wrapper #look-wrapper .inner .type#type3 .type-head .sub-image { width: 84.65%; margin: 0 auto -12.8% 10.7%; position: relative; z-index: 2; }
body #wrapper #look-wrapper .inner .type#type3 .type-head .type-name { left: 3.26%; top: -3.74%; }
body #wrapper #look-wrapper .inner .type#type4 .type-head .main-image { width: 92.56%; margin: 0 0 4.42%; }
body #wrapper #look-wrapper .inner .type#type4 .type-head .sub-image { width: 84.65%; margin: 0 0 0 auto; }
body #wrapper #look-wrapper .inner .type#type4 .type-head .type-name { left: 1.4%; top: 48.2%; }
body #wrapper #look-wrapper .inner .type#type5 .type-head .main-image { margin: 0 0 4.42%; }
body #wrapper #look-wrapper .inner .type#type5 .type-head .sub-image { width: 84.65%; margin: 0 auto; }
body #wrapper #look-wrapper .inner .type#type5 .type-head .type-name { left: 1.86%; top: 42.98%; }
body #wrapper #look-wrapper .btnarea { display: flex; flex-direction: column; align-items: center; row-gap: 1.74rem; margin: 23.26% 0 0; }
body #wrapper #look-wrapper .btnarea .all-link { width: 87.91%; height: 7.15rem; text-align: center; font-family: noto-sans-cjk-jp, sans-serif; font-weight: 500; font-size: 1.31rem; line-height: 1.6; letter-spacing: .05em; }
body #wrapper #look-wrapper .btnarea .all-link a { height: 100%; display: flex; justify-content: center; align-items: center; border-radius: 3.58rem; border: solid 1px #000000; }
body #wrapper #modal-container { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.25); display: none; z-index: 9; }
body #wrapper #modal-container .modal-contents { display: flex; align-items: center; height: 100%; }
body #wrapper #modal-container .modal-contents .type { display: none; }
body #wrapper #modal-container .modal-contents .type .modal-single { display: none; background: #FFFFFF; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .imagearea { position: relative; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .imagearea img { aspect-ratio: 42 / 48; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .imagearea .toggle-icon { display: block; width: 6.98%; aspect-ratio: 1; position: absolute; right: 4.65%; bottom: 4.05%; transform: rotate(45deg); }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .imagearea .toggle-icon::before, body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .imagearea .toggle-icon::after { display: block; content: ""; background: #000000; position: absolute; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .imagearea .toggle-icon::before { left: calc((100% - 1px) / 2); top: 0; bottom: 0; width: 1px; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .imagearea .toggle-icon::after { left: 0; right: 0; top: calc((100% - 1px) / 2); height: 1px; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea { padding: 1.57rem 5.81% 1.4rem; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit .description { font-size: 1.31rem; line-height: 1.8; letter-spacing: 0.05em; margin: 0 0 1.74rem; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit ul li .main-info { font-size: 1.13rem; line-height: 1.23; letter-spacing: .08em; margin: 0 0 0.7rem; display: flex; flex-wrap: wrap; column-gap: 1em; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit ul li .main-info br { display: none; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit ul li .main-info a { text-decoration: underline; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit ul li .detail-info { display: flex; flex-wrap: wrap; font-size: 0.96rem; line-height: 1.64; letter-spacing: .08em; column-gap: .5em; }
body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit ul li .detail-info .item-number { width: 100%; }

@media screen and (min-width: 768px) { body #wrapper #look-wrapper { padding: 0 0 9.03%; }
  body #wrapper #look-wrapper .inner { row-gap: calc(var(--vw) * (0.174 * 100)); }
  body #wrapper #look-wrapper .inner .type .type-head { width: 80.56%; margin: 0 auto 8.33%; display: flex; justify-content: space-between; }
  body #wrapper #look-wrapper .inner .type .type-head .main-image { width: 51.72% !important; }
  body #wrapper #look-wrapper .inner .type .type-head .sub-image { width: 43.1% !important; }
  body #wrapper #look-wrapper .inner .type .type-head .type-name { font-size: 6.88vw; line-height: 1.01; white-space: nowrap; }
  body #wrapper #look-wrapper .inner .type .type-items { width: 60.07%; margin: 0 auto 5rem; }
  body #wrapper #look-wrapper .inner .type .type-items .item-list { column-gap: 4.05%; row-gap: calc(var(--vw) * (0.021 * 100)); }
  body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single { width: calc((100% - 4.05%) / 2); }
  body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .imagearea .toggle-icon { width: 7.23%; right: 4.82%; bottom: 4.22%; }
  body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .textarea { padding: .5rem 0 0; }
  body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .textarea .credit ul li { font-size: 1.1rem; line-height: 1.64; min-height: 0; display: flex; column-gap: .5em; }
  body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .textarea .credit ul li span.brand { margin: 0; }
  body #wrapper #look-wrapper .inner .type .type-items .item-list .item-single .textarea .credit ul li span.brand br { display: none; }
  body #wrapper #look-wrapper .inner .type .type-items .toggle-contents { padding: calc(var(--vw) * (0.021 * 100)) 0 0; }
  body #wrapper #look-wrapper .inner .type .type-items .type-link-btn { width: 50rem; height: 6rem; margin: 5rem auto 0; font-size: 2.2rem; line-height: 1.05; }
  body #wrapper #look-wrapper .inner .type .type-items .type-link-btn a { border-radius: 3rem; transition: color .4s ease 0s, background .4s ease 0s; }
  body #wrapper #look-wrapper .inner .type .type-items .type-link-btn a:hover { color: #F0EFEB; background: #337D84; }
  body #wrapper #look-wrapper .inner .type .type-items > .type-link-btn { margin: 10rem auto 0; }
  body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn { font-size: 3rem; }
  body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn a .text { margin: 0 auto 2rem; }
  body #wrapper #look-wrapper .inner .type .type-foot .type-toggle-btn a .toggle-icon { width: 5rem; }
  body #wrapper #look-wrapper .inner .type#type1 .type-head { align-items: center; }
  body #wrapper #look-wrapper .inner .type#type1 .type-head .main-image { margin: 0; }
  body #wrapper #look-wrapper .inner .type#type1 .type-head .type-name { left: 39.83%; top: 84.67%; }
  body #wrapper #look-wrapper .inner .type#type2 .type-head .main-image { margin: 0; }
  body #wrapper #look-wrapper .inner .type#type2 .type-head .sub-image { margin: 9.31% 0 0; }
  body #wrapper #look-wrapper .inner .type#type2 .type-head .type-name { left: 36.29%; top: 4.93%; }
  body #wrapper #look-wrapper .inner .type#type3 .type-head { flex-direction: row-reverse; }
  body #wrapper #look-wrapper .inner .type#type3 .type-head .sub-image { margin: 14.31% 0 0; }
  body #wrapper #look-wrapper .inner .type#type3 .type-head .type-name { left: 6.9%; top: 4%; }
  body #wrapper #look-wrapper .inner .type#type4 .type-head .main-image { margin: 0; }
  body #wrapper #look-wrapper .inner .type#type4 .type-head .sub-image { margin: 15.52% 0 0; }
  body #wrapper #look-wrapper .inner .type#type4 .type-head .type-name { left: 35.09%; top: 1.07%; }
  body #wrapper #look-wrapper .inner .type#type5 .type-head { align-items: center; margin-bottom: 15.28%; }
  body #wrapper #look-wrapper .inner .type#type5 .type-head .main-image { margin: 0; }
  body #wrapper #look-wrapper .inner .type#type5 .type-head .sub-image { margin: 0; }
  body #wrapper #look-wrapper .inner .type#type5 .type-head .type-name { left: 3.45%; top: 89.73%; }
  body #wrapper #look-wrapper .btnarea { flex-direction: row; justify-content: center; column-gap: 8rem; margin: 9.38% 0 0; }
  body #wrapper #look-wrapper .btnarea .all-link { width: 37rem; height: 7.8rem; font-size: 1.3rem; }
  body #wrapper #look-wrapper .btnarea .all-link a { border-radius: 3.9rem; transition: background .4s ease 0s, color .4s ease 0s; }
  body #wrapper #look-wrapper .btnarea .all-link a:hover { background: #000000; color: #F0EFEB; } }
@media screen and (orientation: landscape) { body #wrapper #modal-container .modal-contents { justify-content: center; }
  body #wrapper #modal-container .modal-contents .type .modal-single { height: 100vh; }
  body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner { width: calc((100vh - 14.5rem) * (42 / 48)); }
  body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .imagearea .toggle-icon { width: 6.41%; right: 3.21%; bottom: 2.81%; }
  body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea { padding: 1.5rem 3.21% 0; height: 14.5rem; overflow: auto; }
  body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit .description { font-size: 1.4rem; line-height: 1.71; margin: 0 0 1.5rem; }
  body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit ul li .main-info { font-size: 1.3rem; line-height: 1.38; margin: 0 0 .5rem; }
  body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit ul li .main-info .brand br { display: none; }
  body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit ul li .main-info a { transition: opacity .4s ease 0s; }
  body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit ul li .main-info a:hover { opacity: .6; }
  body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit ul li .detail-info { font-size: 1.1rem; }
  body #wrapper #modal-container .modal-contents .type .modal-single .modal-single-inner .textarea .credit ul li .detail-info .item-number { width: auto; } }