@charset "UTF-8";

/*---------------
LAST UP DETA 2015/09
createby:Oda
オプション設定画面スタイル
----------------*/
#layout_contents {
position:relative;
}

/*------------------------------------
オプション設定画面共通
------------------------------------*/

.optionBuy {
/*min-width:850px;*/
font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;

}


.optionBuy h2{
border:none;
background:#F0F0F0;
padding:6px 2px 4px 2px !important;
margin:0px 0px 10px 0px !important;
border-top:1px solid #C1C1C1;
color:#000000 !important;
}

.optionBuy .optionBuy__formWraps h3{
border:none;
padding:6px 2px 4px 6px;
margin:0px;
border-top:1px solid #C1C1C1;
border-left:5px solid #C1C1C1;
color:#000000 !important;
font-size:15px
}

.optionBuy h4{
border:none;
background:#F0F0F0;
padding:6px 2px 4px 2px;
margin:0px;
border-top:1px solid #C1C1C1;
font-size:18px;
}

.optionBuy h5{
border:none;
border-left:6px solid #383838;
padding:0px 2px;
margin-bottom:5px;
color: #383838;
font-size:115%;
/*background:#F8F8F8;*/
}

.optionBuy__formWraps {
margin-top:10px;
border-left:1px solid #476246;
padding:0px 0px 10px 0px;
font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}

/*-----商品共通----*/
.optionBuy__product td {
vertical-align:top !important;
}

/*-----商品画像----*/
.optionBuy__images--big {
width:350px;
}

.optionBuy__images--big img {
border:1px solid #CCCCCC;
}
.optionBuy__images--big .itd_img
{ line-height: 0em; }

.optionBuy__images--big #thumImgs img {
}

.optionBuy__images--big .itd_caution_on {
background:#000000;
color:#FFFFFF;
padding:2px;
margin-bottom:5px;
}

.optionBuy__images--big #imgCaution {
padding:2px;
margin-bottom:5px;
}

/*-----商品情報----*/
.optionBuy__images--detail {
padding:5px;
word-break: break-all;
}

/*-----ラインナップ----*/
.optionBuy__lineup {
margin:0px;
width:70%;
float:left;
margin-right:5px;
}

.optionBuy__lineup h6 {
background:#000000;
color:#FFFFFF;
padding:2px 4px;
margin:0px 0px 4px 0px;
}

.optionBuy__lineup .item_images {
position:relative;
border:none;
}

.optionBuy__lineup .item_image_detail img {
height:80px;
width:80px;
}

.optionBuy__images--caption {
position:absolute;
bottom:4px;
left:1px;
background:#666666;
opacity:0.8;
color:#FFFFFF;
padding:4px;
text-decoration:none;
}

/*-----アイコン-----*/
.optionBuy__pict {
}

.optionBuy .optionBuy_titile {
color:#0A7529;
font-size:15px;
margin:0px 0px 0px 0px;
position:relative;
left:-16px;
}

.optionBuy .optionBuy_titile img {
vertical-align:-3px;
margin-right:1px;
}

/*-----お気に入り-----*/
.itd_facv_bottom {
margin:10px 0px;
}

