@charset "utf-8";

/* ---------------------------------------------
- 特別限定品（ index ） 
- ADDITION（ addition ）
- 抱きゴロ（ dakigoro ）
- パワーマッセル ( power-mussels )
- HFげそ ( HF_geso )
--------------------------------------------- */


/* ---------------------------------------------
- 特別限定品（ index ） 
--------------------------------------------- */

/* iOS系  BUG対策（背景固定） */
/* Chrome BUG対策（Blur効果） */
#SLE #wrap::before {
	content: "";
  display: block;
	margin: auto calc(50% - 50vw);
	width: 100vw;
	height: 100vh;
  background-color: var(--gray);
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
}

/* --- TOP --- */
.SLE_TOP {
  margin: 25% auto;
  width: 90%;
}

/* TITLE */
.SLE_TOP .TTL {
  margin: auto auto 20%;
  width: 100%;
  text-align: left;
}

.SLE_TOP .TTL h2 {
  margin-bottom: 1%;
  width: 66%;
  font-family: "CrInfant", serif;
  font-weight: 500;
  font-size: min(60px, max(8vw, 28.8px));
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: left;
  position: relative;
}

.SLE_TOP .TTL h2::before {
  content: "";
  width: 15%;
  height: min(2.25px, max(0.3vw, 1.08px));
  background-color: var(--black);
  position: absolute;
  top: 63%;
  left: auto;
  right: 0;
  transform: translate(0%,-50%);
}

.SLE_TOP .TTL p {
  margin-bottom: 20%;
  width: fit-content;
  font-family: "GenjyuuGLP", sans-serif;
  font-weight: 300;
  font-size: var(--fs_14);
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: left;
  position: relative;
}

/* TEXT */
.SLE_TOP TXT {
  margin: auto auto 20%;
  width: 100%;
  text-align: left;
}

.SLE_TOP p {
  width: 90%;
  font-family: "GenjyuuGLP", sans-serif;
  font-weight: 500;
  font-size: min(45px, max(6vw, 21.6px));
  line-height: 2.2;
  letter-spacing: 0.075em;
  text-align: left;
  position: relative;
}

.SLE_TOP p:last-child {
  margin-bottom: 0;
}

/* --- ITEM --- */
.item-wrap {
  margin: auto;
  padding-bottom: 25%;
  width: 90%;
}

.item-wrap .LTD_item {
  margin: auto;
  width: 100%;
}

/* --- link対策(PC・SP)@media制御 --- */
/* for PC */
@media (hover: hover) {
  .item-wrap .LTD_item a:hover {
    opacity: 0.6;
  }

}

/* for SP */
@media (hover: none) {
  .item-wrap .LTD_item a:active {
    opacity: 0.6;
  }

}



/* ------------------------------
- ADDITION（ addition ）
------------------------------ */

/* iOS系  BUG対策（背景固定） */
/* Chrome BUG対策（Blur効果） */
#ADDITION #wrap::before {
  content: "";
  display: block;
  margin: auto calc(50% - 50vw);
  width: 100vw;
  height: 100vh;
  background: url(../site_images/prodCAT/SLE/addition/ADDITION_BG.jpg);
  background: image-set( url(../site_images/prodCAT/SLE/addition/ADDITION_BG.webp));
  background-size: cover;
  background-position: 5% 100%;
  background-repeat: no-repeat;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}

#ADDITION #wrap::after {
  content:"";
  display: block;
  margin: auto calc(50% - 50vw);
  width: 100vw;
  height: 100vh;
  background-color: rgba(0,0,0,0.75);
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}

.addition {
  margin: auto;
  color: var(--white);
}

/* --- TOP --- */
.addition-TOP {
  margin: 12% auto 13% 8%;
}

.addition-TOP picture img {
  width: 55%;
  height: auto;
}

