@charset "UTF-8";

/*========================================================
このcssは下記ページにリンクさせています
・https://www.tenpos.com/c/table1
・https://www.tenpos.com/c/table1/sofa-stool-all
・https://www.tenpos.com/c/table1/chair-all-h
・https://www.tenpos.com/c/table1/chinese-style-table-h
・https://www.tenpos.com/c/table1/outdoor-furniture
・https://www.tenpos.com/c/table1/host-cabaret-club-chair
・https://www.tenpos.com/c/table1/japanese-food
・https://www.tenpos.com/c/table1/cafe-coffee
・https://www.tenpos.com/c/table1/ramen-chair
・https://www.tenpos.com/c/interior-furniture
========================================================*/

/* ------------------------------------------
color
------------------------------------------ */

:root {
  --bs-wt: #fff;
  --bs-bk: #000;
  --bs-light_gray: #ccc;
  --bs-dark_gray: #3c3c3c;
  --bs-arrow_red: #d13719;

  /* --bs-◆: #000; */
  /* --bs-◆: #000; */
  /* --bs-◆: #000; */
  /* --bs-◆: #000; */
  /* --bs-◆: #000; */
}


/*========================================================
2026.07 change　arrowを「＞」から「赤丸に▼」へ変更
========================================================*/

/* 業種別で探す 部分　------------------------------------ */
#table1 #search_item .list_industry li {
  border: 1px solid var(--bs-light_gray);
  border-radius: 7px;
}
#table1 #search_item .list_industry li img {
  border-radius: 6px 6px 0 0;
  border-bottom: none;
}
#table1 #search_item .list_industry li p {
  width: 100%;
  margin: 0px 0 0;
  padding: 5px 0 5px 5px;
  /* border-radius: 0 0 6px 6px ; */
  border: none;
  /* transform: translateY(-1px); */
  position: relative;
  width: calc(100% - 12px);
}
@media only screen and (max-width:768px) {
  /* #table1 #search_item .list_industry li p {
    width: 100%;
  } */
}

#table1 #search_item .list_industry li p:before {
  position: absolute;
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--bs-arrow_red);
  margin-left: 2px;
  top: 50%;
  right: -5px;
  transform: translateY(-50%);
}
#table1 #search_item .list_industry li p:after {
  content: "";
  /* ↑ 元の設定 ＞ の上書き */
  position: absolute;
  /* 業種別ボタンの下向き矢印に大きさを合わせた時　ここから ----- */
  /* width: 0;
  height: 0;
  border-left: 7px solid #fff;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  top: 12px;
  right: 12px; */
  /* 業種別ボタンの下向き矢印に大きさを合わせた時　ここまで ----- */
  /* 左側サイドナビ 右向き矢印に大きさを合わせた時　ここから ----- */
  box-sizing: border-box;
  width: 5px;
  height: 5px;
  border: 3px solid transparent;
  border-left: 4px solid var(--bs-wt);
  top: 50%;
  right: -4px;
  transform: translateY(-50%);
  /* 左側サイドナビ 右向き矢印に大きさを合わせた時　ここまで ----- */
}


/* 種類別で探す・メーカー別で探す 部分　------------------------------------ */
#table1 #search_item .list_kind li img,
#table1 #search_item .list_maker li img {
  border-radius: 6px 6px 0 0;
  border: none;
}
#table1 #search_item .list_kind li p,
#table1 #search_item .list_maker li p {
  margin: 0px 0 0;
  padding: 5px 0 5px 5px;
  border: none;
  position: relative;
  width: calc(100% - 12px);
  display: flex;
  align-items: center;
}


#table1 #search_item .list_maker li p {
  /* width: 101%; */
  margin: 0px 0 0;
  padding: 5px 0 5px 5px;
}
/* 2026.07.23 add */
#table1 #search_item .list_kind li,
#table1 #search_item .list_scene li {
  border-radius: 6px ;
  border: 1px solid var(--bs-light_gray);
}

#table1 #search_item .list_maker li {
  border-radius: 6px ;
  border: 1px solid var(--bs-light_gray);
}

.list_maker li div{
  text-align: center;
}
/* 2026.07.23 add end */


#table1 #search_item .list_kind li p:before,
#table1 #search_item .list_maker li p:before {
  content: "";
  /* ↑ 元の設定 ＞ の上書き */
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--bs-arrow_red);
  margin-left: 2px;
  top: 50%;
  right: -5px;
  transform: translateY(-50%);
}

#table1 #search_item .list_kind li p:after,
#table1 #search_item .list_maker li p:after {
  content: "";
  /* ↑ 元の設定 ＞ の上書き */
  position: absolute;
  /* 左側サイドナビ 右向き矢印に大きさを合わせた時　ここから ----- */
  box-sizing: border-box;
  width: 5px;
  height: 5px;
  border: 3px solid transparent;
  border-left: 4px solid var(--bs-wt);
  top: 50%;
  right: -4px;
   transform: translateY(-50%);
  /* 左側サイドナビ 右向き矢印に大きさを合わせた時　ここまで ----- */
}

/* カタログから探す 部分　------------------------------------ */
#table1 #menu-catalog .list_catalog li {
  height: 100%;
  border: 1px solid var(--bs-light_gray);
  border-radius: 6px; 
}
#table1 #menu-catalog .list_catalog li img {
  border-radius: 6px 6px 0 0;
  /* border-bottom: none; */
  border: none;
  height: 130px;
}

