@import "root.css";
/*! destyle.css v3.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.css */
* {-webkit-appearance: none;}
*, :after, :before {
	box-sizing: border-box;
	border-style: solid;
	border-width: 0;
}
html {
	font-family:  "游ゴシック", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック",'Zen Kaku Gothic New', sans-serif;
	font-size: 62.5%; /* 10px */
	text-size-adjust: 100%;
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
    font-size: var(--size15);
	font-weight: 500;
	line-height: 1.4;
	color: var(--color-black);
	min-width: 375px;
    margin: 0;
}
@media screen and (min-width: 1025px) {
	body {
		padding-top: var(--size56);
	}
}
@media screen and (max-width : 1024px) {
	body {
		padding-top: 12.4vw;
        padding-bottom: 14.5vw;
	}
	body.home {
		padding-bottom: 21vw;
	}
    body.fixed {
        width: 100%;
        height: 100%;
        position: fixed;
    }
}
body * {
	font-feature-settings: "palt";
}
main {
	display: block;
}
h1, h2, h3, h4, h5, h6 {
	font-size: inherit;
	font-weight: inherit;
    line-height: 1.4;
    margin: 0;
}
address, blockquote, dl, figure, form, iframe, ol, p, pre, table, ul {
	margin: 0;
}
ol, ul {
	padding: 0;
	list-style: none;
}
dt {
	font-weight: 700;
}
dd {
	margin-left: 0;
}
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
	border-top-width: 1px;
	margin: 0;
	clear: both;
	color: inherit;
}
pre {
	font-family: monospace;
	font-size: inherit;
}
address {
	font-style: inherit;
}
a {
	background-color: transparent;
	text-decoration: none;
	color: inherit;
}
abbr[title] {
	text-decoration: underline dotted;
}
b, strong {
	font-weight: bolder;
}
code, kbd, samp {
	font-family: monospace;
	font-size: inherit;
}
small {
	font-size: 80%;
}
sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sub {
	bottom: -0.25em;
}
sup {
	top: -0.5em;
}
embed, iframe, img, object, svg {
	vertical-align: bottom;
}
button, input, optgroup, select, textarea {
	vertical-align: middle;
	color: inherit;
	font: inherit;
	background: transparent;
	padding: 0;
	margin: 0;
	border-radius: 0;
	text-align: inherit;
	text-transform: inherit;
}
[type=button], [type=reset], [type=submit], button {
	cursor: pointer;
}
[type=button]:disabled, [type=reset]:disabled, [type=submit]:disabled, button:disabled {
	cursor: default;
}
:-moz-focusring {
	outline: auto;
}
select:disabled {
	opacity: inherit;
}
fieldset, option {
	padding: 0;
}
fieldset {
	margin: 0;
	min-width: 0;
}
legend {
	padding: 0;
}
progress {
	vertical-align: baseline;
}
textarea {
	overflow: auto;
}
[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
	height: auto;
}
[type=search] {
	outline-offset: -2px;
}
label[for] {
	cursor: pointer;
}
details {
	display: block;
}
summary {
	display: list-item;
}
[contenteditable]:focus {
	outline: auto;
}
table {
    border-color: inherit;
	border-collapse: collapse;
	width: 100%;
}
td, th {
    vertical-align: top;
    text-align: left;
    padding: 0;
}
caption {
	text-align: left;
}
/*! the-new-css-reset | MIT License | https://github.com/elad2412/the-new-css-reset */
.regular {
	font-weight: 400;
}
.bold {
	font-weight: 700;
}
.mont {
	font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}
::selection {
	background: rgba(128, 128, 128, 0.2);
}
label {
	display: inline-block;
	cursor: pointer;
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}
em {
	font-style: normal;
}
p {
	line-height: 1.8;
}
@media screen and (max-width : 1024px) {
	p {
		font-size: var(--size30);
	}
}
p + p {
	margin-top: 1.714em;
}
/*
// 游ゴシック使うなら*/
@font-face {
		font-family: "Yu Gothic";
		src: local("Yu Gothic Medium");
		font-weight: 100;
}
@font-face {
		font-family: "Yu Gothic";
		src: local("Yu Gothic Medium");
		font-weight: 200;
}
@font-face {
		font-family: "Yu Gothic";
		src: local("Yu Gothic Medium");
		font-weight: 300;
}
@font-face {
		font-family: "Yu Gothic";
		src: local("Yu Gothic Medium");
		font-weight: 400;
}

a {
	color: var(--color-link);
	text-decoration: none;
	cursor: pointer;
	transition: var(--duration);
}
a:link, a:visited {
	text-decoration: none;
}
a.under {
	text-decoration: underline;
}
a.under:hover {
	color: var(--color-link-hover);
}

:where(a):hover {
	color: var(--color-link-hover);
}

::placeholder {
	color: var(--color-border);
}

