@charset "UTF-8";
/*
Theme Name: XeoryExtensionChild
Theme URI: https://xeory.jp/extension
Template: xeory_extension
Description: Xeory拡張子テーマ
Author: バズ部
Author URI: https://bazubu.com/
Version: 1.0.0
*/


.mouseover_scale {
	overflow:hidden;
}
.mouseover_scale img:hover{
transform:scale(1.3);
transition:0.3s;
}
/*************************/
/* home : 共通           */
/*************************/
.container_subcontaints {
	position: relative;
	width: 100%;
	font-size: 14px;
}
@media screen and (min-width: 768px){
	.container_subcontaints {
		display: grid;
		grid-template-columns: 1fr 1fr;
	padding-bottom: 80px;
	}
}
@media screen and (max-width: 768px){
	.container_subcontaints {
		display: block;
		margin-top: 40px;
		margin-bottom: 200px;
	}
}
.container_explain_parent {
	position: relative;
	text-align: left;
}
.containts_explain {
	position: relative;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-weight: normal;
	color: #000;
	text-shadow: 0 0 8px #fff;
	text-align: left;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
@media screen and (min-width: 768px){
	.containts_explain {
		width: 100%;
		font-size: 14px;
		line-height: 2.0;
	}
}
@media screen and (max-width: 768px){
	.containts_explain {		/* レスポンシブ */
		width: 100%;
		font-size: 14px;
		line-height: 1.5;
		padding-bottom: 10px;
	}
}
.TopBack01_container {
	display: flex;
	position: relative;
	width: 100%;
	min-height: 60px;
}
@media screen and (min-width: 768px){
	.TopBack01_container {
		margin-top: 100px;
	}
}
@media screen and (max-width: 768px){
	.TopBack01_container {		/* レスポンシブ */
		margin-top: 20px;
		min-height: 60px;
	}
}
.TopBack02_main {
	display: flex;
	position: relative;
}
@media screen and (min-width: 768px){
	.TopBack02_main {
		margin-left: 15%;
		margin-top: 24px;
		min-height: 160px;
		font-size: 14px;
		line-height: 4;
		margin-bottom: 30px;
		width: 80%;
	}
}
@media screen and (max-width: 768px){
	.TopBack02_main {
		margin-top: 0px;
		margin-left: 15%;
		min-height: 40px;
		font-size: 14px;
		width: 75%;
	}
}
.Privacy_main {
	display: flex;
	position: relative;
}
@media screen and (min-width: 768px){
	.Privacy_main {
		margin-left: 15%;
		margin-top: 24px;
		min-height: 160px;
		font-size: 14px;
		line-height: 4;
		margin-bottom: 30px;
		width: 75%;
	}
}
@media screen and (max-width: 768px){
	.Privacy_main {
		margin-top: 0px;
		margin-left: 15%;
		min-height: 40px;
		font-size: 14px;
		width: 75%;
	}
}


/*************************/
/* home : 企業理念       */
/*************************/
.containts_picture_left {
	position: relative;
	animation-name: ContentsImagePopup;
	pointer-events: none;
	max-width: 100%;         /* 親の幅まで拡大/縮小 */
	height: auto;            /* 比率維持 */
	object-fit: contain; 
}
@media screen and (min-width: 768px){
	.containts_picture_left {
		margin-left: 20%;
	}
}
@media screen and (max-width: 768px){
	.containts_picture_left {
		margin-left: 10%;
		margin-right: 10%;
		top: -30px;
	}
}
.container_explain_child_leftpic {
	position: relative;
	height: 100%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.container_explain_child_leftpic {
		margin-left: 20%;
		margin-right: 10%;
	}
}
@media screen and (max-width: 768px){
	.container_explain_child_leftpic {
		margin-left: 5%;
		margin-right: 5%;
	}
}
.containts_explain_child_leftpic {
	position: absolute;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-weight: bold;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */

	display:flex;
	flex-direction:column;
	justify-content:center;
}
@media screen and (min-width: 768px){
	.containts_explain_child_leftpic {
		width: 95%;
		font-size: 24px;
		height:100%;
	}
}
@media screen and (max-width: 768px){
	.containts_explain_child_leftpic {
		width: 90%;
		font-size: clamp(14px, 1.7vw, 30px);
	}
}
.containts_explain_child_leftpic p {
	0;
}
.containts_explain_child_rightpic p {
	0;
}
.containts_explain_title_leftpict {
}
@media screen and (min-width: 768px){
	.containts_explain_title_leftpict {
		top:0%;
		left: -5%;
	}
}
@media screen and (max-width: 768px){
	.containts_explain_title_leftpict {		/* レスポンシブ */
		top:340%;
		left: 5%;
	}
}
/*************************/
/* home : 労働者派遣     */
/*************************/
.containts_picture_right {
	position: relative;
	animation-name: ContentsImagePopup;
	pointer-events: none;
	height: auto;            /* 比率維持 */
	object-fit: contain; 
}
@media screen and (min-width: 768px){
	.containts_picture_right {
		max-width: 80%;         /* 親の幅まで拡大/縮小 */
		right: -100%;
		margin-right 20%;
	}
}
@media screen and (max-width: 768px){
	.containts_picture_right {
		margin-left: 10%;
		margin-right: 10%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		top: -30px;
	}
}
.container_explain_child_rightpic {
	position: relative;
	height: 100%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.container_explain_child_rightpic {
		margin-left: -75%;
		margin-right: 110%;
	}
}
@media screen and (max-width: 768px){
	.container_explain_child_rightpic {
		margin-left: 5%;
		margin-right: 5%;
	}
}
.containts_explain_child_rightpic {
	position: absolute;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-weight: bold;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */

	display:flex;
	flex-direction:column;
	justify-content:center;
}
@media screen and (min-width: 768px){
	.containts_explain_child_rightpic {
		width: 95%;
		font-size: 24px;
		height:100%;
	}
}
@media screen and (max-width: 768px){
	.containts_explain_child_rightpic {
		width: 90%;
		font-size: clamp(14px, 1.7vw, 30px);
	}
}
.containts_explain_child_rightpic p {
	0;
}
.containts_explain_title_rightpict {
}
@media screen and (min-width: 768px){
	.containts_explain_title_rightpict {
		top:0%;
		left: -5%;
	}
}
@media screen and (max-width: 768px){
	.containts_explain_title_rightpict {		/* レスポンシブ */
		top:340%;
		left: 5%;
	}
}








.footer_user_navi{
    padding: 0;
    justify-content: center;
    list-style: none;
	width: 100%;
	background-color: #555;
}
@media screen and (min-width: 768px){
	.footer_user_navi {
		display: flex;
	}
}
.footer_user_navi li{
//    width: 100%;
    box-sizing: border-box;
    margin: 0;
}
@media screen and (min-width: 768px){
	.footer_user_navi li {
		display: flex;
	}
}
.footer_user_navi li a{
    
    justify-content: center;
    align-items: center;
    text-align: center;
    padding-left: 10px;
    padding-right: 10px;
	text-decoration: none;
	color: #fff;
}
@media screen and (min-width: 768px){
	.footer_user_navi li a {
		display: flex;
	}
}
@media(max-width:768px){
    .footer_user_navi{
        /*追加*/flex-wrap: wrap;
		margin-top: 24px;
    }
    .footer_user_navi li{
        /*追加*/width: 100%;
		text-align:center;
    }
}
/* 左からスライドイン */
.slide-in-left {
  opacity: 0;
  transform: translateX(-100px);
  transition: opacity 1s ease-out, transform 1s ease-out;
}
.slide-in-left.show {
  opacity: 1;
  transform: translateX(0);
}

/* 右からスライドイン */
.slide-in-right {
  opacity: 0;
  transform: translateX(100px);
  transition: opacity 1s ease-out, transform 1s ease-out;
}

.slide-in-right.show {
  opacity: 1;
  transform: translateX(0);
}
.fadeIn-img {
  opacity: 0;
  animation: fadeIn 4s forwards;
}

@keyframes fadeIn {
  0% { 
    opacity: 0;
  }
  100% { 
    opacity: 1;
  }
}
}
/*********************************
 * 私たちのこと(横長)
*********************************/
.subtitle02_container {
	display: flex;
	position: relative;
	width: 100%;
//	height: calc(100vh - 400px);
	min-height: 100px;
//	margin-top: 30px;
}
@media screen and (min-width: 768px){
	.subtitle02_container {
		margin-top: 40px;
		margin-bottom: 0px;
		padding-bottom: 120px;
	}
}
@media screen and (max-width: 768px){
	.subtitle02_container {		/* レスポンシブ */
//		margin-top: 60px;
		min-height: 60px;
	}
}
.subtitle02_containts {
	position: absolute;
	left: 10%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: 24px;
	font-weight: bold;
	color: #000;
	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
@media screen and (min-width: 768px){
	.subtitle02_containts {
		top: 20%;
		padding-bottom: 60px;
	width: 80%;
	}
}
@media screen and (max-width: 768px){
	.subtitle02_containts {		/* レスポンシブ */
//		top: 150%;
	width: 80%;
	}
}
div.subtitle02_containts p {
	margin: -0.75em 0;
}
/*********************************
 * 1.企業理念(横長)
*********************************/
.table_string01_test {
	position: relative;
	margin-left: 10%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string01_test {
		padding-top: 80px;
		line-height: 2;
		width: 87.5%;
		left: -100%;
	}
}
@media screen and (max-width: 768px){
	.table_string01_test {
		padding-top: 50px;
		margin-left: 10%;
		margin-right: 10%;
	}
}
/************************
 * 2.労働者派遣(横長)
 ***********************/
.table02_container_test {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table02_container_test {
		display: grid;
//		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
		padding-bottom: 60px;
	}
}
@media screen and (max-width: 768px){
.table02_container_test {		/* レスポンシブ */
		padding-top: 20px;
		display: block;
		font-size: 14px;
		padding-bottom: 60px;
	}
}
.table02_title-pos_test {
}
@media screen and (min-width: 768px){
	.table02_title-pos_test {
		left: 10%;
		top:0%;
		width: 42.5%;
	}
}
@media screen and (max-width: 768px){
	.table02_title-pos_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 20%;
	}
}
.table02_picture_test {
	position: relative;
	margin-right: 10%;
	pointer-events: none;
}
@media screen and (min-width: 768px){
	.table02_picture_test {
		right: -100%;
		margin-right: 20%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		object-fit: contain;
	}
}
@media screen and (max-width: 768px){
	.table02_picture_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 10%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		top: -25px;
		object-fit: contain; 
	}
}
.table_string02_test {
	position: relative;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string02_test {
		padding-top: 40px;
		line-height: 3;
		width: 75%;
		left: -100%;
	margin-left: 20%;
	}
}
@media screen and (max-width: 768px){
	.table_string02_test {
		padding-top: 50px;
		margin-left: 10%;
		margin-right: 10%;
	}
}
/************************
 * 3.生産設計(横長)
 ***********************/
