@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Quicksand:wght@300..700&display=swap');

/*------------------------------------------------------

	リセット

------------------------------------------------------*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font-style: normal;
	font-weight: 400;
	vertical-align: baseline;
	background: transparent;
}
body { line-height: 1;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}
ul { list-style: none;}
blockquote, q { quotes: none;}
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none;}
a {
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
table { border-collapse: collapse; border-spacing: 0;}
hr {
	display: block;
	height: 0px;
	border: 0;
	border-bottom: 1px solid #707070;
	margin: 0;
	padding: 0;
}
input, select { vertical-align: middle;}
img {
	max-width: 100%;
	height: auto;
	border: none;
	vertical-align: top;
	-webkit-backface-visibility: hidden;
	image-rendering: -webkit-optimize-contrast;
}
*, *:before, *:after { box-sizing: border-box;}


/*------------------------------------------------------

	グローバル

------------------------------------------------------*/

body {
	font-family: "Noto Sans JP", sans-serif;
	color: #111111 ;
	font-size: 1em;
	line-height: 1.8;
	position: relative;
	min-width: 1030px;
}

p { margin-bottom: 25px;}
p:last-child { margin-bottom: 0px;}

a { color: #111111; text-decoration: none;}
a:hover, a:active { color: #1571DA;}

.fo_quick { font-family: "Quicksand", sans-serif;}

/* 文字装飾 */
.fo06 { font-size: 0.6em !important;}
.fo07 { font-size: 0.7em !important;}
.fo075 { font-size: 0.75em !important;}
.fo08 { font-size: 0.8em !important;}
.fo085 { font-size: 0.85em !important;}
.fo09 { font-size: 0.9em !important;}
.fo095 { font-size: 0.95em !important;}
.fo105 { font-size: 1.05em !important;}
.fo11 { font-size: 1.1em !important;}
.fo115 { font-size: 1.15em !important;}
.fo12 { font-size: 1.2em !important;}
.fo125 { font-size: 1.25em !important;}
.fo13 { font-size: 1.3em !important;}
.fo14 { font-size: 1.4em !important;}
.fo145 { font-size: 1.45em !important;}
.fo15 { font-size: 1.5em !important;}
.fo16 { font-size: 1.6em !important;}
.fo17 { font-size: 1.7em !important;}
.fo18 { font-size: 1.8em !important;}

.lh12 { line-height: 1.2;}
.lh14 { line-height: 1.4;}
.lh16 { line-height: 1.6;}
.lh18 { line-height: 1.8;}
.lh20 { line-height: 2;}
.lh22 { line-height: 2.2;}

.ls005 { letter-spacing: 0.05em;}
.ls01 { letter-spacing: 0.1em;}
.ls02 { letter-spacing: 0.2em;}

.fo_white { color: #FFFFFF !important;}
.fo_blue { color: #1571DA !important;}
.fo_blue02 { color: #00387C !important;}
.fo_gray { color: #999999 !important;}

/* ボックス */
.cont1200 { max-width: 1230px; padding: 0px 15px; margin: 0px auto;}
.cont1000 { max-width: 1030px; padding: 0px 15px; margin: 0px auto;}
.cont920 { max-width: 950px; padding: 0px 15px; margin: 0px auto;}

.left { float: left;}
.right { float: right;}

.pos_rel { position: relative;}
.pos_ab { position: absolute;}

.medium, .medium * { font-weight: 500;}
.semi, .semi * { font-weight: 600;}
.bold, .bold * { font-weight: 700;}

.break_keep { word-break: keep-all; overflow-wrap: anywhere;}

.ta_center { text-align: center;}
.ta_right { text-align: right;}
.ta_left { text-align: left;}
.ta_right-s_center { text-align: right;}
.ta_left-s_center { text-align: left;}
.ta_center-s_left { text-align: center;}

.back_white { background-color: #fff !important;}
.back_blue { background-color: #DFF3FF !important;}

.z50 { z-index: 50;}
.z-1 { z-index: -1;}

@media (min-width: 861px) {
	.hidden_l { display: none !important;}
}

/* リスト */
ol { padding-left: 2em;}
ol li { list-style: outside decimal;}

.list_indent { padding-left: 1em;}
.list_indent li { text-indent: -1em;}

.list_disc { padding-left: 1em;}
.list_disc li { list-style: outside disc;}

/* margin */
.mb00 { margin-bottom: 0px !important;}
.mb05 { margin-bottom: 5px !important;}
.mb10 { margin-bottom: 10px !important;}
.mb15 { margin-bottom: 15px !important;}
.mb20 { margin-bottom: 20px !important;}
.mb25 { margin-bottom: 25px !important;}
.mb30 { margin-bottom: 30px !important;}
.mb40 { margin-bottom: 40px !important;}
.mb50 { margin-bottom: 50px !important;}
.mb60 { margin-bottom: 60px !important;}
.mb80 { margin-bottom: 80px !important;}

.mb40-20 { margin-bottom: 40px !important;}
.mb50-30 { margin-bottom: 50px !important;}
.mb60-30 { margin-bottom: 60px !important;}
.mb80-40 { margin-bottom: 80px !important;}
.mb100-60 { margin-bottom: 100px !important;}
.mb120-60 { margin-bottom: 120px !important;}
.mb160-80 { margin-bottom: 160px !important;}

/* clearFix */
.clearFix { zoom: 100%;}
.clearFix:after {
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}

/* ------------------------
	ヘッダー
------------------------ */

body { padding-top: 120px;}

.header { position: fixed; top: 0; left: 0; width: 100%; min-width: 1000px; z-index: 9999; display: flex; justify-content: space-between; align-items: center; padding: 20px 0 20px 2%;}
.header .box01 { display: flex; align-items: center; gap: 4em;}
.header_btn a { display: block; background: #1571DA; color: #fff; font-size: 1.2em; padding: 1.2em 2em 1.2em 2.5em; transition: 0.2s;}
.header_btn a:after { content: ""; display: inline-block; vertical-align: middle; margin-left: 0.3em; background: url("../images/recruit/common/ico_link.svg") no-repeat center center; background-size: 100% auto; width: 0.85em; height: 1em;}
.header_btn a:hover { background: #E98E27;}

.gn { display: flex; gap: 2.5em; align-items: center;}

body.under { padding-top: 80px;}
body.under .header { padding: 0 0 0 2%;} 

@media only screen and (max-width: 1230px) {
  .header h1 { width: 25%;}
  .header .box01 { gap: 2.5vw;}
  .gn { gap: 2vw;}
}


/* ------------------------
	フッター
------------------------ */

.cmn_btn { padding: 100px 0;}
.cmn_btn ul { display: flex; gap: 3em;}
.cmn_btn li { width: calc((100% - 3em) / 2);}
.cmn_btn a { display: flex; align-items: center; background: url("../images/recruit/common/cmn_bnr_bg.svg") no-repeat center center #1571DA; background-size: auto 110%; padding: 3.5em 2em; gap: 2em; transition: 0.3s;}
.cmn_btn li:last-child a { background-color: #00387C;}
.cmn_btn h2 { font-size: 2.2em;}
.cmn_btn a:hover { background-size: auto 130%;}
.cmn_btn .btn_area { flex: 1; padding: 0.35em 0 0.35em 1.3em; z-index: 50}
.cmn_btn .btn_area:before { content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: 2.5em; background: url("../images/recruit/common/ico_arrow.svg") no-repeat calc(100% - 0.8em) center #00387C; background-size: 1em auto; transition: 0.3s;}
.cmn_btn li:last-child .btn_area:before { background-color: #1571DA; background-image: url("../images/recruit/common/ico_link.svg"); background-position: calc(100% - 0.7em) center;}
.cmn_btn a:hover .btn_area:before { width: 100%; z-index: -1;}
.cmn_btn a:hover .btn_area { color: #fff !important;}

.footer { background: #1F2A3B; padding: 80px 0 30px;}
.footer_nav { display: flex; justify-content: space-between;}
.footer_nav a { color: #fff;}
.footer_nav a:hover { color: #1A81F6;}
.footer_nav > li > a { font-weight: bold;}
.footer_nav li ul { margin-top: 0.5em;}
.footer_nav li li a { display: inline-block; position: relative; padding-left: 1em; margin-left: 1.2em;}
.footer_nav li li a:before { content: ""; position: absolute; width: 0.5em; height: 1px; background: #1A81F6; left: 0; top: 50%;}

.footer .box01 { display: flex; justify-content: center; align-items: center; gap: 2em;}
.footer .box01 .btn_area { right: 0; top: 0;}


/*------------------------------------------------------

	トップページ

------------------------------------------------------*/

.main_slider_wrap { margin-bottom: -100px; z-index: 500;}
.main_slider .box01 { display: flex; flex-flow: row-reverse; justify-content: space-between; align-items: center;}
.main_slider .box01 figure { width: 60%; min-width: 0; aspect-ratio: 880 / 600;}
.main_slider .box01 figure img { width: 100%; height: 100%; object-fit: cover; display: block;}
.main_slider .text_box { flex: 1 1 40%; min-width: 0; display: flex; flex-flow: column; padding-left: 1em; font-size: 4vw; letter-spacing: 0.05em; padding-bottom: 100px;}

.top_en_ttl { text-transform: uppercase; font-size: 5em;}

.back_pad { padding: 100px 0;}

.top_sec01 { padding: 200px 0 150px;}
.top_sec01 p:not(:last-child) { margin-bottom: 2em;}
.top_sec01 .text01 { font-size: 2.3em;}
.top_sec01 .text02 { font-size: min(6.5vw,5.2em); line-height: 0.7; bottom: 0; text-transform: uppercase; width: 100%; left: 50%; transform: translateX(-50%);}

.staff_slider_wrap .bx-wrapper { margin: auto;}

.top_sec02 .ttl_box { display: flex; justify-content: space-between; gap: 2.5em;}
.top_sec02 .box01 { display: flex; gap: 7%;}
.top_sec02 .box01 section { width: 46.5%;}
.top_sec02 .box01 .box_inner { padding: 2em;}

.top_sec03 .ttl_box { display: flex; justify-content: space-between;}
.top_sec03 .ttl_box > figure { width: 58%;}
.top_sec03 .ttl_box .text01 { display: flex; flex-flow: column; align-items: flex-start; gap: 0.6em; font-size: min(3.3vw,2.5em); margin-right: -5em;}
.top_sec03 .ttl_box .text01 span { line-height: 1; padding: 0.25em 0.2em 0.25em 0;}

.top_sec04 .list01 { display: flex; flex-wrap: wrap; padding: 2em; gap: 2em 0;}
.top_sec04 .list01 li { width: 33.3333%;}

.top_sec05 .list01 { display: flex; justify-content: center; flex-wrap: wrap; gap: 60px 9%; max-width: 1100px; margin: auto;}
.top_sec05 .list01 li { width: calc(82% / 3);}

.top_sec06 .box01 { padding-top: 100px;}
.work_box { display: flex; justify-content: space-between; flex-flow: row-reverse; align-items: flex-start; gap: 5%;}
.work_box .box_inner { width: 36%;}
.work_box > figure { background: #fff; padding: 20px; flex: 1; position: relative;}
.work_box h3 { font-size: min(2.8vw,2em); letter-spacing: 0.05em; margin-right: -3em; margin-top: 1em;}
.work_box .fig-prev, .work_box .fig-next { position: absolute; z-index: 50; background: url("../images/recruit/top/work/ico_prev.svg") no-repeat center center; background-size: 100% auto; width: 30px; height: 30px; border: none; outline: none; top: 50%; transform: translateY(-50%); cursor: pointer;}
.work_box .fig-prev { left: 5px;}
.work_box .fig-next { right: 5px; transform: translateY(-50%) scale(-1,1);}
.work_box .fig-pause { position: absolute; width: 30px; height: 30px; background: url("../images/recruit/top/work/ico_pause.svg") no-repeat center center; background-size: 100% auto; color: #fff; text-align: center; border: none; outline: none; bottom: 0px; left: -30px; cursor: pointer;}
.work_box .fig-pause.play { background-image: url("../images/recruit/top/work/ico_play.svg");}

.work_thumb_wrap { transform: translateY(50%);}
.work_thumb_slider { display: flex; gap: 1.3em;}
.work_thumb_slider a { display: block; position: relative;}
.work_thumb_slider a:after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,0.2); z-index: 50;}
.work_thumb_slider a.active:after { display: none;}

.top_sec06 .box02 { display: flex; justify-content: center; align-items: center; gap: 5%;}

.top_sec07 section { display: flex;}
.top_sec07 section:nth-of-type(odd) { flex-flow: row-reverse;}
.top_sec07 section .box_inner { width: 700px; display: flex; align-items: center; padding: 2em;}
.top_sec07 section > figure { flex: 1;}
.top_sec07 section > figure img { width: 100%; height: 100%; object-fit: cover;}
.top_sec07 section h3 { font-size: min(3.5vw,1.8em);}

.top_sec07 section:nth-of-type(1) .box_inner { padding-right: 16%;}
.top_sec07 section:nth-of-type(1) .pos_ab { bottom: -20px; right: -40px;}
.top_sec07 section:nth-of-type(2) .box_inner { padding-left: 16%;}
.top_sec07 section:nth-of-type(2) .pos_ab { bottom: 0px; left: -30px;}
.top_sec07 section:nth-of-type(3) .box_inner { padding-right: 16%;}
.top_sec07 section:nth-of-type(3) .pos_ab { bottom: 0px; right: -70px;}
.top_sec07 section:nth-of-type(4) .box_inner { padding-left: 16%;}
.top_sec07 section:nth-of-type(4) .pos_ab { bottom: 0px; left: -40px;}
.top_sec07 section:nth-of-type(5) .box_inner { padding-left: 14%;}
.top_sec07 section:nth-of-type(5) .pos_ab { bottom: 0px; left: 10px;}
.top_sec07 section:nth-of-type(5) h3 { margin-right: -1em;}

@media only screen and (max-width: 1250px) {
  .top_sec07 section:nth-of-type(1) .pos_ab { width: 27%; bottom: -4.8%; right: -1%;}
  .top_sec07 section:nth-of-type(2) .pos_ab { width: 21%; left: -1%;}
  .top_sec07 section:nth-of-type(3) .pos_ab { width: 27%; right: -1%;}
  .top_sec07 section:nth-of-type(4) .pos_ab { width: 22%; left: -1%;}
  .top_sec07 section:nth-of-type(5) .pos_ab { width: 18%;}
}

.top_sec08 .ttl_box { display: flex; justify-content: space-between; gap: 2.5em;}
.top_sec08 .list01 { display: flex;}
.top_sec08 .list01 li { width: 25%;}
.top_sec08 .list01 .box_inner { padding: 1.3em 0.5em 0;}
.top_sec08 .pos_ab { left: 1em; bottom: 1em; z-index: 50; text-transform: uppercase; font-size: 0.9em; line-height: 1.2; letter-spacing: 0.05em;}
.top_sec08 .pos_ab .num { font-size: 4em; line-height: 1;}

.top_sec09 .btn_area a { display: flex; flex-flow: row-reverse; max-width: 1000px; margin: auto; }


/*------------------------------------------------------

	下層ページ

------------------------------------------------------*/

/* 共通 */
.show_sp { display: none;}
.over_hidden, .img_hover { overflow: hidden;}

.img_hover img { transition: 0.3s;}
a:hover .img_hover img, .img_hover a:hover img, a.img_hover:hover img { transform: scale(1.05);}

.more_btn a {
	display: inline-block;
	max-width: 240px;
	width: 100%;
	text-align: center;
	text-decoration: none;
	position: relative;
	color: #fff;
	line-height: 1.6;
	padding: 0.75em 1.5em 0.75em 1em;
	letter-spacing: 0.05em;
	border-radius: 60px;
	background: url("../images/recruit/common/more_btn_red.svg") no-repeat calc(100% - 1.5em) center #242A33;
  background-size: 0.7em auto;
  font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: bold;
  font-size: 1.2em;
  transition: 0.3s;
}
.more_btn a:hover { background-color: #AF1F24; background-image: url("../images/recruit/common/more_btn_white.svg");}

a.link { background: url("../images/recruit/common/ico_link_blue.svg") no-repeat right center; background-size: 1rem auto; padding-right: 1.4rem;}
.header a.link { background-image: url("../images/recruit/common/ico_link_blue02.svg");}

a.underline { text-decoration: underline; word-break: break-all;}

.note { background-image: linear-gradient(180deg, transparent 0, transparent calc(100% - 2px), #fff 2px); background-size: 100% 3em; line-height: 3em;}
.note.blue { background-image: linear-gradient(180deg, transparent 0, transparent calc(100% - 2px), #DFF3FF 2px)}

.pagettl { font-size: 3.1em; padding: 1.7em 0;}

/* animation */
.scroll_in { opacity: 0;}
.displayed { animation-fill-mode: both;}

.fadeInUp.displayed {
  animation-name: fadeInUp;
  animation-duration: 0.8s;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
}
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px);}
  to { opacity: 1; transform: translateY(0);}
}

.delay02s { animation-delay: 0.2s;}
.delay04s { animation-delay: 0.4s;}
.delay06s { animation-delay: 0.6s;}
.delay08s { animation-delay: 0.8s;}
.duration2s { animation-duration: 2s;}
.duration3s { animation-duration: 3s;}


/* ------------------------
	details
------------------------ */

.det_sec01 table { width: 100%;}
.det_sec01 tr { border-bottom: solid 1px #ccc;}
.det_sec01 th, .det_sec01 td { padding: 2em; vertical-align: middle;}
.det_sec01 th { width: 16em;}

.det_sec01 .btn_area a { display: inline-block; background: #1571DA; width: 100%; max-width: 520px; padding: 1em 1em 1.5em; transition: 0.3s;}
.det_sec01 .btn_area a:hover { background: #E98E27;}
.det_sec01 .btn_area .fo_quick { font-size: 4em; line-height: 1;}
.det_sec01 .btn_area .text01 { font-size: 1.25em; background: url("../images/recruit/common/ico_link.svg") no-repeat right center; background-size: 1.5em auto; padding-right: 2em;}


/* ------------------------
	interview
------------------------ */

.int_head { font-size: clamp(0.8em,1.2vw,1em);}
.int_head img { width: 100%;}
.int_head figcaption { background: #1571DA; left: 0; bottom: -60px; padding: 1.8em 3.5em 1.8em 3em;}
.int_head dl { display: flex; align-items: center; gap: 2em;}
.int_head dt { width: 7em;}
.int_head .num { -webkit-text-stroke: 1px #fff; font-size: 5em; line-height: 0.9;}
.int_head dd { flex: 1; font-size: 2em;}

.int_sec01 { display: flex; justify-content: space-between; gap: 5%;}
.int_sec01.img_left { flex-flow: row-reverse;}
.int_sec01 .box_inner { width: 53%;}
.int_sec01 > figure { flex: 1;}
.int_sec01 h3 { font-size: clamp(1.8em,3.1vw,2.2em); margin-right: -1em;}

.int_sec02 { background: #EDF4F7; padding: 100px 28% 100px 8%;}
.int_sec02.img_left { background: #EDF4F7; padding: 100px 8% 100px 28%;}
.int_sec02:before, .int_sec02:after { content: ""; position: absolute; z-index: 10; width: 100px; height: 100px; background: linear-gradient(135deg,#fff 0%,#fff 50%,transparent 50%,transparent 100%);}
.int_sec02:before { left: 0; top: 0;}
.int_sec02:after { right: 0; bottom: 0; transform: scale(-1,-1);}
.int_sec02 .box01 { border-radius: 110px; padding: 0 5% 50px 10%;}
.int_sec02 .box01:after { content: ""; position: absolute; width: 2em; height: 2em; background: #fff; right: -1.9em; top: 30%; clip-path: polygon(0 0,100% 0, 0 100%);}
.int_sec02.img_left .box01:after { right: auto; left: -1.9em; transform: scale(-1,1);}
.int_sec02 .box01 h3 { background: #1571DA; display: table; padding: 0.7em 1.3em; transform: translate(-40px,-50%);}
.int_sec02 .box01 h3:before { content: ""; position: absolute; width: 1.4em; height: 50%; top: 0; right: -1.38em; background: #82B9F7; clip-path: polygon(0 0,100% 100%,0 100%); z-index: -2;}
.int_sec02 dl { display: flex; flex-wrap: wrap; gap: 1em; margin-top: 0.5em;}
.int_sec02 dt { width: 4.5em;}
.int_sec02 dd { width: calc(100% - 5.5em);}

.int_sec02.int01 .img01 { right: 9%; bottom: -25px;}
.int_sec02.int02 .img01 { left: 7%; bottom: -25px;}
.int_sec02.int03 .img01 { right: 2%; bottom: -60px;}
.int_sec02.int04 .img01 { left: 7%; bottom: -60px;}

.int_sec03 { display: flex; flex-flow: row-reverse; align-items: flex-start; max-width: 1300px; padding: 0 15px; margin: auto;}
.int_sec03 > figure { width: 63%; padding-top: 30px;}
.int_sec03 .box01 { width: calc(37% + 5em); margin-left: -5em;}
.int_sec03 .box01 .en_ttl { font-size: 3em;}
.int_sec03 .box02 { padding: 2em 0 0 2em;}
.int_sec03 .text01 { margin: 0 -4% 20px 26%;}

