@charset "utf-8";
/* CSS Document */

 /*********************************
              全体
*********************************/

#wrapper {
	overflow: hidden;
	width: 100%;
	max-width: 780px;
	margin: 5% auto;
	display: block;
	color: #000000;
	}
#wrapper img {
	width: 100%;
	}




/* リンク */

#wrapper a:hover img {
    opacity: 1;
}

html { scroll-behavior: smooth;}







	
/*********************************
         　　  共有
*********************************/		
/*テキスト*/




#wrapper p, .topview h3, .checksheet h3 {
	text-align: center;
	font-family: "游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,sans-serif;
	font-weight: bold;
}



/*配置*/
#wrapper .whatis, .chap2-1, .chap2-3, .review, .chap3, .yellow_m2, .yellow_bg, .blue_bg {
	position: relative;
}


#wrapper .txt1, .re_2, .re_3, .re_4, .re_5 {
  position: absolute;
  font-weight: bolder;
  font-size: 4.5vw;
}


 /*▲追記▲*/








	
/*********************************
           メインエリア
*********************************/	
/*topview*/


#wrapper .title_img {
    margin-bottom: 6%;
}

#wrapper .whatis {
    width: 92%;
    margin: 0 auto;
}

#wrapper .plus {
  margin-top:8%;
}

#wrapper .title_plus {
font-size: 3vw;
    margin-bottom: 3%;
}

#wrapper .plus ul {
  width:60%;
}

#wrapper .txt1{
    top: 28%;
	left:25%;
    /*right: 11%;*/
    text-align: center;
    line-height: 7.8vw;
    font-size: 4vw;
}

#wrapper .topview h3 {
 margin: 7% 0 3%;

}

#wrapper p, .topview h3 {
    font-size: 3.4vw;
    line-height: 7vw;
}

#wrapper .small {
 font-size:2.7vw;
margin-left: 30%;
}

#wrapper .box {
text-align: center;
    font-size: 9vw;
    margin-top: -6%;
}

.btn {
  cursor: pointer;
}
.content {
  display: none;
}
#btn1:checked + .content,
#btn2:checked + .content {
  display: block;
}



#wrapper .checksheet {
    background-image: url(https://www.aimerfeel.com.tw/tpl/2021/api/img/check.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    padding-bottom: 15%;
    margin: 23% auto 0;
    width: 93%;
}

#wrapper .check_top {
    padding: 43% 0 5%;
    line-height: 7.5vw;
}

#wrapper .q1-box {
padding: 2% 3%;
    width: 75%;
    border: solid 1px #000000;
    box-shadow: 2px 2px 4px rgb(0 0 0 / 30%);
    text-align: center;
    margin: 0 auto;
    background: white;
    font-weight: bold;
    font-size: 4.3vw;
}

#wrapper .wrap{
display: flex;
    justify-content: center;
    gap: 0 11%;
    margin: 5% auto 6%;
    font-weight: bold;
    font-size: 4.3vw;
}

#wrapper .point {
    width: 7%;
    margin: 0 auto;
}


#wrapper ul {
display: flex;
    width: 75%;
    margin: 0 auto;
 gap: 0 11%;
}


#wrapper .title_un {
    margin-bottom: 5%;
    font-size: 4vw;
}



/*カラーエリア*/

#wrapper .yellow_bg {
    background-image: url(https://shop.aimerfeel.jp/img/page/2022/other/contents16/yellow_bg.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    padding-bottom: 15%;
    margin: 23% auto 0;
    width: 100%;
	background-color: #fff3dd;
}

#wrapper .yellow_top {
width: 50%;
    margin: 0 auto;
    padding-top: 14%;
}

#wrapper .yellow_txt{
font-size: 4.6vw;
    padding-top: 5%;
    line-height: 8vw;
}



#wrapper .yellow_m1, .yellow_m2 {
width: 80%;
    margin: 0 auto;
padding-top: 8.5%;
}

#wrapper .shadow {
  box-shadow : 4px 4px 7px -4px #eabb65;
}

