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

/*スライドショー
---------------------------------------------------------*/
#slider{
	position: relative;}
#p-slider .slide{
	position:relative;
	background-position: center center;
	background-repeat: no-repeat;
	background-size:cover;
	height: calc(100vh - 110px);
	border: none;
}
.bx-wrapper .bx-viewport{
	left:0 !important;
}
#p-slider .slide.slide1{
	background-image:url("https://img21.shop-pro.jp/PA01485/002/etc_base64/ZGVjb3JlaWdodF90b3A.jpg?cmsp_timestamp=20250819102827");
}
#p-slider .slide.slide2{
	background-image:url("https://img21.shop-pro.jp/PA01485/002/etc_base64/bV9pbWcy.jpg?cmsp_timestamp=20230712214431");
}
#p-slider .slide.slide3{
	background-image:url("https://img21.shop-pro.jp/PA01485/002/etc_base64/bV9pbWcz.jpg?cmsp_timestamp=20230712214431");
}
#p-slider .slide.slide2 .m_amzn{
	position: absolute;
	left: 30px;
	top: 30px;
	max-width: 310px;
	width: 25%;
}
#p-slider #slider .m_copy{
	max-width: 700px;
	width: 50%;
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
#p-slider #slider .m_star > li{
	max-width:20px;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 500;
}
#p-slider #slider .m_star > li:nth-child(1),
#p-slider #slider .m_star > li:nth-child(4){
  animation: kira1 3.5s infinite;
}
@keyframes kira1 {
	0% {
    opacity: 1;
  }
	50% {
    opacity: 0;
  }
	100% {
    opacity: 1;
  }
}
#p-slider #slider .m_star > li:nth-child(2),
#p-slider #slider .m_star > li:nth-child(5){
  animation: kira2 3.5s infinite;
}
@keyframes kira2 {
	0% {
    opacity: 0;
  }
	50% {
    opacity: 1;
  }
	100% {
    opacity: 0;
  }
}
#p-slider #slider .m_star > li:nth-child(3),
#p-slider #slider .m_star > li:nth-child(6){
  animation: kira3 3.5s infinite;
}
@keyframes kira3 {
	0% {
    opacity: 0;
  }
	25% {
    opacity: 1;
  }
	75% {
    opacity: 0;
  }
	100% {
    opacity: 0;
  }
}
#p-slider #slider .slide1 .m_star > li:nth-child(1){
	left: 25%;
	top: 35%;
}
#p-slider #slider .slide1 .m_star > li:nth-child(2){
	left: 75%;
	top: 55%;
}
#p-slider #slider .slide1 .m_star > li:nth-child(3){
	left: 65%;
	top: 15%;
}

#p-slider #slider .slide1 .m_star > li:nth-child(4){
	left: 75%;
	top: 35%;
}
#p-slider #slider .slide1 .m_star > li:nth-child(5){
	left: 40%;
	top: 40%;
}

#p-slider #slider .slide1 .m_star > li:nth-child(6){
	left: 50%;
	top:80%;
}

#p-slider #slider .slide2 .m_star > li:nth-child(1){
	left: 25%;
	top: 60%;
}
#p-slider #slider .slide2 .m_star > li:nth-child(2){
	left: 75%;
	top: 70%;
}
#p-slider #slider .slide2 .m_star > li:nth-child(3){
	left: 80%;
	top: 30%;
}
#p-slider #slider .slide2 .m_star > li:nth-child(4){
	left: 75%;
	top: 40%;
}
#p-slider #slider .slide2 .m_star > li:nth-child(5){
	left: 75%;
	top: 5%;
}
#p-slider #slider .slide2 .m_star > li:nth-child(6){
	left: 60%;
	top:85%;
}

#p-slider #slider .slide3 .m_star > li:nth-child(1){
	left: 32%;
	top: 30%;
}
#p-slider #slider .slide3 .m_star > li:nth-child(2){
	left: 20%;
	top: 55%;
}
#p-slider #slider .slide3 .m_star > li:nth-child(3){
	left: 65%;
	top: 15%;
}
#p-slider #slider .slide3 .m_star > li:nth-child(4){
	left: 75%;
	top: 35%;
}
#p-slider #slider .slide3 .m_star > li:nth-child(5){
	left: 65%;
	top: 60%;
}
#p-slider #slider .slide3 .m_star > li:nth-child(6){
	left: 50%;
	top:85%;
}

