/* CSS Document */

/*==================================================

contents
=================================================*/

.news-inner {
	width: 90%;
	max-width: 1000px;
	margin: 0 auto;
}
.news-inner ul {
	width: 100%;
}
.news-inner ul li {
	border-bottom: 1px solid #999999;
}
.news-inner ul li dl {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	align-items: center; 
	padding: .8em 0;
}
.news-inner ul li dl dt {
	font-size: clamp(1.6rem, 2.4vw, 2.4rem);
	line-height: 160%;
}
.news-inner ul li dl dd {
	flex: 1;
	padding-left: 1em;
}

.business-top .inner {
	width: 90%;
	max-width: 1000px;
	margin: 0 auto;
}
.business-top .inner h1 {
	text-align: center;
	color: #00006a;
	margin-bottom: .5em;
}
.business-top .business-map {
	position: relative;
	padding: min(10%, 120px) 0;
}
.business-top .business-map img {
	width: 100%;
	max-width: 100%;
	height: auto;
}
.business-top .business-map .map-item {
	width: 95%;
	max-width: 880px;
	aspect-ratio: 1 / 1;
	display:grid;
	grid-template-columns:repeat(2,1fr);
	position:relative;
	background-image: url("../../business/images/business_map.png");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	margin: 0 auto;
	z-index: 4;
}
.business-top .business-map .details {
	color: #FFF;
	text-align: center;
	padding: 24% 5% 0;
}
.business-top .business-map .details > a {
	display: block;
	text-decoration: none;
	color: #FFF;
}
.business-top .business-map .details > a:hover {
	opacity: 1;
}
.business-top .business-map .details > a:hover .button::after {
	background-color: #ff7e00;
}
.business-top .business-map .details h2 {
	margin-bottom: .5em;
}
.business-top .business-map .details p {
	display: inline-block;
	min-height: 4em;
	font-size: clamp(1.2rem, 1.6vw, 1.8rem);
	line-height: 160%;
}
.business-top .business-map .details .button {
	width: 60%;
	max-width: 220px;
	color: #000099;
	font-size: clamp(1.2rem, 1.6vw, 1.8rem);
	background-color: #fff;
	padding: .5em 1em;
}
.business-top .business-map .details .button::after {
	width: 10px;
}
.business-top .business-map .details .button::before {
	background-color: #fff;
}
.business-top .business-map .bg-circle {
	width: 100%;
	max-width: 1084px;
	position: absolute;
	mix-blend-mode: multiply;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
}
.business-top .business-map .bg-left {
	width: 100%;
	height: 100%;
	position: absolute;
	background-image: url("../../business/images/map_bg_left.png");
	background-position: center center;
	background-repeat: repeat-x;
	background-size: auto 100%;
	top: 50%;
	left: 0;
	transform: translate(0, -50%);
	z-index: 1;
}
.business-top .business-map .bg-right {
	width: 100%;
	max-width: 1600px;
	position: absolute;
	text-align: right;
	top: 50%;
	right: 0;
	transform: translate(0, -50%);
	z-index: 1;
}
.business-top .photo {
	width: 100%;
	height: 100%;
	display: flex;
	flex-flow: row wrap;
	position: relative;
	margin-top: min(6%, 60px);
	z-index: 1;
}
.business-top .photo div {
	width: 33.33%;
	height: 100%;
}
.business-top .photo div img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.business-page {
	padding: min(10%, 80px) 0;
}
.business-page:first-of-type {
	background: #eaeaea;
}
.business-page + .business-page {
	padding-bottom: 0;
}
.business-page .inner {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
}
.business-page .inner .title {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	align-items: stretch;
	border-radius: 20px;
	overflow: hidden;
	background: #fff;
}
.business-page + .business-page .inner .title {
	background: #eaeaea;
}
.business-page .inner .title h1 {
	width: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: clamp(2rem, 3vw, 3rem);
	color: #fff;
	text-align: center;
	background: #00006a;
	padding: 1.5em 1em;
}
.business-page .inner .title ul {
	width: 50%;
	padding: 1.5em 1.5em;
}
.business-page .inner .title ul li {
	position: relative;
	color: #00006a;
	font-size: clamp(1.6rem, 2vw, 2rem);
	font-weight: 600;
	padding-left: .7em;
	margin: .2em 0;
}
.business-page .inner .title ul li::before {
	content: "・";
	position: absolute;
	left: 0;
}
.business-page .inner p {
	max-width: 1000px;
	margin: 2em auto;
}
.business-page .photo {
	width: 100%;
	height: 100%;
	display: flex;
	flex-flow: row wrap;
	position: relative;
	margin-top: min(6%, 60px);
	z-index: 1;
}
.business-page .photo div {
	width: 50%;
	height: 100%;
}
.business-page .photo div img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.message {
	width: 90%;
	max-width: 1200px;
	display: flex;
	flex-flow: row-reverse wrap;
	justify-content: space-between;
	align-items: flex-end;
	margin: 0 auto;
}
.message .message-photo {
	width: 39.2%;
}
.message .message-txt {
	width: 59.3%;
	padding-bottom: clamp(5%, 2vw, 5em);
}
.message .message-txt h1 {
	position: relative;
	color: #00006a;
	margin-bottom: .6em;
	padding-bottom: .6em;
}
.message .message-txt h1::before {
	content: " ";
	display: block;
	position: absolute;
	width: 100%;
	height: 6px;
	background: linear-gradient(90deg,#ff8a00 0%,#0020a4 70%,#00d4ff 100%);
	left: 0;
	bottom: 0;
	z-index: 1;
}
.message .message-txt h1 span {
	display: block;
	font-size: clamp(1.8rem, 3.2vw, 3.2rem);
	line-height: 140%;
	margin-bottom: .5em;
}
.message .message-txt h2 {
	text-align: right;
	margin-top: 1em;
}
.message .message-txt h2 span {
	display: inline-block;
	font-size: clamp(1.6rem, 2vw, 2rem);
	vertical-align: baseline;
	margin-right: 1em;
}
.message img {
	width: 100%;
	max-width: 100%;
	height: auto;
}
.phoilosophy-cont{
	flex: .93;
	position: relative;
}
.phoilosophy-cont ul {
	margin: 2em 0;
}
.phoilosophy-cont ul li {
	text-indent: -1.6em;
	margin: 2em 0;
	padding-left: 1.6em;
}

.profile {
	width: 90%;
	max-width: 1200px;
	display: flex;
	flex-flow: row wrap;
	align-items: flex-start;
	justify-content: space-between;
	margin: 0 auto min(10%, 80px);
}

.profile .profile-item {
	flex: .93;
	
}
.profile .profile-item section:nth-of-type(n+2) {
	margin-top: min(10%, 80px);
}
.profile .profile-item .photo .information {
	text-align: center;
	padding: min(6%, 30px) 0;
}
.profile .profile-item ul {
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap: 14px;
	margin-bottom: min(6%, 30px);
}
.profile .profile-item ul li {
	border-left: 5px solid #ff9000;
	background-color: #eaeaea;
	padding: min(5%, 30px);
}
.profile img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

.history {
	width: 100%;
	position: relative;
	background:#070a7a;
	color:#fff;
	padding: min(10%, 80px) 0 min(12%, 120px);
}

.history .block-title {
	border-color: #FFF;
}
.history .block-title h2 {
	color: #FFF;
}

.history-cont{
	flex: .93;
	position: relative;
}
.history-item {
	display: flex;
	flex-flow: row wrap;
	align-items: center; 
	position: relative;
}
.history-item::before{
	content:"";
	position:absolute;
	width: 2px;
	height: 100%;
	top: 0;
	left: clamp(16%, 24vw, 240px);
	background:#fff;
	z-index: 1;
}
.history-item::after{
	content:"";
	position:absolute;
	width: 18px;
	height: 18px;
	border-radius:50%;
	background:#fff;
	top: 50%;
	left: clamp(16%, 24vw, 240px);
	transform: translate(-45%, -50%);
	z-index: 1;
}

.history-year {
	width: clamp(18%, 24vw, 240px);
	padding: min(4%, 20px) 1em min(4%, 20px) 0;
}
.year {
	display:inline-block;
	font-size: clamp(2rem, 3vw, 3.6rem);
	vertical-align: middle;
}
.era {
	display:inline-block;
}
.history-body {
  	flex:1;
	position:relative;
 	padding: min(4%, 20px) 0 min(4%, 20px) 2em;
}

.training-page .inner {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
}
.training-page .inner .head {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center; 
}
.training-page .inner .head p {
	flex: .94;
}
.training-page .inner .schedule {
	margin-top: min(6%, 60px);
}
.training-page .inner .schedule ul {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}
.training-page .inner .schedule li {
	flex: 1;
	position: relative;
	color: #fff;
	display: flex;
	flex-direction: column;
	padding: 1.5em 1.2em;
}
.training-page .inner .schedule li:nth-of-type(2) {
	background-color: #0081e8;
}
.training-page .inner .schedule li:nth-of-type(3) {
	background-color: #0068d8;
}
.training-page .inner .schedule li:nth-of-type(4) {
	text-align: center;
	background-color: #004dc7;
}
.training-page .inner .schedule li:nth-of-type(n+2)::after {
	content: " ";
	display: block;
	position: absolute;
	width: min(.8em, 18px);
	aspect-ratio: .9 / 1;
	background-color: #FFF;
	clip-path: polygon(100% 50%, 0 0, 0 100%);
	top: 50%;
	left: 0;
	transform: translate(-50%, -50%);
	z-index: 2;
}

.training-page .inner .schedule li h3 {
	text-align: center;
	margin-bottom: .5em;
}

.training-page .inner .schedule li:first-child {
	color: #0081e8!important;
	align-items: center;
	justify-content: center;
	background: #FFF;
	border: 4px solid #0081e8;
	border-radius: 10px 0 0 10px;
}
.training-page .inner .schedule li:last-child {
	align-items: center;
	justify-content: center;
	background-color: #0016a3;
	border-radius: 0 10px 10px 0;
}

.training-page:first-of-type + .training-page {
	color: #FFF;
	background-color: #080594;
	margin: min(10%, 80px) auto;
	padding: min(10%, 80px) 0;
}
.training-page:first-of-type + .training-page .inner {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}
.training-page:first-of-type + .training-page .inner .head {
	width: 45%;
	flex-direction: column;
	align-items: flex-start; 
}
.training-page:first-of-type + .training-page .inner .head .block-title-c {
	background: linear-gradient(0deg, #dbdbdb, #f4f4f4);
}
.training-page:first-of-type + .training-page .inner .head .block-title-c h2 {
	color: #080594;
}
.training-page:first-of-type + .training-page .inner .head p {
	margin-top: min(6%, 60px);
}
.training-page:first-of-type + .training-page .inner .head .block-title-c::before {
	background-image: url("../../recruit/images/icon2.png");
}
.training-page:first-of-type + .training-page .inner .photo {
	width: 50%;
}
.training-page .inner .photo img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

.training-page .inner .system-pict {
	width: 100%;
	text-align: center;
	background-color: #f2f2fa;
	border-radius: 20px;
	margin-top: min(6%, 60px);
	padding: min(10%, 60px) 5% 0;
}
.training-page .inner .system-pict img {
	width: 95%;
	max-width: 1230px;
	height: auto;
}

.job-page .inner {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
}
.job-page .inner h1 {
	color: #00006a;
	text-align: center;
	font-weight: 600;
}
.job-page .inner h1 strong {
	color: #ff7e00;
}

.job-page .inner .job-about {
	width: 100%;
	display: table;
	color: #ff7e00;
	margin-top: min(6%, 40px);
}
.job-page .inner .job-about dt {
	width: 35%;
	display: table-cell;
	font-size: clamp(1.8rem, 2.6vw, 3rem);
	line-height: 160%;
	color: #FFF;
	text-align: center;
	vertical-align: middle;
	background-color: #ff7e00;
	padding: 2em 1em;
}
.job-page .inner .job-about dd {
	display: table-cell;
	color: #FFF;
	vertical-align: middle;
	background-color: #0016a3;
	padding: 2em;
}
.job-page .inner .timeline {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	margin-top: min(6%, 60px);
}
.job-page .inner .timeline ul {
	width: 50%;
}
.job-page .inner .timeline ul li {
	position: relative;
	border-bottom: 1px solid #CCC;
	padding: 1.5em 1em 1.5em 60px;
}
.job-page .inner .timeline ul li::before {
	content: " ";
	display: block;
	position: absolute;
	width: 30px;
	aspect-ratio: 1 / 1;
	background-color: #0016a3;
	clip-path: circle(48% at 50% 50%);
	top: 50%;
	left: 4%;
	transform: translate(0, -50%);
	z-index: 1;
}
.job-page .inner .timeline ul li::after {
	content: " ";
	display: block;
	position: absolute;
	width: 3px;
	height: 100%;
	background-color: #0016a3;
	top: 50%;
	left: 4%;
	transform: translate(430%, -50%);
	z-index: 1;
}
.job-page .inner .timeline ul li:first-child::after {
	height: 50%;
	top: auto;
	bottom: 0;
	transform: translate(430%, 0);
	z-index: 1;
}
.job-page .inner .timeline ul li:nth-last-of-type(1)::after {
	height: 50%;
	top: 0;
	transform: translate(430%, 0);
	z-index: 1;
}
.job-page .inner .timeline ul li p {
	position: relative;
	line-height: 160%;
	padding-left: clamp(35px, 35%, 160px);
}
.job-page .inner .timeline ul li strong {
	width: min(30%, 140px);
	display: block;
	position: absolute;
	text-align: right;
	font-size: clamp(2rem, 4vw, 5rem);
	color: #0016a3;
	line-height: 100%;
	top: 50%;
	left: 0;
	transform: translate(0, -50%);
	z-index: 1;
}
.job-page .inner .timeline .photo {
	width: 45.8%;
}
.job-page .inner .timeline .photo img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

.job-page .job-interview {
	position: relative;
	background-color: #0016a3;
	margin-top: min(10%, 80px);
	padding: min(10%, 80px) 0 0;
}
.job-page .job-interview .section-bottom {
	position: relative;
	margin-top: min(8%, 80px);
}
.job-page .job-interview img {
	width: 100%;
	max-width: 100%;
	height: auto;
}
.job-page .job-interview .interview-inner {
	width: 90%;
	max-width: 1200px;
	color: #FFF;
	margin: 0 auto;
}
.job-page .job-interview .interview-inner h1 {
	font-size: clamp(3rem, 6vw, 8rem);
	line-height: 100%;
	text-align: center;
}
.job-page .job-interview .interview-inner h1 span {
	display: block;
	color: #ff7e00;
	font-size: clamp(1.6rem, 2.4vw, 2.4rem);
	line-height: 180%;
	margin-top: 10px;
}
.job-page .job-interview .interview-inner .interview-head {
	width: 100%;
	position: relative;
	overflow: hidden;
	border-radius: 40px;
	margin-top: min(6%, 60px);
}
.job-page .job-interview .interview-inner .interview-head .info {
	width: 100%;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(0, -50%);
	z-index: 2;
}
.job-page .job-interview .interview-inner .interview-head .info h2 {
	font-size: clamp(2.4rem, 3vw, 4rem);
	line-height: 160%;
	color: #0016a3;
	padding: 1em 60px;
}
.job-page .job-interview .interview-inner .interview-head .info h2.wh {
	color: #FFF;
}
.job-page .job-interview .interview-inner .interview-head .info p {
	display: inline-block;
	font-size: clamp(1.6rem, 2vw, 2.4rem);
	line-height: 180%;
	background-color: #0016a3;
	border-right: 10px solid #ff7e00;
	padding: 1em 60px;
}
.job-page .job-interview .interview-inner .interview-body {
	max-width: 1000px;
	margin: min(6%, 60px) auto 0;
}
.job-page .job-interview .interview-inner .interview-body h2 {
	margin-bottom: 1em;
}

.job-page .list-menu {
	width: 90%;
	max-width: 1200px;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	margin: 0 auto;
}
.job-page .list-menu li {
	width: 30.8%;
	margin-top: min(8%, 60px);
}
.job-page .list-menu li div {
	overflow: hidden;
	border-radius: 20px;
}
.job-page .list-menu li p {
	color: #0016a3;
	text-align: center;
	font-size: clamp(1.6rem, 2vw, 2.4rem);
	line-height: 160%;
	padding: 1em 0 0;
}
.job-page .list-menu li p span {
	display: inline-block;
}
.job-page .list-menu img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

.benefits-page .inner {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
}
.benefits-page .inner ul {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(10px, 5vw, 60px);
}
.benefits-page .inner ul li {
	position: relative;
	overflow: hidden;
	border: clamp(3px, 0.4vw, 5px) solid #0016a3;
	border-radius: 20px;
	padding: min(8%, 40px) min(8%, 60px) min(10%, 80px);
}
.benefits-page .inner ul li::before {
	content: " ";
	display: block;
	position: absolute;
	width: 70px;
	aspect-ratio: 1 / 1;
	clip-path: polygon(0 0, 0% 100%, 100% 0);
	background-color: #0016a3;
	top: 0;
	left: 0;
	z-index: 1;
}
.benefits-page .inner ul li .icon {
	width: 60%;
	max-width: 128px;
	text-align: center;
	margin: 0 auto;
}
.benefits-page .inner ul li .icon img {
	width: 100%;
	max-width: 100%;
	height: auto;
}
.benefits-page .inner ul li h3 {
	color: #0016a3;
	text-align: center;
	border-bottom: 5px solid #ff7e00;
	margin: 1em 0 .5em;
	padding-bottom: .5em;
}

.contact-inner {
	width: 90%;
	max-width: 1000px;
	margin: 0 auto;
}

#privacy {
	width: 90%;
	max-width: 1000px;
}
.privacy-box dt {
	font-weight: 600;
	color: #00006a;
	background: #EEE;
	border-left: 5px solid #ff7e00;
	text-align: left;
	margin: 0;
	padding: .8em .5em;
	margin-bottom: .8em;
}
.privacy-box dd {
	margin: 0;
	padding: 0;
	margin-bottom: 2em;
	padding-left: 8px;
}
.privacy-box dd a {
	color: #F00;
	text-decoration: none;
}
.privacy-box dd a:hover {
	color: #F00;
	text-decoration: underline;
}
.privacy-txt {
	line-height: 180%;
	text-align: right;
}

@media only screen and (min-width:1px) and (max-width: 768px) {
	
	.business-top .business-map .details {
		padding: 20% 5% 0;
	}
	.business-top .business-map .details h2 {
		margin-bottom: .2em;
	}
	.business-top .business-map .details p {
		display: inline-block;
		min-height: 3em;
	}
	.business-top .business-map .details .button {
		width: 60%;
		max-width: 160px;
	}
	.business-top .business-map .details .button::after {
		display: none;
	}
	.business-top .business-map .bg-left {
		display: none;
	}
	
	.business-page .photo {
		flex-direction: column;
		z-index: 1;
	}
	.business-page .photo div {
		width: 100%;
		height: 100%;
	}
	.business-page .inner .title {
		width: 100%;
		display: block;
		border-radius: 10px;
	}
	.business-page .inner .title h1 {
		width: 100%;
		display: block;
		padding: 1.5em 1em;
	}
	.business-page .inner .title ul {
		width: 100%;
		display: block;
		padding: 1.5em 1.5em;
	}
	
	.message {
		flex-direction: column;
		align-items: flex-start;
		margin: 0 auto;
	}
	.message .message-photo {
		width: 60%;
		max-width: 320px;
		margin: 0 auto;
	}
	.message .message-txt {
		width: 100%;
		padding-bottom: clamp(5%, 2vw, 5em);
	}
	.message .message-txt h1 {
		text-align: center;
	}
	.message .message-txt h1::before {
		width: 100%;
		height: 4px;
	}
	.profile {
		flex-direction: column;
	}
	.profile .profile-item {
		width: 100%;
		display: block;
	}
	.profile .profile-item ul {
		grid-template-columns:1fr;
	}
	.history-cont {
		width: 100%;
		display: block;
	}
	.year {
		display:block;
	}
	.era {
		display:block;
	}
	
	.training-page .inner .head {
		width: 100%;
		flex-direction: column;
		align-items: center; 
	}
	.training-page .inner .head p {
		width: 100%;
		margin-top: min(6%, 60px);
	}
	.training-page .inner .schedule ul {
		width: 100%;
		flex-direction: column;
	}
	.training-page .inner .schedule li {
		flex: 1;
		position: relative;
		color: #fff;
		display: flex;
		flex-direction: column;
		align-items: center; 
		padding: 1.5em 1.2em;
	}
	.training-page .inner .schedule li:nth-of-type(2) p {
		width: 12em;
	}
	.training-page .inner .schedule li:nth-of-type(3) p {
		width: 12em;
	}
	.training-page .inner .schedule li:nth-of-type(4) p br {
		display: none;
	}
	.training-page .inner .schedule li:nth-of-type(n+2)::after {
		width: min(1em, 18px);
		aspect-ratio: 1 / 1;
		clip-path: polygon(50% 100%, 1% 0, 100% 0);
		top: auto;
		top: 0;
		left: 50%;
		transform: translate(-50%, -50%);
		z-index: 2;
	}

	.training-page .inner .schedule li h3 {
		text-align: center;
		margin-bottom: .5em;
	}

	.training-page .inner .schedule li:first-child {
		border: 3px solid #0081e8;
		border-radius: 0;
	}
	.training-page .inner .schedule li:last-child {
		border-radius: 0;
	}

	.training-page:first-of-type + .training-page .inner {
		flex-direction: column;
	}
	.training-page:first-of-type + .training-page .inner .head {
		width: 100%;
		flex-direction: column;
		
		align-items: center; 
	}
	.training-page:first-of-type + .training-page .inner .head .block-title-c {
		margin-bottom: 0;
	}
	.training-page:first-of-type + .training-page .inner .photo {
		width: 100%;
		margin-top: min(6%, 60px);
	}

	.training-page .inner .system-pict {
		border-radius: 10px;
	}
	
	.job-page .inner .job-about {
		width: 100%;
		display: block;
		color: #ff7e00;
		margin-top: min(6%, 40px);
	}
	.job-page .inner .job-about dt {
		width: 100%;
		display: block;
		padding: .8em 1em;
	}
	.job-page .inner .job-about dd {
		width: 100%;
		display: block;
		padding: .8em 1em;
	}
	.job-page .inner .timeline {
		flex-direction: column;
	}
	.job-page .inner .timeline ul {
		width: 100%;
	}
	.job-page .inner .timeline ul li {
		position: relative;
		border-bottom: 1px solid #CCC;
		padding: 1.5em 0;
	}
	.job-page .inner .timeline ul li::before {
		left: 4%;
	}
	.job-page .inner .timeline ul li::after {
		left: 4%;
	}
	.job-page .inner .timeline ul li:first-child::after {
		height: 50%;
		top: auto;
		bottom: 0;
		transform: translate(430%, 0);
		z-index: 1;
	}
	.job-page .inner .timeline ul li:nth-last-of-type(1)::after {
		height: 50%;
		top: 0;
		transform: translate(430%, 0);
		z-index: 1;
	}
	.job-page .inner .timeline ul li p {
		position: relative;
		line-height: 160%;
	}
	.job-page .inner .timeline .photo {
		width: 100%;
		margin-top: 6%;
	}
	.job-page .inner .timeline .photo img {
		width: 100%;
		max-width: 100%;
		height: auto;
	}

	.job-page .job-interview .interview-inner .interview-head {
		width: 100%;
		position: relative;
		overflow: visible;
		border-radius: 0;
	}
	.job-page .job-interview .interview-inner .interview-head .photo {
		overflow: hidden;
		border-radius: 20px;
	}
	.job-page .job-interview .interview-inner .interview-head .photo.fr img {
		width: 140%;
		max-width: 140%;
		height: auto;
		margin-left: -40%;
	}
	.job-page .job-interview .interview-inner .interview-head .info {
		width: 100%;
		position: relative;
		top:0;
		left: 0;
		transform: translate(0, 0);
		z-index: 2;
	}
	.job-page .job-interview .interview-inner .interview-head .info h2 {
		color: #FFF;
		text-align: center;
		padding: 1em 0;
	}
	.job-page .job-interview .interview-inner .interview-head .info p {
		display: block;
		text-align: center;
		line-height: 180%;
		background-color: transparent;
		border-top: 3px solid #ff7e00;
		border-right: none;
		padding: 1em 0 0 0;
	}
	.job-page .job-interview .interview-inner .interview-body h2 {
		margin-bottom: 1em;
	}

	.job-page .list-menu {
		width: 90%;
		max-width: 480px;
		flex-direction: column;
		margin: 0 auto;
	}
	.job-page .list-menu li {
		width: 100%;
		display: flex;
		flex-flow: row wrap;
		justify-content: space-between;
		align-items: center; 
	}
	.job-page .list-menu li div.photo {
		width: 40%;
		overflow: hidden;
		border-radius: 10px;
	}
	.job-page .list-menu li div.info {
		flex: .9;
	}
	.job-page .list-menu li p {
		padding: 0;
	}
	.job-page .list-menu li p span {
		display: block;
		font-size: 80%;
		line-height: 160%;
	}
	
	.benefits-page .inner ul {
		display: block;
	}
	.benefits-page .inner ul li {
		width: 100%;
		max-width: 480px;
		margin: 0 auto clamp(15px, 4vw, 25px);
	}
	.benefits-page .inner ul li:last-child {
		margin-bottom: 0;
	}
	.benefits-page .inner ul li::before {
		width: 50px;
	}
	.benefits-page .inner ul li h3 {
		border-bottom: 3px solid #ff7e00;
	}
}

@media only screen and (min-width:1px) and (max-width: 568px) {
	

}
	
@media only screen and (min-width:1px) and (max-width: 480px) {
	

}