@charset "UTF-8";

/* M2 Base CSS 2009.1.23 ver 1.11 */

@page {
   size:    21.0cm 29.7cm;
   margin:  0.5cm;
}
@media print {
  body{ font-size: 9pt; }
}
@media screen {
  body{ font-size: 9pt; }
}

html {
  font-size: 62.5%;   /* 基本 10px サイトにより変更 ★ */
  overflow-y:scroll;
}
/* overflow-y:scroll はFirefoxで縦スクロールバーを絶対に表示するための
   記述。コンテンツが縦スクロールの必要なく収まった場合に、Firefoxは
   スクロールバーを表示しないため、コンテンツを真ん中に配置している場合
   などに縦スクロールのありなしで表示位置にズレが生じる。
   これを防ぐ。このプロパティはCSS レベル 2.1としては不正。
   CSS レベル 3ならValid。
   font-size: はこの指定が10px指定。(12px なら 75%) 各セレクタのプロパティで
   1,2em なら 12px; の指定となる

*/



/* --- reset --- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
  margin:0;
  padding:0;
  outline-width: 0;  /* firefox safari opera のリンク線消し好みの問題 ★ */
} 
table {
  border-collapse:collapse;
  border-spacing:0;
}
fieldset,img { border:0; }

/* address,caption,cite,code,dfn,em,strong,th,var {  ★ */
address,caption,th {
  font-style:normal;   
  font-weight:normal;   
}
ol,ul { list-style:none; } 
caption,th { text-align:left; }
q:before,q:after { content:''; } 
abbr,acronym { border:0; }

/* フォントを変更する場合は それぞれ指定すること  ★ */
h1,h2,h3,h4,h5,h6 {  
  font-size:1em;   
  font-weight:normal;   
}

a:focus { outline:none } /* firefox link outline disable */


body {
  background-color:  #e7e7e7;       /* 背景色 ★ */
  color:             #434343;     /* 文字色 ★ */
  font-size:         1.2em;         /* ベースフォントサイズ ★ */
  line-height: 1.5;
  text-align: center; 
}

  body,input,textarea{
    font-family:"ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","Osaka",sans-serif;
  }

  /* for IE7 */
    *+html body,input,textarea {
    font-family:'メイリオ', 'ＭＳ Ｐゴシック';
  }
  
  /* for IE6 */
    * html body,input,textarea {
    font-family:'ＭＳ Ｐゴシック';
  }
  /* IEはfont-familyに欧文やsans-serifを指定すると
     font-sizeが正しくレンダリングされない らしい */


/*  headline font size
h1 { font-size: 2em; }
h2 { font-size: 1.8em; }
h3 { font-size: 1.6em; }
h4 { font-size: 1.4em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1em; }   ★ */


/* --A-- */
a {
  cursor:pointer;
  text-decoration:none;
}
a:hover {
  text-decoration:underline;
}

/* --FORM-- */
fieldset {
  margin-bottom:1em;
  padding:0 1em 1em 1em;
  border:1px solid #ccc;
}

input, textarea {
  line-height:1.4;
  padding:0;
  vertical-align:middle;
}

input[type="checkbox"],input[type="radio"] {
  vertical-align:text-bottom;
}

input[type="submit"] {
  padding:0.1em;
}

legend {
  padding:0.3em;
  background:#fff;
}

select {
  padding:0;
}

    /* for IE6 */
    * html input {
    padding:0.1em;
    }

    * html input.checkbox,
    * html input.radio {
    vertical-align:-0.3em;
    }

    * html input.submit {
    line-height:1.2;
    padding-top:0.2em;
    }

    * html select {
    vertical-align:-0.2em;
    }

    /* for IE7 */
    *+html input {
    padding:0.1em;
    }

    *+html input.submit {
    line-height:1.2;
    padding-top:0.2em;
    }

    *+html select {
    vertical-align:-0.2em;
    }

    /* for Opera9.27 */
    html:first-child input {
    padding:0.1em;
    }

    html:first-child input[type="checkbox"],
    html:first-child input[type="radio"] {
    vertical-align:middle;
    }

    html:first-child input[type="submit"] {
    padding:0.3em;
    }

    html:first-child select {
    padding:0.2em 0.5em;
    }

    /* for Opera9.5+ [Safari3 & Chrome] */
    body:first-of-type input {
    padding:0.1em;
    }

    body:first-of-type input[type="checkbox"],
    body:first-of-type input[type="radio"] {
    vertical-align:text-top;
    }

    body:first-of-type input[type="submit"] {
    padding:0.3em 0.3em 0.2em 0.3em;
    }

    /* for Safari3 & Chrome */
    html:not(:only-child:only-child) input {
    padding:0;
    vertical-align:baseline;
    }

    html:not(:only-child:only-child) select {
    vertical-align:0;
    }

