@charset "UTF-8";

/* !ページタイトル -------------------------------------------------------------- */
.page_title {
	height: 18.75em;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 4.7% 0 7.25%;
	background: url(../images/page_img.webp) center no-repeat;
	background-size: 100% 100%;
}
.page_title_inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}
@media screen and (max-width: 1024px) {
	.page_title {
		height: 16em;
	}
}
@media screen and (max-width: 540px) {
	.page_title {
		height: 40vw;
		padding: 0 6.9%;
		background-image: url(../images/page_img_sp.webp);
	}
	.page_title_inner {
		flex-direction: column;
		align-items: flex-start;
		justify-content: space-between;
		height: 100%;
		padding: 12% 0 6%;
	}
	.page_title_inner._c {
		padding: 0;
		justify-content: center;
	}
	.page_title_inner._2 {
		padding: 9% 0 6%;
	}
}

.uppercase-letter {
	text-transform: uppercase;
}


/* !パンくずリスト -------------------------------------------------------------- */
.breadcrumb {
	padding: 1.5em 0;
	line-height: 1.6;
}
.breadcrumb ul {
}
.breadcrumb li {
	display: inline;
	font-size: .9375em;
}
.breadcrumb li::before {
	content: "＞";
	margin-left: 0.3em;
	margin-right: 0.3em;
}
.breadcrumb li:first-child::before {
	content: none;
}
.breadcrumb li,
.breadcrumb li a {
	color: #565656;
}
.breadcrumb li a:hover {
	color: var(--blue);
}
.breadcrumb li a br {
	display: none;
}


/* !common -------------------------------------------------------------- */
.arrow {
	position: relative;
}
.arrow::after {
	content: "";
	display: block;
	background: var(--blue);
	position: absolute;
	right: 1.3em;
	top: 50%;
	transform: translateY(-50%);
	clip-path: polygon(0 40%, 70% 40%, 50% 13%, 62% 0, 100% 50%, 62% 100%, 50% 87%, 70% 60%, 0 60%);
	transition: all 0.2s;
	width: 1.25em;
	height: 1em;
}
.arrow._down::after {
	width: 1.3em;
	height: 1.1em;
	transform: rotate(90deg);
	clip-path: polygon(0 41%, 70% 41%, 50% 13%, 62% 0, 100% 50%, 62% 100%, 50% 87%, 70% 59%, 0 59%);
	right: 5%;
	top: 33%;
}

.title-blue {
	background: var(--blue);
	color: #fff;
	border-radius: .357em;
	padding: .55em 3.1%;
}
@media screen and (max-width: 1024px) {
	.arrow::after {
		right: .7em;
		top: 35%;
	}
}
@media screen and (max-width: 540px) {
	.arrow::after {
		width: 1em;
		height: .8em;
	}
	.arrow._down::after {
		width: 1.1em;
		height: .95em;
	}
	.title-blue {
		padding: .5em 5%;
	}
}




/* !contents -------------------------------------------------------------- */
.search-nav {
	gap: 1em 2.6%;
}
.search-nav li {
	width: 31.6%;
}
.search-nav li a {
	display: flex;
	justify-content: center;
	flex-direction: column;
	font-weight: 700;
	font-size: 1.25em;
	color: #000;
	background: #fff;
	border: .3em double var(--blue);
	border-radius: .4em;
	padding: .7em 1.2em;
	line-height: 1.8;
}
.search-nav li a .blue {
	font-size: 130%;
}
.search-nav li a:hover {
	background: #f5f5f5;
}
@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 540px) {
	.search-nav {
		gap: .8em 3%;
	}
	.search-nav li {
		width: 48.5%;
	}
	.search-nav li a {
		padding: .7em .6em;
		font-size: 1.15em;
	}
	.search-nav li a .blue {
		font-size: 92%;
	}
	.interview .search-nav li a ._name {
		font-size: .74em;
	}
}

