@charset "utf-8";

/*------------------------------------------------
   Layout
------------------------------------------------*/
html{
background:#e7e7e7 url(../img/products_bg02.gif) repeat-y center top;
}

body{
background:url(../img/products_bg01.jpg) no-repeat center top;
}

#sidenavi li.current{
margin:0;
font-size:0;
}

#sidenavi li.nest{
position:relative;
margin:0 0 5px 0;
padding:5px 0 0 0;
background:url(../img/product_navibg01.gif) repeat-y;
}

/*----------- Nesting 1 -----------*/

#sidenavi li ul{
width:225px;
padding:0 0 12px 0;
font-size:0;
color:#fff;
}

#sidenavi li ul a{
font-size:12px;
color:#fff;
outline:none;
}

#sidenavi li ul li{
background:url(../img/product_naviline01.gif) no-repeat center bottom;
}

#sidenavi li ul li.check{
margin:0 0 5px 0;
background:none;
}

#sidenavi li ul li a{
display:block;
padding:2px 0 5px 7px;
line-height:1.2;
text-decoration:none;
background:url(../img/product_naviicon01.gif) no-repeat 206px 2px;
}

#sidenavi li ul li a:hover{
background:url(../img/product_naviicon01_on.gif) no-repeat 206px 2px;
}

#sidenavi li ul li.check a{
background:url(../img/product_naviicon01_check.gif) no-repeat 206px 2px;
}

#sidenavi li ul li.check2 a{
background:url(../img/product_naviicon01_on.gif) no-repeat 206px 2px;
}

/*----------- Nesting 2 -----------*/

#sidenavi li ul li ul{
}

#sidenavi li ul li ul li{
margin:0 0 7px 0;
background:none;
}

#sidenavi li ul li ul li a{
display:block;
padding:0 10px 0 25px;
line-height:1.2;
text-decoration:underline;
background:none;
}

#sidenavi li ul li ul li a:hover{
text-decoration:none;
background:none;
}

#sidenavi li ul li ul li.here a{
background:url(../img/product_naviicon02.gif) no-repeat 206px 2px;
}


#productsContents{
position:relative;
margin:0 0 35px 0;
padding:25px 24px 22px 24px;
}

#productsContents h1{
margin:0 0 33px 0;
}

#productsContents .mainread{
margin:0 0 24px 0;
line-height:1.6;
}

#productsContents .categories{
margin:0 0 26px 0;
padding:5px;
background:#ECECEC;
}

#productsContents .categories dt{
float:left;
width:262px;
height:100px;
margin:0 0 5px 0;
padding:5px;
background:url(../img/products_bg03.gif) no-repeat;
border-right:#ececec solid 6px;
}

#productsContents .categories dt:hover{
background:url(../img/products_bg03_on.gif) no-repeat;
}

#productsContents .categories .right{
border:none;
}

#productsContents .categories dt strong{
display:block;
width:262px;
height:63px;
margin:0 0 3px 0;
overflow:hidden;
}

#productsContents .categories dt span{
display:block;
width:240px;
height:2.8em;
margin:0 0 0 4px;
padding:0.6em 0 0 0;
line-height:1.2;
}

#productsContents .categories dt span.two{
padding:0;
}

#productsContents .categories dd{
float:left;
width:168px;
height:100px;
margin:0 0 5px 0;
padding:6px;
background:url(../img/products_bg04.gif) no-repeat;
border-right:#ececec solid 5px;
}

#productsContents .categories dd:hover{
background:url(../img/products_bg04_on.gif) no-repeat;
}

#productsContents .categories dd strong{
display:block;
width:168px;
height:63px;
margin:0 0 4px 0;
overflow:hidden;
}

#productsContents .categories dd span{
display:block;
width:145px;
margin:0 0 0 3px;
padding:0.6em 0 0 0;
line-height:1.2;
}

#productsContents .categories dd span.two{
padding:0;
}

#productsContents .categories a{
outline:none;
}

