@charset "utf-8";
/* 20240626 */
body#about{
	display: flex;
	flex-direction: column;
	align-items: center;
	}
/* --------------------------------------------- */
/* ------------------- main -------------------- */
/* --------------------------------------------- */
body#about main article{
	display: flex;
	justify-content: center;
	width: 100vw;
	position: relative;
}
body#about main article .inner_width{
	display: flex;
	flex-direction: column;
	margin: calc(10vw + 4em) auto calc(4vw + 4em);
	width: 80vw;
	max-width: 1200px;
	}
/*
	body#about main article:nth-last-of-type(2) .inner_width{
			margin-bottom: calc(10vw + 6em);
		}
*/

body#about main article#foreword{background-color: var(--color_l01);}
body#about main article#office_overview{background-color: var(--color_l01);}
body#about main article#illustration{background-color: var(--color_l02);}

/*==================================================
foreword
===================================*/
body#about main article#foreword .inner_width{
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 2em;
	}
body#about main article#foreword .inner_width h1{
	line-height: 1.6em;
	margin-bottom: 1em;
	}

/*==================================================
office_overview
===================================*/
body#about main article#office_overview .inner_width{
	margin-top: 0;
	}

/* ---------- 横長 ---------- */
@media (orientation: landscape){
	body#about main article#office_overview .inner_width br{display: none;}
	}

/*==================================================
2列テーブル　tbl_2col （親はadd_all）
===================================*/
body main article .inner_width .tbl_2col{
	margin-bottom: 1em;
	}
body main article .inner_width .tbl_2col div{
	border-bottom: 1px solid #999;
	}
	body main article .inner_width .tbl_2col div:first-of-type{
		border-top: 1px solid #999;
		}
body main article .inner_width .tbl_2col div h3{
	color:#666;
	font-size: 1em;
	min-width: 7em;
}

/*==================================================
wrapper
===================================*/
#wrapper{
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

#wrapper .wrapper__video{
  object-fit: cover;
  width: 100%;
  height: 100%;
}

/* --------------------------------------------- */
/* -------------------- 横長 -------------------- */
/* --------------------------------------------- */
/* 横長 */
@media (orientation: landscape){
body#about main article .inner_width{
	width: 86vw;
	max-width: 900px;
	}
	body#about main article:first-of-type .inner_width{
			margin-top: calc(4vw + 4em);
		}

}/* 横長 end */