@charset "UTF-8";

html,
body {
	line-height: 2;
	font-size: 62.5%;
	font-family: "M PLUS 1", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-weight: 500;
	color: #262626;
	background: #FFFFFF;
	width: 100%;
	overflow-x: hidden;
}

body {
	opacity: 0;
}

body.loaded {
	opacity: 1;
}

.abs {
	position: absolute;
	display: block;
}

.rel {
	position: relative;
	display: block;
}

.flexBlock {
	display: flex;
	justify-content: space-between;
}

.column {
	flex-direction: column;
}

.anim {
	transition: 0.3s ease-out;
}

.resizing * {
	transition: none !important;
}

header.nav {
	position: fixed;
	display: block;
	width: 100%;
	height: 80px;
	background: rgba(255, 255, 255, 0.9);
	/*
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	*/
	transition: transform 0.3s ease;
	z-index: 1000;
}

header.nav>.flexBlock {
	padding-left: 40px;
	padding-right: 15px;
	height: 100%;
	align-items: center;
}

header.nav>.flexBlock>h1 {
	max-width: 412px;
	min-width: 280px;
	width: 32%;
	display: flex;
	align-items: center;
}

header.nav>.flexBlock>h1>a {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

header.nav>.flexBlock>h1>a>span {
	position: relative;
}

header.nav>.flexBlock>h1>a>span:nth-child(1) {
	width: calc(100% - 115px);
}

header.nav>.flexBlock>h1>a>span:nth-child(1)>img {
	width: 100%;
}

header.nav>.flexBlock>h1>a>span:nth-child(2) {
	width: 100px;
	height: 40px;
	background: #01AEEB;
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	font-size: 1.6rem;
	color: #FFFFFF;
}

.nav-hidden header.nav {
	transform: translateY(-100%);
}

.open.nav-hidden header.nav {
	transform: translateY(0%);
}

header.nav>.flexBlock .pc-only.nav-area ul {
	align-items: center;
}

header.nav>.flexBlock .pc-only.nav-area ul li {
	margin-left: 25px;
	margin-right: 25px;
}

header.nav>.flexBlock .pc-only.nav-area ul li:last-child {
	margin-right: 0 !important;
}


header.nav>.flexBlock .pc-only.nav-area ul li>a {
	color: #00267F;
	font-size: 1.6rem;
	text-align: center;
	line-height: 1.4;
	position: relative;
	display: flex;
}

header.nav>.flexBlock .pc-only.nav-area ul li.on>a {
	color: #FF7300;
}

header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius)>span>span {
	position: relative;
	display: block;
	z-index: 1;
}

header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):before,
header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):after,
header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius)>span:before,
header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius)>span:after {
	opacity: 1;
	content: '';
	position: absolute;
	display: block;
	transform: translate(-50%, -50%) scale(0, 0) rotate(0deg);
	left: 50%;
	top: 50%;
	transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	width: 30%;
	height: auto;
	aspect-ratio: 1 / 1;
	background-size: contain !important;
	background-position: center center !important;
	z-index: 0;
}

header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):before {
	background: url('../img/common/hover-img01.png') no-repeat;
}

header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):after {
	background: url('../img/common/hover-img02.png') no-repeat;
}

header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius)>span:before {
	background: url('../img/common/hover-img03.png') no-repeat;
}

header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius)>span::after {
	background: url('../img/common/hover-img04.png') no-repeat;
}

header.nav>.flexBlock .pc-only.nav-area ul li:last-child>a {
	width: 112px;
	height: 56px;
	background: #FF7300;
	border: 2px solid #FF7300;
	box-sizing: border-box;
	color: #FFFFFF;
	align-items: center;
	justify-content: center;
	border-radius: 30px;
	letter-spacing: 0.075em;
	transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

#top-img-area {
	padding-top: 100px;
	padding-bottom: 110px;
	width: 100%;
	height: auto;
	clip-path: url(#bottomRoundedClip);
	overflow: hidden;
	position: relative;
	display: block;
	background: #FFFFFF;
	z-index: 2;
}

#top-img-area.clip-path-none {
	clip-path: none !important;
	overflow: inherit;
	background: none;
	padding-top: 0;
	padding-bottom: 0;
}

#kabuto-platec #top-img-area h2>img,
#kabuto-platec #top-img-area .steps>img {
	width: 100%;
}

#kabuto-platec #top-img-area h2 {
	width: calc(100% - 30px);
	max-width: 640px;
	margin: 0 auto;
}

#kabuto-platec #top-img-area .steps {
	width: calc(100% - 30px);
	max-width: 464px;
	margin: 20px auto -3%;
}

#kabuto-platec #top-img-area .steps>img.abs {
	top: 0;
	left: 0;
	opacity: 0;
	animation: stepsAnim 1.5s steps(1) infinite;
}

#kabuto-platec #top-img-area .steps>img.rel {
	animation: stepsAnim 1.5s steps(1) infinite;
	animation-direction: reverse;
}

@keyframes stepsAnim {

	0%,
	100% {
		opacity: 0;
	}

	50% {
		opacity: 1;
	}
}

#working-life #top-img-area {
	padding-top: 0;
	padding-bottom: 0;
}

#top-img-area>.main-img {
	justify-content: center;
	align-items: flex-end;
	max-width: 1062px;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	transition: transform 0.7s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transform: scale(0, 0) translateX(-5%);
	transform-origin: center center;
}

.loaded.setAnim #top-img-area>.main-img {
	transform: scale(1, 1) translateX(-5%);
}

#top-img-area>.main-img>:nth-child(1) {
	width: 43%;
	z-index: 0;
}

#top-img-area>.main-img>:nth-child(2) {
	width: 25%;
	z-index: 1;
	padding-bottom: 7%;
}

#top-img-area>.main-img>:nth-child(3) {
	width: 32%;
	padding-bottom: 2%;
	z-index: 0;
}

#top-img-area>.main-img img {
	width: 100%;
	backface-visibility: hidden;
	will-change: transform;
}

.animStart #top-img-area>.main-img>:nth-child(1)>img {
	animation: flipAngle 2s infinite;
}

.animStart #top-img-area>.main-img>:nth-child(3)>img {
	animation: flipAngle2 2s infinite;
}

#top-img-area>.main-img>:nth-child(2) img {
	width: 210%;
	left: 50%;
	transform: translate(-50%, 0);
}

#top-img-area>.bg {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backface-visibility: hidden;
	will-change: transform;
}

.animStart #top-img-area>.bg01 {
	animation: floatScale 7s ease-in-out infinite;
}

.animStart #top-img-area>.bg02 {
	animation: floatScale 5s ease-in-out infinite;
}

.animStart #top-img-area>.bg03 {
	animation: floatScale 6s ease-in-out infinite;
}

.animStart #top-img-area>.bg04 {
	animation: floatScale 8s ease-in-out infinite;
}

#top-img-area>.bg>img {
	width: 124%;
	height: auto;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	position: absolute;
	display: block;
	transform-origin: center center;
}

#top-img-area .top-item01 {
	width: 85px;
	height: auto;
	animation: rotateItem 1.8s ease-in-out infinite alternate-reverse;
	top: 40%;
	left: 5%;
}

#top-img-area .top-item02 {
	width: 93px;
	height: auto;
	animation: rotateItem 3.8s ease-in-out infinite alternate-reverse;
	top: 20%;
	left: 50%;
}

#top-img-area .top-item03 {
	width: 78px;
	height: auto;
	animation: rotateItem 2.8s ease-in-out infinite alternate-reverse;
	top: 80%;
	left: 90%;
}

@keyframes rotateItem {
	0% {
		transform: rotate(-50deg);
	}

	100% {
		transform: rotate(50deg);
	}
}

@keyframes flipAngle {
	0% {
		transform: rotate(0deg);
	}

	50% {
		transform: rotate(-10deg);
	}

	100% {
		transform: rotate(0deg);
	}
}

@keyframes flipAngle2 {
	0% {
		transform: rotate(0deg);
	}

	50% {
		transform: rotate(10deg);
	}

	100% {
		transform: rotate(0deg);
	}
}

@keyframes floatScale {
	0% {
		transform: translateY(0) scale(1);
	}

	50% {
		transform: translateY(-3%) scale(1.05);
	}

	100% {
		transform: translateY(0) scale(1);
	}
}

.top-bg-loop {
	margin-top: -167px;
	width: 100vw;
	height: 324px;
	background: url('../img/top/img-loop01.png') repeat-x;
	background-size: auto 100% !important;
	background-position: 0 0;
	animation: bgLoopLeft 25s linear infinite;
	backface-visibility: hidden;
	will-change: auto;
	position: relative;
	overflow: hidden;
}

.top-bg-loop2 {
	width: 100vw;
	height: 392px;
	background: url('../img/top/img-loop02.png') repeat-x;
	background-size: auto 100% !important;
	background-position: 0 0;
	animation: bgLoopRight 25s linear infinite;
	backface-visibility: hidden;
	will-change: auto;
	position: relative;
	overflow: hidden;
}

.scrolled #top-img-area .top-item01,
.scrolled #top-img-area .top-item02,
.scrolled #top-img-area .top-item03,
.scrolled #top-img-area>.bg,
.scrolled #top-img-area>.main-img>:nth-child(1)>img,
.scrolled #top-img-area>.main-img>:nth-child(3)>img {
	animation: none !important;
}

@keyframes bgLoopLeft {
	0% {
		background-position: 0 0;
	}

	100% {
		background-position: -1620px 0;
	}
}

@keyframes bgLoopRight {
	0% {
		background-position: 0 0;
	}

	100% {
		background-position: 1972px 0;
	}
}

@keyframes bgLoopLeft-sp {
	0% {
		background-position: 0 0;
	}

	100% {
		background-position: -522px 0;
	}
}

@keyframes bgLoopRight-sp {
	0% {
		background-position: 0 0;
	}

	100% {
		background-position: 734px 0;
	}
}

.zigzag-bottom {
	mask-image: url('../img/top/zigzag.svg');
	mask-repeat: repeat-x;
	mask-size: 200px 324px;
	mask-position: bottom;

	-webkit-mask-image: url('../img/top/zigzag.svg');
	-webkit-mask-repeat: repeat-x;
	-webkit-mask-size: 200px 324px;
	-webkit-mask-position: bottom;
	z-index: 1;
}

