@charset "utf-8";

/*---------------------------------------------
01. *, body
---------------------------------------------*/
*      { margin: 0px; padding: 0px; font-size: 100%; }
body   { color: #555555; font-family: "ＭＳ Ｐゴシック", "MS PGothic", Arial, Helvetica, Verdana, sans-serif; text-align: left; background-color: #E1E1E1; }
hr     { display: none; }
img    { border: none; vertical-align: middle; }
sup, sub { font-size: 80%; background-color: #E1E1E1; }

a { overflow: hidden }
a:link            { color: #474786; text-decoration: underline; }
a:visited         { color: #555555; text-decoration: underline; }
a:hover, a:active { color: #474786; text-decoration: none; }
#wrap		{ width: 960px; background: url(../imgs/bg.jpg)  0 0 repeat; text-align: left; margin: 0 auto;}
/*---------------------------------------------
02. header
---------------------------------------------*/
#header         { width: 920px; height: 78px; margin: 0 0 0 20px; background: url(../imgs/header.jpg)  0 0 no-repeat; text-align: left;}
#headerLogo h1     { float: left; width: 255px; height: 45px; margin: 18px 0 0 26px; }
#search		{ float: right; width: 310px; margin: 25px 28px 0 0; text-align: right; font-size: 75%;}
#search input	{ margin: 2px 0 0 4px;}

/*---------------------------------------------
03. menu
---------------------------------------------*/
#menuArea{ clear: both; width: 920px; margin:  0 0 0 20px; height: 30px; background: url(../imgs/menu.jpg)  0 0;}
#menuArea ul{ padding: 0; margin: 0; list-style-type:none; }
#menuArea li{ float: left; padding: 0; margin: 0; text-indent:-9999px; }

#menuArea li a{ display: block; height: 30px; }

li.home a { width: 140px; background: url(../imgs/menu01.jpg)  0 0; }
li.home a:hover  { background: url(../imgs/menu01_on.jpg)  0 0; }
li.prod a { width: 130px; background: url(../imgs/menu02.jpg)  0 0; }
li.prod a:hover { background: url(../imgs/menu02_on.jpg)  0 0; }
li.print a { width: 130px; background: url(../imgs/menu03.jpg)  0 0; }
li.print a:hover  { background: url(../imgs/menu03_on.jpg)  0 0; }
li.dl a { width: 130px; background: url(../imgs/menu04.jpg)  0 0; }
li.dl a:hover  { background: url(../imgs/menu04_on.jpg)  0 0; }
li.com a { width: 130px; background: url(../imgs/menu05.jpg)  0 0; }
li.com a:hover  { background: url(../imgs/menu05_on.jpg)  0 0; }
li.con a { width: 130px; background: url(../imgs/menu06.jpg)  0 0; }
li.con a:hover  { background: url(../imgs/menu06_on.jpg)  0 0; }
li.qa a { width: 130px; background: url(../imgs/menu07.jpg)  0 0; }
li.qa a:hover  { background: url(../imgs/menu07_on.jpg)  0 0; }

/*---------------------------------------------
04. main
---------------------------------------------*/

#content { width: 920px; margin: 0 0 0 20px; padding: 0; text-align: left; }
.cl	{clear: both;}
#content h2 { width: 920px; height: 95px; padding: 0; margin: 0; background: url(../products/imgs/title.jpg) no-repeat left top; text-indent:-9999px;}
div#panli { margin: 10px 0 10px 20px;}
li.pan { display: inline; list-style-type:none; font-size: 75%; font-weight: bold;}
li.pan a { text-decoration: none; font-weight: normal;}
/*---------------------------------------------
04-01. 左メニュー
---------------------------------------------*/
#mainLeft { float: left; width: 240px; margin: 0px; padding: 0; text-align: center; }
#cate	{ width: 200px; margin: 0 auto 20px auto; padding: 0; border: 1px #ccc solid;}
#cate h3 { width: 198px; height: 23px; padding: 0; margin: 0; background: url(../products/imgs/category_t.jpg) no-repeat left top; text-indent:-9999px;}
div#C0010 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0010t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0010 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0020 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0020t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0020 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0030 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0030t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0030 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0040 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0040t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0040 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0050 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0050t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0050 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0060 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0060t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0060 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0070 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0070t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0070 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0080 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0080t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0080 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0090 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0090t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0090 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0100 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0100t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0100 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0110 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0110t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0110 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0120 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0120t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0120 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0130 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0130t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0130 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0150 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0150t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0150 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0160 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0160t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0160 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0170 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0170t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0170 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}
div#C0180 h4 { width: 198px; height: 30px; padding: 0; margin: 0; background: url(../products/imgs/0180t.jpg) no-repeat left top; border-bottom: 1px dotted #ccc; text-align: left;}
div#C0180 h4 p { padding: 0; margin: 8px 0 5px 50px; font-size: 75%; font-weight: normal;}

#fm{ width: 200px; padding: 0; margin: 10px auto;}

#apico{ width: 200px; height: 66px; padding: 0; margin: 10px auto;}
/*---------------------------------------------
04-2. カテゴリ一覧ページ
---------------------------------------------*/
#main { float: right; width: 666px; margin: 0px; padding: 0; text-align: left; }
#main h4 { width: 642px; height: 22px; padding: 0; margin: 0 0 5px 0; background: url(../products/imgs/h3_bg.jpg) no-repeat left top;}
#main h4  p{ padding: 4px 0 0 0; margin: 0 0 0 15px; color: #FFFFFF; font-weight: bold; font-size:75%;}
.cat{ width: 640px; padding: 0; margin: 0 0 15px 0; border: 1px #ccc solid;}
.cat:after {content : ""; display : block; height : 0; clear : both;}
.cat-l{ width: 100px; float:left; padding: 0; margin: 5px; text-align: center;}
.cat-r{ width: 500px; float:right; padding: 0; margin: 5px; text-align: left;}
ul.catelist	{ font-size: 75%; margin: 10px; padding: 0; width: 480px; list-style: none;}
li.clist	{ width:220px ; float:left; padding-left: 18px; background: url(../products/imgs/cate_arrow.jpg) no-repeat 0.2em 0.2em; word-wrap:normal; margin: 0 0 5px 0;}
/*---------------------------------------------
04-3. カテゴリ大一覧ページ
---------------------------------------------*/
.cat2{ width: 640px; padding: 0; margin: 0 0 15px 0; border-bottom: 1px #ccc dotted;}
.cat2:after {content : ""; display : block; height : 0; clear : both;}
.cat2-l{ width: 100px; float:left; padding: 0; margin: 10px; text-align: center; border: 1px #ccc solid; font-size: 65%; color: #CCCCCC;}
.cat2-l .nophoto { margin: 0; padding: 30px 0 0 0; width: 100px; height: 45px; color: #CCCCCC;}
.cat2-r{ width: 480px; float:right; padding: 0; margin: 10px; text-align: left;}
.scode	{ width: 450px; padding: 0; margin: 0 0 3px 0; font-size: 75%;}
ul.cnamelist	{ font-size: 75%; margin: 0; padding: 0; width: 450px; list-style: none;}
li.namelist	{ padding-left: 20px; background: url(../products/imgs/cate_arrow.jpg) no-repeat 0.2em 0.2em; margin: 0 0 5px 0; font-weight: bold; color: #414181;}
.prtxt	{ width: 450px; padding: 0; margin: 3px 0 5px 0; font-size: 75%;}
.price	{ width: 400px; height: 22px; padding: 0; margin: 0 0 3px 0; background: url(../products/imgs/price_bg.jpg) no-repeat 0 0; text-align: center;}
.price p{ font-size: 75%; padding: 0; margin: 5px 0 3px 0;}
.bbfont	{ font-weight: bold; color: #414181;}

.sbox { width: 640px; margin: 0 0 10px 0; padding: 0px; text-align: left; background-color: #F5F5F5; border: 1px #CCCCCC solid; }
.sbox:after {content : ""; display : block; height : 0; clear : both;}
.sboxLeft	{ float: left; width: 340px; margin:10px; font-weight: bold; font-size: 80%;}
.sboxRight{ float: right; width: 260px; margin: 5px; text-align: right; font-size: 80%;}
.orfont { font-weight: bold; color: #FF6600;}
.spage	{ width: 620px; margin: 0 0 10px 0; padding: 10px; font-size: 80%; text-align: right; word-spacing: 0.5em; font-weight: bold; border-bottom: dotted 1px #CCCCCC;}
/*---------------------------------------------
04-5. 詳細ページ
---------------------------------------------*/
#title	{ width: 640px; height: 57px; padding: 0; margin: 0; border-top: 4px solid #9999CC; background: url(../products/imgs/more_t_bg.jpg) no-repeat 0 0; }
#title:after {content : ""; display : block; height : 0; clear : both;}
#titletop-l{ width: 300px; float: left; font-size: 75%; text-align:left; margin: 5px 0 0 0;}
#titletop-r{ width: 300px; float: right; font-size: 75%; text-align:right; margin: 5px 0 0 0;}
#title h3{ font-size: 100%; font-weight: bold; color: #414181; margin: 30px 0 0 5px;}

#cont{ width: 640px; padding: 0; margin: 0;}
#cont:after {content : ""; display : block; height : 0; clear : both;}
#cont img{float: left;}
#cont .nophoto { margin: 10px 0 0 0; padding: 30px 0 0 0; width: 100px; height: 45px; float: left; text-align: center; border: 1px #ccc solid; font-size: 65%; color: #CCCCCC;}
#cont-r{ float: right; width: 310px; padding: 0; margin: 10px 10px 10px 20px;}
#icon	{ width: 310px; padding: 0; margin: 0 0 20px 0;}
#icon:after {content : ""; display : block; height : 0; clear : both;}
#icon img{ padding: 0; margin: 3px; float: left;}
#prtxt2{ width: 310px; padding: 0; margin: 0 0 20px 0; font-size: 75%;}
#price1{ width: 310px; padding: 0; margin: 0; border-top: 1px dotted #ccc;}
#price1 p{ padding: 0; margin: 10px 0 5px 5px; font-size: 75%; }
#price2{ width: 310px; padding: 0; margin: 0; border-bottom: 1px dotted #ccc;}
#price2 p{ padding: 0; margin: 0px 0 10px 5px; font-size: 75%; }
#free{ width: 640px; height: 100%; padding: 0; margin: 0 0 20px 0;}
#free-body{ width: 620px; height: 100%; padding: 0; margin: 10px; }

#relation{ width: 640px; padding: 0; margin: 0 0 20px 0; }
#relation:after {content : ""; display : block; height : 0; clear : both;}
#relation h4{ width: 640px; height: 16px; padding: 0; margin: 0 0 15px 0; background: url(../products/imgs/relation_t.gif) no-repeat left top; text-indent:-9999px;}
.rels{ width: 100px; height:110px; padding: 0; margin: 10px; float:left; border: 1px solid #ccc;}
.rels img{ margin: auto;}
#relation .rels .nophoto { margin: 0; padding: 30px 0 0 0; width: 100px; height: 45px; float: left; text-align: center; border: 1px #ccc solid; font-size: 65%; color: #CCCCCC;}
.rels-txt{ width: 100px; padding: 0; margin: 0px;}
.rels-txt p{ font-size: 65%; padding: 0; margin: 3px;}

/*--- エラーメッセージ部分 ---*/
.error_msg {
	margin: 10px 20px 10px 0px;
	padding: 10px;
	line-height: 140%;
	text-align: left;
	font-weight: normal;
	font-size: 75%;
	border-color: #CC7777;
	border-style: solid;
	border-width: 1px;
	background-color: #FEFBE0;
}

.error_msg_title {
	color: #CC0000;
	font-weight: bold;
}

.error_msg ul {
	margin: 4px 0px 4px 0px;
	padding: 0px 0px 0px 30px;
}

/*---------------------------------------------
05. footer
---------------------------------------------*/
#footer         { clear: both; width: 920px; height: 96px; margin: 0px; background: url(../imgs/foot_bg.jpg)  0 0 repeat; border-top: 1px solid #cccccc;}
#footer ul { margin: 20px 0 20px 195px; list-style-type: none; text-align: center;}
#footer li { float: left; margin: 0 2px; padding: 0px; font-size: 65%; }

#copyright { width: 276px; height: 14px; padding: 0; margin: 20px 0 0 322px; background: url(../imgs/copy.gif) no-repeat 0 0; text-indent:-9999px;}

/*---------------------------------------------
09. youbon追加スタイル
---------------------------------------------*/

/* --- cgi生成商品ページ_チラシ追加レイアウト※アイコン有り --- */

#free{
position:relative;
}

#product_chirashiicon_t{
color:#C0C;
width:340px;
height:80px;
line-height:50px;
position:relative;
top:-100px;
left:310px;
}

/* --- cgi生成商品ページ_チラシ追加レイアウト※アイコン有り --- */

#product_chirashiicon_f{
color:#C0C;
width:340px;
height:80px;
position:relative;
top:-150px;
left:310px;
}

/* --- cgi生成商品ページ_NBリース追加レイアウト --- */

#product_lease{
width:100px;
height:80px;
font-size:12px;
position:relative;
top:-340px;
left:310px;
padding-left:65px;
}