﻿@charset "UTF-8";

 /* 基本デザイン用 */
body{
color: #454545;
background: #FE9901 url("../img/backcolor.jpg") repeat-x;
font-size: 75%;
line-height: 150%;
font-family: sans-serif;
margin: 0px;
padding: 0px;
text-align: center;
}

p{
margin: 0px;
padding: 0px;
text-align: left;
line-height: 160%;
}

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

a {
color: #333399;
}

a:hover {
text-decoration: none;
}

select{
font-size: 11px;
}

table{
font-size: 100%;
}

/* 見出し用 */
h1{
font-size:160%;
margin: 0px;
padding: 0px;
color: #311800;
}

h2{
font-size:130%;
margin: 0px;
padding: 0px;
color: #311800;
}


h3{
font-size:120%;
margin: 0px;
line-height: 130%;
padding-bottom: 5px;
color: #311800;
}

h4{
font-size:110%;
margin: 0px;
padding: 0px;
color: #311800;
}

h5{
font-size:100%;
margin: 0px;
padding: 0px;
color: #311800;
}

form{
margin: 0px;
padding: 0px;
}

.formbuttonarea{
background-color: #cccccc;
text-align: center;
padding: 10px;
}

th{
text-align: left;
margin: 0px;
padding: 5px;
}

td{
text-align: left;
margin: 0px;
padding: 5px;
}


/* 大枠レイアウト用 */

#layout {
width: 790px;
background-color: #ff9900;
margin: 0px auto;
padding: 0px;
text-align: left;
}


/* テーブルレイアウト用（左右に分割されたレイアウト用） */
.tlayout {
width: 100%;
background-color:#ffffff;
margin: 0px;
padding: 0px;
font-size: 90%;
}

.tlayout_backcolor_none {
width: 100%;
margin: 0px;
padding: 0px;
font-size: 90%;
}



/* テーブル内セルレイアウト用 */
th.content {
width: 30%;
background-color: #FFE9A4;
margin :0px;
border: 1px solid #BBBBBB;
font-size:120%;
}

th.checkbox {
background-color: #545454;
}

td.content {
width: 70%;
background-color: #ffffff;
border: 1px solid #BBBBBB;
font-size:120%;
}

td.subtitle {
width: 70%;
background-color: #FFE9A4;
border: 1px solid #BBBBBB;
font-size:120%;
font-weight: bold;
}

/* テーブル内セルレイアウト用（縦への情報展開） */
th.th {
background-color: #FFE9A4;
margin :0px;
border: 1px solid #BBBBBB;
font-size:120%;
text-align: center;
}

th.tf {
background-color: #FFF7E3;
margin :0px;
border: 1px solid #BBBBBB;
font-size:120%;
}

td.td {
background-color: #ffffff;
border: 1px solid #BBBBBB;
font-size:120%;
}

td.tdp {
background-color: #FFFFF4;
border: 1px solid #BBBBBB;
font-size:120%;
}

td.tdi {
text-align: right;
font-size:80%;
}

td.postage{
border: 1px solid #cccccc;
background-color: #DEE6FA;
text-align: right;
font-weight: bold;
font-size:120%;
}

td.minortotal{
border: 1px solid #cccccc;
background-color: #FFF9E3;
text-align: right;
font-weight: bold;
font-size:120%;
}

td.tax{
border-top: 1px solid #cccccc;
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #999999;
background-color: #FFF9E3;
text-align: right;
font-weight: bold;
font-size:120%;
}

td.total{
border-top: 1px solid #999999;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
background-color: #FFF1C8;
text-align: right;
font-weight: bold;
font-size:120%;
}



/* ヘッダ部 */
#header {
width: 790px;
margin: 0px;
padding: 0px;
background-color: #fff;
}

#headerbody{
margin: 0px;
padding: 0px;
}

#header p{
font-size: 95%;
margin: 0px;
padding: 15px 0px 3px;
text-align: right;
clear: right;
}

#header a{
text-decoration: none;
}

#header a:hover{
text-decoration: underline;
}

.logo{
margin: 6px 0px 0px 0px;
padding: 0px;
float: left;
}

.logo2 {
margin: 0px;
padding: 0px;
float: right;
}

.logo_caution {
margin: 6px 0px 0px 0px;
padding: 0px;
font-size: 130%;
font-weight: bold;
color: red;
}
.logo_caution2 {
margin: 3px 0px 0px 0px;
padding: 0px;
font-size: 110%;
font-weight: bold;
color: red;
}

