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

@media all and (-ms-high-contrast: none) {
	body {
		overflow-x: hidden;
	}
}

html {
	height: 100%;
	width: 100%;
	font-size: 62.5%;
}

body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	color: #434343;
	line-height: 175%;
	background-color: #f0f4f6;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

* html div#container {
	height: 100%;
}

body>#container {
	height: auto;
}

div#container {
	float: none;
	display: block;
	margin: 0 auto;
	padding: 0;
	position: relative;
	min-height: 100%;
	width: 100%;
}

div.contents,
footer .pref-job-links {
	margin: 0 auto;
	width: 1140px;
	position: relative;
}

header {
	display: inline-block;
	width: 100%;
	padding: 5px 0;
	background-color: #336699;
}

header h1 {
	float: left;
	font-size: 1.2rem;
	font-weight: normal;
}

header h1 a {
	text-decoration: none;
	color: #434343;
}

header h1 a img {
	display: block;
	vertical-align: bottom;
	width: 300px;
}

header .tel {
	float: right;
	margin-bottom: 10px;
	vertical-align: bottom;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

header .tel .number {
	font-size: 2.4rem;
	margin-left: 20px;
	line-height: 100%;
	color: #336699;
}

header .tel .number i {
	margin-right: 15px;
	vertical-align: middle;
	margin-top: -5px;
}

header ul.head_menu {
	margin-left: -20px;
	overflow: hidden;
	float: right;
	clear: right;
}

header ul.head_menu li {
	margin-left: 20px;
	float: left;
	font-size: 1.8rem;
}

header ul.head_menu li i {
	margin-right: 5px;
}

header ul.head_menu li i.fa-phone {
	transform: scale(-1, 1);
}

header ul.head_menu li a {
	text-decoration: none;
}

.top_main {
	padding: 0;
	background-color: #fff;
	position: relative;
}

.top_main .contents {
	font-family: 'Noto Serif JP', serif;
	position: static;
	display: flex;
}

.top_main {
	font-size: 1.8rem;
	line-height: 175%;
	position: relative;
	text-align: center;
}

.top_main .red {
	color: #ea7031;
}

.top_main h2 {
	font-size: 2.6rem;
	color: #336699;
	font-weight: 600;
	margin: 0 0 21px 0;
}

.top_main h2 br {
	display: none;
}

.top_main h2 .red {
	font-size: 3.2rem;
}

.top_main p {
	margin: 0;
}

h3.bar {
	background-color: #e3ecf3;
	height: 56px;
	font-size: 2.4rem;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #336699;
	position: relative;
}

h3.bar:before,
h3.bar:after {
	content: "";
	display: block;
	width: 1px;
	background-color: #fff;
	position: absolute;
	left: 50%;
	top: 1px;
	bottom: 1px;
}

h3.bar:before {
	transform: translateX(-570px);
}

h3.bar:after {
	transform: translateX(570px);
}

h3.bar a {
	text-decoration: none;
}

h3.bar.search a {
	display: block;
	width: 1140px;
	cursor: pointer;
	text-align: center;
	height: 56px;
	line-height: 56px;
}

h3.bar.search a i {
	font-size: 2.8rem;
	margin-right: 10px;
	vertical-align: middle;
	transition: all .3s;
}

h3.bar.search a.open i {
	transform: rotate(90deg);
}

div.sp_company_info {
	display: none;
}

.main {
	clear: both;
	/* margin-top: 15px; */
}

.main .contents {
	background-color: #fff;
	padding: 15px 25px;
}

footer {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	padding-top: 30px;
	width: 100%;
}

footer .pref-job-links {
	max-width: 1140px;
	margin: 0 auto;
	border-bottom: 2px solid #ccc;
}

footer .pref-job-links h2 {
	background-color: #336699;
	color: #fff;
	padding: 10px 20px;
	font-size: 2.0rem;
}

footer .pref-job-links .pref-job-body {
	padding: 20px 0;
}

footer .pref-job-links .pref-block {
	display: flex;
	font-size: 16px;
	margin-bottom: 5px;
}

footer .pref-job-links .pref-block a {
	display: inline-block;
	margin: 2px 4px;
}

footer .pref-job-links .pref-block .area {
	width: 10em;
	position: relative;
}

footer .pref-job-links .pref-block .area::after {
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 0 5px 5px;
	border-color: transparent transparent transparent #6699CC;
}

footer h4 {
	background-color: #336699;
	color: #fff;
	padding: 3px 15px;
}

footer ul.list_nav {
	font-size: 1.4rem;
	line-height: 175%;
	margin: 20px 0;
}

footer ul.list_nav a {
	display: flex;
	align-items: center;
}

footer ul.list_nav>li,
footer ul.list_nav>li>ul>li,
footer ul.list_nav>li>ul>li>ul {
	display: flex;
	align-items: flex-start;
}

footer ul.list_nav>li,
footer ul.list_nav>li>ul>li {
	justify-content: space-between;
}

footer ul.list_nav>li>ul {
	position: relative;
	width: calc(100% - 3em - 50px);
}

footer ul.list_nav>li>ul:before,
footer ul.list_nav>li>ul>li>ul:before {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 0 5px 8px;
	border-color: transparent transparent transparent #336699;
	position: absolute;
	right: calc(100% + 10px);
	top: calc(1.5em / 2);
	transform: translateY(-50%);
}

footer ul.list_nav>li>ul>li {
	flex-wrap: wrap;
}

footer ul.list_nav>li>ul>li>ul {
	position: relative;
	width: calc(100% - 5em - 50px);
	gap: 0 30px;

}

footer ul.nav {
	text-align: center;
	letter-spacing: -0.4em;
}

footer ul.nav li {
	margin: 0 5px;
	display: inline-block;
	letter-spacing: normal;
}

footer ul.nav {
	font-size: 1.2rem;
}

footer .copy {
	background-color: #336699;
	color: #fff;
	text-align: center;

	font-size: 1.4rem;
	padding: 2px 0;
}

li.nav-only-list {
	height: 56px;
}

.top-main {
	position: relative;
	width: 100%;
	overflow: hidden;
	max-width: 1140px;
	margin: 0 auto;
}

.top-image {
	width: 100%;
	height: auto;
	display: block;
	object-fit: contain;
}

/* オーバーレイ配置（テキスト・ボタン） */
.overlay-text,
.overlay-button {
	position: absolute;
	color: #ffffff;
	font-weight: 700;
	line-height: 1.3;
	max-width: 90%;
	letter-spacing: 0.05em;
}

.overlay-text {
	max-width: 600px;
	top: 10%;
	left: 10%;
	text-shadow: 0 3px 6px rgba(0, 0, 0, 0.6);
}

.overlay-button {
	top: 60%;
	left: 10%;
}

.overlay-button a {
	display: inline-block;
	background-color: #f97b1f;
	/* 鮮やかなオレンジに近い色 */
	color: #ffffff;
	padding: 24px 32px;
	font-size: 2.5rem;
	font-weight: bold;
	border-radius: 15px;
	/* 完全なカプセル型 */
	text-align: center;
	text-decoration: none;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
	/* しっかり目の影 */
}

.overlay-button a:hover {
	background-color: #fba65e;
	/* 薄くオレンジを和らげる */
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

.overlay-button a:active {
	background-color: #f97b1f;
	/* 押下時の色を維持 */
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
}

.overlay-button a:hover,
.overlay-button a:active {
	color: #ffffff;
	/* 明示的に白を保持 */
}

/* === ヘッダーメニュー === */
.head_menu {
	height: 50px;
}

.head_menu li {
	display: flex;
	align-items: center;
	height: 100%;
}

a.head_list {
	color: #ffffff;
	display: flex;
	align-items: center;
	text-decoration: none;
}

a.head_list:hover {
	color: #f0f4f6;
	text-decoration: none;
}

/* === メインビジュアル === */
.default-top img.top-image.top-image-sp {
	display: none;
}

.default-top .overlay-text {
	top: 2%;
}

.default-top .overlay-button {
	top: 65%;
}

.custom-consult-button {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 2.5rem;
}

.custom-consult-button .label-left {
	font-weight: bold;
	color: #ffffff;
	padding: 1px 6px;
	line-height: 1;
}

.custom-consult-button .free-label {
	font-weight: bold;
	color: #f97b1f;
	background-color: #ffffff;
	/* border: 1px solid #ffffff; */
	border-radius: 4px;
	padding: 1px 6px;
	line-height: 1;
}

/* === フォントサイズの柔軟化（clamp使用）=== */
.overlay-text {
	font-size: clamp(2.0rem, 6vw, 4.5rem);
}

.overlay-button a {
	font-size: clamp(1.6rem, 5vw, 2.5rem);
	padding: clamp(10px, 4vw, 24px) clamp(16px, 6vw, 32px);
}

/* === タブレット・SP向けの調整追加 === */
@media screen and (max-width: 1140px) {
	.default-top .overlay-text {
		font-size: clamp(2.0rem, 4vw, 4.5rem);
	}
}

/* @media screen and (max-width: 960px) { */
@media screen and (max-width: 960px) {
	.overlay-text {
		left: 5%;
	}

	.overlay-button {
		left: 5%;
		width: 90%;
	}

	.overlay-button a {
		font-size: clamp(1.6rem, 5vw, 2.5rem);
		padding: clamp(12px, 4vw, 20px) clamp(16px, 6vw, 28px);
	}

	.default-top {
		position: relative;
		aspect-ratio: 16 / 4.5;
	}

	.default-top .top-image {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.default-top .overlay-button {
		width: 70%;
	}

	.default-top .overlay-button a {
		font-size: clamp(1rem, 4vw, 2rem);
		padding: clamp(4px, 1.5vw, 18px) clamp(10px, 4vw, 26px);
	}
}
