@charset "utf-8";
/* CSS Document */

 /*********************************
              全体
*********************************/

#wrapper {
  overflow: hidden;
  width: 100%;
  display: block;
  background: #010101;
	}
#wrapper img {
    width: 100%;
    height: auto;
}


#wrapper p,#wrapper h4 {
  font-family: "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  text-align: center;
  font-weight: bold;
}


#wrapper h1,
#wrapper h2,  
#wrapper h3, 
#wrapper h5, 
#wrapper h6 {
  font-family: "yu-gothic-pr6n", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif !important;
  text-align: center;
}

#wrapper span.br {
    display: block;
}


/* リンク */

html { scroll-behavior: smooth;}


:root {

  /* ============================================
     ベース設定
  ============================================ */
   --ms-vw: 100vw;   
   --ms-rem: clamp(10px, calc(var(--ms-vw) / 40), 18px); 
   --ms-line-height: clamp(1.5, calc(1.3 + (var(--ms-vw) / 2000)), 1.8);
   --ratio: 1;
   --sp-width: 750;
   --variable: calc(100vw / var(--sp-width));
	
  /* ============================================
     フォント
  ============================================ */
  --ms-font-size-xxl:   calc(var(--ms-rem) * 2.3);
  --ms-font-size-xl2:   calc(var(--ms-rem) * 2);
  --ms-font-size-xl:   calc(var(--ms-rem) * 1.8);   
  --ms-font-size-lg:   calc(var(--ms-rem) * 1.65);  
  --ms-font-size-md:   calc(var(--ms-rem) * 1.2);  
  --ms-font-size-sm:   calc(var(--ms-rem) * 1.4);   
  --ms-font-size-xs:   calc(var(--ms-rem) * 1.2);  


  /* ============================================
     カラー
  ============================================ */
  --ms-color-text:       #ffffff;  
  --ms-color-accent-dark:#2a0855;   
  --ms-color-on-accent:  #faee85;    
	
  --ms-color-sec1:     #230226;   
  --ms-color-sec1-1:     #e4e3e4;
  --ms-color-sec2:     #6a8a72; 
  --ms-color-sec2-2:     #9cb4a3;
  --ms-color-sec3:     #599aa4; 
  --ms-color-sec3-2:     #45828d;
  --ms-color-sec3-3:     #66979e;
  --ms-color-sec4:     #b86e68; 
  --ms-color-sec4-2:     #b86e68;
  --ms-color-sec4-3:     #d4ada8;


  /* ============================================
     テキストスタイル
  ============================================ */
  --ms-letter-spacing:   0.11em;
  --ms-letter-spacing-s: 0.10em;

  --ms-line-height:      3rem;
  --ms-line-height-s:    2.5rem;
  --ms-line-height-s2:    2.5rem;
	
/* catchphrase */
--ms-color-catchphrase: #58a5a8;
--ms-font-size-catch:   calc(var(--ms-rem) * 3.1);  
--ms-font-size-catch-hl: calc(var(--ms-rem) * 6);    
--ms-line-height-catch:  1.4;
--ms-letter-spacing-catch:    0.08em;
--ms-letter-spacing-catch-hl: 0.05em;

}

img:hover {
  opacity: 1 !important;
}

a {
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}




	
/*********************************
         　　  共有
*********************************/		

/*配置*/
#wrapper .m_vertical-box, #wrapper .m_vertical-box2 {
	position: relative;
}


#bg_wrapper {
  position: relative; 
}

#smoke {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
  z-index: 1;
}


#wrapper {
    margin: 0;
    height: 100%;
    background:
      radial-gradient(
        ellipse at 50% 15%,
        rgba(185, 41, 134, 0.38) 0%,
        rgba(100, 15, 75, 0.20) 30%,
        transparent 65%
      ),
      radial-gradient(
        ellipse at 10% 70%,
        rgba(185, 41, 134, 0.16) 0%,
        transparent 45%
      ),
      radial-gradient(
        ellipse at 90% 60%,
        rgba(75, 20, 70, 0.20) 0%,
        transparent 50%
      ),
      linear-gradient(
        180deg,
        #090309 0%,
        #120510 50%,
        #050205 100%
      );
        background: black;
  }




