@charset "UTF-8";
/* ------------------------------------------------
  common
------------------------------------------------ */
:root{
  --section-margin-block: 7rem;
  --swiper-pagination-bullet-inactive-color: var(--color-gray-400);
  --swiper-pagination-color: var(--color-primary);
}

.global-contents{min-width: 0;}
.global-contents__inner{
  width: 100%;
  padding-bottom: 0;
}
.c-breadcrumb{
  display: none;
}

.p-home{
  color: var(--color-text-default);
}
.p-home :where(a:not(.c-button)){
  color: var(--color-text-default);
  transition: opacity var(--transition-default);
}

@media (hover: hover) {
  .p-home :where(a:not(.c-button)):hover{
    opacity: var(--hover-opacity);
  }
}

.p-home-section{
  margin-block: var(--section-margin-block);
}
.p-home-section--bg{
  padding: 7rem 0;
}
.p-home .c-page-title{
  margin: 0 0 4rem;
  gap: 0.4rem;
  flex-direction: column-reverse;
}

.p-home .c-page-title--ja{
  font-size: 1.1rem;
  font-weight: var(--fw-medium);
  letter-spacing: 0.02em;
  line-height: 1.6364;
}

.p-home .c-page-title--en{
  font-size: 2.4rem;
  font-weight: var(--fw-medium);
  letter-spacing: 0.02em;
  line-height: 1.458;
}

@media (min-width: 768px) {
  .p-home .c-page-title--ja{
    font-size: 1.3rem;
  }

  .p-home .c-page-title--en{
    font-size: 3rem;
  }
}

.p-home .c-button{
  width: 13.2rem;
  margin: 2.5rem auto 0;
  padding: 1.1rem 1rem;
  min-width: unset;
}
.p-home-section__inner{
  padding-inline: 3rem;
  margin-inline: auto;
  width: min(85%, 1360px);
  position: relative;
}
.p-home-section__inner--small{
  width: min(59.375%, 950px);
  margin-inline: auto; 
}

.p-home .c-button{
  font-weight: var(--fw-medium);
  border-radius: 0.3rem;
}

.p-home .c-button__primary{
  color: var(--color-text-default);
  background-color: var(--color-white);
  border: 1px solid rgb(0 0 0 / 0.1);
}

@media (min-width: 768px) {
  .p-home .c-button{
    margin: 4rem auto 0;
    padding: 1.35rem 1rem;
  }
}

@media (hover: hover){
  .p-home .c-button{
    transition: border-color var(--transition-default);
  }
  .p-home .c-button:hover{
    border-color: var(--color-black);
  }
}

/* swiper */
.swiper-button-next,
.swiper-button-prev{
  --swiper-navigation-size: 6rem;
  width: var(--swiper-navigation-size);
  height: var(--swiper-navigation-size);
  background-repeat: no-repeat;
  background-size: contain;
}
.swiper-button-next::after,
.swiper-button-prev::after{
  display: none;
}

.swiper-button-prev{
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2260%22%20height%3D%2260%22%20viewBox%3D%220%200%2060%2060%22%3E%20%3Cg%20transform%3D%22translate(60%2060)%20rotate(180)%22%3E%20%3Cg%20fill%3D%22%23fff%22%20stroke%3D%22%23f0f0f0%22%20stroke-width%3D%221%22%3E%20%3Ccircle%20cx%3D%2230%22%20cy%3D%2230%22%20r%3D%2230%22%20stroke%3D%22none%22%2F%3E%20%3Ccircle%20cx%3D%2230%22%20cy%3D%2230%22%20r%3D%2229.5%22%20fill%3D%22none%22%2F%3E%20%3C%2Fg%3E%20%3Cpath%20d%3D%22M3440%2C1048.563l6%2C6-6%2C6%22%20transform%3D%22translate(-3412.5%20-1024.063)%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
  left: 0;
}
.swiper-button-next{
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22arrow%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2260%22%20height%3D%2260%22%20viewBox%3D%220%200%2060%2060%22%3E%20%3Cg%20fill%3D%22%23fff%22%20stroke%3D%22%23f0f0f0%22%20stroke-width%3D%221%22%3E%20%3Ccircle%20cx%3D%2230%22%20cy%3D%2230%22%20r%3D%2230%22%20stroke%3D%22none%22%2F%3E%20%3Ccircle%20cx%3D%2230%22%20cy%3D%2230%22%20r%3D%2229.5%22%20fill%3D%22none%22%2F%3E%20%3C%2Fg%3E%20%3Cpath%20d%3D%22M3440%2C1048.563l6%2C6-6%2C6%22%20transform%3D%22translate(-3412.5%20-1024.063)%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%3C%2Fsvg%3E');
  right: 0;
}

