@charset "UTF-8";

/*This style is for "www.tform.co.jp/products/one.php".*/

/*jQuery.fotorama.jsのハック*/
.fotorama__fullscreen-icon { _display: none !important; } /*IE6以下のハック（IE6以下のフルスクリーン表示はバグが発生するため）*/
/**/
#photoWrapper { width: 44%; padding: 1% 2%; border-right: 1px solid #EBEBEB; border-left: 1px solid #EBEBEB; float: left; margin-right: 2%; margin-bottom: 0.5%; }
/**/
.fotorama__caption { text-align: center; }

/**/
#specWrapper { width: 44%; padding: 1% 2%; float: left; margin-bottom: 0.5%; }
#specWrapper .productDescription { margin-bottom: 2em; line-height: 1.8em; text-align: justify; text-justify: inter-ideograph; /* font-family: "Noto Sans JP"; font-weight: 100; color: #111; */ }
#specWrapper .makerName { margin-bottom: 1em; line-height: 1; }
#specWrapper .makerName a { display: block; max-width: 180px; }
#specWrapper .makerName a:hover { filter: alpha(opacity=60); -moz-opacity: 0.6; -webkit-opacity: 0.6; opacity: 0.6; }
#specWrapper .makerName img { max-width: 100%; max-height: 3.5em; }
/**/
#specPrimary { width: 45%; float: left; margin-right: 7%; }
#specPrimary ul li { line-height: 1.8em; color: #535353; display: inline-block; width: 100%; }
#specPrimary ul li.seriesName { font-size: 110%; font-style: italic; line-height: 1.7em; }
#specPrimary ul li.designerName { font-size: 90%; line-height: 1.7em; }
#specPrimary ul li.modelNumber { font-size: 116%; line-height: 0.9em; }
#specPrimary ul li.productName { margin-top: 0.75em; }

#specPrimary ul li dl dt { float: left; margin-right: 0.25em; font-size: 88%; color: #777777; }
#specPrimary ul li dl dd { float: left; font-size: 88%; }
#specPrimary ul li dl dd.productNumber { font-size: 116%; line-height: 1.3em; }

#specPrimary ul li dl.oldNumber { font-size: 77%; color: #888888; }
#specPrimary ul li.size { }
#specPrimary ul li.price { }
#specPrimary ul li.price_tax { font-size: 77%; color: #777777; }
/**/
#specPrimary ul.primarySecond { font-size: 88%; margin-top: 1em; color: #666666; }
#specPrimary ul.primarySecond li dl dt { font-size: 100%; }
/**/
#specPrimary ul.caution { margin-top: 1em; }
#specPrimary ul.caution li  { font-size: 88%;  line-height: 1.5em; color: #666666; }
/**/
#specSecondary { width: 42%; float: left; margin-top: 0.3em; }
.drawingData { display: inline-block; width: 100%; }
.drawingData p { font-size: 88%; line-height: 1.4em; }
.drawingData ul.dataIcon li { float: left; margin: 0.5em 0.5em 0.5em 0; }
.drawingData ul.dataIcon li img { height: 32px; }
/**/
.specIcon { display: inline-block; width: 100%; margin-top: 5%; }
.specIcon ul li { font-size: 77%; line-height: 1.5em; clear: both; }
.specIcon ul li a { display: block; margin-bottom: 0.65em; }
.specIcon ul li img { width: 3em; border: 1px solid #cfcfcf; float: left; margin-right: 0.6em; margin-bottom: 0.9em; filter: alpha(opacity=80); -moz-opacity: 0.8; -webkit-opacity: 0.8; opacity: 0.8; }
.specIcon ul li a:hover img { border: 1px solid #AAAAAA; }
/**/
.awardIcon { display: inline-block; width: 100%; margin-top: 5%; }
.awardIcon ul li { float: left; height: 32px; line-height: 32px/*子要素を垂直センター揃えにするため*/; margin-right: 0.35em; margin-bottom: 0.35em; }
.awardIcon ul li img { max-width: 114px; max-height: 32px; vertical-align: middle; }

/*バリエーション商品郡*/
.oneGroup { display: inline-block; width: 100%; margin-top: 1.5em; }
.groupTitle {
	display: inline-block; width: 97.9%; padding: 0.5% 1%; border: 1px solid #ccc; 
	font-size: 100%; font-weight: 600; color: #555; line-height: 1.8em; margin-top: 2em;
	background: #efefef;
}
.variationGroup { display: inline-block; width: 100%; margin: 0.5em 0 2.5em 0; page-break-before: always; }
.variationGroup .oneVariation { width: 25%; float: left; }
.variationGroup ul { padding: 3%; border: 1px solid #ddd; border-top: none; display: block;  background: #fefefe; margin-right: -1px; }
.variationGroup ul li { font-size: 88%; width: 100%; float: none; line-height: 1.7em; }
.variationGroup ul li.vProductNO { font-size: 110%; }
.variationGroup li.variaImage { width: 60px; height: 100%; float: left; margin-right: 1em; background: #fefefe; } /* height: 60px; line-height: 60px; text-align: center; margin-bottom: 2em; */ 
.variationGroup li.variaImage img { width: 100%; } /* vertical-align: middle; */

/*関連商品郡*/
#relatedBox { clear: both; }
/*関連商品の個*/
.relatedProducts { display: inline-block; width: 96%; padding :2%; height: 9em/*12.4em*/; overflow: hidden; margin: 0.2% 0 1.3% 0; background: #eee; clear: both;
	position: relative; /*IE7以下のハック（jQuery slideDown）*/
}
/*関連商品郡の表示切換えトリガー*/
.viewTrigger { padding: 0.5% 1.5%;  height: 1.4em; line-height: 1.4em; color: #fcfcfc; background: #299dbc; border-top: 1px solid #eee; border-bottom: 1px solid #eee; cursor: pointer; margin-bottom: -1px; position: relative/*親要素*/; }
.viewTrigger h1 { font-size: 100%; color: #fcfcfc; float: left; }
.viewTrigger p { font-size: 92%; position: absolute; right: 1.5%;
	/top: 0.6em; /*IE7以下のハック*/
}
.viewTrigger p.close { display: none; }
.viewTrigger:hover { color: #fff; background: #30A8C3; font-weight: 400; }
.viewTrigger:hover h1 { color: #fff; }
/*関連商品郡の商品リスト*/
.relatedProducts .productsList {
	width: 10%; /*未対応の場合*/
	/* width: calc( 100% / 10 ); */
}
.relatedProducts .productsList .photo { max-height: 90px; } /* line-height: 90px; height: 90px; */
.relatedProducts .productsList ul.caption { font-size: 88%; max-height: 13em; }
/*関連商品郡のすべてを表示*/
.allView { height: auto !important; }

/*納入事例*/
#specWrapper p.caseNumber { line-height: 1.8em; color: #535353; margin-bottom: 0.5em; }

#specWrapper dl.caseInProducts { line-height: 2em; margin: 1.5em 0; }
#specWrapper dl.caseInProducts dt { float: left; margin-right: 0.5em; font-size: 88%; color: #777777; }
#specWrapper dl.caseInProducts dd { font-size: 100%; }