@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');


/* =================== */
/*       pubulic       */
/* =================== */
html {
	overflow-x:hidden;
	scroll-padding-top:150px !important;
}
html,body {
  font-size:clamp(10px, 1.33vw, 20px);
  font-family: "游ゴシック体", "YuGothic", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-weight:400;
	position:relative;
  /*-webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;*/
  overflow-x:hidden;
  letter-spacing:.025em;
  margin:0 auto;
}


.act-font {
  font-family:"Montserrat", serif;
  font-optical-sizing:auto;
  font-weight:400;
  font-style:normal;
}



img {
  width:100%;
  height:auto;
}
.sp-on { display:none; }
a { transition:0.3s ease all; }


.flex-box {
  display:-webkit-box;
  display:flex;
  -webkit-box-pack:justify;
  justify-content:space-between;
  align-items:center;
}

.in-w70 {
	width:70rem;
	margin:0 auto;
	position:relative;
}
.in-w60 {
	width:60rem;
	margin:0 auto;
	position:relative;
}
.in-w55 {
	width:55rem;
	margin:0 auto;
	position:relative;
}

.fadein {
	opacity:0;
	transform:translate(0, 20px);
	transition:1s;
}
.fadein.is-show {
	transform:translate(0, 0);
	opacity:1;
}
.blur {
	filter:blur(10px);
	transition:1.5s;
}
.blur.is-show {
	filter:blur(0);
	opacity:1;
}
.pic-lr {
  overflow: hidden;
  position: relative;
}
.pic-lr.is-show::before {
  animation: pic-lr 1s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  background: #fff;
  content: '';
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}

@keyframes pic-lr {
  100% {
    transform: translateX(100%);
  }
}



/* =================== */
/*       #header       */
/* =================== */
#header {
	height:6rem;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	z-index:100;
	background:#fff;
}
#header .head-main-box { height:100%; }
#header #site-logo { width:15.85rem; }
#header #hamburger {
	display:block;
	width:2.35rem;
	height:2.35rem;
	cursor:pointer;
	z-index:10000;
	position:relative;
	transition:all .5s;
}
#header #hamburger:hover { opacity:.5; }
#header #hamburger .inner_line {
	display:block;
	margin:0 auto;
	width:2.35rem;
	height:.15rem;
	transition:all .5s;
	background:#4094d0;
	position:absolute;
	left:0;
	border-radius:100vmax;
}
#header #hamburger .inner_line span { transition:all .4s; }
#header #hamburger #line1 { top:.5rem; }
#header #hamburger #line2 { top:1.1rem; }
#header #hamburger #line3 { top:1.7rem; }
#header #hamburger.open #line1 { transform:translateY(.2rem) rotate(-45deg); background:#fff; }
#header #hamburger.open #line2 { transform:translateY(-.4rem) rotate(45deg); background:#fff; }
#header #hamburger.open #line3 { display:none; }
#header .entry-btn a {
	width:10rem;
	line-height:2.3rem;
	color:#fff;
	background:#4094d0;
	border-radius:100vmax;
	display:block;
	text-align:center;
	font-size:.85rem;
	letter-spacing:.05em;
	margin-right:2rem;
	position:relative;
}
#header .entry-btn a span { font-weight:bold; }
#header .entry-btn a i {
	position:absolute;
	right:1rem;
	height:1em;
	top:0;
	bottom:0;
	margin:auto 0;
	transition:0.3s ease all;
}
#header .entry-btn a:hover { opacity:.5; }
#header .entry-btn a:hover i { right:.8rem; }
#header nav {
	position:fixed;
	top:0;
	right:-29rem;
	background:#4094d0;
	width:29rem;
	height:100vh;
	z-index:10;
	padding:4rem 0 0 4.5rem;
	transition:.5s ease all;
}
#header.open nav {
	right:0;
}
#header.open #hamburger {
	top:2.5rem;
	right:2.5rem;
	position:fixed;
}
#header nav .main-nav > li { margin-bottom:1.7rem; }
#header nav .parent {
	font-size:1.2rem;
	color:#fff;
}
#header nav .parent .jp { font-weight:bold; }
#header nav .parent .en { font-size:50%; margin-left:1rem; }
#header nav .child-list { margin-top:1.2rem; }
#header nav .child-list li {
	font-size:.9rem;
	color:#a3d9ff;
	font-weight:bold;
	margin-bottom:.5rem;
}
#header nav .child-list li:last-child { margin-bottom:0; }
#header nav .nav-entry-btn a {
	background:#fff;
	color:#4094d0;
	font-size:1rem;
	width:20rem;
	line-height:3.25rem;
	border-radius:100vmax;
	display:block;
	text-align:center;
	position:relative;
	margin-bottom:2rem;
}
#header nav .nav-entry-btn a span { font-weight:bold; }
#header nav .nav-entry-btn a i {
	position:absolute;
	right:2rem;
	height:1em;
	top:0;
	bottom:0;
	margin:auto 0;
	transition:0.3s ease all;
}
#header nav .sub-nav { justify-content:flex-start; }
#header nav .sub-nav li {
	font-size:.7rem;
	color:#fff;
}
#header nav .sub-nav li:first-child { margin-right:1rem; }
#header nav a:hover { opacity:.5; }
#header.open .entry-btn { margin-right:2.35rem; }




