/*------------------------------------------------------------
●ブラウザ固有のCSSをリセット
-------------------------------------------------------------*/

body,div,dl,dt,dd,ul,ol,li,
h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,p,blockquote,table,th,td{
margin: 0;
padding: 0;
}

table{
border-collapse: collapse;
border-spacing: 0;
}

address,caption,cite,code,dfn,h1,h2,h3,h4,th,var{
font-style: normal;
font-weight: normal;
}

fieldset,img,abbr{ border: 0; }
caption,th{ text-align: left; }
q:before,q:after{ content: ''; }
img{
border: none;
vertical-align: bottom;
}

/*------------------------------------------------------------
■拡張設定

	t＝上（top）
	r＝右（right）
	b＝下（bottom）
	l＝左（left）
	c＝左右の中央（center）
	m＝上下の中央（middle）

※「!important」という設定は、
　どんなclassより、そのclassを優先するという設定です。
-------------------------------------------------------------*/

/*------------------------------------------------------------
●１、align・・・文字の横位置
-------------------------------------------------------------*/

.al-c{ text-align: center; }/*中央寄せ*/
.al-r{ text-align: right; }/*右寄せ*/
.al-l{ text-align: left; }/*左寄せ*/


/*------------------------------------------------------------
●２、valign・・・文字の縦位置
-------------------------------------------------------------*/

.vl-t{ vertical-align: top; }/*上寄せ*/
.vl-m{ vertical-align: middle; }/*中央寄せ*/
.vl-b{ vertical-align: bottom; }/*下寄せ*/


/*------------------------------------------------------------
●３、float・・・ブロックの左右の寄せ
-------------------------------------------------------------*/

.fl-c{ clear: both; margin-top: 10px; }/*左右の寄せを解除*/
.fl-r{ float:right; margin-left: 10px; }/*右寄せ*/
.fl-l{ float:left; margin-right: 10px; }/*左寄せ*/


/*------------------------------------------------------------
●４、margin・・・周りのブロックからの距離

	10、15、20・・・という数字は「px（ピクセル）」を表します
-------------------------------------------------------------*/

.m0{ margin: 0!important; }/*周りからのmarginを0にする*/
.m0-t{ margin-top: 0!important; }/*上からのmarginが0px*/
.m0-r{ margin-right: 0!important; }/*右からのmarginが0px*/
.m0-b{ margin-bottom: 0!important; }/*下からのmarginが0px*/
.m0-l{ margin-left: 0!important; }/*左からのmarginが0px*/

.m10{ margin: 10px!important; }/*周りからのmarginが10px*/
.m10-t{ margin-top: 10px!important; }/*上からのmarginが10px*/
.m10-r{ margin-right: 10px!important; }/*右からのmarginが10px*/
.m10-b{ margin-bottom: 10px!important; }/*下からのmarginが10px*/
.m10-l{ margin-left: 10px!important; }/*左からのmarginが10px*/

.m15{ margin: 15px!important; }
.m15-t{ margin-top: 15px!important; }
.m15-r{ margin-right: 15px!important; }
.m15-b{ margin-bottom: 15px!important; }
.m15-l{ margin-left: 15px!important; }

.m20{ margin: 20px!important; }
.m20-t{ margin-top: 20px!important; }
.m20-r{ margin-right: 20px!important; }
.m20-b{ margin-bottom: 20px!important; }
.m20-l{ margin-left: 20px!important; }

.m30{ margin: 30px!important; }
.m30-t{ margin-top: 30px!important; }
.m30-r{ margin-right: 30px!important; }
.m30-b{ margin-bottom: 30px!important; }
.m30-l{ margin-left: 30px!important; }

.m40{ margin: 40px!important; }
.m40-t{ margin-top: 40px!important; }
.m40-r{ margin-right: 40px!important; }
.m40-b{ margin-bottom: 40px!important; }
.m40-l{ margin-left: 40px!important; }

.m50{ margin: 50px!important; }
.m50-t{ margin-top: 50px!important; }
.m50-r{ margin-right: 50px!important; }
.m50-b{ margin-bottom: 50px!important; }
.m50-l{ margin-left: 50px!important; }

