/* ---------------------------------------
message
--------------------------------------- */
.company_nav {
	margin-bottom: 30px;
}
.company_nav ul {
	width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; /* 両端寄せ ＋ 間隔を自動均等配置 */
}
.company_nav ul li {
	width: 24%;
	margin: 0px;
}
.company_nav ul li a {
	display: block;
	text-align: center;
	background-color: #eee;
	line-height: 100%;
	padding: 10px 0 13px;
}
.company_nav ul li a:hover {
	background-color: #008943;
	color: #fff;
	opacity: 1;
}
.company_nav > ul > li > ul {
  display: none;
  background-color: #004D26;
}
.company_nav > ul > li li {
	width: 100%;
	margin: 0;
}
.company_nav > ul > li li > a {
  display: block;
  width: 100%;
  padding: 10px 0 13px;
  border-bottom: 1px solid #ccc;
  background-color: #008943;
  color: #fff;
}
.mess1 {
	max-width: 650px;
	width: 100%;
	margin: 0px auto;
}
.mess1 dt {
	text-align: right;
	font-size: 130%;
}
.mess1 dt span {
	display: inline-block;
	font-size: 60%;
}
.mess1 dd {
	margin-bottom: 10px;
}
.mess2 {
	max-width: 800px;
	width: 100%;
	margin: 0px auto 40px;
}
.mess2 dt {
	font-size: 110%;
}
.mess2 dd {
	font-size: 90%;
	color: #008640;
}
.mess3 {
	width: 100%;
	margin: 0px auto 30px;
}
.mess3 dt {
	font-size: 140%;
	margin-bottom: 20px;
}
.mess3 dd {
}
.mess4 {
	overflow: hidden;
	max-width: 800px;
	width: 100%;
	margin: 0px auto;
}
.mess4 li {
	float: left;
	width: 48%;
	margin-right: 4%;
	margin-bottom: 30px;
}
.mess4 li:nth-child(2n) {
	margin-right:0;
}
.mess4 li span {
	display: block;
	font-size: 100%;
	line-height: 150%;
	padding-top: 10px;
}
.mess4 li span strong {
	display: block;
	transform: rotate(0.01deg);
	font-weight: 600;
	margin-bottom: 5px;
	letter-spacing: 2px;
	font-size: 80%;
}
/* ---------------------------------------
outline
--------------------------------------- */
.outline {
	overflow: hidden;
	width: 100%;
	margin: 0px auto;
	border-top: #ddd 1px solid;
	border-left: #ddd 1px solid;
}
.outline dl {
	display: table;
	width: 100%;
}
.outline dt {
	display: table-cell;
	vertical-align: top;
	text-align: left;
	border-right: #ddd 1px solid;
	border-bottom: #ddd 1px solid;
	background-color: #f3f3f3;
	padding: 15px;
	width: 200px;
}
.outline dd {
	display: table-cell;
	vertical-align: top;
	text-align: left;
	border-right: #ddd 1px solid;
	border-bottom: #ddd 1px solid;
	padding: 15px;
}
.outline dd a.map {
	display: inline-block;
	background-color: #008943;
	color: #fff;
	line-height: 100%;
	font-size: 80%;
	margin-left: 5px;
	padding: 5px 15px;
	border-radius:50px;
}
/* ---------------------------------------
history
--------------------------------------- */

/* ---------------------------------------
office
--------------------------------------- */
.office {
	margin: 0px auto;
}
.g_map {
	width: 100%;
	overflow: hidden;
	height: 300px;
	margin-bottom: 30px;
}
.g_map iframe {
	width: 100%;
	height: 600px;
	margin-top: -150px;
}
.office1,
.office2 {
	overflow: hidden;
	padding-bottom: 30px;
	border-bottom: #ccc 1px dashed;
	margin-bottom: 50px;
}
.office1 .ph {
	margin: 0;
	float: right;
	width: 45%;
}
.office2 .ph {
	margin: 0;
	float: left;
	width: 45%;
}
.office1 dl {
	width: 50%;
}
.office2 dl {
	margin-left: 50%;
}
.office1 dt,
.office2 dt {
	font-size: 90%;
	line-height: 150%;
	margin-bottom: 30px;
}
.office1 dt span,
.office2 dt span {
	display: block;
	font-size: 130%;
	font-weight: 600;
}
.office1 dd,
.office2 dd {
	font-size: 90%;
}
.office3 {
	padding-bottom: 30px;
	border-bottom: #ccc 1px dashed;
	margin-bottom: 30px;
}




