@charset "utf-8";
/* ===========================================================================
CSS Information

Update:2009/07/31

reset
link
Clear Fix Hack (Float Clear Hack)
2ndLayout
	flashBox(flashInner)
	line layout
Contents
	Products page
		Products詳細ページ
		table-Products
	Information page
	Download page(catalogIndex,paperIndex)
		boxInner
		#boxInner h
		item
		table-Download
		explanationBox
		newsInner
		howTo
		TemplateBank
		aboutPaper
		btnArea
		catalog,catalog01,catalog02
	EURO DownloadLayout
=========================================================================== */

/*----------------------------------------------------------------------------
	reset
----------------------------------------------------------------------------*/
*{
margin:0;
padding:0;
font-size:100%;
line-height:1.2;
}
html {
margin: 0;
padding: 0;
height:100%;
font-size:75%;
overflow-y:scroll;
}
html.catalogIndex,
html.paperIndex{
margin: 0;
padding: 0;
height:100%;
background:#FFF;
}
body.productsIndex{
margin:0;
padding:0 !important;
padding:0 0 15px;
width:100%;
height:100%;
font-family:"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
background:url(../images/contents_bg.jpg) repeat;
_background: url(null) fixed;
filter:expression('');
color:#555;
text-align:left;
}
body.catalogIndex,
body.paperIndex{
margin:0;
padding:0 !important;
padding:0 0 15px;
width:100%;
height:100%;
background:#FFF;
font-family:"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
color:#555;
text-align:left;
}
body.productsIndex > #container2,
body.catalogIndex > #container2,
body.paperIndex > #container2{
height:auto;
width:auto;
}
img{border:none;vertical-align:top;}
ul{list-style:none;}
p{line-height:140%;}

/* IE6 */ 
* html{ 
background:url(../images/contents_bg.jpg) repeat;
overflow-x:hidden;
} 
/*----------------------------------------------------------------------------
	link
----------------------------------------------------------------------------*/
a{color:#555;font-size:100%;
}
a:visited {color:#555;}
a:hover{color:#555;text-decoration:none;}
a:active{color:#555;}
*:focus{-moz-outline-style: none;}
a { outline: none;
}
/*----------------------------------------------------------------------------
	Clear Fix Hack (Float Clear Hack)
----------------------------------------------------------------------------*/
.clearfix:after{
content: ".";
display: block;
visibility: hidden;
height: 0.1px;
font-size: 0.1em;
line-height: 0;
clear: both;
}
.clearfix{
zoom: 1;
}
/*----------------------------------------------------------------------------
	2ndLayout
----------------------------------------------------------------------------*/
#container2{
width:100%;
height:100%;
min-height:600px;
}
/*----------------------------------------------------------------------------
	flashBox(flashInner)
----------------------------------------------------------------------------*/
#flashBox{
display:block;
position:fixed;
_position:absolute;
top:0;
_top:expression(documentElement.scrollTop  +'px');
left:0;
width:50%;
height:100%;
background:#000;
z-index:7;
}
#flashBox object{
width: 100%;
height:100%;:0;
padding:0;
}
#flashInner{
display: block;
overflow: hidden;
height: 100%;
}
.flashcontent-hidden{
overflow: hidden;
}
.flashcontent-scroll{
overflow: scroll;
}
.flashcontent-visible{
overflow: visible;
}
.flashcontent-auto{
overflow: auto;
}
#pageBtn{
text-align:right;
margin:0 0 10px;
}
/*----------------------------------------------------------------------------
	line layout
----------------------------------------------------------------------------*/
#lineTop{
position:fixed;
_position:absolute;
top:0;
_top:expression(documentElement.scrollTop  +'px');
left:0;
width:100%;
height:15px;
background:url(../images/bg_linetop.gif)  repeat-x;
z-index:5;
}
#lineRight{
position:fixed;
_position:absolute;
top:0;
_top:expression(documentElement.scrollTop  +'px');
right:0;
width:5px;
height:100%;
background:#000;
z-index:6;
}
#lineBottom{
width:100%;
height:5px;
_zoom:40%;
position:fixed;
_position:absolute;
bottom:0;
_bottom:expression(this.style.filter = '0', '0');
background:#000;
z-index:7;
}
/*----------------------------------------------------------------------------
	Contents
----------------------------------------------------------------------------*/
#contentsHead{
position:fixed;
_position:absolute;
top:15px;
_top:expression((documentElement.scrollTop+15)  +'px');
right:0;
width:50%;
height:83px;
background:url(../images/content_headdott.gif) repeat-x;
z-index:6;
min-width:350px;
}
#topicsPath{
min-width:330px;
}
#topicsPath ul{
width:50%;
margin:60px 30px 0 10px;
}
#topicsPath li{
display:inline;
float:left;
margin-right:10px;
}
* html div#topicsPath{
width: expression(document.body.clientWidth < 332? "330px" : "auto");
}
h1#title{
position:absolute;
top:50px;
right:5%;
}
#contentsBox{
margin:0 0 5% 50%;
padding:0;
width:48%;
height:102%;
z-index:0;
min-width:500px;
}
/*----------------------------------------------------------------------------
	Products page
----------------------------------------------------------------------------*/
.prodBoxInner{
margin:0 7% 50px;
padding:150px 0 0 0;
}
.prodBoxInner h2{
margin-bottom:10px;
font-size:20px;
font-weight:bold;
color:#b27426;
}
.prodBoxInner h3{
margin-bottom:20px;
}
.prodBoxInner p{
margin-bottom:20px;
}
.prodBoxInner ul{
margin:0 0 10px 0;
padding:0 0 10px 0;
border-bottom:#555 dotted 1px;
}
#prodBoxInner0 ul{
margin:0;
padding:0;
border:none;
}
.prodBoxInner ul li{
float:left;
margin:0 10px 10px 10px;
}
/*----------------------------------------------------------------------------
	Products詳細ページ
----------------------------------------------------------------------------*/
#aboutProduct{
margin:5% 0 2%;
padding:100px 20px 0px 20px;
}
#name{
width:100%;
}
#name h2{
margin-bottom:8px;
font-size:16px;
font-weight:bold;
color:#b27426;
}
#name h3{
font-size:14px;
margin-bottom:30px;
padding:0 0 10px;
border-bottom:#000 solid 3px;
color:#444;
}
#name p{
margin-bottom:10px;
}
#name p.relation{
margin:10px 0 5px 0;
text-align:right;
} 
.productBox{
margin:0 3% 2%;
padding:30px 5px 0 5px;
border:#777 solid 1px;
}
.productInner{
margin:0 0 30px 0;
}
.productInner ul{
display:inline;
width:40%;
float:left;
text-align:center;
}
.productInner li{
margin-bottom:15px;
}