/* clearfix */
.clearfix:after {
  display:block;
  clear:both;
  visibility: hidden;
  height: 0;
  content:".";
}

  /* for IE6 */
  * html .clearfix {
    display:inline-block;
  }

  /* for IE7 */
  *+html .clearfix {
    display:inline-block;
  }


/* 基本リンクテキスト */
/* a      { text-decoration: none }  */
a:link    { color: #556fb5; text-decoration:underline;}
a:visited { color: #556fb5; text-decoration:underline;}
a:hover   { color: #556fb5; text-decoration:underline;} 
a:active  { color: #556fb5; text-decoration:none;}

a.now:link    { color: #f39700; text-decoration:underline;}
a.now:visited { color: #f39700; text-decoration:underline;}
a.now:hover   { color: #f39700; text-decoration:underline;} 
a.now:active  { color: #f39700; text-decoration:none;}


/* 個別 */
.fc-red { color: #e60011; }
.fc-pink { color: #e5004f; }
.fs-10 { font-size: 0.9em; }

/* マージン */
.mgt10 {
  margin-top: 10px;
}

/* --------- container ---------- */
div#container {
  width: 770px;
  margin: 0 auto;
  background: url(./images/bg_1.jpg) repeat-y;
}

div#container-in {
  width: 760px;
  margin: 0 auto;
  background-color: #fff;
  text-align: left; 
}

/* ----------  header  ----------- */
div#header {
  width: 760px;
  margin: 0 0 12px 0;
  border-top: solid 3px #000;
}

div#header h1 {
  float: left;
  margin: 18px 0 0 15px;
}

div#header h2 {
  float: right;
  width: 300px;
  margin: 12px 20px 0 0;
  padding: 0 0 0 8px;
  background: url(./images/img_line-tate.gif) no-repeat left;
}




/* ---------  navi --------- */
ul#gnavi {
  clear: both;
  display:block;
  overflow: hidden;
  width:760px;
  height: 40px;
}

ul#gnavi li {float: left;}

ul#gnavi li.navi1{ width: 109px;}
ul#gnavi li.navi2{ width: 108px;}
ul#gnavi li.navi3{ width: 109px;}
ul#gnavi li.navi4{ width: 108px;}
ul#gnavi li.navi5{ width: 109px;}
ul#gnavi li.navi6{ width: 108px;}
ul#gnavi li.navi7{ width: 109px;}

ul#gnavi li a {
  display: block;
  width:100%;
  height: 0 !important;
  height /**/: 40px;  /* for IE */
  padding-top: 40px;
  background-image: url(./images/nav-gnavi.gif);
}

.navi1 a { background-position:    0px  0px; }
.navi2 a { background-position: -109px  0px; }
.navi3 a { background-position: -217px  0px; }
.navi4 a { background-position: -326px  0px; }
.navi5 a { background-position: -434px  0px; }
.navi6 a { background-position: -543px  0px; }
.navi7 a { background-position: -651px  0px; }

.navi1 a.now { background-position:    0px -40px; }
.navi2 a.now { background-position: -109px -40px; }
.navi3 a.now { background-position: -217px -40px; }
.navi4 a.now { background-position: -326px -40px; }
.navi5 a.now { background-position: -434px -40px; }
.navi6 a.now { background-position: -543px -40px; }
.navi7 a.now { background-position: -651px -40px; }

.navi1 a:hover { background-position:    0px -40px; }
.navi2 a:hover { background-position: -109px -40px; }
.navi3 a:hover { background-position: -217px -40px; }
.navi4 a:hover { background-position: -326px -40px; }
.navi5 a:hover { background-position: -434px -40px; }
.navi6 a:hover { background-position: -543px -40px; }
.navi7 a:hover { background-position: -651px -40px; }


/* ---------  main -------- */
div#main {
  float: left;
  width: 437px;
  padding: 25px 0 20px 20px;
}

/* ---------  extra -------- */
div#extra {
  float: right;
  width: 244px;
  margin: 25px 20px 20px 0;
  padding: 0 0 10px 0;
}


/* ---------  contents -------- */
ul#contents {
  clear: both;
  width: 700px;
  margin: 20px auto;
  padding: 0 0 10px 10px;
  background-color: #f1f1f1;
}

ul#contents li.icon {
  clear: both;
  padding: 10px 0 0 15px;
  background: url(./images/ico_arrow_01.gif) no-repeat 0 16px;
  font-size: 1.2em;
}

ul#contents li.icon2 {
  float: left;
  padding: 10px 20px 0 15px;
  background: url(./images/ico_arrow_01.gif) no-repeat 0 16px;
  font-size: 1.2em;
}

ul#contents li.prodact {
  float: left;
  margin: 5px 0 0 0;
  padding: 0 7px 0 10px;
  border-right: solid 1px #949494;
}