.fade-blur {
    opacity: 0;
    filter: blur(15px);
    transform: translateY(25px) scale(1.03);
    transition:
        opacity 1.2s ease-out,
        filter 1.4s ease-out,
        transform 1.4s ease-out;
}

.fade-blur.visible {
    opacity: 1;
    filter: blur(0);
}


/*********************************
           メインエリア
*********************************/	
/*topview*/

#wrapper  {
	width: 100%;
	display: block;
}




#wrapper .topview {
    padding: 3% 0 0%;
    background-image: url(https://shop.aimerfeel.jp/img_visu/page/2026/other/22_contents17/bg_01.jpg);
    background-size: 100% auto;
    background-position: center top;
    background-repeat: no-repeat;
}


#wrapper .title_t {
    width: 55%;
    margin: 11% auto 0;
}

#wrapper .title_l {
    width: 85%;
    margin: -2% auto 0;
}

#wrapper .f-box {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px 0;
    width: 88%;
    margin: 0 auto;
    padding-bottom: 85%;
}

#wrapper .lingerie img {
  width: 100%;
  height: auto;
  display: block;
}

#wrapper .lingerie img {
    width: 100%;
    height: auto;
    aspect-ratio: 235 / 315;
    display: block;
}

#wrapper .camp {
  width: 100%;
  padding-top: 14%;
}

#wrapper .h_cam {
  color: var(--ms-color-text);
  font-size: var(--ms-font-size-xs);
  letter-spacing: var(--ms-letter-spacing-catch-hl);
  line-height: var(--ms-line-height);
  font-weight: bold;
    margin: -55% 0 5%;
    padding: 3%;
}



#wrapper .l_items {
    padding: 3% 0 15%;
    background-image: url(https://shop.aimerfeel.jp/img_visu/page/2026/other/22_contents17/bg_02n.png);
    background-size: 100% auto;
    background-position: center top;
    background-repeat: no-repeat;
	background-color: black;
}



#wrapper .vertical-box {
    position: absolute;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    white-space: nowrap;
    background: var(--ms-color-accent-dark);
    border: 0.5px solid #ffffff;
	box-shadow: 0 0 15px 4px rgba(249, 72, 126, 0.25);
    color: var(--ms-color-on-accent);
    padding: 2.8em 0.5em;
    display: inline-block;
    font-size: var(--ms-font-size-xl);
    line-height: var(--ms-line-height-s2);
    top: -5%;
    right: 8%;
    letter-spacing: var(--ms-letter-spacing);
}


#wrapper .item_t {
    width: 60%;
    margin: 19% auto 0;
}

#wrapper .m_vertical-box {
    width: 110%;
    left: 50%;
    transform: translateX(-50%);
    margin: 9% auto 0%;
    z-index: 3;
}

#wrapper .vrx {
    margin-top: 20%;
}

#wrapper .lingerie_o {
    width: 90%;
    margin: 18% auto 2%;
}


#wrapper .bi_txt a {
    font-size: var(--ms-font-size-md);
    line-height: var(--ms-line-height-xs);
    color: var(--ms-color-text);
    margin: 7% auto 4%;
    display: inline-block;
    font-weight: bold;
}


#wrapper .camp_txt {
    width: 70%;
    margin: 0 auto 4%;
}


#wrapper .block-goods-item--price.block-goods-item--price__session .default-price {
	display: none;
}
#wrapper .price {
	color: var(--ms-color-on-accent) !important;
	font-size: var( --ms-font-size-lg) !important;
}
#wrapper .price__sale {
	color: var(--ms-color-on-accent) !important;
	font-size: var( --ms-font-size-lg) !important;
}

#wrapper .price__sale .block-goods-item--price--pricedown_per {
  font-size: var(--ms-font-size-lg) !important;
}


