/* ========================================= */
/* 共通 */
/* ========================================= */

section {
	padding: 0 40px;
}

section:not(:last-child) {
	margin-bottom: 100px;
}

.midashi {
	width: 472px;
	height: 72px;
	justify-content: start;
	margin-bottom: 32px;
	border-radius: 37px;
	background: var(--white);
	& span {
		height: 64px;
		width: 64px;
		border-radius: 50%;
		background: var(--blue1);
		color: var(--white);
		font-family: var(--zenkaku);
		font-size: 40px;
		font-weight: 700;
		margin-left: 4px;
		margin-right: 36px;
		justify-content: center;
		outline: 2px solid var(--gray1);
		outline-offset: -1px;
	}
}

.wrapper .setsumei {
	background: var(--white);
	border-radius: 4px;
	box-shadow: var(--drop2);
	padding: 28px 66px;
	width: 70%;
	flex-flow: column;
	align-items: start;
}

.wrapper .setsumei .bg-gray {
	gap: 40px;
}

.wrapper .setsumei-img {
	height: 200px;
	flex-grow: 1;
}

@media screen and (max-width: 1100px) {
	section {
		padding: 0;
	}
	.midashi {
		width: 100%;
	}
	.midashi span {
		margin-right: 16px;
		font-size: 24px;
		height: 52px;
		width: 52px;
		justify-content: center;
		align-items: center;
	}
	& .wrapper .setsumei {
		width: 100%;
		padding: 20px;
	}
	& .wrapper .setsumei .bg-gray {
		flex-direction: column;
		gap: 4px;
	}
}


/* ========================================= */
/* 個別ご相談会について */
/* id="sec1" */
/* ========================================= */

#sec1 .wrapper .bg-gray {
	width: 100%;
	height: 66px;
	margin-top: 24px;
	justify-content: center;
	align-items: center;
	border-radius: 4px;
	background: var(--gray4);
}

#sec1 .wrapper .bg-white {
	background: var(--white);
	padding: 0 12px;
	font-size: 20px;
	font-weight: 500;
}

#sec1 .check {
	margin: 44px 64px 0 64px;
	& ul {
		flex-flow: column;
		align-items: stretch;
		gap: 24px;
	}
	& li {
		position: relative;
		padding: 12px;
		background: var(--gray4);
		border-radius: 50px;
	}
	& p {
		margin-left: 44px;
		margin-right: 32px;
		display: inline-block;
	}
	& p::before {
		position: absolute;
		font-family: 'Material Icons outlined';
		font-size: 28px;
		content: "\e86c";
		color: var(--blue1);
		left: 20px;
		top: 50%;
		transform: translateY(-50%);
	}
	& p a {
		color: var(--blue1);
		font-weight: 700;
	}
	& p a:hover {
		text-decoration: underline;
	}
	& p span {
		font-weight: 700;
	}
}

#sec1 .button {
	text-align: center;
	margin-top: 48px;
	& button {
		width: 432px;
		height: 56px;
		background: var(--blue1);
		border-radius: 4px;
	}
	& button a {
		width: 100%;
		height: 100%;
		color: var(--white);
		font-family: var(--zenkaku);
		font-weight: 500;
		font-size: 24px;
	}
	& button span {
		content: "";
		height: 11px;
		width: 30px;
		background: url(../img/common/button-line.svg) no-repeat;
		background-size: cover;
		letter-spacing: 0.05rem;
		margin-left: 12px;
		margin-bottom: -6px;
	}
	& .address {
		gap: 40px;
		margin-top: 16px;
	}
	& .address img {
		margin-right: 12px;
		margin-top: 8px;
	}
	& address {
		font-family: var(--zenkaku);
		font-weight: 500;
		font-size: 24px;
	}
}

#sec1 .blue-btn a:hover {
	letter-spacing: 0.15em;
	transition: all 0.5s;
	& span {
		margin-left: 18px;
		transition: all 0.5s;
	}
}

@media screen and (max-width: 1100px) {
	#sec1 > .wrapper {
		flex-direction: column-reverse;
		& img {
			height: 200px;
			margin-bottom: 36px;
			padding-left: 24px;
		}
		
	}
	#sec1 > .button {
		& button {
			height: 56px;
			width: 80%;
		}
		& button a {
			font-size: 20px;
		}
		& .address {
			flex-direction: column;
			gap: 0;
		}
	}
	#sec1 > .check {
		margin: 0;
		margin-top: 36px;
	}
}

/* ========================================= */
/* 事務所見学について */
/* id="sec2" */
/* ========================================= */

#sec2 .wrapper .bg-gray {
	width: 100%;
	height: 66px;
	justify-content: center;
	align-items: center;
	border-radius: 4px;
	background: var(--gray4);
	margin-top: 24px;
}

#sec2 .wrapper .bg-white {
	background: var(--white);
	padding: 0 12px;
	font-size: 20px;
	font-weight: 500;
}

#sec2 .tsc-jimusyo {
	background: var(--gray4);
	margin: 44px 64px 0 64px;
	padding: 38px 72px;
	border-radius: 4px;
}

#sec2 .tsc-jimusyo p.title {
	margin-bottom: 20px;
}

#sec2 .tsc-jimusyo p.text {
	word-break: keep-all;
	overflow-wrap: break-word;
}

@media screen and (max-width: 1100px) {
	#sec2 > .wrapper {
		flex-direction: column-reverse;
		& img {
			height: 160px;
			margin-bottom: 36px;
		}
	}
	#sec2 .tsc-jimusyo {
		width: 100%;
		margin: 0;
		margin-top: 44px;
		padding: 20px;
		text-align: center;
	}
}


/* ========================================= */
/* 応募の資格・条件 */
/* id="sec3" */
/* ========================================= */

#sec3 .content-wrapper {
	align-items: stretch;
	gap: 20px;
}

#sec3 .wrapper {
	background: var(--white);
	border-radius: 4px;
	width: 50%;
	box-shadow: var(--drop2);
	padding: 24px 36px;
}

#sec3 .wrapper div {
	height: 85%;
}

#sec3 p.title {
	margin-bottom: 12px;
	font-weight: 700;
	color: var(--blue1);
}

#sec3 ul {
	flex-flow: column;
	align-items: start;
	flex-grow: 1;
	margin-left: 28px;
}

#sec3 li {
	list-style: disc;
}

#sec3 .wrapper:last-child li:last-child {
	list-style: none;
}

@media screen and (max-width: 1100px) {
	#sec3 .content-wrapper {
		flex-direction: column;
	}
	#sec3 .wrapper {
		width: 100%;
		height: fit-content;
		padding: 20px;
		& p.title {
			text-align: center;
			margin-bottom: 20px;
		}
	}
}

/* ========================================= */
/* 募集エリア*/
/* id="sec4" */
/* ========================================= */

#sec4 .content-wrapper {
	gap: 60px;
}

#sec4 .wrapper {
	background: var(--white);
	border-radius: 10px;
	width: 70%;
	padding: 72px;
	box-shadow: var(--drop2);
}

#sec4 p {
	word-break: keep-all;
	overflow-wrap: break-word;
}

#sec4 p.title {
	font-weight: 700;
	color: var(--blue1);
	margin-bottom: 20px;
}

#sec4 .wrapper > div:first-child {
	margin-bottom: 40px;
}

@media screen and (max-width: 1100px) {
	#sec4 .content-wrapper {
		flex-direction: column-reverse;
		gap: 32px;
	}
	#sec4 .content-wrapper img {
		width: 160px;
		margin: 0 auto;
	}
	#sec4 .wrapper {
		width: 100%;
		text-align: center;
		padding: 40px;
	}
}