@charset "utf-8";

#cool-interior .cornerWrap .feature ul li:hover,
#cool-interior .mainCorner .itemBtn:hover {
  opacity: .75
}

#cool-interior .category .cateList li:hover {
  background-color: #ebfaff
}

#cool-interior .navi li:hover::after {
  bottom: 7%
}

.kanren {
  align-items: flex-end
}

.kanren ul {
  width: 60% !important
}

.table_box {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

th,
td {
  vertical-align: middle;
  padding: 15px;
  border: 1px solid #727272;
  color: #000000;
  font-size: 14px;
  text-align: center;
  white-space: nowrap
}

th {
  background: #000
}

td {
  background: #fff
}

.contentsWrap .function1 {
  border: solid 4px #1A237E
}

.sticky {
  position: sticky;
  top: 0;
  left: 0;
  background: none;
  border-left: none;
  border-right: none
}

.sticky::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  background: #EBF3FE;
  z-index: -1
}

#cool-interior .coolBrand {
  background: #ededed
}

#cool-interior .coolBrand .summary p {
  color: #6094c3
}

#cool-interior .itemList {
  background: linear-gradient(180deg, #a5dce9, #6094c3)
}

#cool-interior .engText {
  font-family: 'Amatic SC', cursive
}

#cool-interior .engText span {
  border-top: 1px solid #fff;
  padding-top: 6px;
  font-size: 24px
}

#cool-interior .mainCorner {
  box-shadow: 1px 1px 5px rgb(90 90 90 / 30%)
}

@keyframes graphAnim03 {
  0% {
    clip-path: polygon(50% 50%, 50% 50%, 50% 50%)
  }

  100% {
    clip-path: polygon(0, 0, 0)
  }
}

#cool-interior table td {
  border: 1px solid #727272
}

#cool-interior .itemname {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal
}

#cool-interior .price2:after {
  content: '（税込）';
  font-size: 10px
}

#cool-interior .itemList4Wrap {
  width: 48%;
  box-shadow: 1px 1px 5px rgb(90 90 90 / 30%)
}

#cool-interior .boxlink_sold .itemSpec1,
#cool-interior .boxlink_sold .itemSpec4,
#cool-interior .boxlink_sold li:nth-of-type(2) {
  display: none
}

#cool-interior a.bx-top-btn-motto-miru {
  background-color: #fff
}

#cool-interior .itemBtn a {
  color: #fff !important;
  text-decoration: none
}

#cool-interior .itemBtn:after {
  content: '';
  width: 8px;
  height: 8px;
  border-top: solid 1px #fff;
  border-right: solid 1px #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 40%;
  right: 8%;
  transition: .2s
}

#cool-interior .itemBtn:hover:after {
  right: 5%
}

#cool-interior .itemList .saleprice {
  margin-top: 3px;
  display: block;
  color: #fb0000
}

#cool-interior .boxlink_sold .itemBtn {
  display: none
}

#cool-interior .itemList .price_down {
  color: #fb0000;
  padding: 2px 4px;
  display: block;
  font-size: 12px
}

#cool-interior .category .cateList li {
  min-height: 82px
}

#cool-interior .category .cateList li a:after {
  content: '';
  width: 8px;
  height: 8px;
  border-top: solid 1px #333;
  border-right: solid 1px #333;
  transform: rotate(45deg);
  position: absolute;
  top: 45%;
  right: 8%;
  transition: .2s
}

#cool-interior .floatMenu {
  position: fixed;
  right: 7%;
  bottom: 0;
  z-index: 10;
  padding-top: 3%
}

#cool-interior .floatMenu .title {
  color: #232e6b
}

#cool-interior .floatMenu li {
  text-align: center
}

#cool-interior .floatMenu li.menu {
  background: url(../img/260421/navi.webp?$staticlink$) no-repeat center;
  background-size: contain;
  font-size: 13px;
  font-weight: normal;
  width: 100px;
  height: 100px
}

#cool-interior .floatMenu ul li a {
  display: flex;
  height: 100%;
  align-items: center;
  text-decoration: none
}

#cool-interior .itemList .medal1 {
  top: 25.5%;
  left: 10%;
  z-index: 1
}

#cool-interior .itemList .medal2 {
  top: 27.5%;
  left: 5%;
  z-index: 1
}

#cool-interior .itemList .medal3 {
  top: 62%;
  left: 5%;
  z-index: 1
}

#cool-interior .itemList .medal4 {
  top: 34.8%;
  left: 8%;
  z-index: 1
}

#cool-interior .itemList .medal5 {
  top: 79%;
  left: 8%;
  z-index: 1
}

#cool-interior .itemList .medal6 {
  top: 89.4%;
  left: 8%;
  z-index: 1
}

#cool-interior .reviewEmphasis {
  background-color: #fffbc2
}

#cool-interior .reviewEmphasis::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 10%;
  z-index: -1;
  width: 20px;
  height: 15px;
  transform: translateX(-50%);
  box-sizing: border-box;
  background-color: #fffbc2;
  clip-path: polygon(0 0, 100% 0, -10% 120%)
}

/* 追記したやーつ↓↓ */
#cool-interior .fvText {
  letter-spacing: 2px;
  line-height: 1.8;
  text-align: center;
  margin-bottom: 0px;
  font-size: 14px;
}