#wrapper .shadow2 {
  box-shadow : 4px 4px 7px -4px #a3bfe6;
}

#wrapper .button_y {
display: flex;
    width: 80%;
    gap: 0 30%;
    margin: 0 auto;
    position: absolute;
    bottom: 7%;
    right: 10%;
    opacity: 0.59;
 
}

#wrapper .more {
width: 38%;
    position: absolute;
bottom: -0.7%;
    right: 30%;
 
}

#wrapper .blue_bg {
    background-image: url(https://shop.aimerfeel.jp/img/page/2022/other/contents16/blue_bg.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    padding-bottom: 15%;
    margin: 23% auto 0;
    width: 100%;
	background-color: #ebf1fa;
}

#wrapper .last_img {
width: 95%;
    margin: 15% auto 0;
}






/*********************************
スライド部分

*********************************/

#wrapper .scroll_container {
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    padding-bottom: 2%;
    margin-left: 1.5%;
}
#wrapper .item_box {
    display: inline-block;
    width: 40%;
    margin: 1%;
    vertical-align: top;
    white-space: normal;
    text-align: left;
}

#wrapper .scroll_container .block-goods-item--price.block-goods-item--price__session .price, #wrapper .block-goods-item--price.block-goods-item--price__session .default-price {
    text-align: left;
    white-space: normal;
}

#wrapper .scroll_container .block-goods-item--price--pricedown_per {
    display: block;
}


#wrapper #pricedown {
    padding-top: 1.5em;
    padding-bottom: 0.2em;
}







/*ボタン*/

	
.btn_black a:link { text-decoration: none;
color: black; }



.btn_black a:visited { color: black;
            text-decoration: none; }





/*********************************
           pc用指示
*********************************/	

@media (min-width: 768px){
	
#wrapper {
	width: 100%;
	}
	




#wrapper .title_img {
    margin-bottom: 6%;
}
	
#wrapper .title_plus {
    font-size: 2.3rem;
}

#wrapper .txt1 {
    line-height: 6rem;
    font-size: 2.1em;
}
	
	
#wrapper p, .topview h3 {
    font-size: 2.3rem;
    line-height: 4rem;
}
	
	
#wrapper .small {
    font-size: 1.7rem;
}
	
	
#wrapper .box {
    font-size: 7rem;
}
	
#wrapper .checksheet {
    padding-bottom: 20%;

}
	

	
#wrapper .check_top {
    line-height: 6rem;
    font-size: 2.7rem;
}	
	
#wrapper .q1-box {
    font-size: 3.1rem;
}	
	
#wrapper .wrap {
    font-size: 3rem;
}
	
#wrapper .title_un {
    font-size: 3rem;
    line-height: 5rem;
}	
	
#wrapper .yellow_txt {
    font-size: 3.2rem;
    line-height: 6rem;
}	
	
#wrapper .more {
    width: 29%;
    bottom: -0.4%;
    right: 33%;
}	
	
#wrapper .scroll_container {
    overflow-x: unset;
    overflow-y: auto;
    white-space: unset;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    margin-left: auto;
    padding-left: 0.2em;
}
#wrapper .item_box {
    margin: 2% 3% 0 0;
    max-width: 174px;
}
#wrapper .item_name {
    text-align: center;
}
#wrapper .scroll_container .block-goods-item--price.block-goods-item--price__session .price, #wrapper .block-goods-item--price.block-goods-item--price__session .default-price {
    font-size: 130%;
    text-align: center;
    font-weight: bold;
}

#wrapper #pricedown .scroll_container {
    padding-left: 1.5em;
}
#wrapper #pricedown .item_box {
    margin: 2% 3% 0 0;
    max-width: 166px;
}
#wrapper #pricedown .item_box:last-child, #wrapper #pricedown .item_box:nth-child(4), #wrapper #pricedown .item_box:nth-child(8), #wrapper #pricedown .item_box:nth-child(12) {
    margin-right: 0;
}
#wrapper #pricedown {
    padding-bottom: 2em;
}
#wrapper #pricedown .more_btn {
    margin-bottom: 0;
}
}
	