@charset "utf-8";

#warm-interior .allBg {
  background: linear-gradient(180deg, #ffc197, #f9a26e)
}

#warm-interior .bx-main {
  z-index: 1;
  position: relative
}

#warm-interior .mainCorner .itemBtn:hover {
  opacity: .75
}

#warm-interior .warmCategory .cateList li:hover {
  background-color: #f5ebcc
}

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

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

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

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

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

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

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

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

#warm-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
}

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

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

#warm-interior .itemBtn2 a:hover:after {
  right: 5%
}

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

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

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

#warm-interior .warmCategory .cateList li {
  min-height: 82px
}

#warm-interior .warmCategory .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
}

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

.floatMenu {
  position: fixed;
  right: 7%;
  bottom: 0;
  z-index: 10
}

.floatMenu .title {
  color: #ff5600
}

.floatMenu li {
  text-align: center
}

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

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

#warm-interior .town {
  bottom: 0;
  z-index: -1
}

#warm-interior .snow {
  color: #ededed;
  font-size: 10px;
  position: fixed;
  top: -5%;
  text-shadow: 5vw -100px 2px, 10vw -400px 3px, 20vw -500px 4px, 30vw -580px 1px, 39vw -250px 2px, 42vw -340px 5px, 56vw -150px 2px, 63vw -180px 0, 78vw -220px 4px, 86vw -320px 9px, 94vw -170px 7px;
  animation: roll 5s linear infinite;
  z-index: 2
}

#warm-interior .snow2nd {
  animation: anim 8s linear infinite
}

@keyframes roll {
  0% {
    transform: rotate(0deg)
  }

  90% {
    opacity: 1
  }

  100% {
    transform: rotate(20deg);
    top: 100%;
    opacity: 0
  }
}

@keyframes anim {
  100% {
    color: transparent;
    top: 150%
  }
}

#warm-interior #navi1,
#warm-interior #navi2,
#warm-interior #navi3,
#warm-interior #navi4,
#warm-interior #navi5,
#warm-interior #navi6,
#warm-interior #navi7 {
  padding-top: 190px;
  margin-top: -190px
}

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

.tableArea_3 {
  max-width: 85%;
  margin: 0 auto;
  margin-top: 3rem;
  margin-bottom: 3rem;
  width: 660px;
  overflow: auto
}

.tableArea_4 {
  max-width: 85%;
  margin: 0 auto;
  margin-top: 3rem;
  margin-bottom: 3rem;
  width: 880px;
  overflow: auto
}

.tableArea_3 table {
  width: 660px;
  border-collapse: collapse
}

.tableArea_4 table {
  width: 880px;
  border-collapse: collapse
}

.tableArea_3 table td,
.tableArea_4 table td {
  width: 220px !important;
  padding: 5px;
  font-size: 14px
}

.tableArea_3 table td:nth-child(1),
.tableArea_4 table td:nth-child(1) {
  background-color: #d8aa80
}

.tableArea_3 table td:nth-child(2),
.tableArea_4 table td:nth-child(2) {
  background-color: #e3bea0
}

.tableArea_3 table td:nth-child(3),
.tableArea_4 table td:nth-child(3) {
  background-color: #e8cad2
}

.tableArea_4 table td:nth-child(4) {
  background-color: #efdaca
}

.tableArea_3 table .itemName,
.tableArea_4 table .itemName {
  background: linear-gradient(transparent 40%, #f3d6b8 58%)
}

.scroll-hint-text {
  margin-top: 0
}

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

#warm-interior .bellunya {
  position: relative;
}

#warm-interior .bellunya img {
  width: 150px;
  height: auto;
  position: absolute;
  top: -200px;
  right: 90px;
}

@media screen and (max-width:520px) {
  #warm-interior .navi .navBg {
    height: 80px !important;
  }

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

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

  #warm-interior .itemList {
    padding-top: 3rem
  }

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

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

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

  #warm-interior .warmCategory .cateList li a:after {
    top: 42%;
    right: 8%
  }

  #warm-interior .itemBtn2 a:after {
    width: 6px;
    height: 6px;
    top: 30%
  }

  .floatMenu {
    position: sticky;
    right: 0;
    width: 100%;
    bottom: initial
  }

  .floatMenu .title {
    display: none
  }

  .floatMenu ul {
    display: flex;
    justify-content: space-between;
    background: #ff5600;
    padding: 2vw
  }

  .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
  }

  #warm-interior .town img {
    width: 150%
  }

  .tableArea_3 table {
    width: 600px
  }

  .tableArea_4 table {
    width: 800px
  }

  .tableArea_3 table td,
  .tableArea_4 table td {
    font-size: 12px;
    width: 200px !important
  }

  #warm-interior .bellunya img {
    top: -23px;
    right: 213px;
  }
}