/*!
[White]
bg: #fff;
color: #464646;
heading 1, bc, color: #646464;
heading 2, color: #f00;
link,vlink,footer, color: #919191;
hover, color: #f00;

[Black] 
bg: #000;
color: #d2d2d2;
headings etc, color:#f00;
link,vlink,footer,bc, color: #919191;
hover: #f00;
*/


/* ---------- color ---------- */
html { color:#bababa }
/* header */
div.header div.nav ul.nojs li ul.sub li.title { color:#fff }
div.header div.nav ul.nojs li ul.sub:hover li.title { color:#000 }
/* footer */
div.footer div.nav ul li a { color:#919191 }
div.footer div.nav ul li a:hover { color:#f00 }
/* パンくずリスト 白*/
div.bc { color:#646464 }
div.bc ul li a { color:#646464 }
div.bc ul li a:hover { color:#f00 }
/* パンくずリスト 黒*/
body.bk div.bc { color:#919191 }
body.bk div.bc ul li a { color:#919191 }
body.bk div.bc ul li a:hover { color:#f00 }
/* main 白 */
div.main { color:#464646 }
div.main a { color:#919191 }
div.main a:hover { color:#f00 }
/* main 黒 */
body.bk div.main { color:#d2d2d2 }


/* ---------- background-color ---------- */
html { background-color:#262626 }
/* cwrap */
div.cwrap { background-color:#262626 }
/* header */
div.header { background-color:#000 }
div.header div.nav li.mailmagazine a span { background-color:transparent }
div.header div.nav li.onlineshop a span { background-color:transparent }
/* header nav */
div.header div.nav ul li ul.sub li { background-color:#ebebeb }
/* header nav js */
div.header div.nav ul.js li { background-color:transparent }
div.header div.nav ul.js li ul.sub li { background-color:transparent }
div.header div.nav ul.js li ul.sub li a span.hover { background-color:transparent }
div.header div.nav ul.js li ul.sub li.title { background-color:transparent }
/* header nav nojs */
div.header div.nav ul.nojs li ul.sub li a:hover { background-color:#fff }
div.header div.nav ul.nojs li ul.sub li.title { background-color:transparent }
div.header div.nav ul.nojs li ul.sub:hover li.title { background-color:#ff0c2a }
/* footer */
div.footer div.nav ul li a.irp_ span.ir { background-color:transparent }
div.footer p.copyright span { background-color:transparent }
/* パンくずリスト */
div.bc { background-color:#fff }
div.bc ul li { background-color:transparent }
div.bc ul li.last { background-color:transparent }
/* パンくずリスト 黒 */
body.bk div.bc { background-color:#000 }
/* main 白 */
div.main { background-color:#fff }
/* main 黒 */
body.bk div.main { background-color:#000 }
/* pagetop ボタン */
div.pagetop a span { background-color:transparent }

/* ---------- background-image ---------- */
/* none */
div.bc,
div.bc ul li.last { background-image:none }
/* bg.png main bg */
div.cwrap { background-image:url(../09img/bg.png) }
/* c2009.png COPYRIGHT 2009 */
div.footer p.copyright span { background-image:url(../09img/c2010.png) }
/* bc_br.png パンくずリスト矢印 */
div.bc ul li { background-image:url(../09img/bc_br.png) }
/* sharedmat.png */
div.footer div.nav ul li a.irp_ span.ir,
div.header,
div.header div.nav li.mailmagazine a span,
div.header div.nav li.onlineshop a span,
div.header div.nav ul.js li,
div.header div.nav ul.js li ul.sub li,
div.header div.nav ul.js li ul.sub li a span.hover,
div.header div.nav ul.js li ul.sub li.title,
div.pagetop a span { background-image:url(../09img/sharedmat.png) }


/* ---------- font-family ---------- */
body { font-family:'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', Helvetica, Arial, sans-serif }


/* ---------- font-size ---------- */
body { font-size:75% }
table { font-size:1em }
/* パンくずリスト */
div.bc ul li { font-size:83% }
/* header */
div.header div.nav li.mailmagazine a,
div.header div.nav li.onlineshop a { font-size:91% }
/* footer */
div.footer div.nav ul li { font-size:91% }
/* pagetop */
div.pagetop a { font-size:83% }

/* ---------- background positioning ---------- */
/* topmenu normal */
div.header div.nav ul.js li.n1 {background-position: -0px -463px;}
div.header div.nav ul.js li.n2 {background-position: -150px -463px;}
div.header div.nav ul.js li.n3 {background-position: -300px -463px;}
div.header div.nav ul.js li.n4 {background-position: -450px -463px;}
div.header div.nav ul.js li.n5 {background-position: -600px -463px;}
/* topmenu hover */
div.header div.nav ul.js li.n1 li.title{background-position: -750px -85px;}
div.header div.nav ul.js li.n2 li.title{background-position: -900px -85px;}
div.header div.nav ul.js li.n3 li.title{background-position: -1050px -85px;}
div.header div.nav ul.js li.n4 li.title{background-position: -1200px -85px;}
div.header div.nav ul.js li.n5 li.title{background-position: -1350px -85px;}
/* topmenu current */
body.n1 div.header div.nav ul.js li.n1 {background-position: -750px -463px;}
body.n2 div.header div.nav ul.js li.n2 {background-position: -900px -463px;}
body.n3 div.header div.nav ul.js li.n3 {background-position: -1050px -463px;}
body.n4 div.header div.nav ul.js li.n4 {background-position: -1200px -463px;}
body.n5 div.header div.nav ul.js li.n5 {background-position: -1350px -463px;}

/* menu 1 normal */
div.header div.nav ul.js li.n1 ul li.n1_1 {background-position: -0px -122px;}
div.header div.nav ul.js li.n1 ul li.n1_2 {background-position: -0px -151px;}
div.header div.nav ul.js li.n1 ul li.n1_3 {background-position: -0px -180px;}
div.header div.nav ul.js li.n1 ul li.n1_4 {background-position: -0px -209px;}
div.header div.nav ul.js li.n1 ul li.n1_5 {background-position: -0px -238px;}
div.header div.nav ul.js li.n1 ul li.n1_6 {background-position: -0px -267px;}
div.header div.nav ul.js li.n1 ul li.n1_7 {background-position: -0px -296px;}
/* menu 2 normal */
div.header div.nav ul.js li.n2 ul li.n2_1{background-position: -150px -122px;}
div.header div.nav ul.js li.n2 ul li.n2_2{background-position: -150px -151px;}
div.header div.nav ul.js li.n2 ul li.n2_3{background-position: -150px -180px;}
/* menu 3 normal */
div.header div.nav ul.js li.n3 ul li.n3_1{background-position: -300px -122px;}
div.header div.nav ul.js li.n3 ul li.n3_2{background-position: -300px -151px;}
/* menu 4 normal */
div.header div.nav ul.js li.n4 ul li.n4_1{background-position: -450px -122px;}
div.header div.nav ul.js li.n4 ul li.n4_2{background-position: -450px -151px;}
/* menu 5 normal */
div.header div.nav ul.js li.n5 ul li.n5_1{background-position: -600px -122px;}
div.header div.nav ul.js li.n5 ul li.n5_2{background-position: -600px -151px;}
div.header div.nav ul.js li.n5 ul li.n5_3{background-position: -600px -194px;}
div.header div.nav ul.js li.n5 ul li.n5_4{background-position: -600px -238px;}
div.header div.nav ul.js li.n5 ul li.n5_5{background-position: -600px -282px;}
div.header div.nav ul.js li.n5 ul li.n5_6{background-position: -600px -311px;}

/* menu 1 hover */
div.header div.nav ul.js li.n1 ul li.n1_1 a span.hover{background-position: -750px -122px;}
div.header div.nav ul.js li.n1 ul li.n1_2 a span.hover{background-position: -750px -151px;}
div.header div.nav ul.js li.n1 ul li.n1_3 a span.hover{background-position: -750px -180px;}
div.header div.nav ul.js li.n1 ul li.n1_4 a span.hover{background-position: -750px -209px;}
div.header div.nav ul.js li.n1 ul li.n1_5 a span.hover{background-position: -750px -238px;}
div.header div.nav ul.js li.n1 ul li.n1_6 a span.hover{background-position: -750px -267px;}
div.header div.nav ul.js li.n1 ul li.n1_7 a span.hover{background-position: -750px -296px;}
/* menu 2 hover */
div.header div.nav ul.js li.n2 ul li.n2_1 a span.hover{background-position: -900px -122px;}
div.header div.nav ul.js li.n2 ul li.n2_2 a span.hover{background-position: -900px -151px;}
div.header div.nav ul.js li.n2 ul li.n2_3 a span.hover{background-position: -900px -180px;}
/* menu 3 hover */
div.header div.nav ul.js li.n3 ul li.n3_1 a span.hover{background-position: -1050px -122px;}
div.header div.nav ul.js li.n3 ul li.n3_2 a span.hover{background-position: -1050px -151px;}
/* menu 4 hover */
div.header div.nav ul.js li.n4 ul li.n4_1 a span.hover{background-position: -1200px -122px;}
div.header div.nav ul.js li.n4 ul li.n4_2 a span.hover{background-position: -1200px -151px;}
/* menu 5 hover */
div.header div.nav ul.js li.n5 ul li.n5_1 a span.hover{background-position: -1350px -122px;}
div.header div.nav ul.js li.n5 ul li.n5_2 a span.hover{background-position: -1350px -151px;}
div.header div.nav ul.js li.n5 ul li.n5_3 a span.hover{background-position: -1350px -194px;}
div.header div.nav ul.js li.n5 ul li.n5_4 a span.hover{background-position: -1350px -238px;}
div.header div.nav ul.js li.n5 ul li.n5_5 a span.hover{background-position: -1350px -282px;}
div.header div.nav ul.js li.n5 ul li.n5_6 a span.hover{background-position: -1350px -311px;}

/* mailmagazine normal */
div.header div.nav li.mailmagazine a span.normal{background-position: -998px 0px}
/* mailmagazine hover */
div.header div.nav li.mailmagazine a span.hover{ background-position: -1302px 0px;}

/* onlineshop normal */
div.header div.nav li.onlineshop a span.normal{background-position: -1150px 0px}
/* onlineshop hover */
div.header div.nav li.onlineshop a span.hover{ background-position: -1454px 0px;}


/* footer menu normal  */
div.footer div.nav ul li a.f1 span.ir{background-position: 0 -90px;}
div.footer div.nav ul li a.f2 span.ir{background-position: -85px -90px;}
div.footer div.nav ul li a.f3 span.ir{background-position: -195px -90px;}
div.footer div.nav ul li a.f4 span.ir{background-position: -312px -90px;}
div.footer div.nav ul li a.f5 span.ir{background-position: -421px -90px;}
div.footer div.nav ul li a.f6 span.ir{background-position: -528px -90px;}

/* footer menu hover */
div.footer div.nav ul li a.f1:hover span.ir{background-position: 0 -103px;}
div.footer div.nav ul li a.f2:hover span.ir{background-position: -85px -103px;}
div.footer div.nav ul li a.f3:hover span.ir{background-position: -195px -103px;}
div.footer div.nav ul li a.f4:hover span.ir{background-position: -312px -103px;}
div.footer div.nav ul li a.f5:hover span.ir{background-position: -421px -103px;}
div.footer div.nav ul li a.f6:hover span.ir{background-position: -528px -103px;}



/* ---------- */

html{
  height: 100%;
}

body{
 height:100%;
}


a{
  text-decoration: none;
}

hr{
  display:none;
  
  margin:0;
  padding:0;

  visibility:hidden;
}



/* for image replacement (.irp_ , span.ir a span.ir)*/
.irp_{
  display: block;
  position: relative;
 
  overflow: hidden;
}

span.ir{
  display:block;
  position: absolute;
 
  width: 100%;
  height: 100%;
  top:0;
  left:0;
}

a span.ir{
  cursor: pointer;
}

/* hr for hr and clear */
hr.inv{
  display: block;

  padding: 0 0 12px 0;

  clear:both;
}

/* page top */
div.pagetop{
  padding: 0 12px 12px;
}
div.pagetop a{
  display:block;
  
  margin: 0 0 0 auto;
  width: 59px;
  height:14px;
}

div.pagetop a span{
  background-repeat: no-repeat;
}

div.pagetop a span.normal{
  background-position: -998px -46px;
}

div.pagetop a span.hover{
  background-position: -998px -60px;
}

/* cwrap for shadow */
div.cwrap{
    margin: 0 auto;
    padding: 0 0 0 5px;
    width: 1010px;
    height: 100%;
    
    min-height: 100%;

    background-repeat: repeat-y;
}

body > div.cwrap{
  height: auto;
}

/* content */
div.content{
  width: 998px;
  
  border: 1px solid #353535;
  border-top: none;
  border-bottom: none;

  position: relative;
}

/* header */
div.header{
  position:relative;
  
  height: 85px;


  background-repeat: no-repeat;
  z-index: 10;
}

div.header h1{
  position:absolute;
  
  top:21px;
  left:36px;
}

div.header div.nav{
  position:absolute;
  
  width: 998px;
  top:0;
  left:0;
}

#topmenu{
  position:absolute;
  
  left: 238px;
  top: 48px;
  
  _left: 236px;
}

div.header div.nav ul li{
  float: left;
  
  margin: 0 0 0 2px;
  width: 150px;
  height: 37px;
}

div.header div.nav ul li ul.sub li{
  float: left;
  
  margin: 0;
  height:inherit;
  
  filter: alpha(opacity=90);
  opacity: 0.9;
}

div.header div.nav ul li ul.sub li:hover{
  filter: alpha(opacity=100);
  opacity: 1;
}

div.header div.nav ul li ul.sub li.title{
  height: 37px;
  
  text-align: center;
}

div.header div.nav ul.nojs li ul.sub li{
  height: auto;
}

div.header div.nav ul.nojs li ul.sub li.title{
  padding: 5px 0;
  height: 27px;
}

div.header div.nav ul.nojs li ul.sub li a{
  display:block;
  
  padding: 7px 5px 10px;
  width: 140px;
}

div.header div.nav ul.nojs li ul.sub{
  height:37px;
  
  overflow:hidden;
}

div.header div.nav ul.nojs li ul.sub:hover{
  height: auto;
  
  overflow: auto;
}

div.header div.nav ul.js li,
div.header div.nav ul.js li ul.sub li,
div.header div.nav ul.js li ul.sub li.title,
div.header div.nav ul.js li ul.sub li a span.hover{
  background-repeat: no-repeat;
}

div.header div.nav ul.js li ul.sub{
  float:inherit;

  top:0;
  left:0;
}

div.header div.nav ul.js li ul.sub li.title{
  height: 37px;
  
  opacity: 1;
  filter: alpha(opacity=100);
}

/* header height */
div.header div.nav ul.js li ul.sub li a{
  height: 100%;
}

div.header div.nav ul.js li ul.sub li{
  height: 29px;
}

div.header div.nav ul.js li.n1 ul.sub li.n1_7,
div.header div.nav ul.js li.n5 ul.sub li.n5_2,
div.header div.nav ul.js li.n5 ul.sub li.n5_6{
  height: 43px;
}

div.header div.nav ul.js li.n5 ul.sub li.n5_3,
div.header div.nav ul.js li.n5 ul.sub li.n5_4{
  height: 44px;
}

/* header submenu */
#submenu{
  position: absolute;
  
  top: 0;
  right: 2px;
}
/* header onlineshop */
div.header div.nav li.mailmagazine a,
div.header div.nav li.onlineshop a{
  display: block;
  
  width: 152px;
  height: 45px;
  color: #f00;
}

div.header div.nav li.mailmagazine a span,
div.header div.nav li.onlineshop a span{
  background-repeat: no-repeat;
}


/* footer */
div.footer{
  position: relative;
  
  padding: 10px 0 60px 0;
  
  clear: both;
}

div.footer div.nav{
  position: relative;
  float:left;
  
  margin: 0 0 12px 0;
}

div.footer div.nav ul{
  padding: 0 0 0 2px;
}

div.footer div.nav ul li{
  float:left;
  
  padding: 0 10px;
  
  border-left: 1px solid #ccc;
  line-height: 1;
  _line-height: 1.2;
}

div.footer div.nav ul li:first-child,
div.footer div.nav ul li.first-child{
  border: none;
}

/* footer height */
div.footer div.nav ul li a{
  height: 13px;
}

/* footer width */
div.footer div.nav ul li a.f1 {width: 67px}
div.footer div.nav ul li a.f2 {width: 91px}
div.footer div.nav ul li a.f3 {width: 99px}
div.footer div.nav ul li a.f4 {width: 91px}
div.footer div.nav ul li a.f5 {width: 89px}
div.footer div.nav ul li a.f6 {width: 172px}

div.footer div.nav ul li a.irp_ span.ir{
  background-repeat: no-repeat;
}

/* footer copyright */
div.footer p.copyright{
  float:right;

  margin: 4px 12px  auto;
  width: 205px;
  height: 5px;
}

div.footer p.copyright span.ir{
  background-repeat: no-repeat;
}

/* パンくずリスト */
div.bc{
  border-bottom: 1px dotted #ccc;
}

body.bk div.bc{
  padding-bottom:1px;
  
  border-bottom: none;
}

div.bc ul{
  margin: 0 15px;
  padding: 13px 0px;

  overflow: auto;
  zoom: 100%;
}

div.bc ul li{
  float: left;

  padding: 0 14px 0 0;
  margin: 0 5px 0 0;
  
  line-height: 1.1;

  background-position: right center;
  background-repeat: no-repeat;
}

/* announce  */
div.announce {
  position:absolute;
  top:478px;
  left:759px;
  padding: 0 0px 0px;
}
div.announce  a{
  display:block;
  margin: 0 0 0 auto;
  width: 224px;
  height:13px;
}

div.announce  a span{
  background-repeat: no-repeat;
}

div.announce  a span.normal{
  background-position: 0px 0px;
}

div.announce  a span.hover{
  background-position: 0px 0px;
}

