@charset "shift_jis";
 @import url(base.css);
/* CSS Document */

/*
-------------------------------------------------------------------
◎ページレイアウトスタイルシート
製作者：株式会社アルゴ
制作日：2009年1月21日
最終更新日：2009年1月22日
-------------------------------------------------------------------
[目次]

・隠しテキスト
・テキスト設定
・トップページ（index.html）
　1.インフォメーション
　2.リンクバナー
・バリエーションページ（variation.html）
・省エネ性能ページ（ecology.html）
・注出性能（extraction.html）
・操作性（control.html）
・清掃性（cleaning.html）
・パウダー茶（powder.html）
・ラインナップ（lineup.html）
・ 余白・マージン設定

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

/* 隠しテキスト */
body#index h1 a,
div.right-side p.information,
div.right-side a.powder,
div.right-side a.type,
div.right-side a.lineup,
div.right-side a.rental,
div.btn-close a,
p a.btn-black,
p a.btn-brown,
div.btn-close a,
p.closeup a,
p.switch a,
body#index a.standerd,
body#index a.big-capa,
body#type p.h1-caption{
	text-indent: -9999em;
}

/* テキスト設定 */
body#variation h2, body#ecology h2 {
	width: 447px;
	height: 37px;
}
body#extraction h2, body#control h2, body#cleaning h2, body#installation h2 {
	width: 440px;
	height: 37px;
}
body#powder h2 {
width: 420px;
height: 100px;
}
body#lineup h2 {
width: 442px;
height: 32px;
margin-bottom: 20px;
}

body#extraction div.left-side p.mb10, body#extraction div.right-side p.mb10, body#control div.left-side p.mb10, body#control div.right-side p.mb10 {
	margin-bottom: 10px;
}
/* トップページ（index.html） */

body#index div#position h1 {
	position: absolute;
	display: block;
	width: 95px;
	height: 89px;
	margin-top: 0px;
	left: 262px;
	top: 553px;
	z-index: 3;
	background: url(../images/logo_varie.gif) no-repeat;
	background-image: url(../images/logo_varie2.gif);
}
body#index h1 a {
	display: block;
	width: 95px;
	height: 89px;
}
body#index h2 {
	display: block;
	width: 460px;
	height: 385px;
	margin-bottom: 0px;
	background: url(../images/bg_h1-index.jpg) no-repeat;
}
body#index div#main-img {
margin-top: 80px;
	}
body#index div#position a.good {
	position: absolute;
	display: block;
	width: 105px;
	height: 74px;
	background: url(../images/good.jpg) no-repeat;
	left: 310px;
	top: 667px;
	z-index: 3;
	}
body#index div#position a.standerd {
	position: absolute;
	display: block;
	width: 230px;
	height: 22px;
	background: url(../images/btn_standerd.gif) no-repeat;
	left: 195px;
	top: 745px;
	z-index: 3;
	}
body#index div#position a:hover.standerd {
	background: url(../images/btn_standerd.gif) no-repeat 0px -22px;
	}
body#index div#position a.big-capa {
	position: absolute;
	display: block;
	width: 230px;
	height: 22px;
	background: url(../images/btn_big-capa.gif) no-repeat;
	left: 196px;
	top: 815px;
	z-index: 3;
	}
body#index div#position a:hover.big-capa {
	background: url(../images/btn_big-capa.gif) no-repeat 0px -22px;
	}

