@media (max-width: 420px) {
.item {
   position: relative;
   height: 330px;
}
}
@media (max-width: 385px) {
.item {
   position: relative;
   height: 310px;
}
}
@media (max-width: 350px) {
.item {
   position: relative;
   height: 290px;
  font-size: 0.9em;
}
}


@media (max-width: 420px) {
.item2 {
   position: relative;
   height: 310px;
  margin-left: -2%;
  margin-right: -2%;
}
}
@media (max-width: 380px) {
.item2 {
   position: relative;
   height: 280px;
  font-size: 0.9em;
  margin-left: -2%;
  margin-right: -2%;
}
}
@media (max-width: 350px) {
.item2 {
   position: relative;
   height: 260px;
  font-size: 0.9em;
  margin-left: -4%;
  margin-right: -4%;
}
}






#information a:hover { text-decoration:underline;
　　　　　　　　　　　　overflow: scroll;
 　　　　　　　　　　　 height: 120px;
 }

#information { width: ;
               height: 250px;
               overflow: auto;
            background-image: url(https://img16.shop-pro.jp/PA01094/683/etc/116-03.jpg?cmsp_timestamp=2038022444);
               margin-top: 5px;
               padding-top: 10px;
               padding-left: 25px;
               padding-right: 25px; }


@media (max-width: 768px) {
  /* ~768px */
#information { padding-right: 15px;
               padding-left: 15px;
               margin-top: ; }
}

@media (max-width: 480px) {
  /* ~480px */
#information { padding-right: 10px;
               padding-left: 10px;
               padding-top: 5px;
               margin-top: 10px;
 }
}


.information { margin-bottom: -10px; }

@media (max-width: 768px) {
  /* ~768px */
.information { margin-bottom: 5px; }
}


@media (max-width: 480px) {
  /* ~480px */
.information { margin-bottom: -5px; }
}





#information a { color: ;
font-size: 1.1em; }


@media (max-width: 480px) {
  /* ~480px */
#information { font-size: 0.9em; }
}



#information h2 { color: #fff;
                  font-family: "FOT-筑紫A丸ゴシック Std L";}

@media ( max-width: 480px ) {
#information h2 { font-size: 1.2em; }
}






figure {
	position: relative;
	overflow: hidden;
        margin: 0;
        padding: 0;
}

figcaption {
	position: absolute;
	top: -108%;
	left: -100%;
	z-index: 2;
	width: 100%;
	height:100%;
        overflow: auto;
	background: #58653b;
	-webkit-transition: .3s;
	transition: .3s;
	opacity: 0.7;
        color: #ffffff;
        padding: 6px;
}

figure:hover figcaption {
	top: 0;
	left: 0;
}

#fig-cap p 
{
padding-right: 15px;
padding-left: 10px;
}


@media ( max-width: 980px ) {
#fig-cap p { padding-right: 10px;
             padding-left: 5px; }
}


@media ( max-width: 768px ) {
#fig-cap p { padding-right: 10px;
             padding-left: 5px; }
}



@media ( max-width: 480px ) {
#fig-cap p { padding-top: 0px;
             padding-right: 5px;
             padding-bottom: 5px;
             padding-left: 5px;             
             font-size: 0.8em; }
}





@media ( max-width: 768px ) {
#fig-cap h3 { margin-top: -2px; 
              margin-bottom: ; }
}



@media ( max-width: 480px ) {
#fig-cap h3 { margin-top: -5px; 
              font-size: 0.9em; }
}




@media (min-width: 1129px)
{
figcaption { width: 100%; }
}



@media (min-width: 980px)
{
  #top-contents { 
             max-width: 1008px;
             margin-left: -10px;
             margin-right: -10px;
             padding: 0;
         }
}


@media (max-width: 980px) {
  /* ~980px */
 #top-contents { 
            max-width: 980px;
            margin-left: -8px;
            margin-right: -8px;
            padding: 0;
          }
}


@media (max-width: 768px) {
  /* ~768px */
 #top-contents { 
            margin-left: 0px;
            margin-right: -5px;
            padding- 0;
          }

  
}