.contents.hasBg>.bg-layer {
	position: fixed;
	display: block;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	pointer-events: none;
}

.contents.hasBg>.bg-layer>svg {
	width: 150%;
	margin-left: -25%;
}

.inner {
	width: 100%;
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}

.text {
	font-size: 1.8rem;
}

.inner .flexBlock.links {
	margin-bottom: 100px;
}

main .contents {
	padding-top: 120px;
}

main .contents h3 {
	line-height: 1.4;
	font-size: 4.0rem;
	text-align: center;
	color: #00267F;
	margin-bottom: 30px;
	background: #FFFFFF;
	padding: 15px;
	display: inline-block;
	border-radius: 10px;
}

main .contents .text {
	text-align: center;
	color: #262626;
	padding: 15px;
	background: #FFFFFF;
	display: inline-block;
	border-radius: 10px;
}

.text-block {
	justify-content: center;
	align-items: center;
}

.flexBlock.links {
	width: 100%;
	max-width: 1114px;
	margin-left: auto;
	margin-right: auto;
	flex-wrap: wrap;
	justify-content: center;
}

.flexBlock.links>li {
	max-width: 210px;
	min-width: 200px;
	width: calc(20% - 14px);
	margin: 7px;
}

.links>li>a {
	position: relative;
	display: flex;
	width: 100%;
	height: 60px;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 0 15px 0 45px;
	border: 2px solid #00267F;
	background: #FFFFFF;
	color: #00267F;
	font-weight: 700;
	transition: 0.3s ease-out;
	border-radius: 30px;
	line-height: 1.4;
	font-size: 1.6rem;
}

.links>li>a:before {
	content: '';
	position: absolute;
	display: block;
	width: 15px;
	height: 14px;
	background: url('../img/common/arrow_blue-bottom.svg') no-repeat;
	background-size: contain !important;
	background-position: center center;
	left: 15px;
	top: 0;
	bottom: 0;
	margin: auto 0;
}

@keyframes hoverUp {

	0%,
	100% {
		transform: scale(1, 1);
	}

	50% {
		transform: scale(1.03, 1.03);
	}
}

.column.text-block>h2.img {
	margin-top: 100px;
}

#top-crafting {
	padding-bottom: 50px;
}

#top-crafting .btn-orange {
	margin-top: 30px;
}

#top-crafting h2.img {
	width: 450px;
}

#top-crafting h2.img .title-img.rel {
	width: 100%;
}

#top-crafting h2.img .top-item01 {
	width: 85px;
	height: auto;
	animation: rotateItem 1.8s ease-in-out infinite alternate-reverse;
	top: 20%;
	right: -5%;
}

#top-crafting h2.img .top-item02 {
	width: 93px;
	height: auto;
	animation: rotateItem 3.8s ease-in-out infinite alternate-reverse;
	top: 70%;
	right: -30%;
}

#top-crafting h2.img .top-item03 {
	width: 78px;
	height: auto;
	animation: rotateItem 2.8s ease-in-out infinite alternate-reverse;
	top: 50%;
	left: -25%;
}

#floating-banner {
	bottom: 10px;
	right: 10px;
	position: fixed;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	z-index: 1005;
	font-weight: 700;
	font-size: 1.6rem;
	line-height: 1.6;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

#job-description #floating-banner {
	transition: 0.3s ease-out;
}

#job-description.floating-hidden #floating-banner {
	transform: translateX(120%);
}

#floating-banner>a>.huki {
	margin-bottom: 18px;
	position: relative;
	display: block;
}

#floating-banner>a>.huki>div {
	position: relative;
	display: flex;
	border: 2px solid #00267F;
	border-radius: 10px;
	background: #FFFFFF;
	color: #00267F;
	overflow: hidden;
	flex-direction: column;
	transition: 0.3s ease-out;
}

#floating-banner>a>.huki:before,
#floating-banner>a>.huki:after {
	content: '';
	position: absolute;
	display: block;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 12px;
	height: 12px;
}

#floating-banner>a>.huki:before {
	border-top: 12px solid #00267F;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
	bottom: -12px;
}

#floating-banner>a>.huki:after {
	border-top: 11px solid #FF7300;
	border-right: 7px solid transparent;
	border-left: 7px solid transparent;
	bottom: -10px;
}

#floating-banner>a>.huki>div>span {
	justify-content: center;
	align-items: center;
}

#floating-banner>a>.huki>div>span.pc-only {
	padding: 20px 7px 20px 7px;
	writing-mode: vertical-rl;
	text-orientation: upright;
	width: 60px;
	height: auto;
}

#floating-banner>a>.huki>div>span:last-child {
	background: #FF7300;
	color: #FFFFFF;
	width: 100%;
	height: 36px;
	font-size: 1.2rem;
}

#floating-banner>a>.huki>div>span:last-child>img {
	margin-left: 5px;
}

#floating-banner>.kabuto-anim {
	width: 86px;
	height: 114px;
	background: url('../img/common/kabuto.png') no-repeat;
	background-size: 100% auto;
	background-position: 0 0;
	animation: kabutoAnim 1.5s steps(1) infinite;
}

@keyframes kabutoAnim {
	0% {
		background-position: 0 0;
	}

	33.33% {
		background-position: 0 -114px;
	}

	66.66% {
		background-position: 0 -228px;
	}
}

@keyframes kabutoAnim-sp {
	0% {
		background-position: 0 0;
	}

	33.33% {
		background-position: 0 -70.33px;
	}

	66.66% {
		background-position: 0 -140.66px;
	}
}

main .contents h3.line-left-right {
	padding-left: 65px;
	padding-right: 65px;
	position: relative;
	display: block;
}

main .contents h3.line-left-right:before,
main .contents h3.line-left-right:after {
	content: '';
	position: absolute;
	display: block;
	width: 4px;
	height: 40px;
	background: #00267F;
	bottom: -5px;
	top: 0;
	margin: auto 0;
}

main .contents h3.line-left-right:before {
	left: 25px;
	transform: rotate(-10deg);
}

main .contents h3.line-left-right:after {
	right: 25px;
	transform: rotate(10deg);
}

.btn-orange {
	border: 2px solid #FF7300;
	background: #FF7300;
	height: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	position: relative;
	padding: 10px 45px;
	font-weight: 700;
	color: #FFFFFF;
	font-size: 2.0rem;
	line-height: 1.4;
	border-radius: 30px;
	transition: 0.3s ease-out;
	max-width: 450px;
	margin-left: auto;
	margin-right: auto;
}

.btn-orange:after {
	content: '';
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
	margin: auto 0;
	right: 20px;
	width: 15px;
	height: 15px;
	background: url('../img/common/arrow_white-right.svg') no-repeat;
	background-size: contain !important;
}

.banner-pdf {
	width: calc(100% - 30px);
	max-width: 1080px;
	margin: 60px auto 150px;
}

.banner-pdf:after {
	display: none !important;
}

.banner-pdf img {
	width: 100%;
	position: relative;
	display: block;
}

#top-staff-voices h2.img {
	max-width: 639px;
	width: calc(100% - 30px);
	margin-bottom: 40px;
}

#top-staff-voices h2.img>img {
	width: 100%;
}

#top-staff-voices h3 {
	margin-top: 30px;
	font-size: 2.8rem;
}

.top-staff-voices-area {
	padding-bottom: 5px;
	position: relative;
	display: block;
	padding-top: 30px;
	margin-bottom: 30px;
}

.top-staff-voices-area>.text-content>div {
	border-radius: 10px;
	border: 4px solid #00267F;
	background: #FFFFFF;
}

.top-staff-voices-area>.text-content:before {
	width: 100%;
	height: calc(100% - 30px);
	content: '';
	position: absolute;
	display: block;
	border-radius: 10px;
	top: 35px;
	background: #28C3FF;
}

.top-staff-voices-area .header {
	background: #00267F;
	border-radius: 6px 6px 0px 0px;
	font-size: 2.4rem;
	color: #FFFFFF;
}

.top-staff-voices-area .header .q-text {
	height: 49px;
	width: auto;
	left: 0;
	right: 0;
	margin: -24.5px auto 0;
	top: 0;
}

.top-staff-voices-area .header h4 {
	justify-content: center;
	align-items: center;
	width: 100%;
}

.top-staff-voices-area .header h4>span {
	padding-right: 130px;
	padding-left: 10px;
	text-align: center;
	white-space: nowrap;
}

.top-staff-voices-area .header h4>span:nth-child(1) {
	padding-right: 10px;
	padding-left: 140px;
}

.top-staff-voices-area .header h4>.illust {
	width: 130px;
	margin-top: -20px;
}

.top-staff-voices-area .header h4>.illust>img {
	width: 100%;
	height: auto;
}

.top-staff-voices-area .header h4>.illust.effect-scroll>img {
	animation: bounce 1s ease-in-out;
	transform-origin: center bottom;
}

@keyframes bounce {

	0%,
	100% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.25);
	}
}

.top-staff-voices-area .body {
	padding: 15px;
}

.top-staff-voices-area .body>.flexBlock {
	flex-wrap: wrap;
}

.top-staff-voices-area .body>.flexBlock>div {
	width: 33.3%;
	padding: 20px 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.6rem;
	text-align: center;
	color: #00267F;
}

.top-staff-voices-area .body>.flexBlock>div:nth-child(-n+2) {
	border-right: 2px dotted #00267F;
	border-bottom: 2px dotted #00267F;
}

.top-staff-voices-area .body>.flexBlock>div:nth-child(3) {
	border-bottom: 2px dotted #00267F;
}

.top-staff-voices-area .body>.flexBlock>div:nth-child(n+4):nth-child(-n+5) {
	border-right: 2px dotted #00267F;
}

#svg-animate-area svg {
	width: 100%;
	height: auto;
	display: block;
}

#svg-animate-area {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.btns-middle {
	width: calc(100% - 30px);
	max-width: 1120px;
	background: #00267F;
	border-radius: 170px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 80px;
	overflow: hidden;
}

.btns-middle:before {
	content: '';
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: url('../img/common/btns-bg.png') center center;
	background-size: 1235px auto;
	opacity: 0.5;
}

.btns-middle>div {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 35px 0;
	flex-direction: column;
}

.btns-middle h4.img {
	width: 90%;
	max-width: 600px;
}

.btns-middle h4.img img {
	width: 100%;
}

