﻿@charset "utf-8";

/*===========================================================

水広場様　スタイルシート:base.css

============================================================*/



/* タグフォーマット

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

body,div,p,form,input,ol,ul,li,dl,dd,dt,blockquote{

	margin:0;

	padding:0;

}

body{

	text-align:center;

	font-family:"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";

	color:#333333;

	font-size:0;

}

p,th,td,li,dt,dd{

	font-size:12px;

	line-height:110%;

}

img,table{

	padding:0;

	margin:0;

	border:0;

}

h1,h2,h3,h4,h5,h6{

	padding:0px;

	margin:0px;

	font-size:0px;

	line-height:0px;

	font-weight:normal;

}

ul{

	list-style:none;

}

br{

	line-height:12px;

}



a:link,

a:visited{

	color:#333333;

	text-decoration:underline;

}

a:hover,

a:active{

	color:#225BA9;

	text-decoration:underline;

}





/* レイアウト

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

#container{

	width:760px;

	margin:0 auto;

	text-align:left;

	display:block;

}





/* ヘッダー

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

#header{

	width:760px;

	height:63px;

	display:block;

}

div#header_left{

	float:left;

	width:170px;

	height:63px;

	display:block;

}

a#logo{

	width:170px;

	height:63px;

	background:url(/material/images/common/logo.gif) no-repeat;

	display:block;

}



/* ヘッダーメニュー

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

div#header_right{

	float:right;

	width:550px;

	height:29px;

	display:block;

	font-weight:bold;

	font-family:"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	
	padding-top:34px;

}



ul#header_menu_01{

	float:right;

	width:100%;

	height:23px;

	display:block;

}

ul#header_menu_01:after{

	content:".";

	display:block;

	height:0;

	clear:both;

	visibility:hidden;

}



ul#header_menu_01 li{

	float:right;

	list-style:none;

	background:url(/material/images/common/bg_header_menu_01.gif) right top no-repeat;

	padding:5px 0;

	height:13px;

}

/* IE6.0 */

*html ul#header_menu_01 li{

	height:23px;

}



ul#header_menu_01 li#menu_right{

	background:url(none);

	font-family:"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";

	font-weight:bold;

}



ul#header_menu_01 li a{

	font-weight:bold;

	font-size:10px;

	line-height:12px;

	padding:0 15px;

}

ul#header_menu_01 a:link,

ul#header_menu_01 a:visited{

	color:#666666;

	text-decoration:none;

}

ul#header_menu_01 a:hover,

ul#header_menu_01 a:active{

	color:#225BA9;

	text-decoration:none;

}





ul#header_menu_02{

	float:right;

	width:550px; /* btn_01&btn_02&btn_03&btn_04に合わせてサイズを変更する*/ 

	height:24px;

	display:block;

	margin-top:12px;

}

/*ul#header_menu_02:after{

	content:".";

	display:block;

	height:0;

	clear:both;

	visibility:hidden;

}*/



ul#header_menu_02 li{

	float:right;

	list-style:none;

}



ul#header_menu_02 li#btn_01 a{

	width:114px;

	height:24px;

	background:url(/material/images/common/header_btn_01.jpg) no-repeat;

	display:block;

	margin-right:5px;

}

ul#header_menu_02 li#btn_02 a{

	width:138px;

	height:24px;

	background:url(/material/images/common/header_btn_02.jpg) no-repeat;

	display:block;

	margin-right:5px;

}



/*水広場Blogのボタン */

ul#header_menu_02 li#btn_03 a{

	width:116px;

	height:24px;

	background:url(/material/images/common/header_btn_03.jpg) no-repeat;

	display:block;

	margin-right:5px;　

}





/*コンサルティングのボタン */

ul#header_menu_02 li#btn_04 a{

	width:130px;

	height:24px;

	background:url(/material/images/common/header_btn_04.jpg) no-repeat;

	display:block;

	margin-right:5px;　

}