@media (max-width: 480px) {
  /* ~480px */
 #top-contents { margin-left: 0px;
            margin-right: -3px;
            padding: 0;
          }
}





#recommends { margin-top: 100px; }

@media (max-width: 480px) {
  /* ~480px */
  #recommends { margin-top: 60px; }
}








#shurui-wrap {margin-bottom: 200px;}




.shurui {
height: 670px ;
}


@media ( max-width: 768px ) {
.shurui { height: 715px;}
}



@media ( max-width: 480px ) {
.shurui { max-width: 300px;
          width: 80%;
          margin-left: 10%;
          margin-right: 10%;
          height: 660px;
          }
}




.shurui p 
{
background-image: url(https://img16.shop-pro.jp/PA01094/683/etc/p_048%A5%C6%A5%B9%A5%C8.gif?20140701013220);
padding: 10px;
}


@media (max-width: 480px) {
.shurui p {max-width: 300px;
           font-size: 1em;
           padding: 8px;}
}







@media ( max-width: 768px ) {
.shurui-s { margin-bottom: -180px;}
}

@media ( max-width: 768px ) {
.shurui-s2 { margin-bottom: -70px;}
}

@media ( max-width: 768px ) {
.shurui-s3 { margin-bottom: -10px;}
}



@media ( max-width: 480px ) {
.shurui-s { margin-bottom: -140px;}
}

@media ( max-width: 480px ) {
.shurui-s2 { margin-bottom: -50px;}
}

@media ( max-width: 480px ) {
.shurui-xs-pilea { margin-bottom: -110px;}
}

@media ( max-width: 480px ) {
.shurui-xs-pepe { margin-bottom: 85px;}
}

@media ( max-width: 480px ) {
.shurui-xs-po { margin-bottom: 40px;}
}




@media ( max-width: 480px ) {
.shurui-xs-france { margin-bottom: -150px; }
}

@media ( max-width: 480px ) {
.shurui-xs-alte { margin-bottom: -100px; }
}



.category-frame 
{
max-width: 200px;
}








#top-span { text-align: right;
            margin-top: 60px;
            margin-bottom: 70px;
            padding-right: 40px; }

@media ( max-width: 500px ) {
#top-span { text-align: left;
            margin-bottom: 40px;
            padding-left: 10px;
            padding-right: 10px; }
}



@media ( max-width: 500px ) {
.hidden-br { display: none; }
}


.item { background-color: #fff;
        padding-top: 10px; }



.size-menu { font-size: 1.4em; }




.deco-rightunder img { width: 60%;
                   padding-top: 40%; 
                   padding-right: 17.5%;
                   padding-left: 22.5%;}

@media ( max-width: 480px ) {
.deco-rightunder img { width: 75%; 
                       padding-top: 30%;
                       padding-right: 10%; 
                       padding-left: 15%; }
}




a.mukou:hover { opacity: 1.0; }



#puranae p 
{
  padding-top : 0px;
  padding-right : 25px;
  padding-bottom : 0px;
  padding-left : 25px;
}





.product-list__fav-items {
  margin-top: -6px;
  width: 30px;
  float: right;
}

.product-list__fav-items button {
  display: block;
  width: 100%;
  padding: 5px 0;
  cursor: pointer;
  transition: .2s;
  text-align: center;
  color: #999;
  border: 0;
  outline: none;
  background: transparent;
}

.product-list__fav-items .fav-items {
  color: #ff7373;
}

.product-list__fav-items svg {
  width: 20px;
  height: 20px;
  fill: currentColor;
}






.tooltip2{
    position: relative;
    cursor: pointer;
    display: inline-block;
}
.tooltip2 img{
    margin:0;
    padding:0;
}
.description2 {
    display: none;
    position: absolute;
  margin-left: -50px;
    padding: 5px;
    font-size: 0.9em;

    color: #fff;
    border-radius: 5px;
    background: #bebcac;
    width: 120px;
    opacity: 0.9;
}
.description2:before {
    content: "";
    position: absolute;
    top: 0%;
    right: 95%;
    border: 15px solid transparent;
    border-top: 15px solid #bebcac;
    margin-left: -15px;
    transform: rotateZ(90deg);
}
.tooltip2:hover .description2{
    display: inline-block;
    top: 0px;
    left: 85px;
}