/* =================== */
/*       #footer       */
/* =================== */
#footer {
	padding:4rem 0 2rem;
	background:#f5f5f5;
}
#footer .foot-main-box .foot-nav { align-items:flex-start; }
#footer .foot-main-box .item { width:calc((100% - 4rem) / 5); }
#footer .foot-main-box .name {
	font-size:1rem;
	font-weight:bold;
	position:relative;
	margin-bottom:1rem;
}
#footer .foot-main-box .name::before {
	content:"●";
	font-size:50%;
	color:#4094d0;
	display:inline-block;
	vertical-align:middle;
	margin-right:1em;
}
#footer .foot-main-box .name a { vertical-align:middle; }
#footer .foot-main-box .name a:hover { opacity:.5; }
#footer .foot-main-box dd {
	font-size:.75rem;
	margin-bottom:.75rem;
	margin-left:1rem;
}
#footer .foot-main-box dd a:hover { opacity:.5; }
#footer small {
	font-size:.6rem;
	text-align:center;
	margin-top:2rem;
	display:block;
}
#footer .sub-nav { justify-content:center; margin-top:4rem; }
#footer .sub-nav li {
	font-size:.8rem;
	margin:0 1rem;
}
#footer .sub-nav li span { vertical-align:middle; margin-right:.5em; }
#footer .sub-nav li i { font-size:80%; vertical-align:middle; }
#footer .sub-nav li a:hover { opacity:.5; }







