@charset "utf-8";
@import url("root.css");

/*-----*ブレイクポイントルール*-----*/
/* スマートフォン：max-width:599px */
@media ( max-width: 599px ) {
}

/* タブレット：min-width:600px */
@media ( min-width: 600px ) {
}

/* PC：min-width:1025px */
@media ( min-width: 1025px ) {
}

/***************************************
---------------- SHOP ----------------
***************************************/

.shop_imgBox {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(1, 1fr);
  gap: 10px;
}

.shop_imgBox .shop_imgBox-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.shop_imgBox .shop_imgBox-img:nth-of-type(1) {
  grid-area: 1 / 1 / 2 / 3;
}

.shop_imgBox .shop_imgBox-img:nth-of-type(2) {
  grid-area: 2 / 1 / 3 / 2;
}

.shop_imgBox .shop_imgBox:nth-of-type(3) {
  grid-area: 2 / 2 / 3 / 3;
}

.access_imgBox {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px 2%;
}

@media (max-width: 599px) {
  .access_imgBox {
    grid-template-columns: repeat(2, 1fr);
  }
}

.access_flowItem {

}

.access_flowItem--text {
  position: relative;
  padding-left: 60px;
}

@media ( max-width: 599px ) {
  .access_flowItem--text {
    padding-left: 40px;
  }
}

.access_flowItem--number {
  display: flex;
  width: 50px;
  height: 50px;
  align-items: center;
  justify-content: center;
  background: var(--base-color01);
  color: #fff;
  font-size: clamp(1.6rem, 1.459rem + 0.601vw, 2rem);
  position: absolute;
  left: 0;
  top: 0;
}

@media ( max-width: 599px ) {
  .access_flowItem--number {
    width: 30px;
    height: 30px;
  }
}