@media ( max-width: 768px ) {
  
  .tooltip2{
    position: relative;
    cursor: pointer;
    display: inline-block;
}
.tooltip2 img{
    margin:0;
    padding:0;
}
.description2 {
    display: none;
    position: absolute;
  margin-left:0px;
    padding: 5px;
    font-size: 0.9em;
    line-height: 1.6em;
    color: #fff;
    border-radius: 5px;
    background: #bebcac;
    width: 100px;
}
.description2:before {
    content: "";
    position: absolute;
    top: 0px;
    left: 120px;
    border: 15px solid transparent;
    border-top: 15px solid #bebcac;
    margin-left: -22px;
    transform: rotateZ(270deg);
}
.tooltip2:hover .description2{
    display: inline-block;
    top: 0px;
    left: -108px;
}
}



/*追加 2023.03.06*/

.splide { 
  margin-left: -30px;
  margin-right: -30px;
}


.splide__pagination { visibility: hidden; }

.splide__arrow { visibility: hidden; }

.splide-moji-delay { 
  margin-top: -20%; 
  margin-bottom: 15%; 
  margin-left: 2%; 
  font-size: 2.2em; 
  font-family: FOT-ぶどう Std L;
  color: #fff;
  animation: fadeIn 3s ease-in-out 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;
}




.splide-moji-white { 
  margin-top: -20%; 
  margin-bottom: 15%; 
  margin-left: 2%; 
  font-size: 2.2em; 
  font-family: FOT-ぶどう Std L;
  color: #fff;
}

.splide-moji { 
  margin-top: -20%; 
  margin-bottom: 15%; 
  margin-left: 2%; 
  font-size: 2.2em; 
  font-family: FOT-ぶどう Std L;
  color: #4d4d4d;
}
 
.splide-moji2 { 
  margin-top: -21%; 
  margin-bottom: 15%; 
  margin-left: 2%; 
  font-size: 2.2em; 
  font-family: FOT-ぶどう Std L;
  color: #4d4d4d;
}



/* じわっと画像が表示される ---------　一度追加していたら不要*/
@keyframes fadeIn { /*上のbody内で呼び出しているアニメーションと名前をそろえる*/
    0% {opacity: 0} /* 始め */
    100% {opacity: 1} /* 終わり */
}
 
/*古いブラウザ用　---------　一度追加していたら不要*/
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

.splide__track { 
 
}

@media ( max-width: 768px ) {
 .splide__track {
   margin-right: -0.2%; 
  }

  .splide-moji-delay { 
  margin-top: -22%; 
  margin-bottom: 15%; 
  margin-left: 2%; 
  font-size: 1em; 
  font-family: FOT-ぶどう Std L;
  color: #fff;
  animation: fadeIn 3s ease-in-out 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;
}
  

  
  
  
    .splide-moji-white { 
  margin-top: -22%; 
  margin-bottom: 15%; 
  margin-left: 2%; 
  font-size: 1em; 
  font-family: FOT-ぶどう Std L;
  color: #fff;
}

.splide-moji { 
  margin-top: -22%; 
  margin-bottom: 15%; 
  margin-left: 2%; 
  font-size: 1em; 
  font-family: FOT-ぶどう Std L;
  color: #444;
}
  
  
  
  /* じわっと画像が表示される ---------　一度追加していたら不要*/
@keyframes fadeIn { /*上のbody内で呼び出しているアニメーションと名前をそろえる*/
    0% {opacity: 0} /* 始め */
    100% {opacity: 1} /* 終わり */
}
 
/*古いブラウザ用　---------　一度追加していたら不要*/
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
  
  
}
  


  @media ( max-width: 768px ) {
    #top-span {
      font-size: 0.8em; 
      padding: 6%;
      margin-top: -2%;
      margin-bottom: -1%;
    }
  }
  
  
  .go-to-menu { text-align: right; } 