/* =================== */
/*        main         */
/* =================== */
main { margin-top:8rem; }
.dflt-btn a {
	width:20rem;
	line-height:3.25rem;
	color:#fff;
	background:#4094d0;
	border-radius:100vmax;
	display:block;
	text-align:center;
	font-size:1rem;
	letter-spacing:.05em;
	margin-right:2rem;
	position:relative;
	margin:0 auto;
}
.dflt-btn.wht a { background:none; border:1px solid #fff; }
.dflt-btn a span { font-weight:bold; }
.dflt-btn a i {
	position:absolute;
	right:1.5rem;
	height:1em;
	top:0;
	bottom:0;
	margin:auto 0;
	transition:0.3s ease all;
}
.dflt-btn a:hover { opacity:.5; }
.dflt-btn a:hover i { right:1.3rem; }

body.index #top-box { margin-bottom:3.5rem; }
body.index #top-box .mv-box { position:relative; z-index:1; }
body.index #top-box .mv-box .pic-box .pic { margin:0 1.25rem; }
body.index #top-box .mv-box .copy {
	line-height:2;
	margin-top:-7.3rem;
}
body.index #top-box .mv-box .copy span {
	font-size:2.4rem;
	color:#fff;
	font-weight:bold;
	background:#4094d0;
	padding:.7rem;
}
body.index #top-box .txt-cont {
	background:#d7eeff;
	width:100%;
	height:56.8rem;
	padding-top:19rem;
	box-sizing:border-box;
	margin-top:-15rem;
	position:relative;
}
body.index #top-box .txt-cont::before {
	content:"";
	width:100%;
	height:7.5rem;
	background:url(../img/mask2.png) no-repeat bottom center;
	background-size:cover;
	display:block;
	position:absolute;
	bottom:0;
	left:0;
}
body.index #top-box .txt-cont > .flex-box { align-items:flex-start; }
body.index #top-box .txt-cont .txt-box {
	font-size:1rem;
	line-height:1.7;
	order:1;
	width:37rem;
	margin-left:2rem;
	color:#191919;
}
body.index #top-box .txt-cont .ttl-box {
	order:2;
	width:calc(100% - 39rem);
}
body.index #top-box .txt-cont .ttl-box .en-ttl {
	font-size:5.9rem;
	color:#fff;
	margin-right:-9rem;
	margin-top:.5rem;
}
body.index #top-box .txt-cont .ttl-box .jp-ttl {
	font-size:2.1rem;
	line-height:1.7;
	color:#4094d0;
	font-weight:bold;
	margin-top:2rem;
}
body.index h2 { margin-bottom:3rem; }
body.index h2 .jp {
	font-size:1.9rem;
	font-weight:bold;
	color:#404040;
	text-align:center;
	display:block;
}
body.index h2 .en {
	font-size:.9rem;
	color:#4094d0;
	display:block;
	text-align:center;
	margin-top:.7rem;
}
body.index h2.wht .jp,
body.index h2.wht .en { color:#fff; }

body.index #company-sec { margin-bottom:5rem; }
body.index #company-sec .sec-top-txt {
	font-size:1.4rem;
	font-weight:bold;
	color:#4094d0;
	text-align:center;
	margin-bottom:2.5rem;
}
body.index #company-sec ul { margin-bottom:3rem; }
body.index #company-sec li { width:calc((100% - 4rem) / 3); }
body.index #company-sec li .name {
	font-size:.9rem;
	color:#404040;
	margin-top:1rem;
}
body.index #company-sec li .name span { font-weight:bold; }
body.index #company-sec li .name i { color:#4094d0; }
body.index #company-sec li a:hover { opacity:.5; }

body.index #jobs-sec {
	position:relative;
	padding:10rem 0;
	background:url(../img/jobs_bk.png) no-repeat;
	background-size:cover;
}
body.index #jobs-sec::before {
	content:"";
	width:100%;
	height:7.5rem;
	background:url(../img/mask1.png) no-repeat top center;
	background-size:cover;
	display:block;
	position:absolute;
	top:0;
	left:0;
}
body.index #jobs-sec::after {
	content:"";
	width:100%;
	height:7.5rem;
	background:url(../img/mask2.png) no-repeat bottom center;
	background-size:cover;
	display:block;
	position:absolute;
	bottom:0;
	left:0;
}
body.index #jobs-sec .cont-box { position:relative; }
body.index #jobs-sec .sec-top-txt {
	font-size:1.2rem;
	color:#fff;
	text-align:center;
	line-height:1.58;
	font-weight:bold;
}
body.index #jobs-sec ul {
	align-items:initial;
	flex-wrap:wrap;
	margin:3rem 0 2rem;
}
body.index #jobs-sec ul li {
	width:calc((100% - 2rem) / 2);
	margin-bottom:2rem;
}
body.index #jobs-sec ul li a {
	background:#fff;
	border-radius:1rem;
	padding:2.5rem 2rem;
	display:block;
	height:100%;
	box-sizing:border-box;
}
body.index #jobs-sec ul li .name { font-size:1.4rem; }
body.index #jobs-sec li .name span { font-weight:bold; }
body.index #jobs-sec li .name .mini { font-size:64%; }
body.index #jobs-sec li .name i { color:#4094d0; font-size:85%; }
body.index #jobs-sec li .txt {
	font-size:.9rem;
	line-height:1.77;
	margin-top:1.5rem;
}
body.index #jobs-sec li a:hover { opacity:.5; }

