@charset "UTF-8";

/* ========BASIC======== */
html {
   overflow-y:scroll;
}

body {
   margin:0;
   padding:0;
   line-height:1.6;
   letter-spacing:1px;
   font-family:"Hiragino Kaku Gothic Pro",HiraKakuPro-W3,"ヒラギノ角ゴ Pro W3","メイリオ", Meiryo,"ＭＳ Ｐゴシック",verdana,sans-serif;
   font-size:12px;
   color:#000;
   background:#efefef;
   background:-webkit-gradient(linear, left top, left bottom, color-stop(0.80, #fff), color-stop(0.00, #efefef));
   background:-webkit-linear-gradient(top, #efefef 0%, #fff 80%);
   background:-moz-linear-gradient(top, #efefef 0%, #fff 80%);
   background:-o-linear-gradient(top, #efefef 0%, #fff 80%);
   background:-ms-linear-gradient(top, #efefef 0%, #fff 80%);
   background:linear-gradient(to bottom, #efefef 0%, #fff 80%);
}

br {
   letter-spacing:normal;
}

a {
   color:#134D99;
   text-decoration:none;
}

a:hover {
   color:#134D99;
   text-decoration:underline;
}

img {
   border:0;
   vertical-align:bottom;
}

h1,h2,h3,h4,h5,h6 {
   margin:0;
}

h2 {
   clear:both;
   padding:0 10px;
   line-height:2.0;
   color:#fff;
   font-size:15px;
   font-weight:normal;
   background:#770000;
   background:-webkit-gradient(linear, left top, left bottom, color-stop(0.85, #700), color-stop(0.00, #aa2323));
   background:-webkit-linear-gradient(top, #aa2323 0%, #700 85%);
   background:-moz-linear-gradient(top, #aa2323 0%, #700 85%);
   background:-o-linear-gradient(top, #aa2323 0%, #700 85%);
   background:-ms-linear-gradient(top, #aa2323 0%, #700 85%);
   background:linear-gradient(to bottom, #aa2323 0%, #700 85%);
}

h3 {
   clear:both;
   padding:0 10px;
   line-height:2.0;
   font-size:15px;
   font-weight:normal;
   margin:0;
   color:#fff;
   border:1px solid #ddd;
   background:#0B0B61;
   background:-webkit-gradient(linear, left top, left bottom, color-stop(0.85, #0B0B61), color-stop(0.00, #E0E6F8));
   background:-webkit-linear-gradient(top, #E0E6F8 0%, #0B0B61 85%);
   background:-moz-linear-gradient(top, #E0E6F8 0%, #0B0B61 85%);
   background:-o-linear-gradient(top, #E0E6F8 0%, #0B0B61 85%);
   background:-ms-linear-gradient(top, #E0E6F8 0%, #0B0B61 85%);
   background:linear-gradient(to bottom, #E0E6F8 0%, #0B0B61 85%);
}

h4 {
   padding:0 10px;
   line-height:2.0;
   color:#000;
   font-weight:normal;
   font-size:14px;
   border:0;
   background:#f1f1f1;
}

h5 {
   padding:0 10px;
   line-height:2.0;
   font-size:14px;
   font-weight:normal;
   border-left:5px solid #08088A;
   border-bottom:1px solid #ddd;
}

h6 {
   line-height:2.0;
   font-size:13px;
   color:#770000;
}

p {
   margin:10px;
}

ul,ol,dl {
   margin:10px;
   padding:0;
}

li {
   padding:0;
   margin:0 0 0 30px;
}

dt {
   margin:0;
   padding:0;
}

dd {
   margin:0 0 0.5em 1em;
   padding:0;
   background:#f1f1f1;
}

table {
   font-size:12px;
}

table {
   width:600px;
   margin:10px;
   border-collapse:collapse;
   border:1px solid #ddd;
   border-spacing:0;
   line-height:1.8;
}

table th {
   padding:7px;
   border:1px solid #ddd;
   border-width:0 0 1px 1px;
   background:#f3f3f3;
   font-weight:bold;
   text-align:left;
}

table td {
   padding:7px;
   border:1px solid #ddd;
   border-width:0 0 1px 1px;
   text-align:left;
}

table td ol {
   margin:0;
   padding:0 0 0 30px;
}

table td li {
   margin:0;
   padding:0;
}

.works table th{   border:10px solid #eee; font-size:14px; padding:0px; background:#eee;}

.works table td{   border:10px solid #eee;}


.sample_01{
width: 545px;
border-collapse: collapse;
}
.sample_01 th{
width: 25%;
padding: 6px;
text-align: left;
vertical-align: top;
color: #333;
background-color: #eee;
border: 1px solid #b9b9b9;
}
.sample_01 td{
padding: 6px;
background-color: #fff;
border: 1px solid #b9b9b9;
text-align: center;
vertical-align: middle;
}



/* ========TEMPLATE LAYOUT======== */
#container {
   width:940px;
   margin:10px auto;
   padding:20px;
   border:1px solid #ddd;
   -moz-box-shadow:0 0 10px #bfbfbf; /* Firefox用 */  
   -webkit-box-shadow:0 0 10px #bfbfbf; /* Safari,Google Chrome用 */ 
   box-shadow:0 0 10px #bfbfbf;
   background:#fff;
}

#header {
   position:relative;
   width:940px;
   margin-bottom:15px;
}

#menu {
   position:absolute;
   right:0;
   top:0px;
}

#icatch {
   width:940px;
}

#contents {
   float:left;
   width:940px;
   padding:5px 0;
   background:#fff;
}

#conR {
   float:right;
   width:620px;
}

#conL {
   float:left;
   width:300px;
}

#footMenu {
   float:left;
   width:940px;
   margin-top:10px;
}

#footer {
   clear:both;
   width:940px;
}

/* ========HEADER CUSTOMIZE======== */
#header h1 {
   margin:0;
   padding:15px 0 0 5;
   font-size:30px;
   color:#770000;
   line-height:1.0;
}

#header h1 a {
   color:#770000;
}

#header h1 a:hover {
   color:#770000;
}

/* ========MENU CUSTOMIZE======== */
#menu ul {
   margin:0;
   padding-top:40px;
   padding-left:10px;
   padding-bottom:15px;
   list-style:none;
}

#menu li {
   overflow:hidden;
   float:left;
   margin:0;
   padding:0 0 0 25px;
}

#menu li a {
   display:block;
   font-weight:normal;
   color:#134d99;
   outline:none;
}

#menu li a:hover {
   color:#000;
   border-bottom:3px solid #08088A;
   text-decoration:none;
}

/* ========HEADIMAGE CUSTOMIZE======== */
#headImage {
   width:940px;
   height:300px;
   overflow:hidden;
   position:relative;
   list-style:none;
}

#headImage ul {
   list-style:none;
   margin:0;
   padding:0;
}

#headImage li {
   position:absolute;
   background:#fff;
   margin:0;
   padding:0;
}

/* ========MAINCONTENTS CUSTOMIZE======== */
/* TOPNAVI CUSTOMIZE */
.topNavi {
   overflow:hidden;
   position:relative;
   margin-left:-20px;
   margin-top:10px;
   margin-bottom:15px;
}

* html .topNavi {
   height:1em;
   overflow:visible;
}

.topNaviColumn {
   display:inline;
   width:300px;
   float:left;
   margin-left:20px;
   padding:0 0 0 0;
   background:#eee;
}

.topNaviImg {
   margin:0;
   padding:0;
   background:none;
}

.topNaviDetail {
   position:absolute;
   bottom:0;
   width:280px;
   text-align:right;
}

.topNaviDetail a {
   padding:0 0 0 7px;
   background:url("../images/bg_arrow.gif") no-repeat left 50%;
}

/* INFORMATION CUSTOMIZE */
.information {
   width:620px;
   margin-top:20px;
   margin-bottom:20px;
}

.information dl {
   margin:0;
}
.information dt {
   float:left;
   padding-top:5px;
}

.information dd {
   margin:0 0 5px 0;
   padding:5px 0px 5px 9em;
   background:url("../images/bg_dotline.gif") 0 100% repeat-x;
}

/* SUBMENU CUSTOMIZE */
.submenu {
   border:1px solid #ddd;
}

.submenu h3 {
   border:none;
}

.submenu ul {
   margin:10px;
   padding:0;
}
.submenu li {
   margin:0;
   padding:0 0 0 7px;
   list-style:none;
   background:url("../images/bg_arrow.gif") no-repeat left 50%;
}

/* (B) 2階層目 */
.submenu li li {
   list-style:none;
   background:url("../images/bg_list1.gif")no-repeat left 50%;padding-left: 1em; 
}

.submenu p {
   margin:10px;
}

/* BANNER CUSTOMIZE */
.bnrR {
   margin:20px 0;
}

.bnrR ul {
   width:630px;/* for IE7 */
   margin:0 -10px 0 0;
   padding:0;
}

.bnrR li {
   float:right;
   margin:0 10px 0 0;
   padding:10;
   list-style:none;
   margin-bottom:10px;
   background:#eee;
}

.bnrL {
   width:278px;
   margin:20px 0;
   padding:10px;
   border:1px solid #ddd;
}

.bnrL ul {
   margin:0 0 -10px 0;
   padding:0;
}

.bnrL li {
   margin:0;
   padding:10px;
   list-style:none;
   margin-bottom:10px;
   background:#eee;
}

/* ========FOOTMENU CUSTOMIZE======== */
#footMenu ul {
   margin:5px 0;
   padding:20px 0;
   text-align:center;
   border-top:1px solid #ddd;
}

#footMenu li {
   display:inline;
   margin:0 0 0 20px;
   list-style:none;
}

#footMenu li a {
   color:#000;
}

#footMenu li a:hover {
   color:#666;
   text-decoration:underline;
}

