@media screen and (max-width: 767px) {
  .header__contents--searchMenu {
    background-color: #FBF9F0;
  }
  .header__contents--search_byPurpose_blk_inner > ul > li > a > div {
    background-color: #fff;
  }
}
form .button__list--primary {
  background-color: #1A1311;
  border-color: #1A1311;
  color: #fff;
  transition: background-color 0.3s, border-color 0.3s;
}
form .button__list--primary:hover {
  border-color: var(--color-brand-main);
  background-color: var(--color-brand-main);
  opacity: 1;
}

/*==========================
MV
==========================*/
.top_brand__mv--slider,
.top_brand__mv--slider_item {
  margin: 0 !important;
}
.top__mv .slick-slide{
  margin: 0!important;
}

/*==========================
Topics
==========================*/
.top__topics {
  --color-bg: var(--color-brand-purpose-bg01);
}
.top__topics .swiper-pagination .swiper-pagination-bullet-active {
  background-color: #E0C57F;
}

/*==========================
New Arrival／Ranking
==========================*/
.top__newarrival,
.top__ranking {
  --color-bg: var(--color-brand-purpose-bg01);
  --color-rankingRate-bg: #E0C57F;
}
.top__newarrival {
  margin-top: 1.5rem;
}
@media screen and (min-width: 768px) {
  .top__newarrival {
    margin-top: 2rem;
  }
}

.product__item--rank > p {
  display: none;
}

/*==========================
Category
==========================*/
.top__category {
  width: 100%;
  position: relative;
  padding: 0 0 3rem;
}
.top__category::before {
  width: 100%;
  height: 31.6rem;
  background-color: var(--color-brand-purpose-bg01);
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
}
@media screen and (min-width: 768px) {
  .top__category::before {
    height: 20rem;
  }
}
.top__category .heading__ttl {
  padding-bottom: 1.5rem;
}
@media screen and (min-width: 768px) {
  .top__category .heading__ttl {
    padding-bottom: 2rem;
  }
}

.top__category--container {
  width: 92%;
  margin: auto;
  position: relative;
  z-index: 2;
}
@media screen and (min-width: 768px) {
  .top__category--container {
    width: 120rem;
    max-width: 1200px;
  }
}
.top__category--wrapper {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, 48.69565217%);
  column-gap: 2.60869565%;
  row-gap: 1rem;
}
@media screen and (min-width: 768px) {
  .top__category--wrapper {
    grid-template-columns: repeat(4, 22.5%);
    column-gap: 3.33333333%;
  }
}
.top__category--item {
  width: 100%;
  display: block;
}
@media screen and (min-width: 768px) {
  .top__category--item {
    transition: transform 0.3s;
  }
  .top__category--item:hover {
    transform: translateY(-1rem);
  }
}
.top__category .category__item--details {
  width: 100%;
  background-color: #fff;
  padding: 1rem 0 0.8rem;
}
@media screen and (min-width: 768px) {
  .top__category .category__item--details {
    padding: 1.8rem 0 1.4rem;
  }
}
.top__category .category__item--name-en {
  font-family: var(--font-en);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: 0.025em;
  line-height: 1.2667;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .top__category .category__item--name-en {
    font-size: 1.8rem;
  }
}
.top__category .category__item--name-ja {
  font-family: var(--font-ja);
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0.075em;
  line-height: 1.6;
  margin-top: 0.3rem;
  text-align: center;
}

.top__guidelink {
  margin-top: 3rem;
}
@media screen and (min-width: 768px) {
  .top__guidelink {
    margin-top: 4rem;
  }
}

.top__series {
  background-color: var(--color-brand-purpose-bg01);
  padding: 0 0 3rem;
}
@media screen and (min-width: 768px) {
  .top__series {
    padding: 4rem 0;
  }
}
.top__series .heading__ttl{
  padding-bottom: 1.5rem;
}
@media screen and (min-width: 768px) {
  .top__series .heading__ttl{
    padding-bottom: 2rem;
  }
}
.top__series--container {
  width: 92%;
  margin: auto;
}
@media screen and (min-width: 768px) {
  .top__series--container {
    width: 89rem;
    max-width: 890px;
  }
}
.top__series--wrapper {
  display: grid;
  grid-template-columns: repeat(2, 48.69565217%);
  column-gap: 2.60869565%;
  row-gap: 1rem;
}
@media screen and (min-width: 768px) {
  .top__series--wrapper {
    grid-template-columns: repeat(3, 30.33707865%);
    column-gap: 4.49438202%;
    row-gap: 4rem;
  }
}

.top__brand-concept {
  background-color: #f8f8f8;
  overflow: hidden;
  padding: 16rem 0 14rem;
  position: relative;
}
@media screen and (min-width: 768px) {
  .top__brand-concept {
    padding: 12.5rem 0;
  }
}
.top__brand-concept--bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}
.top__brand-concept--bg-image {
  height: 100%;
  object-fit: cover;
}
.top__brand-concept--lead {
  width: max-content;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 0.075em;
  line-height: 1.5714;
  margin: 2.5rem auto 0;
  text-align: center;
}
.top__brand-concept--content {
  position: relative;
  z-index: 2;
}
.top__brand-concept .button__list {
  width: 20rem;
  height: 4rem;
  margin: 4rem auto 0;
}
.top__brand-concept .button__list--primary {
  background-color: #1A1311;
  border-color: #1A1311;
  column-gap: 1rem;
  font-family: var(--font-en);
}