.linkFamily{
margin:0 3%;
}
.linkFamily2{
margin:0;
}

.linkFamily li,
.linkFamily2 li{
margin:0 0 5px;
padding-left:7px;
background:url(../../images/prdct_arr.gif) 0 4px no-repeat;
}

.linkFamily li.noArr,
.linkFamily2 li.noArr{
margin:0 0 5px;
padding-left:0px;
background:none;
}

/*0421*/
.prodBoxInner .thmbImg{
margin-bottom:30px;
border-bottom:#555 dotted 1px;
}
.prodBoxInner .thmbImg p{
width:55%;
float:left;
display:inline;
margin-right:10px;
}
.prodBoxInner .thmbImg ul{
border:none;
float:right;
display:inline;
margin-right:10px;
}

.prodBoxInner .thmbImg div.btnLupe{
clear:left;
margin:10px 0 10px;
}
.productBox ul li.thumb2{
margin:100px 0 0;
}
.productBox ul li.thumb3{
margin:125px 0 10px;
}

/*----------------------------------------------------------------------------
	table-Products
----------------------------------------------------------------------------*/
.tableArea{
float:right;
display:inline;
margin-right:3%;
width:56%;
}
.tableArea table.spacTabel{
border:#777 solid 1px;
text-align:center;
color:#000;
background:none;
}
.tableArea table.marginB30{
margin-bottom:30px;
}
.tableArea table.marginB55{
margin-bottom:55px;
}

table.spacTabel th{
width:33%;
padding:10px 0;
background: url(../../products/images/img_th_bg.gif) 1px 0 repeat-x;
font-size:12px;
}
table.spacTabel td{
padding:10px;
font-size:18px;
font-weight:bold;
border-bottom:dotted 1px #777;
}
table.spacTabel td span{
font-size:12px;
}
table.spacTabel tr.trLine td{
border-bottom:#777 solid 1px;
}
table.spacTabel tr.borderNone td{
border:none;
}
table.spacTabel td.otherSpac{
font-size:11px;
font-weight: normal;
text-align:left;
}

table.spacTabel td.markTd{
border-left:dotted 1px #777;
border-bottom:none;
}

/*0731*/
.markBlue{
color:#0033cc;
}
.markGreen{
color:#009933;
}
.markPink{
color:#ff3399;
}

/*----------------------------------------------------------------------------
	Information page
----------------------------------------------------------------------------*/
#infoInner{
margin:40px 7% 0;
padding:100px 0 0;
min-width:500px;
text-align:left;
}
#infoInner h2{
margin-bottom:25px;
font-size:16px;
color:#444;
}