/* テキストを上下方向 中央揃えにする */
#table1 #menu-catalog .list_catalog li .txt-link .txt,
#table1 #menu-catalog .list_catalog li .txt-link .arrow {
  display: flex;
  align-items: center;
}
#table1 #menu-catalog .list_catalog li .txt-link .arrow {
  width: 17px;
}
#table1 #search_item .list_catalog li div.txt-link {
  width: 100%;
  margin: 0px 0 0;
  padding: 5px 0 5px 5px;
  border: none;
  transform: translateY(-1px);
  position: relative;
}

#table1 #search_item .list_catalog li div.txt-link p.arrow:before {
  position: absolute;
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--bs-arrow_red);
  top: 21px;
  right: 5px;
}
#table1 #search_item .list_catalog li div.txt-link p.arrow:after {
  content: "";
  /* ↑ 元の設定 ＞ の上書き */
  position: absolute;
  /* 左側サイドナビ 右向き矢印に大きさを合わせた時　ここから ----- */
  box-sizing: border-box;
  width: 5px;
  height: 5px;
  border: 3px solid transparent;
  border-left: 4px solid var(--bs-wt);
  top: 24px;
  right: 6px;
  /* 左側サイドナビ 右向き矢印に大きさを合わせた時　ここまで ----- */
}

#table1 #menu-catalog .list_catalog li p {
  margin: 0;
  height: 45px;
}

/* シーンから選ぶ 部分　------------------------------------ */
#table1 #search_item .list_kind li,
#table1 #search_item .list_scene li {
  border: 1px solid var(--bs-light_gray);
  border-radius: 6px;
}

#table1 #search_item .list_scene li img {
  border-radius: 6px 6px 0 0;
  border: none;
}

#table1 #search_item .list_scene li a {
  color: var(--bs-dark_gray);
  text-decoration: none;
}

#table1 #search_item .list_scene li p {
  padding: 5px 0 5px 5px;
  border: none;
  margin: 0;
  width: calc(100% - 12px);
  display: flex;
  align-items: center;
  position: relative;
}

#table1 #search_item .list_scene li p:before {
  content: "";
  /* ↑ 元の設定 ＞ の上書き */
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--bs-arrow_red);
  margin-left: 2px;
  top: 50%;
  right: -5px;
  transform: translateY(-50%);
}

#table1 #search_item .list_scene li p:after {
  content: "";
  /* ↑ 元の設定 ＞ の上書き */
  position: absolute;
  /* 左側サイドナビ 右向き矢印に大きさを合わせた時　ここから ----- */
  box-sizing: border-box;
  width: 5px;
  height: 5px;
  border: 3px solid transparent;
  border-left: 4px solid var(--bs-wt);
  top: 50%;
  right: -4px;
   transform: translateY(-50%);
  /* 左側サイドナビ 右向き矢印に大きさを合わせた時　ここまで ----- */
}

@media only screen and (max-width:768px) {

}
/* 人数から選ぶ 部分　------------------------------------ */
#table1 #search_item .list_number li {
  border: 1px solid var(--bs-light_gray);
  border-radius: 6px;
}

#table1 #search_item .list_number li img {
  border-radius: 6px 6px 0 0;
  border: none;
}

#table1 #search_item .list_number li a {
  color: var(--bs-dark_gray);
  text-decoration: none;
}

#table1 #search_item .list_number li p {
  padding: 5px 0 5px 5px;
  border: none;
  margin: 0;
  width: calc(100% - 12px);
  display: flex;
  align-items: center;
  position: relative;
}

#table1 #search_item .list_number li p:before {
  content: "";
  /* ↑ 元の設定 ＞ の上書き */
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--bs-arrow_red);
  margin-left: 2px;
  top: 50%;
  right: -5px;
  transform: translateY(-50%);
}

#table1 #search_item .list_number li p:after {
  content: "";
  /* ↑ 元の設定 ＞ の上書き */
  position: absolute;
  /* 左側サイドナビ 右向き矢印に大きさを合わせた時　ここから ----- */
  box-sizing: border-box;
  width: 5px;
  height: 5px;
  border: 3px solid transparent;
  border-left: 4px solid var(--bs-wt);
  top: 50%;
  right: -4px;
   transform: translateY(-50%);
  /* 左側サイドナビ 右向き矢印に大きさを合わせた時　ここまで ----- */
}

/* テキスト部分の高さ調整　------------------------------------ */
/* pc版の時のみ2行 */
#table1 #search_item li p.txt-2l_pc {
    height: 50px;
  }
/* pc版・sp版両方とも2行 */
#table1 #search_item li p.txt-2l {
  height: 50px;
}
@media only screen and (max-width:768px) {
  /* pc版の時のみ2行 */
  #table1 #search_item li p.txt-2l_pc {
    height: auto;
  }
  /* sp版の時のみ2行 */
  #table1 #search_item li p.txt-2l_sp {
    height: 50px;
  }
  /* pc版・sp版両方とも2行 */
  /* #table1 #search_item li p.txt-2l {
    height: 50px;
  } */
  
}

/* 余白追加　------------------------------------ */
#table1 #search_item .list_kind-space li,
#table1 #search_item .list_number-space li {
  padding: 5px 0 0 0;
}

/* hover 部分　------------------------------------ */
#table1 #search_item .list_industry li p:hover {
  opacity: 0.8;
}

#table1 #search_item .list_kind li p:hover,
#table1 #search_item .list_maker li p:hover,
#table1 #search_item .list_scene li p:hover,
#table1 #search_item .list_number li p:hover {
  opacity: 0.8;
}

#table1 #search_item .list_catalog li div.txt-link:hover {
  opacity: 0.8;
}

.list_maker li a:hover {
  opacity: 0.8;
}
/* 2026.07 change end　------------------------------------ */

/* 2026.08 add　------------------------------------ */
#table1 #search_item .list_maker li p.btn-ttl {
  display: block;
}
/* 2026.08 add end　------------------------------------ */