@charset "UTF-8";
/* #################################
###  ヘッダー
################################# */
.simHeader {
  margin-bottom: 30px;
}
.simHeader h2 {
  padding: 15px 15px 12px;
  border-bottom: 2px solid #025178;
  background: #006699;
  font-size: 28px;
  font-weight: normal;
  line-height: 1.2em;
  text-align: center;
  color: #fff;
}
.simHeaderGuide {
  position: relative;
  min-height: 135px;
  margin: 0;
  padding: 0 0 0 200px;
  background: url() no-repeat 0 0;
  background-size: 180px auto;
  border: 1px solid #006799;
}
.simHeaderGuide h3 {
  position: relative;
  padding: 25px 0 5px 0;
  font-size: 21px;
  font-weight: normal;
  line-height: 1.6em;
  color: #006699;
  z-index: 1;
}
.simHeaderGuide p {
  position: relative;
  font-size: 14px;
  z-index: 1;
}
.simImg {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 160px;
  z-index: 0;
}
.simStepBox {
  width: 670px;
  position: relative;
}
.simStepBox h4 {
  margin: 60px 0 15px 0;
  background: #efefef;
  border-bottom: 1px solid #006699;
  font-size: 18px;
  font-weight: bold;
  color: #006699;
}
.simStepBox h4:first-child {
  margin-top: 0;
}
.simStepBox h4 span {
  display: inline-block;
  margin: 6px 8px 6px 6px;
  padding: 8px 10px;
  border-radius: 3px;
  background: #006699;
  font-size: 16px;
  line-height: 1;
  font-weight: bold;
  color: #fff;
}
.simStepBox h4.with-icon {
  padding: 12px;
}
.simStepBox h4.with-icon i {
  margin: 0 4px 0 0;
}
.simStepBox p {
  font-size: 15px;
  line-height: 1.5em;
}
.simStepBox strong {
  font-weight: bold;
}
.simBoxOpt {
  margin-left: 20px;
}
.simBoxOpt h5 {
  margin: 50px 0 15px;
  padding: 8px;
  background: #efefef;
  border-left: 4px solid #006699;
  border-bottom: 1px solid #006699;
  font-size: 16px;
  line-height: 1.3em;
  font-weight: bold;
}
.simAttList {
  display: table;
  margin: 30px 0;
  font-size: 12px;
  line-height: 1.5em;
}
.simAttList dt {
  display: table-cell;
  padding: 8px;
  background: #cc0000;
  border-radius: 4px 0 0 4px;
  vertical-align: top;
  text-align: center;
  color: #fff;
  box-sizing: border-box;
}
.simAttList dd {
  display: table-cell;
  padding: 8px 15px 8px 8px;
  border-radius: 0 4px 4px 0;
  border-top: 1px solid #fdaaaa;
  border-bottom: 1px solid #fdaaaa;
  border-right: 1px solid #fdaaaa;
  vertical-align: top;
  color: #CC0000;
  box-sizing: border-box;
}
.simBoxOpt .simAttList dt {
  width: 32px;
}
.simBoxOpt .simAttList dd {
  width: 418px;
}
.simAttList dd ul {
  padding-left: 1.5em;
}
.simAttList dd ul li {
  list-style-type: disc;
  margin: 3px 0;
  font-size: 13px;
  line-height: 1.5em;
}
.simStepBox .single-image img {
  display: block;
  width: 600px;
  margin: 0 auto;
}
/* #################################
###  ラジオ選択肢
################################# */
/* ツールチップ */
.simTooltip {
  display: block;
}
.simTooltip i {
  position: absolute;
  top: 50%;
  right: 0.2em;
  display: block;
  margin: -0.5em;
  font-size: 16px;
  cursor: pointer;
}
.simTooltip.simTooltipLeft {
  display: inline-block;
  position: static;
  flex-basis: unset;
  font-size: inherit;
}
.simTooltip.simTooltipLeft i {
  position: static;
  top: 0;
  right: 0;
  display: inline-block;
  margin: 0;
  font-size: inherit;
  cursor: pointer;
}
/* #################################
###  枠線付き画像ラジオ
################################# */
.simImgChoiceList {
  display: flex;
  justify-content: space-between;
  margin-top: 60px;
}

.simImgChoiceList li label:hover, .simImgChoiceList li label:active {
  opacity: 0.8;
}
.simImgChoiceList li {
  flex-basis: calc(50% - 10px);
}
.simImgChoiceList li .simImgChoiceCards {
  display: block;
  height: 100%;
  padding: 5px;
  border-radius: 2px;
  background: #efefef;
}
.simImgChoiceList li .simImgChoiceCards .simImgChoiceCardsInner {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  border: 1px solid #ccc;
  background: #fff;
	flex-wrap: wrap;
  cursor: pointer;
}
.simImgChoiceList li input[type="radio"]:checked + .simImgChoiceCards {
  background: #447ff6;
}
.simImgChoiceList li input[type="radio"]:checked + .simImgChoiceCards .simImgChoiceCardsInner {
  border: 1px solid #3366cc;
}
.simImgChoiceList.simFixedSelect li input[type="radio"]:checked + .simImgChoiceCards {
  background: mediumseagreen;
}
.simImgChoiceList.simFixedSelect li input[type="radio"]:checked + .simImgChoiceCards .simImgChoiceCardsInner {
  border: 1px solid seagreen;
}
.simImgChoiceList .simImgChoiceCardsLabel {
  display: inline-block;
  position: absolute;
  top: -35px;
  left: 50%;
  padding: 0 24px;
  height: 30px;
  background: #efefef;
  border-radius: 3px 3px 0 0;
  font-size: 13px;
  line-height: 32px;
  color: #999;
  box-sizing: border-box;
  white-space: nowrap;
  transform: translate(-50%);
}
.simImgChoiceList input[type="radio"]:checked + .simImgChoiceCards .simImgChoiceCardsLabel {
  background: #447ff6;
  color: #fff;
}
.simImgChoiceList.simFixedSelect input[type="radio"]:checked + .simImgChoiceCards .simImgChoiceCardsLabel {
  background: mediumseagreen;
  color: #fff;
}
.simImgChoiceImg {
  padding: 10px;
  box-sizing: border-box;
  text-align: center;
}
.simImgChoiceDescription {
  display: block;
  padding: 0 15px 8px;
  font-size: 14px;
  line-height: 1.4;
  box-sizing: border-box;
}
.simImgChoiceList li input[type="radio"]:checked + .simImgChoiceCards .simOptInputDisp {
  display: block;
  animation: fadeIn 300ms ease 0s;
}

/* #################################
###  枠線付き画像ラジオ内データ
################################# */
.simImgChoiceData {
  position: relative;
  padding: 8px 8px 15px 8px;
  width: 312px;
  border-top: 1px dotted #3366cc;
  text-align: center;
  box-sizing: border-box;
}
.simImgChoiceData .simImgChoiceDataBox {
  display: flex;
  justify-content: space-around;
  margin: 10px 0 10px 0;
  font-size: 14px;
  font-weight: bold;
}
.simImgChoiceData .simImgChoiceDataInput {
  text-align: left;
}
.simImgChoiceData .simImgChoiceDataInput span {
  display: block;
  margin-bottom: 5px;
}
.simImgChoiceData .simImgChoiceDataInput input[type="text"] {
  padding: 0 8px;
  width: 60px;
  height: 40px;
  border: 1px solid #447ff6;
  border-radius: 3px;
  background: #fff;
  font-size: 15px;
  font-weight: bold;
  line-height: 40px;
  text-align: center;
  box-sizing: border-box;
}

/* #################################
###  アイコン付きボタンベース
################################# */

.simOptInputBtn {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 10px;
  background: #efefef;
  border-radius: 4px;
  box-sizing: border-box;
  font-size: 14px;
  font-weight: normal;
  color: #666;
  cursor: pointer;
}
.btn3col{
  min-height: 55px;
}
.simOptInputBtn i {
  margin-right: 4px;
}
.simOptInputBtn small {
  flex-grow: 1;
}
.simChoiceList {
  display: flex;
  flex-wrap: nowrap;
  padding: 0;
  justify-content: space-between;
}
.simChoiceList2 {
  display: flex;
  flex-wrap: nowrap;
  padding: 0;
  justify-content: center;
}
.simChoiceList[class^="col"] {
  flex-wrap: nowrap;
}
.simChoiceList2[class^="col"] {
  flex-wrap: nowrap;
}
.simChoiceList .simChoiceItem,
.simChoiceList2 .simChoiceItem {
  display: flex;
  width: 100%;
	justify-content: center;
}
.simChoiceList > li {
  flex: 1;
  margin: 0 5px;
	max-width: 50%;
}