#infoInner h2.mar5{
margin:5px;
}

#infoInner img.ttl01{
margin:20px 0 0;
padding:0;
}
#infoInner h3{
clear:both;
margin-bottom:5px;
padding:0;
font-size:14px;
color:#555;
}
#infoInner ul.newsList{
margin-bottom:20px;
text-align:left;
}
#infoInner ul.newsList li{
margin-bottom:5px;
clear:both;
background: none;
padding-left:0;
}
#infoInner img{
margin:0 0 20px;
}
#infoInner p{
margin:0 0 15px;
}

#infoInner p.impt{
font-weight:bold;
color:#666;
}
#infoInner .imptRed{
font-weight:bold;
color:#FF3300;
}

#infoInner p.cap{
margin:25px 0 3px;
}

/*----------------------------------------------------------------------------
	Download page(catalogIndex,paperIndex)
----------------------------------------------------------------------------*/
body.catalogIndex #contentsHead,
body.paperIndex #contentsHead{
position:fixed;
_position:absolute;
top:15px;
_top:expression((documentElement.scrollTop+15)  +'px');
right:0;
width:50%;
height:83px;
background: url(../images/head_dotted_white.gif) repeat-x;
z-index:6;
}
body.catalogIndex #boxInner{
margin:0 -3px 7% 50px;
}

#boxInner0 div.paperTtl h3,
#boxInner1 div.paperTtl h3,
#boxInner2 div.paperTtl h3{
margin-left:2px;
margin-bottom:10px;
font-size:16px;
font-weight:bold;
color:#b27426;
}
#boxInner0 div.paperTtl h4,
#boxInner1 div.paperTtl h4,
#boxInner2 div.paperTtl h4{
margin-left:2px;
margin-bottom:20px;
color:#444;
font-size:14px;
padding-bottom:7px;
border-bottom:3px #444 solid;
}
.craftInner{
margin:0 -3px 30px 50px;
}
/*----------------------------------------------------------------------------
	boxInner
----------------------------------------------------------------------------*/
.boxInner{
margin:0 7% 50px;
}
body.paperIndex #boxInner{
margin:40px 3% 20px;
padding:100px 20px 0 20px;
}
body.paperIndex #boxInner0,
body.paperIndex #boxInner1,
body.paperIndex #boxInner2{
margin:40px 4% 20px;
padding:10px 20px 0 20px;
display:none;
}
body.paperIndex #boxInner0{
display:block;
}
/*----------------------------------------------------------------------------
	#boxInner h
----------------------------------------------------------------------------*/
body.catalogIndex #boxInner h3{
margin:20px 0px 10px;
padding:10px 0 0 15px;
width:465px;
height:30px;
font-size:12px;
background:url(../images/ttl_h4.gif) 0 0 no-repeat;
}
body.catalogIndex #boxInner h4{
margin:0px 0px 10px;
padding-left:10px;
font-size:12px;
background:url(../images/list_mark01.gif) 0 3px no-repeat;
}
/*----------------------------------------------------------------------------
	item
----------------------------------------------------------------------------*/
body.catalogIndex #item li,
body.paperIndex #item li,
.item li{
float:left;
margin:5px;
display:inline;
}
div.item{
width:178px;
float:left;
margin:5px;
display:inline;
}
div.item2{
width:130px;
float:left;
margin:5px 0;
display:inline;
}
body.catalogIndex #item .cap,
.item .cap{
margin:10px 0;
float:none;
font-size:10px;
}
#item .cap2,
div.item2 .cap2{
margin:5px 0;
float:none;
font-size:10px;
height:30px;
}
/*----------------------------------------------------------------------------
	table-Download
----------------------------------------------------------------------------*/
.tableLayout2,
.tableLayout3{
width:480px;
margin:10px 0px 20px;
font-size:12px;
border-top:#CCC solid 1px;
border-left:#CCC solid 1px;
background:#FFF;
}
.tableLayout2 th{
width:10%;
background:#F1F1F1;
padding:5px;
border-right:#CCC solid 1px;
border-bottom:#CCC solid 1px;
text-align:center;
}
.tableLayout2 td{
width:10%;
padding:5px;
border-right:#CCC solid 1px;
border-bottom:#CCC solid 1px;
text-align:center;
}
.tableLayout3 th{
width:25%;
}
.tableLayout3 th{
background:#F1F1F1;
padding:5px;
border-right:#CCC solid 1px;
border-bottom:#CCC solid 1px;
text-align:left;
}
.tableLayout3 td{
padding:5px;
border-right:#CCC solid 1px;
border-bottom:#CCC solid 1px;
text-align:left;
}
/*----------------------------------------------------------------------------
	explanationBox
----------------------------------------------------------------------------*/
.explanationBox{
margin:10px 5% 20px;
padding:10px;
border-top:dotted 1px #CCC;
border-bottom:dotted 1px #CCC;
}
.explanationBox p{
margin:10px 0;
font-size:11px;
}
.explanationBox h5 img{
float:left;
display:inline;
margin-right:15px;
}
.explanationBox li{
margin-bottom:5px;
}
.boxLine img{
border:1px #CCC solid;
}
/*----------------------------------------------------------------------------
	newsInner
----------------------------------------------------------------------------*/
body.catalogIndex #newsInner{
margin:40px 7% 0;
padding:100px 0 0;
min-width:500px;
text-align:left;
}
body.catalogIndex #newsInner h3{
clear:both;
margin-bottom:10px;
font-size:18px;
font-weight:bold;
color:#b27426;
}
body.catalogIndex #newsInner h4{
margin-bottom:30px;
color:#444;
font-size:15px;
}
#newsInner h2{
margin-bottom:25px;
font-size:16px;
color:#444;
}
#newsInner img{
margin:0 0 20px;
}
#newsInner p{
margin:0 0 15px;
}
#newsInner ul{
text-align:center;
margin:0 0 20px;
}
#newsInner li{
margin-right:10px;
float:left;
display:inline;
background:url(../images/list_arr01.gif) 0 3px no-repeat;
padding-left:7px;
}
body.catalogIndex #newsInner p{
margin-bottom:20px;
}
body.catalogIndex #newsInner p span{
padding-top:10px;
font-weight:bold;
line-height:3;
color:#434343;
}
body.catalogIndex #newsInner p.h4Cap{
margin-bottom:2px;
font-size:12px;
}