/*-------------------------------------
インフォメーションナビ
------------------------------------*/
.optionBuy__infonavi {
position: absolute;
top:0px;
right:5px;
width:150px;
padding:5px;
border:2px solid #009900;
border-radius:8px;
box-shadow:0px 1px 2px 1px #999999;
background:URL(//jp.images-monotaro.com/img/optionBuy/infonavi_bg.gif) repeat-x top;
}

.optionBuy__infonavi h5 {
margin:20px 0px 0px 0px;
padding:0px;
border:none;
border-bottom:2px solid #009900;
height:20px;
}

/*通常価格*/
.optionBuy__infonavi--price.std{
color:#808080;
margin:0px 0px 10px 0px;
}
.optionBuy__infonavi--price.std .std-price{
    display:block;
    text-align:right;
}


.optionBuy__infonavi--price {
font-size:1.3rem;
padding:0px;
margin:0px 5px;
}

.optionBuy__infonavi--price strong {
font-size:2.1rem;
display:block;
text-align:right;
color:#FF0000;
margin:5px 0px 10px 0px;
}

/*出荷目安*/
.optionBuy__infonavi--shipsbox{
text-align:right;
}

.optionBuy__infonavi--ships {
text-align:right;
padding:0px;
margin:0px;
background:#000099;
color:#FFFFFF;
font-size:1.1rem;
padding:4px;
border-radius:4px;
font-weight:bold;
}
/*出荷目安説明リンク*/
a.optionBuy__infonavi--shipsinfo {
    display: block;
    font-size: 1rem;
    margin-top: 5px;
}

.optionBuy__infonavi--ships strong {
	font-size:110%;
	margin-right:3px;
}

.optionBuy__infonavi .panel_icon {
position:relative;
top:-16px;
border:none;
background:none;
color: #FFFFFF;
padding:0px;
margin:5px 0px 0px 0px;
}

.optionBuy__infonavi--item {
margin:5px 5px 5px 5px;
line-height:1.5em;
font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;

}

.optionBuy__infonavi--item a {
color: #000000;
}

.optionBuy__infonavi--No {
padding:5px;
color: #999999;
margin:5px 5px 1px 5px;
font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;

}

.optionBuy__infonavi--No strong {
color:#000000;
display:block;
word-break:break-all;
line-height:1.1em;
margin-top:3px;
font-size:120%;
}

.optionBuy__infonavi--basket {
margin:15px 0px;
text-align:center;
background: #FFFFFF;
border-radius:5px;
padding:10px 0px;
margin:0px 5px 5px 5px;
}

.optionBuy__infonavi--basket input {
margin-bottom:5px;
}

.optionBuy__infonavi--basket .add_basket.disabled,.optionBuy__mainnavi--basket .add_basket.disabled {
	opacity: 0.4;
	cursor: default;
}

.optionBuy__infonavi--function {
text-align:center;
}

.optionBuy__infonavi--status{
margin:0px 0px 10px 4px
}

/*-------------------------------------
オプションフォーム全体
------------------------------------*/
/*ビジュアル系*/
.optionBuy__visual .optionBuy__form {
clear:both;
margin:0px 5px 25px 10px;
}

/*リスト系*/
.optionBuy__list .optionBuy__form {
clear:both;
margin:0px 5px 25px 0px;
}

.optionBuy__form h4 {
border-bottom:none;
margin-bottom:10px;
margin-top:0px;
}

.optionBuy__form p {
margin:5px 0px;
}

.optionBuy__form .optionBuy__infoimg {
float:right;
margin-right:30px;
}

.optionBuy__form label {
font-size:125%;
}
.optionBuy__input--name {
font-size:125%;
}
.optionBuy__input input {
font-size:105%;
}


/*-----選択肢に画像付き-----*/
.optionBuy__input--images label {
display:block;
float:left;
margin-right:5px;
margin-bottom:5px;
padding:4px;
position:relative;
}
/*-----選択肢に画像付きは、建材パターン時のみ幅を持たせる-----*/
.optionBuy__formInput .optionBuy__input--images label {
min-width: 40px;
/*max-width: 200px;
max-height: 242px;*/
}

/*--画像・ラジオボタン・キャプション・メッセージを括る枠--*/
.optionBuy__input--choice {
position:relative;
}

/*--画像選択肢--*/
.optionBuy__input--image-choice{
	width:160px;
	min-height:236px;
}

/*--キャプション--*/
.optionBuy__form--caption {
color: #666666;
display:block;
font-size:90%;
padding-top:4px;
}
/*--建材テンプレートでキャプションがあるオプションはキャプション用の高さを用意することで選択肢同士の縦のガタツキをなくする--*/
.optionBuy__formInput .option-guide-messages .optionBuy__form--caption {
max-width:160px;
}

/*-- 　チェック状態　　--*/
.form_state_check {
background:#FFFF99;
}



/*-- 　オプション解除　　--*/
.optionBuy_null{
	vertical-align:-2px;
	margin-left:1px;
	color: #000000;
}

/*-- 　選択不可状態　　--*/
.form_state_unselection .unselection_target {
/*	background: #E8E8E8;*/
	opacity:0.3;
}

.form_state_unselection img.unselection_target {
opacity:0.8;
}

/*-- 　エラー状態　　--*/
.form_state_error {
background:#F5F5DC
}

.form_state_error .messe {
display:block;
color:#FF0000;
font-weight:bold;
}


/*---------------------------------------------------------------
ビジュアルで設定系
---------------------------------------------------------------*/
.optionBuy__visual {
margin-right:165px;
}

/*---------------------------------------------------------------
リストで設定系
---------------------------------------------------------------*/
.optionBuy__list {
}

.optionBuy__list .optionBuy__product {
margin-right:165px;
}

/*入力カラム*/
.optionBuy__formInput__column {
width:20%;
margin-left:2%;
height:600px;
float:left;
overflow-y:auto;
margin-bottom:15px;
border-bottom: 1px solid #cccccc;
border-right: 1px solid #cccccc;
border-top: 1px solid #ffffff;
}

.optionBuy__form--count {
font-size:14px;
}

/*参照項目カラム*/
.optionBuy__formReference__column {
width:77%;
height:600px;
float:left;
overflow-y:auto;
margin-bottom:15px;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
border-right: 1px solid #cccccc;
text-align:center;
}

.optionBuy__formReference--img {
max-width:100%;
}

/*追加工カラム*/

.additionalWork_active,
.additionalWork_default {
margin-left:15px;
margin-bottom:20px;
}
.additionalWork_active label,
.additionalWork_default label{
margin-right:15px;
}


.additionalWork_img{
	vertical-align:-3px;
	margin-left:4px;
}

.additionalWork_default label, .optionBuy__formInput--disabled {
color:#999999;
}

.arbitrary_img {
vertical-align:middle;
}

.optionBuy__form__section .optionBuy__form{
	margin-left:5px;
}

/*-------------------------------------
最終結果周り
------------------------------------*/
.optionBuy__addWraps {
position:relative;
border:2px solid #009900;
border-radius:8px;
margin-top:15px;
padding:10px;
border-radius:5px;
background:URL(//jp.images-monotaro.com/img/optionBuy/infonavi_bg.gif) repeat-x top;
}

.optionBuy__addWraps table {
width:100%;
}
.optionBuy__addWraps table td{
	border-collapse:collapse;
	vertical-align:top;
}

.optionBuy__addWraps .panel_icon {
position:absolute;
top:-6px;
left:5px;
}

.optionBuy__addWraps h5 {
margin:5px 0px 0px 0px;
padding:0px;
border:none;
border-bottom:2px solid #009900;
height:20px;
background:none;
width:100%;
}

.optionBuy__mainnavi__left {
padding:0em 2em;
width:30%;
}

.optionBuy__mainnavi__right {
font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
width:70%;
}
/*通常価格*/
.optionBuy__mainnavi--price.std{
color:#808080;
}
.optionBuy__mainnavi--price.std .std-price{
display:block;
text-align:right;
margin:2px 0px;
}
/*価格*/
.optionBuy__mainnavi--price {
margin-top:10px;
margin-bottom:5px;
white-space: nowrap;
}

.optionBuy__mainnavi--price strong {
display:block;
font-size:30px;
font-weight:bold;
color:#FF0000;
line-height:32px;
text-align:right;
}

/*バスケット周り*/
.optionBuy__mainnavi--basket {
margin:15px 0px;
text-align:center;
}

.optionBuy__mainnavi--basket .imemode_inactive {
margin-bottom:5px;
font-size:1.5rem;
}

/*出荷目安*/
/* 金谷対応前
.optionBuy__mainnavi--ships{
display:block;
text-align:right;
}
.optionBuy__mainnavi--ships span{
text-align: left;
padding:0px;
margin:4px 0px;
background:#000099;
color:#FFFFFF;
font-size:11px;
padding:4px;
border-radius:4px;
font-weight:bold;
}
*/
.optionBuy__mainnavi__ship-area {
text-align: right;
}
.optionBuy__mainnavi--ships {
padding:0px;
margin:4px 0px;
background:#000099;
color:#FFFFFF;
font-size:11px;
padding:4px;
border-radius:4px;
font-weight:bold;
}
/*出荷目安説明リンク*/
a.optionBuy__mainnavi--shipsinfo {
    display: block;
    font-size: 1rem;
    margin-top: 5px;
		text-align:right;
}

.optionBuy__mainnavi--ships strong {
	font-size:120%;
	margin-right:3px;
}

/* URLコピー・設定クリア */
.optionBuy__mainnavi--function {
text-align:right;
padding:0px;
margin:0px;
}

/*品番*/
.optionBuy__mainnavi__right .optionBuy__infonavi--No {
font-size:16px;
margin:8px 0px 10px 0px;
}

.optionBuy__mainnavi__right .optionBuy__infonavi--No strong {
display:block;
}

/*設定情報*/
.optionBuy__mainnavi__right .optionBuy__infonavi--item li{
display: inline;
padding-right: 12px;
}
.optionBuy__mainnavi__right .optionBuy__infonavi--item {
margin:8px 0px;
line-height:1.6em;
margin-bottom:10px;
font-size:110%;
}

.optionBuy__mainnavi__right .optionBuy__infonavi--item a {
color:#000000;
/*border-radius:4px;
background:#FAEBD7;border-bottom:1px solid #000000;*/
padding:0px;
white-space:nowrap;
margin-right:2px;
}


/*-------------------------------------
各種エラー時
------------------------------------*/

/*オプション項目へのエラー*/
.optionBuy .important_option_messe.important_option_messe--text {
	font-size:11px;
	width:150px;
	display:inline-block;
	vertical-align:top;
	line-height:13px;
}

/*オプション項目への注意*/
.optionBuy .attention_product_messe{
	font-weight:bold;
	text-align:left;
}

/*注文コード自体へのエラー*/
.optionBuy .important_product_messe{
	margin:25px 0px 20px 0px;
	padding:6px;
	border-top:2px solid #FF0000;
	border-bottom:2px solid #FF0000;
	color:#FF0000;
	font-weight:bold;
	background:#FFF0F5;
	font-size:115%;
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}
/*注文コード自体へのエラー 廃番誘導*/
.optionBuy .important_product_change{
	margin:0px 5px 10px 5px;
}
.optionBuy .important_product_change strong{
	display:block;
	background:#F5F5DC;
	color:#996600;
	padding:2px;
	border-radius:4px;
}
.optionBuy .important_product_change .productName{
	display:block;
	margin:5px 0px 2px 0px;
	font-weight: bold;
}
.optionBuy .important_product_change .productNo{
	display:inline-block;
}
.optionBuy .important_product_change .merker{
	font-size:90%;
	display:inline-block;
}
.optionBuy .important_product_change .set{
	color: #999999;
	display:inline-block;
	font-size:90%;
}
.optionBuy .important_product_change .price{
	color:#FF0000;
	display:inline-block;
	font-weight:bold;
	font-size:120%;
	font-family:Arial, Helvetica, sans-serif;
}
.optionBuy .important_product_change .image img{
	float:right;
	width:50px;
	border:1px solid #CCCCCC;
}
.optionBuy .important_product_change .reason{
	display:inline-block;
}
/*注文コード自体へのエラー 廃番誘導 メインカラム*/
.optionBuy__mainnavi__right .important_product_change strong{
	text-align:center;
	padding:5px;
	margin:2px 0px;
}
.optionBuy__mainnavi__right .important_product_change .image img{
	float:left;
	width:80px;
	margin-right:5px;
}
.optionBuy__mainnavi__right .important_product_change .price{
	display:block;
	margin:4px 0px;
}

/*オプション設定項目へのエラー メインカラム*/
.optionBuy__mainnavi__right .form_state_error .messe,
.optionBuy__infonavi .form_state_error .messe{
	display: inline;
}

/*　設定解除　*/
.optionBuy__form--blank {
	display: inline-block;
	width: 16px;
	margin-left: 2px;
}

/* コンボボックス用メッセージ */
.optionBuy__form--combo_message {
	margin-top: 8px;
	margin-left: 18px;
}
.optionBuy__form--combo_message>li {
	list-style-type: disc;
}

/*-------------------------------------
元のスタイル打消し
------------------------------------*/

.cms_carousel .title {
background:none;
}

/*-------------------------------------
URLコピー
------------------------------------*/
.optionBuy__infonavi--copydialog,
.optionBuy__mainnavi--copydialog {
	cursor:pointer;
}
.optionBuy__URLcopi__box{
	position:relative;
	padding:30px 10px;
	border:2px solid #000000;
	width:510px;
	text-align:center;
	border-radius:10px;
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
	background:#FFFFFF;
	position: fixed;
	top:25%;
	left:30%;
	z-index:1000;
}

.optionBuy__URLcopi--title{
	font-size:16px;
	margin:10px 0px;
	font-weight:bold;
	color:#009900;
}
.optionBuy__URLcopi--area{
	width:420px;
}
.optionBuy__URLcopi--text{
	margin-bottom:20px;
}
.optionBuy__URLcopi--close{
	position:absolute;
	top:-18px;
	right:-18px;
	cursor:pointer;
}
.optionBuy__URLcopi--area{
	background:#F0FFF0;
	border:1px solid #999999;
	padding:3px;
	font-size:150%;
	margin:0px 0px 15px 0px;
}
.optionBuy__URLcopi__background{
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
filter: alpha(opacity=40);
-moz-opacity: 0.40;
-khtml-opacity: 0.40;
opacity: 0.6;
background: #000000;
z-index:999;
}


/*  rc-tooltip  */
.rc-tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  visibility: visible;
  font-size: 12px;
  line-height: 1.5;
  opacity: 0.9;
}
.rc-tooltip-hidden {
  display: none;
}
.rc-tooltip-placement-top,
.rc-tooltip-placement-topLeft,
.rc-tooltip-placement-topRight {
  padding: 5px 0 9px 0;
}
.rc-tooltip-placement-right,
.rc-tooltip-placement-rightTop,
.rc-tooltip-placement-rightBottom {
  padding: 0 5px 0 9px;
}
.rc-tooltip-placement-bottom,
.rc-tooltip-placement-bottomLeft,
.rc-tooltip-placement-bottomRight {
  padding: 9px 0 5px 0;
}
.rc-tooltip-placement-left,
.rc-tooltip-placement-leftTop,
.rc-tooltip-placement-leftBottom {
  padding: 0 9px 0 5px;
}
.rc-tooltip-inner {
  padding: 8px 10px;
  color: #fff;
  text-align: left;
  text-decoration: none;
  background-color: #373737;
  border-radius: 6px;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.17);
  min-height: 34px;
}
.rc-tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}
.rc-tooltip-placement-top .rc-tooltip-arrow,
.rc-tooltip-placement-topLeft .rc-tooltip-arrow,
.rc-tooltip-placement-topRight .rc-tooltip-arrow {
  bottom: 4px;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #373737;
}
.rc-tooltip-placement-top .rc-tooltip-arrow {
  left: 50%;
}
.rc-tooltip-placement-topLeft .rc-tooltip-arrow {
  left: 15%;
}
.rc-tooltip-placement-topRight .rc-tooltip-arrow {
  right: 15%;
}
.rc-tooltip-placement-right .rc-tooltip-arrow,
.rc-tooltip-placement-rightTop .rc-tooltip-arrow,
.rc-tooltip-placement-rightBottom .rc-tooltip-arrow {
  left: 4px;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #373737;
}
.rc-tooltip-placement-right .rc-tooltip-arrow {
  top: 50%;
}
.rc-tooltip-placement-rightTop .rc-tooltip-arrow {
  top: 15%;
  margin-top: 0;
}
.rc-tooltip-placement-rightBottom .rc-tooltip-arrow {
  bottom: 15%;
}
.rc-tooltip-placement-left .rc-tooltip-arrow,
.rc-tooltip-placement-leftTop .rc-tooltip-arrow,
.rc-tooltip-placement-leftBottom .rc-tooltip-arrow {
  right: 4px;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #373737;
}
.rc-tooltip-placement-left .rc-tooltip-arrow {
  top: 50%;
}
.rc-tooltip-placement-leftTop .rc-tooltip-arrow {
  top: 15%;
  margin-top: 0;
}
.rc-tooltip-placement-leftBottom .rc-tooltip-arrow {
  bottom: 15%;
}
.rc-tooltip-placement-bottom .rc-tooltip-arrow,
.rc-tooltip-placement-bottomLeft .rc-tooltip-arrow,
.rc-tooltip-placement-bottomRight .rc-tooltip-arrow {
  top: 4px;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #373737;
}
.rc-tooltip-placement-bottom .rc-tooltip-arrow {
  left: 50%;
}
.rc-tooltip-placement-bottomLeft .rc-tooltip-arrow {
  left: 15%;
}
.rc-tooltip-placement-bottomRight .rc-tooltip-arrow {
  right: 15%;
}
.rc-tooltip.rc-tooltip-zoom-enter,
.rc-tooltip.rc-tooltip-zoom-leave {
  display: block;
}
.rc-tooltip-zoom-enter,
.rc-tooltip-zoom-appear {
  opacity: 0;
  -webkit-animation-duration: 0.3s;
          animation-duration: 0.3s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
          animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
}
.rc-tooltip-zoom-leave {
  -webkit-animation-duration: 0.3s;
          animation-duration: 0.3s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-timing-function: cubic-bezier(0.6, -0.3, 0.74, 0.05);
          animation-timing-function: cubic-bezier(0.6, -0.3, 0.74, 0.05);
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
}
.rc-tooltip-zoom-enter.rc-tooltip-zoom-enter-active,
.rc-tooltip-zoom-appear.rc-tooltip-zoom-appear-active {
  -webkit-animation-name: rcToolTipZoomIn;
          animation-name: rcToolTipZoomIn;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.rc-tooltip-zoom-leave.rc-tooltip-zoom-leave-active {
  -webkit-animation-name: rcToolTipZoomOut;
          animation-name: rcToolTipZoomOut;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
@-webkit-keyframes rcToolTipZoomIn {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0);
            transform: scale(0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
}
@keyframes rcToolTipZoomIn {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0);
            transform: scale(0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
}
@-webkit-keyframes rcToolTipZoomOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0);
            transform: scale(0, 0);
  }
}
@keyframes rcToolTipZoomOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0);
            transform: scale(0, 0);
  }
}
/* end of rc-tooltip */


