﻿@charset "utf-8";
/* 
 *	汎用クラス,float,clearfix,
 *  lastUpdate 2008.06.04
 */


/* js
---------------------------------------------------------*/
div.popupBox, .fancyBox{
	/* with fancyBox with jq */
}

.btnOver{
	/* rollOver with jq */
}

/* stripe */
table.stripe{
	/* with jq */
}
.evenLine{
	background-color: #f6f6f6;
}
.oddLine{
	background-color: #fff;
}
/* 最後のエレメント付与する */
.last{

}

/* jq.screenshot */
.screenshot{
}

/* slide for .toggleSlide after '#wrapSlide' contents */
.toggleSlide1, .toggleSlide2, .toggleSlide3,
#wrapSlide1, #wrapSlide2, #wrapSlide3{
	/* with jq */
}


/* Easiest Tooltip and Image Preview Using jQuery */
#preview, #screenshot{
	position:absolute;
	display:none;
	padding:5px;
	border:1px solid #ccc;
	background:#333;
	color:#fff;
}

#screenshot{
	text-align: center;
}
.tooltip{

}
#tooltip{
	position:absolute;
	border:1px solid #333;
	background:#990000;
	padding:2px 5px;
	color:#fff;
	display:none;
}	


/* ユーティリティ
----------------------------------------------------------------------------------------------------*/

/* topFlash */
div#flashSpace img {
	vertical-align: top;
}


/* ソーシャル
---------------------------------------------------------*/
div#wrapHeaderDetail div.socialBookmark {
	position: absolute;
	top: 269px;
	right: 8px;
	width: 141px;
	min-height: 20px;
}

* html div#wrapHeaderDetail div.socialBookmark {
	height: 20px;
}


div#wrapContents div.socialBookmark {
	clear: both;
	height: 23px;
	min-height: 1.0em;
	margin: 0 0 10px 0;
	padding: 5px;
	border: 1px dotted #ccc;
	background-color: #f6f6f6;
}
div#wrapContents div.socialBookmark div {
	display: inline;
	float: left;
	margin: 3px 15px 0 0;
}
div#wrapContents div.socialBookmark p {
	display: inline;
	float: left;
	line-height: 20px;
	margin: 0 15px 0 3px;
	padding: 0;
}

div#wrapContents div.socialBookmark p a {
	line-height: 20px;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	padding-left: 5px;
	padding-right: 5px;
}




/* 汎用ラップ
---------------------------------------------------------*/
div.section{
	clear: both;
	min-height: 50px;
	margin-bottom: 2.0em;
	padding-bottom: 0.2em;
}
div.section div.section{
	border-bottom: none;
	background: none;
}

/*------------------------------------
<div class="sectionColumnSingle">
<div class="sectionColumnDouble">
…
</div>
<!-- /sectionColumnDouble -->
<div class="sectionColumnDouble">
…
</div>
<!-- /sectionColumnDouble -->
</div>
<!-- /sectionColumnSingle -->
------------------------------------*/
/* section内で使う */
div.sectionColumnSingle{
	clear: both;
	margin: 0 5px 2.0em 5px;
}
/* section内で使う */
div.sectionColumnDouble{
	display: inline;
	float: left;
	width: 48%;
	min-height: 50px;
	margin: 0 5px 2.0em 5px;
}
/* section内で使う */
div.sectionColumnTriple{
	display: inline;
	float: left;
	width: 31.5%;
	min-height: 50px;
	margin: 0 5px 2.0em 5px;
}

div.sectionColumnSingle div.sectionColumnDouble{
	width: 46%;
}
/* 汎用ラップ
---------------------------------------------------------*/
.box{
	padding: 1px;
	border: 1px solid #E1E1E1;
}

.round {
	border-width: 2px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px
}



/* 文章ラップ */
div.paragraph{
	margin-bottom: 1em;
	padding: 5px;
}

/* a */

div.section, div.paragraph, div.figure{
	zoom: 1;/*for IE 5.5-7*/
}

div.section:after, div.paragraph:after, div.figure:after{
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}