body.catalogIndex .thumbBox{
margin:0px 6% 20px;
padding:0px 14px 10px;
border-bottom:#555 dotted 1px;
min-width:500px;
}

/*----------------------------------------------------------------------------
	howTo
----------------------------------------------------------------------------*/
body.catalogIndex .howTo{
text-align:left;
margin:0 7% 30px;
padding-top:10px;
clear:left;
}
body.catalogIndex .howTo li.howtoTtl{
font-weight:bold;
margin-bottom:5px;
clear:left;
}
body.catalogIndex .howTo li{
background:none;
margin-bottom:8px;
clear:left;
}
.underSolid{
border-bottom:#000 solid 3px;
padding:0 0 10px;
}
.underDott{
border-bottom:#555 dotted 1px;
padding:0 0 40px;
}

/*----------------------------------------------------------------------------
	TemplateBank
----------------------------------------------------------------------------*/
body.catalogIndex .aboutTmp{
text-align:left;
margin:10px 7% 30px;
padding-top:10px;
clear:left;
}

body.catalogIndex li.banaTmp{
float:left;
display:inline;
margin-right:10px;
}

body.catalogIndex .aboutTmp li{
background:none;
margin-bottom:8px;
font-size:12px;
}
.tmp{
}
body.catalogIndex .tmpbTxt{
float:left;
display:inline;
width:51%;
}
body.catalogIndex .tmpbImg{
float:right;
display:inline;
}