#productsContents .menu{
margin:0 0 55px 0;
}

#productsContents .menu li{
float:left;
padding:0 10px 0 0;
}

#productsContents .menu .last{
padding:0;
}

#productsContents h2{
margin:0 0 11px 0;
}

#productsContents .products{
margin:0 0 26px 0;
padding:8px 9px;
background:#ECECEC;
}

#productsContents .products h3{
margin:0 0 10px 0;
}

#productsContents .products .read{
margin:0 0 13px 0;
line-height:1.6;
}

#productsContents .products .lineup{
margin:0 0 22px 0;
}

#productsContents .products .lineup li{
float:left;
padding:0 3px 3px 0;
font-size:0;
}

#productsContents .products .lineup .right{
padding:0 0 3px 0;
}

#productsContents .products .charactor{
}

#productsContents .products .charactor li{
float:left;
padding:0 3px 3px 0;
font-size:0;
}

#productsContents .products .charactor .right{
padding:0 0 3px 0;
}


/*------------------------------------------------
   Category
------------------------------------------------*/

#productsContents .categories{
margin:0 0 26px 0;
padding:5px;
background:#ECECEC;
}

#productsContents .categories li{
float:left;
margin:0 0 5px 0;
padding:0 5px 0 0;
}

#productsContents .categories li.right{
padding:0;
}

#productsContents .categories li:hover{
}

#productsContents .categories li a{
display:block;
width:174px;
padding:17px 0 10px 0;
border:#ccc solid 3px;
background:#fff;
outline:none;
}

#productsContents .categories li strong{
display:block;
width:155px;
height:140px;
margin:0 0 3px 12px;
overflow:hidden;
}

#productsContents .categories li span{
display:block;
width:140px;
margin:0 0 0 12px;
padding:0 13px 0 0;
line-height:1.4;
background:url(../img/products_icon01.gif) no-repeat right center;
}

#productsContents .categories li span:hover{
background:url(../img/products_icon01_on.gif) no-repeat right center;
}

#productsContents .categories li span.two{
padding:0 13px 0 0;
}


/*------------------------------------------------
   Sub Category
------------------------------------------------*/

#productsContents h2.subcategory{
margin:0 0 25px 0;
font-size:20px;
color:#666;
}

#productsContents .items{
margin:0 0 26px 0;
padding:8px;
background:#ECECEC;
}

#productsContents .items li{
float:left;
margin:0 0 2px 0;
padding:0 4px 0 0;
}

#productsContents .items li.right{
padding:0;
}

#productsContents .items li a{
display:block;
width:133px;
height:131px;
background:#fff;
outline:none;
}

#productsContents .items li a:hover{
}

#productsContents .items li strong{
display:block;
width:95px;
height:95x;
margin:0 0 6px 15px;
padding:6px 0 0 0;
overflow:hidden;
}

#productsContents .items li span{
display:block;
width:120px;
margin:0 0 0 5px;
font-size:10px;
color:#000;
text-align:center;
line-height:1.2;
}

#productsContents .items li span.two{
}


/*------------------------------------------------
   Modal widnow
------------------------------------------------*/

#modalWrap{
display:none;
position:absolute;
top:0;
left:0;
height:100%;
width:100%;
font-family:"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
z-index:90;
}

#glayLayer{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
_height:1168px;
background:#000;
z-index:100;

filter: alpha(opacity=50);
-moz-opacity:0.5;
opacity:0.5;
}

#overLayer{
display:none;
position:absolute;
top:80px;
left:0;
width:100%;
text-align:center;
z-index:110;
}

#itemWrap{
display:block;
width:640px;
margin:0 auto;
padding:8px 10px;
text-align:left;
background:#fff;
}

#itemWrap .head{
position:relative;
margin:0 0 8px 0;
background:#F3F3F3;
}

#itemWrap .head h1{
padding:5px 80px 4px 10px;
font-size:14px;
color:#000;
line-height:1.4;
}