.top__makeupguide {
  padding: 16.5rem 0 12rem;
  position: relative;
}
@media screen and (min-width: 768px) {
  .top__makeupguide {
    width: 100rem;
    max-width: 1000px;
    margin: 2rem auto;
    padding: 11.4rem 0 10.6rem;
  }
}
.top__makeupguide::before {
  width: 100%;
  height: 40rem;
  background-color: var(--color-brand-purpose-bg01);
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}
@media screen and (min-width: 768px) {
  .top__makeupguide::before {
    height: 29rem;
    top: 50%;
    transform: translateY(-50%);
  }
}
.top__makeupguide--bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.top__makeupguide--bg-1 {
  width: 12.7rem;
  position: absolute;
  top: 8.8rem;
  left: 0.4rem;
}
.top__makeupguide--bg-2 {
  width: 7.3rem;
  position: absolute;
  top: 4rem;
  left: 14rem;
}
.top__makeupguide--bg-3 {
  width: 12.7rem;
  position: absolute;
  top: 5.3rem;
  right: 0.5rem;
}
.top__makeupguide--bg-4 {
  width: 8.1rem;
  position: absolute;
  bottom: 8.7rem;
  left: 0.5rem;
}
.top__makeupguide--bg-5 {
  width: 10.6rem;
  position: absolute;
  bottom: 17.2rem;
  right: 0.5rem;
}
.top__makeupguide--bg-6 {
  width: 10.8rem;
  position: absolute;
  bottom: 0.3rem;
  left: 9.5rem;
}
.top__makeupguide--bg-7 {
  width: 9.5rem;
  position: absolute;
  bottom: 4rem;
  right: 3.2rem;
}
@media screen and (min-width: 768px) {
  .top__makeupguide--bg-1 {
    width: 14rem;
    top: 7rem;
    left: 1.4rem;
  }
  .top__makeupguide--bg-2 {
    width: 8rem;
    top: 4.7rem;
    left: 20rem;
  }
  .top__makeupguide--bg-3 {
    width: 14rem;
    top: 0;
    right: 26.6rem;
  }
  .top__makeupguide--bg-4 {
    width: 10rem;
    bottom: 10rem;
    left: 72.7rem;
  }
  .top__makeupguide--bg-5 {
    width: 13rem;
    bottom: 4.5rem;
    right: 25.5rem;
  }
  .top__makeupguide--bg-6 {
    width: 14rem;
    bottom: 0;
    left: 23rem;
  }
  .top__makeupguide--bg-7 {
    width: 12rem;
    bottom: 4.6rem;
    right: 80rem;
  }
}
.top__makeupguide .heading__ttl {
  padding-bottom: 2.7rem;
}
.top__makeupguide .button__list {
  width: 20rem;
  margin: auto;
}
.top__makeupguide .button__list li {
  width: 100%;
}
.top__makeupguide .button__list--primary {
  width: 100%;
  font-family: var(--font-en);
  background-color: #1A1311;
  border-color: #1A1311;
}

.top__guidelink img {
  width: 6.8rem;
  height: 6.8rem;
}
@media screen and (max-width: 767px) {
  .top__guidelink img {
    width: 8.6rem;
    height: 8.6rem;
    margin: 0;
  }
}
@media screen and (max-width: 767px) {
  .top__guidelink .top_point {
    --grid-cols: 100%;
  }
}
.top__guidelink .top_point--blk {
  background-color: var(--color-brand-purpose-bg01);
  border: none;
  margin: 0;
}
@media screen and (max-width: 767px) {
  .top__guidelink .top_point--blk {
    height: 12rem;
  }
  .top__guidelink .top_point--blk > a {
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 1rem 0 3rem;
  }
  .top__guidelink .top_point--blk_inner {
    height: max-content;
    display: grid;
    grid-template-columns: 8.6rem 1fr;
    grid-template-rows: max-content max-content;
  }
}
.top__guidelink .top_point--info_ttl span {
  color: #E0C57F;
}
.top__guidelink .top_point--info_icon {
  width: max-content !important;
  height: max-content !important;
}
@media screen and (max-width: 767px) {
  .top__guidelink .top_point--info {
    column-gap: 2.5rem;
  }
  .top__guidelink .top_point--info_ttl {
    grid-area: 1/2/2/3;
    text-align: left;
  }
  .top__guidelink .top_point--info_icon {
    grid-area: 1/1/3/2;
    margin-top: 0;
  }
  .top__guidelink .top_point--info_text {
    grid-area: 2/2/3/3;
    margin: 0.8rem 0 0;
    text-align: left;
  }
}

.top__sns {
  --color-sns-bg: var(--color-brand-purpose-bg01);
}

/*# sourceMappingURL=top_om.css.map */