@charset "UTF-8";
/* *
 *
 *  variables
 *  変数
 *
 * */
/*--------------------------------------------------------------------------
   layout
---------------------------------------------------------------------------*/
/* @PC content width
-----------------------------------------------------------------*/
/* space
-----------------------------------------------------------------*/
/*--------------------------------------------------------------------------
   headerH
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
   breakpoint
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
  tranition
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
 font
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
   font-size
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
  line-height
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
  letter-spacing
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
   color
---------------------------------------------------------------------------*/
/* font color base */
/* *
 *
 *  mixin & function
 *  関数
 *
 * */
/*--------------------------------------------------------------------------
  media
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
   font-family
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
   txt-jp
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
  pseudo
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
  ico-font
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
  cf
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
  flexbox
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
  inline-style
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
  function px-to-vw
---------------------------------------------------------------------------*/
/* *
 *
 *  2021_pre_fall.css
 *
 *
 * */
html, #page {
  background: #D1CECB; }

#main .back-archives {
  margin-top: 100px; }

.lookbook-list--2021pf {
  padding: 0 55px; }
  .lookbook-list--2021pf ul {
    display: flex;
    flex-wrap: wrap;
    margin: -5px;
    margin-right: calc(-5px - 0.4%); }
  .lookbook-list--2021pf li {
    width: 16.6%;
    padding: 5px; }
    .lookbook-list--2021pf li img {
      display: block; }
  .lookbook-list--2021pf .info {
    width: 33.2%;
    display: flex;
    align-items: center; }
    .lookbook-list--2021pf .info .block {
      width: 100%;
      font-size: 14px;
      border: 1px solid #231815; }
    .lookbook-list--2021pf .info dl {
      padding: 1px 7px; }
    .lookbook-list--2021pf .info dt {
      text-decoration: underline;
      font-weight: bold; }
    .lookbook-list--2021pf .info .logo dd {
      padding: 24px 27px 36px;
      text-align: center; }
      .lookbook-list--2021pf .info .logo dd img {
        width: 100%; }
    .lookbook-list--2021pf .info .tel, .lookbook-list--2021pf .info .address {
      display: flex;
      border-top: 1px solid #231815; }
      .lookbook-list--2021pf .info .tel dt, .lookbook-list--2021pf .info .address dt {
        width: 7.7em; }
      .lookbook-list--2021pf .info .tel dd, .lookbook-list--2021pf .info .address dd {
        width: calc(100% - 45px); }

.img-load {
  overflow: hidden;
  height: 0; }

.modal {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  z-index: 6000;
  min-height: 100vh;
  overflow-y: auto; }
  .modal.js-open {
    display: flex; }
  .modal .contents {
    position: absolute;
    left: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 870px;
    padding: 0 120px;
    pointer-events: none; }
    .modal .contents-inner {
      display: flex;
      width: 100%;
      max-width: 1360px;
      max-height: 770px;
      margin: 0 auto;
      padding: 10px;
      background: #fff;
      pointer-events: auto; }
    .modal .contents .look {
      width: 500px; }
    .modal .contents .products {
      overflow: auto;
      padding: 0 0 0 10px;
      width: calc(100% - 500px - 70px);
      max-height: 750px;
      height: 100%; }
      .modal .contents .products section {
        background: #D1CECB; }
        .modal .contents .products section + section {
          margin-top: 10px; }
      .modal .contents .products h2 {
        padding: 5px;
        text-align: center; }
        .modal .contents .products h2 > span {
          display: block;
          border: 1px solid #231815;
          padding: 4px; }
          .modal .contents .products h2 > span > span {
            position: relative;
            display: inline-block;
            font-size: 25px;
            font-weight: bold; }
            .modal .contents .products h2 > span > span:before {
              content: "";
              position: absolute;
              bottom: 8px;
              left: 0;
              display: block;
              width: 100%;
              border-bottom: 2px solid #231815; }
      .modal .contents .products .wrap {
        display: flex;
        padding: 0 5px 5px; }
      .modal .contents .products .img {
        display: flex;
        align-items: center;
        width: 202px;
        border: solid #231815;
        border-width: 1px 0 1px 1px; }
        .modal .contents .products .img img {
          width: 100%;
          height: auto; }
      .modal .contents .products .info {
        width: calc(100% - 45px);
        border: 1px solid #231815; }
        .modal .contents .products .info dl {
          padding: 2px 5px 3px; }
        .modal .contents .products .info dl:not(.feature) {
          display: flex;
          justify-content: space-between;
          border-bottom: 1px solid #231815; }
        .modal .contents .products .info dt {
          font-weight: bold;
          text-decoration: underline;
          font-size: 14px; }
        .modal .contents .products .info dd {
          font-size: 16px; }
        .modal .contents .products .info .color dd span:not(:first-child):before {
          content: ", "; }
        .modal .contents .products .info .feature dd {
          display: flex;
          align-items: center;
          padding: 10px 20px 20px 15px;
          min-height: 152px; }
          .modal .contents .products .info .feature dd ul {
            display: flex;
            height: 100%; }
          .modal .contents .products .info .feature dd li {
            display: flex;
            align-items: center;
            line-height: 1.2; }
            .modal .contents .products .info .feature dd li span {
              display: block; }
            .modal .contents .products .info .feature dd li .icon {
              width: 45px; }
            .modal .contents .products .info .feature dd li .txt {
              width: calc(100% - 45px); }
            .modal .contents .products .info .feature dd li + li {
              margin-top: 12px; }
    .modal .contents .close {
      width: 60px;
      padding: 5px;
      margin-left: 10px;
      background: #D1CECB;
      font-size: 25px; }
      .modal .contents .close .inner {
        display: flex;
        width: 100%;
        height: 100%;
        align-items: center;
        border: 1px solid #231815; }
      .modal .contents .close .txt {
        transform: rotate(-90deg) translate(0, -8px);
        font-weight: bold; }
  .modal .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 870px;
    background: #231815;
    opacity: 0.3; }

@media screen and (max-width: 1400px) {
  .modal .contents .products .info dl:not(.feature) {
    display: block; } }

@media screen and (max-width: 1024px) {
  .lookbook-list--2021pf {
    padding: 0 36px; }
    .lookbook-list--2021pf ul {
      margin: -5px;
      margin-right: calc(-5px - 0.1%); }
    .lookbook-list--2021pf li {
      width: 33.3%;
      padding: 5px; }
    .lookbook-list--2021pf .info {
      width: 66.6%;
      justify-content: center; }
      .lookbook-list--2021pf .info .block {
        width: auto; }
      .lookbook-list--2021pf .info .logo dd {
        padding: 20px 23px 33px; }
  .modal {
    position: absolute;
    padding: 0;
    overflow-y: visible; }
    .modal.js-open {
      display: block; }
    .modal .contents {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      height: auto;
      padding: 60px 10px; }
      .modal .contents-inner {
        display: block;
        max-width: 780px;
        max-height: none;
        margin: 0 auto; }
      .modal .contents .look {
        width: 310px;
        margin: 0 auto; }
      .modal .contents .products {
        overflow-y: initial;
        width: 100%;
        max-height: none;
        padding: 10px 0 10px; }
        .modal .contents .products .info dl:not(.feature) {
          display: flex; }
      .modal .contents .close {
        width: 100%;
        margin-left: 0;
        padding: 5px; }
        .modal .contents .close .inner {
          justify-content: center; }
        .modal .contents .close .txt {
          transform: rotate(0deg) translate(0);
          line-height: 1;
          padding: 11px; }
    .modal .bg {
      position: fixed;
      min-height: 0; } }

.cursor {
  display: none; }

.dev-pc body {
  cursor: none !important; }
  .dev-pc body a {
    cursor: none !important; }

.dev-pc .cursor {
  display: block;
  position: fixed;
  text-align: center;
  top: 0;
  left: 0;
  cursor: none;
  pointer-events: none;
  z-index: 100005;
  opacity: 1; }
  .dev-pc .cursor .icon {
    display: block;
    width: 20px;
    height: 27px;
    background: url("/assets/images/lookbook/2021_pre_fall/icon_cursor.svg") no-repeat 50% 50%;
    background-size: 20px 27px; }
  .dev-pc .cursor .txt {
    position: absolute;
    top: 100%;
    left: 50%;
    padding-top: 4px;
    transform: translateX(-50%);
    display: none;
    font-size: 10px; }
  .dev-pc .cursor .y, .dev-pc .cursor .x {
    display: flex;
    justify-content: flex-start; }
    .dev-pc .cursor .y .num, .dev-pc .cursor .x .num {
      padding-left: 5px; }
  .dev-pc .cursor._load {
    opacity: 0; }
  .dev-pc .cursor._on .txt {
    display: block; }