@charset "utf-8";

/* ////////////////////////////////////////////////////////////
	File Name	about.css
*/

/*============================================================
	メイン
*/
.main {
	background-image: url(../images/about/main.jpg);
}

/*============================================================
	車のお悩みを解決するのが仕事です
*/
.about {
}

/*============================================================
	会社情報
*/
.company {
	padding: 60px 0;
	background-color: #f7f7f7;
}
.company .container {
	min-height: 500px;
}
.company .unit-head {
	padding: 0;
}
.company .unit-head .h {
	font-size: 35px;
}
.company .unit-head .h i {
	font-size: 32px;
}
.company .inner {
	position: relative;
	margin-top: 70px;
	font-size: 13px;
}
.company .inner h3 {
	margin-bottom: 5px;
	font-weight: bold;
	font-size: 14px;
}
.company .info {
	float: left;
	padding-left: 50px;
}
.company .map {
	position: absolute;
	top: -120px; right: 10px;
}
.company .area {
	position: absolute;
	top: 0; left: 474px;
	padding: 20px;
	background-color: #ffffff;
}
.company .area p {
	position: relative;
	padding-left: 15px;
}
.company .area p i {
	display: block;
	position: absolute;
	top: 50%; left: 0;
	margin-top: -5px;
	width: 10px; height: 10px;
}
.company .area p.color1 i {
	background-color: #f67f18;
}
.company .area p.color2 i {
	background-color: #91c30b;
}

/*============================================================
	アクセス
*/
.access {
	padding: 60px 0;
	background-color: #003399;
	text-align: center;
	color: #ffffff;
}
.access .h {
	font-weight: bold;
	font-size: 28px;
	line-height: 1.3;
}
.access .gmap {
	margin-top: 30px;
	width: 100%; height: 380px;
}
.access .gmap iframe {
	width: 100%; height: 100%;
}
.access address {
	margin-top: 30px;
	font-size: 16px;
	line-height: 1.5;
}

/* ////////////////////////////////////////////////////////////
	ブレイクポイント
*/
@media screen and (max-width: 680px) {

	/*============================================================
		会社情報
	*/
	.company {
		padding: 20px 0;
	}
	.company .container {
		min-height: 1px;
	}
	.company .unit-head .h {
		font-size: 18px;
	}
	.company .unit-head .h i {
		font-size: 16px;
	}
	.company .inner {
		margin-top: 0;
		font-size: 10px;
	}
	.company .inner h3 {
		margin-bottom: 5px;
		font-size: 12px;
	}
	.company .info {
		float: none;
		margin-top: 10px;
		padding-left: 0;
	}
	.company .map {
		position: static;
		width: 100%;
	}
	.company .map img {
		width: 100%;
	}
	.company .area {
		z-index: 10;
		top: 20px; left: 2%;
		padding: 10px;
	}
	.company .area p {
		padding-left: 12px;
	}
	.company .area p i {
		margin-top: -4px;
		width: 8px; height: 8px;
	}

	/*============================================================
		アクセス
	*/
	.access {
		padding: 20px 0;
	}
	.access .h {
		font-size: 16px;
		line-height: 1.3;
	}
	.access .gmap {
		margin-top: 10px;
		height: 200px;
	}
	.access address {
		margin-top: 10px;
		font-size: 10px;
		line-height: 1.5;
	}

}