.btns-middle p.text {
	background: none;
	padding: 0;
	max-width: 800px;
	width: calc(100% - 30px);
	color: #FFFFFF;
	margin: 20px auto 40px;
}

.btns-middle .btns-area {
	width: 100%;
	max-width: 800px;
}

.btns-middle .btns-area>a {
	width: calc(50% - 20px);
}

.btns-middle .btns-area>a.row2 {
	flex-direction: column;
}

.btns-middle .btns-area>a.row2>:last-child {
	font-size: 1.2rem;
	word-break: keep-all;
}

.cloud-area {
	padding-top: 300px;
	padding-bottom: 350px;
	background: url('../img/top/bg-blue-cloud.png') center center;
	background-size: 827.5px auto;

	-webkit-mask-image: url('../img/top/clouds-mask-top.svg'),
		url('../img/top/mask-middle.png'),
		url('../img/top/clouds-mask-bottom.svg');
	-webkit-mask-repeat: repeat-x, no-repeat, repeat-x;
	-webkit-mask-size: 1440px 384px, 100% calc(100% - 768px), 1440px 384px;
	-webkit-mask-position: top, center, bottom;

	mask-image: url('../img/top/clouds-mask-top.svg'),
		url('../img/top/mask-middle.png'),
		url('../img/top/clouds-mask-bottom.svg');
	mask-repeat: repeat-x, no-repeat, repeat-x;
	mask-size: 1440px 384px, 100% calc(100% - 768px), 1440px 384px;
	mask-position: top, center, bottom;
}

#top-kabuto-platec h2.img>img {
	width: 100%;
}

#top-kabuto-platec h2.img {
	max-width: 406px;
	width: 58%;
	position: relative;
	display: block;
	margin-bottom: 30px;
}

#top-kabuto-platec h3 {
	background: none;
}

svg {
	position: absolute;
}

.benefits-list,
.kabuto-platec-nmb.list.flexBlock {
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 10px;
}

.kabuto-platec-nmb.list.flexBlock+.btn-orange {
	margin-bottom: 70px;
}

.benefits-list>li {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-around;
	padding: 10px 0;
	text-align: center;
	color: #005293;
	flex-direction: column;
	background: #FFFFFF;
	border-radius: 20px;
	width: calc(33.3% - 12px);
	height: auto;
	margin-bottom: 30px;
	margin-left: 6px;
	margin-right: 6px;
	border: 4px solid #00267F;
}

.kabuto-platec-nmb.list.flexBlock>li {
	position: relative;
	display: block;
	border-radius: 20px;
	width: calc(33.3% - 12px);
	height: auto;
	margin-bottom: 30px;
	margin-left: 6px;
	margin-right: 6px;
	border: 4px solid #00267F;
	overflow: hidden;
	transition: 0.5s ease-out;
	opacity: 0;
	transform: translateY(50px);
}

.kabuto-platec-nmb.list.flexBlock>li img {
	width: 100%;
	position: relative;
	display: block;
}

.kabuto-platec-nmb.list.flexBlock>li.effect-scroll {
	opacity: 1;
	transform: translateY(0px);
}

.benefits-list>li {
	padding: 20px 20px 30px;
}

.benefits-list>li>.header {
	width: 100%;
	align-items: center;
	font-size: 2.0rem;
	justify-content: flex-start;
	text-align: left;
	margin-bottom: 10px;
	line-height: 1.6;
}

.benefits-list>li>.header>img {
	width: 106px;
	height: auto;
	margin-right: 15px;
}

.benefits-list>li>.text {
	text-align: left;
	padding: 0;
	color: #014196;
}

.check-list {
	flex-wrap: wrap;
	position: relative;
}

.check-list>li {
	margin: 0 5px 10px;
	width: calc(25% - 10px);
	font-size: 1.8rem;
	color: #FFFFFF;
	background: #00267F;
	border-radius: 5px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 0 10px 0 15px;
	line-height: 1.6;
	min-height: 50px;
}

.check-list>li:before {
	content: '';
	position: relative;
	display: block;
	background: url('../img/top/icon-check.png') no-repeat center center;
	background-size: 100% auto;
	width: 29px;
	height: 26px;
	margin-right: 3px;
	margin-top: -5px;
}

#top-working-life {
	margin-top: 120px;
	margin-bottom: 120px;
	background-image: linear-gradient(120deg, #eceded, #e6e6e9 70%, #d9d8d8);
	position: relative;
	display: block;
}

#working-life #top-working-life {
	margin-top: 0px;
	margin-bottom: 0px;
}

#top-working-life>.flexBlock {
	align-items: flex-end;
	justify-content: center;
	width: 100%;
	max-width: 1300px;
	margin: 0 auto;
}

#top-working-life>.flexBlock>.rel {
	width: 27%;
}

#top-working-life>.flexBlock>.rel>img {
	width: 100%;
}

#top-working-life>.flexBlock>.rel>img.abs {
	width: 70%;
	max-width: 240px;
	left: 0;
	right: 0;
	margin: 0 auto;
	bottom: 23%;
}

#top-working-life>.flexBlock>div.flexBlock {
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	padding-top: 12px;
	padding-bottom: 40px;
	width: 46%;
}

#top-working-life>.flexBlock>.flexBlock>h2.img {
	margin-bottom: 20px;
}

#top-working-life>.flexBlock>.flexBlock>h2.img>img {
	width: 100%;
}

#top-working-life>.flexBlock>.flexBlock>p.text {
	background: none;
	padding: 0;
	margin-bottom: 60px;
	text-align: left;
}

#working-life #top-working-life>.flexBlock>.flexBlock>h2.img {
	margin-bottom: 40px;
	position: relative;
	display: block;
}

#working-life #top-working-life>.flexBlock>.flexBlock>p.text {
	margin-bottom: 100px;
}

#top-working-life>.flexBlock>.flexBlock>.btn-orange {
	width: calc(100% - 30px);
}

#top-faqs {
	background: #9DE3FF;
	padding-top: 120px;
	padding-bottom: 150px;

	-webkit-mask-image: url('../img/top/jagged-top.svg'),
		url('../img/top/mask-middle.png'),
		url('../img/top/jagged-bottom.svg');
	-webkit-mask-repeat: repeat-x, no-repeat, repeat-x;
	-webkit-mask-size: 100px 50px, 100% calc(100% - 100px), 100px 50px;
	-webkit-mask-position: top, center, bottom;

	mask-image: url('../img/top/jagged-top.svg'),
		url('../img/top/mask-middle.png'),
		url('../img/top/jagged-bottom.svg');
	mask-repeat: repeat-x, no-repeat, repeat-x;
	mask-size: 100px 50px, 100% calc(100% - 100px), 100px 50px;
	mask-position: top, center, bottom;
}

#top-faqs h2.img {
	width: 88%;
	max-width: 550px;
	margin: 0 auto 40px;
}

#top-faqs h2.img>img {
	width: 100%;
}

.faq-list {
	width: 100%;
	margin-bottom: 15px;
}

.faq-list>div {
	width: 100%;
	height: auto;
	line-height: 1.8;
	padding: 10px 30px;
	text-align: left;
}

.faq-list>div .i {
	width: 38px;
	min-width: 38px;
	margin-right: 28px;
}

.faq-list>div .i>img {
	width: 100%;
	height: auto;
	display: block;
}

.faq-list>.q {
	min-height: 100px;
	font-size: 2.0rem;
	background: #00267F;
	border-radius: 50px;
	color: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	cursor: pointer;
}

.faq-list>.q>.btn-open {
	width: 40px;
	height: 40px;
	position: relative;
	display: block;
	margin-left: auto;
}

.faq-list>.q>.btn-open>span {
	transition: 0.3s ease-out;
	width: 100%;
	height: 4px;
	border-radius: 2px;
	background: #FFFFFF;
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
	margin: auto 0;
	left: 0;
	transform-origin: center center;
}

.faq-list.active>.q>.btn-open>span:nth-child(1),
.faq-list.active>.q>.btn-open>span:nth-child(2) {
	transform: rotate(0deg);
}

.faq-list>.q>.btn-open>span:nth-child(1) {
	transform: rotate(180deg);
}

.faq-list>.q>.btn-open>span:nth-child(2) {
	transform: rotate(270deg);
}

.faq-list>.a>.flexBlock {
	align-items: center;
	justify-content: flex-start;
}

.faq-list>.a .text {
	padding: 0;
	background: none;
	text-align: left;
}

#top-job-description {
	padding-top: 70px;
	padding-bottom: 80px;
}

.plate-white-bg.inner,
#top-job-description>.inner {
	border-radius: 10px;
	padding: 80px;
	background: #FFFFFF;
}

#top-job-description h4 {
	margin-top: 40px;
	margin-bottom: 20px;
	font-size: 3.0rem;
	color: #00267F;
}

.table {
	flex-wrap: wrap;
	font-size: 1.6rem;
	text-align: left;
	border-bottom: 1px solid rgba(0, 0, 0, 0.5);
	align-items: stretch;
}

.table>dt {
	width: 33%;
	padding: 30px 5px;
	border-top: 1px solid rgba(0, 0, 0, 0.5);
	display: flex;
	align-items: center;
	font-weight: 700;
}

.job-description .table>dt {
	color: #00267F;
}

.table>dd {
	width: 67%;
	padding: 30px 5px;
	border-top: 1px solid rgba(0, 0, 0, 0.5);
	display: flex;
	align-items: center;
}

.job-description .table>dd {
	color: #373737;
}

.table>.map-dt {
	align-items: flex-start;
}

.table+.btn-orange {
	margin-top: 30px;
}

#top-company-profile {
	padding: 120px 0 150px;
	background: #F5F7F8;
}

#top-company-profile h3 {
	background: none;
}

#top-company-profile>.inner {
	padding: 0 80px;
}

.company-code {
	align-items: center;
}

.company-code>a {
	width: 240px;
	margin-left: 50px;
}

.company-code>a:after {
	display: none !important;
}

.company-code>a>img {
	width: 100%;
}

.company-profile .table {
	color: #000000;
}

.table .map-link {
	color: #00267F;
	text-decoration: underline;
	margin-top: 20px;
}

.table dd.column {
	align-items: flex-start;
}

.table.border-none {
	border: none;
}

footer {
	position: relative;
	display: block;
	background: #00267F;
	padding: 40px 0 35px;
}

footer a[target="_blank"]:after {
	background: url("../img/common/icon-link_white.svg") no-repeat center;
}