input[type=text],
input[type=tel],
input[type=email],
input[type=password],
input[type=number],
textarea,
select {
	background: #ebebeb;
	box-sizing: border-box;
	border-radius: var(--size10);
	font-family: inherit;
	font-size: var(--size16);
	vertical-align: baseline;
	padding: 0.75em;
	transition: border var(--duration);
	width: min(100%, 40em);
}
@media screen and (max-width : 1024px) {
	input[type=text],
	input[type=tel],
	input[type=email],
	input[type=password],
	input[type=number],
	textarea,
	select {
		font-size: var(--size26);
	}
}
select {
	width: auto;
}
@media only screen and (min-width:1024px) {
    .center-contents-01 {
        width: 880px;
        margin-right: auto;
        margin-left: auto;
    }
    .center-contents-02 {
        width: 1000px;
        margin-right: auto;
        margin-left: auto;
        position: relative;
    }
    .pc-none {
        display: none;
    }
}
@media only screen and (max-width:1023px) {
    .sp-none {
        display: none;
    }
}
.l-header {
    background: #fff;
    box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6);
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 1000;
}
#gnav-check {
	display: none;
	opacity: 0;
	visibility: hidden;
}
#gnav-check:checked ~ #overlay {
	background: var(--color-blue);
	opacity: 0.8;
	pointer-events: visible;
	z-index: 5;
}
.icon_search .cls-1 {
    fill: var(--color-white);
}
@media only screen and (min-width:1024px) {
    .p-header-container {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .p-header-logo {
        display: flex;
        align-items: center;
        padding: 15px 0 15px 25px;
    }
    .p-header-logo img {
        border-right: 1px solid #c9c9c9;
        margin-right: 25px;
        padding-right: 25px;
    }
    .p-header-logo span {
        display: inline-block;
        font-size: 14px;
        font-weight: 700;
    }
    .p-gnav,
    .p-mainnav {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .p-mainnav__item {
        margin: 0 20px;
    }
    .p-mainnav__link {
        font-size: 14px;
        font-weight: 700;
    }
    .p-gnav-contact-btn {
        height: 100%;
    }
    .p-gnav-contact-btn.sp {
        display: none;
    }
    .p-gnav-contact-btn a {
        background: var(--color-orange);
        color: var(--color-white);
        display: flex;
        align-items: center;
        font-size: 18px;
        font-weight: 700;
        height: 100%;
        padding: 0 40px;
    }
    .p-gnav-contact-btn a:hover {
        background: #ffa751;
    }
    .p-gnav-contact-btn svg {
        margin-right: 15px;
    }
}
@media only screen and (max-width:1023px) {
    .p-header-logo {
        display: flex;
        align-items: center;
        padding: var(--size10) var(--size30);
    }
    .p-header-logo img {
        border-right: 1px solid #c9c9c9;
        width: var(--size143);
        margin-right: var(--size35);
        padding-top: var(--size15);
        padding-right: var(--size35);
        padding-bottom: var(--size15);
    }
    .p-header-logo span {
        display: inline-block;
        font-size: var(--size26);
        font-weight: 700;
    }
    .p-gnav {
        background: rgba(0,0,0,.2);
        visibility: hidden;
        opacity: 0;
        transition: all .2s ease-out;
        width: 100vw;
        height: calc(100vh - 12.348vw);
        position: absolute;
        top: 12.348vw;
        right: 0;
        bottom: 0;
        left: 0;
    }
    #gnav-check:checked + .p-header .p-gnav {
        visibility: visible;
        opacity: 1;
    }
    .p-gnav .p-gnav-contact-btn {
        display: none;
    }
    .p-mainnav {
        background: var(--color-white);
        padding: 0 var(--size30);
    }
    .p-mainnav li:not(:last-child) {
        border-bottom: 1px solid var(--color-orange);
    }
    .p-mainnav a {
        display: block;
        font-size: var(--size30);
        font-weight: 700;
        padding: var(--size50) 0;
    }
    .p-gnav-icon {
        width: 7vw;
        height: 5vw;
        position: fixed;
        top: 4vw;
        right: 5vw;
        z-index: 1000;
    }
    .p-gnav-icon__wrap span {
        background: var(--color-orange);
        display: block;
        width: 100%;
        height: 2px;
        transition: all .2s ease-out;
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto;
    }
    .p-gnav-icon__inner--top {
        transform: translateY(2vw);
    }
    .p-gnav-icon__inner--middle {
    }
    .p-gnav-icon__inner--bottom {
        transform: translateY(-2vw);
    }
    #gnav-check:checked ~ .p-header .p-gnav-icon__inner--top {
        transform: translateY(0) rotate(-45deg);
    }
    #gnav-check:checked ~ .p-header .p-gnav-icon__inner--middle {
        opacity: 0;
    }
    #gnav-check:checked ~ .p-header .p-gnav-icon__inner--bottom {
        transform: translateY(0) rotate(45deg);
    }
}
.arrow-animation .cls-1 {
    animation-name:arrowAnimation;
    animation-duration: 1.25s;
    animation-timing-function:ease-in;
    animation-iteration-count:infinite;
}
.arrow-animation .cls-1:nth-of-type(2) {
    animation-delay:.2s;
}
@keyframes arrowAnimation{
    0% {
        opacity: 0;
    }
    75% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.fukidashi {
    background: var(--color-orange);
    border-radius: 25px;
    color: var(--color-white);
    font-weight: 700;
    position: relative;
}
.fukidashi::after {
    border-style: solid;
    border-width: 10px 10px 0 0;
    border-color: var(--color-orange) transparent transparent transparent;
    content: "";
    width: 0;
    height: 0;
    margin: auto;
    position: absolute;
    bottom: -10px;
    right: 0;
    left: 0;
}
@media only screen and (min-width:1024px) {
    .fv {
        background: url('../images/fv_bg.png') no-repeat top -185px center;
        overflow: hidden;
        padding: 65px 0 110px;
    }
    .fv-text-wrapper {
        font-weight: 700;
        text-align: center;
        line-height: 1.7;
        position: relative;
        z-index: 10;
    }
    .fukidashi {
        font-size: 22px;
        padding: 10px 30px;
    }
    .fv-text-01 {
        color: var(--color-blue);
        font-size: 44px;
    }
    .fv-text-02 {
        color: var(--color-blue);
        font-size: 33px;
    }
    .fv-text-03 {
        background: var(--color-blue);
        color: var(--color-white);
        font-size: 51px;
        padding: 5px 20px;
    }
    .fv-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 835px;
        margin: 30px auto 55px;
        position: relative;
        z-index: 10;
    }
    .fv-list li {
        background: var(--color-white);
        border: 3px solid var(--color-blue);
        border-radius: 25px;
        color: var(--color-blue);
        font-size: 22px;
        font-weight: 700;
        padding: 5px 30px;
    }
    .search-btn {
        height: 76px;
        position: relative;
        z-index: 10;
    }
    .search-btn a {
        background: var(--color-orange);
        border-bottom: 8px solid var(--color-darkorange);
        border-radius: 35px;
        color: var(--color-white);
        display: flex;
        align-items: center;
        font-size: 20px;
        font-weight: 700;
        width: 320px;
        margin: auto;
        padding: 20px 75px;
    }
    .search-btn a:hover {
        background: #ffa751;
        border-bottom-width: 2px;
        transform: translateY(6px);
    }
    .search-btn a svg {
        margin-right: 5px;
    }
    .fv-img-01,
    .fv-img-02 {
        border-radius: 25px;
        box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6);
        position: absolute;
    }
    .fv-img-01 {
        top: -30px;
        left: -245px;
    }
    .fv-img-02 {
        bottom: 20px;
        right: -245px;
    }
    .fv-scroll {
        font-weight: 400;
        text-align: center;
        margin-top: 40px;
    }
    .fv-scroll svg {
        display: block;
        margin: 10px auto 0;
    }
    .fv-scroll .cls-1 {
        fill: var(--color-orange);
    }
    .fv .center-contents-01 {
        margin-top: 95px;
    }
    .hl-01 {
        text-align: center;
        font-size: 40px;
        font-weight: 700;
        margin-bottom: 35px;
    }
    .hl-01 span {
        color: var(--color-blue);
        font-size: 23px;
    }
    .fv .center-contents-01 p {
        text-align: center;
    }
}
@media screen and (max-width: 1024px) {
    .fv {
        background: url('../images/fv_bg_sp.png') no-repeat top center / cover;
        overflow: hidden;
        padding-top: var(--size35);
        padding-bottom: var(--size90);
    }
    .fv-text-wrapper {
        font-weight: 700;
        text-align: center;
        line-height: 1.7;
        position: relative;
        z-index: 10;
    }
    .fukidashi {
        font-size: var(--size29);
        padding: var(--size12) var(--size45);
    }
    .fv-text-01 {
        color: var(--color-blue);
        font-size: var(--size60);
    }
    .fv-text-02 {
        color: var(--color-blue);
        font-size: var(--size44);
    }
    .fv-text-03 {
        background: var(--color-blue);
        color: var(--color-white);
        font-size: var(--size70);
        line-height: 2;
        padding: var(--size15) var(--size25);
    }
    .fv-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        position: relative;
        z-index: 10;
        margin: var(--size40) var(--size30);
    }
    .fv-list li {
        background: var(--color-white);
        border: 3px solid var(--color-blue);
        border-radius: 50%;
        color: var(--color-blue);
        display: flex;
        font-size: var(--size32);
        font-weight: 700;
        align-items: center;
        justify-content: center;
        text-align: center;
        width: var(--size217);
        height: var(--size217);
    }
    .search-btn {
        height: 76px;
        position: relative;
        z-index: 10;
    }
    .search-btn a {
        background: var(--color-orange);
        border-bottom: var(--size8) solid var(--color-darkorange);
        border-radius: var(--size70);
        color: var(--color-white);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: var(--size32);
        font-weight: 700;
        margin: 0 var(--size110);
        padding: var(--size35);
    }
    .search-btn a:hover {
        background: #ffa751;
        border-bottom-width: 2px;
        transform: translateY(6px);
    }
    .search-btn a svg {
        margin-right: 5px;
    }
    .fv-scroll {
        font-weight: 700;
        text-align: center;
        margin-top: var(--size25);
    }
    .fv-scroll svg {
        display: block;
        margin: 10px auto 0;
    }
    .fv-scroll .cls-1 {
        fill: var(--color-orange);
    }
    .fv-img-01,
    .fv-img-02 {
        width: var(--size350);
        border-radius: 25px;
        box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6);
    }
    .fv-img-01 {
        margin-left: calc( var(--size20) * -1 );
    }
    .fv-img-02 {
        float: right;
        margin-top: var(--size100);
        margin-right: calc( var(--size20) * -1 );
    }
    .fv .center-contents-01 {
        margin-top: 95px;
    }
    .hl-01 {
        text-align: center;
        font-size: var(--size64);
        font-weight: 700;
        margin-bottom: var(--size55);
    }
    .hl-01 span {
        color: var(--color-blue);
        font-size: var(--size44);
    }
    .fv .center-contents-01 p {
        text-align: center;
    }
}

