/* ======================================
メインビジュアル */

.hero_outer {
	overflow: hidden;
	position: relative;
	width: 100%;
	height: auto;
}
.hero {
	width: 100%;
	height: 100%;
	padding-top: 18%;
	padding-bottom: 18%;
	background: #ecf8ff;
}
@media print, screen and (min-width: 600px){
.hero { padding-top: 10%; padding-bottom: 10%;}}
 @media print, screen and (min-width: 1025px){
.hero { padding: 0;}}

.hero-video {
	width: 100%; display: block;
	border-top: solid 3px #0b3da9;
    border-bottom: solid 3px #0b3da9;
}
 
.mvarea { margin-top: 3em;}
@media print, screen and (min-width: 1360px){
.hero_outer {
	width: 100%;
	height: 100%;
	height: 100vh;
}
.hero {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.mvarea { position: relative; margin-top: 0;}
.mvarea_pic { position: relative;}
}


.mv_txt01 img,.mv_txt02 img { display: block; width: 100%; height: auto;}
.mv_txt01,.mv_txt02 { position: absolute; z-index: 10;}
.mv_txt01 {
	top: 1em;
    left: 0;
    width: 55%;
    max-width: 300px;
}
.mv_txt02 {
	bottom: 3%;
	right: 1em;
	width: 80%;
    max-width: 400px;
}
@media print, screen and (max-width: 599px){
.mv_txt02 {
	left: 50%;
	transform: translate(-50%,-0%);
}
}

@media print, screen and (min-width: 1025px){
.mv_txt02 { max-width: 500px;}
}
@media print, screen and (min-width: 1360px){
.mv_txt01 { top: 6em; width: 25%; max-width: 450px;}
.mv_txt02 { width: 38%; max-width: 650px;}
}


/* ==========================
	見出し等共通　*/

.top_title {
	position: relative;
	font-size: clamp(1.5rem, 0.455rem + 5.23vw, 4.375rem);
	/* fontsize:24-70 */
	line-height: 1.2;
	width: fit-content;
	padding: 0 0 .3em 0;
	border-bottom: 3px solid #fff;
	text-align: center;
	margin: 0 auto 1em;
	color: #fff;
	font-family: 'Noto Sans JP', serif;
	font-weight: 900;
}
@media print, screen and (min-width: 767px){
	.top_title {
		padding: 0 1.5em .5rem;
	}
}

.dots {
	background-image: radial-gradient(circle at center, #ffdd00 16%, transparent 20%); /* 点の色とサイズ調整 */
	background-position: top right; /* 点の位置 */
	background-repeat: repeat-x; /* 横方向に繰り返し */
	background-size: 1em 1em; /* 点の間隔とサイズ調整 */
	padding-top: .5em; /* 縦方向の位置調整 */
}

.mid_title01 {
	position: relative;
	width: fit-content;
	font-size: clamp(1.5rem, 0.909rem + 2.95vw, 3.125rem);
	font-family: 'Noto Sans JP', serif;
	font-weight: 700;
	line-height: 1;
	color: #0b3da9;
	padding: 0 .5rem;
	margin: 1rem .5em .5em;
	border-left: .1rem solid;
	border-right: .1rem solid;
	display: flex;
}
.mid_title01::before {
	position: absolute;
	content: "";
	width: 120%;
	height: 1em;
	border-left: .4em solid;
	top: 0;
	left: -.5em;
}
.mid_title01::after {
	position: absolute;
	content: "";
	width: 120%;
	height: 1em;
	border-right: .4em solid;
	top: 0;
	right: -.5em;
}
@media print, screen and (min-width: 768px){
	.mid_title01 {
		padding: 0 1rem;
		margin: .5rem .6em .5em;
	}
	.mid_title01::before { left: -.6em;}
	.mid_title01::after { right: -.6em;}	
}
@media print, screen and (min-width: 1025px){
	/* .mid_title01 {	font-size: 4rem;} */
}

.mid_title02 { 
	position: relative;
	font-size: clamp(1.1rem, 0.4rem + 3.41vw, 3.125rem);
	font-family: 'Noto Sans JP', serif;
	font-weight: 700;
	width: fit-content;
	line-height: 1;
	padding: 0 1em;
	margin: 0;
	background: #fff;
}

.mid_title02::before {
	position: absolute;
	top: 50%;
	left: 0em;
	transform: translateY(-50%);
	content: "●";
	display: flex;
	align-items: center;
	font-size: 50%;
	color: #0B3DA9;

}
.mid_title02::after {
	position: absolute;
	top: 50%;
	right: 0em;
	transform: translateY(-50%);
	content: "●";
	display: flex;
	align-items: center;
	font-size: 50%;
	color: #0B3DA9;
}

.top_catch {
	font-family: "YuMincho","Yu Mincho";
	font-size: 2rem;
	margin-bottom: .5em;
	font-weight: 500;
}
@media print, screen and (min-width: 1025px){
.top_catch {
	font-size: 2.4rem;
}
}

/* ==========================
			文字アニメーション　*/
.txtAnime {	color: #828282;}
.slide-in {
	display: inline-block;
	color: #fff;
}

.slide-in_inner01 {
	color: #de0000;
	font-size: 120%;
	font-size: clamp(1.375rem, 1.011rem + 1.82vw, 2.375rem);
	display: block;
}
.slide-in_inner02 {
	display: inline-block;
	color: #828282;
}
@media print, screen and (min-width: 1360px){
.slide-in_inner02 { font-size: 120%;}
}

/*左右のアニメーション*/
.leftAnime{
	opacity: 0;/*事前に透過0にして消しておく*/
}

.slideAnimeLeftRight {
	animation-name:slideTextX100;
	animation-delay: 1s;
	animation-duration:.4s;
	animation-fill-mode:forwards;
	opacity: 0;
}

@keyframes slideTextX100 {
		from {
	transform: translateX(-100%); /*要素を左の枠外に移動*/
	opacity: 0;
	}

		to {
	transform: translateX(0);/*要素を元の位置に移動*/
	opacity: 1;
	}
}

.slideAnimeRightLeft {
	animation-name:slideTextX-100;
	animation-delay: 1.2s;
	animation-duration:.6s;
	animation-fill-mode:forwards;
	opacity: 0;
}

@keyframes slideTextX-100 {
		from {
	transform: translateX(100%);/*要素を右の枠外に移動*/
	opacity: 0;
	}

		to {
	transform: translateX(0);/*要素を元の位置に移動*/
	opacity: 1;
	}
}

/* =====================================
			メッセージ＆メリット */
.message_merit_area {background-color: #fff;}
.message_merit_area {padding: 0;}

.message_img img {width: 100%;}
.messageimg_area {
	position: relative;
	width: 100vw;
	height: auto;
	overflow: hidden;
}

.messagepc_img {
	max-width: 1440px;
	padding: 0 3.125%;
	margin: -5% auto 0;
}
@media print, screen and (min-width: 1440px){
	.messagepc_img {	padding: 0;}
}

.messagebgb_img { margin-top: -.5%;}

@media print, screen and (min-width: 1360px){
	.message_merit_area { padding-left: 0; padding-right: 0;}
}

@media print, screen and (min-width: 767px){
.merit_conts > .top_title {
	margin-right: 0;
}
}

.merit_conts .top_title { color: #231815; border-bottom-color: #231815;}
@media print, screen and (min-width: 768px){
.merit_conts .top_title { width: 75%; padding: 0 0 .3em 0; margin: 0 0 .5em auto;}
}

.merit_pic img {
	display: block;
	width: 100%;
	height: auto;
}
@media print, screen and (min-width: 768px){
.merit_pic { margin-top: -3em;}
}

.merit_txt { color:#000; margin-bottom: 2em; margin-top: 1.5em; font-size: 110%; font-weight: 700;}
@media print, screen and (min-width: 1025px){
.merit_txt { margin-bottom: 2.5em; margin-top: 2em; font-size: 120%;}
}

.meritlist {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	color: #de0000; 
	font-weight: 700; 
	font-size: clamp(1.125rem, 0.852rem + 1.36vw, 1.875rem);
	padding: .5em;
}

@media print, screen and (min-width: 768px){
.merit_cont {
	width: 25%;
	position: absolute;
    left: 0;
}
.meritlist { width: 74%; justify-content: normal;}
}

.merit_li {
	background-color: #fff;
	width: fit-content;
	border-radius: 3em;
	padding: .1em .7em;
	margin: .2em .3em .2em 0;
}
.btxt {color: #0b3da9; font-size: clamp(0.875rem, 0.739rem + 0.68vw, 1.25rem);}

.merit_box02 { padding: 1em 0 2em 0;}

.meritbox_img { padding-top: 1em; width: 80%; margin: auto;}

@media print, screen and (min-width: 768px){
	.merit_box02 {
		display: flex;
		width: 100%;
		justify-content: space-between;
		padding: 2em 0 2em 0;
	}
	.meritbox_img { width: 32%; margin: 0;}
}

/* =====================================
			主な仕事内容 */

.jobdesc_area {background-color: #ECF8FF;}
/* .jobdesc_area .top_title {margin: 0;} */

.jobdesc_area .top_title {
    color: #231815;
    border-bottom-color: #231815;
}

.slidearea {
	padding: 1em;
	background-color: #fff;
}

.slide { position: relative;}

/* スライダー矢印 */
@media print, screen and (min-width: 1530px){
	/*戻る、次へ矢印の位置*/
.slick-prev, .slick-next {
	position: absolute;/*絶対配置にする*/
	z-index: 3;
	top: 42%;
	cursor: pointer;/*マウスカーソルを指マークに*/
	outline: none;/*クリックをしたら出てくる枠線を消す*/
	background-color: #fff;
	border-radius: 50%;
	height: 60px;
	width: 60px;
	}
	.slick-prev {/*戻る矢印の位置と形状*/
		left:-7%;
	}
	.slick-next {/*次へ矢印の位置と形状*/
		right:-7%;
	}
	.slick-prev::before, .slick-next::before {
		position: absolute;
		content: "";
		border-top: 8px solid #0b3da9;
		border-right: 8px solid #0b3da9;	
		height: 25px;
		width: 25px;
		z-index: 2;
		top: 18px;
	}
	.slick-prev::before {
	transform: rotate(-135deg);
	left: 22px;
	}
	.slick-next::before {
	transform: rotate(45deg);
	right: 22px;
	}
}
	/*ナビゲーションナンバリング*/
.slick-dots {
	position: absolute;
	z-index: 3;
	text-align:center;
	margin: 0 0 0 0 !important;
	left: -1em;
	padding-top: 1.5em;
	counter-reset: li;
}
.slick-dots li {
	display:inline-block;
	margin: .5em .7em 0 0;
}
@media print, screen and (min-width: 768px){
	.slick-dots li { margin: .5em .5em 0 0; }
}

/* ナビゲーションボタン */
.slick-dots button {
	border: solid 1px #fff;
	outline: none;
	width: 2em;/*ドットボタンのサイズ*/
	height: 2em;/*ドットボタンのサイズ*/
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	padding: 0;
	font-size: clamp(1.125rem, 0.852rem + 1.36vw, 1.875rem);
	color: #0b3da9;
	line-height: 1;
	display: block;
	background: #fff;/*ドットボタンの色*/
	margin: 0 auto;
	/* counter-increment: li; */
	/* content: counter(li, decimal-leading-zero); */
	/* content: counter(li); */
}

.slick-dots .slick-active button{
	color: #fff;
	background:#0b3da9;/*ドットボタンの現在地表示の色*/
}


@media print, screen and (min-width: 768px){
	.slideouter {position: relative; height: fit-content;}
	.slideinner_box  {
		display: flex;
		justify-content: space-between;
		width: 100%;
		padding: 1em;
	}
	.slide {
		display: flex;
		justify-content: space-between;
		width: 100%;
	}
	.slide_img{ width: 35%;}
	.slide_txtbox { width: 62%;}
}

.slide_txt {color: #000; margin: 0; font-size: clamp(1rem, 0.818rem + 0.91vw, 1.5rem);}


.jobdescmess_area { padding-top: 3.5em;}
.jobdescmess_txt > br { line-height: 1;}
.jobdescmess_img img { display: block; width: 100%; height: auto;}
.jobdescmess_txt { font-size: 110%;}
.jobdescmesstxt_area { margin-top: 2em;}

@media print, screen and (min-width: 768px){
	.jobdescmess_area { padding-top: 4.5em;}
	.jobdescmesstxt_area { display: flex; justify-content: space-between;}
	.jobdescmess_txt { width: 65%;}
	.jobdescmess_img { width: 30%;}
}
@media print, screen and (min-width: 1025px){
.jobdescmess_txt { font-size: 170%;}
}


/* ナンバリング */
.slide_txtbox { 
	position: relative;
	display: inline-block;
	z-index: 1;
}
.slide_number {
	position: absolute;
	top: 0;
	right: 0;
	line-height: .8;
	font-family: "Oswald", sans-serif; font-weight: 700;
	font-size: clamp(5rem, 2.273rem + 13.64vw, 12.5rem);
	color: #f0f0f0;
	z-index: -1;
}



/* =====================================
			未経験でもプロになれる */
.inexpr_area {background-color: #fff;}
.inexpr_conts .top_title {
	color: #231815;
	border-bottom-color: #231815;
}

.inexpr_box { margin-top: 2.5em !important;}
.certify_box {
	position: relative;
	margin-top: 2.5em;
	padding: 2.5em 1em 1em;
	border: solid 1px #0b3da9;
}

@media print, screen and (min-width: 768px){
.chart_sec {
	display: flex;
	justify-content: center;
}
.chartbox01 { margin-bottom: 0;}
.chartbox01_outer { width: 55%;}
.graphdesc_area {margin: 0; width: 40%;}
.circle_outer { margin: 0;}
}
@media print, screen and (min-width: 1025px){
.inexpr_box { margin-top: 5em !important;}
.certify_box { padding: 4em 1em 1em; margin-top: 7em;}
}

/* @media print, screen and (min-width: 1025px){
	.inexpr_box {
		display: flex;
		justify-content: space-between;
		width: min(100%, 1440px);
	}
} */



.inexpr_title {
	position: absolute;
	text-align: center;
	display: block;
	color: #231815;
	top: -.25em;
    left: 50%;
    transform: translate(-50%, -.25em);
	width: max-content;
}

/* 未経験者グラフ */

.chartbox01 { position: relative; margin-bottom: 1em;}
.circle_data {
	width: min(60%,450px);
	height: min(60%,450px);
}
.circle_outer {
 position: relative;
}


.circle {
 display:inline-block;
 transform:rotate(-90deg);
 bottom: 0;
 margin: 0 auto;
}
.circle .type {
 fill:transparent;
 stroke-width:100;
}
.circle .type1 {
 stroke: #ddd;
 stroke-width:101;
}

.circle .type2 {
 stroke: url(#cir_color);
}
linearGradient > stop:first-child {
 stop-color: #ff8e43;
}
linearGradient > stop:last-child {
 stop-color: #ffdd00;
}

.typeA1, .typeA2 { opacity: 0;}
.typeA1.scroll-Anime{
	opacity: 1;
	animation:circleA1 1.2s forwards;
}
@keyframes circleA1{
  0%{stroke-dasharray:0 565;}
  99.9%,to{stroke-dasharray:30, 565;}/*グレー*/
}
.typeA2.scroll-Anime{
	opacity: 1;
	animation:circleA2 1.2s forwards;
}
@keyframes circleA2{
  0%{stroke-dasharray:0 565;}
  99.9%,to{stroke-dasharray:565 565;}
}



/* グラフ中央補足 */
.charttxt_box {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 50%;
	height: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #fff;
	border-radius: 50%;
}
.charttxt {
	color: #444;
	margin: 0;
	font-weight: 900;
	font-family: 'Noto Sans JP';
	line-height: 1.2;
}


@media print, screen and (min-width: 1025px){
	.charttxt_box {
		width: 50%;
		height: 50%;	
	}
	.charttxt {
		font-size: clamp(1rem, 0.614rem + 1.93vw, 2.063rem);
		line-height: 1.2;
	}

}


/*グラフ内横説明 */

.chart_desc {position: absolute; text-align: right;}
.chart_desc01 { bottom: 25%; right: -50%;}
.chart_desc02 { top: -4%; right: 0em;}

@media print, screen and (min-width: 499px){
.chart_desc01 { bottom: 6em; right: -7em;}
.chart_desc02 { top: 1%; right: 2em;}
}
@media print, screen and (min-width: 768px){
.chart_desc01 { bottom: 3em; right: -8em;}
.chart_desc02 { top: -1%; right: -1em;}
}
@media print, screen and (min-width: 1025px){
.chart_desc02 {
	top: -3%;
	right: 0%;
}
.chart_desc01 { bottom: 3em; right: -8em;}
}
@media print, screen and (min-width: 1360px){
.chart_desc02 {
	top: 0;
	right: 8%;
	transform: translate(0%, -8%);
}
.chart_desc01 { bottom: 3em; right: -8em; font-size: 120%;}
}


.chart_arrow01 { width: 130px; width: 30vw; right: 0px; bottom: 20px;}  
.chart_arrow02 { width: 6em; right: -10px; bottom: 0;}

@media print, screen and (min-width: 500px){
	.chart_arrow01 { width: 10em; bottom: 30px; right: 0px; margin-top: -1em;}
}

@media print, screen and (min-width: 768px){
	.chart_arrow { width: 8em;}
	.chart_arrow01 { width: 12em; bottom: 40px;}
}

.graphdesc_area p {color: #231815; font-weight: 700;}

.graphdesc_point { color: #333; font-size: 85%; text-align: center;}

.txtAnime {margin: 0; line-height: 1.2; font-family: 'Noto Sans JP'; font-weight: 900;}
.leftAnimeInner {
	text-align: right;
	width: fit-content;
	font-weight: 700;
}

/* 資格取得 */
.inexpr_conts > .mid_title01 { color: #0b3da9;}
.popup_img_pc .popup_img {width: 30%;}
.popup_img_pc {
	display: flex; justify-content: space-between;
	width: 100%;
}



/* 収入UP */
/*------------------------------------
		bar graph
------------------------------------*/
.income.certify_box { margin-bottom: 0;}

@media print, screen and (min-width: 768px){
	.incomeimg_box {
		display: flex;
		margin-bottom: 1em;
	}
}
.income_img {
	width: 100%;
	margin: 0 auto 1em;
}
@media print, screen and (min-width: 768px){
	.income_img {
		margin-bottom: 1em;
	}
	.income_img img {width: 95%; margin: 0 auto;}
}

.g_title {
	color: #0b3da9;
	font-family: "Noto Sans JP";
	font-weight: 900;
	text-align: center;
	margin: 0 auto 1em;
	font-size: 120%;
}
.graph_outer {position: relative;}
.graph_cont {
	position: relative;
	display: flex;
	justify-content: center;
	height: 18em;
	max-height: 600px;
	width: 100%;
	margin: 0 1em 2em 2em;
}

.ydesc_outer {
	position: absolute;
	display: flex;
	flex-flow: column;
	justify-content: space-between;
	width: 3.3em;
	height: calc(100% + .8em);
	top: -.3em;
	left: -3em;
}
.ydesc{
	position: relative;
	font-family: "Noto Sans JP";
	font-size: 80%;
	font-weight: 700;
}
.ydesc_outer > .ydesc:first-child{
	font-size: 70%;
	color: #0b3da9;
}
.ydesc_outer > .ydesc::before {
	position: absolute;
	content: "";
	left: 4.0em;
	top: .8em;
	width: min(67vw, 900px);
	height: 1px;
	border-top: 1px dashed #999;
}
.ydesc_outer > .ydesc:first-child:before,
.ydesc_outer > .ydesc:last-child:before {
	border: none;
}

.graph {
	position: relative;
	width: 40%;
	height: 100%;
	/* max-height: 13em; */
}
.varouter {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%;
	border-bottom: 2px solid #000;
}
.graph_cont > .graph:nth-child(6) > .varouter {
	width: 60%;
}

.exincome01, .exincome02 {
	width: 40%;
	min-width: 37px;
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
}
@media print, screen and (min-width: 1025px){
.exincome01, .exincome02 { width: 50%;}
}
.exincome01 {
	bottom: calc(15% *2.5);
}
.exincome02 {
	bottom: calc(27% *2.5);
}

.graph_cont > .graph:nth-child(1) .varouter:before{
	position: absolute;
	content: "";
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	border-left: 2px solid #000;
}

.var{
	position: absolute;
	background-color: #0b3da9;
	min-width: 30px;
	width: 50%;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0 auto;
	height: 100%;
	/* animation: graphAnim 1.5s forwards; */
	opacity: 0;
}

.var01.scroll-Anime {
	height: calc(13.5% *2.5);
	opacity: 1;
	animation: graphAnim 0.3s forwards;
}

.var02.scroll-Anime {
	height: calc(17% *2.5);
	opacity: 1;
	animation: graphAnim 0.6s forwards;
}

.var03.scroll-Anime {
	height: calc(25% *2.5);
	opacity: 1;
	animation: graphAnim 0.9s forwards;
}

.var04.scroll-Anime {
	height: calc(35% *2.5);
	opacity: 1;
	animation: graphAnim 1.2s forwards;
}

.var05.scroll-Anime {
	height: 0%;
	opacity: 1;
	animation: graphAnim 1.5s forwards;
}

@keyframes graphAnim {
	0% {
			transform: translateY(100%);
	}
	100% {
			transform: translateY(0);
	} 
}



.varname {
	position: absolute;
	font-size: 80%;
	font-weight: 700;
	color: #000;
	left: 0;
	right: 0;
	margin: 0 auto;
	bottom: -1.5em;
	line-height: 1;
	vertical-align: middle;
}

.varname.xdesc {
	font-size: 50%;
	font-family: "Noto Sans JP";
	bottom: -2em;
	color: #0b3da9;
}

@media print, screen and (min-width: 768px){
.varname.xdesc {
	font-size: 70%;
	bottom: -1.6em;
	color: #0b3da9;
}
}

.incomechart_txt{
	position: absolute;
	width: min(25vw, 230px);
	bottom: 0.5em;
	right: 1.5em;
}
@media print, screen and (min-width: 1200px){
	.incomechart_txt{
		position: absolute;
		width: min(27vw, 270px);
		bottom: 0.5em;
		right: 1.5em;
	}
}

.income_arrow {
	position: absolute;
	content: "";
	width: 60vw;
	bottom: 3em;
	left: 1em;
	transform: rotate(-12deg);
	opacity: 0;
}
.point_arrow {
	display: block;
    width: 100%;
    height: auto;
}
@media print, screen and (min-width: 768px){
.point_arrow { width: 80%;}
}

.income_arrow.scroll-Anime {
	opacity: 1;
}

.income_arrow {
  opacity: 1;
  transform: translateY(0);
  transition: opacity .2s ease-in;
}

.income_arrow {
  opacity: 0;
  transform: translateY(20px);
}


@media print, screen and (min-width: 1025px){
	.income_arrow {
		position: absolute;
		content: "";
		bottom: 0;
		left: 3em;
		transform: rotate(4deg);
        width: auto;
	}
}
@media print, screen and (min-width: 1360px){
	.income_arrow {
		left: 9em;
	}
}

/* =====================================
			募集要項 */

.recruit_area {background-color: #FCFFE4;}

.recruit_area .top_title { color: #44A90B; border-bottom: solid 3px #44A90B;}

.recruit_box {
	padding: 1em;
	background-color: #fff;
	margin-bottom: 1.5em;
}

@media print, screen and (min-width: 1025px){
.recruit_box { padding: 1.5em;}
}
@media print, screen and (min-width: 1360px){
.recruitbox_outer {
	display: flex;
	justify-content: space-between;
	margin-bottom: 2em;

	}
	.recruit_box { width: 49%;}
	.recruit_box2 {
		width: 49%;
		padding: 0 1em; 
	}
}
	


.recruit_txt .mid_title01{
	margin: 0 auto .5em;
	color: #44A90B;
	border-left-color: #44A90B;
	border-right-color: #44A90B;
}
.recruit_txt .mid_title01::before,
.recruit_txt .mid_title01::after {
	color: #44A90B;
}

.recruit_table {
	width: 100%;
	margin: 0 auto;
}

.recruit_table tr { 
	width: 100%;
	background-image : linear-gradient(to right, #FF9900, #FF9900 5px, transparent 2px, transparent 4px);  /* 幅4の線を作る */
	background-size: 10px 1px;          /* グラデーションの幅・高さを指定 */
	background-position: left bottom;  /* 背景の開始位置を指定 */
	background-repeat: repeat-x;       /* 横向きにのみ繰り返す */
}
.recruit_table th ,.recruit_table td 
{ width: 100%; display: block;}
.recruit_table th { padding: .5em 1em 0;}
.recruit_table td { padding: 0 1em .5em;}

@media print, screen and (min-width: 479px){
	.recruit_table th ,.recruit_table td { display: inline-block;}
	.recruit_table th { width: 30%; padding: .5em 1em;}
	.recruit_table td { width: 70%; padding: .5em 1em;}
}

@media print, screen and (min-width: 768px){
	.recruit_table th, .recruit_table td {
		padding: .3em 1em;	}
}

@media print, screen and (min-width: 1360px){
	.recruit_table th { padding: 1em 1em 1em 0;}
	.recruit_table td { padding: 1em 0 1em 0;}
}


.compatible_area {color: #fff;}
.compatible_area .mid_title01,
.recruit_other .mid_title01 {
	color: #44A90B; 
}


@media print, screen and (min-width: 1025px){
	.compatible_area .mid_title01 { margin-top: 0;}
}
.compatible_list {
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin-bottom: 2em;
}
.compatible_li {
	width: 18%;
	color: #000;
	padding: .5em .5em;
	font-weight: 600;
	text-align: center;
	border: solid 2px #44A90B;
	background-color: #fff;
}
.compatible_li:last-of-type { width: 22%;}

@media print, screen and (min-width: 768px){
	.compatible_li {
		text-align: center;
		background-color: #fff;
	}
}
.recruit_other { margin-bottom: .5em;}
.rec_other_li {
	color: #000;
	padding-bottom: .7em;
	margin-left: 0.1em;
}
.recruit_table_small { font-size: 85%;}
.rec_list_main { font-size: 110%;}

.bold {font-weight: 700;}
.orange { color: #FF9900;}

.recruit_conts > .btn2 { margin: 0 auto;}
@media print, screen and (min-width: 1360px){
	.recruit_conts > .btn2 a::after { left: 10%;}
}

/* =====================================
			先輩インタビュー */

.interview_area .top_title { color: #0B3DA9; border-bottom: solid 3px #0B3DA9;}

.interview_list { margin: 0 auto;}
.interview_li {
	display: flex;
	justify-content: center;
	margin-bottom: 1.5em;
	overflow: hidden;
}
@media print, screen and (min-width: 1260px){
.interview_li { margin-bottom: 3em;}
}
.interview_area .mid_title01 {
	color: #fff;
	margin: 0em auto .5em;
}

.member_area {
	margin-top: 1em;
}
@media print, screen and (min-width: 1360px){
.member_area {
	margin-top: 3em;
}
}

.member_li { margin: 1em 0;}


/* =====================================
			modal */

.section {
	height: 100vh;
}
.section1 {
	background-color: #ccccff;
	display: flex;
	justify-content: center;
	align-items: center;
}
.section2 {
	background-color: #99ccff;
}
.section3 {
	background-color: #ffccff;
}

/**************************\
	Basic Modal Styles
\**************************/

.modal {
	font-family: -apple-system, BlinkMacSystemFont, avenir next, avenir,
			helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif;
}

.modal__overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.6);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 950;
	padding: 0 3%;
}

.modal__container {
	background-color: #fff;
	max-width: 100vw;
	max-height: 95vh;
	border-radius: 4px;
	overflow-y: auto;
	box-sizing: border-box;
	width: 100%;
}

/* @media screen and (max-width: 480px) {
	.modal__container {
			max-height: 90vh;
			max-width: 300px;
	}
} */

.modal__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}

.modal__title {
	width: 100%;
	padding: .7em;
	margin-bottom: 1.5em;
	font-weight: 700;
	text-align: center;
	color: #fff;
	background-color: #0b3da9;
	box-sizing: border-box;
	font-size: clamp(1.25rem, 1.023rem + 1.14vw, 1.875rem);
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
}
.modaltop_img { margin-bottom: 2em;}
@media print, screen and (min-width: 1025px){
.modaltop_img { margin-bottom: 3.5em;}
}

.modal__close {
	position: absolute;
	right: 0;
	background: #fff;
	border: 0;
	border-radius: 0%;
	color: #0b3da9;
	width: 3.5em;
	height: 3.5em;
	cursor: pointer;
	padding: 0;
	border: none;
}

.modal__content .modal__close:before {
	content: "\2715";
	color: #0b3da9;
	display: block;
	justify-content: center;
	font-size: clamp(2.125rem, 1.898rem + 1.14vw, 2.75rem);
    line-height: .8;
}

.modal__content {
	position: relative;
	margin-bottom: 1em;
	line-height: 1.5;
	color: rgba(0, 0, 0, 0.8);
}



.modal__content {color: #231815;}
.modal_q {
	color: #0b3da9;
	font-size: clamp(1rem, 0.795rem + 1.02vw, 1.563rem);
	font-weight: 700;
	margin-bottom: .3em;
}
.modal_answer {
	color: #231815;
	margin-bottom: 2.5em;
}
.m_bold { font-weight: 700;}
.modal_img {width: 75%; margin: auto;}
.modal_qabox {
	width: 100%;
    padding-left: 3%;
    padding-right: 3%;
}

@media print, screen and (min-width: 1025px){
.modal_qabox {
	max-width: 670px;	
}
.modal_img {width: 52.7%; margin: 0;}
.modal_box {display: flex; justify-content: end;}
.modal_box:last-of-type {flex-direction: row-reverse; justify-content: start;}
}

.modal_img { margin-bottom: 2em;}
@media print, screen and (min-width: 768px){
.modal_img { margin-bottom: 3em;}
}

.modal_recruit {
	margin-bottom: 2em;
	border: 1px solid #0b3da9;
}
.modal_recruit > .modal_q {
	background-color: #0b3da9;
	line-height: 2;
	padding-left: .5em;
	color: #fff;
	font-size: 140%;
	margin-bottom: 0;
}
.modal_recruit > .modal_answer {
	padding: 1em;
	margin-bottom: 0;
}

.modal__footer {
	display: flex;
	justify-content: center;
}

.modal_btn {
	transition: all .2s ease;
}
@media print, screen and (min-width: 1025px){
.modal_btn:hover {
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}
}

.modal_btn-primary {
	background-color: #0b3da9;
	border: none;
	padding: 0;
}

.modal_fbtn {
	background-color: #0b3da9;
	padding: .5em 1.2em;
    margin-bottom: 1.5em;
    margin-right: 0;
    color: #fff;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
}

/**************************\
	Demo Animation Style
\**************************/
@keyframes mmfadeIn {
	from {
			opacity: 0;
	}
	to {
			opacity: 1;
	}
}

@keyframes mmfadeOut {
	from {
			opacity: 1;
	}
	to {
			opacity: 0;
	}
}

@keyframes mmslideIn {
	from {
			transform: translateY(15%);
	}
	to {
			transform: translateY(0);
	}
}

@keyframes mmslideOut {
	from {
			transform: translateY(0);
	}
	to {
			transform: translateY(-10%);
	}
}

.micromodal-slide {
	display: none;
}

.micromodal-slide.is-open {
	display: block;
}

.micromodal-slide[aria-hidden="false"] .modal__overlay {
	animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="false"] .modal__container {
	animation: mmslideIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__overlay {
	animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__container {
	animation: mmslideOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide .modal__container,
.micromodal-slide .modal__overlay {
	will-change: transform;
}


/* スライド */
.mis img { display: block; width: 280px;}
.mis li { margin-right: 1em;}
@media print, screen and (min-width: 1025px){
.mis img { width: 27vw;}
}


/* =====================================
	採用エントリー */

.entryform_area {background-color: #FCFFE4;}
.entryform_conts > .top_title, .mailform_txt01, .mailform_txt02 {
	color: #FF9900; border-bottom: solid 3px #FF9900;
}

.entryform_conts {
	max-width: 1000px;
    margin: auto;
}

.entryformarea_inner {
	background: #fff;
	padding-top: 2em;
    padding-bottom: 2em;
}
@media print, screen and (min-width: 1025px){
.entryformarea_inner {
	padding-top: 3em;
    padding-bottom: 3em;
}
}


.entry_list_title {
    text-align: center;
    font-weight: 700;
    margin-top: 1.5em;
    font-size: 130%;
    margin-bottom: .3em;
	font-family: 'Noto Sans JP', serif;
    font-weight: 900;
    color: #ff9900;
	letter-spacing: .05rem;
}
@media print, screen and (min-width: 1025px){
.entry_list_title { font-size: 160%;}
}

.entry_list_title_sub {
	margin-bottom: .7em;
}
.entry_list_title_sub span {
	font-weight: 700;
	background: linear-gradient(transparent 60%, #FFEE56 60%);
}
.entry_list img { display: block; width: 100%; height: auto}
.entry_list { margin-bottom: 1em;}


.sns_link_list li img { display: block; width: 100%; height: auto;}
.sns_link_list li { width: 90%; margin-right: auto; margin-left: auto;}
.sns_link_list li + li { margin-top: 1em;}

@media print, screen and (min-width: 768px){
.sns_link_list {
 display: flex;
 justify-content: space-between;
 flex-wrap: wrap;
}
.sns_link_list li {
	width: 48%;
	margin-right: 0;
	margin-left: 0;
}
.sns_link_list li + li { margin-top: 0;}
.sns_link_list li + li + li { margin-top: 1.5em;}
}

.sns_link_list li a { transition: all .2s ease;}
@media print, screen and (min-width: 1025px){
.sns_link_list li a:hover { opacity: .7;}
}

.form_present img { display: block; width: 100%; height: auto;}
.form_present { margin-top: 1.5em;}


/* お知らせ */
.year-end {
	padding: 1.5em;
	background: #fcffe4;
	margin-bottom: 2.5em;
	font-size: 90%;
}
.year-end_title { margin-bottom: .7em; font-weight: 700; font-size: 110%;}
.year-end p { color: #000;}
.year-end_bold {
	font-weight: 700;
	background: linear-gradient(transparent 60%, #fff68e7d 60%);
    display: inline;
}

.news_list li {
	border-bottom: solid 1px rgb(190, 190, 190);
	padding-bottom: .3em;
}
.data_year { margin-right: 1em; display: block;}
@media print, screen and (min-width: 1025px){
.data_year { display: inline-block;}
}

.entry_sub_txt {
	color: #000;
	text-align: center;
	margin-top: 1.5em;
	font-weight: 700;
}


/* =====================================
	谷川内装YouTube */

.youtube_title img { display: block; width: 100%; height: auto;}
.youtube_title {
	max-width: 850px;
	width: 90%;
	margin-bottom: 1.5em;
}
@media print, screen and (min-width: 1025px) {
.youtube_title { margin-bottom: 2em;}
}

.swiper_title {
    position: relative;
    width: fit-content;
    font-size: clamp(1.5rem, 0.909rem + 2.95vw, 3.125rem);
    font-family: 'Noto Sans JP', serif;
    font-weight: 700;
    line-height: 1.4;
    padding: 0 .5rem;
    border-left: .1rem solid;
    border-right: .1rem solid;
    display: flex;
	color: #fff;
    margin: 0em auto 1em;
}
.swiper_title::before {
    position: absolute;
    content: "";
    width: 120%;
    height: 100%;
    border-left: .4em solid;
    top: 0;
    left: -.5em;
}
.swiper_title::after {
    position: absolute;
    content: "";
    width: 120%;
    height: 100%;
    border-right: .4em solid;
    top: 0;
    right: -.5em;
}
@media print, screen and (min-width: 768px) {
.swiper_title {
	padding: 0 1rem;
}
.swiper_title::before {
	left: -.6em;
}
.swiper_title::after {
	right: -.6em;
}
}

.swiper_cont > .top_title { color: #000;}

.swiper_cont { overflow: hidden; margin-top: 6em;}
@media print, screen and (min-width: 768px) {
.swiper_cont { margin-top: 7.5em;}
}

.swiper {
	max-width: 430px;
    width: 100%;
    height: 433px;
    margin: auto;
    overflow: visible !important;
}
@media print, screen and (min-width: 500px){
.swiper { height: 632px;}
}

.swiper-slide {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}
iframe {
	width: 100%;
	height: 100%;
	border: none;
	border-radius: 12px;
}

.swiper-button-prev:after,
.swiper-button-next:after {
	color: #ff0000 !important;
    text-shadow: 1px 1px 0 #FFF, -2px -2px 0 #FFF, -2px 2px 0 #FFF, 1px -2px 0 #FFF, 0px 2px 0 #FFF, 0 -2px 0 #FFF, -2px 0 0 #FFF, 2px 0 0 #FFF;
	font-weight: 700;
}


/* オーバーレイ
.swiper-slide::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgb(246 246 246 / 66%);
	border-radius: 12px;
	pointer-events: none;
	transition: opacity 0.3s;
	opacity: 1;
}
.swiper-slide-active::after {
	opacity: 0;
}
*/

.marker {
	background: linear-gradient(transparent 60%, #FFEE56 60%);
    margin: 0 .2em;
}