@charset "UTF-8";

/* -----絞り込み部分css----- */
#r-tvstand-frame input {
  display: none;
}

.tv-narrow-container {
  margin-bottom: 60px;
  width: 630px;
}

.tv-narrow-inner {
  width: 100%;
}

.tv-narrow_selectBlock {
  background-color: #f3f3f3;
  padding: 30px 85px;
  font-size: 14px;
  letter-spacing: 0.1rem;
  border-radius: 20px;
}

.tv-narrow-ttl {
  text-align: center;
}

.tv-narrow-ttl_main {
  font-size: 18px;
  color: #2b2b2b;
  margin-bottom: 15px;
  font-weight: 600;
  letter-spacing: 0.35rem;
  font-family: 'Noto Sans JP', sans-serif!important;
}

.tv-narrow_wrapper_wrapper {
  margin-bottom: 25px;
}

.tv_selectBlock_ttl {
  color: #2b2b2b;
  font-weight: 600;
  text-align: left;
  font-family: 'Noto Sans JP', sans-serif!important;
  font-size: 14px;
}

.tv_selectBlock_content {
  display: flex;
  flex-wrap: wrap;
  gap: 11px;
}

.tv_selectBlock_check label {
  cursor: pointer;
}

.tv_selectBlock_check label .el_checkbox {
  position: relative;
  top: 3px;
  width: 144px;
  height: 40px;
  line-height: 40px;
  display: block;
  border: 1px solid #ccc;
  background-color: #fff;
  text-align: center;
  font-family: 'Noto Sans JP', sans-serif!important;
  font-size: 14px;
}

.tv_selectBlock_check label .el_checkbox span {
  font-family: 'Noto Sans JP', sans-serif!important;
}

.tv_selectBlock_check input[type=checkbox]:checked+label .el_checkbox {
  background-color: #333;
  color: #fff;
}

/* チェックボックス--カラー */
.tv_selectBlock_content.tv-color_wrapper {
  gap: 25px;
}

.tv_selectBlock_check label .el_checkbox.tv-color {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: relative;
}

.tv_selectBlock_check input[type=checkbox]:checked+label .el_checkbox.tv-color::after {
  font-weight: 900;
  font-family: "Font Awesome 5 Free";
  content: '\f00c';
  color: #ff6f48;
  /* display: block; */
  opacity: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.tv_selectBlock_check label .el_checkbox.color-bl {
  background-color: #2b2b2b;
}

.tv_selectBlock_check input[type=checkbox]:checked+label .el_checkbox.color-bl {
  background-color: #2b2b2b;
}

.tv_selectBlock_check label .el_checkbox.color-wh {
  background-color: #fff;
}

.tv_selectBlock_check input[type=checkbox]:checked+label .el_checkbox.color-wh {
  background-color: #fff;
}

.tv_selectBlock_check label .el_checkbox.color-na {
  background-color: #ffe1ac;
}

.tv_selectBlock_check input[type=checkbox]:checked+label .el_checkbox.color-na {
  background-color: #ffe1ac;
}

.tv_selectBlock_check label .el_checkbox.color-lbr {
  background-color: #8b5224;
}

.tv_selectBlock_check input[type=checkbox]:checked+label .el_checkbox.color-lbr {
  background-color: #8b5224;
}

.tv_selectBlock_check label .el_checkbox.color-br {
  background-color: #4c3e32;
}

.tv_selectBlock_check input[type=checkbox]:checked+label .el_checkbox.color-br {
  background-color: #4c3e32;
}


/* チェックボックス--特長 */
.tv_selectBlock_content.tv-features_wrapper {
  gap: 8px 15px;
  justify-content: flex-start;
}

.tv_selectBlock_check .tv-features_label .el_checkbox.tv-features {
  border: none;
  background-color: transparent;
  padding: 0 0 0 20px;
  width: auto;
  height: auto;
  line-height: 2rem;
  font-size: 13px;
  font-family: 'Noto Sans JP', sans-serif!important;
}

/* チェックボックスの定義 */
.tv_selectBlock_check .tv-features_label .el_checkbox.tv-features::after {
  background-color: transparent;
  border: 1px solid #333;
  content: '';
  height: 13px;
  width: 13px;
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(0, 14%);
}

/* チェックボックスをクリック→チェックされるように */
.tv_selectBlock_check input[type=checkbox]:checked+label .el_checkbox.tv-features::after {
  border: 1px solid #333;
  font-weight: 900;
  font-family: "Font Awesome 5 Free";
  content: '\f00c';
  color: #ff6f48;
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(0, 14%);
  line-height: normal;
}

.tv_selectBlock_check input[type=checkbox]:checked+label .el_checkbox.tv-features {
  background-color: transparent;
  color: #333;
}

.tv-narrow-release {
  margin-top: 15px;
  font-size: 14px;
  cursor: pointer;
}

.el_searchResult {
  text-align: right;
  color: #2b2b2b;
  font-family: 'Noto Sans JP', sans-serif!important;
  font-size: 14px;
}

.tv_selectBlock_release {
  color: #2b2b2b;
  text-decoration: underline;
  letter-spacing: 0.1rem;
  text-align: right;
  font-family: 'Noto Sans JP', sans-serif!important;
  margin-top: 2px;
  font-size: 14px;
}

.el_searchResult_nume,
.el_searchResult_deno {
  font-family: 'Noto Sans JP', sans-serif!important;
  font-size: 14px;
}

.tv-narrow-attention {
  margin: 10px 0;
  font-size: 12px;
  text-align: left;
}

.tv-narrow-attention p {
  font-family: 'Noto Sans JP', sans-serif!important;
}


.js_target {
  display: none;
}


.bl_searchResultBlock {
  font-size: 14px;
}



/* -----絞り込み部分cssここまで----- */




/* -----表cssここから----- */
#r-tvstand-frame .tv-narrow-container .tv-narrow-inner .bl_searchResultBlock #tbody_wrapper .scroll_area table.table-scroll_area {
  border-collapse: collapse;
  font-size: 12px;
  table-layout: fixed;
}

