@charset "utf-8";
/* reset
-------------------- */
html,body,img{
	margin:0;
	padding:0;
	border:none;
	outline:none;
}

html{
	color:#333631;
	font:12px/1.5 "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, Helvetica, Tahoma, sans-serif;
	position:relative;
}

body{font-size:100.01%;}

li{list-style:none;}

a,
a:hover{
	color:#88A2E2;
	text-decoration:none;
}

/* clearfix */
.clearfix:after{
	content:".";
	height:0;
	display:block;
	clear:both;
	visibility:hidden;
}

.clearfix{
	display:block;
	min-height:1%;
}

/* body
-------------------- */
body{
	background:url(../img/marna/top_wall.gif) repeat-x left top;}

#wrap{
	background:#FFF;
	width:980px;
	margin:0 auto;
	overflow:hidden;}

/* header
-------------------- */
#head{
	padding:7px 12px;
	*padding:8px 12px;
	overflow:hidden;}

#logo{
	float:left;
	position:relative;}

#logo img{
	position:relative;
	z-index:2;}

#logo p{
	margin-top:-2em;
	position:absolute;}

#logo a.home{
	background:transparent;
	width:105px;
	height:52px;
	border:dotted 1px transparent;
	border-color:#EEE;
	display:block;
	position:absolute;
	top:-6px;
	left:100px;
	z-index:3;}

#logo a.home:hover{
	border-color:#CCC;}

#logo a.home:active{
	background:#CCC;
	opacity:0.2;
	filter:alpha(opacity=20);
	-moz-opacity:0.2;}

#text{
	color:#CCC;
	position:relative;
	float:right;}

#title{
	background:#3A5AA7;
	height:55px;}

#title h1{
	margin-top:0;}

/* section
-------------------- */
#section{
	padding-left:22px;}

#section hr{
	background:url(../img/marna/hr_img.gif);
	width:376px;
	height:7px;
	margin:18px 0 28px;
	border:none;
	outline:none;}

img#item_img{
	padding-left:30px;
	display:block;
	position:absolute;
	top:56px;}

/* wrap2
-------------------- */
#wrap2{
	background:url(../img/marna/middle_wall.gif) repeat-x top;
	margin-top:232px;
	*margin-top:205px;
	position:relative;
	z-index:2;}

#section2{
	background:#FFF;
	width:980px;
	margin:0 auto;
	overflow:hidden;}

#section2 h2{
	margin-top:0;}

#item{
	padding-left:22px;
	overflow:hidden;}

#item li{
	width:214px;
	margin-left:27px;
	float:left;}

#item li:first-child{
	margin-left:0;}
	
#item li h3{
	width:214px;
	height:112px;
	overflow:hidden;
	position:relative;}

#item li h3 img{
	display:block;
	position:relative;}
	
#item li.kitc h3 img{top:-112px;}
#item li.clea h3 img{top:-224px;}
#item li.plus h3 img{top:-336px;}

#item li div{
	margin-bottom:2em;
	position:relative;}

#item li div strong{
	background:#88A2E2;
	padding:7px;
	display:block;
	color:#FFF;}

#item li div span.before,
#item li div span.after{
	width:0;
	height:0;
	border:10px solid transparent;
	position:absolute;}

#item li div span.before{
	*margin-top:-3px;
	border-width:3px;
	border-top-color:#777;
	border-left-width:15px;
	border-right-width:0;
	top:100%;
	z-index:2;}

#item li div span.after{
	*margin-top:-2px;
	border-width:10px;
	border-top-color:#88A2E2;
	border-left-width:15px;
	border-right-width:0;
	top:100%;}

/* btn
-------------------- */
#btn{
	width:397px;
	height:104px;
	margin:auto auto;
	overflow:hidden;
	*position:relative;}

#btn a{
	position:relative;}

#btn a img{
	position:absolute;}

#btn a:hover img{
	top:-104px;}

#btn a:active img{
	top:-208px;}

/* footer
-------------------- */
#footer{
	width:980px;
	margin:2em auto 1em;
	*padding:1em;
	text-align:center;}
	
#btn2{
	overflow:hidden;
	border-top:dotted 1px #CCC;
	border-bottom:dashed 1px #CCC;
	border-width:1px 0;}

#btn2 p{
	*padding:1em;
	color:#808080;}

#btn2 p a{
	margin-left:10px;}

#btn2 p a:hover{
	color:#3A5AA7;}