/* summary
---------------------------------------------------------*/
.summary{
	border: 1px solid #d6d6d6;
	border-bottom: 2px solid #d6d6d6;
	margin: 0 0 1.5em 0;
	padding: 0.2em;
	background-color: #f6f6f6;
}

div.onePoint{
	padding: 0.5em;
	border: 3px solid #ccc;
}

div.notice{
	padding: 0.5em;
	border: 1px solid #cc0000;
}

div.notice p{
	margin-bottom: 0.2em;
	padding: 0.1em;
}

/* もっとみる
---------------------------------------------------------*/
div.wrapDetail{
	width: 530px;
	height: 75px;
	margin-top: 1.0em;
	padding: 0 15px;
}
div.wrapDetail ul{
	margin: 0;
	padding: 0;
}
div.wrapDetail ul li{
	display: inline;
	float: left;
	line-height: 50px;
	margin: 0 0 0 5px;
	padding: 0;
}
/* pdf
---------------------------------------------------------*/
div.section a.icoPdf{
	background: url(/common/images/logo_pdfs.gif) no-repeat center left;
	padding: 5px 0 5px 25px;
}



/* 製品／写真例, 水平, コンテンツ紹介
---------------------------------------------------------*/
div.figure, div.figureFlat, div.thumbnail{
	margin: 0 0 0.5em 0.5em;
	padding: 0.5em 0 0.5em 0.5em;
}
div.figure{
	display: inline;
	float: right;
	width: 200px;
	max-width: 200px;
	padding-bottom: 1.5em;
	border-left: 1px solid #f6f6f6;
	background-color: #fff;
}
div.thumbnail{
	display: inline;
	float: left;
	min-width: 150px;
	margin-right: 10px;
	background-color: #fff;
}

* html div.figure, * html div.thumbnail{
	width: 200px;
}

div.figure img, div.figureFlat img, div.thumbnail img{
	margin: 0 auto 5px auto;
	padding: 2px;
	background-color: #fff;
}

div.figure a img, div.figureFlat a img{
	text-decoration: none !important;
	border: 1px solid #c5e9fe;
	padding: 3px;
}
div.figureFlat a{
	text-decoration: none !important;
}
div.figure a:hover img, div.figureFlat a:hover img{
	border: 1px solid #33ccff;
	padding: 3px;
}

div.figure p, div.figureFlat p, div.thumbnail p{
	margin: 0 0 0.5em 0;
	font-size: 80%;
}




/* ネットオーダー
---------------------------------------------------------*/
div.wrapNetOrder{
	display: inline;
	float: right;
	margin: 0 0 0 5px;
	padding: 3px;
	border: 1px solid #999;
	background-color: #e7e9e8;
}

div.wrapNetOrderWide{
	width: 170px;
	margin: 0 0 1em 0;
	padding: 3px;
	border: 1px solid #999;
	background-color: #e7e9e8;
}

div#wrapContents div.wrapNetOrder h3, div#wrapContents div.wrapNetOrderWide h3,
div#wrapContents div.wrapNetOrder h2, div#wrapContents div.wrapNetOrderWide h2{
	margin: 0 0 5px 0;
	padding: 0;
	border: none;
	background: none;
}

div.wrapNetOrder p, div#wrapContents div.wrapNetOrderWide p{
	margin: 0 0 3px 0;
	padding: 0;
	font-size: 80%;
}


/*-----------------------------------------------------

汎用クラス, 組み合わせて使う

--------------------------------------------------------*/

.minutely{
	font-size: 80%;
}

.strong{
	line-height: 120%;
	font-size: 120%;
}

.veryStrong{
	line-height: 140%;
	font-size: 140%;
}

.price{
	color: #cc0000;
}

.emphasis{
	color: #cc0000;
}

.through{
	text-decoration: line-through;
}










/*-----------------------------------------------------

LocalMenu 

--------------------------------------------------------*/
/* 旧ページトップ */
div.goTo{
	clear: both;
	margin-bottom: 0px;
}

/* goTo p */
div.goTo p{
	margin: 5px 0;
	text-align: right;
}

