@charset "UTF-8";

@import "defaults.css";
@import "form.css";


/* 基本
-----------------------------------------------*/
body {
	font-size: 0.8em;
	line-height: 1.5em;
	color: #333333;
}

a:link, a:visited { color: #333333; text-decoration: underline; }
a:hover, a:active { color: #FF3300; text-decoration: underline; outline: none; }
em {color: #FF0000;font-style: normal;}
strong {font-weight:bold;}


/* 共通
-----------------------------------------------*/
.attention { color: #FF0000; }
.message { border: 2px dotted #99CC00; padding: 10px; margin: 0 0 10px; }
.float-right {float:right;}
.float-left {float:left;}
.lead {margin-bottom: 10px;}
.sign {text-align:right;}
.region {margin: 0 0 1em 0.9em;}
.annotation {text-indent:-1em;padding-left:1em;}

ul.standard li {list-style-type:disc;margin: 0 0 0 1em;}

/* テーブル */
table {border-collapse:collapse;width: 100%;font-size: 1em;}
table.form, table.list {margin: 0 0 10px;}
th, td {border: 1px solid #cccccc;padding: 5px;}
th {
    font-weight: normal;
    color: #00479d;
    background: #eeeeee;
}
table.form th {width: 150px; text-align: left;}
table.list th {width: auto; text-align: center;}
table.list td {text-align:center;}
td.price, table.list td.price {text-align: right;}
th.result, table.list th.result {text-align: right;}
td.address, table.list td.address {text-align: left;}
td.name, table.list td.name {text-align: left;}

#main .page-wrapper h2 {
  background-image: url(../img/titles.gif);
  text-indent: 10px;
  height: 38px;
  line-height: 38px;
  font-size: 1.2em;
  font-weight: bold;
  color: #990000;
  margin: 0 0 10px;
}
.three-column #main .page-wrapper h2 {width: 470px;background-position: 0 -76px;}
.two-column-left #main .page-wrapper h2, .two-column-right #main .page-wrapper h2 {width: 670px;background-position: 0 -76px;}
.one-column #main .page-wrapper h2 {width: 900px;background-position: 0 0;}

#detail-recommend h2, #detail-voice h2, .detail-sub h3, #page-login h3, #page-shopping h3, #page-mypage h3, #popup h2, #page-payment h3, #page-upload h3 {
  background: url(../img/titles.gif) 0 -114px no-repeat;
  text-indent: 15px;
  height: 28px;
  line-height: 28px;
  font-size: 1.1em;
  font-weight: bold;
  color: #990000;
  margin: 0 0 10px;
}


#block-recommend h2 {background: url(../img/titles.gif) 0 -142px no-repeat;width: 248px;height:51px;text-indent:-9999em;}

#block-phone h2, #block-category h2,
#block-cart h2, #block-login h2 {background-image: url(../img/sprite.jpg);height: 38px;text-indent: -9999em;}
#block-phone h2 {background-position: -200px -280px;}
#block-category h2 {background-position: 0 -318px;}
#block-cart h2 {background-position: 0 -280px;}
#block-login h2 {background-position: -200px -318px;}

#relative-category h3 {padding-bottom: 2px; border-bottom: 1px solid #CCCCCC;margin: 0 0 10px;}


/* レイアウト
-----------------------------------------------*/
#head-wrapper {background: url(../img/back_head.gif) 0 0 repeat-x;height: 140px;}
#head {width: 900px;margin: 0 auto;height: 140px;position: relative;}
#body {width: 900px;margin: 0 auto;padding: 0 0 10px;}
#left {width: 200px;float: left;}
#right {width: 200px;float: right;}
#main-wrapper {width: 690px;float:right;}
.one-column #main {width: 900px;}
.two-column-right #main {width: 690px;float: left;padding: 10px 0 0;}
.two-column-left #main {width: 690px;float: right;padding: 10px 0 0;}
.three-column #main {width: 480px;float: left;padding: 10px 0 0;}
#main-bottom {padding: 10px 0 0;}
#foot-wrapper { background: url(../img/back_foot.gif) 0 0 repeat-x;}
#foot {width: 900px;margin: 0 auto;}

.three-column #main .page-wrapper {width: 470px;margin: 0 auto;}


/* ヘッダー
-----------------------------------------------*/
h1 { position: absolute; top: 3px; left: 0px; }
#logo { width: 440px; height: 85px; position: absolute; top: 23px; left: 0px; }
#primary-links {
  width: 398px;
  height: 61px;
  position: absolute;
  top: 79px;
  left: 502px;
}
#primary-links li {position: absolute;top:0;text-indent: -9999em;}
#primary-links li a {display: block;height: 61px; background-image: url(../img/primary_links.gif);}
#primary-links-home {width: 100px;left:0;}
#primary-links-home a {width: 100px;background-position: 0 0;}
#primary-links-home a:hover {background-position: 0 -61px;}
#primary-links-mypage {width: 99px;left:100px;}
#primary-links-mypage a {width: 99px;background-position: -100px 0;}
#primary-links-mypage a:hover {background-position: -100px -61px;}
#primary-links-regist {width: 99px;left:199px;}
#primary-links-regist a {width: 99px;background-position: -199px 0;}
#primary-links-regist a:hover {background-position: -199px -61px;}
#primary-links-cart {width: 100px;left:298px;}
#primary-links-cart a {width: 100px;background-position: -298px 0;}
#primary-links-cart a:hover {background-position: -298px -61px;}
#search {position: absolute; top: 25px;right: 0;width: 460px;text-align:right;}
a#btn-search-submit {
  float: right;
  display: block;
  height: 23px;
  width: 52px;
  margin: 0 0 0 5px;
  background-image: url(../img/buttons.gif);
  background-position: -701px -264px;
  text-indent: -9999em;
  text-align:left;
}
a#btn-search-submit:hover {background-position: -701px -288px;}


/* フッター
-----------------------------------------------*/
#totop {text-align:right;padding: 8px 5px 5px;}
address {text-align: center;}


/* 商品一覧＆商品詳細
-----------------------------------------------*/
/* 商品一覧 */
.list-rows {border: 1px dotted #CCCCCC;padding: 5px;margin: 0 0 10px;}
.list-rows .action {float:right;}
.list-rows .number {float:left;}
.list-item {border-bottom: 1px solid #CCCCCC;margin: 0 0 20px;padding: 0 0 20px;}
.list-item .image {width: 140px;float;left;}
.list-item .image img {border:1px solid #CCCCCC;padding: 5px;}
.list-item .data {width: 320px;float:right;}
.list-item .data h3 {font-weight: bold;font-size: 1.2em;padding: 3px;margin: 0 0 5px;border-bottom: 3px solid #FF3366;}
.list-item .data h3 a {color: #990000;text-decoration:none;}
.list-item .data .icon {margin: 0 0 5px;}
.list-item .data .comment {margin: 0 0 20px;}
.list-item .data dl {border-bottom: 1px solid #CCCCCC;}
.list-item .data dt {float: left;}
.list-item .data dd {float:right;font-size: 1.4em;font-weight:bold;color: #990000;}
.list-item .data dd span {color: #333333;font-size: 1em;font-weight:normal;}

/* 商品詳細 */
#detail-comment {margin: 0 0 20px;}
#detail-misc {margin: 0 0 20px;}
#detail-image {
  float: left;
  width: 210px;
  padding: 10px 0;
  border: 1px solid #CCCCCC;
  background: url(../img/back_detail_image.gif) left bottom repeat-x;
  text-align:center;
}
#detail-image img {margin: 0 auto;}
#detail-data {width: 244px; float:right;}
#detail-data .icon {margin: 0 0 5px;}
#detail-data h3 {font-size: 1.1em;font-weight:bold;color:#990000;margin: 0 0 1.5em;}
#detail-data dt {clear:both;float:left;}
#detail-data dd {text-align:right;margin: 0 0 3px;}
#detail-price {margin: 0 0 1.5em;}
#detail-price dd {border-bottom: 1px solid #CCCCCC;}

#detail-voice li {padding: 10px; border-top: 1px dotted #CCCCCC;}
#detail-voice li.title {font-weight: bold;}

#relative-category p {float:left; margin: 0 1.5em 10px 0;}
#relative-category a {
  background: url(../img/arrow_circle_red_right.gif) left center no-repeat transparent;
  padding: 2px 0 2px 15px;
}


/* MYページ
-----------------------------------------------*/
#page-login .box {border:1px solid #CCCCCC;padding: 10px;margin: 0 0 10px;}
#page-login-form {margin: 20px 0;}
#page-login-mail, #page-login-pass {
  background-position: 8px 60%;
  background-repeat: no-repeat;
  padding-left: 50px;
  margin: 0 auto;
  width: 400px;
}
#page-login-mail { background-image: url(../img/icon_mail.gif); }
#page-login-pass { background-image: url(../img/icon_key.gif); }
#mypage-navigation {text-align: center;margin: 0 0 10px;}
#mypage-navigation li {display:inline;margin: 0 0 0 5px;}
#mypage-navigation li a {
  background: url(../img/arrow_circle_red_right.gif) left center no-repeat transparent;
  padding: 8px 0 8px 15px;
}
p.history-condition {margin: 0 0 10px;padding: 10px;border: 1px solid #CCCCCC;}


/* カゴの中＆購入手続き
-----------------------------------------------*/
#cart-products .action {width: 60px;}
#cart-products .image {width: 90px;}
#cart-products .price {width: 120px;}
a.btn-cart-delete, a.btn-cart-up, a.btn-cart-down {
  display: block;
  height: 23px;
  text-align:left;
  text-indent: -9999em;
  background-image: url(../img/buttons.gif);
}
a.btn-cart-delete {width: 42px;background-position: -796px -264px;margin: 0 auto;}
a.btn-cart-delete:hover {background-position: -796px -288px;}
a.btn-cart-up {width: 20px;background-position: -754px -264px;float:left;}
a.btn-cart-up:hover {background-position: -754px -288px;}
a.btn-cart-down {width: 20px;background-position: -775px -264px;float:right;}
a.btn-cart-down:hover {background-position: -775px -288px;}
p.qty-updown {width: 45px;margin: 0 auto;}

#page-shopping .box {margin: 0 0 10px;}
#shopping-flow {width: 900px;height: 40px;margin: 0 auto 20px;background-image: url(../img/flow.gif);}
#shopping-flow.step1 {background-position: 0 0;}
#shopping-flow.step2 {background-position: 0 -40px;}
#shopping-flow.step3 {background-position: 0 -80px;}
#shopping-flow.step4 {background-position: 0 -120px;}
#shopping-flow li {text-indent: -9999em;}


/* ページ
-----------------------------------------------*/
#page-contact p {margin: 0 0 10px;}

/* 個人情報保護方針 */
#page-privacy p.lead {margin: 0 10px 10px;}
#privacy-list {border: 1px solid #CCCCCC;padding: 20px;}
#privacy-list h3 {text-align:center;font-size: 1.4em;font-weight:bold;margin: 0 0 1em;}
#privacy-list ol li {list-style-type: decimal;margin: 0 0 1em 2em;}

/* 送料・お支払方法 */
#page-payment h4 {font-weight:bold;}
#page-payment h5 {font-weight:bold;color:#3357FF;}
#page-payment p {margin-bottom: 1em;}
#page-payment p.annotation {margin:0;}
#page-payment .table-fee {margin: 0 0 10px;}
#page-payment .table-fee th {background: url(../img/back_th_static.gif) top left repeat-x #E0F1FB;}
#page-payment .table-fee tbody th {width: 190px;}
#page-payment .table-fee .price {font-size: 1.3em;}
#page-payment-payment span.price {font-size: 1.3em;color:#FF3366;font-weight:bold;}

/* 初めての方へ */
#page-beginner .beginner-item {width:225px;border: 1px solid #4C96FF;padding: 5px 0;margin: 0 0 10px;}
#page-beginner .beginner-item.left {float:left;}
#page-beginner .beginner-item.right {float:right;}
#page-beginner .beginner-item h3 {background: url(../img/arrow_square_blue_right.gif) 5px center no-repeat;padding-left: 20px;margin: 0 0 10px;font-weight:bold;}
#page-beginner .beginner-item p {margin: 0 5px 0 20px;}

/* データ入稿について */
#page-upload table th {background: url(../img/back_th_static.gif) top left repeat-x #E0F1FB;}
#upload-flow-data {width:462px;height:258px;background: url(../img/upload_flow_data.gif);margin: 0 auto 10px;}
#upload-flow-ship {width:451px;height:278px;background: url(../img/upload_flow_ship.gif);margin: 0 auto 10px;}
#upload-flow-data li, #upload-flow-ship li {text-indent: -9999em;}

/* ご利用の流れ */
#page-flow h3 {font-weight:bold;}
#page-flow h4 {color:#3357FF;}
#page-flow p {margin: 0 0 1em;}
#page-flow ol {margin-left: 10px;}
#page-flow ol li {padding: 0 0 0 35px;margin: 0 0 10px;}
#page-flow ol li.step01 {background: url(../img/icon_flow_step01.gif) 0 0 no-repeat;}
#page-flow ol li.step02 {background: url(../img/icon_flow_step02.gif) 0 0 no-repeat;}
#page-flow ol li.step03 {background: url(../img/icon_flow_step03.gif) 0 0 no-repeat;}
#page-flow ol li.step04 {background: url(../img/icon_flow_step04.gif) 0 0 no-repeat;}
#page-flow ol li.step05 {background: url(../img/icon_flow_step05.gif) 0 0 no-repeat;}
#page-flow ol li.step06 {background: url(../img/icon_flow_step06.gif) 0 0 no-repeat;}
#page-flow ol li.step07 {background: url(../img/icon_flow_step07.gif) 0 0 no-repeat;}
#page-flow p.arrow {padding-bottom: 45px;background: url(../img/arrow_large_blue_down.gif) center bottom no-repeat;}


/* ブロック
-----------------------------------------------*/
.block-wrapper {margin: 0 0 10px;}

#block-phone .block-body, #block-category .block-body,
#block-cart .block-body, #block-login .block-body {
  background: url(../img/back_block.gif) 0 bottom repeat-x;
  border-left: 1px solid #CCCCCC;
  border-right: 1px solid #CCCCCC;
  border-bottom: 1px solid #CCCCCC;
  padding: 10px;
}

/* ご利用ガイド */
#block-guide li {margin: 0 0 5px;}
#block-guide li a {
  background-image: url(../img/sprite.jpg);
  text-indent: -9999em;
  display: block;
  height: 30px;
}
#guide-flow a {background-position: 0 -40px;}
#guide-flow a:hover {background-position: -200px -40px;}
#guide-payment a {background-position: 0 -70px;}
#guide-payment a:hover {background-position: -200px -70px;}
#guide-data a {background-position: 0 -100px;}
#guide-data a:hover {background-position: -200px -100px;}
#guide-abouts a {background-position: 0 -130px;}
#guide-abouts a:hover {background-position: -200px -130px;}
#guide-order a {background-position: 0 -160px;}
#guide-order a:hover {background-position: -200px -160px;}
#guide-privacy a {background-position: 0 -190px;}
#guide-privacy a:hover {background-position: -200px -190px;}
#guide-contact a {background-position: 0 -220px;}
#guide-contact a:hover {background-position: -200px -220px;}
#guide-form a {background-position: 0 -250px;}
#guide-form a:hover {background-position: -200px -250px;}

/* カテゴリ */
#block-category li {
  background: url(../img/arrow_circle_red_right.gif) left 12px no-repeat transparent;
  padding: 8px 0 8px 15px;
  border-bottom: 1px dotted #CCCCCC;
}

/* はじめての方へ */
#block-beginner a {
  display: block;
  height: 40px;
  width: 200px;
  text-indent: -9999em;
  background-image: url(../img/sprite.jpg);
}
#block-beginner a:hover { background-position: -200px 0; }

/* 個人向けお見積りフォーム */
#block-estimate a {
  display: block;
  height: 60px;
  width: 200px;
  text-indent: -9999em;
  background-image: url(../img/sprite.jpg);
  background-position: 0 -356px;
}
#block-estimate a:hover { background-position: -200px -356px; }

/* 現在のカゴの中 */
#block-cart dl {border-bottom: 1px dashed #CCCCCC;margin: 0 0 10px;padding: 0 0 10px;}
#block-cart dt {text-align: right;float:left;clear:both;width: 60px;}
a#btn-cart-inside {
  display: block;
  margin: 0 auto;
  width: 102px;
  height: 23px;
  text-indent: -9999em;
  background-image: url(../img/buttons.gif);
  background-position: -452px -264px;
}
a#btn-cart-inside:hover {background-position: -452px -288px;}

/* イチオシ商品 */
#block-recommend .block-body {background: url(../img/back_turn_over.gif) right bottom no-repeat;padding: 10px 0;}
.recommend-row {padding: 0 10px;margin: 0 0 20px;}
.recommend-item {width: 144px;}
.recommend-item.left {float:left;margin-right: 14px;}
.recommend-item.center {float:left;}
.recommend-item.right {float:right;}
.recommend-item p {font-size: 0.9em;}
.recommend-item h3 a {color: #F29700;text-decoration: none;}
.recommend-item .image {text-align:center;margin: 0 0 5px;}
.recommend-item .icon li {display:inline;}

/* ログイン */
#block-login label {font-size: 0.8em;}
#block-login-mail {background: url(../img/icon_mail.gif) 8px 60% no-repeat transparent;padding-left: 50px;}
#block-login-pass {background: url(../img/icon_key.gif) 8px 60% no-repeat transparent; padding-left: 50px;}
#block-login-memory {text-align:right;padding: 5px 0 0;}
#block-login-btn {border-bottom: 1px dashed #CCCCCC;margin-bottom: 5px;padding: 5px 0;}
#block-login-logout {padding: 5px 0;}
#block-login-btn a, #block-login-logout a {
  display: block;
  margin: 0 auto;
  text-indent: -9999em;
  background-image: url(../img/buttons.gif);
}
#block-login-btn a { width: 62px; height: 23px; background-position: -555px -264px; }
#block-login-btn a:hover {background-position: -555px -288px;}
#block-login-logout a { width: 82px; height: 23px; background-position: -618px -264px; }
#block-login-logout a:hover {background-position: -618px -288px;}
#block-login-forgot {font-size: 0.9em;text-align: center;}
#block-login-navi {}
#block-login-navi li a {
  background: url(../img/arrow_circle_red_right.gif) left center no-repeat transparent;
  padding: 2px 0 2px 15px;
}

