@charset "UTF-8";

/* ----------------------------------------------------------------------------------------------------------- */
/* ティーディスペンサー ヴァリエ アバウトカテゴリトップ用スタイル */
/* ----------------------------------------------------------------------------------------------------------- */

/* ヘッダメニュー右端のズレを矯正 */
#varie_mainmenu ul.stop{left:1px!important;}

/* コンテンツラッパ */
#about_wrapper{
	position:relative;
	margin:-3px 0 0;
	height:930px;
	background:transparent url("../images/index/about_wrapper_bg.png") 0 350px repeat-x;
	z-index:0;
}
#about_wrapper img{display:block;}

/* ----------------------------------------------------------------------------------------------------------- */
/* メインコピー、製品写真、モデル */
/* ----------------------------------------------------------------------------------------------------------- */
#about_wrapper h2{
	position:absolute;
	left:407px;
	top:93px;
	margin:0;
	padding:0;
	border:none;
}
#main_logo{
	position:absolute;
	left:125px;
	top:-67px;
	z-index:2;
}
#main_varie{position:absolute;left:460px;top:439px;}
#main_model{position:absolute;left:353px;top:418px;z-index:2;}

/* ----------------------------------------------------------------------------------------------------------- */
/* 子要素 */
/* ----------------------------------------------------------------------------------------------------------- */
#about_wrapper div{
	position:absolute;
}
#about_wrapper div h3,
#about_wrapper div h4{
	position:absolute;
	z-index:2;
}
#about_wrapper div a{
	position:absolute;
	display:block;
	overflow:hidden;
	width:203px;
	height:37px;
	background-position:left bottom;
	z-index:2;
}
#about_wrapper div a img{
	/* ボタンロールオーバーのフェード効果はCSSのみで実装（IE9以下は単純切替） */
	opacity:1;
	-webkit-transition:opacity .2s ease-out;
	-moz-transition:opacity .2s ease-out;
	transition:opacity .2s ease-out;
}
#about_wrapper div a:hover img{opacity:0;}
#about_wrapper div .fig{position:absolute;}

#about01{left:0;top:0;}
#about01 h3{left:122px;top:137px;}
#about01 h4{left:28px;top:24px;}
#about01 a{left:30px;top:87px;background-image:url("../images/index/btn01.png");}
#about01 .fig{left:0;top:143px;}

#about02{right:0;top:0;}
#about02 h3{right:176px;top:162px;}
#about02 h4{right:17px;top:232px;}
#about02 .fig{right:0;top:0;}
#about02 a{right:107px;top:294px;background-image:url("../images/index/btn02.png");}

#about03{left:0;top:352px;}
#about03 h3{left:101px;top:214px;}
#about03 h4{left:107px;top:40px;}
#about03 .fig{left:0px;top:0px;}
#about03 a{left:108px;top:142px;background-image:url("../images/index/btn03.png");}

#about04{right:0;top:352px;}
#about04 h3{right:114px;top:21px;}
#about04 h4{right:47px;top:173px;}
#about04 .fig{right:0px;top:11px;}
#about04 a{right:107px;top:237px;background-image:url("../images/index/btn04.png");}

#about05{left:0;top:642px;}
#about05 h3{left:21px;top:225px;}
#about05 h4{left:18px;top:64px;}
#about05 .fig{left:0px;top:0px;}
#about05 a{left:19px;top:141px;background-image:url("../images/index/btn05.png");}

#about06{right:0;top:642px;}
#about06 h3{right:182px;top:15px;}
#about06 h4{right:126px;top:120px;}
#about06 .fig{right:0px;top:7px;}
#about06 a{right:78px;top:197px;background-image:url("../images/index/btn06.png");width:233px!important;}

/* ----------------------------------------------------------------------------------------------------------- */
/* キャプション */
/* ----------------------------------------------------------------------------------------------------------- */
#about_caption{
	color:#643;font-size:12px;line-height:150%;padding:1em;
}