.cList {
	margin-top: .5em;
}
.cList li + li {
	border-top: 1px solid #b7bfc8;
}
.cList li {
	display: flex;
	padding: .8em 0;
}
.cList li a:hover {
	border-bottom: 1px solid;
}
.cList_name {
	width: 35%;
	font-size: 1.25em;
	color: #2d5dcf;
	padding-right: 1.2em;
	line-height: 1.8;
}
.cList_add {
	width: 40%;
	font-size: 1.125em;
	padding-right: 1.2em;
}
.cList_txt {
	width: 25%;
	font-size: 1.125em;
}
.cList_link {
	font-size: 90%;
	white-space: nowrap;
	color: #262e42;
}
.cList_link::before {
	content: "";
	display: inline-block;
	width: 1em;
	height: 1em;
	background: url(../images/icon-link.png) no-repeat;
	background-size: contain;
	margin-left: .7em;
	vertical-align: -1px;
}
@media screen and (max-width: 1024px) {
	.cList_name {
		width: 35%;
	}
	.cList_add {
		width: 37%;
	}
	.cList_txt {
		width: 28%;
	}
}
@media screen and (max-width: 540px) {
	.cList li {
		padding: 0.5em 0 1.5em;
		display: block;
		line-height: 1.6;
	}
	.cList li + li {
		padding: 1.5em 0 1.5em;
	}
	.cList_name {
		font-size: 1.16em;
		padding-right: 0;
	}
	.cList_add {
		font-size: 1.08em;
		padding-right: 0;
	}
	.cList_txt {
		font-size: 1.08em;
	}
	.cList_link {
		font-size: 90%;
		white-space: nowrap;
		color: #262e42;
	}
	.cList_link::before {
		margin-left: .5em;
	}
	.cList_name,
	.cList_add,
	.cList_txt {
		width: 100%;
		display: block;
		position: relative;
		padding: 3.5em 0 .5em 4%;
	}
	.cList_name::before,
	.cList_add::before,
	.cList_txt::before {
		content: "会社名";
		font-size: 1.15em;
		font-weight: 700;
		color: var(--blue);
		background: var(--lblue);
		display: block;
		padding: .2em 0 .2em 4%;
		margin: .5em 0;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
	}
	.cList_add::before {
		content: "所在地";
	}
	.cList_txt::before {
		content: "業種";
	}
}

.pc-searchtitle {
	display: flex;
	background: var(--lblue);
	margin-top: 2.3em;
}
.pc-searchtitle span {
	font-size: 1.5em;
	color: var(--blue);
	font-weight: 700;
	padding: .2em 0;
}
.pc-searchtitle span:nth-child(1) {
	width: 35%;
	padding: .2em 0 .2em 1em;
}
.pc-searchtitle span:nth-child(2) {
	width: 40%;
}
.pc-searchtitle span:nth-child(3) {
	width: 25%;
}
@media screen and (max-width: 1024px) {
	.pc-searchtitle {
		display: none;
	}
}
@media screen and (max-width: 540px) {
}


.company-title {
}
.company-title-inner1 {
	text-align: right;
	padding-right: 2em;
	border-right: 3px solid var(--blue);
}
.company-title-inner2 {
	padding-left: 2em;
}
.company-title-inner2 a:hover {
	color: var(--blue);
}
@media screen and (max-width: 1024px) {
	.company-title-inner1 {
		text-align: center;
		border-right: none;
		border-bottom: 2px solid var(--blue);
		padding: 0 0 1em;
	}
	.company-title-inner2 {
		text-align: center;
		padding: .8em 0 0;
	}
}
@media screen and (max-width: 540px) {
}

.icon-appeal {
	position: relative;
	padding-left: 9em;
}
.icon-appeal::before {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	content: "";
	display: inline-block;
	width: 7.5em;
	height: 7.125em;
	background: url(../images/icon-appeal.png) no-repeat;
	background-size: 100%;
}
@media screen and (max-width: 540px) {
	.icon-appeal {
		position: relative;
		padding-left: 20vw;
	}
	.icon-appeal::before {
		width: 16vw;
		height: 15.2vw;
	}
}


.point {
}
.point-box {
	padding: 1.5em 4% 1.9em 0;
}
.point-box-title {
}
.point-box-txt {
	margin-left: 7.7em;
}
.point-num {
	min-width: 2.09em;
	text-align: center;
	line-height: 1;
}
@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 540px) {
	.point-box {
		padding: 1.8em 4% 1.7em 3%;
		margin-top: 5vw;
	}
	.point-box-txt {
		margin-left: 5%;
		margin-top: 3vw;
	}
}

.title-message {
	padding: 0 0 0 26.3%;
}
.message-photo {
	margin-top: -4.4em;
}
.message-photo img {
	width: 16.875em;
}
.message-txt {
	width: 88%;
	margin: -4.6em 0 0 auto;
	background: var(--dblue);
	color: #fff;
	padding: 2em 3% 2em 14.5%;
}
@media screen and (max-width: 1024px) {
	.title-message {
		padding: 0 0 0 32%;
	}
	.message-txt {
		padding: 2em 3% 2em 20%;
	}
}
@media screen and (max-width: 540px) {
	.title-message {
		padding: 0;
		text-align: center;
	}
	.message-photo {
		margin-top: 1.7em;
	}
	.message-photo img {
		width: 16em;
	}
	.message-txt {
		width: 98%;
		margin: -2em -7.5% 0 auto;
		background: var(--dblue);
		color: #fff;
		padding: 3.5em 7% 2em 6%;
	}
}



/* !grid -------------------------------------------------------------- */
.grid2 {
	display: grid;
	grid-template-columns: 42% 58%;
	grid-template-areas:
		"a b"
		"a c";
	padding-left: 4.5%;
}
.grid2 .item-a {
}
.grid2 .item-b {
}
.grid2 .item-c {
}
@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 540px) {
	.grid2 {
		align-items: center;
		grid-template-columns: 47% 53%;
		grid-template-areas:
			"a b"
			"c c";
		padding-left: 7%;
	}
	.grid2 .item-c {
		padding-right: 4%;
	}
}