body.index #people-sec { margin:3.5rem 0 4rem; }
body.index #people-sec ul {
	align-items:initial;
	margin-bottom:2rem;
}
body.index #people-sec li {
	width:calc((100% - 7rem) / 3);
	position:relative;
	padding:1rem 0 1.5rem;
}
body.index #people-sec li::before {
	content:"";
	width:1px;
	height:100%;
	background:#e5e5e5;
	position:absolute;
	right:-1.75rem;
	top:0;
}
body.index #people-sec li:last-child::before { display:none; }
body.index #people-sec li .illust {
	width:11.25rem;
	margin:0 auto 1rem;
}
body.index #people-sec li .copy {
	font-size:1.2rem;
	text-align:center;
	color:#4094d0;
	font-weight:bold;
	line-height:1.58;
}
body.index #people-sec li .job {
	font-size:.7rem;
	color:#404040;
	text-align:center;
	font-weight:bold;
	margin:1rem 0 .5rem;
}
body.index #people-sec li .txt {
	color:#404040;
	font-size:.9rem;
	text-align:center;
	font-weight:bold;
}
body.index #people-sec li a:hover { opacity:.5; }

body.index #workstyle-sec {
	position:relative;
	padding:10rem 0 12rem;
	background:#d7eeff;
}
body.index #workstyle-sec .in-w60 { position:initial; }
body.index #workstyle-sec::after {
	content:"";
	width:100%;
	height:7.5rem;
	background:url(../img/mask1.png) no-repeat top center;
	background-size:cover;
	display:block;
	position:absolute;
	top:0;
	left:0;
}
body.index #workstyle-sec::before {
	content:"";
	width:100%;
	height:7.5rem;
	background:url(../img/mask2.png) no-repeat bottom center;
	background-size:cover;
	display:block;
	position:absolute;
	bottom:0;
	left:0;
}
body.index #workstyle-sec .sec-top-txt {
	font-size:1.2rem;
	text-align:center;
	font-weight:bold;
	color:#191919;
	position:relative;
}
body.index #workstyle-sec .lr-box {
	align-items:flex-start;
	margin-top:3rem;
}
body.index #workstyle-sec .r-box {
	width:29rem;
	position:absolute;
	right:6rem;
}
body.index #workstyle-sec .l-box { width:29rem; position:relative; }
body.index #workstyle-sec .l-box ul { margin-bottom:3rem; }
body.index #workstyle-sec .l-box li { margin-bottom:1rem; }
body.index #workstyle-sec .l-box li a {
	background:#fff;
	border-radius:1rem;
	padding:1.5rem 2rem;
	font-size:1.2rem;
	display:flex;
	justify-content:space-between;
}
body.index #workstyle-sec .l-box li a:hover { opacity:.5; }
body.index #workstyle-sec .l-box li a span { font-weight:bold; }
body.index #workstyle-sec .l-box li a i {
	font-size:85%;
	color:#4094d0;
}
body.index #workstyle-sec .pic-lr.is-show::before { background:#d7eeff; }

body.index #qa-sec { margin:4rem 0; }
body.index #qa-sec dl {
	border-top:1.5px solid #d9d9d9;
	margin-bottom:3rem;
}
body.index #qa-sec dl .line {
	border-bottom:1.5px solid #d9d9d9;
	padding:1.5rem 1rem;
}
body.index #qa-sec dl .line span.clr {
	font-size:1.1rem;
	font-weight:bold;
	color:#4094d0;
	margin-right:.5em;
}
body.index #qa-sec dl .line dt {
	font-size:1.1rem;
	font-weight:bold;
	position:relative;
	padding-right:3rem;
	cursor:pointer;
}
body.index #qa-sec dl .line dt::before {
	content:"+";
	position:absolute;
	right:0;
	top:-25%;
	font-size:150%;
}
body.index #qa-sec dl .line.open dt::before { content:"−"; }
body.index #qa-sec dl .line dd {
	font-size:.9rem;
	line-height:1.77;
	text-indent:-1.65rem;
	padding-left:1.65rem;
	padding-right:3rem;
	display:none;
	margin-top:1rem;
}