/* 新着情報 */
#block-news {background: url(../img/block_news_back.gif) 0 0 repeat-y;}
#block-news h2 {
  height: 65px;
  text-indent: -9999em;
  background: url(../img/block_news_title.gif) 0 0 no-repeat;
}
#block-news li {font-size: 0.9em;clear:both;}
#block-news li .date {float:left;}
#block-news li .comment {width: 385px;float:right;border-bottom: 1px dashed #CCCCCC;margin-bottom: 5px;padding-bottom: 5px;}
#block-news .block-body {background: url(../img/block_news_bottom.gif) 0 bottom no-repeat;padding: 0 10px 26px;}

/* 営業日カレンダー */
.calendar-month {border: 1px solid #CCCCCC;padding: 10px;margin: 0 0 10px;background: url(../img/back_block.gif) 0 bottom repeat-x;}
.calendar-month caption {font-size: 0.9em;text-align:center;}
.calendar-month th, .calendar-month td {padding: 2px 0;text-align:center;font-size: 0.9em;}
.calendar-month td.off {background: #FFEEEE;}

/* お問い合わせ先 */
#block-phone p {display:block;width: 173px; height: 145px;margin: 0 auto;background: url(../img/block_phone.gif) 0 0 no-repeat transparent;text-indent:-9999em;}

/* ラベル */
#block-label .block-body {padding: 10px 0 0 0;}


/* ポップアップ
-----------------------------------------------*/
#popup-wrapper {padding: 10px;}