@media screen and (max-width: 767px) {
    html {
      font-size: 1.33334vw;
    }
    html .pcOnly {
      display: none !important;
    }
  }
  @media screen and (min-width: 768px) {
    html {
      font-size: 62.5%;
    }
    html .spOnly {
      display: none !important;
    }
  }
  @media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    html {
      font-size: calc(10 * (100vw / 1200));
    }
  }
  @media screen and (min-width: 768px) and (max-width: 1200px) and (orientation: landscape) {
    html {
      font-size: calc(10 * (100vw / 1200));
    }
}
#aw1st_230727 * {
   -webkit-font-smoothing: antialiased;
   font: inherit;
}
#aw1st_230727 picture,
#aw1st_230727 source,
#aw1st_230727 img{
    width: 100%;
    height: auto;
}
@media screen and (max-width: 767px) {
    .main-area .main-inner{
        padding: 0!important;
    }
    #aw1st_230727 .mainnVisual{
        width: 100%;
        margin: auto;
    }
}
@media screen and (min-width: 768px) {
    #aw1st_230727 .mainnVisual{
        width: 100rem;
        margin: auto;
    }
}



/* grid-container */
#aw1st_230727 .lookWrapper.grid-container{
    display: grid;
    grid-template-columns: 1fr 1fr;
}
#aw1st_230727 .grid-container .look-item{
    grid-column: 1 / 3;
}
#aw1st_230727 .grid-container .look-item.left{
    grid-column: 1 / 2;
}
#aw1st_230727 .grid-container .look-item.right{
    grid-column: 2 / 3;
}
@media screen and (max-width: 767px) {
    #aw1st_230727 .main-area .main-inner{
        padding: 0;
    }
    #aw1st_230727 .lookWrapper.grid-container{
        width: 100%;
        margin: auto;
    }
}
@media screen and (min-width: 768px) {
    #aw1st_230727 .lookWrapper.grid-container{
        width: 100.0rem;
        margin: auto;
    }
}

/* look-item * */
#aw1st_230727 .grid-container .look-item{
    position: relative;
    overflow: hidden;
}

/* pulsBtn */
#aw1st_230727 .grid-container .look-item .iconWrapper{
    position: absolute;
    bottom: 2.5rem;
    right: 2.5rem;
    width: 1.5rem;
    height: 1.5rem;
    z-index: 100;
}
#aw1st_230727 .grid-container .look-item .iconWrapper .plus::before,
#aw1st_230727 .grid-container .look-item .iconWrapper .plus::after {
    position: absolute;
    content: "";
    display: block;
    transition: all 0.4s;
    background: #000;
    left: 50%;
    top: 50%;
    width: 1.5rem;
    height: 1px;
    transform: translate(-50%, -50%);
}
@media screen and (max-width: 767px) {
    #aw1st_230727 .grid-container .look-item .iconWrapper{
        display: none!important;
    }
}


/* credit */
#aw1st_230727 .credit{
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.7);
    font-feature-settings: "palt";
    font-weight: 200;
    line-height: 1.857;
    letter-spacing: 0.035em;
}
@media screen and (max-width: 767px) {
    #aw1st_230727 .grid-container .look-item .slideIn{
        text-align: left;
        max-width: 80%;
        font-size: 2rem;
    }
    #aw1st_230727 .credit{
        font-size: 1.9rem;
    }
    #aw1st_230727 .credit .slideIn{
        margin: 0 0 2.2rem 2.4rem;
    }
}
@media screen and (min-width: 768px) {
  #aw1st_230727 .credit{
      font-size: 1.4rem;
  }
  #aw1st_230727 .credit .slideIn{
      margin: 0 0 2.2rem 2.4rem;
  }
}


/* animation */
#aw1st_230727 .grid-container #js-target::before{
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
}
#aw1st_230727 .grid-container #js-target.active::before{
  display: none;
}
#aw1st_230727 .grid-container .look-item .iconWrapper.active .plus::before{
    transition: 0.4s transform 0s ease;
}
#aw1st_230727 .grid-container .look-item .iconWrapper.active .plus::before{
    transform: translate(-50%, -50%) rotate(0deg);
}

#aw1st_230727 .credit{
    transition: 0.4s opacity 0s ease;
    pointer-events: none;
    opacity: 0;
}
#aw1st_230727 .credit.active{
    pointer-events: all!important;
    opacity: 1;
}
#aw1st_230727 .credit .slideIn{
    overflow: hidden;
    position: relative;
    top: 0;
    transition: 0.8s transform 0s ease;
    transform: translate(0, 100%);
}
#aw1st_230727 .credit.active .slideIn{
    transform: translate(0);
}
#aw1st_230727 .credit li{
    transition: 0.8s transform 0s ease;
    transform: translate(0, -100%);
}
#aw1st_230727 .credit.active li{
    transform: translate(0);
}
#aw1st_230727 .grid-container .look-item .iconWrapper .plus::before {
    transform: translate(-50%, -50%) rotate(90deg);
}


/* All Btn */
#aw1st_230727 .all_item_btn{
    margin: auto;
    text-align: center;
    font-weight: bold;
    letter-spacing: 0.09em;
}
@media screen and (max-width: 767px) {
    #aw1st_230727 .all_item_btn{
        width: 32rem;
        height: 5rem;
        font-size: 2.5rem;
        line-height: 5rem;
        border: 0.99px solid #000;
    }
}
@media screen and (min-width: 768px) {
    #aw1st_230727 .all_item_btn{
        width: 25.6rem;
        height: 4.0rem;
        font-size: 2rem;
        line-height: 4rem;
        border: 1px solid #000;
    }
}


/* staff */
@media screen and (max-width: 767px) {
   #aw1st_230727 .staff {
        width: 69rem;
        margin: 11.6rem auto 8.5rem;
        white-space: nowrap;
        text-align: left;
        font-family: acumin-pro, sans-serif;
        font-weight: 300;
        font-style: normal;
        font-size: 2.1rem;
        /* font-size: 1.7rem; */
        line-height: 1.467;
        letter-spacing: 0.05em;
    }
    #aw1st_230727 .staff .staff__credit{
        margin-bottom: 2rem;
        letter-spacing: 0.035em;
    }
    #aw1st_230727 .staff .staff__ttl{
        font-size: 2.2rem;
        font-weight: 400;
    }
}
@media screen and (min-width: 768px) {
  #aw1st_230727 .staff{
    width: 100rem;
    margin: 7.5rem auto 11.4rem;
    white-space: nowrap;
    text-align: left;
    font-family: acumin-pro, sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 1.7rem;
    line-height: 1.467;
    letter-spacing: 0.05em;
  }
  #aw1st_230727 .staff .staff__credit{
  font-size: 1.5rem;
  margin-bottom: 2rem;
  }
}
/* staff */
#aw1st_230727 p.attentionTxt {
    margin: 5rem 0 4rem;
    text-align: center;
    font-size: 1.8rem;
}
@media screen and (min-width: 768px) {
    #aw1st_230727 p.attentionTxt {
        margin: 5rem 0 4rem;
        text-align: center;
        font-size: 1.6rem;
    }
}