/* グローバルナビゲーション

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

#gnavi01 {
width: 100%; 
padding-top: 4px; 
background-color: #fff; 
font-size: 80%; 
margin:0 0 0 1px;
}

#gnavi01 .nl {
width:100%; 
margin: 0 0 0 3px; 
padding: 0;
list-style-type: none;
text-align: center;
}

#gnavi01 .nl li {
z-index: 1;
width: 120px; 
margin: 0; 
padding: 0;
background: #f9f9f9 url(/material/images/common/tab_gen2_left.gif) no-repeat left top; /* タブの背景（左） */
float: left;
text-decoration: none;
}

#gnavi01 .nl li a {
display: block;
padding: 6px 2px; /* リンクエリアのパディング（上下、左右） */
background: url(/material/images/common/tab_gen2_right.gif) no-repeat right top; /* タブの背景（右） */
text-decoration: none;

}

#gnavi01 .nl li a:hover {
text-decoration: underline; 
}

#gnavi01 .nl li.active {
z-index: 3;
background: #004080 url(/material/images/common/tab_act2_left.gif) no-repeat left top; 
}
#gnavi01 .nl li.active a {
background: url(/material/images/common/tab_act2_right.gif) no-repeat right top;
color: #ffffff; 
}


#gnavi01 .nl li.active02 {
z-index: 3;
margin-left:27px;
*margin-left:26px;
background: #004080 url(/material/images/common/tab_act2_left_gr.gif) no-repeat left top; 
}
#gnavi01 .nl li.active02 a {
background: url(/material/images/common/tab_act2_right_gr.gif) no-repeat right top;
color: #333; 
}

#gnavi01 .nl li.active03 {
z-index: 3;
background: #004080 url(/material/images/common/tab_act2_left_ye.gif) no-repeat left top; 
}
#gnavi01 .nl li.active03 a {
background: url(/material/images/common/tab_act2_right_ye.gif) no-repeat right top;
color: #333; 
}






/* === サブメニュー開始 === */


.localNav {
position: relative;
z-index: 2;
width:747px;
*width:746px;
background: #004080 url(/material/images/common/hor2_menu2_off.gif) repeat-x top; 

font-size: 80%; 
padding: 0; 
margin: 0 0 0 4px;
}

.localNav .nl {
width: 100%;
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}

.localNav .nl li {
float: left;
width:149px;
}


.localNav .nl li a {
display: block;
position: relative; /* IE6用 */
padding: 8px 5px; 
/*border-right: 1px #004080 solid; */
text-decoration: none; 
}



.localNav .nl li a:link,.localNav .nl li a:visited,.localNav .nl li a:hover,.localNav .nl li a:active {
color: #ffffff;
}

.localNav .nl li a:hover {
background: #004080 url(/material/images/common/hor2_menu2_on.gif) repeat-x 0 -1px; /* ポイント時の背景 */
text-decoration: underline; 
}

/* === サブメニュー終了 === */





/* サブナビゲーション

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

div#snavi{

	width:753px;

	height:26px;

	background:url(/material/images/common/bg_snavi.gif) no-repeat;

	margin:0 3px 0 4px;

}

div#snavi:after{

	content:".";

	display:block;

	height:0;

	clear:both;

	visibility:hidden;

}

div#snavi td{

	font-size:12px;

	line-height:26px;

	text-align:center;

}

div#snavi td a:link,

div#snavi td a:visited{

	color:#333333;

	text-decoration:none;

}

div#snavi td a:hover,

div#snavi td a:active{

	color:#333333;

	text-decoration:none;

	font-weight:bold;

}

div#snavi td.on{

	color:#333333;

	text-decoration:none;

	font-weight:bold;

}





/* パンくずナビ

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

#bread_navi{

	width:753px;

	color:#595959;

	margin:7px 0 20px 0;

	text-align:left;

}



#bread_navi span{

	margin:0 5px;

}

#bread_navi span.on{

	color:#225BA9;

	margin:0;

}

#bread_navi a:link,

#bread_navi a:visited{

	color:#595959;

	text-decoration:none;

}

#bread_navi a:hover,

#bread_navi a:active{

	color:#225BA9;

	text-decoration:none;

}





/* フッターフォーマット

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

#footer{

	clear:both;

	width:760px;

	text-align:center;

	display:block;

	color:#666666;

}

#footer a:link,

#footer a:visited{

	color:#666666;

	text-decoration:none;

}

#footer a:hover,

#footer a:active{

	color:#225BA9;

	text-decoration:none;

}



address{

	width:760px;

	margin:0 auto 25px 0;

	font-style:normal;

	font-size:12px;

	line-height:120%;

	border-top:1px solid #D1CFDC;

	padding-top:5px;

}



.foottxt{

	margin-top: 5px;

}





/* メインコンテンツ　（1カラム用、2カラム用は各CSSに記載）

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

#main{

	clear:both;

	width:753px;

	text-align:left;

	padding:8px 3px 0 4px;

}

/* IE6.0 */