/* 1.インフォメーション */
div.right-side p.information {
	border: 5px solid #C8C8C8;
	border-bottom: none;
	background: url(../images/bg_dl-information.gif) 10px 10px no-repeat;
	_background: url(../images/bg_dl-information.gif) 15px 15px no-repeat;
}
div#contents dl.information {
	display: block;
	overflow: auto;
	width: 420px;
	height: 110px;
	padding-left: 10px;
	border: 5px solid #C8C8C8;
	border-top: none;
}
dl.information dt, dl.information dd {
	font-size: small;
	_font-size: small;
	padding: 8px 0px;
	margin:0px;
}
dl.information dt {
	float:left;
	width:100px;
	background: url(../images/icon_green.gif) right 11px no-repeat;
}
dl.information dd {
	padding-left:105px;
}
dl.information dd.line-clear {
	clear: both;
	width: 95%;
	height: 1px;
	padding: 0px;
	margin: 0px;
	line-height: 1px;
	border-bottom: 1px dashed #C8C8C8;
}
/* 2.リンクバナー */
div.right-side a.powder,div.right-side a.type, div.right-side a.lineup,div.right-side a.rental {
	display: block;
	width: 215px;
	height: 80px;
	margin-top: 15px;
}
div.right-side a.lineup {
	margin-bottom: 15px;
}
div.right-side a.powder {
	float: right;
	background: url(../images/bnr_powder.jpg) no-repeat;
}
div.right-side a:hover.powder {
	background: url(../images/bnr_powder.jpg) 0px -80px no-repeat;
}
div.right-side a.type {
	float: right;
	background: url(../images/bnr_type.jpg) no-repeat;
}
div.right-side a:hover.type {
	background: url(../images/bnr_type.jpg) 0px -80px no-repeat;
}
div.right-side a.lineup {
	float: left;
	background: url(../images/bnr_lineup.jpg) no-repeat;
}
div.right-side a:hover.lineup {
	background: url(../images/bnr_lineup.jpg) 0px -80px no-repeat;
}
div.right-side a.rental {
	float: left;
	background: url(../images/teatimeplus_banner-varie.jpg) no-repeat;
}
div.right-side a:hover.rental {
	background: url(../images/teatimeplus_banner-varie_f2.jpg) no-repeat;
}
/* バリエーションページ（variation.html） */
body#variation h1 {
	background: url(../images/img_h-variation.jpg) no-repeat;
}
body#variation h2 {
	background: url(../images/bg_h2-variation.gif) no-repeat;
}
/* 省エネ性能ページ（ecology.html） */
body#ecology h1 {
	background: url(../images/img_h-ecology.jpg) no-repeat;
}
body#ecology h2 {
	background: url(../images/bg_h2-ecology.gif) no-repeat;
}
body#ecology h3.title01 {
	width: 574px;
	background: url(../images/bg_h3-ecology01.gif) no-repeat;
}
body#ecology h3.title02 {
	width: 326px;
	margin-top: 10px;
	background: url(../images/bg_h3-ecology02.gif) no-repeat;
}
body#ecology div.left-side {
	width: 574px;
}
body#ecology div.right-side {
	width: 326px;
}
div.left-side p {
	padding-left: 5px;
}
div.right-side p.caution {
	width: 326px;
	padding-left: 0px;
}
div.caution-box {
	padding: 0px 15px 10px;
	background: #EFD8BD;
}
p.caution-eco {
	padding-top: 5px;
	font-size: smaller;
	line-height: 1.4em;
	border-top: 1px solid #FFF;
}
/* 注出性能（extraction.html） */
body#extraction h1 {
	background: url(../images/img_h-extraction.jpg) no-repeat;
}
body#extraction h2.title01 {
	background: url(../images/bg_h2-extraction01.gif) no-repeat;
}
body#extraction h2.title02 {
	background: url(../images/bg_h2-extraction02.gif) no-repeat;
}
body#extraction h2.title03 {
	height: 60px;
	background: url(../images/bg_h2-extraction03.gif) no-repeat;
}
body#extraction h2.title04 {
	height: 60px;
	background: url(../images/bg_h2-extraction04.gif) no-repeat;
}
body#extraction h3.title01 {
	background: url(../images/bg_h3-extraction01.gif) no-repeat;
}
body#extraction h3.title02 {
	background: url(../images/bg_h3-extraction02.gif) 70px top no-repeat;
}
body#extraction div.left-side, body#extraction div.right-side {
	width: 440px;
}
body#extraction div.left-side p, body#extraction div.right-side p {
	width: 430px;
	margin-bottom: 30px;
	padding-left: 5px;
}
/* 操作性（control.html） */
body#control h1 {
	background: url(../images/img_h-control.jpg) no-repeat;
}
body#control h2.title01 {
	background: url(../images/bg_h2-control01.gif) no-repeat;
}
body#control h2.title02 {
	background: url(../images/bg_h2-control02.gif) no-repeat;
}
body#control h2.title03 {
	background: url(../images/bg_h2-control03.gif) no-repeat;
}
body#control h2.title04 {
	background: url(../images/bg_h2-control04.gif) no-repeat;
}
body#control h3.title01 {
	background: url(../images/bg_h3-control01.gif) no-repeat;
}
body#control h3.title02 {
	background: url(../images/bg_h3-control02.gif) no-repeat;
}
body#control div.left-side, body#control div.right-side {
	width: 440px;
}
body#control div.left-side p, body#control div.right-side p {
	width: 430px;
	margin-bottom: 30px;
	padding-left: 5px;
}
/* 清掃性（cleaning.html） */
body#cleaning h1 {
	background: url(../images/img_h-cleaning.jpg) no-repeat;
}
body#cleaning h2.title01 {
	background: url(../images/bg_h2-cleaning01.gif) no-repeat;
}
body#cleaning h2.title02 {
	background: url(../images/bg_h2-cleaning02.gif) no-repeat;
}
body#cleaning h2.title03 {
	background: url(../images/bg_h2-cleaning03.gif) no-repeat;
}
body#cleaning div.left-side, body#cleaning div.right-side {
	width: 440px;
}
body#cleaning div.left-side p, body#cleaning div.right-side p {
	width: 430px;
	margin-bottom: 30px;
	padding-left: 5px;
}
/* 清掃性（installation.html） */
body#installation h1 {
	background: url(../images/img_h-installation.jpg) no-repeat;
}
body#installation h2.title01 {
	height: 60px;
	background: url(../images/bg_h2-installation01.gif) no-repeat;
}
body#installation h2.title02 {
	background: url(../images/bg_h2-installation02.gif) no-repeat;
}
body#installation h3 {
	height: 25px;
	margin-top: 10px;
}
body#installation h3.title01 {
	background: url(../images/bg_h3-installation01.gif) no-repeat;
}
body#installation h3.title02 {
	background: url(../images/bg_h3-installation02.gif) no-repeat;
}
body#installation h3.title03 {
	background: url(../images/bg_h3-installation03.gif) no-repeat;
}
body#installation div.left-side, body#installation div.right-side {
	width: 440px;
}
body#installation div.left-side p, body#installation div.right-side p {
	width: 430px;
	margin-bottom: 30px;
	padding-left: 5px;
}
body#installation div.left-side p.mb10,body#installation div.right-side p.mb10 {
margin-bottom: 10px;
}
body#installation div.right-side div.left-inner {
	float: left;
	width: 200px;
	padding-left: 5px;
}
body#installation div.right-side div.right-inner {
	float: right;
	width: 200px;
	padding-right: 5px;
}
body#installation div.right-side div.left-inner p, body#installation div.right-side div.right-inner p {
	width: 200px;
}
div.right-inner p.caution {
	margin-top: 250px;
	margin-bottom: 0px;
}
/* パウダー茶（powder.html） */