div.goTo p a{
	display: block;
	min-width: 7em;
	min-height: 1em;
	padding: 5px 5px 5px 12px;
	border: 1px solid #ccc;
	color: #0066ff;
}
* html div.goTo p a{
	height: 1.5em;
}
div.goTo p a{
	display: inline;
}

div.goTo p a{
	background: url(/common/images/bg_btn_gray_top.gif) no-repeat left center;	
	font-size: 86%;
}
div.goTo p a.next{
	background-image: url(/common/images/bg_btn_gray.gif);	
}
div.goTo p a.down{
	background-image: url(/common/images/bg_btn_gray_bottom.gif);	
}

div.goTo ul li a:link, div.goTo p a:link{
	color: #0033cc;
	text-decoration: none;
}
div.goTo ul li a:hover, div.goTo p a:hover{
	color: #0099ff;
	border: 1px solid #0099ff;
}


/* ページトップへ */
div.wrapPageCTRL{
	height: 15px;
}
div#wrapMenuFooter div.wrapPageCTRL p{
	width: 100%;
	display: block;
	float: none;
	margin: 0;
	padding: 0;
}
div.wrapPageCTRL img{
	display: inline;
	float: right;
}




/* 注意書き
---------------------------------------------------------*/
ul.listGeneralFloat{
	list-style: none;
	margin: 0;
}
ul.listWhatsnew, ul.listIcon{
	list-style: none;
	margin: 0.2em 0 1.5em 0em;
}
ul.listAsterisk, ul.listNormal, ul.listArrowGreen, ul.listExclamation, ul.listGeneral{
	list-style: none;
	margin: 0.2em 0 1.5em 0.5em;
}
ul.listImgMenu{
	list-style: none;
	margin: 0;
	padding: 0;
}
ul.listImgMenu li{
	display: inline;
	float: left;
	margin: 0;
	padding: 0;
}
/*div#wrapContents hazusita*/
ul.listNormal li{
	background: url(/common/images/circle_red_10x10.gif) no-repeat left 3px;
	margin: 3px 3px 4px 0.5em;
	padding: 0 2px 0 15px;
}
ul.listArrowGreen li{
	background: url(/common/images/arrow_green_10x10.gif) no-repeat left center;
	margin: 3px 3px 4px 0em;
	padding: 0 2px 0 15px;
}

ul li.openWindow{
	background: url(/common/images/arrow_open_7x7.gif) no-repeat left center !important;
	margin: 3px 3px 4px 0em;
}

ul.listAsterisk li{
	margin: 3px 3px 4px 0em;
	padding: 0 0.5em 0 15px;
	background: url(/common/images/ico_asterisk_20x20.gif) no-repeat left center;
	font-size: 80%;
}

ul.listGeneral li{
	margin: 2px 2px 4px 0em;
	padding: 0 0.5em;
}

ul.listGeneralFloat li{
	list-style-image: none;
	display: inline;
	float: left;
	margin: 2px 0;
	padding: 2px;
	text-align: center;
	background: none;
}

ul.listGeneralFloat li img{
	margin-bottom: 5px;
}

/* 紹介アイコン
---------------------------------------------------------*/
ul.listIcon{
	margin: 0 0 5px 0m;
}

ul.listIcon li{
	list-style-image: none;
	display: inline;
	float: left;
	margin: 0;
	padding: 0;
}


ul.listWhatsnew li{
	line-height: 1.5;
	margin: 0 0 0.5em 0em;
	padding: 0.2em;
	border-bottom: 1px dotted #ccc;
}

ul.listWhatsnew li a{
	line-height: 1.5;
	padding-left: 15px;
	background: url(/common/images/arrow_green_13x13.gif) no-repeat left center;
}

ul.listExclamation li{
	margin: 0 0 0.5em 0;
	padding: 0 0.5em 0 18px;
	font-size: 90%;
	background: url(/common/images/ico_exclamation.gif) no-repeat left center;
}