ul#contents li.start {
  float: left;
  margin: 5px 0 0 14px;
  padding: 0 10px 0 10px;
  border-left: solid 1px #949494;
}




/* --------- footer --------- */
div#footer {
  clear: both;
  margin: 0;
  padding: 10px;
  background: url(./images/bg_footer.gif) repeat-x;
  border-top: solid 1px #e2e2e2;
}

div#footer img.inbox1 {
  float: left;
  margin: 30px 0 0 0;
}

div#footer ul {
  float: right;
  margin: 8px 0 0 0;
}


/* ------------------------------------------------------------------------------------------ */
/* -----------------------------------------  共通 ------------------------------------------ */
div#main h3 {
  margin: 20px 0 0 0;
}



/* ------------------------------------------------------------------------------------------ */
/* ---------------------------------------  index.html -------------------------------------- */

/* コピー */
div.catchcopy p {
  margin: 15px 0 0 0;
  font-size: 1.2em;
}

/* ピックアップ */
ul.pickup li {
  margin: 20px 0 0 0;
}

ul.pickup li a:hover img {
  filter: Alpha(Opacity=80);opacity:.80;
  background-color:transparent;
}

/* ニュースリリース */
dl#newsbox {
  float: left;
  width: 436px;
  margin: 0 0 0 5px;
}

dl#newsbox dt {
  padding: 10px 0 5px 8px;
  background: url(./images/ico_arrow_02.gif) no-repeat 0 15px;
  font-weight: bold;
}

dl#newsbox dd {
  padding: 0 0 10px 0;
  border-bottom: solid 1px #dbdbdb;
}

dl#newsbox ul {
  float: right;
  width: 148px;
  margin: 20px 0 0 0;
}

div#extra-in {
  padding: 0 0 10px 0;
  background-color: #eeeeee;
  border-bottom: solid 1px #d3d3d3;
}

/* ラインナップ */
div#extra h3 { margin: 0; }

div#extra div.lineup {
  margin: 10px 0 0 0;
  text-align: center;
  border-bottom: dashed 1px #9f9f9f;
}

div#extra div.lineup a:hover img {
  filter: Alpha(Opacity=80);opacity:.80;
  background-color:transparent;
}

div#extra div.lineup p.name {
  padding: 0 0 0 15px;
  background: url(./images/ico_arrow_01.gif) no-repeat 0 5px;
  *background: url(./images/ico_arrow_01.gif) no-repeat 0 7px;
  font-size: 1.2em;
  font-weight: bold;
}

div#extra div.lineup p {
  width: 229px;
  margin: 5px 0 5px 7px;
  *margin: 3 0 0 7px;
  *padding: 0 0 5px 0;
  text-align: left;
}

/* バナー */
div#extra ul { margin: 20px 0 0 0; }
div#extra li { margin: 5px 0 0 0; }

div#extra a:hover img {
  filter: Alpha(Opacity=80);opacity:.80;
  background-color:transparent;
}

/* 外部リンク */
ul#exterior-link {
  clear: both;
  width: 716px;
  margin: 0 auto 20px;
  *margin: 0 0 20px 22px;
  padding: 15px 0 10px 0;
  border: solid 3px #f1f1f1;
}

ul#exterior-link li {
  float: left;
  margin: 0 17px 0 17px;
  *margin: 0 15px 0 15px;
}

ul#exterior-link li a:hover img {
  filter: Alpha(Opacity=80);opacity:.80;
  background-color:transparent;
}

/* 内部リンク */
div#inside-link {
  clear: both;
  width: 716px;
  margin: 0 auto 20px;
  *margin: 0 0 20px 22px;
  padding: 10px 0 10px 0;
  background-color: #f1f1f1;
}

div#inside-link ul.category li {
  margin: 0 0 0 10px;
  padding: 0 0 0 16px;
  background: url(./images/ico_arrow_01.gif) no-repeat 0 5px;
  *background: url(./images/ico_arrow_01.gif) no-repeat 0 6px;
  font-size: 1.2em;
}

div#inside-link ul.product {
  margin: 5px 0 0 20px;
}

div#inside-link ul.product li {
  float: left;
  padding: 0 10px 0 10px;
  border-left: solid 1px #949494;
}

div#inside-link ul.product li.end {
  border-right: solid 1px #949494;
}

div#inside-link ul.category2 { margin: 5px 0 0 0; }

div#inside-link ul.category2 li {
  float: left;
  margin: 0 15px 0 10px;
  padding: 0 0 0 16px;
  background: url(./images/ico_arrow_01.gif) no-repeat 0 6px;
  *background: url(./images/ico_arrow_01.gif) no-repeat 0 6px;
  font-size: 1.2em;
}