.addition-TOP h1 {
  margin-left: 1em;
  width: fit-content;
  font-family: "GenjyuuGLP",sans-serif;
  font-weight: 500;
  font-size: var(--fs_10);
  letter-spacing: 0.1em;
  line-height: 1;
  position: relative;
}

.addition-TOP h1::before {
  content: "－";
  position: absolute;
  top: 0;
  left: -1em;
}

.addition-TOP h1::after {
  content: "－";
  position: absolute;
  top: 0;
  right: -1em;
}

/* --- IMG --- */
.addition-IMG {
  margin: auto 0 auto auto;
  width: 75%;
}

.addition-IMG img {
  height: auto;
}

/* --- TITLE --- */
.addition-TTL {
  margin: 15% auto 20%;
  width: 84%;
}

.addition-TTL p:nth-of-type(1) {
  margin-bottom: 8%;
  font-family: "GenjyuuGLP",sans-serif;
  font-weight: 500;
  font-size: min(48.75px, max(6.5vw, 23.4px));
  letter-spacing: 0.05em;
  line-height: 1.6;
}

.addition-TTL p:nth-of-type(2) {
  font-family: "GenjyuuGLP",sans-serif;
  font-weight: 500;
  font-size: var(--fs_15);
  letter-spacing: 0.05em;
  line-height: 1.6;
}

/* --- TEXT --- */
.addition-TXT {
  margin: auto auto 18%;
  width: 82%;
}

.addition-TXT p {
  font-family: "GenjyuuGLP",sans-serif;
  font-weight: 400;
  font-size: var(--fs_14);
  line-height: 1.6;
  letter-spacing: 0.05em;
  text-align: justify;
}

/* --- IMG --- */
.addition-IMG2 {
  margin: auto;
  width: 100%;
}

.addition-IMG2 img {
  height: auto;
}



/* --- カート上書 --- */
.cart_wrap.color_white table {
  color: var(--white);
}



/* ------------------------------
 名称：抱きゴロ（だきごろ） 
------------------------------ */

/* iOS系  BUG対策（背景固定） */
/* Chrome BUG対策（Blur効果） */
#dakigoro #wrap::before {
	content: "";
  display: block;
	margin: auto calc(50% - 50vw);
	width: 100vw;
	height: 100vh;
  background-color: #111;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
}

.dakigoro {
  margin: 10% auto auto;
  color: var(--white);
}



/* --- TOP --- */
.daki-TOP {
  margin: auto auto 40%;
  position: relative;
}

.daki-TOP::after {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.45);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}

/* ins-logo */
.daki-TOP .ins-logo {
  width: 53%;
  position: absolute;
  top: 15%;
  left: 8%;
  z-index: 1;
}

/* TEXT */
.daki-TOP h1 {
  font-family: "Noto Serif JP",serif;
  font-weight: 400;
  font-size: var(--fs_16);
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
  position: absolute;
  top: 44%;
  left: 38%;
  z-index: 1;
}

.daki-TOP h1 span.f1 {
  display: inline-block;
  margin-right: 5%;
  transform: translate(0%,-10%);
}

/* INS-IMG */
.daki-TOP .ins-img {
  width: 65%;
  position: absolute;
  top: 55%;
  right: 1%;
  transform: rotate(7deg);
  z-index: 1;
}

/* icon */
.daki-TOP .icon {
  width: 25%;
  position: absolute;
  bottom: -16%;
  left: 8%;
  z-index: 1;
}

/* --- TITLE --- */
.daki-TTL {
  margin: auto auto 15%;
  width: 84%;
  text-align: left;
}

.daki-TTL p {
  margin-bottom: 6%;
  font-family: "GenjyuuGLP",sans-serif;
  font-weight: 500;
  font-size: var(--fs_19);
  letter-spacing: 0.05em;
  line-height: 1;
}

.daki-TTL p:last-child {
  margin-bottom: 0;
}

.daki-TTL p span.f1 {
  display: inline-block;
  margin-left: 18%;
  font-size: 135%;
  position: relative;
}