*html #main{

	width:760px;

}



#main:after{

	content:".";

	display:block;

	height:0;

	clear:both;

	visibility:hidden;

}



#main_conts{

	width:753px;

}



.contents{

	width:753px;

}

.contents:after{

	content:".";

	display:block;

	height:0;

	clear:both;

	visibility:hidden;

}





/* 2カラム時　右ナビゲーションコンテンツ

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

#right_conts{

	float:right;

	width:170px;

	color:#595959;

	margin-bottom:50px;

}

/* rnavi_cols */

.rnavi_cols{

	width:170px;

	display:block;

	margin-bottom:10px;

	padding-bottom:10px;

	background:url(/material/images/common/bg_rnavi_bottom.gif) left bottom no-repeat;

}

.tit_rnavi{

	width:170px;

	height:24px;

	display:block;

	background:url(/material/images/common/bg_tit_rnavi.jpg) left top no-repeat;

	font-size:13px;

	line-height:24px;

	color:#044900;

	text-indent:15px;

	letter-spacing: 0.1em;

}



.tit_rnavi a:link,

.tit_rnavi a:visited{

	text-decoration:none;

}

.tit_rnavi a:hover,

.tit_rnavi a:active{

	text-decoration:none;

}



ul.rnavi{

	width:170px;

	background:url(/material/images/common/bg_rnavi.gif) left top repeat-y;

}

ul.rnavi li{

	width:170px;

	display:block;

	list-style:none;

	line-height:120%;

	padding-top:10px;

}

ul.rnavi li a{

	width:150px;

	background:url(/material/images/common/icon_01.gif) no-repeat;

	background-position:5px 3px;

	text-decoration:none;

	padding:0 0 0 20px;

	display:block;

}

/* IE6.0 */

*html ul.rnavi li a{

	width:170px;

}



ul.rnavi li a:link,

ul.rnavi li a:visited{

	color:#595959;

	text-decoration:underline;

}

ul.rnavi li a:hover,

ul.rnavi li a:active{

	color:#0066CC;

	text-decoration:underline;

}



/* 検索・ログインフォーム */

ul.rnavi_form{

	width:170px;

	background:url(/material/images/common/bg_rnavi.gif) left top repeat-y;

	padding-top:6px;

}

ul.rnavi_form li{

	width:157px;

	display:block;

	list-style:none;

	padding:0 7px 8px 6px;

}

/* IE6.0 */

*html ul.rnavi_form li{

	width:170px;

}



ul.rnavi_form li.input input{

	border:1px solid #7E9DB9;

}

ul.rnavi_form li.input input.search{

	width:138px;

	background:#FFFFFF url(/material/images/common/search_icon.gif) left top no-repeat;

	padding-left:17px;

	line-height:20px;

}

/* IE6.0 */

*html ul.rnavi_form li.input input.search{

	width:155px;

}



ul.rnavi_form li.btn{

	text-align:right;

	padding-top:7px;

}

ul.rnavi_form li dl{

	width:157px;

}

ul.rnavi_form li dl:after{

	content:".";

	display:block;

	height:0;

	clear:both;

	visibility:hidden;

}

ul.rnavi_form li dl dt{

	clear:left;

	float:left;

	width:35px;

	line-height:20px;

}