/* TOPレイアウト用 - イメージ部 */
#topimage {
width: 790px;
margin: 0px;
padding: 0px;
text-align: center;
}

#topimagebody{
width: 790px;
margin: 0px;
padding: 0px;
background-color: #fff;
}

/* コンテンツ部 */
#contents {
width: 790px;
margin: 0px auto;
padding: 0px;
background-color: #fff;
text-align: center;
}

#contentsbody {
background-color: #F8F7F3;
margin: 0px 10px 10px 10px;
padding: 0px;
border-top: 8px solid #EEEAE1;
}

/* TOPレイアウト用 - コンテンツ部 */
#top-two-column #contentsbody {
border-top: 2px solid #F8F7F3;
}

/* ログイン前後 */
#login-area {
width: 185px;
margin: 0px;
padding: 0px;
text-align: left;
}

/* 会員登録ボタン */
#registbutton{
width: 185px;
margin: 0px  0px 10px 0px;
padding: 0px;
}

/* ログイン後 */
#login-after{
margin: 0px;
padding: 5px;
border: 1px solid #CDCDCD;
background: url("../img/naviback.jpg") repeat;
}

#login-title {
margin: 0px;
padding: 0px;
}

#login-title p{
font-size: 110%;
font-weight: bold;
}

/* ボタンデザイン */
.button-01 a {
display: block;
margin: 0px 0px 1px 0px;
padding: 3px;
border: 1px solid #FF9900;
background-color: #FFcc00;
text-decoration: none;
}

.button-01 a:hover {
margin: 0px 0px 1px 0px;
padding: 3px;
border: 1px solid #ccc;
background-color: #fff;
text-decoration: none;
}

/*　ログイン前　*/
#login-before {
margin: 0px;
padding: 5px;
border: 1px solid #CDCDCD;
background: url("../img/naviback.jpg") repeat;
}

th.login{
width: 45%;
text-align: left;
padding: 1px;
}

td.login{
width: 55%;
text-align: left;
padding: 1px;
}

.login-button {
text-align: center;
padding: 2px 0px 2px 0px;
}

.login{
width: 85px;
}

/* 検索エリア */
#search {
width: 185px;
margin: 10px  0px 0px 0px;
padding: 0px;
text-align: left;
}

#searchbody{
margin: 0px;
padding: 10px;
border: 1px solid #CDCDCD;
background: url("../img/naviback.jpg") repeat;
}

.search-title{
font-weight: bold;
margin: 0px;
padding: 0px;
font-size: 110%;
}

.searchtext{
width: 137px;
}

.searchprice{
width: 55px;
}

.searchresult{
margin: 5px;
padding: 5px;
}

/* アラートエリア */
.alert_area {
margin: 0px 0px 5px 0px;
padding: 5px;
border: 1px solid #ff9900;
}

.alert_areain {
margin: 0px 0px 0px 0px;
padding: 5px;
background-color: #ff9900;
}

.alert_text {
color: #FF9900;
}

/* 説明エリア */
.exposition {
margin: 0px 0px 5px 0px;
padding: 5px;
background-color: #fff6cc;
border: 1px solid #999999;
}

/* 例示表示用 */
.exe {
color: #339900;
}

/* 入力制限 */
.limit {
color: #666666;
}

/* エラー表示用 */
.error {
color: red;
}

/* ナビゲーション */
.guidance {
color: #FF8C00;
margin: 5px;
padding: 5px;
}

.guidance2 {
color: #FF8C00;
margin: 1px;
padding: 1px;
font-size: 70%;
}

.balancer {
margin: 5px;
padding: 5px;
}

.help {
color: #00C800;
margin: 2px;
padding: 2px;
font-size:9px
}

.ask {
color: #00C800;
margin: 2px;
padding: 2px;
font-size:11px
}

.wellcome {
font-size: 120%;
color: #339900;
margin: 2px;
padding: 2px;
}

/* 2、3列レイアウト用 - グローバルナヴィゲーション左部 */
#globalnavi-l {
width: 210px;
margin: 0px;
padding: 0px;
float: left;
text-align: center;
}

#globalnavibody-l{
margin: 0px;
padding: 12px 5px 5px 12px;
}


/* 3列レイアウト用 - グローバルナヴィゲーション右部 */
#globalnavi-r {
width: 180px;
margin: 0px;
padding: 0px;
float: right;
text-align: center;
}

#globalnavibody-r{
margin: 0px;
padding: 12px 12px 5px 5px;
}

/* 右のナビゲーションエリア共通 */
.navi{
width: 159px;
margin: 0px;
padding: 0px;
text-align: left;
}