#wrapper .product-btn {
    position: relative;
    display: block;
    width: fit-content;
    background: var(--ms-color-sec1-1);
    color: var(--ms-color-sec1);
    border-radius: 0;
    padding: 3% 12%;
    font-size: var(--ms-font-size-sm);
    text-decoration: none;
    letter-spacing: var(--ms-letter-spacing);
    margin: 5% auto 0;
	font-weight: bold;
}

#wrapper .product-btn::before {
  content: "";
  position: absolute;
  inset: -1px;
  border: 1px solid #ffffff;
  filter: blur(1.5px);
  pointer-events: none;
}

#wrapper .l_items2 {
	padding-bottom: 33%;
    background-image: url(https://shop.aimerfeel.jp/img_visu/page/2026/other/22_contents17/bg_03.jpg);
    background-size: 100% auto;
    background-position: center top;
    background-repeat: no-repeat;
	background-color: black;
}

#wrapper .vertical-box2 {
    position: absolute;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    background: var(--ms-color-accent-dark);
    border: 0.5px solid #ffffff;
	box-shadow: 0 0 15px 4px rgba(249, 72, 126, 0.25);
    color: var(--ms-color-on-accent);
    padding: 6% 3%;
    display: inline-block;
    font-size: var(--ms-font-size-xl);
    line-height: var(--ms-line-height-s2);
    top: -5%;
    left: 8%;
    letter-spacing: var(--ms-letter-spacing);
}


#wrapper .vrx2 {
    margin-top: 5%;
}

#wrapper .item_t2 {
    width: 60%;
    margin: 0 auto;
    padding-top: 50%;
}

#wrapper .m_vertical-box2 {
	width: 110%;
    left: 50%;
    transform: translateX(-50%);
    margin: 11% auto 0%;
    z-index: 3;
}


#wrapper .vertical-box3 {
    position: absolute;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    white-space: nowrap;
    background: var(--ms-color-accent-dark);
    border: 0.5px solid #ffffff;
	box-shadow: 0 0 15px 4px rgba(249, 72, 126, 0.25);
    color: var(--ms-color-on-accent);
    padding: 2em 0.5em 5em;
    display: inline-block;
    font-size: var(--ms-font-size-xl);
    line-height: var(--ms-line-height-s2);
    top: -5%;
    right: 8%;
    letter-spacing: var(--ms-letter-spacing);
}

#wrapper .vrx4 {
    margin-top: 10%;
}










/*********************************
           pc用指示
*********************************/	

@media (min-width: 768px){
	
  :root {
	--ms-line-height: 2.5;
    --ms-line-height-s2: 2.0;
    --ms-font-size-xl: 2.5rem;
    --ms-font-size-md: 1.5rem;
}
	
#bg_wrapper {
  background:
    radial-gradient(
      ellipse at 50% 15%,
      rgba(185, 41, 134, 0.38) 0%,
      rgba(100, 15, 75, 0.20) 30%,
      transparent 65%
    ),
    radial-gradient(
      ellipse at 10% 70%,
      rgba(185, 41, 134, 0.16) 0%,
      transparent 45%
    ),
    radial-gradient(
      ellipse at 90% 60%,
      rgba(75, 20, 70, 0.20) 0%,
      transparent 50%
    ),
    linear-gradient(
      180deg,
      #090309 0%,
      #120510 50%,
      #050205 100%
    );
}
	
#wrapper {
	max-width: 600px;
	margin: 0 auto;
	display: block;
    box-shadow:
            0 0 25px rgba(255, 80, 180, 0.20),
            0 0 60px rgba(230, 50, 190, 0.14),
            0 0 110px rgba(180, 30, 160, 0.08);
	}
	
#wrapper p, #wrapper h3 {
    font-size: 2.5rem;
	letter-spacing: 0.01rem;
}
	
	
#wrapper .l_items {
  padding: 3% 0 10%;
}
	
	
#wrapper .l_items2 {
  padding-bottom: 30%;
}
	
#wrapper .m_vertical-box {
    margin: 11% auto 0%;
}
	
#wrapper .m_vertical-box2 {
    margin: 12.5% auto 0%;
}




}