.m60{ margin: 60px!important; }
.m60-t{ margin-top: 60px!important; }
.m60-r{ margin-right: 60px!important; }
.m60-b{ margin-bottom: 60px!important; }
.m60-l{ margin-left: 60px!important; }

.m70{ margin: 70px!important; }
.m70-t{ margin-top: 70px!important; }
.m70-r{ margin-right: 70px!important; }
.m70-b{ margin-bottom: 70px!important; }
.m70-l{ margin-left: 70px!important; }


/*------------------------------------------------------------
●５、padding・・・周りのブロックからの距離（padding）

	10、15、20・・・という数字は「px（ピクセル）」を表します
-------------------------------------------------------------*/

.p0{ padding: 0!important; }/*周りからのmarginを0にする*/
.p0-t{ padding-top: 0!important; }/*上からのmarginが0px*/
.p0-r{ padding-right: 0!important; }/*右からのmarginが0px*/
.p0-b{ padding-bottom: 0!important; }/*下からのmarginが0px*/
.p0-l{ padding-left: 0!important; }/*左からのmarginが0px*/

.p10{ padding: 10px!important; }/*周りからのmarginが10px*/
.p10-t{ padding-top: 10px!important; }/*上からのmarginが10px*/
.p10-r{ padding-right: 10px!important; }/*右からのmarginが10px*/
.p10-b{ padding-bottom: 10px!important; }/*下からのmarginが10px*/
.p10-l{ padding-left: 10px!important; }/*左からのmarginが10px*/

.p15{ padding: 15px!important; }
.p15-t{ padding-top: 15px!important; }
.p15-r{ padding-right: 15px!important; }
.p15-b{ padding-bottom: 15px!important; }
.p15-l{ padding-left: 15px!important; }

.p20{ padding: 20px!important; }
.p20-t{ padding-top: 20px!important; }
.p20-r{ padding-right: 20px!important; }
.p20-b{ padding-bottom: 20px!important; }
.p20-l{ padding-left: 20px!important; }

.p30{ padding: 30px!important; }
.p30-t{ padding-top: 30px!important; }
.p30-r{ padding-right: 30px!important; }
.p30-b{ padding-bottom: 30px!important; }
.p30-l{ padding-left: 30px!important; }

.p40{ padding: 40px!important; }
.p40-t{ padding-top: 40px!important; }
.p40-r{ padding-right: 40px!important; }
.p40-b{ padding-bottom: 40px!important; }
.p40-l{ padding-left: 40px!important; }

.p50{ padding: 50px!important; }
.p50-t{ padding-top: 50px!important; }
.p50-r{ padding-right: 50px!important; }
.p50-b{ padding-bottom: 50px!important; }
.p50-l{ padding-left: 50px!important; }

.p60{ padding: 60px!important; }
.p60-t{ padding-top: 60px!important; }
.p60-r{ padding-right: 60px!important; }
.p60-b{ padding-bottom: 60px!important; }
.p60-l{ padding-left: 60px!important; }

.p70{ padding: 70px!important; }
.p70-t{ padding-top: 70px!important; }
.p70-r{ padding-right: 70px!important; }
.p70-b{ padding-bottom: 70px!important; }
.p70-l{ padding-left: 70px!important; }


/*------------------------------------------------------------
●６、font-size・・・フォントサイズの設定

	※「em」と「pt」の違い
	　IEで、ブロウザの文字サイズ変更が反映されるのが「em」です
	　「pt」は文字サイズ変更が効きません。
-------------------------------------------------------------*/

.normal{ font-weight: normal!important; }

.b{ font-weight: bold!important; }

.big{ font-size: 120%!important; }
.big2{ font-size: 150%!important; }
.big3{ font-size: 180%!important; }

.small{ font-size: 80%!important; }

.f08em{ font-size: 0.8em; }
.f09em{ font-size: 0.9em; }
.f10em{ font-size: 1.0em; }
.f11em{ font-size: 1.1em; }
.f12em{ font-size: 1.2em; }
.f13em{ font-size: 1.3em; }
.f14em{ font-size: 1.4em; }
.f16em{ font-size: 1.6em; }
.f18em{ font-size: 1.8em; }
.f20em{ font-size: 2.0em; }
.f22em{ font-size: 2.2em; }
.f24em{ font-size: 2.4em; }