.navibody{
margin: 0px 0px 10px 0px;
padding: 10px;
border: 1px solid #CDCDCD;
background: url("../img/naviback.jpg") repeat;
}

/* 右のナビゲーションの確保リスト、注文リスト用 */
.navikeep{
width: 159px;
margin: 0px;
padding: 0px;
text-align: left;
}

.navikeepbody{
margin: 0px 0px 10px 0px;
padding: 10px;
border-top: 1px solid #CDCDCD;
border-right: 1px solid #CDCDCD;
border-bottom: 1px solid #CDCDCD;
/*
background: url("../img/cartback.jpg") repeat;
*/
}

p.contentkeep{
margin: 0px 0px 5px 0px;
padding: 3px;
border-bottom: 1px solid #ccc;
}




/* 右のナビゲーションエリア共通 */
#globalnavibody-r .navi{
width: 159px;
}


/* 3列レイアウト用 - メインコンテンツ部 */
.main {
width: auto;
margin-left: 210px;
margin-right: 180px;
padding: 0px;
text-align: left;
float: none;
}

.mainbody{
margin: 12px 5px 5px 5px;
padding: 0px;
background: url("../img/mainback.jpg") repeat;
border: 1px solid #E6DED2;
}

.step{
margin: 0px;
padding: 10px 0px 0px 0px;
text-align: center;
}

/* 2列レイアウト用 - メインコンテンツ部 */
#two-column .main {
margin-left: 210px;
margin-right: 12px;
}

/* TOP用2列レイアウト用 - メインコンテンツ部 */
#top-two-column .main {
margin-left: 210px;
margin-right: 10px;
}

#top-two-column .mainbody{
margin: 12px 5px 5px 5px;
padding: 0px;
border: 1px solid #F8F7F3;
background: #F8F7F3;
}

/* 1列レイアウト用 - メインコンテンツ部 */
#single-column .main {
margin-left: 12px;
margin-right: 12px;
}

/* mainに入るタイトル */
.title {
width: auto;
background: #fff url("../img/pagetitleback.jpg") repeat-x bottom;
border-bottom: 1px solid #E6DED2;
margin: 0px;
padding: 0px;
text-align: left;
}

.title h2.text{
padding: 11px 0px 11px 10px;
}

/* main内部のコンテンツ */

.main_content {
margin: 0px;
padding: 10px;
}

/* TOP用コンテンツ中身用（login-area等と同様にレイアウト確保用） */
.topmain{
width: 535px;
margin: 0px;
padding: 0px;
text-align: left;
float: none;
}

.topmainbody{
margin: 0px 0px 20px 0px;
padding: 5px;
border: 1px solid #CDCDCD;
background: url("../img/mainback.jpg") repeat;
}

.topmainbody td{
padding: 10px;
}

.topmainbody h2{
font-size:100%;
}

/* TOPや商材の紹介用 */
.productinfo{
float: none;
margin-left: 80px;
margin-right: 5px;
}

/* 検索結果の商品紹介用、ランキングでも使用 */
.productinfo_search{
float: none;
margin-left: 80px;
margin-right: 5px;
}

.productinfo_search h3{
line-height: 130%;
padding-bottom: 5px;
}

.productinfo_search h4{
line-height: 130%;
padding-bottom: 5px;
}

/* 検索結果の商品紹介用 */
p.productex{

}

/* 商品詳細のタイトル */
.product{
margin-bottom: 10px;
}

/* 商品詳細のボタンエリア */
.product_buttonarea{
margin: 0px;
padding: 2px;
text-align: center;
}

/* 検索結果等のボタンエリア */
.product_buttonarea_search{
margin: 0px 0px 10px 0px;
padding: 10px;
text-align: center;
background: url("../img/cartback.jpg") repeat;
border-bottom: 1px solid #ccc;
}

/* 商品詳細の注文・入荷ボタン */
.product_button a{
display: inline;
margin: 0px;
padding: 3px;
border: 2px solid #ff0000;
background-color: #FFCCFF;
text-align: center;
color: #ff0000;
text-decoration: none;
font-weight: bold;
}

.product_button a:hover{
border: 2px solid #ccc;
background-color: #fff;
color: #333399;
}

/* 入荷のコンテンツエリア */
.receipt{
margin-bottom: 10px;
padding: 0px;
border-bottom: 1px solid #ccc;
}

/* 注文・入荷の削除ボタン */
.delete a{
display: inline;
margin: 0px;
padding: 3px;
border: 2px solid #0033CC;
background-color: #D6ECF8;
text-align: center;
text-decoration: none;
}

