/* ==========================================================================
/* -- 画面の横幅が768pxまで
 ========================================================================== */
@media only screen and (max-width: 812px) {
	/*-------------------------------------------------------------------------------------*/
	header {
		padding: 0px 0px 0px 0px;
		margin: -60px 0px 0px 0px;
		width: 100%;
	}
	.headervis_pc {
		display: none;
	}
	.headervis_sp {
		display: block;
		padding: 0px 0px 150px 0px;
		margin: 60px 0px 0px 0px;
	}
	.top_logo {
		padding: 0px 0px 0px 0px;
		margin: -0.0vh auto 0px;
		width: 75%;
	}
	.top_logo img {
		width: 100%;
	}
	.top_scroll {}
	.top_scroll p {
		padding: 0px 0px 0px 0px;
		margin: -180px 0px 0px 0px;
		font-size: 10px;
	}
	.top_scroll p a {
		display: block;
		padding: 0px 0px 0px 0.0vw;
		margin: 0px auto 0.0vw;
		width: 30%;
		text-align: center;
		font-size: 4.0vw;
		color: #FFFFFF;
		position: relative;
		z-index: 50;
	}
	.top_scroll p a span.arrow_name {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 1.5vw;
	}
	.top_scroll p a span.arrow {
		position: absolute;
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 3.5vw;
		/*  top: 0;
  left: 50%;*/
		width: 22px;
		height: 22px;
		border-left: 1px solid #FFFFFF;
		border-bottom: 1px solid #FFFFFF;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
		-webkit-animation: sdb 1.5s infinite;
		animation: sdb 1.5s infinite;
		box-sizing: border-box;
	}
	@-webkit-keyframes sdb {
		0% {
			-webkit-transform: rotate(-45deg) translate(0, 0);
			opacity: 0;
		}
		50% {
			opacity: 1;
		}
		100% {
			-webkit-transform: rotate(-45deg) translate(-20px, 20px);
			opacity: 0;
		}
	}
	@keyframes sdb {
		0% {
			transform: rotate(-45deg) translate(0, 0);
			opacity: 0;
		}
		50% {
			opacity: 1;
		}
		100% {
			transform: rotate(-45deg) translate(-20px, 20px);
			opacity: 0;
		}
	}
	/*-------------------------------------------------------------------------------------*/
	header .header_outwrap_pc {
		display: none;
		padding: 0px 0px 0px 0px;
		margin: -0.0vh 0px 0px 0px;
		width: 100%;
	}
	header .header_outwrap_pc :before {
		background-image: none;
	}
	header .header_wrap_pc {
		padding: 0.0vh 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		width: 100%;
		position: inherit;
	}
	header .header_outwrap_sp {
		display: block;
	}
	.menu_ci {
		display: none;
	}
	/*-------------------------------------------------------------------------------------*/
	.header_lof_sp {
		display: none;
	}
	/*-------------------------------------------------------------------------------------*/
	#about {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
	}
	.about {
		padding: 0.0vh 0px 0.0vh 0px;
		margin: 0px auto 0px;
		width: 86%;
	}
	.about h2 {
		padding: 10.0vh 0px 0.0vh 0px;
		margin: 0px 0px 0px 0px;
		text-align: center;
		color: #f39800;
		font-size: 8.0vw;
		letter-spacing: -0.05em;
	}
	.about p.read {
		padding: 0.0vh 0px 2.5vh 0px;
		margin: 10px 0px 0px 0px;
		text-align: center;
		color: #f39800;
		font-size: 3.0vw;
	}
	.about hr {
		padding: 0.0vh 0px 0.0vh 0px;
		margin: 0px auto 0px;
		border-top: 2px solid #f39800;
		width: 30px;
	}
	/*-----------------------------------*/
	.about_left {
		padding: 0px 0px 0px 0px;
		margin: 10.0vh 0px 0px 0px;
		width: 100%;
		float: inherit;
	}
	.about_left h3 {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		text-align: center;
		font-size: 6.0vw;
		line-height: 1.8em;
	}
	.about_left p.read01 {
		padding: 0px 0px 0px 0px;
		margin: 5.0vh 0px 0px 0px;
		text-align: left;
		font-size: 4.0vw;
		line-height: 1.8em;
		letter-spacing: -0.05em;
	}
	.about_right {
		padding: 0px 0px 0px 0px;
		margin: 10.0vh 0px 0px 0px;
		width: 100%;
		float: inherit;
	}
	.about_right p {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		width: 100%;
	}
	.about_right p img {
		width: 100%;
	}
	.about_btmlink {
		padding: 10.0vh 0px 10.0vh 0px;
		margin: 0px 0px 0px 0px;
	}
	.about_btmlink p a {
		padding: 20px 0px 20px 0px;
		margin: 0.0vh 0px 0px 0px;
		text-align: center;
		background-color: #f39800;
		width: 100%;
		display: block;
		color: #FFF;
		font-size: 4.5vw;
	}
	/*-------------------------------------------------------------------------------------*/
	#concept {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		background-color: #f5f1ef;
	}
	.concept {
		padding: 0.0vh 0px 0.0vh 0px;
		margin: 0px auto 0px;
		width: 100%;
		background-image: url("../img/top/concept_back_sp.jpg");
		background-repeat: no-repeat;
		background-position: center center;
		background-size: contain;
	}
	.concept h2 {
		padding: 10.0vh 0px 0.0vh 0px;
		margin: 0px 0px 0px 0px;
		text-align: center;
		color: #f39800;
		font-size: 8.0vw;
		letter-spacing: -0.05em;
	}
	.concept p.read {
		padding: 0.0vh 0px 2.5vh 0px;
		margin: 10px 0px 0px 0px;
		text-align: center;
		color: #f39800;
		font-size: 3.0vw;
	}
	.concept hr {
		padding: 0.0vh 0px 0.0vh 0px;
		margin: 0px auto 0px;
		border-top: 2px solid #f39800;
		width: 30px;
	}
	/*-----------------------------------*/
	.concept_pos01 {
		padding: 0px 0px 0px 0px;
		margin: 10.0vh auto 0px;
		width: 86%;
		float: inherit;
	}
	.concept_pos01 h3 {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		text-align: left;
		font-size: 6.0vw;
		line-height: 1.8em;
	}
	.concept_pos01 p.read01 {
		padding: 0px 0px 0px 0px;
		margin: 5.0vh 0px 0px 0px;
		text-align: left;
		font-size: 4.0vw;
		line-height: 1.8em;
		letter-spacing: -0.05em;
	}
	.concept_pos01 p.photo {
		padding: 0px 0px 0px 0px;
		margin: 4.0vh 0px 0px 0px;
		width: 100%;
	}
	.concept_pos01 p.photo img {
		width: 100%;
	}
	.concept_pos02 {
		padding: 0px 0px 0px 0px;
		margin: 10.0vh auto 0px;
		width: 86%;
		float: inherit;
	}
	.concept_pos02 p.balancesheet {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		width: 100%;
	}
	.concept_pos02 p.balancesheet img {
		width: 100%;
	}
	.concept_pos02 p.concept_catch {
		padding: 1.5vh 0px 1.5vh 0px;
		margin: 10.0vh auto 0px;
		text-align: center;
		font-size: 4.5vw;
		line-height: 1.8em;
		color: #f39800;
		border: #f39800 solid 1px;
		width: 100%;
		border-radius: 40px;
	}
	.concept_pos02 p.concept_catch span {
		background: linear-gradient(transparent 60%, #ffff00 0%);
	}
	.concept_btmlink {
		padding: 10.0vh 0px 10.0vh 0px;
		margin: 0px 0px 0px 0px;
	}
	.concept_btmlink p a {
		padding: 20px 0px 20px 0px;
		margin: 0.0vh auto 0px;
		text-align: center;
		background-color: #f39800;
		width: 86%;
		display: block;
		color: #FFF;
		font-size: 4.5vw;
	}
	/*-------------------------------------------------------------------------------------*/
	#recruit {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
	}
	.recruit_title {
		padding: 0.0vh 0px 0.0vh 0px;
		margin: 0px auto 0px;
		width: 86%;
	}
	.recruit_title h2 {
		padding: 10.0vh 0px 0.0vh 0px;
		margin: 0px 0px 0px 0px;
		text-align: center;
		color: #f39800;
		font-size: 8.0vw;
		letter-spacing: -0.05em;
	}
	.recruit_title p.read {
		padding: 0.0vh 0px 2.5vh 0px;
		margin: 10px 0px 0px 0px;
		text-align: center;
		color: #f39800;
		font-size: 3.0vw;
	}
	.recruit_title hr {
		padding: 0.0vh 0px 0.0vh 0px;
		margin: 0px auto 0px;
		border-top: 2px solid #f39800;
		width: 30px;
	}
	/*-------------------------------------------------------------------------------------*/
	#infor {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
	}
	.infor {
		padding: 0.0vh 0px 12.0vh 0px;
		margin: 0px auto 0px;
		width: 100%;
		background-image: url("../img/top/top_infor_back_sp.jpg");
		background-repeat: no-repeat;
		background-size: contain;
	}
	.infor h2 {
		padding: 5.0vh 0px 0.0vh 0px;
		margin: 0px 0px 0px 0px;
		text-align: center;
		color: #FFF;
		font-size: 8.0vw;
		letter-spacing: -0.05em;
	}
	.infor p.read {
		padding: 2.0vh 0px 2.5vh 0px;
		margin: -2px 0px 0px 0px;
		text-align: center;
		color: #FFF;
		font-size: 4.0vw;
		text-shadow: 0 0 25px #e27732, 0 0 20px #e27732, 0 0 0.40px #e27732;
	}
	.infor_btmlink {
/*		padding: 30.0vh 0px 10.0vh 0px;*/
		padding: 25.0vh 0px 10.0vh 0px;
		margin: 0px 0px 0px 0px;
	}
	.infor_btmlink p a {
		padding: 20px 0px 20px 0px;
		margin: 0.0vh auto 0px;
		text-align: center;
		background-color: #FFF;
		width: 86%;
		display: block;
		color: #f39800;
		font-size: 4.5vw;
		border: 1px solid #f39800;
	}
	@media screen and (orientation: landscape) {
		.infor {
			padding: 0.0vh 0px 0.0vh 0px;
			margin: 0px auto 0px;
			background-size: cover;
			padding-top: 44.218%;
		}
		.infor h2 {
			padding: 0.0vh 0px 0.0vh 0px;
			margin: -60.0vh 0px 0px 0px;
		}
		.infor_btmlink {
			padding: 0.0vh 0px 10.0vh 0px;
			margin: 80.0vh 0px 0px 0px;
		}
	}
	/*-------------------------------------------------------------------------------------*/
}