.daki-TTL p span.f1::before {
  content: "";
  width: 26%;
  height: min(0.3vw,2.25px);
  background-color: var(--white);
  position: absolute;
  top: 50%;
  left: -32%;
}

/* --- TEXT --- */
.daki-TXT {
  margin: auto;
  width: 84%;
}

.daki-TXT p {
  font-family: "GenjyuuGLP",sans-serif;
  font-weight: 400;
  font-size: var(--fs_14);
  letter-spacing: 0.05em;
  line-height: 1.6;
  text-align: justify;
}

/* --- INSERT --- */
.daki-INS {
  margin: 20% auto 22.5%;
  width: 100%;
}

/* --- TEXT2 --- */
.daki-TXT2 {
  margin: auto ;
  width: 80%;
  position: relative;
  z-index: 1;
}

.daki-TXT2__inbox,
.daki-TXT2__inbox2,
.daki-TXT2__inbox3 {
  margin-bottom: 10%;
  padding: 3%;
  background-color: #222;
  border: solid 1px #444;
  border-radius: 20px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  position: relative;
}

/* 吹き出し枠↓ */
.daki-TXT2__inbox::before {
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  top: auto;
  left: auto;
  right: 5.2%;
  bottom: -45%;
  border-style: solid;
  border-color: #444 transparent transparent transparent;
  border-width: var(--fs_4) var(--fs_2) 0 var(--fs_2);
  z-index: -1;
}

.daki-TXT2__inbox::after {
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  top: auto;
  left: auto;
  right: 5.2%;
  bottom: -42%;
  border-style: solid;
  border-color: #222 transparent transparent transparent;
  border-width: 35px 30px 0 30px;
  border-width: var(--fs_4) var(--fs_2) 0 var(--fs_2);
  z-index: 1;
}


/* 吹き出し枠↑ */

.daki-TXT2__inbox2 {
  margin-bottom: 0;
}

.daki-TXT2__inbox p {
  font-size: var(--fs_3);
  text-align: center;
}

.daki-TXT2__inbox2 p {
  margin: auto auto 2%;
  width: 65%;
  font-size: var(--fs_1);
  text-align: left;
  line-height: 1.4;
  white-space: nowrap;
  color: var(--white);
}

.daki-TXT2__inbox2 p span.f1 {
  display: inline-block;
  transform: scale(0.9,1);
  letter-spacing: 0.5em;
}

.daki-TXT2__inbox2 p:last-child {
  margin-bottom: 0;
}

.daki-TXT2__mark {
  margin: 4% auto 5%;
  width: 11%;
}

.daki-TXT2__inbox3 {
  margin: auto auto 0;
  padding: 5% 0 10.5%;
}

.daki-TXT2__inbox3 p:nth-of-type(1) {
  margin: auto auto 8%;
  line-height: 1.4;
  font-size: var(--fs_3);
  text-align: center;
}

.daki-TXT2__inbox3 p:nth-of-type(1) span.f1 {
  display: inline-block;
  position: relative;
}

.daki-TXT2__inbox3 p:nth-of-type(1) span.f1::before {
  content: "※";
  width: 1em;
  height: 1em;
  position: absolute;
  top: 0;
  left: -1.2em;
}

.daki-TXT2__inbox3 p:nth-of-type(1) span.f1::after {
  content: "、";
  width: 1em;
  height: 1em;
  position: absolute;
  top: 0;
  right: -1.1em;
}

.daki-TXT2__inbox3 p:nth-of-type(2) {
  margin: auto;
  width: 82%;
  font-size: var(--fs_1);
  font-weight: 300;
  letter-spacing: 0.03em;
  line-height: 1.5;
  text-align: justify;
}



/* ---------------------------------------------
- パワーマッセル ( power-mussels )
------------------------------------------ */