/* ========FOOTER CUSTOMIZE======== */
.copyright {
   font-style:normal;
   font-size:11px;
   color:#999;
   line-height:3.0;
   text-align:center;
}

/* ========PAGRTOP CUSTOMIZE========= */
#pageTop {
   position:fixed;
   right:0;
   bottom:0;
   padding:10px;
   background:#08088A
}

#pageTop a {
   padding:0 0 0 12px;
   color:#fff;
   font-size:11px;
   background:#08088A url("../images/bg_pagetop.gif") 0 50% no-repeat;
}




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

/* コンテンツを左に右に振り分ける */

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



/* float */


.fL {
 float : left;
 display: block;

}


.fR {
 float : right;
 display: block;
 margin-left:30px;
}



/* textAlign */


.tC{
 text-align: center;
 display: block;
 margin:0 auto;
}


.tR{
 text-align: right;
 display: block;
 margin:0 auto;
}


.tL{
 text-align: left;
 display: block;
 margin:0 auto;
}



/* --- トップページ商品一覧リストエリア --- */

ul.thumbnail {
width: 100%; /* リストエリアの幅 */
min-width: 620px; /* リストエリアの最小幅（不要な場合は削除） */
margin: 0px 10 10; /* リストエリアのマージン（上、左右、下） */
padding: 0px 0 0; /* リストエリアのパディング（上、左右、下） */
list-style-type: none;
}