@media only screen and (min-width:1024px) {
    .challenge {
        background: var(--color-gray);
        padding: 80px 0;
    }
    .challenge-title {
        font-size: 35px;
        font-weight: 700;
        text-align: center;
        width: 720px;
        margin-bottom: 45px;
        margin-right: auto;
        margin-left: auto;
        position: relative;
    }
    .challenge-title span {
        font-size: 25px;
    }
    .challenge-title svg {
        position: absolute;
        top: 10px;
        margin: auto;
    }
    .challenge-title-svg-01 {
        transform: scale(-1, 1);
        left: 0;
    }
    .challenge-title-svg-02 {
        right: 0;
    }
    .challenge-title .cls-1 {
        fill: var(--color-blue);
    }
    .challenge-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .challenge-box {
        background: var(--color-white);
        border-radius: 25px;
        box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6);
        text-align: center;
        width: 320px;
        padding: 25px;
    }
    .challenge-img {
        margin-bottom: 17px;
    }
    .challenge-text {
        height: 7.4em;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}
@media only screen and (max-width:1023px) {
    .challenge {
        background: var(--color-gray);
        padding: var(--size80) 0;
    }
    .challenge-title {
        font-size: var(--size46);
        font-weight: 700;
        text-align: center;
        margin-bottom: var(--size65);
        position: relative;
    }
    .challenge-title span {
        font-size: var(--size32);
    }
    .challenge-title svg {
        position: absolute;
        top: 10px;
        margin: auto;
    }
    .challenge-title-svg-01 {
        transform: scale(-1, 1);
        left: var(--size30);
    }
    .challenge-title-svg-02 {
        right: var(--size30);
    }
    .challenge-title .cls-1 {
        fill: var(--color-blue);
    }
    .challenge-wrapper {
        padding: 0 var(--size50);
    }
    .challenge-box {
        background: var(--color-white);
        border-radius: 25px;
        box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6);
        text-align: center;
        margin-bottom: var(--size40);
        padding: var(--size60) var(--size30);
    }
    .challenge-img {
        margin-bottom: var(--size20);
        text-align: center;
    }
    .challenge-box:nth-of-type(1) .challenge-img img {
        width: 39.867vw;
    }
    .challenge-box:nth-of-type(2) .challenge-img img {
        width: 36.4vw;
    }
    .challenge-box:nth-of-type(3) .challenge-img img {
        width: 33.067vw;
    }
    .challenge-text {
        text-align: center;
    }
}
@media only screen and (min-width:1024px) {
    .solution {
        background: var(--color-blue);
        padding: 30px 0;
        position: relative;
    }
    .solution .fukidashi {
        margin: auto;
        position: absolute;
        top: -25px;
        right: 0;
        left: 0;
        width: 228px;
    }
    .solution::after {
        border-style: solid;
        border-width: 20px 31px 0 31px;
        border-color: var(--color-blue) transparent transparent transparent;
        content: "";
        display: block;
        width: 0;
        height: 0;
        margin: auto;
        position: absolute;
        bottom: -20px;
        right: 0;
        left: 0;
    }
    .solution p {
        color: var(--color-white);
        font-size: 44px;
        font-weight: 700;
        text-align: center;
    }
}
@media only screen and (max-width:1023px) {
    .solution {
        background: var(--color-blue);
        padding: var(--size60) 0 var(--size50);
        position: relative;
    }
    .solution .fukidashi {
        text-align: center;
        margin: auto;
        position: absolute;
        top: calc( var(--size30 ) * -1 );
        right: 0;
        left: 0;
        width: var(--size300);
        padding: var(--size12) 0;
    }
    .solution::after {
        border-style: solid;
        border-width: 20px 31px 0 31px;
        border-color: var(--color-blue) transparent transparent transparent;
        content: "";
        display: block;
        width: 0;
        height: 0;
        margin: auto;
        position: absolute;
        bottom: -19px;
        right: 0;
        left: 0;
    }
    .solution p {
        color: var(--color-white);
        font-size: var(--size60);
        font-weight: 700;
        line-height: 1.4;
        text-align: center;
    }
}