footer>.inner {
	display: flex;
	align-items: center;
}

footer>.inner>nav ul li a {
	color: #FFFFFF;
	font-size: 1.6rem;
}

footer>.inner>nav {
	width: calc(100% - 140px);
	justify-content: flex-start;
	align-items: flex-start;
}

footer>.inner>nav ul {
	display: flex;
	flex-direction: column;
	width: 40%;
}

footer>.inner>nav ul:last-child>li:last-child {
	margin-top: 35px;
}

footer>.inner>nav ul li {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	line-height: 1.6;
	margin-bottom: 15px;
}

footer>.inner>nav ul li:before {
	content: '';
	position: relative;
	display: block;
	width: 7px;
	height: 12px;
	background: url('../img/common/floating-arrow_white-right.svg') no-repeat center center;
	margin-right: 12px;
}

footer>.inner>.logo {
	width: 208px;
	position: relative;
	display: flex;
	flex-direction: column;
}

footer>.inner>.logo>:nth-child(1)>img {
	width: 100%;
}

footer>.inner>.logo>:nth-child(2) {
	font-size: 1.6rem;
	margin: 12px auto 0;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 140px;
	background: #00A2E9;
	height: 35px;
	color: #FFFFFF;
}

footer>.inner.bottom {
	font-size: 1.6rem;
	color: #FFFFFF;
	align-items: flex-end;
}

footer>.inner.bottom>div.rel {
	word-break: break-all;
}

footer>.inner.bottom>p:last-child {
	margin-left: auto;
	min-width: 160px;
	padding-left: 5px;
}

footer>.inner.bottom>a {
	color: #FFFFFF;
	font-size: 1.4rem;
	position: relative;
	align-items: center;
}

footer>.inner.bottom>a.pc-only {
	margin-left: 50px;
	padding-bottom: 1px;
	min-width: 154px;
}

footer>.inner.bottom>a:before {
	content: '';
	position: relative;
	display: block;
	width: 6px;
	height: 10px;
	background: url('../img/common/floating-arrow_white-right.svg') no-repeat center center;
	margin-right: 8px;
}

.read-more-btn {
	background: url('../img/common/btn-read-more.svg');
	width: 60px;
	height: 60px;
	position: relative;
	display: block;
	margin: -30px auto 0;
}

.sub-page .breadcrumb {
	width: 100%;
	max-width: 1120px;
	margin: 0 auto;
	padding-left: 15px;
	padding-right: 15px;
	justify-content: flex-start !important;
	align-items: flex-start !important;
}

.sub-page .breadcrumb>li:after {
	content: '＞';
	position: relative;
	display: block;
	margin: 0 3px;
}

.sub-page .breadcrumb>li:last-child:after {
	display: none;
}

.sub-page .breadcrumb>li {
	display: flex;
	align-items: center;
	font-size: 1.4rem;
	color: #373737;
}

.sub-page .breadcrumb>li>a {
	color: #373737;
	text-decoration: underline;
}

.sub-page #top-img-area>div {
	padding-top: 95px;
}

.grayBg {
	background: #E4E5E7;
	padding: 80px 0;
}

.grayBg .btns-middle {
	margin-top: 0;
}

.interview-area {
	width: 100%;
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 120px;
}

.interview-area .img>img {
	width: 100%;
}

.interview-area .img {
	width: 48%;
}

.interview-area .text {
	width: 46%;
	text-align: left !important;
	font-size: 1.6rem;
}

.interview-area .text>.title>img {
	max-width: 100%;
}

.interview-area .text>.title {
	position: relative;
	display: block;
	margin-bottom: 40px;
}

.img-middle {
	margin-bottom: 120px;
	background: #F2F2F2;
}

.img-middle>img {
	width: 100%;
	max-width: 1120px;
	margin: 0 auto;
}

.interview-area-bottom {
	z-index: 1;
	width: 100%;
	max-width: 1120px;
	margin: 0 auto -10px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.interview-area-bottom>div {
	width: 42%;
}

.interview-area-bottom>.img {
	width: 23%;
}

.interview-area-bottom img {
	width: 100%;
}

.top-main-text h2 {
	font-size: 4.0rem;
	color: #00267F;
	text-align: center;
	margin: 100px auto 30px;
	padding: 20px;
	background: #FFFFFF;
	border-radius: 10px;
}

.top-main-text {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.top-main-text>p.text {
	max-width: 960px;
	width: calc(100% - 30px);
	margin-left: auto;
	margin-right: auto;
	font-size: 1.6rem;
	text-align: center;
	color: #262626;
	padding: 15px;
	background: #FFFFFF;
	position: relative;
	display: block;
	border-radius: 10px;
}

.blue {
	color: #00267F !important;
}

.privacy-area {
	position: relative;
	color: #373737 !important;
	font-size: 1.6rem;
	text-align: left;
	padding: 30px 5px;
	border-top: 1px solid #CCCCCC;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
}

.privacy-area h3 {
	font-size: 2.0rem !important;
	color: #373737 !important;
	margin-bottom: 10px;
	padding: 0 !important;
}

.privacy-area a {
	color: #01AEEB;
	text-decoration: underline;
}

#privacy-policy .contents {
	padding-top: 40px;
	margin-bottom: 120px;
}

#crafting #top-img-area h2 {
	width: calc(100% - 30px);
	max-width: 460px;
	margin: 0 auto 30px;
}

#crafting #top-img-area .title-img,
#crafting #top-img-area h2>span img {
	width: 100%;
}

#top-img-area .top-item01 {
	top: 30%;
	left: -5%;
}

#top-img-area .top-item02 {
	top: 10%;
	left: 70%;
}

#top-img-area .top-item03 {
	top: 50%;
	left: 90%;
}

#crafting #top-img-area h2>span {
	width: 90%;
	position: relative;
	display: block;
	margin: 0 auto;
}

#crafting #top-img-area h2>span>img {
	animation: crafting-title-anim 1.8s ease-in-out infinite alternate-reverse;
	transform-origin: center top;
}

@keyframes crafting-title-anim {
	0% {
		transform: rotate(3deg);
	}

	100% {
		transform: rotate(-3deg);
	}
}

#crafting main .contents {
	padding-top: 40px;
}

#crafting main .contents h3 {
	font-size: 2.8rem;
}

#crafting main .text.description {
	max-width: 980px;
	margin-bottom: 100px;
}

.crafting-area {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.crafting-area p.text {
	margin-bottom: 30px;
	font-size: 1.6rem;
	color: #00267F;
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}

.list-area {
	width: calc(100% - 30px);
	max-width: 1040px;
	margin: 0 auto 60px;
}

.list-area.last-child>.flexBlock,
.list-area .swiper-container .swiper-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	border-radius: 30px;
	border: 4px solid #00267F;
	box-sizing: border-box;
	position: relative;
	padding: 70px;
	background: #FFFFFF;
	box-shadow: 0 5px 0 #28C3FF;
	box-sizing: border-box;
}

.list-area.blue-bg .swiper-container .swiper-wrapper {
	background: #00267F;
}

.list-area .swiper-container .swiper-slide {
	width: calc(50% - 20px);
	margin-bottom: 30px;
}

.list-area.last-child>.flexBlock .w100 {
	width: 100%;
}

.list-area.last-child>.flexBlock .w100>.text {
	text-align: center;
	width: 100%;
}

.list-area.last-child>.flexBlock .title,
.list-area .swiper-container .title {
	margin: 10px auto 20px;
	background: #00267F;
	color: #FFFFFF;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.8rem;
	min-height: 60px;
	font-weight: 700;
	text-align: center;
	line-height: 1.6;
}

.list-area.blue-bg .swiper-container .title {
	background: #FFFFFF;
	color: #00267F;
}

.list-area.last-child>.flexBlock .text,
.list-area .swiper-container .swiper-slide .text {
	padding: 0;
	text-align: left;
	color: #262626;
	font-size: 1.6rem;
	background: none;
}

.list-area.blue-bg .swiper-container .text {
	color: #FFFFFF;
}

.list-area.last-child>.flexBlock .img>img,
.list-area .swiper-container .img>img {
	width: 100%;
	display: block;
}

.list-area:after {
	content: '';
	position: relative;
	display: block;
	width: 80px;
	height: 86px;
	background: url('../img/crafting/dot-arrow.svg') no-repeat center center;
	background-size: contain !important;
	margin: 50px auto 0;
}

.list-area.doted:after {
	background: url('../img/crafting/dot.svg') no-repeat center center;
}

.list-area.last-child:after {
	display: none;
}

#job-description main .contents {
	padding-top: 0;
	padding-bottom: 100px;
}

#job-description #top-job-description h4 {
	margin-top: 0;
}

#form input::placeholder,
#form textarea::placeholder {
	color: #B3B3B3;
}

#form {
	padding-top: 150px;
	background: #F6F7F8;
}

#form.contents.hasBg {
	background: none;
	padding-bottom: 0;
}


#form>.inner {
	padding: 80px;
	background: #FFFFFF;
	border-radius: 40px;
}

#form>.inner>div {
	width: 100%;
	max-width: 860px;
	margin: 0 auto;
}

#form>.inner .steps {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 40px;
	background: #E4E5E7;
	overflow: hidden;
}

#form>.inner .steps>li {
	background: #E4E5E7;
	width: 33.3%;
	color: #00267F;
	font-size: 1.8rem;
	height: 64px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 0 25px;
}

#form>.inner .steps>li:nth-child(1) {
	z-index: 3;
}

#form>.inner .steps>li:nth-child(2) {
	z-index: 2;
}

#form>.inner .steps>li:nth-child(3) {
	z-index: 1;
}

#form>.inner .steps>li:before,
#form>.inner .steps>li:after {
	content: '';
	position: absolute;
	display: block;
	top: 0;
	right: -24px;

	width: 0;
	height: 0;
	border-top: 32px solid transparent;
	border-bottom: 32px solid transparent;
	border-left: 24px solid #E4E5E7;
}

#form>.inner .steps>li:last-child:before,
#form>.inner .steps>li:last-child:after {
	display: none;
}

#form>.inner .steps>li:before {
	top: -2px;
	border-top: 34px solid transparent;
	border-bottom: 34px solid transparent;
	border-left: 26px solid #FFFFFF;
	right: -26px;
}