/* タブ　<script type="text/javascript" src="/common/js/jquery.idTabs.min.js"></script>
<script type="text/javascript">
$("#tab_1 ul").idTabs();
</script>
---------------------------------------------------------*/
.tabUsual ul.listTabMenu{
	list-style-position: outside;
	list-style: none;
	margin: 0;
	padding: 0;
	background: url(/common/images/bg_tabUsual.gif) bottom repeat-x;
}
.tabUsual ul.listTabMenu li{
	display: inline;
	float: left;
	border-top: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
	margin: 0 2px;
	padding: 0;
	color: #333;
}
.tabUsual ul.listTabMenu li a{
	display: inline;
	float: left;
	margin: 0;
	padding: 0.5em 1em;
	color: #0066ff;
	background: url(/common/images/bg_tabUsual_li_a.gif) top repeat-x #eeeeee;
}
.tabUsual ul.listTabMenu li a:hover, .tabUsual ul.listTabMenu li a.selected{
	color: #0099ff;
	background-image: url(/common/images/bg_tabUsual_li_a_hover.gif);
	background-position: bottom;
}



/* リンク装飾
---------------------------------------------------------*/
a.listNormal{
	padding-left: 14px;
	background: url(/common/images/circle_red_10x10.gif) no-repeat left center;
}

a.listArrowGreen{
	padding-left: 14px;
	background: url(/common/images/arrow_green_10x10.gif) no-repeat left center;
}

a.listAsterisk{
	padding-left: 20px;
	background: url(/common/images/ico_asterisk_20x20.gif) no-repeat left center;
}

a.openWindow{
	padding-left: 10px;
	background: url(/common/images/arrow_open_7x7.gif) no-repeat left center;
}

a.listArrowDownGreen{
	padding-left: 14px;
	background: url(/common/images/arrow_dw_green_10x10.gif) no-repeat left center;
}

a.listArrow {
	padding-left: 14px;
	background: url(/common/images/arrow_7x7.gif) no-repeat left center;
}

/*-----------------------------------------------------

DATE

--------------------------------------------------------*/

p.date{
	font-size: 80%;
	text-align: right;
}

li span.date{
	padding: 3px;
	color: #fff;
	background-color: #999;
}

dl.listDate{
	margin: 0 0 0.5em 0;
	padding: 0 0 0.5em 0;
	border-bottom: 1px dotted #ccc;
}

dl.listDate dt{
	display: inline;
	float: left;
	line-height: 1.2;
	width: 100px;
	max-width: 100px;
	margin: 2px 0 0 0;
	padding: 3px;
	text-align: center;
	color: #fff;
	font-size: 80%;
	/*background: #990000;*/
	background: url(/common/images/bg_date_dt.gif) no-repeat center;
	
}

dl.listDate dd{
	display: inline;
	float: right;
	line-height: 1.4;
	width: 620px;
	margin: 0;
	padding: 3px;
}

dl.listDate dd a{
	background: url(/common/images/arrow_7x7.gif) no-repeat left center;
	padding-left: 12px;
}

/* 新ウィンドウ */
dl.listDate dd a.openWindow{
	background: url(/common/images/arrow_open_7x7.gif) no-repeat left center;
}



/* column Caution
---------------------------------------------------------*/

div#wrapContents div.caution{
	padding: 0 0 0 75px;
	background: url(/common/images/img_caution.gif) no-repeat center left;
}

div#wrapContents div.caution h2{
	font-weight: bold;
	margin-bottom: 10px;
	padding: 5px;
	background-image: none;
	background-color: #fff;
}






/* clearfix */
div.localMenu, div.goTo, div.localMenuContents, ul.listGeneralFloat, ul.listIcon, div.wrapDetail ul, dl.listDate, div.sectionColumnSingle, .tabUsual ul{
	zoom: 1;/*for IE 5.5-7*/
}
div.localMenu:after, div.goTo:after, div.localMenuContents:after, ul.listGeneralFloat:after, ul.listIcon:after, div.wrapDetail ul:after, dl.listDate:after, div.sectionColumnSingle:after,  .tabUsual ul:after{
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}



/* clearfix */
.clearfix{
	zoom: 1;/*for IE 5.5-7*/
}
.clearfix:after{
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}