@media only screen and (min-width:1024px) {
    .features {
        padding: 90px 0 80px;
    }
    .features-link-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-bottom: 50px;
    }
    .features-link {
        border: 4px solid var(--color-blue);
        border-bottom: 12px solid var(--color-blue);
        border-radius: 15px;
        text-align: center;
        width: 488px;
        padding: 30px 0 20px;
    }
    .features-link span {
        color: var(--color-orange);
        font-size: 53px;
        display: block;
    }
    .features-link p {
        font-size: 32px;
        font-weight: 700;
        margin: 5px 0;
    }
    .features-link a {
        font-size: 16px;
    }
    .features-link a .cls-1 {
        fill: var(--color-orange);
    }
    #feature-01 {
        padding-bottom: 80px;
    }
    .sec-feature-01,
    .sec-feature-02 {
        overflow: hidden;
    }
    .features-text-01 {
        text-align: center;
        margin-bottom: 80px;
    }
    .feature-hl-wrapper {
        background: var(--color-lightBlue);
        padding: 90px 0 140px;
        border-radius: 0 20px 20px 0;
        margin-right: 230px;
        padding-right: 270px;
        position: relative;
    }
    .feature-hl-wrapper::after {
        background: var(--color-lightBlue);
        content: "";
        display: block;
        width: calc( (100vw - 1000px) / 2);
        height: 100%;
        position: absolute;
        top: 0;
        left: calc( (100vw - 1000px) / -2);
    }
    .feature-hl-wrapper img {
        box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6);
        border-radius: 25px;
        position: absolute;
        top: 85px;
        right: -415px;
    }
    .feature-hl-no {
        color: var(--color-blue);
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        margin-bottom: 23px;
    }
    .feature-hl-no span {
        border-right: 2px solid var(--color-blue);
        font-size: 60px;
        line-height: 1;
        padding-right: 15px;
        margin-right: 15px;
    }
    .feature-hl-no p {
        font-size: 18px;
        font-weight: 700;
    }
    .feature-hl {
        font-size: 32px;
        font-weight: 700;
        margin-bottom: 40px;
    }
    .feature-01-box-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-top: 70px;
        margin-bottom: 90px;
    }
    .feature-01-box {
        width: 414px;
    }
    .feature-01-box-hl {
        font-size: 24px;
        font-weight: 700;
        margin: 25px 0 20px;
        text-align: center;
    }
    .fukidashi-02 {
        background: var(--color-lightBlue);
        border-radius: 20px;
        filter: drop-shadow(1px 1px 4px darkgrey);
        text-align: center;
        padding: 45px;
        position: relative;
    }
    .fukidashi-02::after {
        border-style: solid;
        border-width: 30px 30px 0 30px;
        border-color: var(--color-lightBlue) transparent transparent transparent;
        content: "";
        display: block;
        width: 0;
        height: 0;
        margin: auto;
        position: absolute;
        bottom: -30px;
        right: 0;
        left: 0;
    }
    .fukidashi-02-hl {
        color: var(--color-blue);
        font-size: 32px;
        font-weight: 700;
    }
    .fukidashi-02-text {
        margin-top: 15px;
    }
    .fukidashi-02-icon {
        background: var(--color-blue);
        border-radius: 50%;
        color: var(--color-white);
        font-size: 22px;
        font-weight: 700;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        width: 155px;
        height: 155px;
        position: absolute;
        top: -40px;
        left: -50px;
    }
    .feature-01-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin-top: 55px;
        margin-bottom: 30px;
    }
    .feature-01-list-box {
        text-align: center;
        width: 250px;
        margin-bottom: 50px;
    }
    .feature-01-list-box:nth-of-type(3n+2) {
        margin-right: 30px;
        margin-left: 30px;
    }
    .feature-01-list-text {
        font-size: 17px;
        margin: 20px 0 5px;
    }
    .feature-01-list-hl {
        color: var(--color-blue);
        font-size: 23px;
        font-weight: 700;
    }
    .feature-01-list-hl span {
        font-size: 17px;
    }
    .feature-01-box-02-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .feature-01-box-02 {
        background: var(--color-gray);
        border-radius: 25px;
        width: 488px;
        margin-top: 55px;
        padding: 40px 45px;
    }
    .feature-01-box-02-hl {
        color: #36A2E5;
        font-size: 25px;
        font-weight: 700;
        text-align: center;
        margin-bottom: 10px;
    }
    .feature-01-box-02:nth-of-type(2) .feature-01-box-02-hl {
        color: var(--color-orange);
    }
}
@media only screen and (max-width:1023px) {
    .features {
        padding: var(--size80) 0 var(--size70);
    }
    .features-link-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-bottom: 50px;
        padding: 0 var(--size30);
    }
    .features-link {
        border: 4px solid var(--color-blue);
        border-bottom: 12px solid var(--color-blue);
        border-radius: var(--size50);
        text-align: center;
        width: 43.6vw;
        padding: var(--size30) 0 var(--size40);
    }
    .features-link span {
        color: var(--color-orange);
        font-size: var(--size68);
        display: block;
    }
    .features-link p {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: var(--size46);
        font-weight: 700;
        line-height: 1.4;
        height: 4.2em;
        margin: 0 0 var(--size35);
    }
    .features-link a {
        font-size: var(--size24);
        font-weight: 700;
    }
    .features-link a svg {
        margin-top: var(--size10);
    }
    .features-link a .cls-1 {
        fill: var(--color-orange);
    }
    #feature-01 {
        padding-bottom: var(--size75);
    }
    .sec-feature-01,
    .sec-feature-02 {
        overflow: hidden;
    }
    .features-text-01 {
        text-align: center;
    }
    .feature-hl-wrapper {
        background: var(--color-lightBlue);
        padding: var(--size70) var(--size30) var(--size250);
        position: relative;
    }
    .feature-hl-wrapper img {
        box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6);
        border-radius: 25px;
        transform: translateY(20px);
        position: absolute;
        left: var(--size120);
    }
    .feature-hl-no {
        color: var(--color-blue);
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        margin-bottom: var(--size40);
    }
    .feature-hl-no span {
        border-right: 2px solid var(--color-blue);
        font-size: var(--size84);
        line-height: 1;
        padding-right: var(--size20);
        margin-right: var(--size20);
    }
    .feature-hl-no p {
        font-size: var(--size30);
        font-weight: 700;
    }
    .feature-hl {
        font-size: var(--size46);
        font-weight: 700;
        margin-bottom: var(--size45);
    }
    .feature-01-box {
        margin-bottom: var(--size80);
    }
    .feature-01-box-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-top: var(--size260);
        margin-bottom: var(--size110);
        padding: 0 var(--size30);
    }
    .feature-01-box-hl {
        font-size: var(--size40);
        font-weight: 700;
        margin: var(--size40) 0 var(--size25);
        text-align: center;
    }
    .feature-01-box-img {
        text-align: center;
    }
    .fukidashi-02 {
        background: var(--color-lightBlue);
        border-radius: 20px;
        filter: drop-shadow(1px 1px 4px darkgrey);
        text-align: center;
        margin: 0 var(--size30);
        padding: var(--size80) 0 var(--size50);
        position: relative;
    }
    .fukidashi-02::after {
        border-style: solid;
        border-width: var(--size30) var(--size30) 0 var(--size30);
        border-color: var(--color-lightBlue) transparent transparent transparent;
        content: "";
        display: block;
        width: 0;
        height: 0;
        margin: auto;
        position: absolute;
        bottom: calc(var(--size27) * -1);
        right: 0;
        left: 0;
    }
    .fukidashi-02-hl {
        color: var(--color-blue);
        font-size: var(--size46);
        font-weight: 700;
    }
    .fukidashi-02-text {
        margin-top: var(--size40);
    }
    .fukidashi-02-icon {
        background: var(--color-blue);
        border-radius: var(--size40);
        color: var(--color-white);
        font-size: var(--size32);
        font-weight: 700;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        width: 52vw;
        margin: auto;
        padding: var(--size20) 0;
        position: absolute;
        top: calc( var(--size40) * -1 );
        left: 0;
        right: 0;
    }
    .feature-01-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin-top: var(--size45);
        margin-right: var(--size30);
        margin-bottom: var(--size70);
        margin-left: var(--size30);
    }
    .feature-01-list-box {
        text-align: center;
        width: 43.2vw;
        margin-bottom: var(--size45);
    }
    .feature-01-list-box:nth-of-type(2n) {
        margin-left: var(--size40);
    }
    .feature-01-list-text {
        font-size: var(--size24);
        margin: 20px 0 5px;
    }
    .feature-01-list-hl {
        color: var(--color-blue);
        font-size: var(--size39);
        font-weight: 700;
    }
    .feature-01-list-hl span {
        font-size: var(--size29);
    }
    .feature-01-box-02-wrapper {
        margin: 0 var(--size30);
    }
    .feature-01-box-02 {
        background: var(--color-gray);
        border-radius: 25px;
        margin-top: var(--size60);
        padding: var(--size50) var(--size30);
    }
    .feature-01-box-02-hl {
        color: #36A2E5;
        font-size: var(--size40);
        font-weight: 700;
        text-align: center;
        margin-bottom: var(--size15);
    }
    .feature-01-box-02:nth-of-type(2) .feature-01-box-02-hl {
        color: var(--color-orange);
    }
}
@media only screen and (min-width:1024px) {
    .search-sec {
        background: var(--color-blue) url('../images/contact_bg.png') no-repeat center top / cover;
        color: var(--color-white);
        font-weight: 700;
        text-align: center;
        padding: 120px 0 100px;
    }
    .search-sec-text {
        font-size: 24px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .search-sec-text .svg-01 {
        transform: scale(-1, 1);
    }
    .search-sec-text .cls-1 {
        fill: #71d9ff;
    }
    .search-sec-hl {
        font-size: 40px;
        margin-bottom: 30px;
    }
}
@media only screen and (max-width:1023px) {
    .search-sec {
        background: var(--color-blue) url('../images/contact_bg_sp.png') no-repeat center top / cover;
        color: var(--color-white);
        font-weight: 700;
        text-align: center;
        padding: var(--size75) 0;
    }
    .search-sec-text {
        font-size: var(--size32);
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .search-sec-text svg {
        width:7.759vw;
        height:11.432vw;
    }
    .search-sec-text .svg-01 {
        transform: scale(-1, 1);
        margin-right: var(--size20);
    }
    .search-sec-text .svg-02 {
        margin-left: var(--size20);

    }
    .search-sec-text .cls-1 {
        fill: #71d9ff;
    }
    .search-sec-hl {
        font-size: var(--size64);
        margin-bottom: var(--size50);
    }
}

@media only screen and (min-width:1024px) {
    #feature-02 {
        padding-bottom: 80px;
    }
    #feature-02 .feature-hl-wrapper {
        margin-top: 100px;
        margin-bottom: 100px;
        padding-bottom: 220px;
    }
    .feature-02-box-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin: 60px 0 70px;
    }
    .feature-02-box {
        margin: 0 13px;
    }
    .feature-02-box:first-of-type {
        margin-left: 0;
    }
    .feature-02-box:last-child {
        margin-right: 0;
    }
    .feature-02-box-img {
        background: var(--color-lightGray);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 145px;
        height: 145px;
        margin-bottom: 10px;
    }
    .feature-02-box-text {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
    }
    .feature-02-box-02 {
        background: var(--color-gray);
        border-radius: 12px;
        padding: 50px 55px 65px;
    }
    .feature-02-box-02-hl {
        font-size: 28px;
        font-weight: 700;
        text-align: center;
        margin-bottom: 15px;
    }
    .feature-02-box-02-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin-top: 30px;
        margin-bottom: -15px;
    }
    .feature-02-box-02-list li {
        background: var(--color-white);
        border: 3px solid var(--color-blue);
        border-radius: 30px;
        color: var(--color-blue);
        font-size: 20px;
        font-weight: 700;
        text-align: center;
        margin-right: 8px;
        margin-left: 8px;
        margin-bottom: 15px;
        padding: 10px 70px;
    }
}
@media only screen and (max-width:1023px) {
    #feature-02 {
        padding-bottom: var(--size80);
    }
    #feature-02 .feature-hl-wrapper {
        margin-bottom: var(--size220);
        padding-bottom: var(--size300);
    }
    .feature-02-box-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: var(--size55) var(--size30) var(--size80);
    }
    #feature-02 .fukidashi-02 {
        padding: var(--size50) 0;
    }
    .feature-02-box {
        margin-bottom: var(--size50);
    }
    .feature-02-box-img {
        background: var(--color-lightGray);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        width: var(--size216);
        height: var(--size216);
        margin-bottom: var(--size20);
    }
    .feature-02-box-text {
        font-size: var(--size26);
        font-weight: 700;
        text-align: center;
    }
    .feature-02-box-02 {
        background: var(--color-gray);
        border-radius: var(--size15);
        margin: 0 var(--size30);
        padding: var(--size50) var(--size30) var(--size60);
    }
    .feature-02-box-02-hl {
        font-size: var(--size40);
        font-weight: 700;
        text-align: center;
        margin-bottom: var(--size25);
    }
    .feature-02-box-02-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-top: var(--size50);
        margin-bottom: calc(var(--size15) * -1);
    }
    .feature-02-box-02-list li {
        background: var(--color-white);
        border: 3px solid var(--color-blue);
        border-radius: 30px;
        color: var(--color-blue);
        font-size: var(--size28);
        font-weight: 700;
        text-align: center;
        width: 40.5vw;
        margin-bottom: var(--size15);
        padding: var(--size15);
    }
    .feature-02-box-02-list li:nth-of-type(3) {
        width: 100%;
    }
}