.table03_container_test {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table03_container_test {
		display: grid;
//		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
		padding-bottom: 60px;
	}
}
@media screen and (max-width: 768px){
.table03_container_test {		/* レスポンシブ */
		padding-top: 80px;
		display: block;
		font-size: 12px;
		background-color: #fff;
		padding-bottom: 60px;
	}
}
.table03_title-pos_test {
}
@media screen and (min-width: 768px){
	.table03_title-pos_test {
		left: 52.5%;
		top:0%;
		width: 42.5%;
	}
}
@media screen and (max-width: 768px){
	.table03_title-pos_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 20%;
	}
}
.table03_picture_test {
	position: relative;
	margin-right: 10%;
	pointer-events: none;
}
@media screen and (min-width: 768px){
	.table03_picture_test {
		left: 20%;
		margin-right: 20%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		object-fit: contain;
	}
}
@media screen and (max-width: 768px){
	.table03_picture_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 10%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		top: -15px;
		object-fit: contain; 
	}
}
.table_string03_test {
	position: relative;
	margin-left: 10%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string03_test {
		padding-top:40px;
		line-height: 3;
		width: 77.5%;
		left: -5%;
	}
}
@media screen and (max-width: 768px){
	.table_string03_test {
		padding-top: 50px;
		margin-left: 10%;
		margin-right: 10%;
	}
}
/************************
 * 4.製作図(横長)
 ***********************/
.table04_container_test {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table04_container_test {
		display: grid;
//		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
		padding-bottom: 60px;
	}
}
@media screen and (max-width: 768px){
.table04_container_test {		/* レスポンシブ */
		padding-top: 80px;
		display: block;
		font-size: 12px;
		padding-bottom: 60px;
	}
}
.table04_title-pos_test {
}
@media screen and (min-width: 768px){
	.table04_title-pos_test {
		left: 5%;
		top:0%;
		width: 42.5%;
	}
}
@media screen and (max-width: 768px){
	.table04_title-pos_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 20%;
	}
}
.table04_picture_test {
	position: relative;
	margin-right: 10%;
	pointer-events: none;
}
@media screen and (min-width: 768px){
	.table04_picture_test {
		right: -100%;
		margin-right: 10%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		object-fit: contain;
	}
}
@media screen and (max-width: 768px){
	.table04_picture_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 10%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		top: -15px;
		object-fit: contain; 
	}
}
.table_string04_test {
	position: relative;
	margin-left: 10%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string04_test {
		padding-top: 80px;
		line-height: 2;
		width: 87.5%;
		left: -100%;
	}
}
@media screen and (max-width: 768px){
	.table_string04_test {
		padding-top: 50px;
		margin-left: 10%;
		margin-right: 10%;
	}
}
/************************
 * 5.BIM事業(横長)
 ***********************/
