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

  colopla
	Copyright (c)COLOPL, Inc. All Rights Reserved.
	CreationDate: 2011-05
	
////////////////////////////////////////////////*/



/*////////////////////////////////////////////////

basic
	
////////////////////////////////////////////////*/
#head{
	width:100%;
	padding:5px 0;
	border-bottom:1px solid #ccc;
}

header{
	position:relative;
	width:920px;
	margin:0 auto;
}
.colopl{
	position:absolute;
	right:0;
}

#container{
	border-top:1px solid #fff;
	background:#EEEEEE;
}
#bodyLine{
	width:922px;
	margin:0 auto;
	border-left:1px solid #fff;
	border-right:1px solid #fff;
}
#contents{
	position:relative;
	width:920px;
	margin:0 auto;
	background:#fff;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
	font-size:14px;
	 line-height:1.3em
}
footer{
	text-align:center;
	font-size:11px;
	padding:0 0 15px 0;
}



/*////////////////////////////////////////////////

social
	
////////////////////////////////////////////////*/
#contents .sbmBtn{
	width:900px;
	margin:0 auto 35px;
	padding:10px 0 10px 0;
	border-top:1px solid #ccc;;
	border-bottom:1px solid #ccc;
}



/*////////////////////////////////////////////////

kirameki
	
////////////////////////////////////////////////*/
#top{
	width:900px;
	height:331px;
	margin:0 auto;
	background:url(../image/bg_top.jpg) no-repeat left top;
	position:relative;
}

#top .kiramekiLogo{position:absolute; top:0px; left:302px;}
#top .talk{position:absolute; top:39px; left:14px;}
#top .read{position:absolute; top:202px; left:14px;}

.join{
	width:900px;
	height:144px;
	margin:0 auto 20px;
	background:url(../image/bg_join.jpg) no-repeat left top;
	position:relative;
}
.titleJoin{position:absolute; top:15px; left:85px;}
.titleQr{position:absolute; top:26px; left:403px;}
.qr{position:absolute; top:29px; left:785px;}
.readJoin{position:absolute; top:58px; left:22px;}
.titleMail{position:absolute; top:109px; left:68px;}
.mail{position:absolute; top:107px; left:312px;}

#about{width:890px; margin:0 auto 20px;}
#camp{
	border:2px solid #F36;
	padding:10px;
	margin-bottom:20px;
	}
#camp h2{float:left; width:220px; margin-right:10px;}
#camp p{margin-bottom:5px;}
#camp em{color:#FF3366;}
.detailArea{float:left; width:620px;}
.detail h2{margin-bottom:10px;}
.detail p{float:left; width:270px;}
.detail figure{float:right; margin-bottom:15px;}
.detail div{float:left; width:200px;}
.detail div img{margin-bottom:8px;}
.subDetail{margin-right:10px;}
.detail div p{width:200px;}
.howto{
	float:right;
	width:249px;
	padding-bottom:10px;
	text-align:center;
	background:url(../image/bg_howto.jpg) repeat-y top left;
}
.howto li{list-style:none; margin-right:5px;}
.howto .arrow{height:251px; background:url(../image/arrow.jpg) no-repeat 108px bottom;}

#contents section,
#about,
.detail{
	overflow: hidden;
}
#contents section:after,
#about:after,
.detail:after{
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}
/*\*/
* html #contents section,
* html #about,
* html .detail{
    height: 1em;
    overflow: visible;
}
/**/
