@charset "utf-8";
/* CSS Document */
#wrap:not(:has(.product__list--item)) {
  .navi-list .tour_nav, #tourWrap {
    display: none;
  }
  #fitWrap {
    padding-top: min(10vw, 80px);
  }
}
#introWrap .logo {
  display: block;
  height: min((66vw / 7.5), 33px);
  aspect-ratio: 557 / 66;
  object-fit: contain;
  margin: min((40vw / 7.5), 25px) auto 0;
}
/* recommnedArea */
@media (min-width:751px) {
#recArea h3 {
  text-align: center;
  font-size: 28px;
  color: #333;
  margin: 0 0 25px;
}
#recArea h3 span {
  border-bottom: 6px solid #0064b1;
}
#recArea {
  width: 960px;
  overflow: hidden;
  margin: 35px auto 0;
  padding-bottom: 50px;
}
#recArea ul {
  width: 100%;
  padding: 0 50px;
  box-sizing: border-box;
}
#recArea li img {
  width: 100%;
}
#recArea li img:hover {
  opacity: 0.8;
}
#recArea li {
  width: 20%;
  float: left;
  padding: 0 1%;
  box-sizing: border-box;
}}
@media (max-width:750px) {
#recArea {
  background: #FFF;
}
#recArea h3 span::before {
  /*  content: "\ea10";*/
  content: "\f046";
  font-family: FontAwesome;
  padding: 0 8px 0 0;
  color: #333;
}
.recommendArea-wrap {
  overflow-x: scroll;
}
#recArea ul {
  width: 160vw;
  display: flex;
  padding: 1% 2%;
}
#recArea li {
  width: calc(100% / 5);
  display: block;
  padding: 0 0.7%;
}
#recArea li img {
  width: 100%;
}
#recArea li a:hover {
  opacity: 0.7;
}
    #footerAreaSP {
  width: 100%;
  padding: 0;
  margin-top: 7%;
}
#footerAreaSP h3 {
  font-size: 4vw;
  font-weight: bold;
  margin: 3% 0;
  padding: 2.5% 4%;
  background-color: #E4E4E4;
}
}
/*#reco-banner {
  padding: min((40vw / 7.5), 30px) 0 min((60vw / 7.5), 50px);
}
.reco-banner__list {
  width: var(--size, min((524vw / 7.5), 420px));
  margin: auto;
  display: grid;
  grid-template-columns: var(--column, repeat(2, 1fr));
  gap: min((22vw / 7.5), 30px);
  @media (width > 860px) {
    & {
      --size: min(95%, 992px);
      --column: repeat(4, 1fr);
    }
  }
}*/
.reco-banner__link {
  display: block;
  border: var(--border-color, transparent) min((4vw / 7.5), 4px) solid;
}
/*------------------------------------------------*/
/*★ ＝＝ hover ＝＝ ★*/
@media (hover : hover) and (pointer : fine) {
  .reco-banner__link {
    /*transition: border var(--default-hover-speed);*/
    &:hover {
      --border-color: #fc930a;
    }
  }
}