@charset "utf-8";
/* funiシューズボックス index 共通用 */
/* (X=index Progless ShoesboX=funiシューズボックス 00=予備) */
/* idxbascm.css */
/* 基本レイアウトの定義 */
img {
  max-width: 100%;
}

body {
  width: 100%;
  max-width: 1200px;
  margin: auto;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

header {
  max-width: 1200px;
  width: 100%;
}

main {
  width: 100%;
}

footer {
  float: left;
  width: 100%;
}

/* 導入部 */
/* ショップタイトル */
#header-title {
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
  margin: .5em auto;
  width: 98%;
}

.shop-title {
  box-sizing: border-box;
  vertical-align: middle;
  width: 60%;
}
h1 {
  color: #600;
  font-size : 120%;
  font-weight: bold;
  margin: 0;
  text-align: left;
}

.shop-info {
  box-sizing: border-box;
  line-height: 1.2;
  text-align: right;
  width: 40%;
}
.shop-title-pr {
  color: #f96;
  font-size : 90%;
  font-weight: bold;
  width: 100%;
}
.shop-name {
  font-weight: bold;
  color: #600;
  width: 100%;
}

/* パンくずリスト */
nav {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

#breadcrumbs-list {
  width: 75%;
  list-style-type: none;
  margin: .5em .5em .5em 0;
  font-size : 85%;
}
.breadcrumbs-path {
  display: inline;
}

/*- ヘッダー部 案内ページ行ボタン -*/

.info-link {
  margin: .5em .2em 0;
  font-weight: bold;
  font-size: 105%;
}
.info-link span {
  background: #3dff3d;
  border: 1px solid #0c330c;
  border-radius: 3px;
  text-align: center;
  padding: .3em .7em;
}
.info-link a {
  text-decoration: none;
  color: #0c330c;
}
.info-link a:hover {
  color: #ffc;
}

/* h2カテゴリー名バー */
.category-title {
  background-color: #fde8d0;
  border-left: 10px solid #ff8c00;
  border-bottom: 2px solid #ff8c00;
  box-sizing: border-box;
  color: #300;
  font-size: 110%;
  padding: .3em;
  margin: .3em auto;
  margin: .5em auto;
  max-width: 1200px;
  width: 95%;
}
/* フッターメニューバー */

/* 会社情報部 */
address {
  font-style: normal;
  font-size: 87%;
  margin-bottom: 1%;
  padding-left: 1%;
  text-align: center;
  width: 100%;
}

.corporation-name {
  width: 100%;
}

.corporation-add {
  width: 100%;
}
.corporation-mail {
  width: 100%;
}
.corporation-tel {
  width: 100%;
}

.corporation-fax {
  width: 100%;
}
.foot-line-name {
  background-color: #cc6;
  font-size: 82%;
  text-align: center;
  padding: 0.3em;
}

/* idxprbcm.css */
/* funiシューズボックス_index_ショップ特長PRボックス */

#shop-features {
  margin: .5em auto;
  width: 95%;
}
.shop-features-content {
  display: flex;
  flex-wrap: wrap;
  list-style-type: none;
  font-size: 93%;
  font-weight: bold;
  text-align: center;
  padding: 0 .5em;
  margin: .5em 0;
}

.shop-features-point {
  position: relative;
  cursor: default;
  margin: 0 auto;
  padding: 0.5em 0.3em;
  width: 15.5%;
}

.domestic {
  background-color: #8b008b;
  color: #fff;
}

.quantity {
  background-color: #191970;
  color: #fff;
}

.company {
  background-color: #4169e1;
  color: #fff;
}

.school {
  background-color: #32cd32;
  color: #fff;
}

.delivery {
  background-color: #ffa500;
  color: #fff;
}

.consult {
  background-color: #dc143c;
  color: #fff;
}

.shop-pr-popup {
  background-color: #efffff;
  border: 3px solid #165e83;
  border-radius: 10px;
  font-size: 90%;
  line-height: 1.2;
  text-align: left;
  color: #1f3134;
  display: none;
  position: absolute;
  top: 50px;
  padding: .7em .3em;
  box-sizing: border-box;
  box-shadow: 5px 10px 10px #1c305c;
  z-index: 5;
}

.shop-features-point:hover .shop-pr-popup {
  display: block;
}

.shop-pr-popup:before {
  content: "";
  position: absolute;
  top: -24px;
  left: 20%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-bottom: 12px solid #eaffff;
  z-index: 2;
}

.shop-pr-popup:after {
  content: "";
  position: absolute;
  top: -30px;
  left: 20%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-bottom: 14px solid #165e83;
  z-index: 1;
}