/* --- リスト項目 --- */
ul.thumbnail li {
width: 22.9%; /* 項目の幅 */
float: left;
}

/* --- 項目内容 --- */
ul.thumbnail dl {
width: 135px; /* 内容の幅 */
margin: 0 auto; /* 内容のセンタリング */
font-size: 100%;
}

/* --- 写真エリア --- */
ul.thumbnail dt {
/* height: 93px; */ /* 写真エリアの高さ（dt要素の高さを指定する場合） */
margin-bottom: 5px; /* 写真エリアの下マージン */
}
ul.thumbnail dt img {
border: 1px #808080 solid; /* 写真の境界線 */
}

/* --- キャプションエリア --- */
ul.thumbnail dd {
margin: 0 0 3px; /* キャプションエリアのマージン（上、左右、下） */
height: 4em; /* キャプションエリアの高さ */
line-height: 120%;
background:#fff;
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}

/* --- 商品概要ページリストエリア --- */
ul.item-thumbnail {
margin: 0;
padding: 0;

list-style-type: none;
}

/* --- リスト項目 --- */
ul.item-thumbnail li {
padding: 20px 15px; /* リスト項目のパディング（上下、左右） */
border-bottom: 1px #ddd solid; /* リスト項目の下境界線 */
}

/* --- 項目内容 --- */
ul.item-thumbnail dl {
width: 100%;
margin: 0;
font-size: 100%;
}

/* --- 写真エリア --- */
ul.item-thumbnail dt.photo {
width: 160px; /* 写真エリアの幅 */
float: left;
}
ul.item-thumbnail dt.photo img {
border: 1px #808080 solid; /* 写真の境界線 */
}

/* --- キャプションエリア --- */
ul.item-thumbnail dt.title,
ul.item-thumbnail dd {
margin: 0 0 0 160px; /* キャプションエリアのマージン（上右下左） */
background:#fff;
}