/*現在地表示アイコン*/
.bx-wrapper .bx-pager.bx-default-pager a{
	width: 10px !important;
	height: 10px !important;
	border-radius: 10px !important;
	margin:0 10px !important;
	border:1px solid #000000;
	background: none !important;
 }
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active{
	background: #000000 !important;
}
.bx-wrapper .bx-pager {
	width:100px !important;
	left: 10px !important;
  bottom: 30px !important;
}
.bx-wrapper .bx-viewport{
	overflow:hidden;
	padding-bottom: 0;
	box-shadow: none !important;
	border: none !important;
}
.bx-wrapper .bx-next,.bx-wrapper .bx-prev{display:none;}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#p-slider .slide{
	height: 65vw;
}
#p-slider #slider .m_star > li{
	max-width:15px;
}
#p-slider #slider .slide1 .m_star > li:nth-child(3){
	top: 10%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {	
#p-slider .slide{
	height: calc(100vh - 15vw);
}
#p-slider .slide.slide1{
	background-image:url("https://img21.shop-pro.jp/PA01485/002/etc_base64/ZGVjb3JlaWdodF90b3Bfc3A.jpg?cmsp_timestamp=20250819103833");
}
#p-slider .slide.slide2{
	background-image:url("https://img21.shop-pro.jp/PA01485/002/etc_base64/bV9pbWcyX3Nw.jpg?cmsp_timestamp=20230712214431");
}
#p-slider .slide.slide3{
	background-image:url("https://img21.shop-pro.jp/PA01485/002/etc_base64/bV9pbWczX3Nw.jpg?cmsp_timestamp=20230712214431");
}
#p-slider .slide.slide2 .m_amzn{
	left: 4vw;
	top: 4vw;
	width: 45%;
}
#p-slider #slider .m_copy{
	max-width: 700px;
	width: 90%;
}
#p-slider #slider .m_star > li{
	width: 4vw;
}

#p-slider #slider .slide1 .m_star > li:nth-child(1){
	left: 10%;
	top: 38%;
}
#p-slider #slider .slide1 .m_star > li:nth-child(2){
	left: 78%;
	top: 65%;
}
#p-slider #slider .slide1 .m_star > li:nth-child(3){
	left: 55%;
	top: 20%;
}

#p-slider #slider .slide1 .m_star > li:nth-child(4){
	left: 85%;
	top: 37%;
}
#p-slider #slider .slide1 .m_star > li:nth-child(5){
	left: 10%;
	top: 75%;
}

#p-slider #slider .slide1 .m_star > li:nth-child(6){
	left: 65%;
	top:72%;
}

#p-slider #slider .slide2 .m_star > li:nth-child(1){
	left: 30%;
	top: 65%;
}
#p-slider #slider .slide2 .m_star > li:nth-child(2){
	left: 75%;
	top: 75%;
}
#p-slider #slider .slide2 .m_star > li:nth-child(3){
	left: 85%;
	top: 40%;
}
#p-slider #slider .slide2 .m_star > li:nth-child(4){
	left: 70%;
	top: 25%;
}
#p-slider #slider .slide2 .m_star > li:nth-child(5){
	left: 50%;
	top: 10%;
}
#p-slider #slider .slide2 .m_star > li:nth-child(6){
	left: 50%;
	top:90%;
}

#p-slider #slider .slide3 .m_star > li:nth-child(1){
	left: 23%;
	top: 32%;
}
#p-slider #slider .slide3 .m_star > li:nth-child(2){
	left: 20%;
	top: 70%;
}
#p-slider #slider .slide3 .m_star > li:nth-child(3){
	left: 75%;
	top: 15%;
}
#p-slider #slider .slide3 .m_star > li:nth-child(4){
	left: 88%;
	top: 45%;
}
#p-slider #slider .slide3 .m_star > li:nth-child(5){
	left: 73%;
	top: 60%;
}
#p-slider #slider .slide3 .m_star > li:nth-child(6){
	left: 50%;
	top:85%;
}	
	

/*現在地表示アイコン*/
.bx-wrapper .bx-pager.bx-default-pager a{
	width: 7px !important;
	height: 7px !important;
	border-radius: 7px !important;
	margin:0 5px !important;
 }
.bx-wrapper .bx-pager {
	width:70px !important;
	left: 0 !important;
  bottom: 20px !important;
}
}




