@charset "utf-8";
/*===================================================

	基本設定

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

/*----------------------------------------------------
	ブラウザ初期設定のリセット
----------------------------------------------------*/
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin: 0;
	padding: 0;
}
body,td,th {
	font-size: 100%;
}
html,body {
}
html {
	overflow-y: scroll;
}
h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
	font-weight: normal;
}
p {
	margin: 0 0 1em;
}
ol,ul {
	list-style: none;
}
fieldset,img {
	border: 0;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption,th {
	text-align: left;
}
address,caption,cite,code,dfn,em,th,var {
	font-style: normal;
}
img{
	vertical-align: bottom;
}

/*----------------------------------------------------
	#flash　トップページ用Flash
----------------------------------------------------*/
#flash {
	text-align:center;
	clear:both;
	margin-top:19px;
}
#flash h2 {
	display:block;
	width:960px;
	height:331px;
	margin:3px auto 0;
	padding:0;	
	}

/*----------------------------------------------------
	基礎設定
----------------------------------------------------*/
html {
	background: #00A0E8;
}
body {
	background: #FFF url(../img/bg2.jpg) repeat-x 0 16px;
	float: left;
	width: 100%;
	font-size: 12px;
	line-height: 1.5em;
}
.left {
	float: left;
	margin: 0 10px 10px 0;
}
.imgR {
	float: right;
	margin: 0 0 10px 10px;
}
.imgL {
	float: left;
	margin: 0 10px 10px 0;
}

/*----------------------------------------------------
	#header　ヘッダー
----------------------------------------------------*/

#header {
	background: url(../img/hed2.jpg) no-repeat 0 16px;
	margin: 0 auto;
	width: 960px;
	height: 74px;
	padding:0;
}

h1 { font-size:10px; line-height:10px; margin:0; padding:3px 0; }

#header div#logo {
	float: left;
}
#header div#logo a {
	display: block;
	height: 59px;
	float:left;
	margin-top:10px;
}


/* ↓new */
#header #main_nav2 { /* メインナビゲーション */
	height: 59px;
	float: left;
	margin-top:10px;
}
#header #main_nav2 li {
	height: 59px;
	float: left;
	margin-left:10px;
}
/* ↑new */


/* ↓old */
#header #main_nav { /* メインナビゲーション */
	width: 680px;
	height: 59px;
	float: left;
	margin-top:10px;
}
#header #main_nav li {
	width: 75px;
	height: 59px;
	float: left;
	padding-left: 25px;
}
#header #main_nav li.water { width: 120px; }
#header #main_nav li.server { width: 180px; padding-right: 25px; }

#header #main_nav li.water a { width: 120px; background-position: 0 top;}
#header #main_nav li.server a { width: 180px; background-position: -120px top;}
#header #main_nav li.voice a { background-position: -300px top;}
#header #main_nav li.partner a { background-position: -375px top;}
#header #main_nav li.corporate a { background-position: -450px top;}

#header #main_nav li.water a:hover { background-position: 0 bottom;}
#header #main_nav li.server a:hover { background-position: -120px bottom;}
#header #main_nav li.voice a:hover { background-position: -300px bottom;}
#header #main_nav li.partner a:hover { background-position: -375px bottom;}
#header #main_nav li.corporate a:hover { background-position: -450px bottom;}
/* ↑old */