ul.rnavi_form li dl dd{

	float:left;

	width:120px;

	text-align:right;

}

ul.rnavi_form li dl dd input{

	width:120px;

}





/* SHOP情報 */

.rnavi_shop_cols{

	width:170px;

	display:block;

	margin-bottom:10px;

	padding-top:8px;

	background:url(/material/images/common/bg_rnavi_shop_top.gif) left top no-repeat;

}

.tit_rnavi_shop{

	width:170px;

	height:24px;

	display:block;

	font-size:13px;

	line-height:24px;

	text-indent:12px;

	color:#333333;

	font-weight:bold;

}



ul.rnavi_shop{

	width:170px;

}

ul.rnavi_shop li{

	width:158px;

	display:block;

	list-style:none;

	line-height:120%;

	padding:7px 0 7px 12px;

	background:url(/material/images/common/bg_rnavi_shop.gif) left bottom repeat-x;

}

ul.rnavi_shop li#rnavi_profile{

	font-size:10px;

	line-height:160%;

}

/* IE6.0 */

*html ul.rnavi_shop li{

	width:170px;

}

ul.rnavi_shop li a:link,

ul.rnavi_shop li a:visited{

	color:#595959;

	text-decoration:none;

}

ul.rnavi_shop li a:hover,

ul.rnavi_shop li a:active{

	color:#225BA9;

	text-decoration:none;

}



/* トップに戻る

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

.page_top{

	clear:both;

	width:100%;

	text-align:right;

	margin:30px 0 50px 0;

}

.page_top a:link,

.page_top a:visited{

	color:#666666!important;

}

.page_top a:hover,

.page_top a:active{

	color:#225BA9!important;

}





/* テーブル

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

table.frameline{

	border-collapse:collapse;

	border:1px solid #999999;

}

table.frameline td{

	border:1px solid #999999;

	padding:5px 15px;

	text-align:center;

}

table.frameline th{

	border:1px solid #999999;

	padding:5px 15px;

	font-weight:bold;

	white-space:nowrap;

	background-color:#EFECE5;

	text-align:center;

}



table.frameline td table{

	border:none;

}

table.frameline td table td{

	border:none;

	padding:0;

	text-align:left;

}

table.frameline td table th{

	border:none;

	padding:0;

	font-weight:bold;

	white-space:nowrap;

	background-color:#FFFFFF;

	text-align:left;

}





/* フォーム項目調整

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

div.blank{

	margin-top:5px;

}

span.sp{

	margin-left:25px;

}

.width80{

	width:80px;

}

.width150{

	width:150px;

}

.width170{

	width:170px;

}

.width300{

	width:300px;

}

.width400{

	width:400px;

}

.width737{

	width:737px;

	height:100px;

}





/* 基本スタイル

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

.none{

	display:none;

}

.clear{

	clear:both;

}

.left{

	text-align:left!important;

}

.right{

	text-align:right!important;

}

.center{

	text-align:center!important;

}

.top{

	vertical-align:top!important;

}

.middle{

	vertical-align:middle!important;

}

.bottom{

	vertical-align:bottom!important;

}

.fll{

	float:left;

}

.flr{

	float:right;

}

.clearall:after{

	content:".";

	display:block;

	height:0;

	clear:both;

	visibility:hidden;

}

.nowrap{

	white-space:nowrap;

}





/* テキストスタイル

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

.bold{

	font-weight:bold;

}

.normal{

	font-weight:normal;

}

.red{

	color: #FF0000;

}



/* 商品一覧 */



/* タイトル

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

div#listtitle {

    padding: 10px 0 0px 5px;

    font-size: 180%;

    font-weight:bold;


/* clearfix 

----------------------------------------------- */
.clearfix:after{

	content:".";

	display:block;

	height:0;

	clear:both;

	visibility:hidden;

}
.clearfix {
	display: inline-block;
} /* Hides from IE-mac \*/

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
} /* End hide from IE-mac */

.fLeft {
	float:left;
}

.fRight {
	float:right;
}



