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


/* ----- common ----- */

html body {
	margin: 0;
	padding: 0;
	color: #1e1e1e;
	background-color: #f5efd5;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 15px;
	line-height: 1.6;
}

body, h1, h2, h3, h4, h5, ul, li, dl, dt, dd, p {
	margin: 0;
	padding: 0;
}

img {
	border: 0;
}

ul, li {
	list-style: none;
}

a,
a:visited {
	color: #ee4717;
	text-decoration: none;
}
a:hover,
a:active {
	color: #ee4717;
	text-decoration: underline;
}

.hover {
  -webkit-transition: opacity 150ms;
  transition: opacity 150ms;
	-webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.hover:hover {
  opacity: 0.7;
}

.inner_box {
	width: 1010px;
	margin: 0 auto;
	overflow: hidden;
}


/* header */
#header {
	min-width: 1010px;
	height: 265px;
	background: url(../img/bg_header.png) 0 bottom no-repeat;
	animation-name: anime_bg_header;
  animation-duration: 100s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

@keyframes anime_bg_header {
0% {background-position: 0 bottom;}
100% {background-position: -1029px bottom;}
}

#header #header_navi {
	background-color: #f37606;
	text-align: center;
}

#header #header_navi li {
	display: inline-block;
}
#header #header_navi li:last-child {
	background-color: #ee4717;
}

#header #header_navi li img {
	vertical-align: bottom;
}

#header #header_navi_sp {
	display: none;
}

#header .inner_box {
	position: relative;
	overflow: hidden;
}

#header #left_box {
	position: relative;
	width: 540px;
	float: left;
}

#header #left_box h1 {
	width: 240px;
	padding: 25px 0 30px;
}

#header #left_box h1 img {
	display: block;
	width: 100%;
}

#header #navigator {
	position: absolute;
	top: 19px;
	left: 290px;
	overflow: hidden;
}

#header #navigator li {
	width: 102px;
	padding-right: 22px;
	float: left;
}

#header #navigator li img {
	width: 100%;
}


#header .banner_toyota {
	position: absolute;
	top: 25px;
	right: 0;
	width: 146px;
}

#header .banner_toyota img {
	width: 100%;
}

#header #right_box {
	padding-top: 100px;
	float: right;
}

#header #right_box #btn_social {
	text-align: right;
}

#header #right_box #btn_social li {
	vertical-align: top;
}

#header #right_box #btn_social #gigyaShare-reaction4 {
	width: 53px;
	line-height: normal !important;
}


/* contents */
#contents {
	min-width: 1010px;
	overflow: hidden;
}


/* footer */
#footer {
	position: relative;
	min-width: 1010px;
	margin-top: 10px;
	padding: 138px 0 50px 0;
	background: url(../img/bg_footer.png) repeat-x left top #44281a;
	animation-name: anime_bg_footer;
  animation-duration: 100s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
	color: #FFF;
}

@keyframes anime_bg_footer {
0% {background-position: 0 top;}
100% {background-position: -1029px top;}
}

#footer .btn_home {
	float: left;
}

#footer .copyright {
	position: absolute;
	top: 152px;
	left: 50%;
	margin-left: -160px;
	font-size: 10px;
}

#footer .logo {
	padding-top: 7px;
	float: right;
}


@media screen and (max-width:640px) {

	.inner_box {
		width: auto;
	}

	/* header */
	#header {
		min-width: 0;
		height: auto;
		background: url(../img/bg_header.png) left 0 bottom 187px no-repeat;
		animation-name: anime_bg_header_sp;
	  animation-duration: 100s;
	}

	@keyframes anime_bg_header_sp {
	0% {background-position: left 0 bottom 187px;}
	100% {background-position: left -1029px bottom 187px;}
	}

	#header #header_navi {
		display: none;
	}

	#header #header_navi_sp {
		margin: 0 4.7%;
		display: block;
		overflow: hidden;
	}

	#header #header_navi_sp li {
		width: 50%;
		margin-bottom: 14px;
		box-sizing: border-box;
		float: left;
	}
	#header #header_navi_sp li:nth-child(1) {
		padding-right: 2%;
	}
	#header #header_navi_sp li:nth-child(2) {
		padding-left: 2%;
	}
	#header #header_navi_sp li:nth-child(3) {
		width: 100%;
		background-color: #f37606;
	}

	#header #header_navi_sp li a {
		display: block;
		border: 1px solid #fff;
	}

	#header #header_navi_sp li img {
		display: block;
		margin: 0 auto;
	}

	#header .inner_box {
		position: relative;
		overflow: hidden;
	}

	#header #left_box {
		width: auto;
		padding-top: 128px;
		float: none;
	}

	#header #left_box h1 {
		width: 67.2%;
		margin: 0 auto;
		padding: 0;
	}

	#header #left_box h1 img {
		margin-left: -8px;
	}

	#header #navigator {
		top: 14px;
		left: 15px;
		overflow: hidden;
	}

	#header #navigator li {
		width: 70px;
		padding-right: 9px;
	}


	#header .banner_toyota {
		top: 14px;
		right: 15px;
		width: 110px;
	}

	#header #right_box {
		margin-top: 60px;
		padding-top: 23px;
		background-color: #00acae;
		float: none;
	}

	#header #right_box #btn_social {
		padding: 0 4.7% 10px;
		text-align: left;
	}


	/* contents */
	#contents {
		min-width: 0;
	}


	/* footer */
	#footer {
		min-width: 0;
		padding: 110px 4.7% 25px;
	}

	#footer .btn_home {
		float: left;
	}

	#footer .copyright {
		position: static;
		top: 0;
		left: 0;
		margin: 0;
		padding-top: 17px;
		font-size: 10px;
		text-align: center;
		clear: both;
	}

	#footer .logo {
		padding-top: 0px;
		float: right;
	}

	#commonFooter {
		display: none !important;
	}
	body {
		padding-bottom: 0 !important;
	}

}