/*おすすめ商品
---------------------------------------------------------*/
#recomend .rec_title{
	max-width: 385px;
	margin: 0 auto 80px auto;
}
#recomend .rec_bg{
	background:#a8e8e8;
	padding:150px 0 150px 0 ;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#recomend .rec_title{
	width: 40%;
	margin: 0 auto 50px auto;
}
#recomend .rec_bg{
	padding:70px 0 70px 0 ;}
	
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {	
#recomend .rec_title{
	width: 70%;
	margin: 0 auto 8% auto;
}
#recomend .rec_bg{
	padding:13% 0 10% 0 ;
}
}





/*特徴
---------------------------------------------------------*/
#feature .feature_box{
	position:relative;
	
}
#feature .abs_img{
	position:absolute;
	top: -50px;
	width: 45%;
	max-width: 750px;
}
#feature .abs_img ul{
	position:relative;
	margin: 0;
}
#feature .abs_img li{
	position: absolute;
	left: 0;
	top: 0;
}
#feature .abs_img.anime_on li:nth-child(1){
  animation: item1 2s ease-in-out;
}
@keyframes item1 {
	0% {
    opacity: 0;
  }
	5% {
    opacity: 0;
  }
	10% {
    opacity: 1;
  }
}
#feature .abs_img.anime_on li:nth-child(2){
  animation: item2 2s ease-in-out;
}
@keyframes item2 {
	0% {
    opacity: 0;
  }
	35% {
    opacity: 0;
  }
	40% {
    opacity: 1;
  }
}
#feature .abs_img.anime_on li:nth-child(3){
  animation: item3 2s ease-in-out;
}
@keyframes item3 {
	0% {
    opacity: 0;
  }
	65% {
    opacity: 0;
  }
	70% {
    opacity: 1;
  }
}
#feature .abs_img.anime_on li:nth-child(4){
  animation: item4 2s ease-in-out;
}
@keyframes item4 {
	0% {
    opacity: 0;
  }
	95% {
    opacity: 0;
  }
	100% {
    opacity: 1;
  }
}

#feature .inbox{
	width:50%;
	position: relative;
	padding-bottom: 230px;
}
#feature .inbox .txt_box{
	width:72%;
	padding-top: 230px;
}
#feature .inbox .icon_box{
	width:15%;
	position: absolute;
	top: 0;
}
#feature h4{
	font-size:170%;
	letter-spacing: 0.18em;
	margin: 0 0 15px 0;
}
#feature .btn1{
	margin-top:70px;
}


/*feature1*/
#feature .feature1{
	background:#ffa69d;
}
#feature .feature1 .inbox{
	margin: 0 0 0 auto;
}
#feature .feature1 .abs_img{
	left: 0;
}
#feature .feature1 .inbox .icon_box{
	right: 0;
}
#feature .feature1 .inbox .txt_box{
	margin: 0 auto 0 0;
}

/*feature2*/
#feature .feature2{
	background:#fffb7d;
}
#feature .feature2 .inbox{
	margin: 0 auto 0 0;
}
#feature .feature2 .abs_img{
	right: 0;
}

#feature .feature2 .inbox .icon_box{
	left: 0;
}
#feature .feature2 .inbox .txt_box{
	margin: 0 0 0 auto;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#feature .abs_img{
	top: -50px;
	width: 55%;
}
#feature .inbox{
	width:40%;
	padding-bottom: 150px;
}
#feature .inbox .txt_box{
	width:82%;
	padding-top: 100px;
}
#feature .inbox .icon_box{
	width:15%;
}
#feature .btn1{
	margin-top:30px;}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {	
#feature .abs_img{
	position:absolute;
	top: -10vw;
	width: 87%;
}
#feature .inbox{
	width:100%;
	position: static;
	padding-bottom: 20%;
}
#feature .inbox .txt_box{
	width:90%;
	padding-top: 85vw;
}
#feature .inbox .icon_box{
	width:15%;
}
#feature h4{
	font-size:5vw;
	letter-spacing: 0.12em;
	margin: 0 0 3% 0;
}
#feature .btn1{
	margin-top:8%;
}


/*feature1*/
#feature .feature1 .abs_img{
	left: 0;
}
#feature .feature1 .inbox .icon_box{
	right: 0;
}
#feature .feature1 .inbox .txt_box{
	margin: 0 auto;
}

/*feature2*/
#feature .feature2 .inbox .txt_box{
	padding-top: 90vw;
}
#feature .feature2 .inbox{
	margin: 0 auto;
}
#feature .feature2 .inbox .icon_box{
	left: 0;
}
#feature .feature2 .inbox .txt_box{
	margin: 0 auto;
}
}