#r-tvstand-frame .table-scroll_area th.img-blank {
  background-color: #fff;
  border: none;
  height: 172px;
  min-width: 140px;
  width: 140px;
}

.table-scroll_area tr span {
  font-size: 13px;
}

.table-scroll_area th {
  background-color: #f3f3f3;
  font-size: 13px;
}

.table-scroll_area th br {
  display: none;
}

.table-scroll_area th,
.table-scroll_area td {
  border: solid 1px #ccc;
  height: inherit!important;
}

.table-scroll_area td {
  width: 150px;
}

.table-scroll_area td:not(.product-img) {
  padding: 5px;
}


.bl_searchResultBlock {
  text-align: center;
}


/* スクロールバーの装飾＆ドラッグ操作 */
/* 位置変更 */
.scroll_area {
  position: relative;
  overflow-x: auto;
    white-space: nowrap;
  /* スクロールバーの位置調整のためにrelativeを設定 */
}

/* 横スクロールバーのトラック（背景）の位置を変更 */
.scroll_area .simplebar-track.simplebar-horizontal {
  top: 0;
  /* トップからの位置を0に */
  bottom: unset;
  /* bottomの設定を解除 */
  height: 9px;
  /* 必要に応じてスクロールバーの高さを調整 */
  background-color: #f3f3f3;
}

/* 横スクロールバーのハンドル（実際にドラッグする部分）を調整 */
.scroll_area .simplebar-track.simplebar-horizontal .simplebar-scrollbar {
  top: 0;
  bottom: unset;
  height: 9px;
  /* 必要に応じてスクロールバーの高さを調整 */
}

.simplebar-scrollbar::before {
  background-color: #fad339;
  border-radius: 0;
  opacity: 1 !important;
}

.simplebar-track.simplebar-vertical {
  display: none;
}


/* 横スクロール */
.scroll_area .simplebar-content-wrapper {
  cursor: grab;
}

.scroll_area .simplebar-content-wrapper.active {
  cursor: grabbing;
}


/* 0件表示の文言 */
.no_item {
  padding-top: 50px;
}


/* 表--縦書きと強調 */
.vertical-rl {
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  padding: 5px;
  letter-spacing: 0.3rem;
  font-size: 13px;
}

.rec-point {
  background-color: #fad339;
}

/* ここだけ改行適応 */
.molly-w,
.torius {
  white-space: normal;
}

.prod th,
.prod td {
  padding-top: 10px;
}

.b_close {
  text-align: right;
}

.b_close img {
  width: 25px;
}

.product-img {
  width: 151px;
  text-align: center;
  padding-bottom: 7px;
  border-top: none;
}

.prod_img {
  width: 150px;
}

.prod_img img {
  width: 135px;
}

/* シリーズ～価格 */
.series,
.type,
.model,
.price {
  padding: 7px;
}

.tr-model a {
  color: #ff6f48;
}

/* 型番--商品ページはこちら */
.tr-model a:hover {
  color: #ff6f48;
}

.tr-model .prod-page:hover {
  text-decoration: underline;
}

.prod-page {
  border: 1px solid #ff6f48;
  text-decoration: none;
  font-size: 12px;
  line-height: 2.5rem;
  margin-top: 5px;
}

/* 対応テレビ */
.handle-tv {
  padding: 0px;
}

/* サイズ */
.size {
  padding: 2px;
}

/* 収納 */
.storage {
  padding: 6px;
}

/* 機能 */
.function {
  padding: 2px;
}

/* 表の枠線削除 */
.table-scroll_area .border-left_none {
  border-left: none;
}

.border-top_bold {
  border-top: 3px solid #ccc;
}

i {
  display: block;
}

/* -----表cssここまで----- */

/* フォント変更 */
.tr-series th, .tr-series td,
.tr-type th, .tr-type td,
.tr-model th, .tr-model td, .tr-model td a p,
.tr-price th, .tr-price td,
.tr-handletv th, .tr-handletv td, .tr-handletv span,
.tr-standard th, .tr-standard td,
.tr-weight th, .tr-weight td,
.f4 th, .f4 td, .f4 span,
.f16 th, .f16 td,
.f5 th, .f5 td,
.f4 th, .f4 td {
  font-family: 'Noto Sans JP', sans-serif!important;
}