/*----------------------------------------------------
	#dwc_main_content　メインコンテンツ
----------------------------------------------------*/
#dwc_main_content {
	margin: 20px auto 0;
	width: 960px;
	clear:both;
}

	/*----------------------------------------------------
		#container　メイン要素
	----------------------------------------------------*/
	#container {
		float: right;
		width: 750px;
		background: #FFF url(../img/container_hed.jpg) no-repeat center top;
	}
	#container h2 {
		margin: 10px 1px;
	}

	#container div.data {
		padding: 0 14px 10px;
		border-right: 1px solid #EEE;
		border-bottom: 1px solid #EEE;
		border-left: 1px solid #EEE;
		margin-bottom: 10px;
		float: left;
		width: 720px;
	}
	
	#container div.data h2 {
		background: #FFF url(../img/h2_bg.jpg) no-repeat center top;
		line-height: 40px;
		padding-left: 20px;
		font-size: 18px;
		font-weight: bold;
		color: #FFF;
		margin-top: 10px;
		margin-bottom: 10px;
		clear: both;
	}
	#container div.data h2.server_logo {
		background: #FFF url(../img/h2_bg_server.jpg) no-repeat center top;
	}
	
	#container div.data h3 {
		color: #06F;
		font-size: 16px;
		font-weight: bold;
		line-height: 2em;
	}
	
	#container div.data table.line {
		width: 100%;
	}
	
	#container div.data table.line th,
	#container div.data table.line td {
		padding: 2px 10px;
		border: 1px solid #CCC;
		vertical-align: top;
	}
	
	#container div.data #page_top {
		clear: both;
		margin-top: 10px;
		padding: 10px 0 10px 550px;
		border-top: 1px dotted  #00A0E8;
	}
	#container div.data #page_top a {
		background: #00A0E8;
		color: #FFF;
		width: 170px;
		padding: .5em 1em;
	}
	
	/* 選べる３種類の100%天然水 */
	
	#container div.data ul#water {
		height: 740px;
	}
	#container div.data ul#water li {
		width: 340px;
		height: 350px;
		padding: 10px 10px 20px;
		float: left;
	}
	#container div.data ul#water li a {
		width: 340px;
		height: 340px;
		display: block;
	}
	
	/* オンラインショップと他の天然水へのリンク */
	
	#container div.data #water-link {
		border-top: 1px solid #CCC;
		margin-bottom: 10px;
	}
	#container div.data #water-link tr {
		border-bottom: 1px solid #CCC;
	}
	#container div.data #water-link td#water-list a {
		background-image: url(../img/water-link-3.gif);
		display: block;
		height: 30px;
		width: 177px;
		float: left;
		margin: 4px 4px 4px 0;
	}
		#container div.data #water-link td#water-list a#yume1 { background-position: 0 0; }
		#container div.data #water-link td#water-list a#yume2 { background-position: -177px 0; }
		#container div.data #water-link td#water-list a#vana { background-position: -354px 0; }
		#container div.data #water-link td#water-list a#hita { background-position: -531px 0; margin-right:0; }
		
		#container div.data #water-link td#water-list a:hover#yume1 { background-position: 0 bottom; }
		#container div.data #water-link td#water-list a:hover#yume2 { background-position: -177px bottom; }
		#container div.data #water-link td#water-list a:hover#vana { background-position: -354px bottom; }
		#container div.data #water-link td#water-list a:hover#hita { background-position: -531px bottom; } 
	
	#container div.data a#shop_link {
		background-image: url(../img/water-link-2.jpg);
		display: block;
		height: 58px;
		width: 276px;
	}
	#container div.data a:hover#shop_link {
		background-position: bottom;
	}
	
	/* 注意書き */
	
	#container div.data #note {
		background: #EFEFEF;
		padding: 1em;
		margin-bottom: 10px;
	}
	#container div.data #note li {
		padding-bottom: .5em;
		margin-left: 1em;
		list-style-type: disc;
	}
	
	/* ２カラムテーブル */
	
	#container div.data table#two_column td {
		padding: 0 10px 10px 0;
		vertical-align: top;
	}
	#container div.data table#two_column td.right {
		padding: 0 0 10px 10px;
	}
	#container div.data table#two_column td h2 {
		background: #FFF url(../img/h2_bg_mini.jpg) no-repeat center top;
	}
	
	/* ドリームウォーターは、経済的です */
	
	#container div.data #bottom_link {
		background: url(../img/bottom_link_bg.gif);
		float: left;
		padding: 0 15px 15px 0;
		margin: 10px 0;
	}
	#container div.data #bottom_link li {
		width: 220px;
		height: 250px;
		padding: 15px 0 0 15px;
		float: left;
	}
	#container div.data #bottom_link li a {
		background: url(../img/bottom_link.jpg);
		width: 220px;
		height: 250px;
		display: block;
	}
		#container div.data #bottom_link li#water a { background-position: 0 0; }
		#container div.data #bottom_link li#server a { background-position: -220px 0; }
		#container div.data #bottom_link li#holder a { background-position: -440px 0; }
		#container div.data #bottom_link li#water a:hover { background-position: 0 bottom; }
		#container div.data #bottom_link li#server a:hover { background-position: -220px bottom; }
		#container div.data #bottom_link li#holder a:hover { background-position: -440px bottom; }

	#container div.data a#shop_bottom_link {
		display: block;
		height: 77px;
		width: 720px;
		float: left;
		margin-bottom: 10px;
	}
	#container div.data a:hover#shop_bottom_link {
		background-position: bottom;
	}
	
	/* お料理にも使えます */
	
	#container div.data h2.cooking {
		background: #AC4E40;
		line-height: 1.2em;
		border-left: 20px solid #D27B61;
		padding: .5em 0 .5em 20px;
	}
	#container div.data h2.cooking strong {
		font-size: 26px;
	}
	
	/* お客様の声 */
	
	#container div.data #voice {
		padding: 10px 0;
	}
	#container div.data #voice div {
		background: url(../img/user.jpg) no-repeat left top;
		min-height: 60px;
		font-size: 18px;
		line-height: 1.5em;
		padding: 0 0 5px 50px;
		border-bottom: 1px dotted #00A0E8;
		margin-top: 5px;
	}
	#container div.data #voice div span {
		font-size: 14px;
		color: #999;
		line-height: 1.2em;
	}
	#container div.data #voice div strong {
		color: #06F;
	}
	
	/* サーバー設置方法 */
		
	#container div.data tabel#framework {
		width: 100%;
	}
	
	#container div.data table#framework th {
		background-color: #D7EDFB;
		text-align: center;
		vertical-align: bottom;
		border: 1px solid #D7EDFB;
	}
	#container div.data table#framework td {
		vertical-align: top;
		border: 1px solid #D7EDFB;
		padding: .5em;
	}
	
	/* お申し込み方法 選択 */
	
	#container div.data #entry {
		background: url(../img/entry-1.gif);
		height: 277px;
		padding: 53px 0 0 107px;
	}
	#container div.data #entry a {
		display: block;
		float: left;
	}
	#container div.data #entry a:hover {
		background-image: url(../img/entry-1_over.gif);
	}
		#container div.data #entry a#kanagi { width: 46px; height: 60px; margin-right: 20px; }
		#container div.data #entry a#yume1 { width: 46px; height: 60px; margin-right: 20px; }
		#container div.data #entry a#yume2 { width: 46px; height: 60px; margin-right: 20px; }
		#container div.data #entry a#vana { width: 46px; height: 60px; margin-right: 20px; }
		#container div.data #entry a#hita { width: 46px; height: 60px; margin-right: 20px; }
		#container div.data #entry a:hover#yume1 { background-position: 0 0;}
		#container div.data #entry a:hover#yume2 { background-position: -46px 0;}
		#container div.data #entry a:hover#vana { background-position: -92px 0;}
		#container div.data #entry a:hover#hita { background-position: -138px 0;}
	
	/* 個人情報保護方針 */
	
	#container div.data ol.number {
		list-style-position: outside;
		list-style-type: decimal;
		padding-left: 2em;
		margin-top: 20px;
	}
	#container div.data ol.number li {
		padding-bottom: 1em;
	}
	#container div.data ol.number li ol {
		list-style-position: outside;
		list-style-type: upper-roman;		
		padding-top: 1em;
		padding-left: 3em;
	}
	#container div.data ol.number li ol ol {
		list-style-type: lower-roman;
	}
		
	/* サイトマップ */
	
	#container div.data #sitemap {
		padding-left: 20px;
	}
	#container div.data #sitemap li {
		font-size: 16px;
		line-height: 1.5em;
		font-weight: bold;		
	}
		
	/* よくある質問 */
	
	#faq dt {
		font-weight: bold;
		background: url(../img/faq_q.gif) no-repeat left top;
		padding-left: 25px;
	}
	#faq dd {
		background: url(../img/faq_a.gif) no-repeat left top;
		padding: .5em 2em 2em 25px;
	}
	#faq dd ol li {
		margin-left: 2em;
		list-style-position: outside;
		list-style-type: decimal;
	}
	#faq dd ul li {
		margin-left: 2em;
		list-style-position: outside;
		list-style-image: url(../img/faq_ul.gif);
		*list-style-image: url(../img/faq_ul_ie67.gif); /* IE6-7 */
	}
		
	/* ポイント交換 */
	
	#point div.point_in {
		font-size: 14px;
		font-weight: bold;
		line-height: 2em;
		padding-left: 1em;
	}
	#point div.point_in strong {
		color: #F33;
		font-size: 18px;
		padding-left: .5em;
	}
	#point td {
		color: #333;
		text-align: center;
		width: 180px;
		padding-top: 2px;
		padding-bottom: 1em;
		border: 1px solid #DDD;
	}
		
	/* 利用規約 */
	
	#termsofuse ul,
	#termsofuse ol {
		padding-left: 3em;
	}
	#termsofuse ol ul li {
		list-style-position: outside;
		list-style-type: circle;
	}
	#termsofuse ol li {
		list-style-position: outside;
		list-style-type: decimal;
	}
		
	/* 追加注文フォーム */
	
	#reorder table {
		border-left: 1px solid #CCC;
		border-top: 1px solid #CCC;
		width: 100%;
		margin: 2em 0;
	}
	#reorder th {
		background-color: #F0F0F0;
		border-bottom: 1px solid #CCC;
		border-right: 1px solid #CCC;
		font-weight: normal;
		padding: 10px 20px;
		text-align: right;
		width: 15em;
	}
	#reorder td {
		border-bottom: 1px solid #CCC;
		border-right: 1px solid #CCC;
		padding: 10px 20px;
		vertical-align: top;
	}
	
	/* DREAM CHANCE */
	
	dl#dreamchance_tousen dt {
		color:#E50B72;
		font-size:14px;
		font-weight:bold;
		}
	dl#dreamchance_tousen dd {
		font-weight:bold;
		padding-bottom:5px;
		}
	
	
	/*----------------------------------------------------
		#dwc_side　サイド要素
	----------------------------------------------------*/
	#dwc_side {
		width: 200px;
	}
	body#top_page  #dwc_side {
		padding-top: 20px;
	}
	
		/*----------------------------------------------------
			#side_nav　サイドナビゲーション
		----------------------------------------------------*/
		#side_nav {
			background: url(../img/side_nav_bg.png) no-repeat;
			_background: url(../img/side_nav_bg.gif) no-repeat;
			padding-top: 10px;
			margin-bottom: 10px;
		}
		#side_nav div {
			background: url(../img/side_nav_bg.png) no-repeat bottom;
			_background: url(../img/side_nav_bg.gif) no-repeat bottom;
			padding-bottom: 10px;
			border-top: 1px solid #CCC;
		}
		#side_nav a {
			background: #E4F4FD url(../img/side_nav_li.gif) no-repeat left top;
			_background: #E4F4FD url(../img/side_nav_li.gif) no-repeat 5px 2px;
			border-color: #FFF;
			border-style: solid;
			border-width: 2px 5px 0;
			padding: 5px 5px 5px 15px;
			font-size: 14px;
			text-decoration: none;
			font-weight: bold;
			color: #09F;
			display: block;
		}
		*:first-child+html #side_nav a {
			background: #E4F4FD url(../img/side_nav_li.gif) no-repeat 5px 2px;
		}
		#side_nav a:hover {
			color: #EA5810;
		}
		
		/*----------------------------------------------------
			#common_banner　共通バナー類
		----------------------------------------------------*/
		#common_banner a {
			display: block;
			margin-bottom: 10px;
		}

	/*----------------------------------------------------
		#index_content　トップページ要素
	----------------------------------------------------*/
	#index_content0 {
		background: url(../img/index_links_2_bg.gif);
		width: 953px;
		margin: 5px 0;
		padding: 7px 0 7px 7px;
		float: left;
	}
		#index_content0 a {
			background: #FFF;
			display: block;
			float: left;
			margin-right: 2px;
		}
	
	#index_content1 {
		width: 950px;
		padding: 5px;
	}
		#index_content1 #index_links {
			width: 340px;
			_width: 335px;
			float: left;
		}
		#index_content1 #index_links a {
			padding-bottom: 5px;
			display: block;
		}
	
	#index_content2 {
		width: 720px;
		float: right;
		padding: 20px 0;
	}
		#index_content2 .trivia {
			margin: 15px 0 5px;
		}
		
		#index_content2 #trivia_1 a,
		#index_content2 #trivia_2 a {
			width: 162px;
			height: 35px;
			display: block;
			color: #FFF;
			font-size: 14px;
			font-weight: bold;
			text-decoration: none;
			text-align: center;
			float: left;
			margin: 5px;
			padding-top: 15px;
		}
		#index_content2 #trivia_1 a.long,
		#index_content2 #trivia_2 a.long {
			height: 40px;
			padding-top: 10px;
		}
		#index_content2 #trivia_1 a:hover,
		#index_content2 #trivia_2 a:hover {
			background-position: bottom;
		}
		#index_content2 #trivia_1 a {
			background-image: url(../img/index_trivia_1_link.jpg);
		}
		#index_content2 #trivia_2 a {
			background-image: url(../img/index_trivia_2_link.jpg);
		}
		
/*----------------------------------------------------
	#bottom　下部要素
----------------------------------------------------*/
#bottom {
	background: url(../img/bg_bottom.jpg) repeat-x bottom;
	height: 280px;
	clear: right;
}
#bottom #bottom_nav { /* ナビゲーション */
	background: url(../img/bottom_nav.jpg) repeat-x bottom;
	margin: 0 auto;
	width: 960px;
	height: 100px;
}
#bottom #bottom_nav li {
	background: url(../img/li_icon.gif) no-repeat left center;
	float: right;
	padding: 25px 10px 25px 20px;
}

#bottom #bottom_info { /* 企業情報 */
	background: url(../img/bottom_logo.gif) no-repeat left center;
	color: #FFF;
	line-height: 20px;
	margin: 20px auto;
	width: 700px;
	padding-left: 260px;
}
#bottom #bottom_info strong {
	font-weight: bold;
}

#bottom #copy { /* コピーライト */
	margin: 0 auto;
	width: 960px;
	color: #FFF;
}