/* iOS系  BUG対策（背景固定） */
/* Chrome BUG対策（Blur効果） */
#power-mussels #wrap::before {
  content: "";
  margin: auto calc(50% - 50vw);
  width: 100vw;
  height: 100%;
  background-color: var(--white);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.mussels {
  padding: 10% 0 15%;
  height: 100%;
  position: relative;
  z-index: 0;
}

/* --- TOP --- */
.mussels-TOP {
  margin: auto;
  width: 90%;  
}

/* --- TEXT --- */
.mussels-TXT {
  margin: 3% auto 5% 5%;
  padding: 15% 7% 10%;
  width: calc(90% * 0.93);
  background-color: #999;
  color: var(--white);
  position: relative;
  z-index: auto;
}

.mussels-TXT::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: #d4d4d4;
  position: absolute;
  top: 7%;
  left: 7%;
  z-index: -1;
}

.mussels-TXT h2 {
  margin-bottom: 7%;
  font-family: "Noto Serif JP", serif;
  font-weight: 400;
  font-size: var(--fs_14-4);
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: left;
}

.mussels-TXT h2 span.f1 {
  display: inline-block;
  margin-top: 3%;
  font-size: 150%;
}

.mussels-TXT p {
  font-family: "GenjyuGLP", sans-serif;
  font-weight: 300;
  font-size: var(--fs_12);
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-align: justify;
}



/* ------------------------------------------
- HFげそ ( HF_geso )
------------------------------------------ */


/* iOS系  BUG対策（背景固定） */
/* Chrome BUG対策（Blur効果） */
#HF_geso #wrap::before {
  content: "";
  margin: auto calc(50% - 50vw);
  width: 100vw;
  height: 100%;
  background: url( ../site_images/prodCAT/SLE/HF_geso/BG_geso.jpg);
  background: image-set( url( ../site_images/prodCAT/SLE/HF_geso/BG_geso.webp));
  background-size: cover;
  background-position: 50% 100%;
  background-repeat: no-repeat;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  opacity: 0.35;
}

.geso {
  margin: auto;
  padding-top: 10%;
  width: 100%;
}

/* --- TOP --- */
.geso .TOP {
  margin: auto;
  width: 100%;
  
}

/* --- TITLE --- */
.geso .TTL {
  margin: 20% auto;
  width: fit-content;
}

.geso .TTL h2 {
  font-family: "GenjyuuGLP", sans-serif;
  font-weight: 700;
  font-size: var(--fs_20);
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-align: left;
}

.geso .TTL h2 span.f1 {
  font-size: min(67.5px, max(9vw, 32.4px));
}

.geso .TTL p {
  margin-top: 8%;
  font-family: "GenjyuuGLP", sans-serif;
  font-weight: 700;
  font-style: italic;
  font-size: var(--fs_14);
  letter-spacing: 0.05em;
  line-height: 1;
  text-align: left;
}

/* --- TEXT --- */
.geso .TXT {
  margin: auto;
}

.geso .TXT:nth-of-type(2) {
  margin: 24% auto;
}

.geso .TXT .ins-header {
  margin: auto;
  width: 100%;
  position: relative;
  z-index: 1;
}

.geso .TXT .text {
  margin: -1px auto auto 6%;
  width: 80%;
  height: min(270.833px, max(36.111vw, 130px));
  background-color: #d4d4d4;
  position: relative;
  display: flex;
  align-items: center;
}

.geso .TXT .text::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: #e0e0e0;
  position: absolute;
  top: 12%;
  left: 6%;
  z-index: -1;
}

.geso .TXT .text p {
  padding: 1em;
  font-family: "GenjyuuGLP", sans-serif;
  font-weight: 400;
  font-size: var(--fs_13);
  letter-spacing: 0.05em;
  line-height: 1.6;
  text-align: justify;

}

/* --- INS-IMG --- */
.geso .INSERT {
  margin: 30% auto auto;
  display: flex;
  justify-content: flex-end;
  background-color: var(--gray);
}

.geso .INSERT .photo {
  width: 50%;
}