#itemWrap .head .close{
position:absolute;
right:10px;
_right:20px;
top:7px;
}

#itemWrap #image{
text-align:center;
margin:0 0 36px 0;
}

#itemWrap #copyright{
text-align:right;
margin:0 20px 10px 20px;
}

#itemWrap .info{
margin:0 0 1px 0;
}

#itemWrap .info th{
padding:4px 10px;
line-height:1.4;
background:#EDEDED;
border-bottom:#fff solid 1px;
}

#itemWrap .info td{
padding:4px 10px;
line-height:1.4;
background:#F3F3F3;
}



/*------------------------------------------------
   Idea
------------------------------------------------*/


#ideaContents{
position:relative;
margin:0 0 35px 0;
padding:25px 24px 22px 24px;
}

#ideaContents h1{
margin:0 0 33px 0;
}

#ideaContents .mainread{
margin:0 0 24px 0;
line-height:1.6;
}

#ideaContents .greyarea{
margin:0 0 15px 0;
padding:8px 10px;
background:#ECECEC;
}

#ideaContents .greyarea h2{
margin:0 0 3px 0;
}

#ideaContents .greyarea .img{
margin:0 0 10px 0;
padding:8px;
text-align:center;
background:#fff;
}

#ideaContents .menu{
margin:0 0 0 13px;
}

#ideaContents .menu li{
float:left;
padding:0 11px 0 0;
}


/*------------------------------------------------
   Yosegaki
------------------------------------------------*/


#ideaContents h1.yosegaki{
margin:0 0 42px 0;
}

#ideaContents .box{
position:relative;
margin:0 0 16px 0;
padding:10px;
border:#ededed solid 5px;
}

#ideaContents .box h2{
margin:0 0 15px 0;
padding:0 0 10px 0;
background:url(../img/yosegaki_line01.gif) no-repeat left bottom;
}

#ideaContents .box .img{
float:left;
padding:0 15px 20px 0;
}

#ideaContents .box .txt{
line-height:1.6;
padding:0 0 20px 0;
}


/*------------------------------------------------
   Naruhodo
------------------------------------------------*/


#naruhodoContents{
position:relative;
margin:0 0 10px 0;
padding:25px 24px 24px 24px;
}

#naruhodoContents h1{
}


#tabContents{
position:relative;
margin:0 0 35px 0;
padding:86px 24px 22px 24px;
}

#tabContents .tab{
position:absolute;
left:0px;
_left:-24px;
top:0px;
width:608px;
height:51px;
font-size:0;
}

#tabContents .tab li{
float:left;
}

#tabContents .tab li a{
display:block;
width:152px;
height:51px;
outline:none;
text-indent:-9000px;
overflow:hidden;
}

#tabContents .tab li .cn01{background:url(../img/naruhodo_navi01.gif) no-repeat 0px 0px;}
#tabContents .tab li .cn02{background:url(../img/naruhodo_navi01.gif) no-repeat -152px 0px;}
#tabContents .tab li .cn03{background:url(../img/naruhodo_navi01.gif) no-repeat -304px 0px;}
#tabContents .tab li .cn04{background:url(../img/naruhodo_navi01.gif) no-repeat -456px 0px;}

#tabContents .tab li .cn01:hover{background:url(../img/naruhodo_navi01.gif) no-repeat 0px -51px;}
#tabContents .tab li .cn02:hover{background:url(../img/naruhodo_navi01.gif) no-repeat -152px -51px;}
#tabContents .tab li .cn03:hover{background:url(../img/naruhodo_navi01.gif) no-repeat -304px -51px;}
#tabContents .tab li .cn04:hover{background:url(../img/naruhodo_navi01.gif) no-repeat -456px -51px;}