.delete a:hover{
border: 2px solid #ccc;
background-color: #fff;
color: #333399;
}

/* 注文・入荷の数量入力エリア */
.num{
width: 30px;
}

.price_input{
width: 60px;
}



/* 値段の色 */
.price{
color: #ff0000;
font-weight: bold;
}

.price_exe{
color: #006699;
font-size: 75%
}

/* 検索結果の件数表示 */
.resultnum{
font-size: 120%;
font-weight: bold;
text-align: right;
border-bottom: 1px solid #ccc;
margin-bottom: 10px;
color: #666666;
}

/* 検索結果数の色 */
.result{
color: #cc0000;
}

/* オススメタイトル */
h4.osusume{
color: #cc0000;
margin-bottom: 5px;
}

/* 商品説明タイトル(ランキング) */
h4.ranking{
color: #78C800;
margin-bottom: 5px;
}

/* 商品説明タイトル(新着) */
h4.new{
color: #FF7575;
margin-bottom: 5px;
}

/* ランキング順位 */
h4.ranking_no{
color: #000059;
margin-bottom: 5px;
}

/* 新着 */
h4.new_title{
color: #DB6D00;
margin-bottom: 5px;
}

/* 在庫数の色 */
.zaiko{
color: #996600;
font-weight: bold;
}

/* 商材管理ナンバーの色 */
.charge{
color: #666666;
}

/* クチコミエリア */
.kuchikomi{
margin: 20px 0px 0px 0px;
padding: 0px;
}

/* 各クチコミ内容 */
.kuchikomicontents{
margin: 0px;
padding: 10px 0px;
border-top: 1px dashed #FFAC59;
}

/* クチコミ文章 */
.kuchikomitext{
padding-top: 10px;
margin-left: 5px;
}

/* クチコミ者のニックネームと日付 */
.kuchikominame{
margin: 0px;
padding: 0px;
text-align: left;
font-size: 11px;
}

/* クチコミボタン */
.kuchikomibuttonarea{
width: auto;
margin-top: 3px;
margin-left: auto;
margin-right: auto;
padding: 5px;
text-align: center;
}

.kuchikomibutton a{
display: inline;
padding: 5px;
text-align: center;
border: 1px solid #996600;
background-color: #FFFF99;
text-decoration: none;
}

.kuchikomibutton a:hover{
border: 1px solid #996600;
background-color: #fff;
}

/* 回答クチコミ内容 */
.child-kuchikomicontents{
margin-left: 30px;
padding: 10px 0px;
border-top: 1px dashed #FFAC59;
}

/* コピーライト部 */
#copyright{
font-size:90%;
line-height: 14px;
margin: 0px auto;
padding: 0px;
clear: both;
}

#copyright p{
text-align: center;
}

/* フォントウェイト太字 */
.weight-bold {
font-weight: bold;
}

/* フロート禁止 */
.clear {
clear: both;
}

/* センタリング */
.center {
text-align: center;
}

/* 右寄せ */
.right {
text-align: right;
margin-left: 2px;
}

/* 左フロート */
.floatL{
float: left;
}

/* 右フロート */
.floatR{
float: right;
}

.table_area{
width:100%;
}

.pic_list {
width:60px;
hight:80px;
border:0;
}


/* イメージリンク用 */
.none {
border: none;
}

/* テキストエリア */
textarea{
width: 98%;
}

/* エラーページ用 */
.bgcolorsyserror{
background-color: #FFCCCC;
}

.bgcolornotfound{
background-color: #66CCFF;
}

/* 例示記述用 */
.exe{
color: #006699;
}

/***************  WEB VENDERってなに？用　*******************/

p.wv{
font-size: 100%;
color: #333333;
}

h3.wv{
border-bottom: 1px dashed #666666;
margin-top: 15px;
margin-bottom: 10px;
}

h4.wv{
color: #990000;
font-size: 100%;
}

p.wvred{
font-size: 100%;
font-weight: bold;
color: #006699;
}

.point1{
height: 180px;
padding-right: 210px;
background: url("../img/wv_img1.jpg") no-repeat right top;
}

.point2{
height: 180px;
padding-left: 210px;
background: url("../img/wv_img2.jpg") no-repeat left top;
}

.point3{
height: 180px;
padding-right: 210px;
background: url("../img/wv_img3.jpg") no-repeat right top;
}

.point4{
height: 180px;
padding-left: 210px;
background: url("../img/wv_img4.jpg") no-repeat left top;
}