.f8pt{ font-size: 8.5pt!important; }
.f9pt{ font-size: 9.0pt!important; }
.f10pt{ font-size: 10pt!important; }
.f11pt{ font-size: 11pt!important; }
.f12pt{ font-size: 12pt!important; }
.f13pt{ font-size: 13pt!important; }
.f14pt{ font-size: 14pt!important; }
.f16pt{ font-size: 16pt!important; }
.f18pt{ font-size: 18pt!important; }
.f20pt{ font-size: 20pt!important; }
.f22pt{ font-size: 22pt!important; }
.f24pt{ font-size: 24pt!important; }


/*------------------------------------------------------------
●７、color・・・フォントカラーの設定
-------------------------------------------------------------*/

.black{ color: #000!important; }/*黒色*/
.red{ color: #ff0000!important; }/*赤色*/
.blue{ color: #0000dd!important; }/*青色*/
.green{ color: #008000!important; }/*緑色*/
.yellow{ color: #ffff00!important; }/*黄色*/
.navy{ color: #1F26A9!important; }/*紺色*/
.gray{ color: #ccc!important; }/*灰色*/
.orange{ color: #ff6600!important; }/*橙色*/
.pink{ color: #cc6699!important; }/*ピンク色*/
.purple{ color: #660099!important; }/*紫色*/
.olive{ color: #808000!important; }/*黄土色*/
.lime{ color: #00ff00!important; }/*黄緑*/
.aqua{ color: #167fa6!important; }/*水色*/
.price{ color: #cc3333!important; }/*暗い赤色*/



/*------------------------------------------------------------
●８、line-height・・・行間の設定
-------------------------------------------------------------*/

.lh13{ line-height: 1.3em!important; }
.lh14{ line-height: 1.4em!important; }
.lh15{ line-height: 1.5em!important; }
.lh16{ line-height: 1.6em!important; }
.lh17{ line-height: 1.7em!important; }
.lh18{ line-height: 1.8em!important; }
.lh19{ line-height: 1.9em!important; }
.lh20{ line-height: 2.0em!important; }


/*------------------------------------------------------------
●９、underline・・・アンダーライン（下線）の設定
-------------------------------------------------------------*/

.underline{ text-decoration: underline!important; }


/*------------------------------------------------------------
●１０、取り消し線の設定
-------------------------------------------------------------*/

.del{ text-decoration:line-through;}


/*------------------------------------------------------------
●１１、box・・・カラーボックスの設定
-------------------------------------------------------------*/

.box-yellow{ background-color: #ffff00!important; }/*黄色のボックス*/
.box-aqua{ background-color: #00ffff!important; }/*水色のボックス*/
.box-red{ background-color: #fc9b8b!important; }/*赤色のボックス*/


/*------------------------------------------------------------
●１２、input:focus・・・入力フォームをハイライトする
-------------------------------------------------------------*/

input:focus,textarea:focus{ background-color: #dee!important; }


/*------------------------------------------------------------
●１３、hr・・・線の基本設定
-------------------------------------------------------------*/

hr{
	clear: both;
	margin: 7px 0;
	padding: 0;
	border-width: 1px 0 0 0;
	height: 1px;
	border-style: solid none none none;
	color: #ccc;
}

/*------------------------------------------------------------
●１４、left、right・・・画像の横位置設定
-------------------------------------------------------------*/

/*------------------------------------------------------------
●１５、top、middle、bottom・・・画像の縦位置設定
-------------------------------------------------------------*/

/*--------------------▽画像の縦位置をtopに揃える*/

img.top{ vertical-align: top!important; }

/*--------------------▽画像の縦位置をmiddleに揃える*/

img.middle{ vertical-align: middle!important; }

/*--------------------▽右に画像、左に画像*/

img.bottom{ vertical-align: bottom!important; }


/*------------------------------------------------------------
●１６、noborder・・・枠線を無くす
-------------------------------------------------------------*/

.noborder{ border: 0!important; }

/*------------------------------------------------------------
●１６、zindex・・・重なりの優先度
-------------------------------------------------------------*/

.z2{ z-index: 2; }
.z3{ z-index: 3; }



body {
font-family:Arial, Helvetica, sans-serif;
margin-top:15px;
margin-left:auto;
margin-right:auto;
width: 900px;
color:#333333;
font-size: 90%;
line-height: 150%;
}

strong {
font-weight:normal;
}

ul,li {list-style-type: none;}

li {padding:1px 0px;}

img,p,ul,li,form {border:0px;}

h1,h2,h3,h4,h5,h6 {
clear:both;
font-weight:bold;
border-color:#9b2a3a
}

a:link {
color: #006400;
font-weight:500;
}

a:visited {color: #228b22;}

a:hover {
color: #f93;
text-decoration:none;
}

table {
width:100%;
font-size:100%;
clear:both;
}

th {
font-size:110%;
vertical-align:middle;
margin-right:1ex;
padding:4px;
border:solid 1px #fff;
white-space:nowrap;
}

td {vertical-align: top;}

td h2 {font-size: 100%;  padding: 2px;  }
td h5 {font-size: 95%;  margin-top: 1px;  margin-bottom: 1px;  padding: 2px;  border-bottom: 1px dotted #006400;  }

h1 {
font-size:10pt;
font-weight:normal;
}

h1 a:visited {color: #009a1f;}
h1 a:hover {color: #009a1f;}

h2 {
color: #006400;
background:url(http://www.eco-market.net/image/object/h2back.png) repeat-x;
font-size:105%;
margin-top:4px;
margin-bottom:4px;
padding: 4px;
border-left: 6px solid #006400;
}

h4 {
}

h6 {
font-size:120%;
padding:5px;
}


input,textarea {color: #222;  font-size: 90%;  }
blockquote {border:solid 1px #DEDEDE; 
background-color: #eee;  margin: 4px;  padding: 4px;  }

/*****   Position  *****/
/*.center {text-align: center;  }*/
.right {text-align: right;  }
.center img {margin: 2px;  }
.linklist {color: #444;  }
.linklist dt {border-bottom: 1px dotted #822;  }
.button {margin: 4px auto;  width: 120px;  }
.topic_path li {margin: 0px;  padding: 1px 0px;  display: inline;  }
.list li {margin: 0px;  padding: 1px 0px;  display: inline;  }
.ch_bgc {background-color: #FFF2E6;  }
.f_none {float: none;  }
.f_right {float: right;  }
.f_left {float: left;  }
.c_none {clear: none;  }
.c_both {clear: both;  }
.font_bold {font-weight: bold;  font-size: 105%;  }
.font_red {color: red;  font-weight: bold;  font-size: 110%;  }
.samplephoto img{border: 1px solid #ccc;  margin-left:auto;  margin-right:auto;  display : block;  }
.attention {color: #f11;  background-color: #ffebcd;  float: left;  margin-top: 5px;  margin-left: 20px;  padding: 5px;  }
.ecobag_list table {border-spacing: 0px;  }
.ecobag_list td {padding-bottom: 3px;  }
.ecobag_list li {margin-right: 6px;  display: inline;  }
.ecobag_list a {white-space: nowrap;  }
.ecobag_list h3 {text-align: left;  margin-right: 1ex ;  white-space: nowrap;  }
.table_style th {font-size: 110%;  background-color: #d7fabb;  font-weight: 500;  text-align: center;  vertical-align: middle;  padding: 4px;  width: 160px;  }
.table_style td {background-color: #eed;  padding: 4px;  border: solid 1px #eee;  }
.table_label {font-size: 110%;  background-color: #d7fabb;  text-align: center;  vertical-align: middle;  padding: 4px;  width: 160px;  }
.table_content {background-color: #eed;  padding: 4px;  border: solid 1px #eee;  }
.selector {border:1px solid black;  color:#333333;  font-size:11px;  margin:3px 2px 0pt;  padding:3px 4px;  position:relative;  text-decoration:none;  }
background:#EFEFEF;  color:#222222;  padding:4px;  margin: 4px;  text-align:center;  }

#back {
text-align:left;
padding-left:20px;
background:url(http://www.eco-market.net/image/object/back.gif) no-repeat left center;
}


/*****   Header   *****/

#header {
background:url(http://www.eco-market.net/image/header/back.php) no-repeat;
height: 68px;
}

#gnavi {
width:890px;
height:20px;
font-size:13px;
margin-top:5px;
margin-bottom:15px;
text-align: center;
margin-left:5px;
background-color:#B0FFC6;
}

#gnavi li a {
text-decoration: none;
display: block;
width: 110px;
height:20px;
float:left;
color:#ffffff;
background-color:#4EB691;
margin-left:1px;
}

#gnavi li a:hover {
background-color:#FFB74A;
}

#gnavi li {
display: inline;
}





/*****   Footer   *****/
#footer {
text-align:center;
clear:both;
}

#footer li {
display:inline;
padding-right:5px;
}



/*****   Right  *****/
#right {
float:right;
padding-left: 15px;
margin-bottom: 20px;
width: 225px;
}

#right h3 {
background:url(http://www.eco-market.net/image/object/h2back.png) repeat-x;
font-size:100%;
font-weight:bold;
margin-top:5px;
margin-bottom:1px;
padding-top:4px 0px 4px 5px;
border-top:1px solid #D7FABB;
border-bottom: 1px solid #D7FABB;
border-left: 6px solid #D7FABB;
}

#right h3.title {
color: #41b841;
font-size: 13pt;
font-weight: bold;
margin: 15px 0 5px 0;
padding: 3px 5px;;
}

#right a:link {
color:#006400;
}

/*****   Left  *****/
#left {
float:left;
padding-right: 15px;
margin-bottom: 20px;
width: 200px;
}

#left h3 {
background:url(http://www.eco-market.net/image/object/h2back.png) repeat-x;
font-size:100%;
font-weight:bold;
margin-top:5px;
margin-bottom:1px;
padding-top:4px 0px 4px 5px;
border-top:1px solid #D7FABB;
border-bottom: 1px solid #D7FABB;
border-left: 6px solid #D7FABB;
}

#left h3.title {
color: #41b841;
font-size: 13pt;
font-weight: bold;
margin-top: 10px;
padding: 5px 0;
}

#left ul {
list-style-type:none;
}

#left li a:link, #left li a:visited {
display:block;
background-color:#ffffff;
padding:4px 6px;
height:15px;
border:solid 2px;
border-color:#eeeeee #dddddd #dddddd #eeeeee;
text-decoration:none;
}

#left li a:active{
background-color:#ffffff;
border-color:#dddddd #eeeeee #eeeeee #dddddd;
}

#left li a:hover {
background:url(http://www.eco-market.net/image/object/leftahover.gif) #e4f1bb no-repeat right center;
}

#left a:link {
color:#006400;
}


/*****   Content  *****/
#content {
float: left;
width: 660px;
margin-bottom: 20px;
}

#content h2 {
margin-bottom: 20px;
}

#content h2.plain {
background: url(http://www.eco-market.net/image/top_h2_back.gif) left top no-repeat;
height: 35px;
line-height: 35px;
margin-bottom:5px;
padding-left: 50px;
padding-top: 4px;
font-size:16pt;
font-weight: bold;
}

#content h3 {
font-size: 150%;
text-align:left;
margin-top:20px;
margin-bottom:20px;
padding-left:15px;
border-left: solid 12px #009a22;
}

#content h5 {
margin: 0px;
padding-top: 1px;
padding-left: 10px;
border-bottom: 1px dotted #006400;
}

#content p {
letter-spacing: 1px;
margin:0 0 10px 10px;
}

#content dd {
font-size: 85%;
margin: 2px 0px 24px;
}

.gotop {
text-align: right;
padding-right: 18px;
background: url(http://www.eco-market.net/image/object/gotop.gif) right no-repeat;
}

/*****   Content-right  *****/
#content-right {
float: right;
width: 680px;
margin-bottom: 20px;
}

#content h2 {
margin-bottom: 20px;
}

#content h3 {
font-size: 150%;
text-align:left;
margin-top:20px;
margin-bottom:20px;
padding-left:15px;
border-left: solid 12px #009a22;
}

#content p {
letter-spacing: 1px;
margin:0 0 10px 10px;
}


/*****   content-list  *****/
#content-list {
margin:10px 0 20px 50px;
}

#content-list li {
background: url(http://www.eco-market.net/image/object/li_point.gif) left no-repeat;
padding-left: 15px;
line-height: 180%;
}


.clean-gray{border:solid 1px #DEDEDE; }



/*****   Content_full  *****/
#content_full {
float: left;
width: 892px;
padding: 4px;
margin-bottom:20px;

}
#content_full h1 {padding: 10px;  border-style: solid;  border-width: 0 0 0px 10px;  border-color: #006400;  }
#content_full h5 { margin-top: 1px;  margin-bottom: 1px;  padding: 2px 2px 2px 12px;  border-bottom: 1px dotted #006400;  }
#content_font {font-size: 130%;  line-height: 130%;  padding: 4px;  width: 692px;  }
#content_font h1 {padding: 10px;  border-style: solid;  border-width: 0 0 0px 10px;  border-color: #006400;  }

/*****   Others  *****/
#cart {width:160px;  background-color: #ffd;  text-align: center ;  padding: 2px;float: right;  }

/*****   Pagination  *****/
.pagination{padding: 2px;  }
.pagination ul{margin: 0;  padding: 0;  text-align: center; font-size: 16px;  }
.pagination li{list-style-type: none;  display: inline;  padding-bottom: 1px;  margin-left:5px;}
.pagination a, .pagination a:visited{padding: 0 5px;  border: 1px solid #9aafe5;  text-decoration: none; color: #2e6ab1;  }
.pagination a:hover, .pagination a:active{border: 1px solid #2b66a5;  color: #f93;  }
.pagination a.currentpage{background-color: #2e6ab1;  color: #ffffff !important;  border-color: #2b66a5;  font-weight: bold;  cursor: default;  }
.pagination a.disablelink, .pagination a.disablelink:hover{background-color: white;  cursor: default;  color: #929292;  border-color: #929292;  font-weight: normal !important;  }
.pagination a.prevnext{font-weight: bold;  }


.plain{ color: black; font-size:100%; font-weight: normal; margin: 0; padding:0 ; border-style: none ; background-image:none; }

/*****   #help  *****/
#help {
margin-top:10px;
margin-left:50px;
}

#help h3 {
margin-top:16px;
margin-left:6px;
padding-left:20px;
}

#help ul {
margin-left:15px;
padding-left:15px;
border-left:2px dotted #7aa;
}

#help li {
list-style:none;
margin-top:4px;
margin-bottom:4px;
}

#question {
padding-left:20px;
background:url(http://www.eco-market.net/image/object/question.gif) no-repeat left top;
}

#answer {
margin-top:20px;
margin-left:20px;
padding-left:20px;
background:url(http://www.eco-market.net/image/object/answer.gif) no-repeat left top;
}

/*****   #information  *****/
#information h3 {
background: #dddddd;
padding-left:10px;
}

#information table {
border-top:solid #dddddd 1px;
border-left:solid #dddddd 1px;
}

#information table td {
border-right: solid #dddddd 1px;
border-bottom: solid #dddddd 1px;
}

#information p {
letter-spacing: 1px;
margin:10px;
}


.box-furikomi{ 
background-color: #ede4e1;
margin:0 0 10px 40px;
padding:10px 10px 10px 20px;
width:300px;
}

.box-green {
background-color:#e4f1bb;
padding:10px;
}

.box-green form {
margin-top:10px;
}

.box-green input {
margin-left:230px;
}

.box-gray {
background-color: #efefef;
padding:10px;
}

#item-table table {
width: 640px;
margin-left:10px;
margin-bottom: 20px;
border-top:solid #dddddd 1px;
border-left:solid #dddddd 1px;
}

#item-table table td {
border-right: solid #dddddd 1px;
border-bottom: solid #dddddd 1px;
}


/*****   .tooltips  *****/
.tooltips{
width: 250px;
border: solid 2px #e4f1bb;
background-color:#fafaf0;
}

.tooltips b {
margin-left:10px;
font-size:90%;
color: #f9ae54;
padding-bottom:4px;
}

.tooltips p {
font-size: 80%;
}

#naviboton {
margin-bottom:5px;
}



#top-menu-out{
width: 900px;
height: 30px;
}

#top-menu-out #top-menu{
position: absolute;
top: 5px;
width: 894px;
text-align: right;
vertical-align: middle;
}


#top-menu-out #top-menu li{
display: inline;
font-size: 10pt;
}

img.itemphoto {
float: left;
margin-right: 5px;
}

.bg-fax {
height: 120px;
background: url(http://www.eco-market.net/image/object/fax.gif) no-repeat top right;
}