#cool-interior .navi li {
  width: 16%;
}

/* ぽよ↓↓ */
#cool-interior .navi li:hover,
#cool-interior .floatMenu li.menu:hover {
  animation: boyoyon 0.5s ease;
  /* 0.5秒かけて1回実行 */
}

@keyframes boyoyon {
  0% {
    transform: scale(1.0, 1.0);
  }

  30% {
    transform: scale(1.1, 0.9);
  }

  /* 横に少し潰れる */
  50% {
    transform: scale(0.9, 1.1);
  }

  /* 縦に少し伸びる */
  70% {
    transform: scale(1.05, 0.95);
  }

  /* 微調整 */
  100% {
    transform: scale(1.0, 1.0);
  }

  /* 元に戻る */
}

/* ぽよ↑↑ */

#cool-interior .navi li span {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #232e6b;
}

#cool-interior .floatMenu ul li span {
  color: #232e6b;
}

/* 追記したやーつ↑↑ */

@media screen and (max-width:520px) {
  #cool-interior .fvText {
    position: absolute;
    top: 5%;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    margin: 0;
    text-align: center;
  }

  #cool-interior .mainCorner {
    padding: 2%;
    width: 92%
  }

  #cool-interior .mainCorner:nth-child(4) {
    padding: 2%;
    width: 92%;
    margin-top: 5%
  }

  #cool-interior .midashi {
    width: 20%
  }

  #cool-interior h2 {
    padding-top: 50px;
    margin-top: -50px
  }

  #cool-interior .floatMenu {
    position: sticky;
    right: 0;
    width: 100%;
    bottom: initial;
    padding-top: 0
  }

  #cool-interior .floatMenu .title {
    display: none
  }

  #cool-interior .floatMenu ul {
    display: flex;
    justify-content: space-between;
    background: #3a77ff;
    padding: 2vw
  }

  #cool-interior .floatMenu li.menu {
    height: auto;
    width: auto;
    padding: 1vw 2vw;
    color: #ff5600;
    background: unset;
    overflow: unset;
    text-indent: unset;
    white-space: unset;
    text-align: center;
    webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    background: rgba(255, 241, 222, .2);
    width: 23%;
    line-height: 1.5;
    font-size: 11px
  }

  #cool-interior .itemList .Pointing1 {
    top: 25%;
    left: 1%;
    z-index: 1
  }

  #cool-interior .itemList .Pointing2 {
    top: 15%;
    left: -7%;
    z-index: 1
  }

  #cool-interior .itemList .Pointing3 {
    bottom: 23%;
    left: -7%;
    z-index: 1
  }

  #cool-interior .itemList .Pointing4 {
    top: 33.1%;
    left: 1%;
    z-index: 1
  }

  #cool-interior .itemList .Pointing5 {
    top: 75.5%;
    left: 1%;
    z-index: 1
  }

  #cool-interior .itemList .Pointing6 {
    top: 87.7%;
    left: 1%;
    z-index: 1
  }

  .table_box {
    width: 94%
  }

  th,
  td {
    vertical-align: middle;
    padding: 10px 10px;
    border: 1px solid #727272;
    color: #000000;
    font-size: 14px;
    text-align: center;
    white-space: nowrap
  }

  .sticky {
    font-size: 10px
  }

  #cool-interior .kanren ul {
    margin: auto;
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none
  }

  #cool-interior .kanren ul li {
    width: 130px;
    flex-shrink: 0
  }

  #cool-interior .kanren ul::-webkit-scrollbar {
    height: 12px
  }

  #cool-interior .kanren ul::-webkit-scrollbar-thumb {
    background: #aaa;
    border-radius: 6px
  }

  #cool-interior .kanren ul::-webkit-scrollbar-track {
    background: #ddd;
    border-radius: 6px
  }

  #cool-interior .itemBtn:after {
    top: 40%;
    right: 30px
  }

  #cool-interior .itemList {
    padding-top: 4.5rem
  }

  #cool-interior .itemList .itemList4 .itemList4Wrap {
    width: 48%
  }

  #cool-interior .itemList .salepricebox {
    margin-top: 3px;
    display: block;
    color: #fb0000
  }

  #cool-interior .price_down {
    color: #fb0000;
    padding: 3px 5px;
    display: block;
    font-size: 12px
  }

  #cool-interior .category .cateList li a:after {
    top: 46%;
    right: 8%
  }

  #cool-interior .itemList .detail_1:nth-child(1) ul li:nth-child(1) .itemSpec4 div:nth-child(1),
  #cool-interior .itemList .detail_1:nth-child(1) ul li:nth-child(2) .itemSpec4 div:nth-child(1),
  #cool-interior .itemList .detail_1:nth-child(1) ul li:nth-child(3) .itemSpec4 div:nth-child(1),
  #cool-interior .itemList .detail_1:nth-child(1) ul li:nth-child(4) .itemSpec4 div:nth-child(1) {
    column-gap: .5rem
  }

  /* 追記したやーつ↓↓ */
  #cool-interior .navi .navBg {
    height: 80px !important;
  }

  #cool-interior .fvNavi nav {
    position: absolute;
    top: 40%;
  }

  #cool-interior .floatMenu ul li span {
    color: #fff;
  }

  #cool-interior .cornerWrap {
    margin-top: 8rem;
  }

  /* 追記したやーつ↑↑ */

}