body#powder div#contents {
width: 898px;
margin-top: 80px;
border: 1px solid #B2B2B2;
background: url(../images/bg_h-powder.jpg) no-repeat;
}
body#powder h1 {
width: 548px;
height: 50px;
margin-top: 30px;
padding-left: 350px;
background: url(../images/bg_h1-powder.gif) 350px top no-repeat;
}
body#powder h2.title01 {
width: 430px;
background: url(../images/bg_h2-powder01.gif) no-repeat;
}
body#powder h2.title02 {
width: 430px;
background: url(../images/bg_h2-powder02.gif) no-repeat;
}
body#powder h2.title03 {
width: 430px;
background: url(../images/bg_h2-powder03.gif) no-repeat;
}
body#powder h2.title04 {
width: 430px;
background: url(../images/bg_h2-powder04.gif) no-repeat;
}
body#powder h2.title05 {
width: 430px;
background: url(../images/bg_h2-powder05.gif) no-repeat;
}
body#powder h2.title06 {
width: 430px;
background: url(../images/bg_h2-powder06.gif) no-repeat;
}
body#powder p.h1-caption {
width: 528px ;
margin: 20px 0 50px;
padding: 0px 20px 0 350px;
}
body#powder div.left-side {
width: 430px;
padding-left: 20px;
background: url(../images/bg_c-powder.gif) repeat-y 20px top;
}
body#powder div.right-side {
width: 430px;
padding-right: 10px;
background: url(../images/bg_c-powder.gif) repeat-y;
}
body#powder div.left-side p {
margin-bottom: 20px;
padding-left: 10px;
padding-right: 20px;
}
body#powder div.right-side p {
margin-bottom: 20px;
padding-left: 10px;
padding-right: 20px;
}
body#powder div.left-inner {
width: 210px;
margin-bottom: 20px;
}
body#powder div.right-inner {
width: 220px;
}
body#powder div.left-inner p,body#powder div.right-inner p {
font-size: 75%;
line-height: 1.5em;
}
body#powder div.left-inner p {
padding-right: 0px;
margin-bottom: 5px;
}
body#powder div.right-inner p {
padding-left: 0px;
}