#tabContents .tab li.on .cn01{background:url(../img/naruhodo_navi01.gif) no-repeat 0px -102px;}
#tabContents .tab li.on .cn02{background:url(../img/naruhodo_navi01.gif) no-repeat -152px -102px;}
#tabContents .tab li.on .cn03{background:url(../img/naruhodo_navi01.gif) no-repeat -304px -102px;}
#tabContents .tab li.on .cn04{background:url(../img/naruhodo_navi01.gif) no-repeat -456px -102px;}

#tabContents .content{
display:none;
background:#fff;
}

#calender{
}

#calender h2{
margin:0 0 11px 0;
}

#calender .box{
position:relative;
margin:0 0 16px 0;
padding:10px;
border:#ededed solid 5px;
}

#calender .box h3{
margin:0 0 15px 0;
padding:0 0 10px 0;
background:url(../img/yosegaki_line01.gif) no-repeat left bottom;
}

#calender .box .read{
margin:0 0 13px 0;
line-height:1.6;
}

#calender .box .img{
}

#xmas{
}

#xmas h2{
padding:15px 0 0 0;
margin:0 0 10px 0;
}

#xmas .faqnavi{
margin:0 0 40px 0;
line-height:2.4;
}

#xmas .question{
margin:0 0 5px 0;
padding:10px;
border:#ededed solid 5px;
line-height:1.6;
}

#xmas .question dt{
padding:3px 0 6px 28px;
font-weight:bold;
background:url(../img/faq_icon02.gif) no-repeat left top;
border-bottom:#fff solid 1px;
}

#xmas .question dd{
padding:6px 0 0 0;
background:url(../img/faq_line01.gif) no-repeat center top;
}

#xmas .question dd h3{
margin:0 0 10px 0;
padding:10px 0 0 0;
}

#xmas .question dd img{
margin:5px 0 0 0;
}

#xmas .question dd dl{
margin:0 0 10px 0;
border:none;
}

#xmas .question dd dl dt{
padding:4px 10px 3px 10px;
background:#ccc;
}

#xmas .question dd dl dd{
padding:14px 10px 13px 10px;
background:#ededed;
}

#xmas .question dd dl dd p{
margin:0 0 10px 0;
}

#xmas .listtop{
padding:0 3px 0 0;
}

#engjpn{
}

#engjpn h2{
margin:0 0 20px 0;
padding:30px 0 0 0;
font-size:14px;
}

#engjpn h3{
padding:10px 5px 9px 10px;
color:#fff;
background:#CC3E9F;
border-bottom:#fff solid 1px;
}

#engjpn ul{
margin:0 0 10px 0;
}

#engjpn ul li{
}

#engjpn .ttl{
margin:0 0 10px 0;
line-height:1.6;
}

#engjpn table{
line-height:1.6;
border-bottom:#fff solid 1px;
}

#engjpn table th{
width:140px;
padding:7px 5px 6px 10px;
vertical-align:top;
font-weight:bold;
background:#f3f3f3;
}

#engjpn table td{
padding:7px 5px 6px 20px;
vertical-align:top;
font-weight:bold;
background:#f3f3f3;
}

#other{
}

#other h2{
padding:15px 0 0 0;
margin:0 0 10px 0;
}

#other .faqnavi{
margin:0 0 40px 0;
line-height:2.4;
}

#other .question{
margin:0 0 5px 0;
padding:10px;
border:#ededed solid 5px;
line-height:1.6;
}

#other .question dt{
padding:3px 0 6px 28px;
font-weight:bold;
background:url(../img/faq_icon02.gif) no-repeat left top;
border-bottom:#fff solid 1px;
}

#other .question dd{
padding:6px 0 0 0;
background:url(../img/faq_line01.gif) no-repeat center top;
}

#other .question dd p{
margin:0 0 10px 0;
}

#other .question dd dl{
margin:0 0 10px 0;
border:none;
}

#other .question dd dl dt{
padding:4px 10px 3px 10px;
background:#ccc;
}

#other .question dd dl dd{
padding:14px 10px 13px 10px;
background:#ededed;
}