.s1 #form>.inner .steps>li:nth-child(1),
.s2 #form>.inner .steps>li:nth-child(2),
.s3 #form>.inner .steps>li:nth-child(3) {
	background: #00267F;
	color: #FFFFFF;
}

.s1 #form>.inner .steps>li:nth-child(1):after,
.s2 #form>.inner .steps>li:nth-child(2):after {
	border-left: 24px solid #00267F;

}

#form_body {
	color: #373737;
}

#form_body .hasInput input {
	font-size: 1.8rem;
}

#form_body .hasInput>:nth-child(1) {
	width: 45px;
	height: 26px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: #FFFFFF;
	background: #B3B3B3;
	margin-right: 10px;
}

#form_body .hasInput>:nth-child(1).required {
	background: #BC0000;
}

#form_body .hasInput>:nth-child(2) {
	width: calc(100% - 55px);
	height: 26px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	font-weight: 700;
}

#form_body .hasInput>:nth-child(3) {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-top: 10px;
}

#form_body .hasInput> :nth-child(3).column {
	justify-content: flex-start;
	align-items: flex-start;
	text-align: left;
}

#form_body .hasInput> :nth-child(3).column .note {
	font-size: small;
}

#form_body .hasInput input {
	padding: 5px 20px;
	background: #FAFAFA;
	border: 1px solid #B3B3B3;
	display: block;
	width: 100%;
}

#form_body .hasInput.hasRadio>:nth-child(3) {
	display: flex;
	justify-content: space-between;
}

#form_body .hasInput.hasRadio>:nth-child(3)>div {
	display: flex;
	align-items: center;
	margin-right: 10px;
}

#form_body .hasInput.hasRadio>:nth-child(3)>div>input {
	width: 18px;
	height: 18px;
	margin-right: 10px;
}

#form_body .hasChk>:nth-child(1)>input {
	width: 18px;
	height: 18px;
	margin-right: 5px;
}

#form_body .hasInput.situation-area>:nth-child(3) {
	justify-content: flex-start;
}

#form_body .hasInput.situation-area>:nth-child(3)>div>input+label {
	min-width: 80px;
}

#form_body .hasInput {
	margin-bottom: 25px;
	align-items: flex-start;
	justify-content: flex-start;
	font-size: 1.6rem;
	flex-wrap: wrap;
}

#form_body .hasInput #form_body .selectbox {
	position: relative;
}

#form_body .selectbox {
	position: relative;
	display: block;
}

#form_body .selectbox:before,
#form_body .selectbox:after {
	position: absolute;
	content: '';
	pointer-events: none;
}

#form_body .selectbox:before {
	display: inline-block;
	right: 0;
	width: 34px;
	height: 48px;
	border-radius: 0 3px 3px 0;
	background-color: #00277F;
}

#form_body .selectbox:after {
	position: absolute;
	top: 50%;
	right: 17px;
	transform: translate(50%, -50%);
	width: 8px;
	height: 8px;
	border-top: 6px solid #fff;
	border-right: 6px solid transparent;
	border-left: 6px solid transparent;
}

#form_body .selectbox select {
	appearance: none;
	min-width: 230px;
	height: 48px;
	padding: .4em 40px .4em .8em;
	border: none;
	border-radius: 3px;
	background-color: #FAFAFA;
	border: 1px solid #B3B3B3;
	color: #333;
	font-size: 1em;
	cursor: pointer;
}

.s2 #form_body .selectbox select {
	background-color: #FFFFFF;
	border: none;
}

.s2 #form_body .selectbox:before,
.s2 #form_body .selectbox:after {
	display: none;
}

.s3 .contact-success h3 {
	font-size: 2.6rem;
}

#form_body>.flexBlock.hasInput textarea {
	background: #FAFAFA;
	border: 1px solid #B3B3B3;
	width: 100%;
	padding: 10px 20px;
	height: 300px;
	resize: none;
}

#form_body .hasChk {
	flex-direction: column;
	margin-bottom: 50px;
	text-align: center;
	justify-content: center;
	align-items: center;
	font-size: 1.6rem;
}

#form_body .hasChk a {
	color: #1887C7;
	text-decoration: underline;
	/*display: flex;*/
	align-items: center;
	margin: 0 8px 0 0;
}

#form_body .hasChk>:nth-child(1) {
	margin-bottom: 30px;
	display: flex;
	align-items: center;
}

#form_body .btns>.btn {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	border-radius: 40px;
	height: 60px;
	transition: 0.3s ease-out;
	overflow: hidden;
	cursor: pointer;
	font-size: 2.0rem;
	font-weight: 700;
}

#form_body .btns>.btn,
#form_body .btns>.btn-orange {
	max-width: 320px;
	padding: 10px 25px;
}

.contact-success .btns>a>span,
#form_body .btns>.btn>span {
	position: relative;
	display: block;
}

#form_body .step1>.btn {
	width: 100%;
	max-width: 480px;
	color: #005293;
	border: 2px solid #005293;
}

#form .flexBlock.column.text-block {
	padding-top: 120px;
}

#form .flexBlock.column.text-block h3,
#form .flexBlock.column.text-block .text.description {
	background: none;
	color: #012680;
	padding: 0;
	max-width: 1120px;
}

#form .flexBlock.column.text-block h3 {
	margin-bottom: 50px;
}

#form .flexBlock.column.text-block .text.description {
	margin: 0 auto 35px;
}

.s2 #form_body .step1.btns,
.s3 #form_body .step1.btns,
#form_body .step2.btns {
	display: none;
}

#form_body .step1.btns,
.s2 #form_body .step2.btns {
	display: flex;
}

#form_body .step1.btns>.btn-orange {
	width: 220px;
	cursor: pointer;
}

.s2 section#form #form_body input::placeholder,
.s2 section#form #form_body textarea::placeholder {
	opacity: 0;
}

.s2 #form_body .hasChk input,
.s2 #form_body .hasInput input,
.s2 #form_body .hasInput textarea {
	pointer-events: none;
	background: #FFFFFF;
	border: none;
}

.s2 input[type="checkbox"],
.s2 input[type="radio"],
.s2 input[type="checkbox"]+label,
.s2 input[type="radio"]+label {
	display: none !important;
}

.s2 input[type="checkbox"]:checked,
.s2 input[type="radio"]:checked,
.s2 input[type="checkbox"]:checked+label,
.s2 input[type="radio"]:checked+label {
	display: block !important;
}

.s2 #form_body .hasInput.hasRadio>:nth-child(3) {
	justify-content: flex-start;
}

.s2 #form_body .hasInput textarea {
	height: auto;
}

.s2 #form_body .hasChk {
	padding-left: 0;
}

.step2 {
	width: 100%;
	max-width: 580px;
	margin-left: auto;
	margin-right: auto;
	justify-content: space-between;
}

.step2>.btn {
	width: calc(50% - 12px);
	margin-left: inherit;
	margin-right: inherit;
}

.step2>.btn:nth-child(1) {
	background: #B3B3B3;
	border: 2px solid #B3B3B3;
	color: #FFFFFF;
}

.step2>.btn:nth-child(1):before {
	content: '';
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
	margin: auto 0;
	left: 20px;
	width: 15px;
	height: 15px;
	background: url('../img/common/arrow_white-left.svg') no-repeat;
	background-size: auto;
	background-size: contain !important;
}

.s3 #form_body {
	display: none;
}

.contact-success {
	text-align: center;
	color: #373737;
	display: none;
}

.s3 .contact-success {
	display: block;
}

.contact-success h3 {
	font-size: 2.0rem;
}

.contact-success p {
	font-size: 1.6rem;
}

.contact-success .btns {
	margin-top: 70px;
}

.contact-success .btns>a {
	max-width: 320px;
}

.effect-img>img {
	opacity: 0;
	transform: scale(1.3, 1.3) rotate(5deg);
	transition: 0.6s ease-in-out;
}

.effect-scroll.effect-img>img {
	opacity: 1;
	transform: scale(1, 1) rotate(0deg);
}

.interview-area-bottom .effect-img>img {
	opacity: 0;
	transform: scale(0, 0);
	transform-origin: center bottom;
	transition: 0.77s cubic-bezier(.47, 1.64, .41, .8);
}

.interview-area-bottom .effect-scroll.effect-img>img {
	opacity: 1;
	transform: scale(1, 1);
}

@media screen and (min-width: 769px) {

	.read-more-area,
	.text-content {
		max-height: none;
		overflow: visible;
	}

	.read-more-area:after,
	.text-content:after {
		display: none;
	}

	.read-more-btn {
		display: none !important;
	}
}