.table05_container_test {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table05_container_test {
		display: grid;
//		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
		padding-bottom: 60px;
	}
}
@media screen and (max-width: 768px){
.table05_container_test {		/* レスポンシブ */
		padding-top: 80px;
		display: block;
		font-size: 12px;
		background-color: #fff;
		padding-bottom: 60px;
	}
}
.table05_title-pos_test {
}
@media screen and (min-width: 768px){
	.table05_title-pos_test {
		left: 52.5%;
		top:0%;
		width: 42.5%;
	}
}
@media screen and (max-width: 768px){
	.table05_title-pos_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 20%;
	}
}
.table05_picture_test {
	position: relative;
	margin-right: 10%;
	pointer-events: none;
}
@media screen and (min-width: 768px){
	.table05_picture_test {
		left: 10%;
		margin-right: 10%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		object-fit: contain;
	}
}
@media screen and (max-width: 768px){
	.table05_picture_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 10%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		top: -15px;
		object-fit: contain; 
	}
}
.table_string05_test {
	position: relative;
	margin-left: 10%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string05_test {
		padding-top: 80px;
		line-height: 2;
		width: 87.5%;
		left: -5%;
	}
}
@media screen and (max-width: 768px){
	.table_string05_test {
		padding-top: 50px;
		margin-left: 10%;
		margin-right: 10%;
	}
}
/************************
 * 6.一戸建て(横長)
 ***********************/
.table06_container_test {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table06_container_test {
		display: grid;
//		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
		padding-bottom: 60px;
	}
}
@media screen and (max-width: 768px){
.table06_container_test {		/* レスポンシブ */
		padding-top: 80px;
		display: block;
		font-size: 12px;
		padding-bottom: 60px;
	}
}
.table06_title-pos_test {
}
@media screen and (min-width: 768px){
	.table06_title-pos_test {
		left: 5%;
		top:0%;
		width: 42.5%;
	}
}
@media screen and (max-width: 768px){
	.table06_title-pos_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 20%;
	}
}
.table06_picture_test {
	position: relative;
	margin-right: 10%;
	pointer-events: none;
}
@media screen and (min-width: 768px){
	.table06_picture_test {
		right: -100%;
		margin-right: 10%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		object-fit: contain;
	}
}
@media screen and (max-width: 768px){
	.table06_picture_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 10%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		top: -15px;
		object-fit: contain; 
	}
}
.table_string06_test {
	position: relative;
	margin-left: 10%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string06_test {
		padding-top: 80px;
		line-height: 2;
		width: 87.5%;
		left: -100%;
	}
}
@media screen and (max-width: 768px){
	.table_string06_test {
		padding-top: 50px;
		margin-left: 10%;
		margin-right: 10%;
	}
}
/************************
 * 7.リフォーム(横長)
 ***********************/
.table07_container_test {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table07_container_test {
		display: grid;
//		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
//		padding-bottom: 60px;
	}
}
@media screen and (max-width: 768px){
.table07_container_test {		/* レスポンシブ */
		padding-top: 80px;
		display: block;
		font-size: 12px;
		background-color: #fff;
//		padding-bottom: 60px;
	}
}
.table07_title-pos_test {
}
@media screen and (min-width: 768px){
	.table07_title-pos_test {
		left: 52.5%;
		top:0%;
		width: 42.5%;
	}
}
@media screen and (max-width: 768px){
	.table07_title-pos_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 20%;
	}
}
.table07_picture_test {
	position: relative;
	margin-right: 10%;
	pointer-events: none;
}
@media screen and (min-width: 768px){
	.table07_picture_test {
		left: 10%;
		margin-right: 10%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		object-fit: contain;
	}
}
@media screen and (max-width: 768px){
	.table07_picture_test {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 10%;
		max-width: 100%;         /* 親の幅まで拡大/縮小 */
		height: auto;            /* 比率維持 */
		top: -15px;
		object-fit: contain; 
	}
}
.table_string07_test {
	position: relative;
	margin-left: 10%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string07_test {
		padding-top: 80px;
		line-height: 2;
		width: 87.5%;
		left: -5%;
	}
}
@media screen and (max-width: 768px){
	.table_string07_test {
		padding-top: 50px;
		margin-left: 10%;
		margin-right: 10%;
	}
}



.wpcf7 textarea { width: 100%!important; }
.wpcf7 text { width: 100%!important; }

/* ↓ base.cssを上書き */
hr {
	border-width: 1px 0 0 0;
	border-style: solid;
	border-color: #000;
}
body {
	background: transparent;
	background: #f4f4f4;
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 400;
  font-style: normal;
}
p,
pre {
	margin: 0;
}
#gnav ul li a {
  display: block;
  padding: 32px 12px;
  line-height: 28px;
  color: #fff;
  background: transparent;/* #47b39d;*/
  text-decoration: none;
  -webkit-transition: background 0.3s ease-in-out;
  transition: background 0.3s ease-in-out;
}
#gnav ul li a:hover {
  color: #fff;
  background: #bc5757;
}
p.sp-menu-title {
	color: #fff;
	font-size: 80%;
	padding-top: 5%;
}
/* ↑end */




.top_menu01 {
	position: absolute;
	top: 5%;
	left: 3%;
}
@media screen and (min-width: 768px){
	.top_menu01 {
		visibility:visible;
	}
}
@media screen and (max-width: 768px){
	.top_menu01 {		/* レスポンシブ */
		visibility:hidden;
	}
}
.top_menu02 {
	position: absolute;
	top: 5%;
	left: 20%;
}
@media screen and (min-width: 768px){
	.top_menu02 {
		visibility:visible;
	}
}
@media screen and (max-width: 768px){
	.top_menu02 {		/* レスポンシブ */
		visibility:hidden;
	}
}
.top_menu03 {
	position: absolute;
	top: 5%;
	left: 3%;
}
@media screen and (min-width: 768px){
	.top_menu03 {
		visibility:visible;
	}
}
@media screen and (max-width: 768px){
	.top_menu03 {		/* レスポンシブ */
		visibility:hidden;
	}
}

.TopStringFace {
	position: absolute;
}
@media screen and (min-width: 768px){
	.TopStringFace {
		top: 5%;
		right: 30%;
	}
}
@media screen and (max-width: 768px){
	.TopStringFace {
		top: 5%;
		right: 5%;
	}
}
.TopStringFace2 {
	text-shadow: 0 0 8px #000;
	position: absolute;
}
@media screen and (min-width: 768px){
	.TopStringFace2 {
		bottom: calc(5% + 87px);
		left: 5%;
		padding-bottom:0px;
		margin-bottom:0px;
		font-size: 24px;
	}
}
@media screen and (max-width: 768px){
	.TopStringFace2 {
		bottom: calc(3% + 87px);
		left: 5%;
		padding-bottom:0px;
		margin-bottom:0px;
		font-size: 18px;
	}
}