#other .listtop{
padding:0 3px 0 0;
}


/*------------------------------------------------
   Tool
------------------------------------------------*/


#toolContents{
position:relative;
margin:0 0 35px 0;
padding:25px 24px 22px 24px;
}

#toolContents h1{
margin:0 0 33px 0;
}

#toolContents .mainread{
margin:0 0 24px 0;
line-height:1.6;
}

#toolContents .readbox{
margin:0 0 13px 0;
}

#toolContents .readbox .img{
float:left;
}

#toolContents .readbox .warning{
padding:15px 0 0 235px;
line-height:1.4;
font-size:10px;
}

#toolContents .readbox .warning dt{
margin:0 0 5px 0;
color:#CC3E9F;
}

#toolContents .readbox .warning dd{
margin:0 0 5px 0;
padding:0 0 0 7px;
background:url(../img/tool_icon01.gif) no-repeat left 5px;
}

#toolContents .box{
position:relative;
margin:0 0 16px 0;
padding:10px;
border:#ededed solid 5px;
}

#toolContents .box h2{
margin:0 0 15px 0;
padding:0 0 10px 0;
background:url(../img/tool_line01.gif) no-repeat left bottom;
}

#toolContents .box .img{
float:left;
}

#toolContents .box .sub{
line-height:1.6;
padding:0 0 20px 275px;
}

#toolContents .box .sub .txt{
margin:0 0 16px 0;
}

#toolContents .box .sub .btn{
margin:0 0 10px 0;
}

#toolContents .box .sub .warning{
font-size:10px;
}

#toolContents .box .sub .warning a{
color:#CC3E9F;
}

#toolContents .box .read{
margin:0 0 20px 0;
line-height:1.6;
}

#toolContents .box .download{
margin:0 0 40px 0;
}

#toolContents .box .download .left{
float:left;
}

#toolContents .box .download .right{
float:right;
}

#toolContents .box .download dl{
width:260px;
}

#toolContents .box .download dl dt{
margin:0 0 15px 0;
}

#toolContents .box .download dl dd{
padding:0 5px 0 3px;
font-size:10px;
line-height:1.7;
}

#toolContents .box .install{
padding:13px 3px;
background:#EDEDED;
}

#toolContents .box .install h3{
margin:0 0 22px 0;
}

#toolContents .box .install dl{
margin:0 0 20px 0;
line-height:1.6;
font-weight:bold;
}

#toolContents .box .install dl.last{
margin:0;
}

#toolContents .box .install dl dt{
margin:0 0 10px 0;
padding:0 0 10px 5px;
background:url(../img/tool_line02.gif) no-repeat left bottom;
}

#toolContents .box .install dl dd{
padding:0 0 0 5px;
}



/*------------------------------------------------
   List
------------------------------------------------*/


#listContents{
position:relative;
margin:0 0 35px 0;
padding:25px 24px 22px 24px;
}

#listContents h1{
margin:0 0 48px 0;
}

#listContents .navi{
margin:0 0 14px 0;
}

#listContents .navi li{
float:left;
width:70px;
}

#listContents .mainread{
margin:0 0 24px 0;
font-size:10px;
line-height:1.6;
}

#listContents .readbox{
margin:0 0 13px 0;
}

#listContents h2{
margin:0 0 8px 0;
font-size:12px;
color:#CC3E9F;
}

#listContents table{
margin:0 0 5px 0;
}

#listContents table th{
padding:7px 10px;
color:#fff;
line-height:1.3;
background:#999999;
border-bottom:#fff solid 1px;
}

#listContents table td{
padding:7px 10px;
line-height:1.3;
background:#EDEDED;
border-bottom:#fff solid 1px;
}

#listContents table .even td{
background:#f3f3f3;
}

#listContents table .td1{
width:25%;
}

#listContents table .td2{
width:40%;
}

#listContents table .td3{
width:35%;
}

.listtop{
text-align:right;
margin:0 0 25px 0;
}