@charset "UTF-8";
/*--------------------------------------------------------------
#category_title
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#category_title {
		background: url("image/title_ground.jpg") top center no-repeat;
		background-size: cover;
	}

}

/* Small than tablet */
@media (min-width: 768px) {
	

	
}


/* Larger than tablet */
@media (min-width: 992px) {

	#category_title {
		background: url("image/title_ground.jpg") top center no-repeat;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}

}


/*--------------------------------------------------------------
#history_area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#history_area {
		margin: 0;
		padding: 30px 0;
		background: url("../../../image/ground_2.png") top center no-repeat;
		-webkit-background-size: 110% auto;
		background-size: 110% auto;
		position: relative;
	}
	
	.tentomushi {
		margin: 0;
		padding: 0;
		position: absolute;
		top: 20px;
		left: 5%;
		width: 60px;
		height: auto;
		z-index: 1;
	}
	
	.risu {
		margin: 0;
		padding: 0;
		position: absolute;
		bottom: 0;
		right: 5%;
		width: 200px;
		height: auto;
		z-index: 1;
	}
	
	#history_area dl {
		width: auto;
		margin: 0 5%;
		padding: 35px 5%;
		background: #F4F7ED;
		border-radius: 20px;
		font-size: 14px;
		line-height: 1.5;
	}
	
	#history_area dt {
		width: 130px;
		margin: 0;
		padding: 5px 0;
		float: left;
		position: relative;
	}
	
	#history_area dt span{
		margin: 0;
		padding: 0;
		position: absolute;
		top: 50%;
		right: 30px;
		-webkit-transform: translate(0, -50%);
		transform: translate(0, -50%);
	}
	
	#history_area dd {
		margin: 0 0 0 110px;
		padding: 5px 0;
		border-left: 3px solid #C7EBC0;
	}

	#history_area dd p {
		margin: 0;
		padding: 0 0 0 20px;
	}
}

/* Small than tablet */
@media (min-width: 768px) {
	
	#history_area dl {
		width: auto;
		margin: 0 5%;
		padding: 35px 10%;
		background: #F4F7ED;
		border-radius: 20px;
		font-size: 16px;
		line-height: 1.5;
	}
	
	#history_area dt {
		width: 150px;
		margin: 0;
		padding: 5px 0;
		float: left;
		position: relative;
	}
	
	#history_area dt span{
		margin: 0;
		padding: 0;
		position: absolute;
		top: 50%;
		right: 30px;
		-webkit-transform: translate(0, -50%);
		transform: translate(0, -50%);
	}
	
	#history_area dd {
		margin: 0 0 0 150px;
		padding: 5px 0;
		border-left: 3px solid #C7EBC0;
	}

	#history_area dd p {
		margin: 0;
		padding: 0 30px;
	}
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	#history_area {
		margin: 0 0 30px 0;
		padding: 50px 0;
		background: url("../../../image/ground_2.png") top center no-repeat;
		-webkit-background-size: 1460px auto;
		background-size: 1460px auto;
	}
	
	#history_area dl {
		width: 950px;
		margin: 0 auto;
		padding: 35px 60px;
		background: #F4F7ED;
		border-radius: 20px;
		font-size: 16px;
		line-height: 1.5;
	}
	
	#history_area dt {
		width: 150px;
		margin: 0;
		padding: 5px 0;
		float: left;
		position: relative;
	}
	
	#history_area dt span{
		margin: 0;
		padding: 0;
		position: absolute;
		top: 50%;
		right: 30px;
		-webkit-transform: translate(0, -50%);
		transform: translate(0, -50%);
	}
	
	#history_area dd {
		margin: 0 0 0 150px;
		padding: 5px 0;
		border-left: 3px solid #C7EBC0;
	}

	#history_area dd p {
		margin: 0;
		padding: 0 30px;
	}
	
	.tentomushi {
		margin: 0;
		padding: 0;
		position: absolute;
		top: 40px;
		left: 10%;
		width: 110px;
		height: auto;
	}
	
	.risu {
		margin: 0;
		padding: 0;
		position: absolute;
		bottom: 0;
		right:10%;
		width: 200px;
		height: auto;
	}
}