/* =========================================================
home
========================================================= */
/*------------------------------------------
POP UP SHOP
------------------------------------------*/
.sec-popup__list {
  display: grid;
  gap: 10px 20px;
}

@media (max-width: 768px) {
  .sec-popup__list {
    margin: 30px auto 0;
  }
}
@media (min-width: 769px) {
  .sec-popup__list {
    margin: 50px auto 0;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
  }
}
.sec-popup__list button {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  border: 2px solid #383435;
  border-radius: 10px;
  background: #fff;
  position: relative;
}

@media (max-width: 768px) {
  .sec-popup__list button {
    padding: 20px 70px 20px 20px;
    box-shadow: 0 2px 0 #383435;
  }
}
@media (min-width: 769px) {
  .sec-popup__list button {
    padding: 25px 9.03cqw 30px 3.61cqw;
    box-shadow: 3px 3px 0 #383435;
  }
}
@media (hover: hover) {
  .sec-popup__list button {
    transition: box-shadow 0.2s ease;
  }

  .sec-popup__list button:hover {
    box-shadow: none;
  }
}
.sec-popup__list .head {
  color: #DA3539;
}

@media (max-width: 768px) {
  .sec-popup__list .head {
    font-size: 15px;
    line-height: 1.4;
  }
}
@media (min-width: 769px) {
  .sec-popup__list .head {
    font-size: 18px;
    line-height: 1.44;
  }
}
@media (max-width: 768px) {
  .sec-popup__list .c-list01 {
    margin: 15px 0 0;
  }
}
@media (min-width: 769px) {
  .sec-popup__list .c-list01 {
    margin: 18px 0 0;
  }
}
.sec-popup__list .ico {
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: #67B5AE;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

@media (max-width: 768px) {
  .sec-popup__list .ico {
    width: 25px;
    right: 20px;
  }
}
@media (min-width: 769px) {
  .sec-popup__list .ico {
    width: 45px;
    right: 1.8cqw;
  }
}
.sec-popup__list .ico::before, .sec-popup__list .ico::after {
  content: "";
  background: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.sec-popup__list .ico::before {
  width: 42%;
  height: 2px;
}

.sec-popup__list .ico::after {
  width: 2px;
  height: 42%;
}

/*------------------------------------------
PRESENT
------------------------------------------*/
@media (max-width: 768px) {
  .sec-present {
    padding-top: 45px;
    padding-bottom: 40px;
    background: linear-gradient(to bottom, #FEF4E8 0%, #FEF4E8 60px, #FFFDF0 60px, #FFFDF0 100%);
  }
}
@media (min-width: 769px) {
  .sec-present {
    padding-top: 20px;
    padding-bottom: 60px;
    background: linear-gradient(to bottom, #FEF4E8 0%, #FEF4E8 50px, #FFFDF0 50px, #FFFDF0 100%);
  }
}
@media (max-width: 768px) {
  .sec-present .wrap {
    margin: 20px auto 0;
  }
}
@media (min-width: 769px) {
  .sec-present .wrap {
    margin: 50px auto 0;
  }
}
@container (min-width: 1025px) {
  .sec-present .wrap {
    display: flex;
    align-items: flex-start;
    gap: clamp(10px, 10.66cqw, 40px);
  }
}
.sec-present__img {
  position: relative;
  border: 1px solid #D1D1D1;
}

@container (min-width: 1025px) {
  .sec-present__img {
    width: 60%;
  }
}
.sec-present__img:has(.c-close)::before {
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.4);
  position: absolute;
  top: 0;
  left: 0;
}

@media (max-width: 768px) {
  .sec-present__detail {
    margin: 20px auto 0;
  }
}
@media (min-width: 769px) {
  .sec-present__detail {
    margin: 50px auto 0;
  }
}
@container (min-width: 1025px) {
  .sec-present__detail {
    margin: 0;
    flex: 1;
  }
}
@media (max-width: 768px) {
  .sec-present__detail > * + * {
    margin: 20px auto 0;
  }
}
@media (min-width: 769px) {
  .sec-present__detail > * + * {
    margin: 30px auto 0;
  }
}
.sec-present__ttl {
  line-height: 1.5;
}

@media (max-width: 768px) {
  .sec-present__ttl {
    text-align: center;
    font-size: 18px;
  }
}
@media (min-width: 769px) {
  .sec-present__ttl {
    font-size: 30px;
  }
}
.sec-present__txt01 {
  font-weight: 500;
}

@media (max-width: 768px) {
  .sec-present__txt01 {
    font-size: 13px;
    line-height: 1.92;
  }
}
@media (min-width: 769px) {
  .sec-present__txt01 {
    font-size: 16px;
    line-height: 1.81;
  }
}
/*------------------------------------------
SPECIAL ITEM
------------------------------------------*/
@media (max-width: 768px) {
  .sec-specialaitem {
    padding: 35px 0 90px;
  }
}
@media (min-width: 769px) {
  .sec-specialaitem {
    padding: 85px 0 195px;
  }
}
.sec-specialaitem__list {
  display: grid;
}

@media (max-width: 768px) {
  .sec-specialaitem__list {
    margin: 35px auto 0;
  }
}
@media (min-width: 769px) {
  .sec-specialaitem__list {
    margin: 50px auto 0;
  }
}
@container (max-width: 768px) {
  .sec-specialaitem__list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@container (min-width: 769px) {
  .sec-specialaitem__list {
    grid-template-columns: repeat(3, 1fr);
  }
}
.sec-specialaitem__item {
  border-right: 1px solid #D1D1D1;
  border-bottom: 1px solid #D1D1D1;
}

@container (max-width: 768px) {
  .sec-specialaitem__item:nth-child(-n+2) {
    border-top: 1px solid #D1D1D1;
  }
}
@container (min-width: 769px) {
  .sec-specialaitem__item:nth-child(-n+3) {
    border-top: 1px solid #D1D1D1;
  }
}
@container (max-width: 768px) {
  .sec-specialaitem__item:nth-child(2n) {
    border-right: none;
  }
}
@container (min-width: 769px) {
  .sec-specialaitem__item:nth-child(3n) {
    border-right: none;
  }
}
.sec-specialaitem__item button {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
}

.sec-specialaitem__item button > * + * {
  width: 100%;
}

.sec-specialaitem__item .img {
  overflow: hidden;
}

.sec-specialaitem__item .detail {
  flex: 1;
  position: relative;
}

@media (max-width: 768px) {
  .sec-specialaitem__item .detail {
    padding: 10px 12px 20px;
    font-size: 12px;
    line-height: 1.5;
  }
}
@media (min-width: 769px) {
  .sec-specialaitem__item .detail {
    padding: 10px clamp(10px, 8cqw, 30px) 20px;
    font-size: 16px;
    line-height: 1.62;
  }
}
.sec-specialaitem__item .price {
  margin: 8px auto 0;
  color: #81797B;
}

.sec-specialaitem__item .small {
  font-size: 0.8em;
}

.sec-specialaitem__item .ico {
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: #EA5533;
  position: absolute;
  bottom: 10px;
  right: 10px;
}

@media (max-width: 768px) {
  .sec-specialaitem__item .ico {
    width: 20px;
  }
}
@media (min-width: 769px) {
  .sec-specialaitem__item .ico {
    width: 28px;
  }
}
.sec-specialaitem__item .ico::before, .sec-specialaitem__item .ico::after {
  content: "";
  background: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.sec-specialaitem__item .ico::before {
  width: 40%;
}

@media (max-width: 768px) {
  .sec-specialaitem__item .ico::before {
    height: 2px;
  }
}
@media (min-width: 769px) {
  .sec-specialaitem__item .ico::before {
    height: 3px;
  }
}
.sec-specialaitem__item .ico::after {
  height: 40%;
}

@media (max-width: 768px) {
  .sec-specialaitem__item .ico::after {
    width: 2px;
  }
}
@media (min-width: 769px) {
  .sec-specialaitem__item .ico::after {
    width: 3px;
  }
}
@media (hover: hover) {
  .sec-specialaitem__item button img {
    transition: transform 0.2s ease;
  }

  .sec-specialaitem__item button:hover img {
    transform: scale(1.1);
  }
}
.sec-specialaitem__note {
  font-weight: 400;
}

@media (max-width: 768px) {
  .sec-specialaitem__note {
    margin: 20px auto 0;
    padding: 0 6.66vw;
    font-size: 11px;
    line-height: 1.45;
  }
}
@media (min-width: 769px) {
  .sec-specialaitem__note {
    margin: 40px auto 0;
    padding: 0 clamp(10px, 5.42cqw, 60px);
    font-size: 14px;
    line-height: 1.71;
  }
}
@media (max-width: 768px) {
  .modal-item .c-modal01__second {
    padding-top: 15px;
  }
}
.modal-item .c-modal01__second .price {
  margin: 10px auto 0;
}