@charset "UTF-8";
/*******************************************************************
* うまエイド
*******************************************************************/
.aide__h1 {
  margin-bottom: 0;
}

/*******************************************************************
* map
*******************************************************************/
.aide__map-area {
  position: relative;
  margin-top: clamp(24px, 4.375vw, 56px);
}

.aide__map-label {
  width: 39.3333333333%;
  position: absolute;
  left: -28px;
  left: -2.5%;
  top: -16px;
  top: -2%;
  z-index: 2;
}

.aide__map {
  position: relative;
}

.aide__map-point {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transition-delay: 1s;
}

/*******************************************************************
* menu
*******************************************************************/
.aide__arrow {
  width: clamp(60px, 7.96875vw, 102px);
  margin-left: auto;
  margin-right: auto;
  margin-top: clamp(24px, 3.75vw, 48px);
}

.aid__wrap {
  margin-top: clamp(24px, 3.75vw, 48px);
}

.aid__contents {
  container-type: inline-size;
  container-name: aid-contents;
}
.aid__contents:not(:first-child) {
  margin-top: clamp(24px, 3.75vw, 48px);
}

.aid__title-area {
  background: linear-gradient(90deg, #f0871e 0%, #ea609e 100%);
  display: flex;
  align-items: center;
  color: #fff;
  border-radius: 0 20px 0 0;
  position: relative;
  z-index: 2;
  padding-top: 10px;
  padding-bottom: 10px;
}
@container aid-contents (max-width: 600px) {
  .aid__title-area {
    flex-direction: column;
    align-items: initial;
    padding: 6px 0;
  }
}

.aid__point {
  position: absolute;
  left: 0;
  width: 12%;
  top: -115%;
  left: -16px;
  z-index: 3;
}
@media screen and (max-width: 1024px) {
  .aid__point {
    top: -84%;
  }
}
@container aid-contents (max-width: 600px) {
  .aid__point {
    min-width: 60px;
    top: -3%;
    left: -2.8%;
  }
}
.aid__point img {
  aspect-ratio: 1;
  object-fit: cover;
}

.aid__title {
  font-size: clamp(18px, 2.1875vw, 28px);
  padding: 0;
  margin-left: clamp(52px, 11.484375vw, 147px);
}
@container aid-contents (max-width: 600px) {
  .aid__title {
    font-size: clamp(16px, 4.8vw, 18px);
  }
}

.aid__product {
  margin-bottom: 0;
  margin-left: clamp(12px, 1.640625vw, 21px);
  font-size: clamp(14px, 1.25vw, 16px);
}
@container aid-contents (max-width: 600px) {
  .aid__product {
    margin-left: clamp(52px, 11.484375vw, 147px);
    margin-top: 4px;
  }
}

.aid__list {
  margin-top: clamp(8px, 1.171875vw, 15px);
  position: relative;
  border-radius: 0 0 20px 20px;
  background: #fff; /* 中身の背景 */
  z-index: 0;
  margin-bottom: 0;
  padding: clamp(16px, 3.75vw, 48px) clamp(30px, 4.6875vw, 60px);
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: clamp(16px, 4.6875vw, 50px);
}
@container aid-contents (max-width: 600px) {
  .aid__list {
    grid-template-columns: 1fr;
    padding-left: clamp(4px, 2.1333333333vw, 30px);
    padding-right: clamp(4px, 2.1333333333vw, 30px);
  }
}
.aid__list::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 3px; /* 枠の太さ */
  padding-top: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #f0871e 0%, #ea609e 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
@container aid-contents (max-width: 600px) {
  .aid__list::before {
    padding: 2px;
  }
}
.aid__list::after {
  content: "";
  position: absolute;
  height: 4px;
  background: #fff;
  top: -2px;
  left: 50%;
  width: calc(100% - 6px);
  transform: translateX(-50%);
  z-index: 2;
}
@container aid-contents (max-width: 600px) {
  .aid__list::after {
    width: calc(100% - 4px);
  }
}

@container aid-contents (max-width: 600px) {
  .aid__item:not(:first-child) {
    padding-top: clamp(24px, 6.4vw, 40px);
  }
}

.aid__name {
  font-size: clamp(18px, 1.953125vw, 25px);
  font-weight: bold;
  color: #000;
  margin: 0;
}

.aid__food-img {
  margin-top: clamp(4px, 0.625vw, 8px);
}
.aid__food-img img {
  aspect-ratio: 515/301;
  object-fit: cover;
}

.aid__textarea {
  display: flex;
  margin-top: clamp(6px, 0.9375vw, 12px);
}

.aid__text {
  font-weight: 500;
  font-size: clamp(12px, 1.25vw, 16px);
  color: #000;
  width: calc(100% - clamp(8px, 1.71875vw, 22px) - 33.9805825243%);
  margin-bottom: 0;
}

.aid__ingredients-img {
  margin-left: clamp(8px, 1.71875vw, 22px);
  padding-right: clamp(4px, 0.859375vw, 11px);
  width: 33.9805825243%;
  margin-top: -64px;
  margin-top: -12.427184466%;
}
.aid__ingredients-img img {
  aspect-ratio: 1;
  border-radius: 100%;
}

/*******************************************************************
* point2
*******************************************************************/
@container aid-contents (min-width: 600px) {
  .aid__list2 {
    grid-template-columns: 1fr;
  }
  .aid__item2 {
    column-gap: clamp(12px, 3.4375vw, 44px);
    display: flex;
    align-items: center;
  }
  .aid__row {
    width: 60.2777777778%;
  }
  .aid__food-img2 {
    width: 100%;
  }
  .aid__food-img2 img {
    aspect-ratio: 652/391;
  }
  .aid__textarea2 {
    flex-direction: column-reverse;
    width: 39.7222222222%;
  }
  .aid__text2 {
    width: 100%;
    margin-top: clamp(16px, 1.6666666667vw, 32px);
  }
  .aid__ingredients-img2 {
    width: 75.0649350649%;
    margin: 0 auto;
    padding: 0;
  }
}/*# sourceMappingURL=umaaid.css.map */