/*----------------------------------------------------------------------------
	aboutPaper
----------------------------------------------------------------------------*/
#aboutPaper{
margin:10px 7% 0;
padding:10px 0 0;
min-width:500px;
text-align:left;
}
#aboutPaper p{
display:inline;
margin-right:4%;
padding:0;
float:left;
width:50%;
font-size:11px;
}
/*----------------------------------------------------------------------------
	btnArea
----------------------------------------------------------------------------*/
#btnArea{
margin:20px 2px;
padding:0;
}
#btnArea2{
margin:40px 50px 0;
padding:0 0;
}
#btnArea li,
#btnArea2 li{
display:inline;
margin:0 3% 0 0;
padding:0;
float:left;
background:none;
}
/*----------------------------------------------------------------------------
	catalog,catalog01,catalog02
----------------------------------------------------------------------------*/
#catalog{
width:85%;
margin:2% 7% 2%;
padding:0;
min-width:500px;
text-align:left;
}
#catalog01{
width:47%;
float:left;
display:inline;
border:1px #CCC solid;
text-align:center;
margin-bottom:3%;
}
#catalog02{
width:47%;
float:right;
display:inline;
border:1px #CCC solid;
text-align:center;
margin-bottom:3%;
}
#catalog01 h5{
margin:1px 1px 10px;
padding:5px 0 0;
width:99%;
height:30px;
font-size:14px;
color:#444;
background:url(../../download/images/catalog_blue.gif) 0 0 repeat-x;
}
#catalog02 h5{
margin:1px 1px 10px;
padding:5px 0 0;
width:99%;
height:30px;
font-size:14px;
color:#444;
background:url(../../download/images/catalog_orange.gif) 0 0 repeat-x;
}
#catalog01 p,
#catalog02 p{
margin-left:20px;
margin-bottom:10px;
text-align:left;
}
#readerArea{
margin-bottom:3%;
}
#readerArea p{
margin-top:10px;
}
#pageTop{
margin-left:50%;
margin-bottom:2%;
text-align:right;
min-width:500px;
}
#pageTop img{
margin-right:2%;
margin-bottom:2%;
}
/*----------------------------------------------------------------------------
	EURO DownloadLayout
----------------------------------------------------------------------------*/
#euroBoxInner1,
#euroBoxInner2,
#euroBoxInner3,
#euroBoxInner4{
display:none;
}
.euroBoxInner{
margin:0 7% 50px;
padding:150px 0 0 0;
}
.euroBoxInner h2{
margin-bottom:10px;
font-size:20px;
font-weight:bold;
color:#b27426;
}
.euroBoxInner h3{
margin-bottom:20px;
}
.euroBoxInner p{
margin-bottom:20px;
}
.euroBoxInner ul{
margin:0 0 30px 0;
padding:0 0 30px 0;
border-bottom:#555 dotted 1px;
}
#euroBoxInner0 ul,
#euroBoxInner1 ul,
#euroBoxInner2 ul,
#euroBoxInner3 ul,
#euroBoxInner4 ul{
margin:0;
padding:0;
border:none;
}
.euroBoxInner ul li{
float:left;
margin:5px;
}
.euroBoxInner .eurobtn ul.flagIcon{
float:right;
display:inline;
margin:0 0 20px;
}
.eurobtn ul.flagIcon li{
margin-top:10px;
text-align:right;
}
.eurobtn{
text-align:right;
margin:0 0 10px;
}

.explanationBox.clearfix ul.artists {
	float: left;
	width: 200px;
	}
	

#pettit_cadeau.explanationBox.clearfix ul.artists {
	width: 500px;
	}

.explanationBox.clearfix a.make {
	display: block;
	width: 90px;
	background: url(../../download/craft/images/button.gif) no-repeat;
	padding: 23px 0;
	text-indent: -12345px;
	float: left;
	}

.explanationBox.clearfix a.make:hover {
	background-position: 0 -63px;
	
}
	
/*------------------
 + catalog-2010
------------------*/
/*
body.catalogIndex div#catalog dl {
	overflow: hidden;
}

body.catalogIndex div#catalog dt {
	float: left;
}
*/
body.catalogIndex div#newsInner {
	text-align: center;
	}
body.catalogIndex div#newsInner h3,
body.catalogIndex div#newsInner h4,
body.catalogIndex div#newsInner p {
	text-align: left;
	}
body.catalogIndex div#catalog img {
	margin-bottom: 0.8em;
	border-top: #F6F6F6 solid 1px;
	border-bottom: #E6E6E6 solid 1px;
}

body.catalogIndex div#catalog ul {
	overflow: hidden;
}

body.catalogIndex div#catalog li {
	float: left;
	margin-left: 1.5em;
}
a.book:hover img,
body.catalogIndex div#catalog a:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
}

body.catalogIndex div#catalog ul li {
	width: 200px;
	margin-bottom: 3em;
	padding-bottom: 1em;
	
	border: #ccc solid 1px;
}

body.catalogIndex div#catalog h5 {
	background: ;
	padding: 0.8em 0.8em 0.5em 0.8em;
	color: #69F;
}
body.catalogIndex div#catalog p {
	padding: 0 0.8em;
	font-size: 10px;
	line-height: 1.2;
}
body.catalogIndex div#catalog dd.dl-p {
	float: right;
	position: relative;
	z-index: 30;
	zoom: 1;
	margin-top: 0.8em;
	margin-right: 0.8em;
	}
body.catalogIndex div#catalog a.download {
	background: url(../../download/images/dl-botton.gif) left top no-repeat;
	display: block;
	text-decoration: none;
	width: 70px;
	height: 23px;
	}
body.catalogIndex div#catalog a.download:hover {
	background-position: left bottom;
	opacity: 10;
	filter: alpha(opacity=100);
	}
body.catalogIndex div#catalog .download span {
	position: relative;
	z-index: -10;
	}
	
