@charset "utf-8";

.mgt10 { margin-top: 10px !important; }
.mgt20 { margin-top: 20px !important; }
.mgt30 { margin-top: 30px !important; }
.mgt40 { margin-top: 40px !important; }
.mgt50 { margin-top: 50px !important; }

.mgb10 { margin-bottom: 10px !important; }
.mgb20 { margin-bottom: 20px !important; }
.mgb30 { margin-bottom: 30px !important; }
.mgb40 { margin-bottom: 40px !important; }
.mgb50 { margin-bottom: 50px !important; }

.txtC { text-align: center !important; }
.txtR { text-align: right !important; }
.txtL { text-align: left !important; }




.quick {
	background: url(../../about/img/bg_border_stripe01.png);
	padding: 5px;
	box-sizing: border-box;
	margin: 50px auto;
}
	.quick > div {
		position: relative;
		background: #fff;
		padding: 15px;
	}
		.quick > div figure {
			position: absolute;
			right: 10px;
			top: -50px;
			width: 57%;
			max-width: 545px;
		}
			.quick > div figure img {
				width: 100%;
			}
		.quick > div h2 img {
			width: 40%;
			max-width: 383px;
		}
		.quick > div p {
			width: 40%;
			max-width: 383px;
			margin: 15px 0 0;
			line-height: 1.8;
			font-size: 106%;
			font-weight: bold;
		}
		.quick > div .rank {
			display: inline-block;
			width: 65%;
			max-width: 566px;
		}
			.quick > div .rank img {
				width: 100%;
			}
		.quick > div a {
			display: block;
			width: 30%;
			max-width: 268px;
			position: absolute;
			right: 15px;
			bottom: 15px;
		}
			.quick > div a img {
				width: 100%;
			}
@media screen and (max-width: 740px) {
	.quick {
		width: 96%;
		margin: 20px 2%;
	}
	.quick > div {
		padding: 10px;
	}
	.quick > div h2 {
		text-align: center;
	}
	.quick > div h2 img {
		width: 100%;
		max-width: 229px;
	}
	.quick > div p {
		text-align: center;
		width: 100%;
		max-width: inherit;
		margin: 10px 0 0;
		font-size: 9px;
	}
	.quick > div .rank {
		width: 100%;
		display: block;
		text-align: center;
	}
	.quick > div .rank img {
		max-width: 285px;
	}
}


@media screen and (max-width: 740px) {
	.spheadInfo {
		background: #EEEEEE;
		padding: 10px 0;
		margin: 0;
	}
	
	ul.info {
		width: 100%;
		overflow: hidden;
		margin: 20px 0;
	}
	ul.info li {
		width: 49%;
		float: left;
		text-align: center;
	}
	ul.info li:last-child {
		float: right;
	}
	ul.info li img {
		width: 100%;
		max-width: 145px;
	}
}