/* オフィス紹介全体のコンテナ */
.office-section {
	padding-bottom: 40px;
	background: #fff;
	border-bottom: 1px solid #ddd;
	margin-bottom: 30px;
}

/* 上部テキスト部分 */
.office-info {
  margin-bottom: 20px;
}

.office-title {
  font-size: 1.2rem;
  font-weight: bold;
  margin-bottom: 10px;
}

.office-address {
  margin: 0;
  line-height: 1.6;
}

/* 下部メディア（写真とマップ）の横並びエリア */
.office-media {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.office-media-item {
  flex: 1;
  min-width: 280px;
}

/* PC時の写真およびマップ共通の高さ */
.office-media-item img,
.office-media-item iframe {
  width: 100%;
  height: 350px;
  border-radius: 6px;
  display: block;
}

.office-media-item img {
  object-fit: cover;
}

/* ▼ スマホ表示のとき（画面幅が768px以下の場合）の調整 */
@media screen and (max-width: 768px) {
  .office-section {
    margin-bottom: 20px;
  }


  /* スマホではマップの高さを少し低くして長大感を防ぐ */
  .office-media-item iframe {
    height: 200px; 
  }
}

@media screen and (max-width: 768px) {
	.company_nav {
		display: none;
	}
	/* ---------------------------------------
	message
	--------------------------------------- */
	.company_nav {
		top: 50px;
		position: relative;
	}
	.toggle {
		background: url(../images/common/menu2.png) no-repeat center center;
	}
	nav.company_nav{margin-top: 50px;}
	nav.company_nav > ul {
	  width: 100%;
	  margin: 0 auto;
	  font-size: 0;
	}
	nav.company_nav > ul > li {
	  display: inline-block;
	  float: none;
	  width: 100%;
	  margin: 0;
	  width: calc(100% / 1);
	  font-size: 1rem;
	  vertical-align: top;
	  border-bottom: 1px solid #ccc;
	}
	nav.company_nav > ul > li > a {
	  border: none;
	  border-left: 1px solid #ccc;
	}
	nav.company_nav > ul > li:first-child > a {
	  border-top: none;
	  border-left: none;
	}
	.mess3 dt {
		font-size: 120%;
		margin-bottom: 20px;
		font-weight: 600;
	}
	.mess3 dt br {
		display: none;
	}
	.mess4 li span {
		font-size: 90%;
		line-height: 170%;
	}
	.mess4 li span br {
		display: none;
	}
	.mess4 li span strong {
		font-size: 90%;
	}
	/* ---------------------------------------
	outline
	--------------------------------------- */
	.outline dl,
	.outline dt,
	.outline dd {
		display: block;
	}
	.outline dl {
	}
	.outline dt {
		width: 100%;
		padding: 4px 10px 5px;
		font-size: 90%;
	}
	.outline dd {
	}
	/* ---------------------------------------
	history
	--------------------------------------- */

	/* ---------------------------------------
	office
	--------------------------------------- */
	.office {
		width: 100%;
		margin: 0px auto;
	}
	.office1 .ph,
	.office2 .ph {
		margin: 0;
		float: right;
		width: 35%;
		margin-left: 15px;
		margin-bottom: 10px;
	}
	.office1 dl,
	.office2 dl {
		margin: 0;
		width: 100%;
	}

		/* ---------------------------------------
	message
	--------------------------------------- */
	.toggle {
		background: url(../images/common/menu2.png) no-repeat center center;
	}
	nav.company_nav{margin-top: 50px;}
	nav.company_nav > ul {
	  width: 100%;
	  margin: 0 auto;
	  font-size: 0;
	}
	nav.company_nav > ul > li {
	  display: inline-block;
	  float: none;
	  width: 100%;
	  margin: 0;
	  width: calc(100% / 1);
	  font-size: 1rem;
	  vertical-align: top;
	  border-bottom: 1px solid #ccc;
	}
	nav.company_nav > ul > li > a {
	  border: none;
	  border-left: 1px solid #ccc;
	}
	nav.company_nav > ul > li:first-child > a {
	  border-top: none;
	  border-left: none;
	}
	.mess3 dt {
		font-size: 120%;
		margin-bottom: 20px;
		font-weight: 600;
	}
	.mess3 dt br {
		display: none;
	}
	.mess4 li span {
		font-size: 90%;
		line-height: 170%;
	}
	.mess4 li span br {
		display: none;
	}
	.mess4 li span strong {
		font-size: 90%;
	}

}