/* --- タイトルエリア --- */
ul.item-thumbnail dt.title {
margin-bottom: 5px; /* タイトルエリアの下マージン */
line-height: 120%;
}

/* --- コメントエリア --- */
ul.item-thumbnail dd {
line-height: 150%;
}

/* --- clearfix --- */
.item-clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.item-clearFix {
min-height: 1px;
}


/* --- 商品ができるまでリストエリア --- */
ol.flow {
width: 570px; /* リストエリアの幅 */
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
}

/* --- リスト項目 --- */
ol.flow li {
margin-bottom: 12px; /* リスト項目の下マージン */
padding-bottom: 28px; /* リスト項目の下パディング */
background: url("../images/flow_back.gif") no-repeat center bottom; /* リスト項目の背景 */
}
/* --- 最後のリスト項目 --- */
ol.flow li.last {
margin-bottom: 0;
padding-bottom: 0;
background-image: none;
}

/* --- ボックス --- */
ol.flow dl {
margin: 0;
border: 1px #c0c0c0 solid; /* ボックスの境界線 */
}

/* --- タイトルエリア --- */
ol.flow dt {
padding: 7px 10px 4px; /* タイトルエリアのパディング（上、左右、下） */
background-color: #f9f9f9; /* タイトルエリアの背景色 */
border-bottom: 1px #c0c0c0 solid; /* タイトルエリアの下境界線 */
color: #999999;

}
/* --- タイトル --- */
ol.flow dt strong {
margin-left: 3px;
color: #000;
}

/* --- 本文エリア --- */
ol.flow dd {
margin: 0;
padding: 12px 40px; /* 本文エリアのパディング（上下、左右） */
background-color: #ffffff; /* 本文エリアの背景色 */
color: #2b2b2b;
line-height: 150%;


/* --- サイトマップエリア --- */
ul.sitemap {
width: 100%; /* サイトマップエリアの幅 */
margin: 0;
padding: 0;
font-weight: bold; /* 一旦全ての文字を太字にする */
list-style-type: none;
font-size: 80%;
color: #2b2b2b;
}

/* --- 入れ子にされたリスト用 --- */
ul.sitemap ul {
margin: 0;
padding: 0;
list-style-type: none;
}

/* --- 全てのリスト項目 --- */
ul.sitemap li {
padding: 1px 0 0 10px; /* 1階層目のパディング（上右下左） */
background: url("../images/v_line1.gif") no-repeat left top; /* 1階層目の背景 */
line-height: 120%;
}

/* --- 2階層目のコンテナ --- */
ul.sitemap div.contentNav {
width: 100%; /* コンテナの幅 */
margin-top: 20px; /* コンテナの上マージン */
}

/* --- セクション（2階層目のリストエリア） --- */
ul.sitemap ul.section {
width: 49.9%; /* セクションの幅 */
float: left;
}
ul.sitemap ul.separator {
background: url("../images/v_separator.gif") repeat-y right top; /* セクション間の垂直区切り線 */
}

/* --- 2階層目以降のリスト項目 --- */
ul.sitemap ul.section li {
margin: 0 20px 20px 0; /* 2階層目のマージン（上右下左） */
padding: 1px 0 10px 15px; /* 2階層目のパディング（上右下左）上書き */
background: url("../images/v_line4.gif") no-repeat 5px 0; /* 2階層目の背景 上書き */
border-bottom: 1px #c0c0c0 dotted; /* 2階層目の下境界線 */
}

/* --- 3階層目以降のリストエリア --- */
ul.sitemap ul.section ul {
margin: 7px 0 0 8px; /* 3階層目以降のマージン（上右下左） */
font-weight: normal; /* 3階層目以降の文字をノーマルの太さに戻す */
}

/* --- 3階層目以降のリスト項目 --- */
ul.sitemap ul.section ul li {
margin: 0 0 6px 0; /* 3階層目以降のマージン（上右下左）上書き */
padding: 0 0 0 12px; /* 3階層目のパディング（上右下左）上書き */
background: url("../images/triangle5.gif") no-repeat 0 0.2em; /* 3階層目の背景 上書き */
border-bottom: none; /* 3階層目以降の下境界線 上書き */
}

/* --- 4階層目以降のリスト項目 --- */
ul.sitemap ul.section ul li li {
padding: 0 0 0 9px; /* 4階層目以降のパディング（上右下左）上書き */
background: url("../images/square.gif") no-repeat 0 0.4em; /* 4階層目以降の背景 上書き */
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}