/* comnewcm.css */
/* 共通一斉お知らせ画像(ニュース） */

.common-news-list {
  margin: .7em auto .2em;
  text-align: center;
}

.common-news-part img {
  max-width: 30%;
}

/* commsgcm.css */
/* 共通一斉お知らせテキスト（メッセージ） */
.common-message-list {
  margin: .2em auto .5em;
  text-align: center;
  font-size: 90%;
}

/* idxhaicm.css */
/* 家具専用配送便 */
.support-point-menu {
  display: flex;
  flex-wrap: wrap;
  font-size: 13px;
  line-height: 1.3;
  margin: .5em auto 1em;
  max-width: 1200px;
  padding: 0; 
  width: 95%;
}

.support-point-title-service {
  background-color: #90ee90;
  font-size: 14px;
  color: #030;
  padding: 0.3em 0;
  text-align: center;
  width: 100%;
}

.support-point-list-service {
  box-sizing: border-box;
  border: 1px solid #999;
  display: flex;
  justify-content: space-around;
  align-self: center;
  flex-wrap: wrap;
  list-style-type: none;
  margin: 0 .5% 0 0;
  padding: 0;
  width: 49.5%;
}

.support-point-part-service {
  border: 1px solid #ddd;
  height: 60px;
  text-align: center;
  width: 18%;
  position: relative;
  margin: .2% 0;
}

.support-point-comment-service {
  border: 1px solid #ddd;
  font-size: 12px;
  font-weight: bold;
  height: 60px;
  text-align: center;
  width: 18%;
  position: relative;
  margin: .2% 0;
  display: flex;
  align-items: center;
}
.support-point-konpou {
  color : #ff0033;
  line-height; 1.6;
}

.support-point-part-img-service {
  width: 60px;
}

.support-point-part-popup-service {
  background-color: #666;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  display: none;
  top: 0;
  padding: 1.0em 0.5em;
  position: absolute;
  text-align: left;
  width: 180px;
  z-index: 1;
}

.support-point-part-img-service:hover + .support-point-part-popup-service {
  display: block;
}

.support-point-comment-service:hover .support-point-part-popup-service {
  display: block;
}

.support-point-part-link-service {
  color: #fff;
  text-decoration: none;
}

.left-service {
  left: 90px;
}

.left-service:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -30px;
  margin-top: -15px;
  border: 15px solid transparent;
  border-right: 15px solid #666;
}

/* オプション */
.support-point-title-option {
  background-color: #ffea00;
  color: #030;
  font-size: 14px;
  padding: 0.3em 0;
  width: 100%;
  display: inline-block;
  text-align: center;
}

.support-point-list-option {
  border: 1px solid #999;
  box-sizing: border-box;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 50%;
}

.support-point-part-option {
  border: 1px solid #ddd;
  height: 60px;
  text-align: center;
  width: 18%;
  position: relative;
}

.support-point-comment-option {
  border: 1px solid #ddd;
  font-size: 12px;
  font-weight: bold;
  height: 60px;
  text-align: center;
  vertical-align: middle;
  width: 18%;
  position: relative;
  display: flex;
  align-items: center;
}

.support-point-part-img-option {
  width: 60px;
}

.support-point-part-popup-option {
  background-color: #666;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  display: none;
  top: 0;
  padding: 1em .5em;
  position: absolute;
  text-align: left;
  width: 180px;
  z-index: 1;
}
.support-point-toiawase {
  color : #0033ff;
  line-height; 1.6;
}

.support-point-part-img-option:hover + .support-point-part-popup-option {
  display: block;
}

.support-point-comment-option:hover .support-point-part-popup-option {
  display: block;
}

.support-point-part-link-option {
  color: #fff;
  text-decoration: none;
}

.right-option {
  right: 90px;
}

.right-option:before {
content: "";
  position: absolute;
  top: 50%;
  left: 100%;
  margin-top: -15px;
  border: 15px solid transparent;
  border-left: 15px solid #666;
}

/* osizmncm */
/* タイプ別 他サイズメニュー全体 */

section {
  margin-bottom: .7em;
}

.typelist-content {
  margin: .5em auto 2em;
  max-width: 1200px;
  padding: 0; 
  width: 95%;
}

/* h3タイプ名バー */
.type-title {
  background-color: #dd7;
  box-sizing: border-box;
  color: #300;
  font-size: 100%;
  padding: .2em .3em;
  margin: .3em auto;
  max-width: 1200px;
}

/* タブ全体枠 */
.typelist-tab{
  background: #efefef;
  border: 1px solid #ccc;
  display: flex;
  flex-wrap: wrap;
}