.simChoiceList2 > li {
  flex: 1;
  margin: 0 5px;
	max-width: 33.3%;
}
.simChoiceList > li > span,
.simChoiceList2 > li > span {
  display: block;
}
.simChoiceList .simChoiceItem > label,
.simChoiceList2 .simChoiceItem > label {
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.simChoiceList .simChoiceItem > label,
.simChoiceList2 .simChoiceItem > label {
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.simChoiceList .simChoiceItem label:hover,
.simChoiceList2 .simChoiceItem label:hover {
  opacity: 0.7;
}
.simChoiceList .simOptInputBtn,
.simChoiceList2 .simOptInputBtn {
  text-align: center;
}
.simChoiceImg_80{

}
.simChoiceImg img {
  display: block;
  width: 100%;
}
.simChoiceImg_70 img {
  display: block;
  width: 70%;
  margin: auto;
}
.item-sort .simChoiceList {
  align-items: center;
}
.allsheet[data-display="count"] {
  margin: 10px 0;
}

/*2行ボタン対応*/

.mullinesBtn {
  padding-left: 1.7em;
  text-indent: -0.65em;
}
.mullinesBtn i {
  width: 1.5em;
}
.simChoiceImgfour {
  position: absolute;
  top: 0;
  display: block;
  width: 157px;
  height: 157px;
  background: rgba(45, 45, 45, 0.5);
  text-align: center;
  opacity: 0;
}
.simChoiceImgfour:hover, .simChoiceImgfour:active {
  opacity: 1;
}
.simChoiceImgfour small {
  display: inline-block;
  margin: 72px auto;
  padding: 0 12px;
  height: 36px;
  border-radius: 3px;
  background: rgba(0, 0, 0, 0.7);
  opacity: .8;
  color: #fff;
  font-size: 12px;
  line-height: 36px;
  box-sizing: border-box;
}

/* #################################
###  青ボタン右揃えラッパー
################################# */

.simOptInput.simOptInputWrap {
  display: flex;
  justify-content: flex-end;
  float: none;
  margin-top: 25px;
  width: auto;
	align-items: center;
}
.simOptInput.simOptInputWrap .simOptInputBox {
  margin: 0 0 0 15px;
  position: static;
}
.simOptInput.simOptInputWrap .simOptInputPanel {
  position: static;
  top: auto;
}
.simOptInput.simOptInputWrap .simOptInputPanel label:hover, .simOptInput.simOptInputWrap .simOptInputPanel label:active {
  opacity: 0.8;
}
.simOptInputBtn.simOptInputBtnLg {
  display: inline-block;
  width: auto;
}


/* ボタン類カラー設定 */
input[type="radio"]:checked + label .simOptInputBtn, input[type="radio"]:checked + label .simOptInputfourBtn {
  background: #447ff6;
  color: #fff;
}


/* #################################
### レコメンドタグ
################################# */

.simTagsRecommend {
  display: inline-block;
  position: absolute;
  padding: 3px 8px 2px 8px;
  border-radius: 3px;
  background: #f88203;
  font-style: normal;
  text-align: center;
  line-height: 1.2em;
  color: #fff;
  z-index: 1;
}
.simChoiceImg > .simTagsRecommend {
  top: 0;
  right: 0;
}
.simChoiceItem > .simTagsRecommend {
	bottom: -2.4em;
  right: 0;
}


.simItemCards > .simTagsRecommend {
  top: 1em;
  right: 1em;	
}

/* #################################
###  サイズ入力
################################# */
.simItemSample {
  margin: 2em 0 0 0;
  padding-right: 10px;
}
.simItemSample img {
  display: block;
  width: 100%;
}
.simItemInputSize {
  display: flex;
  width: 100%;
  margin-top: 15px;
}
.simItemSize p {
  margin-top: 1em;
}
.simItemInput {
  position: relative;
  margin-top: 2px;
  font-size: 14px;
  font-weight: bold;
  vertical-align: middle;
}
.simItemInput input {
  margin-right: 5px;
  padding: 8px 10px;
  width: 120px;
  border: 1px solid #ccc;
  font-size: 18px;
  line-height: 1.3em;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  box-sizing: border-box;
}
.simItemSizeTab {
  margin: 20px 1rem 0;
  font-size: 0.9rem;
}
.simItemSizeTab ul {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
}
.simItemSizeTab li {
  display: flex;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  justify-content: center;
  align-items: center;
  border: 1px solid #ccc;
  cursor: pointer;
}
.simItemSizeTab li.current {
  background-color: #026699;
  color: #fff;
  cursor: default;
}
.simItemSizeTab li:hover {
  background-color: #f5f5f5;
}
.simItemSizeTab li.current:hover {
  background-color: #026699;
}
.simItemSizeTab li:before {
  font-size: 18px;
  color: #999;
  font-weight: bold;
}
.simItemSizeTab li.current:before {
  color: #fff;
}
.simItemSizeTab li:nth-child(1):before {
  content: "A";
}
.simItemSizeTab li:nth-child(2):before {
  content: "B";
}
.simItemSizeTab li:nth-child(3):before {
  content: "C";
}
.simItemSizeTab li:nth-child(4):before {
  content: "D";
}
.simItemSizeTab li:nth-child(5):before {
  content: "E";
}
.simItemSizeTab li:nth-child(6):before {
  content: "F";
}
.simItemSizeTab li:nth-child(7):before {
  content: "G";
}
.simItemSizeTab li:nth-child(8):before {
  content: "H";
}
.simItemSizeTab li:nth-child(9):before {
  content: "I";
}
.simItemSizeTab li:nth-child(10):before {
  content: "J";
}
/* 複数サイズ */
.simItemSizeMultiple {
  margin-top: 20px;
  font-size: 0.9rem;
}
.simItemSizeMultiple li {
  display: flex;
  padding: 25px 0 10px 0;
  align-items: center;
  flex-wrap: wrap;
}
.simItemSizeMultiple li + li {
  border-top: 1px dotted #ccc;
}
.simItemSizeMultiple li:before {
  height: 2em;
  line-height: 2em;
  padding: 0 0.5em;
  margin: 0 10px 0 0;
  color: #fff;
  background: #026699;
  font-weight: bold;
}
.simItemSizeMultiple li:nth-child(1):before {
  content: "A";
}
.simItemSizeMultiple li:nth-child(2):before {
  content: "B";
}
.simItemSizeMultiple li:nth-child(3):before {
  content: "C";
}
.simItemSizeMultiple li:nth-child(4):before {
  content: "D";
}
.simItemSizeMultiple li:nth-child(5):before {
  content: "E";
}
.simItemSizeMultiple li:nth-child(6):before {
  content: "F";
}
.simItemSizeMultiple li:nth-child(7):before {
  content: "G";
}
.simItemSizeMultiple li:nth-child(8):before {
  content: "H";
}
.simItemSizeMultiple li:nth-child(9):before {
  content: "I";
}
.simItemSizeMultiple li:nth-child(10):before {
  content: "J";
}
.simItemSizeMultiple input[type="number"] {
  width: 4em;
  padding: 0.5em 0.5em 0.5em 1em;
  border: 1px solid #ccc;
  border-radius: 6px;
  text-align: right;
}
.simItemSizeMultiple input[type="number"]:nth-of-type(3) {
  width: 2em;
  margin-left: 20px;
}
.simItemSizeMultiple .add-size, .simItemSizeMultiple .remove-size {
  cursor: pointer;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  color: #CCC;
  font-size: 1.4rem;
  background: none;
}
.simItemSizeMultiple .add-size {
  display: block;
  width: 16em;
  height: 2.4em;
  line-height: 2.4em;
  margin: 20px auto 0 auto;
  color: #026699;
  border: 1px solid #026699;
  border-radius: 4px;
  font-size: 1rem;
}
.simItemSizeMultiple .add-size:hover {
  background: #026699;
  color: #fff;
}
.simItemSizeMultiple .remove-size {
  margin-left: auto;
}
.simItemSizeMultiple .remove-size:hover {
  color: #333;
}
.simItemSizeMultiple span {
  margin: 0 5px;
}
/* メートル変換 */
.meters, .meters-column-inner {
  width: 100%;
  margin: 10px 0 0 3em;
  padding: 1em;
  background: #f5f5f5;
  border: 1px dashed #ccc;
  font-size: 0.9rem;
}
[data-display='width-m'], 
[data-display='height-m'],
[data-display='depth-m'] {
  font-weight: bold;
}
.meters-column-inner {
  width: 200px;
  margin: 10px 0 0 0;
}
/* #################################
###  商品選択
################################# */
[class^="simItemList"] {
  display: flex;
  flex-wrap: wrap;
  margin: 52px 0 20px 0;
  box-sizing: border-box;
}
[class^="simItemList"] li {
  margin-right: 10px;
  margin-bottom: 35px;
  flex-basis: 160px;
  box-sizing: border-box;
}
[class^="simItemList"] li:nth-child(4n) {
  margin-right: 0;
}
[class^="simItemList"] li input {
  position: fixed;
  top: -100%;
  left: -100%;
}
[class^="simItemList"] li label {
  cursor: pointer;
  display: inline-block;
  position: relative;
  padding: 5px;
  width: 160px;
  background: #efefef;
  box-sizing: border-box;
}
[class^="simItemList"] li label:hover, [class^="simItemList"] li label:active {
  opacity: 0.8;
}
[class^="simItemList"] li .simItemCards {
  display: block;
  border: 1px solid #ccc;
  background: #fff;
  box-sizing: border-box;
}
[class^="simItemList"] li .simItemCards .simItemImg {
  display: block;
  width: 100%;
  pointer-events: none;
  -moz-user-select: none; /* FF only */
}
[class^="simItemList"] li .simItemCards .simItemName {
  display: block;
  padding: 8px;
  font-size: 11px;
}
[class^="simItemList"] li .simItemCards .simItemPrice {
  display: block;
  padding: 0 8px;
  font-size: 11px;
  font-weight: bold;
  text-align: right;
}
[class^="simItemList"] li .simItemCards .simItemMaterial {
  display: block;
  padding: 4px 8px;
  border-top: 1px solid #ddd;
  font-size: 11px;
  line-height: 1.2em;
  text-align: center;
  color: #666;
}
[class^="simItemList"] li .simItemCards .simAllColors {
  display: block;
  padding: 4px 8px;
  border-top: 1px solid #ddd;
  font-size: 11px;
  line-height: 1.2em;
  text-align: center;
  color: #666;
}
.simItemList02 li .simItemCards .simItemName {
  line-height: 1.3;
}
.simItemList02 li .simItemCards .simItemPrice {
  color: #ff0000;
}
.simItemList02 li .simItemCards .simTagsNew {
  display: block;
  position: absolute;
  top: 6px;
  left: 5px;
  width: 150px;
  height: 150px;
  overflow: hidden;
}
.simItemList02 li .simItemCards .simTagsNew span {
  display: inline-block;
  position: absolute;
  top: 6px;
  right: -35px;
  padding: 3px 40px 2px 40px;
  border-radius: 3px;
  background: #ff0000;
  font-size: 12px;
  font-style: normal;
  text-align: center;
  line-height: 1.2em;
  color: #fff;
  transform: rotate(45deg);
}
.simItemList02 li .simItemCards .simItemDescription {
  display: block;
  padding: 4px 8px;
  border-top: 1px solid #ddd;
  font-size: 11px;
  line-height: 1.3;
  text-align: justify;
  color: #666;
}
[class*="simItemList"] li .simItemCards .simFunction {
  display: flex;
  text-align: left;
  flex-wrap: wrap;
}
[class*="simItemList"] li .simItemCards .simFunction img {
  display: block;
  width: 24px;
  height: 24px;
  margin: 1px;
}
.simItemList03 li .simItemCards > div {
  position: relative;
}
.simFunction img {
  border: 1px solid #fff;
}
.simItemList03 li .simFunction {
  position: absolute;
  top: 5px;
  left: 5px;
}
.simItemList03 li .simItemCards .simItemPrice {
  position: absolute;
  right: 0;
  bottom: 0;
  display: block;
  width: 100%;
  height: 2em;
  line-height: 2em;
  padding: 0;
  color: #E50011;
  background: rgba(255, 255, 255, 0.6);
  text-shadow: 1px 1px #fff, -1px -1px #fff, -1px 1px #fff, 1px -1px #fff;
  font-size: 1.4em;
  text-align: right;
}
.simItemList03 li .simItemCards .simItemWeight, .simItemList03 li .simItemCards .simItemMaterial {
  display: block;
  padding: 0;
  height: 2.2em;
  line-height: 2.4em;
  border-top: 1px solid #ddd;
  font-size: 11px;
  text-align: center;
  color: #666;
}
.simItemList03 li .simItemCards .simItemName {
  display: flex;
  height: 3.5em;
  line-height: 1.3;
  justify-content: center;
  align-items: center;
}
.simItemList03 li .simItemCards .simTagsNew {
  display: block;
  position: absolute;
  top: 6px;
  left: 5px;
  width: 150px;
  height: 150px;
  overflow: hidden;
}
.simItemList03 li .simItemCards .simTagsNew span {
  display: inline-block;
  position: absolute;
  top: 6px;
  right: -35px;
  padding: 3px 40px 2px 40px;
  border-radius: 3px;
  background: #ff0000;
  font-size: 12px;
  font-style: normal;
  text-align: center;
  line-height: 1.2em;
  color: #fff;
  transform: rotate(45deg);
}
.simItemList03 li .simItemCards .simItemDescription {
  display: block;
  padding: 4px 8px;
  border-top: 1px solid #ddd;
  font-size: 11px;
  line-height: 1.3;
  text-align: justify;
  color: #666;
}
.simItemName {
  text-align: center;
}
.simDetailLink a {
  display: block;
  height: 2.5em;
  line-height: 2.5em;
  border-top: 1px solid #ddd;
  text-align: center;
}
.simDetailLink i {
  margin-left: 0.5em;
}
[class^="simItemList"] input[type="radio"]:checked + label {
  background: #447ff6;
}
[class^="simItemList"] input[type="radio"] + label:before {
  display: block;
  content: '未選択';
  position: absolute;
  top: -22px;
  left: 35px;
  padding: 9px 18px 5px 18px;
  width: 90px;
  background: #efefef;
  border-radius: 3px 3px 0 0;
  font-size: 11px;
  line-height: 1.1em;
  text-align: center;
  color: #999;
  box-sizing: border-box;
}
[class^="simItemList"] input[type="radio"]:checked + label:before {
  display: block;
  content: '選択中';
  position: absolute;
  top: -22px;
  left: 35px;
  padding: 8px 18px 6px 10px;
  width: 90px;
  background: #447ff6;
  border-radius: 3px 3px 0 0;
  font-size: 12px;
  line-height: 1.1em;
  text-align: right;
  color: #fff;
  box-sizing: border-box;
}
[class^="simItemList"] input[type="radio"]:checked + label:after {
  display: block;
  content: "\f058";
  font-weight: 900;
  position: absolute;
  top: -23px;
  left: 35px;
  padding: 8px 10px 6px 18px;
  width: 90px;
  font-family: "Font Awesome 5 Free" !important;
  font-size: 13px;
  line-height: 1.1em;
  text-align: left;
  color: #fff;
  box-sizing: border-box;
}
[class^="simItemList"] input[type="radio"]:checked + label .simItemCards {
  border: 1px solid #3366cc;
}
/* #################################
###  カラー選択/3列
################################# */
.simColorList {
  display: flex;
  flex-wrap: wrap;
  margin: 20px 0;
  box-sizing: border-box;
}
.simColorList li {
  margin-right: 5px;
  margin-bottom: 10px;
  padding-right: 2em;
  flex-basis: 218px;
  box-sizing: border-box;
}
.simColorList li input {
  position: absolute;
  left: 1em;
  z-index: -1;
}
.simColorList li label {
  display: block;
  position: relative;
  padding: 5px;
  background: #efefef;
  box-sizing: border-box;
  cursor: pointer;
}
.simColorList li .simColorCards {
  display: flex;
  width: 100%;
  border: 1px solid #ccc;
  background: #fff;
  box-sizing: border-box;
  align-items: center;
}
.simColorList .simColorImg {
  flex-basis: 30px;
}
.simColorList .simColorName {
  padding: 0 0 0 10px;
  flex-grow: 1;
  font-size: 14px;
  font-weight: bold;
}
.simColorList .simColorCmnt {
  display: block;
  margin: 2px 8px 0 70px;
  font-size: 11px;
  font-weight: normal;
  line-height: 1.2em;
}
.simColorList input[type="radio"]:checked + label {
  background: #447ff6;
}
.simColorList input[type="radio"]:checked + label:before {
  display: block;
  content: '選択中';
  position: absolute;
  top: 5px;
  right: -20px;
  padding: 21px 4px 5px 3px;
  width: 20px;
  background: #447ff6;
  border-radius: 0 3px 3px 0;
  font-size: 11px;
  line-height: 1.1em;
  color: #fff;
  box-sizing: border-box;
}
.simColorList input[type="radio"]:checked + label:after {
  display: block;
  content: "\f058";
  font-weight: 900;
  text-align: center;
  position: absolute;
  top: 5px;
  right: -20px;
  padding: 5px 4px 5px 2px;
  width: 20px;
  border-radius: 0 3px 3px 0;
  font-family: "Font Awesome 5 Free" !important;
  font-size: 12px;
  line-height: 1.1em;
  color: #fff;
  box-sizing: border-box;
}
.simColorList input[type="radio"]:checked + label .simColorCards {
  border: 1px solid #3366cc;
}
.simColorList input[type="radio"]:checked + label:before {
  content: "\f058";
  top: 50%;
  height: 2.2em;
  line-height: 2.2em;
  margin-top: -1.1em;
  padding: 0 0.2em;
  color: #fff;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}
.simColorList input[type="radio"]:checked + label:after {
  display: none;
}
.simColorList li input {
  position: fixed;
  top: -100%;
  left: -100%;
}
.simColorList .simColorImg span {
  display: block;
  width: 30px;
  height: 30px;
  background: url() no-repeat 50% 50%;
  background-size: cover;
}
.simResultContent .simColorSquare {
  margin: -0.2em 5px 0 0;
}
.simNowBoxWrap .simColorSquare {
  display: inline-block;
  margin: -0.3em 5px 0 0;
}
/* #################################
###  タイプ選択
################################# */
.simChoiceList,.simChoiceList2 {
  display: flex;
  justify-content: center;
  margin-top: 30px;
}
.simChoiceItem {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  position: relative;
}
.simChoiceItem label:hover, .simChoiceItem label:active {
  opacity: 0.8;
}
.simChoiceImg {
	position: relative;
  display: block;
  margin: 10px 0;
  width: 100%;
}
.simChoiceDescription {
  padding: 0.5em;
  border: 1px solid #ccc;
  font-size: 12px;
  color: #666;
  line-height: 1.4;
}
.simChoiceDescription_3 {
  padding: 0.5em;
  border: 1px solid #ccc;
  font-size: 12px;
  color: #666;
  line-height: 1.4;
  min-height: 50px;
}
.simTypePrice {
  margin-top: 15px;
  font-size: 15px;
  font-weight: bold;
  text-align: right;
  color: #ff0000;
}
.simChoiceModalLink {
  margin: 1em 0 0 0;
  font-size: 15px;
  font-weight: bold;
  text-align: center;
  color: #447ff6;
}
.simChoiceItem input[type="radio"]:checked + label .simOptInputBtn {
  background: #447ff6;
  color: #fff;
}

/* #################################
###  レーティング
################################# */
.simTypeRating {
	width: 100%;
  border: 1px solid #ccc;
  border-radius: 3px;
}
.simTypeRatingData {
  display: flex;
  padding: 0 10px;
  height: 24px;
  border-bottom: 1px solid #ddd;
  font-size: 12px;
  line-height: 24px;
  box-sizing: border-box;
}
.simTypeRatingData:last-child {
  border-style: none;
}
.simTypeRatingData span {
  flex-basis: 60%;
}
.simTypeRatingData .fas.fa-star {
  line-height: 24px;
  color: #ff8c00;
}
.simTypeRatingData .far.fa-star {
  line-height: 24px;
  color: #ccc;
}
.simTypeRatingData .fas.fa-star-half-alt {
  line-height: 24px;
  color: #ff8c00;
}
.simTypeRatingData .far.fa-star-half-alt {
  line-height: 24px;
  color: #ccc;
}
/* #################################
###  セット商品
################################# */
.simOptTbl {
  margin: 10px 0;
  width: 100%;
  border-collapse: separate;
  font-size: 13px;
}
.simOptTbl th {
  padding: 10px 5px;
  box-sizing: border-box;
}
.simOptTbl td {
  padding: 10px 5px;
  box-sizing: border-box;
}
.simOptTbl.simOptTblHeader th {
  padding-bottom: 0;
}
.simOptInputTbl label {
  display: block;
  cursor: pointer;
}
.simOptInputTbl label:hover, .simOptInputTbl label:active {
  opacity: .8;
}
.simOptTbl .simOptTblCheck {
  width: 80px;
  font-size: 14px;
  text-align: center;
}
.simOptTbl .simOptTblName {
  padding-left: 15px;
  width: 160px;
  font-size: 14px;
  font-weight: bold;
}
.simOptTbl .simOptTblImg {
  width: 30px;
  text-align: center;
}
.simOptTbl .simOptTblPrice {
  width: 100px;
  text-align: center;
}
.simOptTbl .simOptTblLength {
  width: 60px;
  text-align: center;
}
.simOptTbl .simOptTblAllLength {
  width: 90px;
  text-align: center;
}
.simOptTbl .simOptTblCount {
  width: 120px;
  text-align: center;
}
.simOptTbl .simOptTblName .simOptTblDescription {
  display: block;
  font-size: 12px;
  font-weight: normal;
  line-height: 1.3;
  color: #447ff6;
}
.simOptTbl .simOptTblCount input[type="text"] {
  padding: 0 8px;
  width: 60px;
  height: 40px;
  border: 1px solid #447ff6;
  border-radius: 3px;
  background: #fff;
  font-size: 15px;
  font-weight: bold;
  line-height: 40px;
  text-align: center;
  box-sizing: border-box;
}
.simOptTbl .simOptTblCount input[type="text"]:disabled {
  border: 1px solid #ccc;
  background: #efefef;
}
.simOptInputTbl label input[type="radio"] + .simOptTbl th {
  border-top: 5px solid #efefef;
  border-bottom: 5px solid #efefef;
  background: #efefef;
  border-radius: 4px 0 0 4px;
  color: #999;
}
.simOptInputTbl label input[type="radio"] + .simOptTbl td {
  border-top: 5px solid #efefef;
  border-bottom: 5px solid #efefef;
}
.simOptInputTbl label input[type="radio"] + .simOptTbl td:last-child {
  border-right: 5px solid #efefef;
  border-radius: 0 4px 4px 0;
}
.simOptInputTbl label input[type="radio"]:checked + .simOptTbl th {
  border-color: #447ff6;
  background: #447ff6;
  color: #fff;
}
.simOptInputTbl label input[type="radio"]:checked + .simOptTbl td {
  border-color: #447ff6;
}
.simOptInputTbl label input[type="radio"]:checked + .simOptTbl td:last-child {
  border-color: #447ff6;
}
.simFixedSelect .simOptTbl .simOptTblCount input[type="text"] {
  border-color: mediumseagreen;
}
.simOptInputTbl.simFixedSelect label input[type="radio"]:checked + .simOptTbl th {
  border-color: mediumseagreen;
  background: mediumseagreen;
  color: #fff;
}
.simOptInputTbl.simFixedSelect label input[type="radio"]:checked + .simOptTbl td {
  border-color: mediumseagreen;
}
.simOptInputTbl.simFixedSelect label input[type="radio"]:checked + .simOptTbl td:last-child {
  border-color: mediumseagreen;
}
.simOptTblCheckOn {
  font-size: 14px;
  color: #fff;
}
.simOptTblCheckOff {
  font-size: 12px;
  color: #999;
}
.simOptInputTbl label input[type="radio"] + .simOptTbl th .simOptTblCheckOff, .simOptInputTbl label input[type="radio"]:checked + .simOptTbl th .simOptTblCheckOn {
  display: inline-block;
}
.simOptInputTbl label input[type="radio"] + .simOptTbl th .simOptTblCheckOn, .simOptInputTbl label input[type="radio"]:checked + .simOptTbl th .simOptTblCheckOff {
  display: none;
}
.simIcnCamera {
  display: flex;
  align-items: center;
}
.simIcnCamera i {
  margin: 0 auto;
}
.simIcnCamera {
  display: inline-block;
  width: 30px;
  height: 30px;
  line-height: 30px;
  border: 1px solid #ccc;
  border-radius: 2px;
  background: #efefef;
  color: #999;
  box-sizing: border-box;
}
.simIcnCamera:hover, .simIcnCamera:active {
  border: 1px solid #666;
  color: #333;
}
.simOptTblFoot {
  text-align: right;
}
/* 画像付きセットリスト */
.setcontent {
  display: flex;
  flex-wrap: wrap;
  padding: 20px;
}
.setcontent li:nth-child(odd) {
  margin-right: 20px;
}
.setcontent li {
  width: calc(50% - 10px);
  margin: 10px 0;
  font-size: 14px;
}
.setcontent dl {
  display: flex;
  align-items: center;
}
.setcontent dl dt {
  border: 1px solid #ccc;
  width: 30%;
  margin-right: 10px;
}
.setcontent dl dd {
  font-size: 14px;
  width: 70%;
}
.simselectImg {
  display: block;
  width: 100%;
}
.slectdisabled {
  opacity: 0.5;
}

.simItemSelect .simError {
  margin: 0 !important;
  padding: 5px;
  border: 1px solid #cc0000;
  border-radius: 3px;
  background: #fdeaea;
  font-weight: normal !important;
  font-size: 11px !important;
  color: #cc0000 !important;
}
.simItemSelect .simItemSize .simError {
  position: absolute;
  top: 5px;
  left: 164px;
}
.simItemSelect .simItemSize .simError:before, .simItemSelect .simItemSize .simError:after {
  position: absolute;
  left: -5px;
  top: 8px;
  border: solid transparent;
  content: '';
  height: 0;
  width: 0;
  border-width: 5px;
}
.simItemSelect .simItemSize .simError:before {
  border-right-color: #cc0000;
  margin-left: -5px;
}
.simItemSelect .simItemSize .simError:after {
  border-right-color: #fdeaea;
  margin: 0 0 0 -4px;
}
.simAtt {
  display: block;
  margin-top: 10px;
  font-size: 12px;
  line-height: 1.4;
  color: #cc0000;
}
.simAtten {
  display: inline-block;
  color: #FF9F02;
  border: solid 2px #FF9F02;
  border-radius: 7px;
  padding: 10px;
  font-size: 15px;
  line-height: 22px;
  margin: 20px 20px 0 20px;
  font-weight: bold;
  text-align: center;
  width: -webkit-fill-available;
}
.simItemSizeAlert {
  padding: 12px 15px;
  margin: 10px 0 25px 0;
  border: 1px dotted #cc0000;
  border-radius: 4px;
  font-weight: bold;
  font-size: 15px;
  color: #cc0000;
}

/* #################################
###  オプション加工
################################# */
.simOptMainImg {
  float: left;
  width: 180px;
  margin-right: 10px;
}
.simOptCmt {
  float: left;
  margin-right: 20px;
  width: 260px;
  background: #f9f4ee;
  border-radius: 4px;
}
.simOptSubImg {
  float: left;
  margin-right: 20px;
  width: 260px;
}
.simOptCmt .simOptCmtTtl {
  padding: 5px 10px 0 10px;
  border-bottom: 1px dotted #333;
  vertical-align: middle;
  font-size: 13px;
  font-weight: bold;
}
.simOptCmt .simOptCmtTtl img {
  vertical-align: middle;
}
.simOptCmt p {
  padding: 12px;
  font-size: 13px;
  line-height: 1.5em;
}
.simOptInput {
  float: left;
  width: 180px;
  font-size: 13px;
}
.simOptInput .simOptInputBox {
  margin-bottom: 20px;
  position: relative;
}
.simOptSettings ul.simOptSettingsChoices {
  display: grid;
  gap: 4px;
  margin-top: 8px;
}
.simOptSettings .simOptInputBtn {
  padding: 8px 10px;
}
.simOptSettingsChoices .simOptInputBtn,
.simOptInput .simOptInputPanel > label .simOptInputBtn {
  background: #efefef;
  color: #666;
}
.simOptSettingsChoices input:checked + .simOptInputBtn,
.simOptInput input:checked + .simOptInputPanel > label .simOptInputBtn {
  background: #447ff6;
  color: #fff;
}
.simOptInputData {
  padding: 10px;
  border: 3px solid #447ff6;
  border-radius: 3px;
}
.simOptSettings p {
  font-size: 12px;
  font-weight: bold;
  line-height: 1.3em;
}
.simOptSettings div {
  margin-top: 5px;
  font-weight: bold;
}
.simOptSettings select {
  padding: 5px;
  width: 60%;
  border: 1px solid #ccc;
  font-size: 16px;
  font-weight: bold;
  line-height: 1;
  vertical-align: middle;
  text-align: center;
  box-sizing: border-box;
}
.simOptInputDisp {
  display: none;
  overflow: hidden;
}
.simOptInput .simOptInputBox input[type="radio"]:checked + .simOptInputPanel .simOptInputDisp {
  display: block;
  animation: fadeIn 300ms ease 0s;
}
.simOptInputDisp .simOptArrow {
  margin-top: -25px;
  color: #447ff6;
  font-size: 46px;
  display: block;
  text-align: center;
}
.simOptInputData {
  padding: 10px;
  border: 3px solid #447ff6;
  border-radius: 3px;
}

/* オプションご案内ボックス */
.option-information {
  margin-top: 80px;
  border: 1px solid #026699;
}
.option-information h4 {
  padding: 1em 1.5em;
  color: #333;
}
.option-information > p {
  padding: 10px;
}
.option-information section {
  display: flex;
  padding: 20px;
}
.option-information img {
  display: block;
  width: 120px;
  margin-right: 20px;
  padding: 5px;
  border: 1px solid #ccc;
}
.option-information h5 {
  margin-bottom: 10px;
  font-size: 1rem;
}
.option-information a:link, .option-information a:visited, .option-information a:hover {
  position: relative;
  display: block;
  width: 18em;
  height: 2.4em;
  line-height: 2.4em;
  margin: 10px auto;
  border: 1px solid #026699;
  color: #026699;
  border-radius: 4px;
  font-size: 0.9rem;
  text-align: center;
  text-decoration: none;
}
.option-information a:hover {
  background: #026699;
  color: #fff;
}
.option-information a:after {
  position: absolute;
  top: 0;
  right: 0.8em;
  content: "\f061";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}

/* #################################
###  フロート見積り
################################# */
.simNowBoxWrap {
  position: absolute;
  top: -10px;
  left: 695px;
  width: 210px;
  opacity: 0;
  animation: fadeSim 0.5s ease 0.5s 1 forwards;
}
.simNowBox {
  position: absolute;
  top: 0;
  right: 0;
  margin-top: 10px;
  width: 210px;
  box-shadow: 2px 2px 0px 0px rgba(0, 0, 0, 0.1);
}
.simNowBox h2 {
  padding: 8px 8px 5px 8px;
  background: #006699;
  font-size: 15px;
  color: #fff;
}
.simProject {
  border: 1px solid #ccc;
  border-radius: 0 0 2px 2px;
  background: #fdf8f4;
  box-sizing: border-box;
}
.simProject dl {
  position: relative;
  border-bottom: 1px solid #ccc;
}
.simProject dl dt {
  padding: 8px 8px 2px;
  font-size: 14px;
  font-weight: bold;
  color: #006699;
}
.simProject dl dd {
  padding: 0 8px 8px 8px;
  border-bottom: 1px dotted #ccc;
  font-size: 12px;
  line-height: 1.5em;
}
.simProject dl dd:last-child {
  border-bottom: 0 none transparent;
}
.simProject dl:before, .simProject dl:after {
  position: absolute;
  left: 50%;
  bottom: -17px;
  border: solid transparent;
  content: '';
  height: 0;
  width: 0;
  border-width: 8px;
}
.simProject dl:before {
  border-top-color: #c3c3c3;
  margin-top: -8px;
  margin-left: -8px;
}
.simProject dl:after {
  border-top-color: #fdf8f4;
  margin: 0 0 2px -8px;
}
.simProjectTbl {
  margin: 10px 8px 0 8px;
  width: 192px;
  font-size: 13px;
}
.simProjectTbl th {
  padding: 5px 0 2px 0;
  border-bottom: 1px dotted #ccc;
  text-align: left;
}
.simProjectTbl td {
  padding: 5px 0 2px 0;
  border-bottom: 1px dotted #ccc;
  text-align: right;
  font-weight: bold;
}
.simProjectTbl .tax th, .simProjectTbl .tax td {
  font-size: 11px;
  font-weight: normal;
}
.simProjectTbl .total th, .simProjectTbl .total td {
  padding-top: 10px;
  border-bottom: 0 none transparent;
  font-weight: bold;
  color: #cc0000;
}
.simProjectTbl .total td em {
  margin-right: 2px;
  font-style: normal;
  font-size: 16px;
  font-weight: bold;
}
.simProjectBtn {
  margin: 8px 8px 8px 8px;
  text-align: center;
}
.simProjectBtn button {
  padding: 15px;
  background: #447ff6;
  border: 0 none transparent;
  border-radius: 4px;
  font-size: 16px;
  font-weight: bold;
  line-height: 1em;
  text-align: left;
  color: #fff;
  cursor: pointer;
}
.simProjectBtn button span {
  display: inline-block;
  font-size: 10px;
  line-height: 1em;
  font-weight: normal;
}
.simProjectBtn button i {
  display: block;
  float: right;
  margin-top: -11px;
  text-align: right;
  font-size: 21px;
}
.simProjectBtn button:hover, .simProjectBtn button:active {
  opacity: 0.8;
}
.simProjectBtn span.simClear {
  display: inherit;
  margin-top: 8px;
  padding: 6px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background: #efefef;
  font-size: 12px;
  color: #666;
  cursor: pointer;
}
.simProjectBtn span.simClear:hover, .simProjectBtn span.simClear:active {
  opacity: 0.8;
}

/* 選択中ビニールシート追従サムネ */
.simFollowImgBox {
  width: 180px;
  margin: 5px auto;
}
.simFollowImg {
  display: block;
  width: 100%;
  pointer-events: none;
}
.simFollowImgBox span {
  display: flex;
  margin-top: 5px;
  gap: 5px 3px;
  flex-wrap: wrap;
}
.simFollowImgBox span img {
  width: 24px;
  height: 24px;
}

/* カラー */
.colBoxOpt {
  margin-left: 0px;
}


/* #################################
###  絞り込みメニュー
################################# */
.simItemCategory {
  margin: 37px 0 30px 0;
  padding: 10px 10px 3px 10px;
  border: 1px solid #ccc;
  border-radius: 2px;
  box-shadow: 2px 2px 0px 0px rgba(0, 0, 0, 0.1);
  box-sizing: border-box;
}
.simItemCategory dt {
  height: 0;
}
.simItemCategory dt span {
  display: inline-block;
  position: relative;
  top: -32px;
  margin-left: 10px;
  padding: 5px 12px 0 12px;
  height: 22px;
  font-size: 12px;
  font-weight: bold;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-radius: 3px 3px 0 0;
  background: #fff;
  box-sizing: border-box;
}
.simItemCategory dt + div {
  display: flex;
  flex-wrap: wrap;
}
.simItemCategory dd {
  flex-shrink: 1;
  margin: 5px 2px;
  box-sizing: border-box;
}
.simItemCategory.simItemCategoryKinou:not(.noren) dd:last-child {
  margin-left: auto;
}
.simItemCategory dd input {
  position: fixed;
  top: -100%;
  left: -100%;
}
.simItemCategory dd span {
  cursor: pointer;
  display: inline-block;
  height: 2.4em;
  line-height: 2.4em;
  padding: 0 8px;
  color: #006699;
  background-color: #efefef;
  background-position: 6px center;
  background-repeat: no-repeat;
  border-radius: 3px;
  box-sizing: border-box;
  font-size: 15px;
}
.simItemCategory dd span small {
  flex-basis: 44px;
  font-size: 14px;
  line-height: 1.1em;
}
.simItemCategoryKinou:not(.noren) dd:last-child span {
  background: #fff !important;
  border: 1px solid #006699 !important;
  color: #006699 !important;
}
.simItemCategory dd input[type="radio"]:checked + span, .simItemCategory dd input[type="checkbox"]:checked + span {
  background-color: #006699;
  color: #fff;
}
.simItemCategory :disabled + span {
  pointer-events: none;
  opacity: 0.2;
}
.simItemCategory img[src*="icon"] {
  display: inline-block;
  width: 22px;
  margin: 0 5px 0 0;
  vertical-align: middle;
  pointer-events: none;
}
.simItemCategory label span:hover, .simItemCategory label span:active {
  opacity: 0.8;
}
/* ソート */
.item-sort .simChoiceList {
  display: flex;
  flex-direction: row;
}
.item-sort .simChoiceList li {
  margin: 0 0 0 10px;
}
.item-sort .simChoiceList li:first-child {
  flex-shrink: 1;
}
.allsheet {
  display: block;
  text-align: center;
  font-size: 1rem;
  font-weight: bold;
  padding: 10px 0;
  width: auto;
}

/* #################################
###  担当者コメント・モーダル
################################# */
.simCmt {
  margin: 20px 0;
  background: #f9f4ee;
  border-radius: 4px;
}
.simCmt .simCmtTtl {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  padding: 5px 10px 0 10px;
  border-bottom: 1px dotted #333;
  font-size: 13px;
  font-weight: bold;
}
.simCmt .simCmtTtl img {
  vertical-align: middle;
}
.simCmt p {
  padding: 12px;
  font-size: 13px;
  line-height: 1.5em;
}
.simCmtModalBtn {
  margin-left: auto;
}
.simCmtModalBtn a {
  display: inline-block;
  padding: 0 8px;
  height: 20px;
  border-radius: 4px;
  border-style: none;
  background: #447ff6;
  font-size: 11px;
  line-height: 20px;
  font-weight: normal;
  text-align: center;
  text-decoration: none;
  box-shadow: 1px 1px 0 0 #006699;
  box-sizing: border-box;
  color: #fff;
  cursor: pointer;
}
.simCmtModalBtn a:hover {
  opacity: .8;
}
.simCmtModalBtn a:active {
  position: relative;
  top: 1px;
  left: 1px;
  box-shadow: none;
  opacity: .8;
}
.mdl-contents {
  display: none;
}
/* モーダル内テーブル */
.simModalTable {
  font-size: 13px;
}
.simModalTable h6 {
  padding: 0 10px;
  height: 28px;
  line-height: 28px;
  border-radius: 3px;
  background: #006699;
  color: #fff;
}
.simModalTableWrap {
  display: flex;
}
.simModalTableCont {
	margin: 25px 25px 0 0;
}
.simModalTableTtl {
  font-weight: bold;
}
.simModalTableData {
  margin-top: 10px;
  border: 1px solid #ccc;
  border-collapse: collapse;
}
.simModalTableData th {
  padding: 4px 12px;
  border: 1px solid #ccc;
  background: #ffffeb;
}
.simModalTableData tr:first-child th {
  background: #efefef;
  text-align: center;
}
.simModalTableData td {
  padding: 4px 12px;
  border: 1px solid #ccc;
}
/* モーダル部材詳細テーブル */
.simMaterialsTbl {
  margin-top: 20px;
  border: 1px solid #ccc;
  border-collapse: collapse;
}
.simMaterialsTbl th {
  padding: 10px;
  border: 1px solid #ccc;
  background: #daeef8;
  font-size: 16px;
  font-weight: bold;
  vertical-align: top;
}
.simMaterialsTbl td {
  padding: 10px;
  border: 1px solid #ccc;
  vertical-align: top;
}
.simMaterialsTblFlame {
  width: 100%;
}
.simMaterialsTblLabel {
  display: block;
  margin: -10px -10px 0 -10px;
  padding: 5px 10px;
  background: #efefef;
}
.simMaterialsTblImg {
  display: block;
}
.simMaterialsTblImgFigure {
  margin: 20px;
}
.simMaterialsTbl .simChoiceDescription {
	display: block;
}

/* セット商品テーブル */
.simSetItemTbl {
  width: 100%;
}
.simSetItemTbl th, .simSetItemTbl td {
  padding: 10px;
  border: 1px dashed #ccc;
  border-collapse: collapse;
  font-size: 0.8rem;
}
.simSetItemTbl th {
  background: #f5f5f5;
  white-space: nowrap;
  text-align: center;
}
.simSetItemTbl img {
  display: block;
  width: 60px;
}
.simSetItemTbl td {
  white-space: nowrap;
}
.simSetItemTbl td:nth-child(1) {
  width: 60px;
}
.simSetItemTbl td:nth-child(2) {
  width: 99%;
  white-space: pre-wrap;
}
.simSetItemTbl td:nth-child(3) {
  text-align: right;
}
.simSetItemTbl td:nth-child(4) {
  text-align: right;
}
/* 組み込みセット */
.sim_kumikomi_setBox{
  border: 5px solid #b5b5b6;
    padding: 10px;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.5em;
    margin-top: 20px;
}
.sim_kumikomi_setBox p{
  font-weight: bold;
  font-size: 15px;
  margin: 10px 0 10px 0;
  /*display: inline-flex;*/
  width: 100%;
  line-height: 22px;
  position: relative;
}
.sim_kumikomi_setBox p .sim_daiko{
color: #e60012;
font-size: 1.1rem;
}
.sim_kumikomi_setBox p .sim_railsetL{
  padding: 5px 5px 2px 12px;
  border: 1px solid #1f74e1;
  border-radius: 4px;
  /* background: #1f74e1; */
  font-size: .85rem;
  line-height: 1.4;
  box-sizing: border-box;
  margin-right: 0;
  justify-content: flex-end;
  /* display: block; */
  margin-left: auto;
  position: absolute;
  top: 5px;
  right: 5px;
}
.sim_railsetL a{
  text-decoration: none;
}
.sim_setdaikoBox{
background-color: #ebfcff;
padding: 10px 15px
}
.sim_setdaikoBox dl dt{
  background-color: #231815;
  color: #fff;
  padding: 5px 10px;
  display: inline-block;
  border-radius: 5px;
  margin: 10px 0;
}
.sim_kumikomi_flow{
  font-weight: bold;
}
.sim_kumikomi_flow li{
  margin: 5px 0;
}
.sim_kumikomi_flow li strong,
.sim_kumikomi_diy li strong{
  font-size: 15px;
  padding-right: 5px;
}
.sim_kumikomi_diy{
  margin-top: 17px;
}
.sim_kumikomi_diy li{
  margin-left: 16px;
}
/* #################################
###  media query
################################# */
/* Small devices (480px and down) */
@media (max-width: 480px) {
  .simHeader h2 {
    font-size: 18px;
    text-align: left;
  }
  .simHeaderGuide {
    padding: 15px;
    border: 0;
    background-size: cover;
  }
  .simHeaderGuide h3 {
    padding: 10px 10px 5px 10px;
    border-radius: 5px 5px 0 0;
    background: rgba(255, 255, 255, 0.8);
    font-size: 14px;
    line-height: 1.4em;
    font-weight: bold;
  }
  .simHeaderGuide p {
    padding: 0 10px 10px 10px;
    position: static;
    z-index: 1;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 0 0 5px 5px;
    font-size: 13px;
    line-height: 1.4;
  }
  .simImg {
    display: none;
  }
  .simStepBox {
    position: static;
    width: auto;
  }
  .simStepBox h4 {
    margin: 30px 0 15px 0;
  }
  .simStepBox p {
    font-size: 14px;
  }
  .simItemSelect {
    margin: 0 8px;
  }
  .simItemSample {
    width: 100%;
    box-sizing: border-box;
  }
  .simItemSample {
    text-align: center;
  }
  .simItemSample img {
    display: block;
    width: 100%;
  }
  .simItemSizeAlert {
    padding: 8px 10px;
    font-size: 12px;
    font-weight: normal;
    line-height: 1.5;
  }
  .simDetailLink {
    font-size: 0.78rem;
  }  
  .simBoxOpt {
    margin: 0 0 0 8px;
  }
  .simStepBox .simBoxOpt p {
    font-size: 13px;
  }
  .simBoxOpt h5 {
    margin: 30px 0 15px;
    padding: 6px 8px 4px 8px;
    font-size: 16px;
  }
  .simOptMainImg, .simOptSubImg, .simOptCmt {
    width: 47%;
    margin-right: 3%
  }
  .simBoxOpt .simAttList {
    margin: 20px 8px 20px 0;
  }
  .simOptCmt .simOptCmtTtl {
    font-size: 12px;
  }
  .simStepBox .simBoxOpt .simOptCmt p {
    padding: 8px;
    font-size: 12px;
  }
  .simOptInput {
    margin: 15px 8px 0 0;
    width: 100%;
    box-sizing: border-box;
  }
  .simOptInput .simOptInputBox {
    margin-bottom: 10px;
    position: static;
  }
  .simOptInputPanel {
    position: static;
  }
  .simOptInputPanel label span:hover, .simOptInputPanel label span:active {
    opacity: 1;
  }
  .simOptInputData {
    margin-right: 8px;
  }
  .simChoiceList > li {
    margin: 20px 0;
  }
  .simChoiceList2 > li {
    margin: 20px 0;
  }
  .simChoiceList.sp-col1 > li {
    flex-basis: 100%;
    max-width: inherit;
    margin: 20px 0;
  }
  .simChoiceList2.sp-col1 > li {
    flex-basis: 100%;
    max-width: inherit;
    margin: 20px 0;
  }
  .simChoiceList2.sp-col2 > li {
    flex-basis: 100%;
    max-width: inherit;
    margin: 20px 0;
  }
  .sp-col2 li {
    width: 100%;
    padding: 0 10px;
}
.btn3col {
  min-height: 40px;
}
  .simChoiceList.sp-col2 {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
  }
  .simChoiceList2.sp-col2 {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
  }
  .simChoiceList2.sp-col3 {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
  }
  .simChoiceList.sp-col2 > li {
    width: auto;
    flex-basis: calc(50% - 10px);
    max-width: calc(50% - 10px);
    margin: 20px 0;
    padding: 0;
  }
  .simChoiceList2.sp-col3 > li {
    width: auto;
    flex-basis: calc(50% - 10px);
    max-width: calc(50% - 10px);
    margin: 20px 0;
    padding: 0;
}
  /* #################################
	###  サイズ入力
	################################# */
  .simItemSizeMultiple li[data-jump] {
    position: relative;
    flex-wrap: wrap;
    padding-top: 10px;
    padding-left: 2.5em;
  }
  .simItemSizeMultiple li[data-jump]:before {
    position: absolute;
    top: 10px;
    left: 5px;
  }
  .simItemSizeMultiple input[type="number"] {
    width: 5em;
  }
  .simItemSizeMultiple input[type="number"]:nth-of-type(3) {
    width: 3em;
  }
  .simItemSizeMultiple li[data-jump] span:nth-of-type(3) {
    width: calc(100% - 1em);
    padding-left: 1em;
  }
  .simItemSizeMultiple .remove-size {
    position: absolute;
    top: 10px;
    right: 0;
  }
  .meters, .meters-column-inner {
    margin: 10px 10px 0 0;
    padding: 0.5em;
  }
  /* #################################
	###  絞り込みメニュー
	################################# */
  .simItemCategory {
    margin: 37px 8px 30px 8px;
    padding: 10px 6px 3px 6px;
    box-sizing: border-box;
  }
  .simItemCategory dt span {
    line-height: 22px;
  }
  /* #################################
	###  商品選択
	################################# */
  [class^="simItemList"] {
    margin: 40px 4px 0 4px;
  }
  [class^="simItemList"] li {
    flex-basis: calc(50% - 1px);
    margin-right: 0;
    margin-bottom: 2em;
  }
  [class^="simItemList"] li label {
    margin: 0 4px;
    width: auto;
  }
  [class^="simItemList"] li .simItemCards .simItemName {
    height: 4.5em;
    line-height: 1.3;
  }
  [class^="simItemList"] li .simItemCards .simTagsRecommend {
    font-size: 12px;
    line-height: 12px;
  }
  [class^="simItemList"] input[type="radio"] + label:before, [class^="simItemList"] input[type="radio"]:checked + label:before, [class^="simItemList"] input[type="radio"]:checked + label:after {
    left: 50%;
    transform: translate(-50%, 0);
  }
  [class^="simItemList"] li label:hover, [class^="simItemList"] li label:active {
    opacity: 1;
  }
  /* #################################
	###  カラー選択
	################################# */
  .simColorList {
    display: block !important;
    margin: 10px 8px 20px 8px;
  }
  .simColorList li {
    flex-basis: auto;
    margin-right: 0;
    margin-bottom: 10px;
    box-sizing: border-box;
  }
  .simColorList .simColorCmnt br {
    display: none;
  }
  .simColorList li label:hover, .simColorList li label:active {
    opacity: 1;
  }
  /* #################################
	###  タイプ選択
	################################# */
  .simChoiceList,.simChoiceList2 {
    display: block;
    padding: 0 20px;
    justify-content: space-around;
  }
  .simChoiceItem {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
  }
  .simChoiceItem input + label {
    order: 0;
    flex-basis: 100%;
  }
  .simChoiceList.spec-info .simChoiceItem .simChoiceImg, .simChoiceList2.spec-info .simChoiceItem .simChoiceImg, .simChoiceList.spec-info .simChoiceItem .simTypePrice, .simChoiceList.spec-info .simChoiceItem .simChoiceModalLink {
    flex-shrink: 1;
  }
  .simChoiceList.spec-info .simChoiceItem .simChoiceImg {
    order: 2;
    flex-basis: 120px;
  }
  .simChoiceList2.spec-info .simChoiceItem .simChoiceImg {
    order: 2;
    flex-basis: 120px;
  }
  .simChoiceList.spec-info .simChoiceItem .simChoiceImg,.simChoiceList2.spec-info .simChoiceItem .simChoiceImg {
		width: 120px;
    padding-top: 20px;
	}
  .simChoiceLis2.spec-info .simChoiceItem .simChoiceImg {
		width: 120px;
	}
  .simChoiceList.spec-info .simChoiceItem .simChoiceImg .simTagsRecommend {
		top:0;
    right: -24px;
    /*right: auto;
		left: 100%;
		white-space: nowrap;*/
  }
  .simChoiceList2.spec-info .simChoiceItem .simChoiceImg .simTagsRecommend {
		right: auto;
		left: 100%;
		white-space: nowrap;
  }
  .simChoiceList.spec-info .simChoiceItem .simTypePrice {
    order: 3;
    margin: 0;
  }
  .simChoiceList2.spec-info .simChoiceItem .simTypePrice {
    order: 3;
    margin: 0;
  }
  .simChoiceList.spec-info .simChoiceItem .simChoiceModalLink {
    order: 2;
    margin: 0 1em;
  }
  .simChoiceList2.spec-info .simChoiceItem .simChoiceModalLink {
    order: 2;
    margin: 0 1em;
  }

  .simChoiceList.spec-info .simChoiceItem .simChoiceDescription {
    order: 4;
  }
  .simChoiceList2.spec-info .simChoiceItem .simChoiceDescription {
    order: 4;
  }
  .simChoiceList2.sp-col3.spec-info .simChoiceItem .simChoiceImg .simTagsRecommend {
    top: 0;
    right: -20px;
    left: 47%;
  }
  
  /* #################################
	###  セット商品
	################################# */
  .simOptTblHeader {
    display: none;
  }
  .simOptInputTbl .simOptTbl {
    position: relative;
  }
  .simOptInputTbl .simOptTbl .simOptTblName {
    position: absolute;
    top: 1.5em;
    left: 3em;
    display: block;
    width: auto;
  }
  .simOptInputTbl .simOptTbl .simOptTblImg {
    position: absolute;
    top: 1em;
    right: 1em;
    display: inline-block;
    z-index: 100;
  }
  .simOptInputTbl label input[type="radio"] + .simOptTbl td.simOptTblImg, .simOptInputTbl label input[type="radio"] + .simOptTbl td.simOptTblName {
    border: none;
    padding: 0;
    background: none;
    z-index: 1;
  }
  .simOptInputTbl label input[type="radio"] + .simOptTbl td.simOptTblImg:before, .simOptInputTbl label input[type="radio"] + .simOptTbl td.simOptTblName:before {
    display: none;
  }
  .simOptTbl .simOptTblName .simOptTblDescription {
    display: inline-block;
    margin-left: 1em;
  }
  .simOptInputTbl .simOptTbl .simOptTblCheck {
    width: 2em;
  }
  .simOptInputTbl .simOptTbl td {
    position: relative;
    padding: 3em 0 0 0;
  }
  .simOptTblAllLength {
    z-index: 0;
  }
  .simOptInputTbl .simOptTbl td:before {
    display: block;
    width: 100%;
    background: #c8c8c8;
    color: #fff;
  }
  .simOptInputTbl .simOptTbl .simOptTblPrice, .simOptInputTbl .simOptTbl .simOptTblLength, .simOptInputTbl .simOptTbl .simOptTblCount, .simOptInputTbl .simOptTbl .simOptTblAllLength {
    width: auto;
  }
  .simOptInputTbl .simOptTbl .simOptTblPrice:before {
    content: "価格";
  }
  .simOptInputTbl .simOptTbl .simOptTblLength:before {
    content: "長さ";
  }
  .simOptInputTbl .simOptTbl .simOptTblCount:before {
    content: "本数";
  }
  .simOptInputTbl .simOptTbl .simOptTblAllLength:before {
    content: "全長";
  }
  .simOptInputTbl label:hover, .simOptInputTbl label:active {
    opacity: 1;
  }
  /* 画像付きセットリスト */
  .setcontent {
    display: block;
    padding: 20px;
  }
  .setcontent li {
    width: 100%;
    margin: 10px 0;
  }
  .setcontent dl dt {
    border: 1px solid #ccc;
    width: 50px;
    margin-right: 10px;
  }
  .setcontent dl dd {
    font-size: 14px;
    width: 100%;
  }
  /* #################################
	###  枠線つき画像radio
	################################# */
  .simImgChoiceList {
    flex-direction: column;
  }
  .simImgChoiceList li {
    margin-bottom: 3em;
  }
  .simImgChoiceList li .simImgChoiceCards .simImgChoiceCardsInner {
    flex-direction: row;
    align-items: center;
  }
  .simImgChoiceList .simImgChoiceImg {
		width: 100%;
  }
  .simImgChoiceList .simImgChoiceImg img {
    display: block;
    width: 100%;
    max-width: none;
		margin: 0 auto;
  }
  .simImgChoiceList li .simImgChoiceCards .simImgChoiceCardsInner .simImgChoiceDescription {
    padding: 1em;
  }
	 .simImgChoiceData.simOptInputDisp {
    flex-basis: 100%;
  }
  /* #################################
	###  担当者コメント・モーダル
	################################# */
  .simCmtModalBtn, .simCmtModalBtnL {
    margin: 0 0 4px auto;
  }
  .simCmtModalBtn a, .simCmtModalBtnL a {
    display: inline-block;
    padding: 1px 8px;
    height: 20px;
    border-radius: 4px;
    border-style: none;
    background: #447ff6;
    font-size: 11px;
    line-height: 20px;
    font-weight: normal;
    text-align: center;
    text-decoration: none;
    box-shadow: 1px 1px 0 0 #006699;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
  }
  .simCmtModalBtn a:hover, .simCmtModalBtnL a:hover {
    opacity: .8;
  }
  .simCmtModalBtn a:active, .simCmtModalBtnL a:active {
    position: relative;
    top: 1px;
    left: 1px;
    box-shadow: none;
    opacity: .8;
  }
  .simChoiceItem > .simTagsRecommend {
    bottom: -0.4em;
    right: 0;
}
  .simChoiceImgModal {
    display: block;
    width: 100%;
    height: 100%;
    background: none;
    opacity: 1;
  }
  .simChoiceImgModal:before {
    content: "詳細を見る";
    display: inline-block;
    position: absolute;
    bottom: -0.5em;
    left: 0;
    width: 100%;
    height: 2em;
    line-height: 2em;
    font-size: 0.7em;
    text-align: center;
  }
  .simChoiceImgModal small {
    display: none;
  }
  .modaal-inner-wrapper {
    padding: 0;
  }
  .modaal-container {
    width: calc(100vw - 20px);
    margin: 60px 10px 10px 10px;
  }
  .modaal-content-container {
    padding: 10px;
  }
  .modaal-wrapper .modaal-close {
    right: auto;
    left: 0;
  }
	.simModalTableWrap {
		display: block;
	}
	.simModalTableCont {
		margin-right: 0;
	}
  .simSetItemTbl {
    display: block;
  }
  .simSetItemTbl thead {
    display: none;
  }
  .simSetItemTbl tr {
    display: flex;
    flex-wrap: wrap;
  }
  .simSetItemTbl td {
    border: 0;
  }
  .simMaterialsTbl td {
    display: block;
  }
  .simMaterialsTblImg img {
    display: block;
    margin: 15px auto;
  }
  /* #################################
	###  フロート見積り
	################################# */
  .simNowBoxWrap {
    display: none;
  }
  /* 組み込みセット */
.sim_kumikomi_setBox{
  border: 5px solid #b5b5b6;
    padding: 10px;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.5em;
    margin-top: 20px;
}
.sim_kumikomi_setBox p{
  font-weight: bold;
  font-size: 15px;
  margin: 10px 0 20px 0;
  display: flex;
  width: 100%;
  line-height: 30px;
  flex-wrap: wrap;
  justify-content: space-between;
}
.sim_kumikomi_setBox p .sim_daiko{
color: #e60012;
}
.sim_kumikomi_setBox p .sim_railsetL{
  padding: 5px 5px 2px 12px;
  border: 1px solid #1f74e1;
  border-radius: 4px;
  /* background: #1f74e1; */
  font-size: .85rem;
  line-height: 1.4;
  box-sizing: border-box;
  margin-right: 0;
  justify-content: flex-end;
  /* display: block; */
  margin-left: auto;
  position: absolute;
  top: 62px;
  right: 0px;
}
.sim_railsetL a{
  text-decoration: none;
}
.sim_setdaikoBox{
background-color: #ebfcff;
padding: 10px 15px;
margin-top: 42px;
}
.sim_setdaikoBox dl dt{
  background-color: #231815;
  color: #fff;
  padding: 5px 10px;
  display: inline-block;
  border-radius: 5px;
  margin: 10px 0;
}
.sim_kumikomi_flow{
  font-weight: bold;
}
.sim_kumikomi_flow li{
  margin: 5px 0;
}
.sim_kumikomi_flow li strong,
.sim_kumikomi_diy li strong{
  font-size: 15px;
  padding-right: 5px;
}
.sim_kumikomi_diy{
  margin-top: 17px;
}
.sim_kumikomi_diy li{
  margin-left: 16px;
}
}
/* 上部タブ */
.simulator_tab_menu{
  display: flex;
  gap: 10px;
}
ul.simulator_tab_menu a {
  width: 200px;
  display: block;
  padding: 10px;
  border-radius: 8px 8px 0 0;
  color: #333333;
  text-align: center;
  line-height: 1.5;
  border: solid 2px #c8c8c8;
  border-bottom: none;
  margin-bottom: 5px;
  font-size: 12px;
}
ul.simulator_tab_menu .current a {
  color: #4E9BD5;
  border: solid 2px #4E9BD5;
  border-bottom: none;
}
ul.simulator_tab_menu a span{
  position: relative;
  font-size: 16px;
  font-weight: bold;
  display: inline-block;
}
ul.simulator_tab_menu a span:before {
  position: absolute;
  top: -3px;
  left: -24px;
  content: "\f107";
  display: inline-block;
  margin: 0 0.5em 0 0;
  color: #c8c8c8;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 1.2rem;
  vertical-align: top;
  transition: all 0.2s 0s ease;
}
ul.simulator_tab_menu .current a span:before {
  pointer-events: none;
  color: #4E9BD5;
  border-color: #4E9BD5;
}
ul.simulator_tab_menu li:last-child {
  margin-left: auto;
}
/* Medium devices (768px and down) */
@media (max-width: 768px) {
  .simOptInputPanel label span:hover, .simOptInputPanel label span:active, .simItemCategory label span:hover, .simItemCategory label span:active, [class^="simItemList"] li label:hover, [class^="simItemList"] li label:active, .simColorList li label:hover, .simColorList li label:active {
    opacity: 1;
  }
  ul.simulator_tab_menu {
    display: block;
    padding: 10px;
  }
  ul.simulator_tab_menu > li {
    display: table;
    width: 100%;
    margin: 0 0 5px 0;
  }
  ul.simulator_tab_menu a {
    display: table-cell;
    height: 3.8em;
    padding: 0.5em 0;
    border: 1px solid #ccc;
    border-radius: 0;
    vertical-align: middle;
  }
  ul.simulator_tab_menu a::before {
    top: 0.6em;
  }
  ul.simulator_tab_menu .current a {
    border: solid 2px #4E9BD5;
  }
}