@media only screen and (min-width:1024px) {
    .job {
        background: var(--color-gray);
        padding: 70px 0 80px;
    }
    .hl-01-text {
        text-align: center;
        margin-top: 40px;
    }
    .job-box-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .job-box {
        background: var(--color-white);
        border-radius: 15px;
        width: 479px;
        margin-top: 60px;
        padding-bottom: 50px;
    }
    .job-box-hl {
        color: var(--color-blue);
        font-size: 32px;
        font-weight: 700;
        text-align: center;
        margin: 30px 0;
    }
    .job-box-hl span {
        font-size: 20px;
    }
    .job-box-text {
        margin: 0 50px;
    }
}
@media only screen and (max-width:1023px) {
    .job {
        background: var(--color-gray);
        padding: 70px 0 80px;
    }
    .hl-01-text {
        margin-top: var(--size40);
        margin-bottom: var(--size50);
        padding: 0 var(--size30);
    }
    .job-box-wrapper {
        margin: 0 var(--size30);
    }
    .job-box {
        background: var(--color-white);
        border-radius: var(--size15);
        margin-bottom: var(--size35);
        padding-bottom: var(--size50);
    }
    .job-box-hl {
        color: var(--color-blue);
        font-size: var(--size54);
        font-weight: 700;
        text-align: center;
        margin: var(--size50) 0 var(--size25);
    }
    .job-box-hl span {
        font-size: var(--size34);
    }
    .job-box-text {
        margin: 0 var(--size30);
    }
}