/* inputを非表示にする(透明にする） */
.input {
  position: absolute;
  opacity: 0;
}

/* タブボタン部分 */

.typelist-tab-label {
  background: #ffffe0;
  border-right: 1px solid #999;
  border-bottom: 5px solid #7b8d42;
  color: #432f2f;
  cursor: pointer;
  font-weight: bold;
  font-size: 95%;
  line-height: 1.1;
  margin-bottom: 0;
  text-align: center;
  padding: 5px 0;
  position: relative;
  width: 16%;
}

.typelist-tab-label:hover {
  background: #efffe0;
 }

.typelist-tab-label:active {
  background: #ccc;
 }

.input:checked + .typelist-tab-label {
  position: relative;
  background: #7b8d42;
  color: #fff;
 }

/* タブのポップアップ */
/* ポップアップ〇～〇人用 */
.type-digest-detail-model-popup {
  background-color: #ff8c00;
  font-size: 100%;
  color: #fff;
  margin: .3em auto;
  padding: .1em;
  width: 90%;
}

/* ポップアップ全サイズ数 */
.type-digest-detail-size-popup {
  background-color: #ff8c00;
  font-size: 100%;
  color: #fff;
  margin: .3em auto;
  padding: .1em;
  width: 90%;
}

/* ポップアップ仕様 */
.type-digest-detail-style-popup {
  background-color: #ff8c00;
  font-size: 100%;
  color: #fff;
  margin: .3em auto;
  padding: .1em;
  width: 90%;
}

/* タブポップアップデザインと表示位置設定 */
.type-digest-popup {
  background-color: #fff;
  border: solid 2px #555;
  border-radius: 3px; 
  color: #000;
  display: none;
  font-weight: bold;
  line-height: 110%;
  position: absolute;
  bottom: 45px;
  left: 5px;
  padding: 0 0;
  width: 170px;
  z-index: 20; 
}
.type-digest-detail-popup {
  list-style: none;
  padding: 0;
}

.typelist-tab-label:hover .type-digest-popup {
  display: block;
}

.typelist-tab-panel:hover .type-digest-popup {
  height: 0;
  overflow: hidden;
}

/* タブ本文エリア */

.typelist-tab-panel {
  background: #fff;
  display: none;
  order: 99;
  width: 100%;
 }

.typelist-panel-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
 }


.input:checked + .typelist-tab-label + .typelist-tab-panel {
  display: block;
}

/* 中分類タイプ説明部 */

.typelist-information {
  margin-right: .5em;
  width: 34%;
}
.typelist-information a {
  text-decoration: none;
  color: #000;
}
.product-description {
  display: flex;
  flex-wrap: wrap;
  padding: .2em .3em .2em .7em;
  list-style: none;
  line-height: 1.1;
}
.product-name {
  font-weight: bold;
  color: #030;
  margin-bottom: .5em;
  text-decoration: underline;
  width: 100%;
}
.product-comment {
  font-size: 95%;
  margin-bottom: .5em;
  width: 100%;
}
.product-image {
  text-align: center;
  width: 100%;
}
.product-naisun {
  font-size: 87%;
  text-align: center;
  width: 100%;
}
.product-naisun img {
  width: 60%;
}

/* 内寸図オンマウス拡大 */
.product-naisun img:hover {
  transform: scale(2) translate(0,-15px);
}

/* 他サイズメニュー部 */

.typelist-otherSize {
  width: 65%;
}
.otherSize-menu {
  border-collapse: collapse;
  font-size: 14px;
  margin: .5em 0;
  padding: 0;
  text-align: center;
  width: 97%;
}

.otherSize-menu-title {
  background-color: #eee;
  border: 1px solid #999;
  margin: 0;
  padding: .6em 0;
}

.otherSize-menu-part {
  border: 1px solid #999;
  box-sizing: border-box;
  padding: .2em 0;
}

/* 他サイズメニュー部マウスオンポップアップ */

.otherSize-menu-part:hover {
  box-shadow: 0 0 0 2px #762f07 inset;
  position: relative;
}

.otherSize-image-popup {
  background-color: #fff;
  border: 2px solid #cc530c;
  border-radius: 3px;
  display: none;
  font-weight: bold;
  position: absolute;
  bottom: 50px;
  left: -90px;
  color: #000;
  line-height: 110%;
  text-align: center;
  padding: 0.1em 0;
  width: 230px;
  z-index: 30; 
}

.otherSize-menu-part:hover .otherSize-image-popup {
  display: block;
}
.otherSize-menu-part-comment {
  font-size: 85%;
}
.title-dan-appeal {
  color: #ff0033;
}