.interviewWrap {
	position: relative;
	z-index: 2;
}
.interviewWrap::before {
	position: absolute;
	content: "";
	width: 100%;
	background: #fff;
	display: block;
	z-index: -1;
	border-radius: 1.25em;
	height: 95%;
	height: calc(100% - 7em);
	bottom: 0;
}
.interview-title {
}
.interviewBox {
	margin-top: -18em;
	padding: 19em 4.5% 3em;
}
.interview-img img {
	width: 25.625em;
}
@media screen and (max-width: 1024px) {
	.interview-img img {
		width: 21em;
	}
}
@media screen and (max-width: 540px) {
	.interviewWrap::before {
		height: calc(100% - 8em);
		border-radius: 1em;
	}
	.interview-title {
	}
	.interviewBox {
		margin-top: -18em;
		padding: 19em 7% 1.5em 7.6%;
	}
	.interview-img img {
		width: 33.333vw;
	}
}


.txt-2 {
	background: var(--blue);
	color: #fff;
	border-radius: 0.625em 0.625em 0 0;
	text-align: center;
	padding: .4em;
}
.column-year-list {
	padding: .7em 10%;
}
.column-year-list li {
	padding: .2em 0;
}
.column-year-list li::before {
	content: "";
	display: inline-block;
	background: var(--blue);
	width: .7em;
	height: .8em;
	clip-path: polygon(0 0, 0% 100%, 100% 50%);
	margin-right: .3em;
}
.column-year-list li a:hover {
	color: var(--blue);
}
.box-2 {
	padding: 1.1em 10%;
}
@media screen and (max-width: 540px) {
	.column-year-list {
		padding: .7em 0 .7em 6%;
		display: flex;
		flex-wrap: wrap;
	}
	.column-year-list li {
		padding: .2em 1em .2em 0;
	}
}


.journey_list {
	padding: 1em 1.33%;
	border: 2px solid #fff;
}
.journey_list:hover {
	border-color: var(--blue);
}
.journey_list_img {
	margin-right: 2.3em;
}
.journey_list_img img {
	width: 11.25em;
}
@media screen and (max-width: 1024px) {
	.journey_list_img {
		margin-right: 1em;
	}
	.journey_list_img img {
		width: 10em;
	}
}
@media screen and (max-width: 540px) {
	.journey_list_img {
		margin-right: 2.3em;
	}
	.journey_list_img img {
		width: 11.25em;
	}
	.journey_list {
		padding: 6% 6% 4%;
	}
}


.journey-volnum {
	width: 12.5em;
	text-align: center;
	line-height: 1.5;
	margin-right: 2em;
	padding: .5em 0 1.5em;
}
@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 540px) {
	.journey-volnum {
		width: 16.5em;
		text-align: center;
		line-height: 1.5;
		margin-right: 0;
		padding: .4em 1.3em;
	}
}

.paging .prev a,
.paging .next a {
	font-size: 1.125em;
	font-weight: bold;
}
.paging .prev,
.paging .next {
	position: relative;
}
.paging .prev::before,
.paging .next::after {
	content: "";
	display: block;
	background: var(--blue);
	position: absolute;
	top: 52%;
	transform: translateY(-50%);
	clip-path: polygon(0 40%, 70% 40%, 50% 13%, 62% 0, 100% 50%, 62% 100%, 50% 87%, 70% 60%, 0 60%);
	transition: all 0.2s;
	width: 1.25em;
	height: 1em;
}
.paging .prev {
	padding-left: 1.7em;
}
.paging .next {
	padding-right: 1.7em;
}
.paging .prev::before {
	left: 0;
	transform: translateY(-50%) rotate(180deg);
}
.paging .next::after {
	right: 0;
}
@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 540px) {
}

.box-3 {
	padding: 3em 4.5% 3em;
}

.modal-container{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	background: rgba(0,0,0,50%);
	padding: 0;
	overflow: auto;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
	z-index: 100;
	overflow-y: scroll;
	scrollbar-width: none;
	overscroll-behavior: none;
}
.modal-container::before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}
.modal-container.active{
	opacity: 1;
	visibility: visible;
}
.modal-body{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	background: #fff;
	width: 75em;
	max-width: 90%;
	padding: 1.9em 2em 1.1em;
}
.modal-close{
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	top: .2em;
	right: .2em;
	font-size: 3em;
	color: #111;
	cursor: pointer;
	line-height: 1;
	font-weight: 100;
}
.modal-content{
	text-align: left;
	padding: 2%;
}
.modal-content h3 {
	line-height: 1.7;
}
.modal-content p {
	line-height: 1.9;
}
@media screen and (max-width: 540px) {
	.modal-content{
		padding: 3% 0 2% 0.5%;
	}
	.modal-container{
		padding: 5vw 0;
	}
}

.detail-industry p:not([class]) {
	font-size: 1.125em;
	padding: .85em 0;
}
.terms-of-use .detail-industry p:not([class]) {
	font-size: 1em;
}


@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 540px) {
}