

.main .bg01{
  background-color: #44538e;
}
.main .bg02{
  background-color: #c2a665;
}
.main .bg03{
  background-color: #000;
}
.main .color01{
  color: #666;
}

/* ヘッド */
.main .head {
  display: flex; align-items: center; gap: 0 calc(26/768*100%);
}
.main .head_l {
  width: min(calc(177/768*100vw), 177px);
}
.main .head_r {
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  gap: min(calc(7/768*100vw), 7px);
}
.main .head_r_btn01 {
  width: min(calc(383/768*100vw), 383px);
}
.main .head_r_btn02 {
  width: min(calc(439/768*100vw), 439px);
}
.main .catch {
  width: min(calc(721/768*100%), 721px); margin: 0 auto;
}
.main .head_nav{
  display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: min(calc(10/768*100vw), 10px) min(calc(10/768*100vw), 10px); margin: 0 1.1%;
}
.main .head_nav_item{
  text-align: center;
}
.main .head_nav_item.ver02{
  grid-column-end: span 2;
}

/* コンテンツ */
.main .page_ttl01{
  display: flex; align-items: center; 
  color: #fff; background-color: #000; padding: 1.5% 0 1.5% 3%;
}
.main .page_ttl01_l{
  font-family: var(--font-family); font-size: min(calc(54/768*100vw),54px); line-height: 1; margin: auto 0.5em auto 0;
}
.main .page_ttl01_r{
  font-weight: bold;
}
.main .page_ttl02{
  color: #fff; font-weight: bold; text-align: center; background-color: #666; padding: 0.8em 0.5em;
}
.main .page_ttl03{
  text-align: center; padding: 0 0 0.3em;
  border-style: solid; border-color: #000; border-width: 0 0 1px;
}

.main .product_list{
  display: grid; grid-template-columns: 1fr 1px 1fr;
  /* align-items: end; */
  position: relative; z-index: 0;
}
.main .product_item{
  position: relative; z-index: 0;
}
.main .product_item.ver11{
  grid-column-end: span 3;
  margin: 0 0 0 3.5%;
}
.main .product_item.ver12{
  grid-column-end: span 3;
}
.main .product_item.ver21{
  padding: 8% 0; margin: 0 0 0 6%;
}
.main .product_list_bnr{
  grid-column-end: span 3; margin: 3% 3%;
}
.main .product_bar_y{
  height: 100%; background-color: #d6d6d6;
}
.main .product_bar_x{
  grid-column-end: span 3;
  height: 1px; background-color: #d6d6d6;
}
.main .icon_new{
  position: absolute; z-index: 1; top: 0; right: 0; margin: 0% 1% 0 0;
  width: min(calc(47/768*100vw), 47px);
}
.main .icon_new.ver_enr_serum{
  margin: 26% 1% 0 0;
}
.main .icon_new.ver_acne{
  position: static; margin: 0 0 3%;
}
.main .icon_new.ver_protect2603{
  position: static; margin: 0;
}
.main .icon_limited{
  width: min(calc(74/768*100vw), 74px);
}

.main .product_item.ver_cleansing{ width: min(calc(722/768*100%), 722px); }
.main .product_item.ver_essentials_soap{ width: min(calc(723/768*100%), 723px); }
.main .product_item.ver_natural{ width: min(calc(723/768*100%), 723px); }
.main .product_item.ver_extra{ width: min(calc(722/768*100%), 722px); }
.main .product_item.ver_nourishing25{ width: min(calc(718/768*100%), 718px); }
.main .product_item.ver_nourishing{ width: min(calc(717/768*100%), 717px); }

.main .product_item.ver_brt_essence{ width: min(calc(343*2/767*100%), 343px); }
.main .product_item.ver_brt_overnight{ width: min(calc(347*2/767*100%), 347px); }
.main .product_item.ver_brt_spot{ width: min(calc(344*2/767*100%), 344px); }
.main .product_item.ver_brt_powder{ width: min(calc(345*2/767*100%), 345px); }

.main .product_item.ver_godeeper{ width: min(calc(342*2/767*100%), 342px); }
.main .product_item.ver_born{ width: min(calc(341*2/767*100%), 341px); }
.main .product_item.ver_surge{ width: min(calc(343*2/767*100%), 343px); }
.main .product_item.ver_call{ width: min(calc(341*2/767*100%), 341px); }
.main .product_item.ver_moist{ width: min(calc(343*2/767*100%), 343px); }
.main .product_item.ver_essentials{ width: min(calc(341*2/767*100%), 341px); }

.main .product_item.ver_enr_serum{ width: min(calc(340*2/767*100%), 340px); }
.main .product_item.ver_enr_wrinkle{ width: min(calc(341*2/767*100%), 341px); }
.main .product_item.ver_enr_face{ width: min(calc(724/768*100%), 724px); }

.main .product_item.ver_perfect2025{ width: min(calc(722/768*100%), 722px); }
.main .product_item.sun_protect2603{ width: min(calc(721/768*100%), 721px); }

.main .product_item.ver_misty{ width: min(calc(342*2/767*100%), 342px); }
.main .product_item.ver_makeup{ width: min(calc(341*2/767*100%), 341px); }
.main .product_item.ver_moisture{ width: min(calc(343*2/767*100%), 343px); }
.main .product_item.enr_rebuild{ width: min(calc(348*2/767*100%), 348px); }
.main .product_item.ver_lipbouncer{ width: min(calc(344*2/767*100%), 344px); }
.main .product_item.enr_wipe{ width: min(calc(342*2/767*100%), 342px); }
.main .product_item.ver_acne{ width: min(calc(342*2/767*100%), 342px); }

.main .product_icon_list{
  display: flex; flex-wrap: wrap; align-items: center; gap: 5px 5px;
  margin: 0 0 2%;
}

.main .special_link{
  grid-column-end: span 3;
  margin: 3% 0 0 3.5%;
}
.main .special_link.ver_natural{ width: min(calc(532/768*100%), 532px); }
.main .special_link.ver_extra{ width: min(calc(531/768*100%), 531px); }


/* フット */
.main .btm_nav{
  display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: min(calc(12/768*100vw), 12px) min(calc(12/768*100vw), 12px);
}
.main .btm_nav_item{
  display: flex; align-items: center;
  height: 4em; padding: 0 0.7em 0 0.3em;
  border-style: solid; border-color: #d3d3d3; border-width: 1px;
}
.main .btm_nav_item::after{
  content: ""; width: 0.6em; height: 0.6em;
  border-style: solid; border-color: #000; border-width: 1px 1px 0 0;
  transform: rotate(45deg);
}
.main .btm_nav_fig{
  width: min(calc(80/768*100vw), 80px); text-align: center;
}
.main .btm_nav_img01{ width: calc(23/80*100%) }
.main .btm_nav_img02{ width: calc(31/80*100%) }
.main .btm_nav_img03{ width: calc(19/80*100%) }
.main .btm_nav_img04{ width: calc(14/80*100%) }
.main .btm_nav_img05{ width: calc(38/80*100%) }
.main .btm_nav_img06{ width: calc(13/80*100%) }
.main .btm_nav_img07{ width: calc(41/80*100%) }
.main .btm_nav_img08{ width: calc(12/80*100%) }
.main .btm_nav_img09{ width: calc(23/80*100%) }

.main .btm_nav_text{
  flex-grow: 1; line-height: 1.2; text-align: center;
}
.main .btm_nav_text.ver02{
  margin: auto 2em auto 0;
}




.main .add_text {
  display: grid; grid-template-columns: auto 1fr;
  color: #666;
}