ul.Menu-first{
	text-align: left;
	text-decoration:none;
	text-shadow: 0 0 8px #000;
}
@media screen and (min-width: 768px){
	.top_menu03 {
		display: none;
		visibility:hidden;
	}
}
@media screen and (max-width: 768px){
	.top_menu03 {
		visibility:visible;
	}
}
ul.Menu-first a {
	color: #fff;
	text-shadow: 0 0 8px #000;
//	font-weight:bold;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
ul.Menu-title{
	position: absolute;
	font-size: clamp(18px, 3.0vw, 60px);
	font-weight:bold;
	color: #fff;
	text-shadow: 0 0 8px #000;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
@media screen and (max-width: 768px){
	.Menu-title {		/* レスポンシブ */
		right:20px;
	}
}
.Menu-bottom{
	position: absolute;
	font-size: 18px;
	white-space: nowrap;
	color: #fff;
	text-shadow: 0 0 8px #000;
//	font-weight:bold;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
@media screen and (min-width: 768px){
	.Menu-bottom {
		left:5%;
		bottom:100px;
	}
}
@media screen and (max-width: 768px){
	.Menu-bottom {		/* レスポンシブ */
		bottom: calc(5% + 87px);
		left:0px;
	}
}
#footer {
    color: #000;
    border-top: 0px solid #fff;
}
.footer-01 {
    background: #fff;
    padding: 0px 0;
	color: #000;
}
.footer-02 {
    background: #fff;
}
.footer-02 .footer-copy {
    text-align: center;
    font-size: 12px;
	color: #000;
}
#footer a {
    color: #000;
}
/* ↓ About us */
.AboutUs{
	display:table;
	border-collapse:collapse; /*隣接する要素のborderを共有*/
	width:100%; /*幅を100%に*/
	font-size: 14px;
	margin-right: 30%;
}
.AboutUs .row {
	display:table-row;
	vertical-align: middle;
	border-bottom: 1px solid #000000;
}
.AboutUs .cell {
	display:table-cell;
	border:#999999 0px solid; /*境界線を指定*/
	padding:10px; /*余白を指定*/
	text-align: left;
	vertical-align: left;
}
.AboutUs .cellTitle {
	display:table-cell;
	border:#999999 0px solid; /*境界線を指定*/
	padding:10px; /*余白を指定*/
	vertical-align: middle;
	text-align: left;
}
.AboutUs .cell2 {
	display:table-cell;
	border:0px; /*境界線を指定*/
	padding:10px; /*余白を指定*/
	vertical-align: middle;
}
.AboutUs .cellTitle2 {
	display:table-cell;
	border:0px; /*境界線を指定*/
	padding:10px; /*余白を指定*/
	vertical-align: middle;
	text-align: left;
}
h3{
    margin: 0 0 1.5em;
    padding: 0.8em;
    border-left: 7px solid #00005f;
    border-bottom: 1px dashed #00002A;
    font-size: 1.143em;
    font-weight: bold;
}
.AboutusBack {
  position: relative;
  width: 100%;
  min-height: 100vh;
  background: url("https://yukispace.com/harustudio/userimg/aboutus/aboutus.jpg")
    center / cover;
}
/**********/
/* ↓ TOP */
/**********/
/********************************/
/* 共通                         */
/********************************/
/* 見出しの大きい文字と小さい文字 */
.StringHarf {
	font-size: 75%;
	margin: -0.75em 0;
}
/* 説明文章 */
.table_title {
	position: absolute;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-weight: bold;
	color: #000;
//	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
@media screen and (min-width: 768px){
	.table_title {
		width: 90%;
		font-size: 18px;
	}
}
@media screen and (max-width: 768px){
	.table_title {		/* レスポンシブ */
		width: 90%;
		font-size: clamp(14px, 1.7vw, 30px);
	}
}
.table_title p {
//	margin: -0.75em 0;
}

/********************************/
/* 大見出し                     */
/********************************/
/* 私たちのこと */
.TopBack02_containts1 {
	position: absolute;
	left: 10%;
	width: 80%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: 24px;
	font-weight: bold;
	color: #000;
	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
@media screen and (min-width: 768px){
	.TopBack02_containts1 {
		top: 20%;
	}
}
@media screen and (max-width: 768px){
	.TopBack02_containts1 {		/* レスポンシブ */
//		top: 150%;
	}
}
div.TopBack02_containts1 p {
	margin: -0.75em 0;
}
.TopBack02_container {
	display: flex;
	position: relative;
	width: 100%;
//	height: calc(100vh - 400px);
	min-height: 100px;
//	margin-top: 30px;
}
@media screen and (min-width: 768px){
	.TopBack02_container {
		margin-top: 40px;
		margin-bottom: 0px;
	}
}
@media screen and (max-width: 768px){
	.TopBack02_container {		/* レスポンシブ */
		margin-top: 60px;
		min-height: 60px;
	}
}
.company_container_map {
	position: relative;
	width: 100%;
	min-height: 400px;
//	margin-top: 30px;
//	padding-bottom: 100px;
	font-size: 14px;
}
@media screen and (min-width: 768px){
	.company_container_map {
		display: grid;
		height: calc(100vh - 500px);
		grid-template-columns: 45% 55%;
	}
}
@media screen and (max-width: 768px){
	.company_container_map {		/* レスポンシブ */
		display: block;
		height:550px;
	}
}
.Company01_container {
	display: flex;
	position: relative;
	width: 100%;
//	min-height: 40px;
}
@media screen and (min-width: 768px){
	.Company01_container {
		margin-top: 40px;
		padding-bottom: 20px;
	}
}
@media screen and (max-width: 768px){
	.Company01_container {
		/* レスポンシブ */
		margin-top: 220px;
		min-height: 60px;
	}
}
.Company01_containts {
	display: flex;
	width:100%;
	justify-content: center;
}
@media screen and (min-width: 768px){
	.Company01_containts {
		margin-top: 40px;
	}
}
@media screen and (max-width: 768px){
	.Company01_containts {
	}
}
.Company02_containts {
	display: grid;
	grid-template-columns: 15% 85%;
	grid-template-rows: repeat(12, 4em);
	width: 90%;
}
@media screen and (min-width: 768px){
	.Company02_containts {
		margin-left:10%;
	font-size: 14px;
	}
}
@media screen and (max-width: 768px){
	.Company02_containts {
		margin-left:10%;
		grid-template-columns: 20% 60%;
		grid-row-gap: 18px;
		grid-column-gap: 18px;
	font-size: 12px;
	}
}
.TopBack02_containts1-2 {
	position: absolute;
	left: 5%;
	width: 90%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: 18px;
	font-weight: bold;
	color: #000;
	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
@media screen and (min-width: 768px){
	.TopBack02_containts1-2 {
		top: 20px;
	}
}
@media screen and (max-width: 768px){
	.TopBack02_containts1-2 {		/* レスポンシブ */
	}
}
div.TopBack02_containts1-2 p {
	margin: -0.75em 0;
}





/********************************/
/* 中見出し                     */
/********************************/
/* 企業理念 */
.table_container {
	position: relative;
	width: 100%;
	min-height: 400px;
//	margin-top: 30px;
//	padding-bottom: 100px;
	font-size: 14px;
}
@media screen and (min-width: 768px){
	.table_container {
		display: grid;
		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
	}
}
@media screen and (max-width: 768px){
	.table_container {		/* レスポンシブ */
		display: block;
		height:550px;
	}
}
/************************
 * OurService共通部
 ***********************/

/************************
 * 1.経営理念
 ***********************/
.table01_container {
	position: relative;
	width: 100%;
	min-height: 400px;
	font-size: 14px;
}
@media screen and (min-width: 768px){
	.table01_container {
		display: grid;
		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
	}
}
@media screen and (max-width: 768px){
	.table01_container {		/* レスポンシブ */
		display: block;
		height:550px;
		margin-top: 40px;
	}
}
.table01_title-pos {
}
@media screen and (min-width: 768px){
	.table01_title-pos {
		top:0%;
		left: -5%;
	}
}
@media screen and (max-width: 768px){
	.table01_title-pos {		/* レスポンシブ */
		top:340%;
		left: 5%;
	}
}
.table01_picture {
	position: relative;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	background: url("https://yukispace.com/harustudio/userimg/company/company.jpg")
	center / cover;
}
@media screen and (min-width: 768px){
	.table01_picture {
		margin-left: 30%;
	}
}
@media screen and (max-width: 768px){
	.table01_picture {		/* レスポンシブ */
		margin-left: 10%;
		margin-right: 10%;
		height: 350px;
		top: 180px;
	}
}


/************************
 * 2.労働者派遣
 ***********************/
.table02_container {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table02_container {
		display: grid;
		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
	min-height: 400px;
	}
}
@media screen and (max-width: 768px){
.table02_container {		/* レスポンシブ */
		padding-top: 20px;
		display: block;
		height:550px;
		font-size: 12px;
	}
}
.table02_title-pos {
	left: 5%;
}
@media screen and (min-width: 768px){
	.table02_title-pos {
		top:0%;
		width: 42.5%;
	}
}
@media screen and (max-width: 768px){
	.table02_title-pos {		/* レスポンシブ */
		margin-left: 0%;
		margin-right: 0%;
	}
}
.table02_picture {
	position: relative;
	margin-right: 10%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
}
@media screen and (min-width: 768px){
	.table02_picture {
		background: url("https://yukispace.com/harustudio/userimg/our/our.jpg")
		center / cover;
		margin-right: 10%;
	}
}
@media screen and (max-width: 768px){
	.table02_picture {		/* レスポンシブ */
		background: url("https://yukispace.com/harustudio/userimg/our/our.jpg")
		center / cover;
		margin-left: 5%;
		margin-right: 5%;
		height: 350px;
		top: -7.5em;
	}
}
.table_string02 {
	position: relative;
	margin-left: 10%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string02 {
		padding-top: 80px;
		line-height: 2;
		width: 87.5%;
	}
}
@media screen and (max-width: 768px){
	.table_string02 {
		padding-top: 50px;
		margin-left: 5%;
		margin-right: 5%;
		top: 30em;
	}
}
/************************
 * 3.生産計画
 ***********************/
.table03_container {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table03_container {
		display: grid;
		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
	min-height: 400px;
	}
}
@media screen and (max-width: 768px){
	.table03_container {		/* レスポンシブ */
		display: block;
		font-size: 12px;
		height:650px;
	}
}
.table03_title-pos {
}
@media screen and (min-width: 768px){
	.table03_title-pos {
		width: 42.5%;
	left: 52.5%;
	margin-right: 30%;
	}
}
@media screen and (max-width: 768px){
	.table03_title-pos {		/* レスポンシブ */
	top: 4em;
	left: 5%;
	margin-left: 0%;
	margin-right: 0%;
	}
}
.table03_picture {
	position: relative;
	margin-left: 10%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
}
@media screen and (min-width: 768px){
	.table03_picture {
		background: url("https://yukispace.com/harustudio/userimg/bim/bim.jpg")
		center / cover;
		margin-left: 10%;
	}
}
@media screen and (max-width: 768px){
	.table03_picture {		/* レスポンシブ */
		background: url("https://yukispace.com/harustudio/userimg/bim/bim.jpg")
		center / cover;
		margin-left: 5%;
		margin-right: 5%;
		height: 350px;
		top:9em;
	}
}
.table_string03 {
	position: relative;
	margin-left: 5%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string03 {
		width: 87.5%;
		padding-top: 80px;
		line-height: 2;
	}
}
@media screen and (max-width: 768px){
	.table_string03 {		/* レスポンシブ */
	top: 5em;
//	top:80px;
		margin-left: 5%;
		margin-right: 5%;
		padding-top: 4.2em;
	}
}
/************************
 * 4.製作図
 * drawing/drawing.jpg"
 ***********************/
.table04_container {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table04_container {
		display: grid;
		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
	min-height: 400px;
	}
}
@media screen and (max-width: 768px){
.table04_container {		/* レスポンシブ */
	padding-top: 20px;
		display: block;
		font-size: 12px;
		height:650px;
	}
}
.table04_title-pos {
	left: 5%;
}
@media screen and (min-width: 768px){
	.table04_title-pos {
		top:0%;
		width: 42.5%;
	top:0%;
	}
}
@media screen and (max-width: 768px){
	.table04_title-pos {		/* レスポンシブ */
	margin-left: 0%;
	margin-right: 0%;
		top: 2em;
	}
}
.table04_picture {
	position: relative;
	margin-right: 10%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
}
@media screen and (min-width: 768px){
	.table04_picture {
	background: url("https://yukispace.com/harustudio/userimg/drawing/drawing.jpg")
    center / cover;
	margin-right: 10%;
	}
}
@media screen and (max-width: 768px){
	.table04_picture {		/* レスポンシブ */
	background: url("https://yukispace.com/harustudio/userimg/drawing/drawing.jpg")
    center / cover;
	margin-left: 5%;
	margin-right: 5%;
	height: 350px;
	top:-10em;
	}
}
.table_string04 {
	position: relative;
	margin-left: 10%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string04 {
		padding-top: 80px;
		line-height: 2;
		width: 87.5%;
	}
}
@media screen and (max-width: 768px){
	.table_string04 {		/* レスポンシブ */
		padding-top: 50px;
		margin-left: 5%;
		margin-right: 5%;
		top: 31em;
	}
}
/************************
 * 5.BIM事業
 * production/production.jpg
 ***********************/
.table05_container {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table05_container {
		display: grid;
		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
	min-height: 400px;
	}
}
@media screen and (max-width: 768px){
	.table05_container {		/* レスポンシブ */
		display: block;
		font-size: 12px;
		height:650px;
	}
}
.table05_title-pos {
}
@media screen and (min-width: 768px){
	.table05_title-pos {
		width: 42.5%;
	top:0%;
	left: 52.5%;
	margin-right: 30%;
	}
}
@media screen and (max-width: 768px){
	.table05_title-pos {		/* レスポンシブ */
		top: 0em;
	left: 5%;
	}
}
.table05_picture {
	position: relative;
	margin-left: 10%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
}
@media screen and (min-width: 768px){
	.table05_picture {
		background: url("https://yukispace.com/harustudio/userimg/production/production.jpg")
		center / cover;
		margin-left: 10%;
	}
}
@media screen and (max-width: 768px){
	.table05_picture {		/* レスポンシブ */
		background: url("https://yukispace.com/harustudio/userimg/production/production.jpg")
		center / cover;
		margin-left: 5%;
		margin-right: 5%;
		height: 350px;
		top:5em;
	}
}
.table_string05 {
	position: relative;
	margin-left: 5%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string05 {
		width: 87.5%;
		padding-top: 80px;
		line-height: 2;
	}
}
@media screen and (max-width: 768px){
	.table_string05 {		/* レスポンシブ */
	top:6em;
		margin-left: 5%;
		margin-right: 5%;
	}
}
/************************
 * 6.木造一戸建て
 * apartment/apartment.jpg
 ***********************/
.table06_container {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table06_container {
		display: grid;
		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
	min-height: 400px;
	}
}
@media screen and (max-width: 768px){
.table06_container {		/* レスポンシブ */
		display: block;
		height:650px;
		font-size: 12px;
	}
}
.table06_title-pos {
	left: 5%;
}
@media screen and (min-width: 768px){
	.table06_title-pos {
		top:0%;
		width: 42.5%;
		top:0%;
	}
}
@media screen and (max-width: 768px){
	.table06_title-pos {		/* レスポンシブ */
	top: 0em;
	margin-left: 0%;
	margin-right: 0%;
	}
}
.table06_picture {
	position: relative;
	margin-right: 10%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
}
@media screen and (min-width: 768px){
	.table06_picture {
	background: url("https://yukispace.com/harustudio/userimg/apartment/apartment.jpg")
    center / cover;
	margin-right: 10%;
	}
}
@media screen and (max-width: 768px){
	.table06_picture {		/* レスポンシブ */
	background: url("https://yukispace.com/harustudio/userimg/apartment/apartment.jpg")
    center / cover;
	margin-left: 5%;
	margin-right: 5%;
	height: 350px;
	top: -13em;
	}
}
.table_string06 {
	position: relative;
	margin-left: 10%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string06 {
		padding-top: 80px;
		line-height: 2;
		width: 87.5%;
	}
}
@media screen and (max-width: 768px){
	.table_string06 {		/* レスポンシブ */
		padding-top: 110px;
		margin-left: 5%;
		margin-right: 5%;
		top: 28em;
	}
}
/************************
 * 7.マンションリフォーム
 * design/design.jpg
 ***********************/
.table07_container {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 768px){
	.table07_container {
		display: grid;
		height: calc(100vh - 500px);
		grid-template-columns: 1fr 1fr;
		margin-bottom: 100px;
		font-size: 14px;
	min-height: 400px;
	}
}
@media screen and (max-width: 768px){
	.table07_container {		/* レスポンシブ */
		display: block;
		height:650px;
		font-size: 12px;
	}
}
.table07_title-pos {
}
@media screen and (min-width: 768px){
	.table07_title-pos {
		width: 42.5%;
	top:0%;
	left: 52.5%;
	margin-right: 30%;
	}
}
@media screen and (max-width: 768px){
	.table07_title-pos {		/* レスポンシブ */
		top: 0em;
	left: 5%;
	}
}
.table07_picture {
	position: relative;
	margin-left: 10%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
}
@media screen and (min-width: 768px){
	.table07_picture {
		background: url("https://yukispace.com/harustudio/userimg/design/design.jpg")
		center / cover;
		margin-left: 10%;
	}
}
@media screen and (max-width: 768px){
	.table07_picture {		/* レスポンシブ */
		background: url("https://yukispace.com/harustudio/userimg/design/design.jpg")
		center / cover;
		margin-left: 5%;
		margin-right: 5%;
		height: 350px;
		top:6em;
	}
}
.table_string07 {
	position: relative;
	margin-left: 5%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string07 {
		width: 87.5%;
		padding-top: 80px;
		line-height: 2;
	}
}
@media screen and (max-width: 768px){
	.table_string07 {		/* レスポンシブ */
	top:9em;
		margin-left: 5%;
		margin-right: 5%;
	}
}

















.table_string {
	position: relative;
	margin-left: 10%;
	text-align: left;
}
@media screen and (min-width: 768px){
	.table_string {
	}
}
@media screen and (max-width: 768px){
	.table_string {		/* レスポンシブ */
	top:-330px;
		margin-left: 5%;
		margin-right: 5%;
	}
}









.table08_picture {
	margin-left: 20%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
}















.TopBack02_container2 {
	display: flex;
	position: relative;
	width: 100%;
	height: calc(100vh - 600px);
	min-height: 100px;
//	margin-top: 30px;
}
.TopBack02_containts2 {
	position: absolute;
	top:50%;
	left: 20%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: clamp(7px, 1.4vw, 25px);
	font-weight: normal;
	color: #000;
//	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 2.5;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}

@media screen and (min-width: 768px){
	.table01_title {
	top:0%;
	left: 55%;
	}
}
@media screen and (max-width: 768px){
	.table01_title {		/* レスポンシブ */
	top:50%;
	left: 0%;
	}
}


/* 地図 */
.question_container {
	width: 80%;
	min-height: 200px;
//	margin-top: 30px;
//	display: grid;
	justify-content: center;
//            flex-direction: column;
//	padding-top: 80px;
	margin-left: 10%;
	margin-bottom: 24px;
	font-size: 12px;
}
.recruit_container {
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
//	font-size: clamp(8px, 1.45vw, 32px);
	font-size: 12px;
	vertical-align: middle;
	text-align: left;
//	margin-right:10%;
}
@media screen and (min-width: 768px){
	.recruit_container {
	margin-right:0%;
	margin-left:15%;
	}
}
@media screen and (max-width: 768px){
	.recruit_container {		/* レスポンシブ */
	top:50%;
	margin-left:10%;
	margin-right:10%
	}
}


.question_conform_title {
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
//	font-size: clamp(10px, 1.7vw, 30px);
	font-weight: bold;
	color: #000;
	justify-content: center;
}
.question_conform_message {
	margin-top: 40px;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
//	font-size: clamp(10px, 1.7vw, 30px);
//	font-size: clamp(12px, 1vw, 24px);
	color: #000;
	justify-content: center;
}
.question_conform {
	margin-top: 40px;
	justify-content: center;
}
.question_string {
	text-align: left;
}
div.question_string p {
	margin: -0.75em 0;
}

.recruit_table a {
	text-decoration: none;
	color: #000;
}
.recruit_table .cell {
	display:table-cell;
	border:#999999 0px solid; /*境界線を指定*/
	padding:10px; /*余白を指定*/
	text-align: left;
	vertical-align: left;
}
.recruit_table .cellTitle {
	display:table-cell;
	border:#999999 0px solid; /*境界線を指定*/
	padding:10px; /*余白を指定*/
	vertical-align: middle;
	text-align: left;
}
.recruit_table{
	display:table;
	border-collapse:collapse; /*隣接する要素のborderを共有*/
}
@media screen and (min-width: 768px){
	.recruit_table {
	width:80%; /*幅を100%に*/
	font-size: 14px;
	padding-left: 10%;
	}
}
@media screen and (max-width: 768px){
	.recruit_table {		/* レスポンシブ */
	width:100%; /*幅を100%に*/
	font-size: 12px;
	padding-left: 0%;
	}
}
.recruit_row {
	display:table-row;
	vertical-align: middle;
	border-bottom: 1px solid #000000;
}
@media screen and (min-width: 768px){
	.recruit_row {
		border-spacing: 32px 32px;
	}
}
@media screen and (max-width: 768px){
	.recruit_row {		/* レスポンシブ */
		border-spacing: 0x;
	}
}
.recruit_row2 {
	display:table-row;
	vertical-align: middle;
	border-bottom: 1px solid #000000;
}
.recruit_row3 {
	display:table-row;
	vertical-align: middle;
    text-align: center;
	font-size: 24px;
}
.recruit_main {
	display: flex;
	position: relative;
	width: 80%;
//	height: calc(100vh - 400px);
}
@media screen and (min-width: 768px){
	.recruit_main {
		margin-left: 15%;
		margin-top: 0px;
		min-height: 160px;
		font-size: 14px;
		line-height: 2;
		margin-bottom: 30px;
	}
}
@media screen and (max-width: 768px){
	.recruit_main {		/* レスポンシブ */
		margin-top: 0px;
		margin-left: 10%;
		min-height: 40px;
		font-size: 14px;
	}
}



/* タイトル */






.TopBack08_containts1 {
	margin-right: 10%;
	background: url("https://yukispace.com/harustudio/userimg/design/design.jpg")
    center / cover;
}
.TopBack08_containts2 {
	vertical-align: middle;
	text-align: center;
}
div.TopBack08_containts2 p {
	margin: -0.75em 0;
}
.TopBack08_containts3 {
	position: absolute;
	top:20%;
	left: 5%;
	width: 40%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: clamp(10px, 2.0vw, 45px);
	font-weight: bold;
	color: #000;
	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
.TopBack08_containts4 {
	position: absolute;
	top:45%;
	left: 5%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: clamp(7px, 1.4vw, 25px);
	font-weight: normal;
	color: #000;
	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
.TopBack09_container {
	display: grid;
  grid-template-columns: 1fr 1fr;
	position: relative;
  width: 100%;
	height: calc(100vh - 500px);
	min-height: 300px;
	margin-top: 120px;
}
.TopBack09_containts1 {
	margin-left: 10%;
	background: url("https://yukispace.com/harustudio/userimg/apartment/apartment.jpg")
    center / cover;
}
.TopBack09_containts2 {
	vertical-align: middle;
	text-align: center;
}
div.TopBack09_containts2 p {
	margin: -0.75em 0;
}
.TopBack09_containts3 {
	position: absolute;
	top:10%;
	left: 55%;
	width: 40%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: clamp(10px, 2.0vw, 45px);
	font-weight: bold;
	color: #000;
	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
.TopBack09_containts4 {
	position: absolute;
	top:35%;
	left: 55%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: clamp(7px, 1.4vw, 25px);
	font-weight: normal;
	color: #000;
	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
.map {
  position: relative;
  padding-top: 56.25%;
}
@media screen and (min-width: 768px){
	.map {
  width: 100%;
	}
}
@media screen and (max-width: 768px){
	.map {		/* レスポンシブ */
  width: 85%;
	}
}




.map iframe {
  position: absolute;

	top: 0;
  left: 0;
  width: 80%;
  height: 80%;
}
.TopBack10_container {
	display: grid;
  grid-template-columns: 1fr 1fr;
	position: relative;
  width: 100%;
	height: calc(100vh - 500px);
	min-height: 300px;
	margin-top: 120px;
}
.TopBack10_containts5 {
	position: absolute;
	width: 90%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: clamp(8px, 1.45vw, 32px);
	font-weight: bold;
	color: #000;
	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
.TopBack10_containts1 {
	margin-left: 10%;
}
.TopBack10_containts2 {
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
//	font-size: clamp(8px, 1.45vw, 32px);
	font-size: 11px;
	vertical-align: middle;
	text-align: left;
}
@media screen and (min-width: 768px){
	.TopBack10_containts2 {
	margin-right:17.5%;
	margin-left:5%;
	}
}
@media screen and (max-width: 768px){
	.TopBack10_containts2 {		/* レスポンシブ */
	margin-right:7.5%;
	margin-left:10%;
	}
}.TopBack10_containts2-2 {
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: clamp(8px, 1.45vw, 32px);
	vertical-align: middle;
	text-align: left;
	margin-left:5%;
	margin-right:5%;
}
div.TopBack10_containts2 p {
	margin: -0.75em 0;
}
.TopBack10_containts3 {
	position: absolute;
	top:20%;
	left: 5%;
	width: 40%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: clamp(10px, 2.0vw, 45px);
	font-weight: bold;
	color: #000;
	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 2;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
.TopBack10_containts4 {
	position: absolute;
	top:45%;
	left: 5%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: clamp(7px, 1.5vw, 25px);
	font-weight: normal;
	color: #000;
	text-shadow: 0 0 8px #fff;
	text-align: left;
	line-height: 1.5;
	user-select: none;           /* 標準 */
    -webkit-user-select: none;   /* Safari / Chrome */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* 旧IE/Edge */
}
.BackPicture {
	position: relative;
	text-align: left;
}
.BackPictureBase {
	width: 100%;
	animation-name: ContentsImageFade;
	animation-duration: 5s;
}
.BackPictureOver {
	position: absolute;
	top:5%;
	left:5%;
/*	border: 1px solid;*/
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
}
.BackPictureOver2 {
	position: absolute;
	top:35%;
	left: 10%;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
	font-size: clamp(6px, 1.5vw, 30px);
	font-weight: bold;
	color: #ffffff;
	text-shadow: 0 0 8px #555;
	text-align: center;
	line-height: 2;
}
/* ↑ TOP */
/* ↓ 共通 */
.StrSpace15{
	letter-spacing: 2em;
	line-height: 2;
}
@keyframes ContentsImageFade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes ContentsImagePopup {
  0% {
    transform: translateY(40px) scale(0.8);
    opacity: 0;
  }
  100% {
    transform: translateY(0) scale(1.0);
  }
  80%, 100% {
    opacity: 1;
  }
}



.ScreenWideMax {
/*    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);*/
	background: url('http://yukispace.com/harustudio/wp-content/uploads/2026/04/company_top-1024.jpg');
	background-repeat: no-repeat;
    text-align:  center;
	display: flex;
/*	justify-content: center;*/
/*    padding-top: 30vh;*/
    min-height: 591px;
	background-size:contain;
/*	width: 100%;*/
	animation-name: ContentsImageFade;
	animation-duration: 2s;
	border: 2px solid;
	margin-bottom: calc((100vm - 591px) * -1);
}
@.ScreenWideMax img{
    display: block;
    height: auto;
    width: 100%;
}
.FadeCompanyName {
	height:2em;
	font-size:2rem;
	font-weight:bold;
}
.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}
.fadeInUp{
  /* ５秒かけてアニメーションする */
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  animation-delay: 0.5s;
}
.fadeInUp {
  animation-name: fadeInUp;
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 15%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInUp2{
  /* ５秒かけてアニメーションする */
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  animation-delay: 5s;
}
.fadeInUp2 {
  animation-name: fadeInUp2;
}
@keyframes fadeInUp2 {
  from {
    opacity: 0;
    transform: translate3d(0, 15%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.TopImageFade{
  /* ５秒かけてアニメーションする */
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  animation-delay: 5s;
}
.TopImageFade {
  animation-name: TopImageFade;
  background-image:url('https://yukispace.com/harustudio/wp-content/uploads/2026/03/company_top.jpg');
  background-size:cover;
}
 
@keyframes TopImageFade {
  from {
    transform: translate3d(0, 15%, 0);
    opacity: 0;
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.contents_img {
	display:  inline-block;                         /* インラインブロックにする */
}
/* ↑ 共通 */
/********************************
↓　single.php　↓
********************************/
/* 会社案内 */
.contents_container {
	background: url('https://yukispace.com/harustudio/wp-content/uploads/2026/03/company_top.jpg');
}
.contents_container_title {
	background: url('https://yukispace.com/harustudio/wp-content/uploads/2026/03/company_title.png');
	background-repeat: no-repeat;
}
/* よくある質問 */
.contents_container2 {
	background: url('https://yukispace.com/harustudio/wp-content/uploads/2026/03/question_top.jpg');
}
.contents_container2_title {
	background: url('https://yukispace.com/harustudio/wp-content/uploads/2026/03/question_title.png');
	background-repeat: no-repeat;
}
/* コンセプト */
.contents_container3 {
	background: url('https://yukispace.com/harustudio/wp-content/uploads/2026/03/concept_top.jpg');
}

.contents_container3_title {
	background: url('https://yukispace.com/harustudio/wp-content/uploads/2026/03/concept_title.png');
	background-repeat: no-repeat;
}
/* 求人・お問い合わせ */
.contents_container4 {
	background: url('https://yukispace.com/harustudio/wp-content/uploads/2026/03/inquiry_top.jpg');
}
.contents_container4_title {
	background: url('https://yukispace.com/harustudio/wp-content/uploads/2026/03/inquiry_title.png');
	background-repeat: no-repeat;
}
/* コンテナ共通 */
.contents_container_union {
	background-repeat: no-repeat;
    text-align:  center;
	display: flex;
/*	justify-content: center;*/
/*    padding-top: 30vh;*/
    min-height: calc(100vh - 300px);
	background-size:cover;
/*	width: 100%;*/
	animation-name: ContentsImageFade;
	animation-duration: 2s;
}
.contents_container_union2 {
	position:relative;
	top: 100px;
	left: 50px;
    height: 200px;
	width: 600px;
	animation-name: ContentsImagePopup;
	animation-duration: 2s;
}
/* 共通(スマホ) */
/*
@media screen and (max-width: 768px) {
    .contents_conainer {
    width: 100%;
    margin: 0 auto;
	background-size:100% 125px;
    padding-top: 0vh;
	min-height: 125px;
    }
}
*/
/********************************
↑　single.php　↑
********************************/
.contents_img{
	
}
.Menu_parent {
  max-width: 100%;
  border: 0pxc;
  padding: 10px;
  /* inline-block の親要素に text-align: center を設定 */
  text-align: right;
}
.Menu_child {
  /* インラインブロック */
  display: inline-block;
  background-color: #fff;
  color: #fff;
  padding: 10px;
  margin: 5px;
}

/********************************
↓　ContactForm7カスタマイズ　↓
********************************/
table.CF7_table{
	width:100%;
	margin:0 auto;
	border: 1px solid #e5e5e5;
//	font-size: clamp(9px, 1vw, 24px);
	font-size: 12px;
}

table.CF7_table tr{
	border-top: 1px solid #e5e5e5;
}

.single .entry-content table.CF7_table,
.page .entry-content table.CF7_table{
	display:table;
}

/*入力欄*/
.CF7_table input, .CF7_table textarea {
	border: 1px solid #d8d8d8;
}

.CF7_table ::placeholder {
	color:#797979;
}

/*「必須」文字*/
.CF7_req{
	font-size:.9em;
	padding: 5px;
	background: #f79034;/*オレンジ*/
	color: #fff;
	border-radius: 3px;
	margin-right:1em;
}

/*「任意」文字*/
.CF7_unreq{
	font-size:.9em;
	padding: 5px;
	background: #bdbdbd;/*グレー*/
	color: #fff;
	border-radius: 3px;
	margin-right:1em;
}

/* タイトル列 */
@media screen and (min-width: 768px){
	.CF7_table th{
	width:30%;/*横幅*/
	background-color:#ababab;/*ブルーグレー*/
	}
}

/* レスポンシブ */
@media screen and (max-width: 768px){
	table.CF7_table{
	width:95%;
	}
	.CF7_table tr, .CF7_table td, .CF7_table th{
	display: block;
	width: 100%;
	line-height:2.5em;
	}
	.CF7_table th{
	background-color:#ababab;
	}
}

/* 「送信する」ボタン */
.wpcf7 input.wpcf7-submit {
	background-color:#f79034;/* オレンジ*/
	border:0;
	color:#fff;
	font-size:1.2em;
	font-weight:bold;
	margin:0 auto;
}

.CF7_btn{
	text-align:center;
	margin-top:20px;
}

.wpcf7-spinner{
	width:0;
	margin:0;
}
/********************************
↓　ハンバーガーメニュー　↓
********************************/
/* ===============================================
ヘッダーのスタイリング
=============================================== */
.header {
  height: 80px;
  background-color: #003652;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}
.header__container {
  max-width: 1000px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: inherit;
  color: #fff;
  padding: 0 25px;
  margin-right: auto;
  margin-left: auto;
}
.header__logo a {
  text-decoration: none;
  font-size: 30px;
//  text-transform: uppercase;
  color: #fff;
  font-weight: bold;
}

/* ===============================================
ハンバーガーボタンのスタイリング
=============================================== */
input[type="checkbox"] {
  opacity: 0;
  visibility: hidden;
  position: absolute;
}
.hamburger {
  display: block;
  width: 50px;
  height: 80px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.hamburger span,
.hamburger span::before,
.hamburger span::after {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: 2px;
  background-color: #fff;
  transition: all 0.5s;
}
.hamburger span::before {
  top: -10px;
}
.hamburger span::after {
  bottom: -10px;
}
input[type="checkbox"]:checked + .hamburger span {
  background-color: transparent;
}
input[type="checkbox"]:checked + .hamburger span::before {
  top: 0;
  transform: rotate(45deg);
}
input[type="checkbox"]:checked + .hamburger span::after {
  bottom: 0;
  transform: rotate(-45deg);
}

/* ===============================================
メニューのスタイリング
=============================================== */
.nav {
  position: fixed;
  width: 100%;
  height: 254px;
  top: 80px;
  right: -120%;
  background-color: #0f5474;
  color: #fff;
  padding: 20n: all 0.5s;
}
.nav__item a {
  display: block;
  font-size: 14px;
  padding: 10px 0 10px 0;
  text-transform: uppercase;
  color: #fff;
}
.nav__item a:hover {
  color: #000;
  background-color: #fff;
	text-decoration:none;
}
.nav__item a:click {
	display:hidden;
}
input[type="checkbox"]:checked ~ .nav {
  right: 0;
}