body.index #flow-sec {
	position:relative;
	padding:9rem 0 4rem;
	background:#4094d0;
}
body.index #flow-sec::after {
	content:"";
	width:100%;
	height:7.5rem;
	background:url(../img/mask1.png) no-repeat top center;
	background-size:cover;
	display:block;
	position:absolute;
	top:0;
	left:0;
}
body.index #flow-sec ol { position:relative; }
body.index #flow-sec ol::before {
	content:"";
	width:1.5px;
	height:90%;
	background:#fff;
	position:absolute;
	left:0;
	right:0;
	margin:0 auto;
	top:5%;
}
body.index #flow-sec li {
	background:#fff;
	border-radius:1rem;
	padding:1.5rem;
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-bottom:1.5rem;
	position:relative;
}
body.index #flow-sec li .num {
	font-size:1.05rem;
	color:#4094d0;
	font-weight:bold;
	width:6rem;
	border-right:1.5px solid #d9d9d9;
	padding:.7rem 0;
}
body.index #flow-sec li .txt {
	width:calc(100% - 6rem - 1.5rem);
	font-size:1rem;
	font-weight:bold;
}

#btm-entry-btn { margin:3rem 0; }
#btm-entry-btn a {
	width:31.5rem;
	line-height:4.4rem;
	font-size:1.6rem;
}











@media screen and (max-width: 960px) {
	.in-w70 { width:95%; max-width:750px; }
}

