@charset "UTF-8";
/* CSS Document */


.clearfix:after {
  content: "";
  clear: both;
  display: block;
}




#wrapper {
	width: 940px;
	margin: 30px auto;
	background: #fff;
	margin-bottom: 100px;
	font: #501717;
}
#topcomment{
	width: 560px;
	float: right;
	margin-top: 20px;
	margin-bottom: 100px;
}
.box {
	width: 280px;
	float: left;
	margin-left: 25px;
}
.box:nth-child(3n) {
	margin-right: 25px;
}
p.img {
	text-align: center;
}
.box01 {
	border-bottom: 1px #999 solid;
	margin-bottom: 30px;
}
.box02 {
	border-top: 1px #999 solid;
	margin-top: 0px;
}
h2{
	background-color: #501717;
	background: linear-gradient(-90deg, #501717, #fff);
	color: #fff;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-size: 24px;
	margin-top: 41px;
}
h3{
	clear: right;
	text-align: center;
	font-size: 30px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif
}
.box01 dl{
	margin:20px 30px 0 30px;
}
.box01 dl dd{
	margin-top: 10px;
	margin-bottom: 80px;
}
.box02 dl{
	margin:80px 30px 0 30px;
}
.box02 dl dd{
	margin-top: 10px;
	margin-bottom: 15px;
}
#contents{
	position:relative;
}
#beansimage{
	position:absolute;
	top:0px;
	left:0px;
}
@media screen and (max-width: 767px) {
#beansimage {
	display: none;
}
h3{
	line-height:120%;
	text-align:left;
	padding:0 10px;
}
#wrapper{
	width:100%;
}
	#topcomment{
		width:100%;
			margin:20px auto;
	
}
.box:nth-child(3n) {
	margin:10px auto;
}
.box01,.box02{
	border: none;
	margin-bottom: 0px;
}
.box{
	border-bottom:1px #999 solid;
	float:none;
	margin:10px auto;
}
.img{
	margin-bottom:20px;
}
.box01 dl, .box01 dl dd, .box02 dl, .box02 dl dd{
	margin:10px 0;
}
}