.buy_info {
    background: #7FDFE0 none repeat scroll 0% 0%;
    padding: 5px;
    font-size: 12px;
}

/** ライトボックススタイル上書き **/
#lightbox-image-details-caption{
	color:#000000;
	font-size:110%;
}

#lightbox img {
width: none !important;
height: auto;
}

/*フィードバックフォーム　*/
.optionBuy__feedback{
	margin:15px 0px;
	text-align:center;
}

.optionBuy__feedback--title{
	max-width:100%;
}

.optionBuy__feedback iframe{
	border:1px solid #999999;
}

.optionBuy__feedback--close{
	cursor:pointer;
}


/* 塗料用サジェスト */
.react-autosuggest__container {
    position: relative;
    font-size: 18px;
}

.react-autosuggest__input {
    padding:5px;
    width: 95%;
    font-family: Helvetica, sans-serif;
    font-weight: 300;
    font-size: 16px;
    border: 1px solid #000;
    border-radius: 4px;
    background: #FFD7D7;
}

.react-autosuggest__input:focus {
    outline: none;
}

.react-autosuggest__container--open .react-autosuggest__input {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.react-autosuggest__suggestions-container {
    display: none;
}
.react-autosuggest__container--open .react-autosuggest__suggestions-container {
    position: absolute;
    display: block;
    top: 29px;
    width: 95%;
    margin: 0;
    padding: 0;
    list-style-type: none;
    border: 1px solid #aaa;
    background-color: #fff;
    font-family: Helvetica, sans-serif;
    font-weight: 300;
    font-size: 16px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    z-index: 2;
    max-height: 400px;
    overflow-y: scroll;
}

.react-autosuggest__suggestion:not(:first-child) {
    border-top: 1px solid #ddd;
}

.react-autosuggest__suggestion--focused {
    background-color: #0C7EAF;
    color: #fff;
}

.optionBuy__suggest:hover {
    background-color: #FFFFCC;
    color: #000;
}


.suggestion-content {
    display: flex;
    align-items: center;
    background-repeat: no-repeat;
}

.react-autosuggest__suggestion--focused .highlight {
    color: #120000;
}

.optionBuy__suggest {
    cursor: pointer;
    padding: 10px 5px;
}

.optionBuy__suggest.disabled {
    cursor: default;
    background-color: #EEEEEE;
}

.optionBuy__suggestLeft {
    float: left;
    width: 20%;
}

.optionBuy__suggestRight {
    float: left;
    width: 79%;
    padding-left: 1%;
}

.optionBuy__suggestName {
    font-size: 16px;
    font-weight: bold;
}

.optionBuy__formInput .optionBuy__inputSuggest .react-autosuggest__container {
    float: left;
    width: 300px;
    height: 150px;
}

.optionBuy__selectedSuggest {
    /* 本クラス及びその下の各要素の調整 */
}

.optionBuy__sectionTitle {
    background-color: #BBBBBB;
    color: #FFFFFF;
}

.optionBuy__suggestColor {
}

.optionBuy__suggestCss {
    height: 36px;
}

.optionBuy__selectedCss {
    width: 100px;
    height: 100px;
    border: 1px solid #ffffff;
    margin: auto;
}

/* ここまで：塗料用サジェスト */
/* ここから：塗料用デザイン */
.optionBuy__colorNo{
	margin-bottom: 30px;
}
.optionBuy__colorNo td{
	border: 1px solid #666;
}
.optionBuy__colorNo--sample{
	background: #AAAAAA;
	padding: 15px 5px;
	text-align: center;
	width: 11em;
}
.optionBuy__colorNo--sampleTitle{
	color: #FFFFFF;
	text-align: center;
	font-weight: bold;
	padding: 4px;
	margin:0px !important;
}
.optionBuy__colorNo--selectLine{
	padding: 15px;
	width: 30em;
}
.optionBuy__colorNo--selectName{
	padding: 5px 15px;
}
.optionBuy__colorNo--selectGuide{
	padding: 5px 15px;
}
/* ここまで：塗料用デザイン */

/* ここから：建材ブラッシュアップ */
img.unselection_target:hover {
    opacity: 0.7;
    cursor: default;
}

.optionBuy__formWraps label{
    cursor: pointer;
}
.optionBuy__formWraps label:hover{
    background:#ffffe2;
    border-radius:5px;
}

.optionBuy__formWraps input[type=radio] {
  -ms-transform: scale(1.4, 1.4);
  -webkit-transform: scale(1.4, 1.4);
  transform: scale(1.4, 1.4);
}

/* ここまで：建材ブラッシュアップ */

/* ここから：総額表示 */
.PriceInformation--option {
	text-align: right;
	margin-bottom: 10px;
}
/* ここまで：総額表示 */