body {
  font-family: "Noto Sans JP", sans-serif;
  line-height: 1.5;
  color: var(--base);
  word-break: break-all;
}

a,
button,
.anime-opacity {
  transition: 0.3s;
  cursor: pointer;
}

a:hover,
button:hover,
.anime-opacity:hover {
  opacity: 0.7;
  cursor: pointer;
  transition: 0.3s;
}

/* finder-checkbox */
input[type="checkbox"] {
  position: absolute;
  white-space: nowrap;
  border: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  overflow: hidden;
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
}

.finder-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.finder-checkbox-checked {
  display: inline-block;
  padding-left: 26px;
  font-size: 14px;
}

.finder-parts-filter-area .finder-checkbox-checked {
  padding-left: 0;
  width: 20px;
}

.finder-checkbox-checked::before,
.finder-checkbox-checked::after {
  content: "";
  position: absolute;
  box-sizing: border-box;
  transition: .2s;
}

.finder-checkbox-checked::before {
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  border: 1px solid var(--gray);
  border-radius: 4px;
}

.finder-parts-result-filler-detail-checkbox .finder-checkbox-checked::before {
  top: 3px;
}

.finder-parts-result-filler-detail-checkbox .finder-checkbox-checked::after {
  top: 8.5px;
}

.finder-checkbox-checked::after {
  opacity: 0;
  top: 6.5px;
  left: 4px;
  height: 9px;
  width: 12px;
  background-image: url(../../uploads/img/asset/common/icon_check.svg);
  background-size: contain;
  background-repeat: no-repeat;
}

input[type="checkbox"]:checked {
  width: 20px;
}

input[type="checkbox"]:checked + .finder-checkbox-checked::before {
  background-color: var(--base);
  border: 1px solid var(--base);
  transition: .2s;
}

input[type="checkbox"]:checked + .finder-checkbox-checked::after {
  opacity: 1;
  transition: .2s;
}

.finder-checkbox-text {
  flex-shrink: 0;
}

.finder-checkbox-num {
  display: inline-block;
  position: relative;
  z-index: 100000;
  pointer-events: none;
}

.finder-checkbox label {
  position: relative;
  cursor: pointer;
}

.finder-checkbox label::after {
  position: absolute;
  display: block;
  right: 0;
  bottom: 0;
  width: 20px;
  height: 20px;
  background-color: var(--red);
}

/* finder-inner */
.finder-inner {
  margin: 0 auto;
  padding: 0 30px;
  box-sizing: content-box;
  max-width: 1200px;
}

@media screen and (max-width: 841px) {
  .finder-inner {
    padding: 0 15px;
  }
}

/* finder-none */
.finder-none-pc {
  display: none;
}

@media screen and (max-width: 841px) {
  .finder-none-pc {
    display: block;
  }
}

@media screen and (max-width: 841px) {
  .finder-none-sp {
    display: none;
  }
}