@media only screen and (min-width:1024px) {
    .area {
        padding: 70px 0 160px;
    }
    .area-wrapper {
        background: url('../images/img_28.png') no-repeat center top;
        display: flex;
        flex-direction:row-reverse;
        flex-wrap: wrap;
        justify-content: space-between;
        padding: 80px 0;
    }
    .area-box {
        width: 200px;
    }
    .area-list {
        position: relative;
    }
    .area-region {
        background: #f7f7f7;
        border-radius: 6px;
        cursor: pointer;
        font-weight: 700;
        margin-bottom: 15px;
        padding: 10px 25px;
        position: relative;
    }
    .area-region::after {
        border-bottom: 2px solid var(--color-blue);
        border-right: 2px solid var(--color-blue);
        content: "";
        display: block;
        width: 10px;
        height: 10px;
        transform: rotate(45deg);
        margin: auto;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 15px;
    }
    .hokkaido .area-region {
        padding: 0;
    }
    .hokkaido .area-region::after {
        content: none;
    }
    .area-region:hover {
        color: var(--color-blue);
    }
    .hokkaido .area-region a {
        display: block;
        padding: 10px 25px;
    }
    .area-prefecture {
        visibility: hidden;
        opacity: 0;
        transition: all .1s ease-out;
        width: 100%;
        transform: translateY(10px);
        padding-top: 10px;
        position: absolute;
        top: 30px;
        z-index: 10;
    }
    .area-prefecture-inner {
        background: #ececf2;
        border-radius: 6px;
        overflow: hidden;
        box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6);
    }
    .area-list:hover > .area-prefecture {
        visibility: visible;
        opacity: 1;
    }
    .area-prefecture dd {
        border-bottom: 1px solid var(--color-white);
    }
    .area-prefecture dd:last-child {
        border: none;
    }
    .area-prefecture a {
        display: block;
        padding: 10px 25px;
    }
    .area-prefecture a:hover {
        background: var(--color-blue);
        color: var(--color-white);
    }
}
@media only screen and (max-width:1023px) {
    .area {
        padding: var(--size75) 0 var(--size100);
    }
    .area .center-contents-02 {
        margin: 0 var(--size30);
    }
    .area-wrapper {
        background: url('../images/img_28.png') no-repeat center bottom / 82.933vw;
        display: flex;
        flex-direction:row-reverse;
        flex-wrap: wrap;
        justify-content: space-between;
        padding-bottom: 88.4vw;
    }
    .area-box {
        width: 44.467vw;
    }
    .area-list {
        position: relative;
    }
    .area-region {
        background: #f7f7f7;
        border-radius: var(--size10);
        cursor: pointer;
        font-size: var(--size30);
        font-weight: 700;
        line-height: 1.8;
        margin-bottom: var(--size15);
        padding: var(--size20) var(--size25);
        position: relative;
    }
    .area-region::after {
        border-bottom: 2px solid var(--color-blue);
        border-right: 2px solid var(--color-blue);
        content: "";
        display: block;
        width: var(--size10);
        height: var(--size10);
        transform: rotate(45deg);
        margin: auto;
        position: absolute;
        top: 0;
        bottom: 0;
        right: var(--size15);
    }
    .hokkaido .area-region {
        padding: 0;
    }
    .hokkaido .area-region::after {
        content: none;
    }
    .area-region.active {
        color: var(--color-blue);
    }
    .hokkaido .area-region a {
        display: block;
        padding: var(--size20) var(--size25);
    }
    .area-prefecture {
        visibility: hidden;
        opacity: 0;
        transition: all .1s ease-out;
        width: 100%;
        transform: translateY(10px);
        padding-top: 10px;
        position: absolute;
        top: 30px;
        z-index: 10;
    }
    .area-prefecture-inner {
        background: #ececf2;
        border-radius: 6px;
        overflow: hidden;
        box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6);
    }
    .area-list.active > .area-prefecture {
        visibility: visible;
        opacity: 1;
    }
    .area-prefecture dd {
        border-bottom: 1px solid var(--color-white);
    }
    .area-prefecture dd:last-child {
        border: none;
    }
    .area-prefecture a {
        font-size: var(--size30);
        display: block;
        padding: var(--size20) var(--size25);
    }
    .area-prefecture a:hover {
        background: var(--color-blue);
        color: var(--color-white);
    }
}