@media screen and (max-width: 768px) {
	#form>.inner .steps>li:after {
		content: '';
		position: absolute;
		display: block;
		top: 0;
		right: -16px;
		width: 0;
		height: 0;
		border-top: 24px solid transparent;
		border-bottom: 24px solid transparent;
		border-left: 16px solid #E4E5E7;
	}

	#form>.inner .steps>li:before {
		top: -2px;
		border-top: 26px solid transparent;
		border-bottom: 26px solid transparent;
		border-left: 18px solid #FFFFFF;
		right: -18px;
	}

	.s1 #form>.inner .steps>li:nth-child(1)::after,
	.s2 #form>.inner .steps>li:nth-child(2)::after {
		border-left: 16px solid #00267F;
	}

	#form>.inner .steps>li {
		height: 48px;
		font-size: 14px;
	}

	#form>.inner {
		padding: 40px 15px;
		width: calc(100% - 30px);

	}

	#form .flexBlock.column.text-block {
		padding-top: 50px;
		padding-left: 15px;
		padding-right: 15px;
	}

	#form_body .hasChk {
		padding-left: 0;
	}

	#form_body .hasInput {
		flex-wrap: wrap;
		font-size: 1.4rem;
		align-items: flex-start;
		margin-bottom: 30px;
	}

	#form_body .hasInput.hasTextArea {
		margin-bottom: 60px;
	}

	#form_body .hasInput> :nth-child(3) {
		width: 100%;
		align-items: flex-start;
	}

	#form_body .hasInput.hasRadio> :nth-child(3) {
		flex-direction: column;
	}

	#job-description main .contents {
		padding-bottom: 50px;
	}

	#form_body .hasInput input {
		font-size: 1.6rem;
		padding: 15px 10px;
		height: 50px;
	}

	#form_body .step1 {
		padding-left: 0;
	}

	#form_body .btns>.btn {
		height: 50px;
		font-size: 1.8rem;
	}

	#form_body .btns.step2>.btn {
		width: calc(50% - 7px);
		font-size: 1.6rem;
	}

	#form_body .selectbox select {
		height: 50px;
	}

	#form_body .selectbox::after {
		right: 25px;
	}

	#form_body .selectbox:before {
		width: 50px;
		height: 50px;
	}

	#form_body .selectbox,
	#form_body .selectbox select {
		width: 100%;
		min-width: auto;
	}

	#form_body .hasRadio> :last-child>div {
		width: 100% !important;
	}

	.contact-success h3 {
		font-size: 1.8rem;
	}

	.contact-success p {
		font-size: 1.4rem;
	}

	.s3 #form {
		padding-top: 50px;
	}

	#form_body .hasChk>:last-child {
		text-align: left;
	}

	.list-area .swiper-button-disabled {
		display: none !important;
	}

	.swiper-button-prev.sp-only,
	.swiper-button-next.sp-only {
		width: 40px;
		height: 40px;
		top: 0;
		bottom: 0;
		margin: auto 0;
	}

	.swiper-button-prev.sp-only>svg,
	.swiper-button-next.sp-only>svg {
		display: none;
	}

	.swiper-button-prev.sp-only {
		background: url('../img/common/btn-prev.svg') no-repeat center center;
		left: -5px;
	}

	.swiper-button-next.sp-only {
		background: url('../img/common/btn-next.svg') no-repeat center center;
		right: -5px;
	}

	.list-area::after {
		margin: 40px auto 0;
	}

	.list-area .swiper-container {
		position: relative;
		justify-content: flex-start;
		display: flex;
	}

	.list-area.last-child>.flexBlock .w100>.text {
		text-align: left;
	}

	.list-area.last-child>.flexBlock,
	.list-area .swiper-container .swiper-wrapper {
		border-radius: 20px;
		padding: 15px;
		width: fit-content;
		flex-wrap: nowrap;
		margin-left: 0;
		margin-right: auto;
	}

	.list-area .swiper-container .swiper-wrapper {
		padding: 0;
		justify-content: flex-start;
	}

	.list-area.last-child>.flexBlock .text,
	.list-area .swiper-container .swiper-slide .text {
		font-size: 1.4rem;
	}

	.list-area.last-child>.flexBlock .text,
	.list-area .swiper-container .swiper-slide .title {
		font-size: 1.6rem;
	}

	.list-area .swiper-container .swiper-slide {
		margin-bottom: 0px;
		margin-right: 0px;
		padding-bottom: 35px;
		padding: 15px 15px 45px;
	}

	.swiper-pagination-bullet {
		background: #C3C3C3;
	}

	.swiper-pagination-bullet-active {
		background: #00267F;
	}

	.blue-bg .swiper-pagination-bullet-active {
		background: #FFFFFF;
	}

	.list-area .swiper-container .swiper-slide:last-child {
		margin-right: 0;
	}

	.swiper-horizontal>.swiper-pagination-bullets,
	.swiper-pagination-horizontal.swiper-pagination-bullets {
		top: auto;
		bottom: 15px;
	}

	#crafting .crafting-area h3>img {
		width: 100%;
	}

	#crafting .crafting-area h3 {
		margin-bottom: 15px;
	}

	#crafting h3.crafting-title01 {
		width: 212px;
		padding: 0;
	}

	#crafting h3.crafting-title02 {
		width: 212px;
		padding: 0;
	}

	#crafting h3.crafting-title03 {
		width: 332px;
		padding: 0;
	}

	#crafting h3.crafting-title04 {
		width: 226px;
		padding: 0;
	}

	#crafting h3.crafting-title05 {
		width: 158px;
		padding: 0;
	}

	#crafting #top-img-area h2 {
		padding-top: 20px;
	}

	#crafting main .contents h3 {
		font-size: 2.4rem;
	}

	#crafting.sub-page #top-img-area {
		margin-bottom: 0;
	}

	#crafting main .contents {
		padding-top: 0;
	}

	#crafting #top-img-area .top-item03 {
		top: 50%;
	}

	.top-main-text>p.text {
		font-size: 1.4rem;
		padding: 10px;
		text-align: left
	}

	.top-main-text h2 {
		font-size: 3.0rem;
		margin: 30px auto;
		line-height: 1.6;
	}

	#privacy-policy.sub-page #top-img-area {
		margin-bottom: 0;
	}

	.privacy-area h3 {
		font-size: 1.6rem !important;
		margin-bottom: 10px !important;
	}

	.privacy-area {
		font-size: 1.4rem;
	}

	#privacy-policy .contents {
		margin-bottom: 50px;
	}

	.grayBg {
		padding: 45px 0;
	}

	.interview-area-bottom {
		flex-wrap: wrap;
		max-width: 375px;
		width: calc(100% - 15px);
		justify-content: space-around;
	}

	.interview-area-bottom>:nth-child(2) {
		order: 1;
		width: 100%;
		margin-bottom: 15px;
	}

	.interview-area-bottom>:nth-child(1),
	.interview-area-bottom>:nth-child(3) {
		order: 2;
		width: 40%;
	}

	.sub-page #top-img-area>div {
		padding-top: 75px;
	}

	.sub-page #top-img-area {
		margin-bottom: 60px;
	}

	.interview-area {
		flex-direction: column;
		width: calc(100% - 30px);
		margin-bottom: 80px;
	}

	.interview-area>.img {
		order: 1;
		width: 100%;
		margin-bottom: 20px;
	}

	.interview-area>.text {
		order: 2;
		width: 100%;
		font-size: 1.4rem;
	}

	.interview-area .text>.title {
		margin-bottom: 20px;
	}

	.sub-page .breadcrumb>li {
		font-size: 1.2rem;
	}

	#working-life #top-working-life>.flexBlock>.flexBlock>h2.img {
		margin-bottom: 20px;
	}

	#working-life #top-working-life>.flexBlock>.flexBlock>p.text {
		margin-bottom: 0px;
	}

	.read-more-area,
	.text-content {
		padding-top: 80px;
		max-height: calc(70em + 60px);
		overflow: hidden;
		transition: max-height 0.3s ease;
		position: relative;
		display: block;
	}

	.read-more-area {
		padding-top: 0;
	}

	.read-more-area-outer {
		margin-bottom: 70px;
	}

	.read-more-area {
		max-height: calc(190vw + 60px);
	}

	.benefits-list+.read-more-area-outer>.read-more-area {
		max-height: calc(20em + 60px);
	}

	.read-more-area:after,
	.text-content:after {
		content: '';
		position: absolute;
		display: block;
		height: 100px;
		width: 100%;
		bottom: 0;
		left: 0;
		background-image: linear-gradient(0deg, #ffffff 0%, transparent);
	}

	.read-more-area:after {
		background-image: linear-gradient(0deg, #9DE3FF 0%, transparent);
	}

	.active>.read-more-area,
	.active>.text-content {
		max-height: none !important;
		overflow: visible;
	}

	.active>.read-more-area:after,
	.active>.text-content:after {
		display: none;
	}
}

@media screen and (max-width:900px) {

	.benefits-list>li,
	.kabuto-platec-nmb.list.flexBlock>li {
		width: calc(50% - 16px);

	}
}

@media screen and (min-width:769px) {

	footer>.inner.bottom>a:hover,
	footer>.inner>nav ul li a:hover {
		text-decoration: underline;
	}

	.company-code>a,
	header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius)>span>span,
	header.nav>.flexBlock .pc-only.nav-area ul li:last-child>a,
	.flexBlock.links>li>a,
	.banner-pdf,
	#floating-banner .huki,
	.btn-orange {
		animation: hoverUp 0.7s ease-out forwards;
	}

	.btn-orange:hover {
		background: #FFFFFF;
		color: #FF7300;
		transform-origin: center center;
		animation: hoverUp 1.7s ease-in-out infinite;
	}

	.btn-orange:hover:after {
		background: url('../img/common/arrow_orange-right.svg') no-repeat;
	}

	#floating-banner:hover .huki>div {
		background: #FF7300;
		color: #FFFFFF;
	}

	.company-code>a:hover,
	.banner-pdf:hover,
	#floating-banner:hover .huki,
	header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):hover>span>span {
		transform-origin: center center;
		animation: hoverUp 1.7s ease-in-out infinite;
	}

	header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):hover:before,
	header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):hover:after,
	header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):hover>span:before,
	header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):hover>span:after {
		transform: translate(-50%, -50%) scale(1, 1) rotate(380deg);
	}

	header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):hover:before {
		left: -10%;
		top: 0%;
	}

	header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):hover:after {
		left: 0%;
		top: 100%;
	}

	header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):hover>span:before {
		left: 100%;
		top: -10%;
	}

	header.nav>.flexBlock .pc-only.nav-area ul li>a:not(.radius):hover>span:after {
		left: 90%;
		top: 90%;
	}

	.flexBlock.links>li>a:hover:before {
		background: url('../img/common/arrow_white-bottom.svg') no-repeat;
	}

	header.nav>.flexBlock .pc-only.nav-area ul li:last-child>a:hover {
		background: #FFFFFF;
		color: #FF7300;
		transform-origin: center center;
		animation: hoverUp 1.7s ease-in-out infinite;
	}

	.flexBlock.links>li>a:hover {
		background: #00267F;
		color: #FFFFFF;
		transform-origin: center center;
		animation: hoverUp 1.7s ease-in-out infinite;
	}
}

@media screen and (max-width:1060px) {
	header.nav>.flexBlock>h1>a>span:nth-child(1) {
		width: calc(100% - 95px);
	}

	header.nav>.flexBlock>h1>a>span:nth-child(2) {
		width: 85px;
		height: 25px;
		font-size: 1.3rem;
	}

	header.nav>.flexBlock {
		padding-left: 10px;
		padding-right: 10px;
	}

	header.nav>.flexBlock .pc-only.nav-area ul li {
		margin-left: 15px;
		margin-right: 15px;
	}

	header.nav>.flexBlock .pc-only.nav-area ul li>a {
		font-size: 1.4rem;
	}

	.btns-middle {
		border-radius: 100px;
	}
}

@media screen and (max-width:860px) {
	header.nav>.flexBlock .pc-only.nav-area ul li {
		margin-left: 5px;
		margin-right: 5px;
	}

	.btns-middle {
		border-radius: 80px;
	}
}