/* メディアクエリここから */
/* 画面サイズ600px */
@media screen and (max-width: 600px) {

  /* -----絞り込みここから----- */
  .tv-narrow-container {
    width: 96.5vw;
    margin: 0 auto;
  }
  
  .tv-narrow_selectBlock {
    padding: 4vw 3vw;
    font-size: 0.8rem;
    border-radius: 4vw;
  }
  
  .tv-narrow-ttl_main {
    font-size: 1.7rem;
    /* margin: 5vw 0 3vw 0; */
    margin: 2vw 0 3vw 0;
  }
  
  .tv-narrow_wrapper_wrapper {
    /* margin-bottom: 9vw; */
    margin-bottom: 5vw;
  }
  
  .tv_selectBlock_content {
    gap: 2vw;
  }

  .tv_selectBlock_ttl {
    font-size: 1.2rem;
    line-height: 1.5rem;
  }


  /* チェックボックス */
.tv_selectBlock_check label .el_checkbox {
  position: relative;
  width: 28vw;
  height: 10vw;
  line-height: 10vw;
  display: block;
  font-size: 1.3rem;
}


/* チェックボックス--カラー */
.tv_selectBlock_content.tv-color_wrapper {
  gap: 4vw;
  justify-content: center;
}

.tv_selectBlock_check label .el_checkbox.tv-color {
  width: 12vw;
  height: 12vw;
  border-radius: 50%;
  position: relative;
}


/* チェックボックス--特長 */
.tv_selectBlock_content.tv-features_wrapper {
  gap: 2vw 3vw;
  margin-top: 1vw;
}

.tv_selectBlock_check .tv-features_label .el_checkbox.tv-features {
  padding: 0 0 0 5vw;
  font-size: 1.3rem;
}

/* チェックボックスの定義 */
.tv_selectBlock_check .tv-features_label .el_checkbox.tv-features::after {
  height: 3.5vw;
  width: 3.5vw;
  position: absolute;
}

.tv-narrow-release {
  display: flex;
  justify-content: center;
  gap: 5vw;
  margin: 0 0 4vw 0;
  margin-right: 0;
  font-size: 1.3rem;
}

.el_searchResult {
  letter-spacing: 0.05rem;
  font-size: 1.3rem;
}

.tv_selectBlock_release {
  letter-spacing: 0.05rem;
  margin-top: 0;
}

.tv-narrow-attention {
  margin: 5vw 0 3vw 0;
  font-size: 0.7rem;
}


.js_target {
  display: none;
}


.bl_searchResultBlock {
  font-size: 14px;
}
/* -----絞り込み部分cssここまで----- */



/* -----表cssここから----- */
.table-scroll_area {
  font-size: 0.7rem;
}

.table-scroll_area th br {
  display: none;
}

#r-tvstand-frame .table-scroll_area th.img-blank {
  height: 45vw;
  min-width: 30vw;
  max-width: 30vw;
  width: 30vw;
}

.table-scroll_area tr span {
  font-size: 1.2rem;
}

.table-scroll_area td {
  width: 0;
}

.table-scroll_area td:not(.product-img) {
  padding: 1vw;
}


/* スクロールバーの装飾 */
/* 位置変更 */
.scroll_area {
  position: relative;
}
/* 横スクロールバーのトラック（背景）の位置を変更 */
.scroll_area .simplebar-track.simplebar-horizontal {
  height: 2vw;
}
/* 横スクロールバーのハンドル（実際にドラッグする部分）を調整 */
.scroll_area .simplebar-track.simplebar-horizontal .simplebar-scrollbar {
  height: 2vw;
}

/* 0件表示の文言 */
.no_item {
  padding-top: 15vw;
  font-size: 0.8rem;
}


/* 表--縦書きと強調 */
.vertical-rl {
  writing-mode: vertical-rl;
  padding: 1vw 4vw 0 1vw;
  letter-spacing: 0.3rem;
  font-size: 0.7rem;
  text-align: center;
}

.rec-point {
  background-color: #fad339;
}

/* 商品画像 */
/* 表--商品画像を固定　.prodを固定するスタイル */
.prod th,
.prod td {
  padding-top: 3vw;
}

.b_close {
  text-align: right;
}

.b_close img {
  width: 7vw;
}

.product-img {
  width: 40vw;
  padding-bottom: 1vw;
}

.prod_img {
  width: 40vw;
}

.prod_img img {
  width: 37vw;
}

/* シリーズ～価格 */
.series,
.type,
.model,
.price {
  /* padding: 3vw; */
  padding: 0;
}

/* 型番--商品ページはこちら */
.prod-page {
  font-size: 1.1rem;
  margin-top: 1vw;
  line-height: 2.2rem;
}

/* 対応テレビ～機能 */
.handle-tv,
.size,
.storage,
.function {
  padding: 1vw;
}

.border-top_bold {
  border-top: 1vw solid #ccc;
}
/* -----表cssここまで----- */
}