@media only screen and (min-width:1024px) {
    .faq {
        background: var(--color-gray);
        padding: 70px 0;
    }
    .faq-list-inner {
        background: var(--color-white);
        border-radius: 20px;
        margin-bottom: 15px;
        padding: 45px 25px 35px 50px;
    }
    .faq-list dt,
    .faq-list dd {
        display: flex;
        position: relative;
    }
    .faq-list dt {
        cursor: pointer;
        font-size: 24px;
        font-weight: 700;
    }
    .faq-list dd {
        line-height: 2;
        margin-top: 25px;
    }
    .faq-list dt::before,
    .faq-list dd::before {
        font-family: 'Montserrat', sans-serif;
        font-size: 40px;
        font-weight: 700;
        line-height: 1;
        transform: translateY(-5px);
        margin-right: 10px;
    }
    .faq-list dt::before {
        content: "Q";
        color: var(--color-blue);
    }
    .faq-list dd::before {
        content: "A";
        color: var(--color-orange);
    }
    .faq-list-icon {
        width: 16px;
        margin: auto;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
    }
    .faq-list-icon::before,
    .faq-list-icon::after {
        background: var(--color-blue);
        content: "";
        width: 16px;
        height: 3px;
        margin: auto;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        transition: all .2s ease-out;
    }
    .faq-list-icon::before {}
    .faq-list-icon::after {
        transform: rotate(90deg);
    }
    .faq-list dt.active .faq-list-icon::before {
        transform: rotate(90deg);
        opacity: 0;
    }
    .faq-list dt.active .faq-list-icon::after {
        transform: rotate(180deg);
    }
}
@media only screen and (max-width:1023px) {
    .faq {
        background: var(--color-gray);
        padding: var(--size80) 0;
    }
    .faq .center-contents-02 {
        margin: 0 var(--size30);
    }
    .faq-list-inner {
        background: var(--color-white);
        border-radius: 20px;
        margin-bottom: 15px;
        padding: var(--size30);
    }
    .faq-list dt,
    .faq-list dd {
        display: flex;
        position: relative;
    }
    .faq-list dt {
        cursor: pointer;
        font-size: var(--size34);
        font-weight: 700;
        padding-right: var(--size80);
    }
    .faq-list dd {
        font-size: var(--size30);
        line-height: 2;
        margin-top: var(--size25);
    }
    .faq-list dt::before,
    .faq-list dd::before {
        font-family: 'Montserrat', sans-serif;
        font-size: var(--size56);
        font-weight: 700;
        line-height: 1;
        margin-right: var(--size15);
    }
    .faq-list dt::before {
        content: "Q";
        color: var(--color-blue);
    }
    .faq-list dd::before {
        content: "A";
        color: var(--color-orange);
    }
    .faq-list-icon {
        width: var(--size32);
        margin: auto;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
    }
    .faq-list-icon::before,
    .faq-list-icon::after {
        background: var(--color-blue);
        content: "";
        width: var(--size32);
        height: var(--size5);
        margin: auto;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        transition: all .2s ease-out;
    }
    .faq-list-icon::before {}
    .faq-list-icon::after {
        transform: rotate(90deg);
    }
    .faq-list dt.active .faq-list-icon::before {
        transform: rotate(90deg);
        opacity: 0;
    }
    .faq-list dt.active .faq-list-icon::after {
        transform: rotate(180deg);
    }
    .p-gnav-contact-btn.sp {
        transition: all .2s ease-out;
        position: fixed;
        bottom: -16vw;
        left: 0;
        right: 0;
        z-index: 10000;
    }
    .p-gnav-contact-btn.sp.view {
        bottom: 0;
    }
    body.fixed .p-gnav-contact-btn.sp {
        bottom: 0 !important;
    }
    .p-gnav-contact-btn.sp svg {
        margin-right: var(--size20);
    }
    .p-gnav-contact-btn.sp a {
        background: var(--color-orange);
        color: var(--color-white);
        font-size: var(--size40);
        font-weight: 700;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: var(--size28) 0;
    }
}
/* iframe-wrapper */
.iframe-wrapper {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
}
.iframe-wrapper iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
}
.fv .iframe-wrapper,
.job .iframe-wrapper {
    margin-top: var(--size60);
}
@media only screen and (min-width:1024px) {
}
@media only screen and (max-width:1023px) {
    .movie {
        padding: 0 var(--size30);
    }
}