@media screen and (max-width: 750px) {
	html { scroll-padding-top:80px !important; }
	.pc-on { display:none; }
	.sp-on { display:initial; }

	body.open { height:100svh; overflow:hidden; }

	.in-w70 { width:86.6%; }
	.in-w60 { width:86.6%; }
	.in-w55 { width:86.6%; }

	.dflt-btn a { width:250px; line-height:40px; font-size:15px; }

	body.index h2 .jp { font-size:25px; }
	body.index h2 .en { font-size:15px; margin-top:10px; }

	body.index #top-box { margin-bottom:50px; }
	body.index #top-box .mv-box { position:relative; z-index:1; }
	body.index #top-box .mv-box .copy span { font-size:30px; }
	body.index #top-box .txt-cont > .flex-box { display:block; width:100%; }
	body.index #top-box .txt-cont .ttl-box { width:100%; }
	body.index #top-box .txt-cont .txt-box { width:86.6%; font-size:15px; margin:20px auto 0; line-height:1.66; padding:0 20px; }
	body.index #top-box .txt-cont { height:auto; position:relative; padding-bottom:70px; }
	body.index #top-box .txt-cont .ttl-box .en-ttl { margin-right:0; }
	body.index #top-box .txt-cont .ttl-box .jp-ttl { font-size:29px; width:7.1em; margin:-30px auto 0; }
	body.index #top-box .txt-cont::before { height:37.5px; }
	body.index #top-box .mv-box .copy { margin-top:-3.3rem; line-height:1.8; }
	body.index #top-box .txt-cont { padding-top:160px; }
	body.index #top-box .txt-cont .ttl-box .en-ttl { margin:0 auto; font-size:74px; width:5em; }

	body.index #company-sec .sec-top-txt { font-size:20px; line-height:1.3; }
	body.index #company-sec ul { display:block; }
	body.index #company-sec ul li { width:100%; margin-bottom:30px; }
	body.index #company-sec li .name { font-size:17px; }
	body.index #jobs-sec .sec-top-txt { font-size:18px; }
	body.index #jobs-sec { height:auto; padding:80px 0; }
	body.index #jobs-sec::before { height:37.5px; }
	body.index #jobs-sec::after { height:37.5px; }
	body.index #jobs-sec ul { display:block; margin-bottom:40px; }
	body.index #jobs-sec ul li { width:100%; }
	body.index #jobs-sec ul li .name { font-size:17px; }
	body.index #jobs-sec li .txt { font-size:15px; line-height:1.66; }
	body.index #people-sec { margin:50px 0; }
	body.index #people-sec ul { display:block; margin-bottom:20px; }
	body.index #people-sec ul li { border-bottom:1px solid #e5e5e5; width:100%; }
	body.index #people-sec li:last-child { border-bottom:0; }
	body.index #people-sec ul li a { display:flex; padding:10px; }
	body.index #people-sec li::before { display:none; }
	body.index #people-sec li .illust { width:100px; margin:0; }
	body.index #people-sec li .txt-box { margin-left:15px; width:calc(100% - 100px - 15px); }
	body.index #people-sec li .copy { font-size:17px; text-align:left; line-height:1.3; }
	body.index #people-sec li .copy br { display:none; }
	body.index #people-sec li .job { font-size:13px; text-align:left; }
	body.index #people-sec li .txt { font-size:15px; text-align:left; }
	body.index #workstyle-sec::after { height:37.5px; }
	body.index #workstyle-sec::before { height:37.5px; }
	body.index #workstyle-sec { padding:80px 0; }
	body.index #workstyle-sec .sec-top-txt { font-size:20px; line-height:1.3; }
	body.index #workstyle-sec .lr-box { display:block; }
	body.index #workstyle-sec .r-box { position:initial; width:calc(100% + 30px); margin-top:30px; }
	body.index #workstyle-sec .l-box li a { font-size:17px; }
	body.index #workstyle-sec .l-box { width:100%; }
	body.index #qa-sec { margin:60px 0; }
	body.index #qa-sec dl .line dt { font-size:15px; line-height:1.66; text-indent:-1.5em; padding-left: 1.5em; }
	body.index #qa-sec dl .line span.clr { font-size:15px; }
	body.index #qa-sec dl .line dd { font-size:15px; line-height:1.66; text-indent:-1.5em; padding-left:1.5em; }
	body.index #qa-sec dl .line dt::before { top:-8px; }
	body.index #flow-sec::after { height:37.5px; }
	body.index #flow-sec { padding:80px 0 40px; }
	body.index #flow-sec li .num { font-size:17px; width:100%; text-align:center; border-right:0; }
	body.index #flow-sec li { display:block; }
	body.index #flow-sec li .txt { font-size:15px; line-height:1.66; width:100%; margin-top:5px; }

	#btm-entry-btn { margin:50px 0; }

	#footer { padding:15px 0; }
	#footer .foot-main-box .foot-nav { display:none; }
	#footer .sub-nav { display:none; }
	#footer small { font-size:10px; margin-top:0; }

	#header nav { width:100%; right:-100%; padding:70px 0 0 0; }
	#header nav .main-nav { width:80%; margin:0 auto; }
	#header .head-main-box { width:93.3%; }
	#header .entry-btn { display:none; }
	#header #site-logo { width:218px; }
	#header #hamburger { width:37px; height:37px; }
	#header #hamburger .inner_line { width:37px; height:2px; }
	#header #hamburger #line1 { top:8px; }
	#header #hamburger #line2 { top:17px; }
	#header #hamburger #line3 { top:26px; }
	#header #hamburger.open #line1 { transform:translateY(.5rem) rotate(-45deg); }
	#header nav .parent .jp { font-size:16px; display:block; }
	#header nav .parent .en { margin-left:0; margin-top:5px; font-size:8px; display:block; }
	#header nav .main-nav > li { border-bottom:1px solid #fff; padding-bottom:1.7rem; }
	#header nav .main-nav > li:last-child { border-bottom:0; }
	#header nav .child-list li { font-size:13px; margin-bottom:7px; }
	#header nav .nav-entry-btn a { width:70%; line-height:45px; font-size:14px; margin:0 auto 30px; }
	#header nav .sub-nav { justify-content:center; }
	#header nav .sub-nav li { font-size:12px; }
	#header nav .sub-nav li:first-child { margin-right:15px; }
	#header nav .parent a { display:block; position:relative; }
	#header nav .parent a::after {
		content:"\f105";
		font-family: "Font Awesome 6 Free";
		font-weight:900;
		display:block;
		position:absolute;
		right:10px;
		bottom:0;
		top:0;
		margin:auto 0;
		height:1em;
	}
}