@media screen and (max-width:768px) {
	.active.fixedObject {
		z-index: 1010;
		height: auto;
		background: rgba(183, 222, 253, 0.9);
	}

	.active.fixedObject .links>li {
		position: relative;
		pointer-events: all;
		opacity: 1 !important;
		margin-bottom: 5px;
	}

	.btn-close {
		width: 150px;
		height: 30px;
		margin: 30px auto 20px;
		position: relative;
		display: none;
		font-size: 1.2rem;
		line-height: 1;
		text-align: center;
	}

	.btn-close:before {
		content: '';
		position: relative;
		background: url('../img/common/floating-arrow_blue-top.svg') no-repeat;
		background-size: contain;
		width: 13px;
		height: 9px;
		display: block;
		margin: 0 auto 5px;
	}

	.active.fixedObject .btn-close {
		display: block;
		color: #00267F;
	}

	.active.fixedObject .links>li>a {
		border: transparent;
		background: none;
	}

	.active.fixedObject .links>li.current>a {
		border: 2px solid #00267F;
	}

	.fixedObject .links {
		min-height: 60px;
	}

	header.nav>.flexBlock>h1 {
		max-width: 320px;
		min-width: 250px;
		width: 78%;
	}

	main .contents {
		padding-top: 0;
	}

	main .contents>.inner {
		padding-top: 80px;
	}

	.fixed .fixedObject {
		position: fixed;
		background: #B7DEFD;
		width: 100%;
		height: auto;
		top: 0;
		left: 0;
	}

	.fixed header.nav,
	.open.fixed .fixedObject,
	.nav-hidden.fixed .fixedObject {
		transform: translateY(-100%);
	}

	.open.fixed header.nav {
		transform: translateY(0%);
	}

	.fixedObject {
		position: absolute;
		width: 100%;
		top: 0;
		z-index: 1001;
		height: 60px;
		transition: 0.3s ease-out;
	}

	.open .fixedObject {
		z-index: 998 !important;
	}

	.fixedObject .links>li {
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 0;
		margin: 0 auto;
		top: 0;
		opacity: 0;
		width: calc(100% - 130px);
		max-width: 280px;
		min-width: 230px;
		font-size: 1.3rem;
		padding-top: 8px;
	}

	.fixedObject .links>li>a:before {
		width: 13px;
		height: 12px;
		left: 15px;
	}

	.fixedObject .links>li>a {
		height: 45px;
		padding: 0 5px 0 25px;
		font-size: 1.4rem;
	}

	.fixedObject .links>li:nth-child(1) {
		opacity: 1;
	}

	footer>.inner.bottom {
		font-size: 1.4rem;
	}

	footer>.inner.bottom a {
		margin-top: 10px;
	}

	footer>.inner.bottom>p:last-child {
		min-width: 160px;
		padding-left: 0;
		width: 100%;
	}

	footer>.inner.bottom .jost {
		font-size: 1.2rem;
		margin-top: 20px;
	}

	footer {
		padding-bottom: 105px;
	}

	footer>.inner {
		align-items: center !important;
		flex-direction: column;
		justify-content: center;
		text-align: center;
	}

	footer>.inner>.logo> :nth-child(2) {
		height: 30px;
		font-size: 1.4rem;
		width: 120px;
		margin: 10px auto 25px;
	}

	footer>.inner>.logo {
		width: 154px;
	}

	#top-company-profile {
		padding: 50px 0 50px;
	}

	.table .map-link {
		margin-top: 10px;
	}

	.table dd.column iframe {
		height: 267px;
	}

	#top-company-profile>.inner {
		padding: 0 25px;
	}

	.table>dt {
		width: 100%;
		padding-bottom: 5px;
		padding-top: 25px;
	}

	.table>dd {
		width: 100%;
		border-top: none;
		padding-top: 0px;
		padding-bottom: 25px;
	}

	.company-code {
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
	}

	.company-code>a {
		max-width: 327px;
		width: 100%;
		margin-left: 0px;
		margin-top: 15px;
	}

	#top-job-description {
		padding-bottom: 40px;
	}

	.plate-white-bg.inner,
	#top-job-description>.inner {
		padding: 50px 10px 80px;
		background: #FFFFFF;
		width: calc(100% - 30px);
		border-radius: 40px;
	}

	.table {
		font-size: 1.4rem;
	}

	#top-job-description h4 {
		font-size: 1.6rem;
		margin-top: 0px;
	}

	.faq-list>.a>.flexBlock {
		align-items: flex-start;
	}

	.faq-list {
		width: calc(100% - 30px);
		margin-left: auto;
		margin-right: auto;
	}

	#top-faqs {
		padding-top: 80px;
		padding-bottom: 100px;
		-webkit-mask-size: 50px 25px, 100% calc(100% - 50px), 50px 25px;
		mask-size: 50px 25px, 100% calc(100% - 50px), 50px 25px;
	}

	.faq-list>.q>.btn-open {
		width: 31px;
		height: 31px;
	}

	.faq-list>div {
		padding: 10px 18px;
	}

	.faq-list>div.a {
		padding: 10px 5px 10px 15px;
	}

	.faq-list>.q {
		font-size: 1.6rem;
	}

	.faq-list>div .i {
		width: 29px;
		min-width: 29px;
		margin-right: 20px;
	}

	#top-working-life>.flexBlock>.flexBlock>p.text {
		margin-bottom: 0;
	}

	#top-working-life>.flexBlock {
		flex-wrap: wrap;
		justify-content: space-between;
	}

	#top-working-life>.flexBlock>.rel {
		order: 2;
		width: calc(50% - 15px);
	}

	#top-working-life>.flexBlock>div.flexBlock {
		order: 1;
		width: calc(100% - 30px);
		max-width: 610px;
		margin: 0 auto;
		padding-bottom: 0;
	}

	#top-working-life>.flexBlock>.btn-orange {
		bottom: 2%;
		position: absolute;
		z-index: 1;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
	}

	#top-working-life>.flexBlock {
		align-items: flex-start;
		margin: 0 auto;
	}

	#top-kabuto-platec h2.img {
		margin-top: 30px;
		margin-bottom: 15px;
		width: 65%;
	}

	#top-working-life>.flexBlock>.rel>img.abs {
		width: 90%;
		bottom: 35%;
	}

	.cloud-area {
		padding-top: 150px;
		padding-bottom: 130px;
		background-size: 413px auto;

		-webkit-mask-size: 480px 128px, 100% calc(100% - 256px), 480px 128px;
		-webkit-mask-position: top, center, bottom;
		mask-size: 480px 128px, 100% calc(100% - 256px), 480px 128px;
		mask-position: top, center, bottom;
	}

	.btns-middle .btns-area {
		flex-direction: column;
		width: calc(100% - 40px);
	}

	.btns-middle h4.img {
		max-width: 284px;
		width: calc(100% - 40px);
	}

	.btns-middle p.text {
		width: calc(100% - 40px);
	}

	.btns-middle .btns-area>a {
		width: 100%;
		margin-bottom: 15px;
	}

	.btns-middle {
		border-radius: 250px;
		max-width: 500px;
	}

	.btns-middle>div {
		padding: 120px 0;
	}

	.btns-middle::before {
		background-size: 1200px auto;
		background-position: left center;
	}

	.top-staff-voices-area+.btn-orange {
		width: calc(100% - 30px);
		margin-top: 40px;
	}

	.top-staff-voices-area .header h4>span:nth-child(1) {
		padding-right: 0px;
		padding-left: 0px;
	}

	.top-staff-voices-area .header h4>.illust:last-child {
		left: 0px;
		right: 10px;
	}

	.top-staff-voices-area>.text-content::before {
		height: calc(100% - 81px);
		top: 84px;
	}

	.top-staff-voices-area .body {
		padding: 0 15px;
	}

	.top-staff-voices-area .body>.flexBlock {
		flex-wrap: nowrap;
		flex-direction: column;
	}

	.top-staff-voices-area .body>.flexBlock>div {
		border-right: none !important;
		border-bottom: 2px dotted #00267F !important;
		width: 100%;
	}

	.top-staff-voices-area .body>.flexBlock>div:last-child {
		border-bottom: none !important;
	}

	.top-staff-voices-area .header {
		font-size: 1.8rem;
		padding: 15px 5px 10px;
		border-radius: 6px 6px 0px 0px;
	}

	.top-staff-voices-area .header h4 {
		min-height: 64px;
	}

	.top-staff-voices-area .header h4>span {
		padding-right: 130px;
		padding-left: 10px;
		text-align: center;
		white-space: normal;
	}

	.top-staff-voices-area .header h4>span {
		width: 100%;
		padding-right: 0px;
		padding-left: 0px;
	}

	.top-staff-voices-area {
		margin-top: 0;
		margin-bottom: 0;
		width: calc(100% - 30px);
		margin-left: auto;
		margin-right: auto;
	}

	.top-staff-voices-area .header .q-text {
		height: 40px;
		margin: -20px auto 0;
	}

	.top-staff-voices-area .header h4>.illust {
		width: 80px;
		height: auto;
		position: absolute;
		left: 10px;
		top: 0;
		margin-top: 0;
		transform: translateY(calc(-100% - 4px));
	}

	main .contents #top-staff-voices h3.line-left-right:before,
	main .contents #top-staff-voices h3.line-left-right:after {
		height: 48px;
	}

	main .contents #top-staff-voices h3.line-left-right:before {
		transform: rotate(-25deg);
	}

	main .contents #top-staff-voices h3.line-left-right:after {
		transform: rotate(25deg);
	}

	#top-staff-voices {
		padding-top: 0;
	}

	#top-staff-voices h3 {
		margin-top: 30px;
		font-size: 2.4rem;
		margin-bottom: 0;
	}

	.column.text-block>h2.img {
		margin-top: 50px;
		margin-bottom: 30px;
	}

	.banner-pdf {
		margin: 40px auto 80px;
		max-width: 327px;
	}

	.top-bg-loop2 {
		height: 146px;
		animation: bgLoopRight-sp 20s linear infinite;
	}

	.btn-orange {
		font-size: 1.6rem;
		max-width: 360px;
		height: auto;
		width: calc(100% - 30px);
		border-radius: 40px;
		padding-right: 35px;
		padding-left: 35px;
	}

	.btn-orange::after {
		right: 15px;
	}

	main .contents h3 {
		font-size: 3.0rem;
	}

	.text {
		font-size: 1.6rem;
	}

	main .contents .text {
		text-align: left;
	}

	#top-crafting h2.img {
		width: 63%;
		margin-bottom: 15px;
	}

	main .contents h3 {
		margin-bottom: 20px;
	}

	.benefits-list>li {
		width: calc(100% - 30px);
		padding: 10px 20px;
		margin: 0 auto 10px;
	}

	.benefits-list>li>.text {
		display: none;
	}

	#kabuto-platec .benefits-list>li>.text {
		display: block;
		color: #014196;
	}

	.benefits-list>li>.header>img {
		width: 87px;
	}

	.benefits-list>li>.header {
		font-size: 1.8rem;
		margin-bottom: 0;
	}

	.benefits-list {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
		margin-bottom: 10px;
	}

	.check-list>li {
		width: calc(100% - 30px);
		margin: 0 auto 10px;
	}

	.check-list>li:nth-child(n + 4) {
		display: none;
	}

	#kabuto-platec .check-list>li {
		display: flex !important;
	}

	.check-list:after {
		content: '';
		position: relative;
		display: block;
		width: 100%;
		height: 19px;
		background: url('../img/common/dots.svg') no-repeat center center;
		margin: 10px auto 20px;
	}

	#kabuto-platec .check-list:after {
		display: none;
	}

	.kabuto-platec-nmb.list.flexBlock>li {
		width: calc(50% - 5px);
		margin-left: 0;
		margin-right: 0;
		margin-bottom: 10px;
	}

	.kabuto-platec-nmb.list.flexBlock {
		flex-wrap: wrap;
		align-items: stretch;
		justify-content: space-between;
		width: calc(100% - 30px);
		margin-left: auto;
		margin-right: auto;
	}

	#floating-banner {
		flex-direction: row;
		line-height: 1.6;
		align-items: flex-end;
		right: 0;
		bottom: 3px;
	}

	#floating-banner>.sp-only {
		width: 88px;
		min-width: 60px;
		height: 60px;
		background: #FF7300;
		border-radius: 30px;
		justify-content: center;
		align-items: center;
		text-align: center;
		font-size: 1.4rem;
		color: #FFFFFF;
		margin-right: 5px;
	}

	#floating-banner>a>.huki {
		margin-bottom: 0px;
		margin-right: 10px;
		height: 60px;
	}

	#floating-banner>a>.huki>div {
		height: 60px;
	}

	#floating-banner>a>.huki>div>.sp-only {
		padding: 7px;
		font-size: 1.2rem;
	}

	#floating-banner>a>.huki::before,
	#floating-banner>a>.huki::after {
		margin: auto 0;
		top: 0;
		bottom: 0;
		left: auto;
	}

	#floating-banner>a>.huki::before {
		border-left: 12px solid #00267F;
		border-top: 8px solid transparent;
		border-bottom: 8px solid transparent;
		right: -17px;
	}

	#floating-banner>a>.huki::after {
		border-left: 11px solid #FF7300;
		border-top: 7px solid transparent;
		border-bottom: 7px solid transparent;
		right: -13.5px;
	}

	#floating-banner>a>.huki>div {
		flex-direction: row;
	}

	#floating-banner>a>.huki>div>span:last-child {
		width: 22px;
		height: 100%;
		writing-mode: vertical-rl;
	}

	#floating-banner>a>.huki>div>span:last-child>img {
		margin-left: 0;
		margin-top: 3px;
		transform: rotate(90deg);
	}

	#floating-banner>.kabuto-anim {
		width: 53px;
		min-width: 53px;
		height: 68px;
		min-height: 68px;
		animation: kabutoAnim-sp 1.5s steps(1) infinite;
	}

	header.nav {
		height: 60px;
	}

	.nav-btn.sp-only {
		width: 48px;
		height: 48px;
		background: #00267F;
		border-radius: 50%;
		color: #FFFFFF;
		position: fixed;
		cursor: pointer;
		top: 5px;
		right: 5px;
		position: fixed;
		z-index: 1002;
	}

	.nav-btn.sp-only>span:nth-child(-n+2) {
		background: #FFFFFF;
		width: 26px;
		height: 2px;
		border-radius: 2px;
	}

	.nav-btn.sp-only>span {
		position: absolute;
		display: block;
		left: 0;
		right: 0;
		margin: 0 auto;
		transition: 0.3s ease-out;
	}

	.nav-btn.sp-only>span:nth-child(1) {
		top: 15px;
	}

	.nav-btn.sp-only>span:nth-child(2) {
		top: 23px;
	}

	.nav-btn.sp-only>span:nth-child(3) {
		top: 30px;
		font-size: 1.0rem;
		width: 100%;
		text-align: center;
		line-height: 1;
	}

	.open .nav-btn.sp-only>span:nth-child(-n+2) {
		top: 23px;
	}

	.open .nav-btn.sp-only>span:nth-child(1) {
		transform: rotate(225deg);
	}

	.open .nav-btn.sp-only>span:nth-child(2) {
		transform: rotate(-225deg);
	}

	.open .nav-btn.sp-only>span:nth-child(3) {
		opacity: 0;
		top: 35px;
	}

	.sp-only.nav-area {
		position: fixed;
		display: block;
		visibility: hidden;
		transition-duration: .2s;
		transform-origin: center top;
		transform: scale(1, 0);
		pointer-events: none;
		opacity: 0;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		background: rgba(255, 255, 255, 0.9);
		overflow-x: hidden;
		overflow-y: auto;
		z-index: 999;
	}

	.open .sp-only.nav-area {
		visibility: visible;
		opacity: 1;
		pointer-events: all;
		transform: scale(1, 1);
	}

	.sp-only.nav-area>ul {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding-top: 100px;
	}

	.sp-only.nav-area>ul>li {
		transition: none;
		transform: scale(2, 2);
		opacity: 0;
		flex-direction: column;
		margin-bottom: 30px;
	}

	.sp-only.nav-area>ul>li>a {
		font-size: 1.6rem;
		color: #00267F;
		text-align: center;
	}

	.open .sp-only.nav-area>ul>li {
		transition: 0.35s ease-out;
		opacity: 1;
		transform: scale(1, 1);
	}

	.sp-only.nav-area>ul>li:nth-child(1) {
		transition-delay: 0.2s;
	}

	.sp-only.nav-area>ul>li:nth-child(2) {
		transition-delay: 0.3s;
	}

	.sp-only.nav-area>ul>li:nth-child(3) {
		transition-delay: 0.4s;
	}

	.sp-only.nav-area>ul>li:nth-child(4) {
		transition-delay: 0.5s;
	}

	.sp-only.nav-area>ul>li:nth-child(5) {
		transition-delay: 0.6s;
	}

	.sp-only.nav-area>ul>li:nth-child(6) {
		transition-delay: 0.7s;
	}

	.sp-only.nav-area>ul>li:nth-child(7) {
		transition-delay: 0.8s;
	}

	.sp-only.nav-area>ul>li:nth-child(7) a {
		font-size: 1.2rem;
	}

	.sp-only.nav-area>ul>li:nth-child(8) {
		transition-delay: 0.9s;
	}

	#top-img-area {
		padding-top: 80px;
		clip-path: url(#bottomRounded50);
	}

	#top-img-area>.main-img {
		transform: scale(0, 0) translateX(0%);
		align-items: flex-start;
	}

	.loaded.setAnim #top-img-area>.main-img {
		transform: scale(1, 1) translateX(0%);
	}

	#top-img-area>.main-img> :nth-child(1) {
		width: 58%;
	}

	#top-img-area>.main-img> :nth-child(2) {
		position: absolute;
		width: 88%;
		padding-bottom: 0;
		top: auto;
		bottom: -8%;
	}

	#top-img-area>.main-img> :nth-child(2)>img {
		width: 100%;
	}

	#top-img-area>.main-img> :nth-child(3) {
		width: 42%;
		padding-bottom: 0;
	}

	#top-img-area>.main-img> :nth-child(3)>img {
		padding-top: 50%;
	}

	#top-img-area>.bg>img {
		height: 100%;
		width: auto;
	}

	#top-img-area .top-item01 {
		width: 11%;
		top: 30%;
		left: 2%;
	}

	#top-img-area .top-item02 {
		width: 11.5%;
		top: 15%;
		left: 60%;
	}

	#top-img-area .top-item03 {
		width: 10.5%;
		top: 80%;
		left: 85%;
	}

	#top-crafting h2.img .top-item01 {
		width: 17%;
	}

	#top-crafting h2.img .top-item02 {
		width: 18%;
	}

	#top-crafting h2.img .top-item03 {
		width: 16%;
	}

	.top-bg-loop {
		margin-top: -52px;
		width: 100vw;
		height: 104px;
		animation: bgLoopLeft-sp 20s linear infinite;
		mask-size: 100px 162px;
		-webkit-mask-size: 100px 162px;
	}

	main .contents h3.line-left-right {
		padding-left: 30px;
		padding-right: 30px;
		font-size: 2.4rem;
	}

	main .contents h3.line-left-right::after {
		right: 5px;
	}

	main .contents h3.line-left-right::before {
		left: 5px;
	}

	main .contents h3.line-left-right:before,
	main .contents h3.line-left-right:after {
		width: 3px;
		height: 32px;
	}
}

@media screen and (max-width:368px) {
	#floating-banner>a>.huki>div>.sp-only {
		font-size: 1.0;
	}

	#floating-banner>a>.huki>div>.sp-only br {
		display: none;
	}
}

a[target="_blank"]:after {
	content: '';
	position: relative;
	display: inline-block;
	background: url("../img/common/icon-link.svg") no-repeat center;
	width: 16px;
	height: 14px;
	margin-left: 10px;
}

.flexBlock.sp-only,
.sp-only {
	display: none !important;
}

.pc-only {
	display: block !important;
}

br.pc-only {
	display: inline !important;
}

span.pc-only {
	display: inline-block !important;
}

.flexBlock.pc-only {
	display: flex !important;
}

@media screen and (max-width:768px) {

	br.pc-only,
	span.pc-only,
	.flexBlock.pc-only,
	.pc-only {
		display: none !important;
	}

	.sp-only {
		display: block !important;
	}

	.flexBlock.sp-only {
		display: flex !important;
	}

	br.sp-only {
		display: inline !important;
	}
}