@charset "UTF-8";
#Billboard {position: relative;}
#Billboard figure {overflow: hidden;background-color: #213e52;}
#Billboard figure img {transform: scale(1) rotate(0deg);filter: contrast(.5) brightness(3.5) grayscale(0.7);-webkit-backface-visibility: hidden;backface-visibility: hidden;will-change: filter transform;mix-blend-mode: multiply;}
#Billboard .ttl-style-01 {opacity: 0;transition: opacity 1.8s 1s ease, letter-spacing 4s 1s cubic-bezier(0.25, 1, 0.5, 1);-webkit-backface-visibility: hidden;backface-visibility: hidden;will-change: letter-spacing;position: absolute;top: calc(50% + 1.5em);left: 50%;transform: translate(-50%, -50%);z-index: 2;letter-spacing: 0.2em;text-align: center;font-size: 150%;font-family: var(--serif);white-space: nowrap;color: #fff;}
#Billboard .ttl-style-01 span {display: block;margin-bottom: 0.5em;background: linear-gradient(0deg, rgb(255 255 255 / 100%) 0%, rgb(255 255 255 / 68%) 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;font-size: 400%;font-weight: 400;font-family: var(--garamond);line-height: 1;}
#Billboard .ttl-style-01 strong {font-size: 150%;font-weight: normal;}

#Billboard.staging figure img {filter: contrast(1) brightness(1) grayscale(0);transform: scale(1.05) rotate(1deg);transition: filter var(--easing) 2000ms, transform var(--easing) 10000ms;}
#Billboard.staging .ttl-style-01 {opacity: 1;letter-spacing: 0.15em;}
/* =====
 * LAYOUT :: ALL DEVICE
=================================================================== */
#Main .block-access-01 {background: transparent url("../img/common/bg_01.webp") no-repeat 50% 0 / cover;}
#Main .block-access-01 .container > figure {mix-blend-mode: multiply;}
#Main .block-access-01 .container {padding-bottom: 6.5em;}

#Main .block-access-02 .column {margin-top: -10em;margin-bottom: 3em;}
#Main .block-access-02 .column > div {position: relative;}
#Main .block-access-02 .column > div::before {position: absolute;top: 0;left: 0;padding: 0.25em;font-size: 200%;font-family: var(--garamond);letter-spacing: 0.15em;line-height: 1;color: #fff;}
#Main .block-access-02 .column > div::after {content: "";position: absolute;top: 1em;left: 1em;bottom: 1em;right: 1em;background-position: 0 100%;background-repeat: no-repeat;background-size: 50% auto;}
#Main .block-access-02 .column > div:nth-child(1)::before {content: "TOKYO";}
#Main .block-access-02 .column > div:nth-child(1)::after {background-image: url("../img/access/img_01.svg");}
#Main .block-access-02 .column > div:nth-child(2)::before {content: "SHINAGAWA";}
#Main .block-access-02 .column > div:nth-child(2)::after {background-image: url("../img/access/img_02.svg");}
#Main .block-access-02 .column > div:nth-child(3)::before {content: "SHINJYUKU";}
#Main .block-access-02 .column > div:nth-child(3)::after {background-image: url("../img/access/img_03.svg");}

#Main .block-access-03 {background: #0d0709 url("../img/access/bg_01.webp") no-repeat 50% 0 / 100% auto;padding-top: 17vw;padding-bottom: 5em;}
#Main .block-access-03 h3 {position: relative;margin-bottom: 1.5em;font-family: var(--serif);font-size: 137.5%;font-weight: normal;text-align: center;color: #67473d;}
#Main .block-access-03 h3 span {position: absolute;bottom: 0;left: 0;right: 0;opacity: 0.2;font-size: 400%;font-family: var(--garamond);line-height: 1;color: #719aa7;}
#Main .block-access-03 h4 {background-color: #f9f9f9;border-left: 3px solid #48757e;width: calc(100% - 4em);max-width: 1000px;margin: 0 auto 1em;padding-left: 1em;line-height: 2;font-size: 125%;font-family: var(--garamond);}
#Main .block-access-03 dl {display: flex;flex-wrap: wrap;width: calc(100% - 4em);max-width: 1000px;margin: 0 auto;}
#Main .block-access-03 dl dt {width: 16em;margin: 0;padding: 1em 0;border-bottom: 1px solid #48757e;font-family: var(--serif);color: #48757e;}
#Main .block-access-03 dl dd {width: calc(100% - 16em);margin: 0;padding: 1em 0;border-bottom: 1px solid #ddd;display: flex;gap: 2em;justify-content: flex-end;font-family: var(--serif);}
#Main .block-access-03 dl + h4 {margin-top: 3em;}
#Main .block-access-03 .container {background-color: #fff;}
/* =====
* LAYOUT :: PC
=================================================================== */
@media only screen and (min-width:769px) {
  #Main .block-access-02 .column {display: flex;gap: 4px;}
  #Main .block-access-02 .column > div {flex: 1;}
}
/* =====
* LAYOUT :: TAB
=================================================================== */
@media only screen and (min-width: 769px) and (max-width: 1280px) {}
/* =====
* LAYOUT :: SP
=================================================================== */
@media only screen and (max-width:768px) {
  #Billboard figure img {object-fit: cover;height: 100vw;}
  #Billboard .ttl-style-01 {font-size: 125%;}
  #Billboard .ttl-style-01 span {font-size: 200%;}

  #Main .block-access-02 .column {margin-top: -5em;margin-bottom: 1.5em;}
  #Main .block-access-02 .column > div img {object-fit: cover;max-height: 14em;}
  #Main .block-access-02 .column > div + div {margin-top: 4px;}

  #Main .block-access-03 h3 {font-size: 125%;line-height: 1;}
  #Main .block-access-03 h3 span {font-size: 250%;line-height: 3;}
  #Main .block-access-03 dl {display: block;}
  #Main .block-access-03 dl dt {width: 100%;background-color: #ecf1f2;padding: 0.2em 0;text-align: center;}
  #Main .block-access-03 dl dd {width: 100%;display: block;border-bottom: none;padding-top: 0.2em;}
  #Main .block-access-03 dl dd span {display: block;}
  #Main .block-access-03 .container {padding-top: 6em;}
}
@media only screen and (max-width:768px) and (orientation: landscape) {}
@media only screen and (max-width: 640px) {}
@media only screen and (max-width: 480px) {}