/*アンドエイトとは
---------------------------------------------------------*/
#andeight{
	position: relative;
	padding-bottom: 100px;
}
#andeight .w1200{
	padding-top: 400px;
	position: relative;
	overflow: hidden;
}
#andeight .laz{
	position: absolute;
	left: 0;
	top: 50px;
	max-width: 200px;
	width: 20%;
}
#andeight .laz.anime_on {
	transform: translateY(0);
	transition: 2s ease-in-out;
	top: -50px;
	left: 50px;
}
#andeight .laz div{
  animation:fuwa ease-in-out 2s infinite alternate;
  -webkit-animation:fuwa ease-in-out 2s infinite alternate;
  -moz-animation:fuwa ease-in-out 2s infinite alternate;}
@keyframes fuwa{
  0%   { transform:translate(0%, 0%) ;}
  100% { transform:translate(-20px, 10px) ;}
}
#andeight .icon_and8{
	position:absolute;
	right: 0;
	top: 200px;
	max-width: 310px;
	opacity: 0;
}
#andeight .icon_and8.anime_on {
	transition: 4s ease-in-out;
	opacity: 1;
}
#andeight dl dt{
	max-width: 160px;
	margin-bottom: 30px;
}
#andeight dl h3{
	font-size:200%;
	line-height: 1.8em;
	letter-spacing: 0.2em;
}
#andeight dd p{
	line-height: 1.8em;
	margin-bottom: 50px;
}
#andeight .sns_list{
	overflow:hidden;
	max-width: 180px;
	margin: 30px 0 0 auto;
}
#andeight .sns_list li{
	float: left;
	width: 30%;
	margin-right: 5%;
}
#andeight .sns_list li:last-child{
	margin-right: 0;
}
#andeight .sns_list li a{ transition : 1s;}
#andeight .sns_list li a:hover{
	transition : 1s;
	opacity: 0.5;
}


/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#andeight{
	padding-bottom: 50px;
}
#andeight .w1200{
	padding-top: 250px;
}
#andeight .laz{
	left: -50px;
	top: -100px;
}
#andeight .icon_and8{
	right: -20px;
	top: 50px;
	width: 30%;
}
#andeight dl dt{
	max-width: 140px;
	margin-bottom: 30px;
}
#andeight dl h3{
	font-size:180%;
}
#andeight dd p{
	margin-bottom: 30px;
}
#andeight .sns_list{
	overflow:hidden;
	max-width: 180px;
	margin: 30px 0 0 auto;
}
#andeight .sns_list li{
	float: left;
	width: 30%;
	margin-right: 5%;
}
#andeight .sns_list li:last-child{
	margin-right: 0;
}
#andeight .sns_list li a{ transition : 1s;}
#andeight .sns_list li a:hover{
	transition : 1s;
	opacity: 0.5;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {	
#andeight{
	padding-bottom: 13%;
}
#andeight .w1200{
	overflow:hidden;
	padding-top: 70vw;
}
#andeight .laz{
	left: 0;
	top: -10vw;
	width: 28%;
}
#andeight .laz.anime_on {
	left: 5%;
}
#andeight .icon_and8{
	position:absolute;
	right: -2%;
	top: 25vw;
	width: 50%;
}
#andeight dl dt{
	width: 50%;
	margin-bottom: 2%;
}
#andeight dl h3{
	font-size:4.9vw;
	line-height: 1.8em;
	letter-spacing: 0.1em;
}
#andeight dd p{
	margin-bottom: 5%;
}
#andeight .sns_list{
	width: 35%;
	margin: 7% 0 0 auto;}
}








/*探す
---------------------------------------------------------*/
#search {
	padding:40px 0 180px 0;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#search {
	padding:0 0 80px 0;}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {	
#search {
	padding:0 0 15% 0;}
}





/*
---------------------------------------------------------*/

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {	
}