.swiper:not(.swiper-initialized) {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.swiper-initialized {
  opacity: 1;
  height: auto;
}
/* ------------------  mv  ------------------ */
.p-home-mv .swiper:not(.swiper-initialized) {
  height: 58rem;
}

.p-home-mv{
  padding: 2.5rem 0 1.6rem;
  background-color: var(--color-project-bg);
}
.p-home-mv__slider .swiper{
  --swiper-pagination-bottom: 0;
  padding-bottom: 3.4rem;
}

@media (min-width: 768px) {
  .p-home-mv{
    padding: 5rem 0 4rem;
  }

  .p-home-mv__slider .swiper{
    padding-bottom: 4.5rem;
  }

  .p-home-mv .swiper-slide{
    width: 40rem;
  }
}

/* ------------------  banner   ------------------ */
.p-home-banner__list{
  --banner-list-column:3;
  --banner-list-column-gap: 2.4rem;
  --banner-list-row-gap: 1rem;
  display: grid;
  grid-template-columns: repeat(var(--banner-list-column),minmax(0, 1fr));
  gap: var(--banner-list-row-gap) var(--banner-list-column-gap);
}

.p-home-banner__list .p-home-banner__item{width: 100%;}

/* ------------------  product  ------------------ */
.js-product-slider .product__container{
  display: flex;
  gap: 0;
}

.product-slider.swiper:not(.swiper-initialized){
  height: 41rem;
}

.p-home-product__list{
  width: min(90%, 114rem);
  margin-inline: auto;
  overflow: visible;
  position: relative;
}

.p-home-product__list .product-slider{
  width: 100%;
  padding-bottom: 4rem;
}

.p-home-product__list .product__item--icon{
  position: static;
  margin-top: 1.2rem;
}

.p-home-product__list .product__item--icon:not(:has(.product__icon)){
  display: none;
}

.p-home-product__list .swiper-button-prev,
.p-home-product__list .swiper-button-next{
  --swiper-navigation-top-offset: 34%;
  --swiper-navigation-sides-offset: -5rem;
}

.p-home-product__list .swiper-horizontal>.swiper-pagination-bullets, .p-home-product__list .swiper-pagination-bullets.swiper-pagination-horizontal{
  --swiper-pagination-bottom: 0;
}

.p-home-product:not(:has(.product__item)){
  display: none;
}

.p-home-ranking .product__item:nth-of-type(n + 5){
  display: none;
}

.p-home-ranking{
  margin: 0;
  padding: 4rem 0 5rem;
}

@media (min-width: 768px) {
  .p-home-ranking{
    padding: 6rem 0 8rem;
  }
}

.p-home-newitem{
  margin: 0;
  padding: 4rem 0 2rem;
  background-color: var(--color-project-bg);
}

@media (min-width: 768px) {
  .p-home-newitem{
    padding: 6rem 0 3rem;
  }
}

/* ------------------  category  ------------------ */
.p-home-category{
  margin-block: 0;
  padding: 2rem 0;
  background-color: var(--color-project-bg);
}

.p-home-category .p-home-tab__content-area{
  padding-inline: var(--padding-horizontal-global);
}

.p-home-category__list{
  --category-gap: 1.2rem 1.6rem;
  display: grid;
  grid-template-columns: repeat(3,minmax(0, 1fr));
  gap: var(--category-gap);
}
  
.p-home-category__item .p-home-category__item-link{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 0 0.5rem;
  text-align: center;
  text-decoration: none;
}

.p-home-category__item .p-home-category__item-image{
  width: 9rem;
  height: auto;
  aspect-ratio: 1;
  border-radius: 50%;
  object-fit: cover;
  overflow: hidden;
  background-color: #E1E1E1;
}

.p-home-category__item .p-home-category__item-text{
  font-size: 1.2rem;
  letter-spacing: 0.02em;
  line-height: 1.875;
}

@media (min-width: 768px) {
  .p-home-category{
    padding: 3rem 0;
  }

  .p-home-category .p-home-tab__content-area{
    padding-inline: 0;
  }

  .p-home-category__list{
    --category-gap: 5rem 3.6rem;
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }

  .p-home-category__item .p-home-category__item-link{
    padding: 0;
    gap: 1.6rem;
  }

  .p-home-category__item .p-home-category__item-image{
    width: 15.5rem;
  }
  
  .p-home-category__item .p-home-category__item-text{
    font-size: 1.4rem;
    line-height: 1.6071;
  }
}

/* ------------------  about  ------------------ */
.p-home-about{
  background-color: var(--color-secondary);
}

.p-home-about__content-wrap{
  display: flex;
  align-items: center;
  gap: 5.26315789474%;
}

.p-home-about__image{
  flex: 4 1 0; 
  max-width: 100%;
}

.p-home-about__image img{
  max-width: 700px;
  min-width: 0;
}

.p-home-about__text-area{
  flex: 6 1 0;
  max-width: 380px;
}

.p-home-about__heading {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 1.4rem;
  font-size: 2.4rem;
  line-height: 1.5;
  margin-bottom: 1.7rem;
}

.p-home-about__heading img{
  width: 11rem;
}

.p-home-about__text{
  font-size: 1.4rem;
  line-height: 1.5;
}

.p-home-about .c-button{
  margin: 2.8rem 0 0;
}

/* ------------------  feature  ------------------ */
.p-home-feature{
  margin-block: 0;
  padding: 4rem 0 5rem;
  background-color: #424548;
  color: var(--color-white);
}

.p-home-feature .c-feature-item-card__date,
.p-home-feature .c-feature-item-card__text{
  color: var(--color-white);
}

.p-home-feature .c-button__primary{
  background-color: #3B3E41;
  border-color: rgb(255 255 255 / 0.2);
  color: var(--color-white);
}

@media (hover: hover){
  .p-home-feature .c-button:hover{
    border-color: var(--color-white);
  }
}

.c-feature-item-list{
  --feature-list-column: 4;
  display: grid;
  grid-template-columns: repeat(var(--feature-list-column,4),minmax(0, 1fr));
  gap: 2.4rem;
}

.c-feature-item-card__link{
  display: flex;
  flex-direction: column;
  text-decoration: none;
  height: 100%;
  text-decoration: none;
}

.c-feature-item-card__img{
  width: 100%;
  aspect-ratio: 1;
  object-fit: contain;
}

.c-feature-item-card__date{
  margin-top: 2rem;
  font-size: 1.2rem;
  opacity: 0.5;
}

.c-feature-item-card__text{
  margin-top: 1rem;
  font-size: 1.4rem;
  line-height: 1.75;
}

@media (min-width: 768px) {
  .p-home-feature{
    padding: 6rem 0 8rem;
  }
}

/* ------------------  blog ----------------------*/
.p-home-blog .product-slider,
.p-home-feature .product-slider{
  padding-inline: var(--padding-horizontal-global);
}

.p-home-blog{
  margin-block: 0 4rem;
  padding: 2rem 0 5rem;
  background-color: var(--color-project-bg);
}

.p-home-blog .swiper-arrow{
  top: 24rem;
}

@media (min-width: 768px) {
  .p-home-blog{
    padding: 3rem 0 8rem;
  }

  .p-home-blog .product-slider,
  .p-home-feature .product-slider{
    padding-inline: 0;
  }
}

/* ---------------  coordinate  --------------- */
.p-home-coordinate{
  margin-block: 0;
  padding: 2rem 0;
  background-color: var(--color-project-bg);
}

.p-home-coordinate .product-slider{
  padding-inline: var(--padding-horizontal-global);
}

.p-home-coordinate .coordinate__item--details{
  margin-top: 0.8rem;
  display: grid;
  grid-template-columns: 4rem 1fr;
  grid-template-rows: auto 1fr;
  gap: 0 0.8rem;
}

.p-home-coordinate .coordinate__item--staff-image{
  grid-row: 1/3;
}

.p-home-coordinate .coordinate__item--staff-image :where(img){
  border-radius: 50%;
  border: 2px solid var(--color-white);
  aspect-ratio: 1;
  width: 100%;
  height: auto;
}

.p-home-coordinate .coordinate__item--shop-name{
  font-size: 1rem;
  letter-spacing: 0.02em;
  line-height: 1.5;
}

.p-home-coordinate .coordinate__item--staff-profile{
  margin-top: 0.1rem;
  font-size: 1.1rem;
  font-weight: var(--fw-bold);
  letter-spacing: 0.02em;
  line-height: 1.4545;
}

.p-home-coordinate .swiper-arrow{
  top: 12rem;
}

.p-home-coordinate .swiper-button-prev{
  left: 9rem;
}

.p-home-coordinate .swiper-button-next{
  right: 9rem;
}

@media (min-width: 768px) {
  .p-home-coordinate{
    padding: 3rem 0;
  }

  .p-home-coordinate .product-slider{
    padding-inline: 0;
  }

  .p-home-coordinate .coordinate__item--details{
    margin-top: 1rem;
    grid-template-columns: 6rem 1fr;
  }

  .p-home-coordinate .coordinate__item--shop-name{
    font-size: 1.1rem;
  }

  .p-home-coordinate .coordinate__item--staff-profile{
    margin-top: 0.5rem;
    font-size: 1.3rem;
  }
}

/* ------------------  news  ------------------ */

.news-list-area--top .news-item .news-item__content--detail{
  display: none;
}

.p-home-news__inner--column{
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 8rem;
}

.p-home-news__inner--column .news-list-area--top{
  width: 100%;
}

.p-home-news__inner--column .c-button{
  width: 20rem;
  margin: 0;
}

.p-home-news .news-item__link{
  padding: 2.4rem 2rem;
  align-items: center;
}

.p-home-news .news-item__date{
  font-family: var(--font-ja);
  line-height: 1;
}

.p-home-news .news-item__content--heading{
  line-height: 2;
}

.p-home-news .news-item__content{
  display: -webkit-box;
  line-clamp: 3;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (min-width: 768px) {
  .p-home-news .news-item__date{
    width: 17.895%;
  }
  
  .p-home-news .news-item__content{
    width: calc(100% - 17.895%);
  }
}

/* ------------------  history  ------------------ */
.p-home-history{
  background-color: var(--color-secondary);
}

.p-home-history:not(:has(.product__item)){
  display: none;
}

.product__history .product__container{
  --grid-columns-desktop: 6;
  --grid-gap: 1.8rem;
}

.product__history .product__container .product__item:nth-child(n + 7){
  display: none;
}

.product__history .c-heading{
  margin-bottom: 1.5rem;
  font-size: 2rem;
  border-bottom: 0;
  padding-bottom: 0;
}

.product__history .product__item--name{
  margin-top: 1rem;
  font-size: 1.3rem;
}

.product__history .product__item--price{
  margin-top: 0.7rem;
}

/* ------------------  card  ------------------ */
.c-card-list{
  --card-list-column: 4;
  --card-list-gap: 2.4rem;
  display: grid;
  gap: var(--card-list-gap);
  grid-template-columns: repeat(var(--card-list-column),minmax(0, 1fr));
}

.c-card-item:not(:has(.c-card-item__link)),
.c-card-item__link{
  display: flex;
  flex-direction: column;
}

.c-card-item__link{
  text-decoration: none;
}

.c-card-item__description{
  padding: 1rem;
  background-color: var(--color-white);
  font-size: 1.4rem;
  line-height: 1.75;
}

/* ------------------  tab  ------------------ */
.p-home-tab__selector-list{
  width: 80%;
  margin: 0 auto 2.5rem;
  display: flex;
  justify-content: center;
  gap: 0.6rem;
}

.p-home-tab__selector button{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0.55rem 1.2rem;
  font-family: var(--font-main);
  font-size: 1.2rem;
  font-weight: var(--fw-medium);
  letter-spacing: 0.02em;
  line-height: 1;
  background-color: var(--color-white);
  border: 1px solid var(--color-project-bg);
  border-radius: 100vh;
}

.p-home-tab__selector button.active{
  background-color: var(--color-black);
  color: var(--color-white);
}

.p-home .p-home-tab__content:not(.active){
  visibility: hidden;
  height: 0;
  display: none;
}

@media (min-width: 768px) {
  .p-home-tab__selector-list{
    margin: 0 auto 4rem;
  }

  .p-home-tab__selector button{
    padding: 0.7rem 1.35rem;
    font-size: 1.4rem;
  }
}


/* tablet - sp */
@media screen and (max-width: 767px) {

  /* ------------------------------------------------
    common
  ------------------------------------------------ */
  .p-home{
    --section-margin-block: 5rem;
    --padding-horizontal-global: 2rem;
  }

  .p-home-section--bg{
    padding: 4rem 0;
  }
  .p-home .c-page-title{
    width: 100%;
    margin: 0 0 2.5rem;
    gap: 0.3rem;
  }

  .p-home-section__inner{
    width: 100%;
    padding-inline: 0;
  }
  .p-home-section__inner--small{
    width: 100%;
    padding-inline: var(--padding-horizontal-global);
  }

  .p-home .product-slider{
    padding-inline: var(--padding-horizontal-global);
  }

  /* swiper */
  .swiper-button-next,
  .swiper-button-prev{
    --swiper-navigation-size: 8vw;
    width: var(--swiper-navigation-size);
    height: var(--swiper-navigation-size);
    background-repeat: no-repeat;
    background-size: contain;
  }

  /* ------------------  mv  ------------------ */
  .p-home-mv .swiper:not(.swiper-initialized) {
    height: 27rem;
  }

  .p-home-mv__slider .swiper-pagination{
    display: flex;
    justify-content: center;
  }

  /* ------------------  banner   ------------------ */
  .p-home-banner__list{
    grid-template-columns: none;
  }

  /* ------------------  product  ------------------ */
  .js-product-slider .product__container{
    display: flex;
    gap: 0;
  }

  .product-slider.swiper:not(.swiper-initialized){
    height: 41rem;
  }

  .p-home-product__list{
    width: 100%;
    padding-inline: var(--padding-horizontal-global);
  }

  .p-home-product__list .product-slider{
    padding-bottom: 3.5rem;
  }

  .p-home-product__list .product__item--icon{
    position: static;
    margin-top: 1rem;
  }

  .p-home-product__list .swiper-button-prev,
  .p-home-product__list .swiper-button-next{
    --swiper-navigation-top-offset: 36%;
    --swiper-navigation-sides-offset: 0;
  }

  .p-home-product__list .swiper-horizontal>.swiper-pagination-bullets, .p-home-product__list .swiper-pagination-bullets.swiper-pagination-horizontal{
    --swiper-pagination-bottom: 0;
  }

  /* ------------------  about  ------------------ */ 
  .p-home-about__content-wrap{
    flex-direction: column;
    gap: 3.46666666667vw;
  }

  .p-home-about__image{
    flex: initial;
  }

  .p-home-about__image img{
    max-width: unset;
  }

  .p-home-about__text-area{
    flex: initial;
    max-width: unset;
    margin: 0 auto;
  }
  .p-home-about__heading {
    gap: 0.8rem;
    font-size: clamp(2.1rem,5.6vw,32px);
    margin-bottom: 1rem;
  }

  .p-home-about__heading img{
    width: 10rem;
  }

  .p-home-about .c-button{
    margin: 2rem auto 0;
  }

  /* ------------------  feature  ------------------ */
  /* .p-home-feature .p-home-section__inner{
    width: 100%;
    padding: 0;
  } */

  .c-feature-item-list{
    --feature-list-column: 2;
    display: grid;
    grid-template-columns: repeat(auto-fill, calc((100% - 1rem) / var(--feature-list-column)));    
    grid-auto-columns: calc((100% - 1rem) / var(--feature-list-column));
    gap: 1rem;
    grid-auto-flow: column;
    overflow-x: auto;
    /* padding-inline: var(--padding-horizontal-global); */
    padding-bottom: 2rem;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  
  .c-feature-item-card {
    scroll-snap-align: start;
  }

  .c-feature-item-card__link{
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none;
  }

  .c-feature-item-card__img{
    width: 100%;
    aspect-ratio: 1;
    object-fit: contain;
  }

  .c-feature-item-card__date{
    margin-top: 0.8rem;
    font-size: 1.1rem;
    letter-spacing: 0.02em;
    line-height: 1.7727;
    opacity: 0.5;
  }

  .c-feature-item-card__text{
    margin-top: 0.4rem;
    font-size: 1.2rem;
    letter-spacing: 0.02em;
    line-height: 1.75;
  }

  /* ------------------  news  ------------------ */
  .p-home-news .p-home-section__inner--small{
    --padding-horizontal-global: 2rem;
  }

  .news-list-area--top .news-item .news-item__content--detail{
    display: none;
  }

  .p-home-news__inner--column{
    flex-direction: column;
    align-items: center;
    gap: 0;
  }

  .p-home-news__inner--column .c-button{
    width: 27rem;
    margin: 3rem auto 0;
  }

  .p-home-news .news-item__link{
    padding: 1.6rem 0;
    gap: 0.6rem;
    align-items: flex-start;
  }

  /* ------------------  history  ------------------ */
  .p-home-history{
    background-color: var(--color-secondary);
  }

  .p-home-history:not(:has(.product__item)){
    display: none;
  }

  .product__history .product__container{
    --grid-columns-desktop: 6;
    --grid-gap: 1.8rem;
  }

  .product__history .c-heading{
    margin-bottom: 1.5rem;
    font-size: 2rem;
    border-bottom: 0;
    padding-bottom: 0;
  }

  .product__history .product__item--name{
    margin-top: 1rem;
    font-size: 1.3rem;
  }

  .product__history .product__item--price{
    margin-top: 0.7rem;
  }

  /* ------------------  card  ------------------ */
  .c-card-list{
    --card-list-column: 2;
    --card-list-gap: 1rem;
    grid-template-columns: repeat(auto-fill, calc((100% - var(--card-list-gap)) / var(--card-list-column)));    
    grid-auto-columns: calc((100% - var(--card-list-gap)) / var(--card-list-column));
    grid-auto-flow: column;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  
  .c-card-item {
    scroll-snap-align: start;
  }

  .p-home-brand .p-home-section__inner{
    padding-inline: 2rem;
  }

}

.p-home-brand{
  margin-bottom: 0;
  padding: 4rem 0 5rem;
  background-color: var(--color-project-bg);
}

@media (min-width: 768px) {
  .p-home-brand{
    padding: 6rem 0 8rem;
  }
}

.p-home-pickup{
  margin: 0;
  padding: 4rem 0 2rem;
  background-color: var(--color-project-bg);
}

.p-home-pickup .product-slider{
  padding-inline: var(--padding-horizontal-global);
}

.p-home-section .product__item--icon:has(.product__icon){
  position: static;
  margin-top: 1.5rem;
}

.p-home-section .product__item--brand{
  margin-top: 0.8rem;
  font-size: 1rem;
  letter-spacing: 0.02em;
  line-height: 1.95;
}

.p-home-section .product__item--name{
  margin-top: 0.8rem;
  font-size: 1.2rem;
  letter-spacing: 0.02em;
  line-height: 1.75;
}

.p-home-section .product__item--price{
  margin-top: 0.8rem;
}

.p-home-pickup .product__item--rank-num{
  display: none !important;
}

.p-home-section .product__item--rank-num{
  padding: 0.2rem 0.7rem;
  width: 4rem;
  height: 4rem;
  display: block;
  font-size: 1.1rem;
  top: 0;
  left: 0;
  background-color: #838489;
  border: none;
  border-radius: 0;
  color: var(--color-white);
  clip-path: polygon(0 0, 100% 0, 0 100%);
}

.p-home-section .product__item--rank-num[data-rank-num="1"],
.p-home-section .product__item--rank-num[data-rank-num="2"],
.p-home-section .product__item--rank-num[data-rank-num="3"]{
  background-color: var(--color-black);
}

.p-home-section .product__price--numeric{
  font-size: 1.5rem;
  font-weight: var(--fw-medium);
}

@media (min-width: 768px) {
  .p-home-pickup{
    padding: 6rem 0 3rem;
  }

  .p-home-pickup .product-slider{
    padding-inline: 0;
  }

  .p-home-section .product__item--icon:has(.product__icon){
    margin-top: 2rem;
  }

  .p-home-section .product__item--rank-num{
    width: 4.8rem;
    height: 4.8rem;
    font-size: 1.3rem;
  }

  .p-home-section .product__item--brand{
    margin-top: 1rem;
    font-size: 1.1rem;
  }

  .p-home-section .product__item--name{
    margin-top: 1rem;
    font-size: 1.3rem;
  }

  .p-home-section .product__item--price{
    margin-top: 1rem;
  }
  
  .p-home-section .product__price--numeric{
    font-size: 1.8rem;
  }
}

.p-home-preorder{
  margin-block: 0;
  padding-block: 2rem 5rem;
  background-color: var(--color-project-bg);
}

@media (min-width: 768px) {
  .p-home-preorder{
    padding-block: 3rem 8rem;
  }
}

.p-home .product__item--soldout{
  height: 2rem;
  top: auto;
  bottom: 0;
  background-color: #f8f8f8;
}

.p-home .product__item--soldout-text{
  font-size: 1.1rem;
  font-weight: var(--fw-regular);
  letter-spacing: 0.02em;
  line-height: 1;
  color: var(--color-text-default);
}