div.bg-powder {
	background: url(../images/bg_b-powder.jpg) no-repeat right bottom;
}
div#contents-bottom {
	position: relative;
	margin-top: 10px;
}
body#powder div.left01 {
height: 250px;
} 
body#powder div.right01 {
height: 310px;
} 
body#powder div.right02 {
height: 160px;
} 
body#powder p.caution {
width: 400px;
}
div.btn-close {
	clear: both;
	margin-top: 20px;
	font-size: smaller;
	line-height: 1.5em;
	text-align: center;
}
div.btn-close a {
display: block;
margin: 0px auto;
width: 71px;
height: 27px;
	background: url(../images/btn_close.gif) no-repeat;
}
div.btn-close a:hover {
	background: url(../images/btn_close-on.gif) no-repeat;
}

/* タイプ（type.html） */

body#type div#contents {
width: 898px;
margin-top: 80px;
border: 1px solid #B2B2B2;
background: url(../images/bg_h-type.jpg) no-repeat;
}
body#type h1 {
height: 50px;
margin-top: 30px;
}
body#type h2.title01 {
width: 430px;
height: 300px;
background: url(../images/img_pte100.jpg) no-repeat left top;
}
body#type h2.title02 {
width: 430px;
height: 300px;
background: url(../images/img_pte250.jpg) no-repeat left top;
}
body#type h3.title01 {
width: 430px;
height: 58px;
margin: 0px;
background: url(../images/bg_h3-pte100.gif) no-repeat;
}
body#type h3.title02 {
width: 430px;
height: 58px;
margin: 0px;
background: url(../images/bg_h3-pte250.gif) no-repeat;
}
body#type h3.title03 {
width: 430px;
height: 60px;
background: url(../images/bg_h3-pte250c.gif) no-repeat;
}
body#type p.h1-caption {
margin: 20px 0 100px;
}
body#type div.center-border {
background: url(../images/bg_type-center.gif) 450px top repeat-y;
}
body#type div.left-side {
width: 430px;
padding-left: 20px;
background: url(../images/bg_c-powder.gif) repeat-y 20px top;
}
body#type div.right-side {
width: 430px;
padding-right: 10px;
background: url(../images/bg_c-powder.gif) repeat-y;
}
body#type div.left-side2 {
float: left;
width: 430px;
padding-left: 20px;
}
body#type div.right-side2 {
float: right;
width: 430px;
padding-right: 10px;
}
body#type div.crash {
width: 393px;
padding: 0px 10px;
background: url(../images/bg_crash.gif) center bottom;
}
body#type div.crash p {
width: 200px;
}
body#type div.crash p.highlight {
margin-bottom: 10px;
font-size: 120%;
line-height: 1.3em;
color: #138F2E;
font-weight: bold;
}
/* ラインナップ（lineup.html） */
body#lineup h1 {
	background: url(../images/img_h-lineup.jpg) no-repeat;
}
body#lineup h2.title2-01 {
	background: url(../images/bg_h2-lineup201.gif) no-repeat;
}
body#lineup h2.title2-02 {
	background: url(../images/bg_h2-lineup202.gif) no-repeat;
}
body#lineup h2.title2-03 {
	background: url(../images/bg_h2-lineup203.gif) no-repeat;
}
body#lineup h2.title2-04 {
	background: url(../images/bg_h2-lineup204.gif) no-repeat;
}
body#lineup h2.title3-01 {
	background: url(../images/bg_h2-lineup301.gif) no-repeat;
}
body#lineup h2.title3-02 {
	background: url(../images/bg_h2-lineup302.gif) no-repeat;
}
body#lineup h2.title3-03 {
	background: url(../images/bg_h2-lineup303.gif) no-repeat;
}
body#lineup h2.title3-04 {
	background: url(../images/bg_h2-lineup304.gif) no-repeat;
}
body#lineup h2.title1-01 {
	background: url(../images/bg_h2-lineup101.gif) no-repeat;
}
body#lineup h2.title1-02 {
	background: url(../images/bg_h2-lineup102.gif) no-repeat;
}
body#lineup h2.title1-03 {
	background: url(../images/bg_h2-lineup103.gif) no-repeat;
}
body#lineup h2.title1-04 {
	background: url(../images/bg_h2-lineup104.gif) no-repeat;
}
body#lineup h2.titlec-01 {
	background: url(../images/bg_h2-lineupc01.gif) no-repeat;
}
body#lineup h2.titlec-02 {
	background: url(../images/bg_h2-lineupc02.gif) no-repeat;
}
body#lineup h2.titlec-03 {
	background: url(../images/bg_h2-lineupc03.gif) no-repeat;
}
body#lineup h2.titlec-04 {
	background: url(../images/bg_h2-lineupc04.gif) no-repeat;
}
body#lineup div#contents {
margin-top: 15px;
}
body#lineup p.switch {
display: block;
width: 744px;
height: 30px;
margin-bottom: 10px;
padding-top: 6px;
padding-left: 156px;
overflow: hidden;
background: url(../images/btn_switch.gif) no-repeat 0px -36px;
}
p.switch img {
float: left;
}
p.switch a {
display: block;
float: left;
width: 121px;
height: 27px;
}
div.lineup3 p.switch a.powder3 {
background:url(../images/btn_switch.gif) no-repeat -156px -6px;
}
div.lineup2 p.switch a.powder2 {
background:url(../images/btn_switch.gif) no-repeat -282px -6px;
}
div.lineup1 p.switch a.powder1 {
background:url(../images/btn_switch.gif) no-repeat -532px -6px;
}
div.lineupc p.switch a.crash {
background:url(../images/btn_switch.gif) no-repeat -658px -6px;
}
p.switch a:hover.powder3 {
background:url(../images/btn_switch.gif) no-repeat -156px -6px;
}
p.switch a:hover.powder2 {
background:url(../images/btn_switch.gif) no-repeat -282px -6px;
}
p.switch a:hover.powder1 {
background:url(../images/btn_switch.gif) no-repeat -532px -6px;
}
p.switch a:hover.crash {
background:url(../images/btn_switch.gif) no-repeat -658px -6px;
}