.news-box {
  margin: 0;
  margin-bottom: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.news-box dt {
  width: 40px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background-color: #FFBF00;
  font-weight: 500;
  font-size: 11px;
}

.news-box dd {
  width: calc(100% - (40px + 8px));
  font-size: 14px;
  font-weight: 500;
}

.feature-flex .flex {
  margin-bottom: 48px;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}

.feature-flex .flex .img-box {
  width: 360px;
}

.feature-flex .flex .img-box img {
  display: block;
  width: 100%;
}

.feature-flex .flex .right {
  width: calc(100% - (360px + 48px));
}

.feature-flex .flex .right h3 {
  margin: 0;
  font-size: 20px;
  margin-bottom: 16px;
  font-family: '貂明朝', sans-serif;
}

.feature-flex .flex .right .desc {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 24px;
}

@media screen and (max-width: 1100px) {
  .feature-flex .flex {
    margin-bottom: 40px;
    align-items: stretch;
  }
  
  .feature-flex .flex .img-box {
    width: 40%;
  }
    
  .feature-flex .flex .right {
    width: calc(100% - (40% + 24px));
  }
  
  .feature-flex .flex .right h3 {
    font-size: 18px;
    margin-bottom: 16px;
  }
  
  .feature-flex .flex .right .desc {
    font-size: 12px;
    margin-bottom: 32px;
  }
}

@media screen and (max-width: 768px) {
  .feature-flex .flex {
    flex-wrap: wrap;
  }
  
  .feature-flex .flex .img-box {
    width: 100%;
    margin-bottom: 16px;
  }
    
  .feature-flex .flex .right {
    width: 100%;
  }
  
  .feature-flex .flex .right h3 {
    font-size: 16px;
  }
    
  .feature-flex .flex .right .desc {
    font-size: 14px;
    margin-bottom: 24px;
  }
}

.series-flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.series-flex .box {
  width: calc(100% / 5 - ((16px * 4) / 5));
  text-decoration: none !important;
}

.series-flex .box .img-box {
  margin-bottom: 16px;
  position: relative;
}

.series-flex .box .img-box img:nth-child(1) {
  margin: 0 auto;
}

.series-flex .box .img-box img:nth-child(2) {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: .2s ease-in;
}

.series-flex .box:hover .img-box img:nth-child(2) {
  opacity: 1;
}

.series-flex .box .name {
  font-size: 18px;
  font-weight: bold;
  line-height: 24px;
  text-align: center;
}

@media screen and (max-width: 1000px) {  
  .series-flex .box {
    width: calc(100% / 5 - ((12px * 4) / 5));
  }
  
  .series-flex .box .img-box {
    margin-bottom: 8px;
  }
      
  .series-flex .box .name {
    font-size: 12px;
    line-height: 1.1;
  }  
}

@media screen and (max-width: 768px) {
  .series-flex {
    justify-content: start;
    gap: 24px 20px;
  }
  
  .series-flex .box {
    width: calc(100% / 2 - (20px / 2));
  }
  
  .series-flex .box .img-box {
    margin-bottom: 16px;
  }
  
  .series-flex .box:hover .img-box img:nth-child(2) {
    width: 162px;
  }
      
  .series-flex .box .name {
    font-size: 14px;
    line-height: 1.2;
  }  
}


/*最近チェックした項目
---------------------------------------------------------*/
.f_checkd{
display:none;}
#checkd{
margin-bottom:100px;}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#checkd{
margin-bottom:70px;}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {	
#checkd{
margin-bottom:15%;}
}



/*お知らせ
---------------------------------------------------------*/
#andeight .top_news{
	max-width:1050px;
	width:94%;
	padding:0 3%;
	margin:100px auto 0 auto;
	position: relative;
}
#andeight .top_news .abs_icon{
	position:absolute;
	left: 0;
	top: -45px;
  max-width:197px;
}
#andeight .top_news .top_news_box{
	max-width:1000px;
	margin: 0 auto;
}
#andeight .top_news .top_news_box dl{
	padding:30px 50px 30px 160px;
	background:#deeaef;
}
#andeight .top_news .top_news_box dt{
	font-weight:bold;
	font-size:120%;
	letter-spacing: 0.1em;
	color:#c75a24;
max-width: 100%;
    margin-bottom: 10px;
}
#andeight .top_news .top_news_box dd{
margin-left:0;}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#andeight .top_news{
	margin:70px auto 0 auto;
}
#andeight .top_news .abs_icon{
	top: -35px;
  max-width:140px;
}
#andeight .top_news .top_news_box dl{
	padding:30px 50px 30px 120px;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {	
#andeight .top_news{
	margin:10% auto 0 auto;
}
#andeight .top_news .abs_icon{
	top: -3.5em;
	width: 35%;
}
#andeight .top_news .top_news_box dt{
  width:100%;
}
#andeight .top_news .top_news_box dl{
	padding:10% 5% 5% 5%;
}
}