@charset "utf-8";

/*-----------------------------------------------------
Main
-------------------------------------------------------*/
#Main {
	width: 980px;
	overflow: hidden;
	position: relative;
	margin: 0 auto;
}

/* h1
---------------------*/
#Main h1{
	margin: 0 0 43px;
	font-size: 26px;
}

/* h2
---------------------*/
#Main h2{
	font-size: 22px;
	margin: 0 0 25px;
}

/* h3, h4
---------------------*/
#Main h3,
#Main h4{
	font-size: 18px;
	margin: 0 0 25px;
}

@media screen and (max-width: 767px){
	#Main {
		width: auto;
	}

	/* h1
	---------------------*/
	#Main h1{
		margin: 0 20px 12px;
		font-size: 16px;
	}

	/* h2
	---------------------*/
	#Main h2{
		margin: 0 20px 15px;
		font-size: 14px;
	}

	/* h3, h4
	---------------------*/
	#Main h3,
	#Main h4{
		margin: 0 20px 20px;
		font-size: 13px;
	}
}


/*-------------------------------------
back
---------------------------------------*/
#Main p.back{
	margin: 62px 0 0;
}

@media screen and (max-width: 767px){
	#Main p.back{
		margin: 32px 0 0;
	}
}

/*-------------------------------------
download
---------------------------------------*/
#Main p.download{
	width: 240px;
	height: 48px;
	margin: 4px 0 118px;
	font-size: 14px;
}
#Main p.download a{
	width: 238px;
	height: 46px;
	display: block;
	position: relative;
	color: #fff;
	text-align: center;
	line-height: 46px;
	border: 1px solid #7f0600;
	background:#7f0600;
}
#Main p.download a:after{
	width: 13px;
	height: 13px;
	position: absolute;
	top:17px;
	right: 20px;
	background: url(../images/ico_download.png) no-repeat 0 0;
	content:'';
}

@media screen and (min-width: 768px){
	#Main p.download a,#Main p.download a:after{
		-webkit-transition:all 0.2s;transition:all 0.2s;
	}
	#Main p.download a:hover{
		color: #7f0600;
		background: none;
	}
	#Main p.download a:hover:after{
		background: url(../images/ico_download_on.png) no-repeat 0 0;
	}
}
@media screen and (max-width: 767px){
	#Main p.download{
		width:auto;
		height: 40px;
		margin: 33px 20px 43px;
		font-size: 12px;
	}
	#Main p.download a{
		width:100%;
		height: 40px;
		line-height: 40px;
		border: none;
	}
	#Main p.download a:after{
		width: 10px;
		height: 11px;
		position: absolute;
		top:15px;
		right: 10px;
		background: url(../images/ico_download_sp.png) no-repeat 0 0;
		background-size: 10px 11px;
	}
}


/*-------------------------------------
ir_graf
---------------------------------------*/
@media screen and (min-width: 768px){
	.situations{
		margin-bottom: 50px;
	}
	.situation_header{
	    display: inline-block;
	    width: 100%;
	    margin-bottom: 10px;
	}
	
	.ir_graf{
		width:100%;
		height: 30px;
	    margin-bottom: 30px;
	}	
}


@media screen and (max-width: 767px){
	.situations{
		margin: 0 20px 30px;
	}
	.situation_header{
	    display: inline-block;
	    width: 100%;
	    margin-bottom: 10px;
	}
	
	.ir_graf{
		width:100%;
		height: 30px;
	    margin-bottom: 30px;
	}	
}

.situation_header li{
	float: left;
	margin-right:20px;
}

.situation_block{
	height: 20px;
	width: 20px;
	display: inline-block;
	margin-right: 10px;
	margin-bottom: -5px;
}



.square1{
	background-color: #681b19;
}

.square2{
	background-color: #ac8181;
}

.square3{
	background-color: #cbc5c0;		

}

.square4{
	background-color: #e5e2e0;
}




.ir_graf li{
	float: left;
	height: 30px;
}


/* btn
---------------------*/
#Main section p.btn{
	width: 240px;
	height: 48px;
	margin: 32px 0 0;
}
#Main section p.btn a{
	width: 238px;
	height: 46px;
	display: block;
	color: #fff;
	line-height: 46px;
	text-align: center;
	border: 1px solid #7f0600;
	background: #7f0600;
	text-decoration: none;
}


@media screen and (max-width: 767px){
	#Main section p.btn{
		width: 100%;
		height: 40px;
		margin: 20px auto 0;
	}
	#Main section p.btn a{
		width: 100%;
		height: 40px;
		line-height: 40px;
		font-size: 12px;
	}
}
@media screen and (min-width: 768px){
	#Main section p.btn a{-webkit-transition:all 0.2s;transition:all 0.2s;}
	#Main section p.btn a:hover{
		color: #7f0600;
		background: none;
	}
}