body#lineup div.left-side, body#lineup div.right-side {
	width: 442px;
}
body#lineup div.left-side p, body#lineup div.right-side p {
	width: 430px;
	padding-left: 0px;
}
body#lineup div.left-side div.left-inner,body#lineup div.right-side div.left-inner {
	width: 106px;
}
body#lineup div.left-side div.right-inner,body#lineup div.right-side div.right-inner {
	width: 335px;
}

/* 仕様アイコン */
body#lineup p.icon {
margin-bottom: 0px;
}
body#lineup p.icon img {
padding-right: 3px;
}
body#lineup table {
width: 898px;
border-top: 1px solid #969696;
border-left: 1px solid #969696;
}
/* 仕様テーブル */
body#lineup table th,body#lineup table td {
padding: 3px;
font-size: smaller;
border-bottom: 1px solid #969696;
border-right: 1px solid #969696;
}
body#lineup table th {
font-weight: normal;
text-align: left;
background: #EBEBEB;
white-space: nowrap;
}
body#lineup table thead td {
background: #E5F4E9;
}
/* 製品ブロック */
div#black201 {
display: none;
}
div#black202 {
display: none;
}
div#black203 {
display: none;
}
div#black204 {
display: none;
}
body#lineup div.left-side div.left-inner p,body#lineup div.right-side div.left-inner p {
width: 106px;
line-height: 15px;
padding-top:5px;
}
body#lineup div.left-side div.right-inner p,body#lineup div.right-side div.right-inner p {
width: 325px;
padding-right: 10px;
}

body#lineup div.left-side p.caution,body#lineup div.right-side p.caution {
width: 390px;
padding: 5px 0px 20px 0px;
}
p a.btn-black {
display: block;
float: left;
width: 52px;
height: 15px;
background: url(../images/btn_black.gif) no-repeat;
}
p a:hover.btn-black {
background: url(../images/btn_black-on.gif) no-repeat;
}
p a.btn-brown {
display: block;
float: right;
width: 52px;
height: 15px;
background: url(../images/btn_brown.gif) no-repeat;
}
p a:hover.btn-brown {
background: url(../images/btn_brown-on.gif) no-repeat;
}
p.closeup a {
display: block;
float: right;
width: 69px;
height:26px;
background: url(../images/btn_colseup.gif) no-repeat;
}
p.closeup a:hover {
background: url(../images/btn_colseup-on.gif) no-repeat;
}


/* 余白・マージン設定 */
.mtb10 {
	margin-top: 10px;
	margin-bottom: 10px;
}
.mt10 {
	margin-top: 10px;
}
.mt15 {
	margin-top: 15px;
}
.mt20 {
	margin-top: 20px;
}
.mb10 {
	margin-bottom: 10px;
}
.mb15 {
	margin-bottom: 15px;
}
.mb20 {
	margin-bottom: 20px;
}
.mb50 {
	margin-bottom: 50px;
}
.mb60 {
	margin-bottom: 60px;
}
.mb70 {
	margin-bottom: 70px;
}
.mb80 {
	margin-bottom: 80px;
}
.mt20 {
	margin-top: 20px;
}
.mt80 {
	margin-top: 80px;
}
.pr0 {
padding-right: 0px;
}
.pl0 {
	padding-left: 0px;
}
.pl10 {
padding-left: 10px;
}
.pl20 {
padding-left: 20px;
}
.pb20 {
padding-bottom: 20px;
}
.pb50 {
padding-bottom: 50px;
}
.pb60 {
padding-bottom: 60px;
}
.pb70 {
padding-bottom: 70px;
}
.pb80 {
padding-bottom: 80px;
}
.pb90 {
padding-bottom: 90px;
}
.pt20 {
padding-top: 20px;
}
.vb-txt {
font-size:xx-small;
line-height: 1em;
}
.small-txt {
	font-size: smaller;
}