﻿@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

/*---------------------------
リセット
---------------------------*/
*,
*::before,
*::after {
box-sizing: border-box;
}
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
html{
font-family: "Noto Sans JP", sans-serif;
}
body {
line-height:1;
color:#333;
font-size:16px;
font-weight: 500;
}
footer address{
font-style:normal;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block;
}
nav ul {
list-style:none;
}
blockquote, q {
quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}
a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
text-decoration: none;
}
li{
list-style:none;
}
ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}
mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}
table {
border-collapse:collapse;
border-spacing:0;
}
hr {
display:block;
height:1px;
border:0;
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}
input, select {
vertical-align:middle;
}
p{
line-height: 1.8;
margin-bottom: 20px;
}
img{
width: 100%;
max-width: 100%;
vertical-align: bottom;
}

/*---------------------------
SP
---------------------------*/
.pc-bg{
display: none;
}
.all-wrap{
overflow: hidden;
background: #fdfdfd;
position: relative;
}
header{
display: flex;
justify-content: space-between;
align-items: center;
padding: 5px;
}
header .logo{
width: 140px;
}
.kyoka-num {
font-size: 12px;
text-align: left;
padding: 0px;
transform: scale(0.9);
transform-origin: right center;
color: #000;
line-height: 1.4;
}
.fv{
position: relative;
z-index: 2;
background: #e0f7ff;
padding-top: 60px;
padding-bottom: 13px;
}
.fv .bg-blue{
background: #0070b7;
color: #FFFF42;
font-size: 18px;
text-align: center;
line-height: 36px;
padding-bottom: 2px;
}
.fv-img2 {
position: absolute;
bottom: -20px;
left: 0;
}
.sec-soudan {
background: linear-gradient(to bottom, #0042BE 0%, #00A3F2 100%);
}
section{
padding: 50px 10px 80px;
position: relative;
}
.sec-3step {
background: #F6F5F8;
padding: 50px 10px 50px;
}
.sec-3step:before{
background: url(img/img-line_1.png) no-repeat center bottom / 100%;
}
.sec-adviser:before{
background: url(img/img-line_3.png) no-repeat center top / 100%;
top: -1px;
}
.sec-soudan.bottom:before{
background: url(img/img-line_4.png) no-repeat center top / 100%;
top: -1px;
}
.sec-soudan.top:before{
display: none;
}
section h2 {
position: relative;
text-align: center;
color: #fff;
margin-bottom: 30px;
font-size: 28px;
font-weight: 500;
}
.sec-soudan h2{
font-size: 15px;
font-weight: normal;
}
.sec-soudan h2 .yellow {
color: #FFFF42;
font-size: 28px;
font-weight: 500;
display: inline-block;
margin-top: 18px;
}
.soudan-wrap{
background: #fff;
border-radius: 10px;
position: relative;
padding: 50px 10px 24px;
text-align: center;
color: #03256C;
}
.soudan-wrap:before{
content: '';
display: block;
width: 0;
height: 0;
border-style: solid;
border-right: 34px solid transparent;
border-left: 34px solid transparent;
border-top: 26px solid #005ecd;
border-bottom: 0;
position: absolute;
left: 0;
right: 0;
top: -1px;
margin: auto;
}
.soudan-wrap .step-wrap {
display: flex;
justify-content: space-between;
margin: 0 20px 20px;
position: relative;
z-index: 1;
}
.soudan-wrap .step-wrap div{
background: #E6E6E6;
width: 10px;
height: 10px;
border-radius: 50%;
box-shadow:0 0 0 2px #fff;
position: relative;
}
.soudan-wrap .step-wrap div.on{
box-shadow:0 0 0 3px #03256C;
background: #fff;
}
.soudan-wrap .step-wrap div.on:before {
content: 'STEP1';
display: inline-block;
color: #03256C;
position: absolute;
left: 50%;
transform: translate(-50%,0);
top: -20px;
font-size: 13px;
font-weight: bold;
}
.soudan-wrap .step-wrap div:nth-of-type(2).on:before{
content: 'STEP2';
}
.soudan-wrap .step-wrap div:nth-of-type(3).on:before{
content: 'STEP3';
}
.soudan-wrap .step-wrap div:nth-of-type(4).on:before{
content: 'STEP4';
}
.soudan-wrap .step-wrap div:nth-of-type(5).on:before{
content: 'STEP5';
}
.soudan-wrap .step-wrap div:nth-of-type(6).on:before{
content: 'STEP6';
}
.soudan-wrap .step-wrap div:nth-of-type(7).on:before{
content: 'STEP7';
}
.soudan-wrap .step-wrap:before{
content: '';
display: block;
width: 100%;
height: 1px;
background: #E6E6E6;
position: absolute;
top: 0;
bottom: 0;
left: 0;
margin: auto;
z-index: -1;
}
.soudan-wrap ul{
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 14px 5px;
margin-top: 26px;
}
.soudan-wrap li button{
width: 100%;
height: 60px;
background: #FFE600;
color: #212121;
border: 0;
border-bottom: 4px solid #EFA130;
border-radius: 100px;
font-size: 13px;
font-weight: bold;
position: relative;
}
.soudan-wrap li button:after{
content: '';
display: block;
width: 10px;
height: 10px;
position: absolute;
top: 0;
bottom: 0;
right: 10px;
margin: auto;
background: url(img/arrow_bt.png) no-repeat center / contain;
}
.mark {
display: flex;
justify-content: center;
align-items: center;
gap: 8px;
margin-top: 14px;
}
.mark img{
width: 50px;
}
.mark p {
color: #03256C;
font-size: 10px;
margin: 0;
line-height: 1.5;
}
.voice-cont{
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 26px;
}
.voice-cont:last-of-type{
margin-bottom: 0;
}
.voice-cont img{
width: 110px;
}
.voice-cont p {
width: 10px;
flex-grow: 1;
font-size: 15px;
line-height: 1.6;
margin: 0;
}
.step-cont{
display: flex;
gap: 8px;
height: 190px;
position: relative;
z-index: 1;
}
.step-cont:before {
content: '';
display: block;
width: 1px;
height: 100%;
position: absolute;
top: 0;
left: 55px;
z-index: -1;
border-left: 2px dashed #cccccc;
}
.step-cont:last-of-type{
height: auto;
}
.step-cont:last-of-type:before{
display: none;
}
.step-cont .left{
width: 110px;
}
.step-cont .left img{
width: 100%;
}
.step-cont .right{
width: 10px;
flex-grow: 1;
}
.step-cont h3 {
background: #03256C;
color: #fff;
font-size: 20px;
padding: 10px;
margin-bottom: 8px;
}
.step-cont h3 .yellow {
color: #FFFF42;
display: block;
font-size: 14px;
font-weight: normal;
margin-bottom: 10px;
}
.step-cont .right p{
padding-left: 10px;
font-size: 14px;
line-height: 1.7;
margin: 0;
}
.sec-adviser{
background:url(img/bg-advisor01.png) no-repeat right top / 100% , url(img/bg-advisor02.png) no-repeat left bottom / 100% #008BFF;
padding: 120px 0 80px;
}
.slick-track{
display: flex;
}
.adviser-cont{
padding: 0 10px 10px;
height: auto!important;
display: flex!important;
flex-direction: column;
}
.adviser-cont img {
height: 260px;
width: auto;
margin: 0 auto;
}
.adviser-cont dl {
position: relative;
margin-top: -1px;
background: #fff;
border-radius: 10px;
overflow: hidden;
padding: 50px 14px ;
box-shadow: 6px 6px 6px rgba(0,0,0,0.2);
flex-grow: 1;
}
.adviser-cont dl:before,.adviser-cont dl:after{
content: '';
display: block;
width: 70px;
height: 70px;
position: absolute;
background: linear-gradient(to right bottom, #FFFF42 50%, transparent 50%);
}
.adviser-cont dl:before{
top: -1px;
left: -1px;
}
.adviser-cont dl:after{
right: -1px;
bottom: -1px;
background: linear-gradient(to right bottom, transparent 50%, #FFFF42 50%);
}
.adviser-cont dt {
color: #03256C;
text-align: center;
font-size: 26px;
position: relative;
padding-bottom: 15px;
margin-bottom: 12px;
border-bottom: 1px solid #B3B3B3;
font-weight: 600;
}
.adviser-cont dd{
font-size: 14px;
line-height: 1.5;
}
.slider-arrow{
top: 100px;
background: #fff;
border-radius: 50%;
width: 40px;
height: 40px;
z-index: 10;
position: absolute;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 6px 6px 6px rgba(0,0,0,0.2);
}
.slider-arrow:before{
content: '';
display: block;
width: 10px;
height: 10px;
transform: rotate(45deg);
border: 1px solid #03256C;
}
.slider-prev{
left: 11%;
padding-left: 5px;
}
.slider-prev:before{
border-right: 0;
border-top: 0;
}
.slider-next{
right: 11%;
padding-right: 5px;
}
.slider-next:before{
border-left: 0;
border-bottom: 0;
}
.slick-prev:before, .slick-next:before{
display: none;
}
.slick-dots{
bottom: -28px;
}
.slick-dots li{
margin: 0 10px;
width: 14px;
height: 14px;
}
.slick-dots li button {
background: #fff;
border-radius: 50%;
width: 100%;
height: 100%;
}
.slick-dots li.slick-active button{
background: #03256C;
}
.slick-dots li button:before{
display: none;
}
.sec-qa{
padding-bottom: 50px;
}
.qa-cont{
margin-bottom: 24px;
}
.qa-cont:last-of-type{
margin-bottom: 0;
}
.qa-cont input{
display: none;
}
.qa-cont label {
display: block;
background: #F6F5F8;
color: #03256C;
padding: 18px 34px 18px 36px;
font-size: 17px;
line-height: 1.3;
position: relative;
}
.qa-cont label:before,.answer:before {
content: '';
display: block;
width: 50px;
height: 100%;
position: absolute;
left: 0;
top: 0;
background: url(img/qa-q.png) no-repeat center / 34px #03256C;
}
.answer:before{
height: 50px;
background: url(img/qa-a.png) no-repeat center / 34px #FFFF42;
top: 10px;
}
.qa-cont .puramai{
position: absolute;
display: block;
right: 0;
top: 0;
bottom: 0;
}
.qa-cont .puramai span{
display: block;
width: 36px;
height: 100%;
position: relative;
}
.qa-cont .puramai span:before,.qa-cont .puramai span:after{
content: '';
display: block;
width: 16px;
height: 1px;
background: #03256C;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
transition: 0.6s;
}
.qa-cont .puramai span:after{
transform: rotate(90deg);
}
.qa-cont input:checked ~ h3 .puramai span:after{
transform: rotate(0deg);
}
.answer{
height: 0;
overflow: hidden;
transition: 0.6s;
opacity: 0;
padding-left: 60px;
position: relative;
}
input:checked ~ .answer{
height: auto;
min-height: 60px;
padding-top: 10px;
opacity: 1;
}
.answer p{
font-size: 15px;
line-height: 1.6;
margin: 0;
}
.sec-soudan.bottom .soudan-wrap:before {
border-top: 26px solid #0065d1;
}
footer {
background: #EBE9F0;
text-align: center;
padding: 40px 0 130px;
}
footer .logo{
width: 220px;
}
footer ul{
margin: 36px 0 50px;
display: flex;
justify-content: center;
gap: 30px;
}
footer li a{
color: #03256C;
font-size: 14px;
}
.tousyou {
border-top: 1px solid #CCCCCC;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
margin-bottom: 24px;
padding-top: 30px;
}
.tousyou img{
width: 60px;
}
.tousyou p {
text-align: left;
font-size: 14px;
margin: 0;
}
.copyright {
font-size: 11px;
}
.over-ray {
position: fixed;
left: 0;
bottom: -1px;
width: 100%;
background: rgb(125 137 173 / 90%);
z-index: 10;
padding: 5px 0 10px;
}
.over-ray .hukidasi {
background: #fff;
position: relative;
border-radius: 6px;
width: 244px;
font-size: 13px;
font-weight: 800;
text-align: center;
line-height: 36px;
margin: 0 auto;
box-shadow: 6px 6px 6px rgba(0,0,0,0.2);
pointer-events: none;
z-index: 2;
}
.over-ray .hukidasi span{
color: #ED2970;
}
.over-ray .hukidasi:after {
content: '';
display: block;
width: 0;
height: 0;
border-style: solid;
border-right: 8px solid transparent;
border-left: 8px solid transparent;
border-top: 10px solid #fff;
border-bottom: 0;
position: absolute;
left: 0;
right: 0;
bottom: -7px;
margin: auto;
}
.over-ray a {
color: #FFFF42;
background: #03256C;
display: block;
width: 330px;
text-align: center;
margin: -2px auto 0;
border-radius: 50px;
line-height: 58px;
height: 60px;
font-size: 22px;
}
.overray{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 81px;
position: fixed;
left: 0;
bottom: -1px;
width: 100%;
background: #fff;
z-index: 10;
padding-bottom: 2px;
}
.overray .micro-orange{
margin-bottom: 5px;
font-size: 16px;
}
.overray .micro-orange:before, .overray .micro-orange:after{
height: 14px;
}
.overray .line-btn {
height: 44px;
line-height: 44px;
box-shadow: 0 3px 0 #008937;
font-size: 22px;
}

@media screen and (max-width : 391px){
.step-cont h3{
font-size: 19px;
}
}

@media screen and (max-width : 376px){
.voice-cont img {
width: 100px;
}
.step-cont .left {
width: 100px;
}
.step-cont h3{
font-size: 18px;
}
.step-cont:before{
left: 50px;
}
}

@media screen and (max-width : 361px){
.soudan-wrap li button{
font-size: 13px;
}
.step-cont h3 {
font-size: 17px;
}
}

/*---------------------------
PC
---------------------------*/
@media screen and (min-width:768px){
.pc-bg{
display: block;
width: 100%;
height: 100vh;
position: fixed;
left: 0;
top: 0;
z-index: -1;
background: url(img/pc-bg.png) repeat center / 200px ;
overflow: hidden;
}
.pc-bg:before{
content: '';
display: block;
width: 2000px;
min-width: 100%;
height: 100%;
position: absolute;
left: 50%;
top: 0;
transform: translate(-50%, 0);
background: url(img/pc-sen.svg) repeat center / cover ;
}
.pc-bg:after{
content: '';
display: block;
width: 300px;
height: 100px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
margin-left: -570px;
background: url(img/logo.svg) no-repeat center / contain ;
}
.all-wrap {
max-width: 414px;
margin: 0 auto;
box-shadow: 0 0 10px rgba(0,0,0,5%);
}
.slider-arrow,.qa-cont label,.soudan-wrap li button{
cursor: pointer;
}
a:hover,button:hover{
opacity: 0.6;
cursor: pointer;
}
.sec-recruit li a:hover{
opacity: 1;
}
.sec-recruit li a:hover *{
opacity: 0.6;
}
.overray{
display: none;
}
}

/*---------------------------
フォーム修正
---------------------------*/
.soudan-wrap ul li div.error {
color: #f00;
text-align:left;
font-size:11px;
}
.soudan-wrap li button[name="stepBack"]{
width: 100%;
height: 40px;
border-radius: 3px;
background: #ddd;
color: #212121;
border-bottom: 4px solid #bbb;
margin:10px 0 0;
}
.soudan-wrap li button[name="stepBack"]:after{
content: '';
display: block;
width: 10px;
height: 10px;
position: absolute;
top: 0;
bottom: 0;
left: 10px;
right:auto;
margin: auto;
background: url(img/arrow_bt-line.png) no-repeat center / contain;
transform: rotateY(180deg);
}
.soudan-wrap li button[name="stepFourNext"]{
background: #0095ea;
border-bottom: 4px solid #004cc3;
color: #FFF;
height: 40px;
border-radius: 3px;
}
.soudan-wrap li button[name="stepFourNext"]:after {
content: '';
display: block;
width: 10px;
height: 10px;
position: absolute;
top: 0;
bottom: 0;
right: 10px;
margin: auto;
background: url(img/arrow_bt-line.png) no-repeat center / contain;
}
.soudan-wrap li button:disabled{
background: #ddd;
border-bottom: 4px solid #bbb;
height: 40px;
border-radius: 3px;
color:#999999;
}
.form-step-02 li:nth-of-type(5){
grid-column-start: 1;
grid-column-end: 3;
width: 50%;
margin: auto;
}
.form-step-03 li:nth-of-type(3){
grid-column-start: 1;
grid-column-end: 3;
width: 50%;
margin: auto;
}

/*---------------------------
step4削除後
---------------------------*/
/* .form-step-04 ul{
display: flex;
flex-wrap: wrap;
align-content: flex-start;
justify-content: center;
} */
.form-step-04 ul li input,.form-step-04 ul li input,.form-step-05 ul li input,.form-step-07 ul li input{
padding: 10px;
width: 100%;
border: 0;
margin: 10px 0 0;
background: #fbfcff;
border-radius: 5px;
box-shadow: 0 0 0 1px #f0f0f0;
}
.form-step-04 ul li select{
padding: 10px;
width: 100%;
border: 0;
margin: 10px 0 0;
border-radius: 5px;
background: #fbfcff;
box-shadow: 0 0 0 1px #f0f0f0;
}
/* .form-step-04 ul{
padding:0 15px;
}
.form-step-04 ul li{
margin:auto;
width: 100%;
}
.form-step-04 ul li:nth-of-type(2){
margin:auto;
width: 50%;
}
.form-step-04 ul li select{
padding: 10px;
width: 100%;
border: 0;
margin: 10px 0 0;
border-radius: 5px;
background: #fbfcff;
box-shadow: 0 0 0 1px #f0f0f0;
} */
.form-step-04 ul{
padding:0 15px;
}
.form-step-04 li:nth-of-type(3){
grid-column-start: 1;
grid-column-end: 3;
width: 50%;
margin: auto;
}
.form-step-04 li:nth-of-type(4){
grid-column-start: 1;
grid-column-end: 3;
width: 90%;
margin: auto;
display: flex;
justify-content:space-between;
}
.form-step-04 li:nth-of-type(4) button{
margin:10px 5px 0;
}
.form-step-05 ul{
display: flex;
flex-wrap: wrap;
align-content: flex-start;
box-sizing:border-box;
padding:0 15px;
}
.form-step-05 ul li{
width:100%;
box-sizing:border-box;
margin:0 0 10px;
text-align:left;
}
.form-step-05 ul li:nth-of-type(1) input{
margin-bottom:10px;
}
.form-step-05 ul li:nth-of-type(1) input + div{
font-size:11px;
color:#93a0b7;
}
.form-step-05 ul li:nth-of-type(3){
width: 100%;
margin: auto;
display: flex;
justify-content:space-between;
}
.form-step-05 li:nth-of-type(3) button:nth-of-type(1){
margin:10px 5px 0 0;
}
.form-step-05 li:nth-of-type(3) button:nth-of-type(2){
margin:10px 0 0 5px;
}

.soudan-wrap .form-step-05 li button[name="stepSixNext"]{
background: #0095ea;
border-bottom: 4px solid #004cc3;
color: #FFF;
height: 40px;
border-radius: 3px;
}
.soudan-wrap .form-step-05 li button[name="stepSixNext"]:after {
content: '';
display: block;
width: 10px;
height: 10px;
position: absolute;
top: 0;
bottom: 0;
right: 10px;
margin: auto;
background: url(img/arrow_bt-line.png) no-repeat center / contain;
}
.form-step-07 ul{
display: flex;
flex-wrap: wrap;
align-content: flex-start;
box-sizing:border-box;
padding:0 10px;
}
.form-step-07 ul li{
width:100%;
box-sizing:border-box;
margin:0 0 10px;
text-align:left;
}
.form-step-07 ul li:nth-of-type(1){
width: 100%;
margin: auto;
display: flex;
justify-content:space-between;
}
.form-step-07 ul li:nth-of-type(1) input{
width:100%;
padding: 10px;
margin:0 5px;
}
.form-step-07 ul li:nth-of-type(1) select{
padding: 10px;
width: 100%;
border: 0;
border-radius: 5px;
background: #fbfcff;
box-shadow: 0 0 0 1px #f0f0f0;
margin:0 5px;
}
.form-step-07 ul li:nth-of-type(2){
width:100%;
margin:10px 0 0;
font-size:14px;
color:#212121;
text-align:center;
}
.form-step-07 ul li:nth-of-type(2) a{
text-decoration:underline;
}
.form-step-07 ul li:nth-of-type(2) input{
box-shadow:0 0 0 0;
width:20px;
height:20px;
display:block;
margin:10px auto 10px;
}
.form-step-07 ul li:nth-of-type(3){
width: 100%;
margin: auto;
display: flex;
justify-content:space-between;
}
.form-step-07 li:nth-of-type(3) button{
margin:10px 5px 0;
}
.soudan-wrap .form-step-07 li button[name="submit"]{
background: #0095ea;
border-bottom: 4px solid #004cc3;
color: #FFF;
height: 40px;
border-radius: 3px;
}
.soudan-wrap .form-step-07 li button[name="submit"]:after {
content: '';
display: block;
width: 10px;
height: 10px;
position: absolute;
top: 0;
bottom: 0;
right: 10px;
margin: auto;
background: url(img/arrow_bt-line.png) no-repeat center / contain;
}

oudan-wrap .form-step-05 li button[name="stepSixNext"]:disabled,.soudan-wrap .form-step-07 li button[name="submit"]:disabled{
background: #ddd;
border-bottom: 4px solid #bbb;
height: 40px;
border-radius: 3px;
color:#999999;
}

/*---------------------------
thanksページ
---------------------------*/
.thanks-title {
background: #f6f5f8;
position: relative;
text-align: center;
font-size: 26px;
line-height: 1.5;
color: #03256C;
font-weight: 600;
padding: 60px 0 44px;
}
.thanks-title:before {
content: '';
display: block;
width: 50px;
height: 24px;
position: absolute;
left: 0;
right: 0;
top: 24px;
margin: auto;
background: url(img/img-sun.png) no-repeat center / contain;
}
.thanks-inner {
padding: 0 30px 34px;
font-size: 15px;
}
.thanks-inner .tel-num {
background: #faffc2;
width: 300px;
padding: 16px 0;
color: #03256C;
text-align: center;
margin: 0 auto 40px;
font-size: 22px;
font-weight: 600;
}
.green{
color: #06c152;
}
.line-btn {
width: 260px;
margin: 0 auto;
background: #06c152;
color: #fff;
border-radius: 50px;
height: 54px;
display: flex;
justify-content: center;
align-items: center;
font-size: 17px;
position: relative;
box-shadow: 0 5px 0#19a54b;
}
.line-btn:before{
content: '';
display: inline-block;
width: 24px;
height: 24px;
margin-right: 7px;
background: url(img/ic-line.png) no-repeat center / contain;
margin-bottom: -2px;
}
.line-btn:after{
content: '';
display: block;
width: 12px;
height: 12px;
position: absolute;
right: 10px;
top: 3px;
bottom: 0;
margin: auto;
background: url(img/arrow_bt-line.png) no-repeat center / contain;
}

@media screen and (max-width : 376px){
.thanks-inner {
padding: 0 20px 34px;
}
}

@media screen and (max-width : 361px){
.thanks-inner {
padding: 0 12px 34px;
}
}

/*---------------------------
利用規約
---------------------------*/
.thanks-title.rule{
padding: 66px 0 38px;
}
.thanks-title.rule:before{
top: 34px;
}
.rule-inner{
padding: 0 10px 50px;
font-size: 14px;
}
.rule-inner h2 {
background: #03256C;
color: #fff;
padding: 12px;
font-size: 18px;
line-height: 1.4;
margin: 30px 0 20px;
position: relative;
}
.rule-inner h2:after{
content: '';
display: block;
width: 12px;
height: 12px;
position: absolute;
right: 0;
bottom: 0;
background: linear-gradient(to right bottom, transparent 50%,  #FFFF42 50%);
}
.rule-inner li{
line-height: 1.5;
}

/*---------------------------
プライバシー関連step6移動用
---------------------------*/
.form-step-05 ul li:nth-of-type(3){
width:100%;
margin:0;
font-size:14px;
color:#212121;
text-align:center;
display:block;
}
.form-step-05 ul li:nth-of-type(3) a{
text-decoration:underline;
}
.form-step-05 ul li:nth-of-type(3) input{
box-shadow:0 0 0 0;
width:20px;
height:20px;
display:block;
margin:10px auto 10px;
}
.form-step-05 ul li:nth-of-type(4){
width: 100%;
margin: auto;
display: flex;
justify-content:space-between;
}
.form-step-05 li:nth-of-type(4) button:nth-of-type(1){
margin:10px 5px 0 0;
}
.form-step-05 li:nth-of-type(4) button:nth-of-type(2){
margin:10px 0 0 5px;
}
.soudan-wrap .form-step-05 li button[name="submit"]{
background: #0095ea;
border-bottom: 4px solid #004cc3;
color: #FFF;
height: 40px;
border-radius: 3px;
}
.soudan-wrap .form-step-05 li button[name="submit"]:after {
content: '';
display: block;
width: 10px;
height: 10px;
position: absolute;
top: 0;
bottom: 0;
right: 10px;
margin: auto;
background: url(img/arrow_bt-line.png) no-repeat center / contain;
}
.soudan-wrap .form-step-05 li button:disabled{
background: #ddd;
border-bottom: 4px solid #bbb;
height: 40px;
border-radius: 3px;
color:#999999;
}
.form-step-07 ul li:nth-of-type(2){
width: 100%;
margin: auto;
display: flex;
justify-content:space-between;
}
.form-step-07 li:nth-of-type(2) button{
margin:10px 5px 0;
}

/*---------------------------
フォーム調整
---------------------------*/
.form-step-04 ul {
display: block;
text-align: left;
}
.form-step-04 li{
margin-bottom: 16px;
}
.form-step-04 li:nth-of-type(3) {
width: auto;
margin-bottom: 10px;
}

/*---------------------------
step4調整
---------------------------*/
.form-step-04 ul li div {
font-size: 14px;
}
.form-step-04 ul li input, .form-step-04 ul li input {
padding: 15px;
}
.form-step-04 li:nth-of-type(4) {
padding-top: 24px;
}

/*---------------------------
step5調整
---------------------------*/
.form-step-05 ul{
font-size: 14px;
}
.form-step-05 ul li:nth-of-type(3) a ~ a{
margin-left: 10px;
}
.form-step-05 ul li:nth-of-type(4){
display: block;
}
.soudan-wrap .form-step-05 li button[name="submit"] {
background: #f0841b;
height: auto;
border-radius: 50px;
padding: 8px 0 5px;
font-size: 26px;
font-weight: bold;
border-bottom: 5px solid #bf700a;
margin: 10px 0 0;
}
.soudan-wrap .form-step-05 li button[name="submit"] .s{
display: block;
font-size: 15px;
}
.soudan-wrap .form-step-05 li button[name="submit"]:disabled{
background: #ddd;
border-color: #bbb;
color: #999999;
cursor: auto;
}
.soudan-wrap .form-step-05 li button[name="stepBack"] {
background: none;
border: 0;
color: #979797;
height: auto;
width: fit-content;
margin: 16px auto 0!important;
display: block;
padding: 0;
}
.soudan-wrap .form-step-05 li button[name="submit"]:after,.soudan-wrap .form-step-05 li button[name="stepBack"]:after{
display: none;
}

/*---------------------------
吹き出しボタン
---------------------------*/
.hukidasi-btn{
display: block;
margin-top: 30px;
}
.hukidasi-btn .hukidasi{
background: #fff;
position: relative;
border-radius: 6px;
width: 244px;
font-size: 13px;
font-weight: 800;
text-align: center;
line-height: 36px;
margin: 0 auto;
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2);
pointer-events: none;
z-index: 2;
display: block;
border: 2px solid #a5b8df;
}
.hukidasi-btn .hukidasi span {
color: #ED2970;
}
.hukidasi-btn .hukidasi:after {
content: '';
display: block;
width: 0;
height: 0;
border-style: solid;
border-right: 8px solid transparent;
border-left: 8px solid transparent;
border-top: 10px solid #fff;
border-bottom: 0;
position: absolute;
left: 0;
right: 0;
bottom: -7px;
margin: auto;
}
.hukidasi-btn a{
color: #FFFF42;
background: #03256C;
display: block;
width: 330px;
text-align: center;
margin: -2px auto 0;
border-radius: 50px;
line-height: 58px;
height: 60px;
font-size: 22px;
}
.hukidasi-btn a:hover{
opacity: 0.6;
}

/*---------------------------
ポップアップ
---------------------------*/
.modal{
/* display: none; */
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 10000;
}
.modal #btn-close-popup-banner {
position: absolute;
z-index: 1;
left: 0;
right: 0;
top: 0;
bottom: 0;
background: rgba(0,0,0,0.7);
}
.modal #btn-close-popup-banner span {
display: block;
width: 28px;
height: 28px;
background: url(img/over-close.png) no-repeat center / contain;
position: absolute;
left: 50%;
top: 50%;
transform: translate(166px, -282px);
}
.modal-cont {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 400px;
z-index: 2;
}
.modal-cont-in {
position: relative;
}
.modal .modal-cont img {
width: 100%;
}
.modal .btn {
width: 75%;
height: max-content;
position: absolute;
left: 0;
right: 0;
bottom: 12px;
margin: auto;
z-index: 2;
}
.modal .btn:hover{
opacity: 0.6;
}

@media only screen and (orientation:landscape) and (max-width : 813px),(orientation:portrait) and (max-width : 753px){
.modal-cont{
width: 350px;
}
.modal #btn-close-popup-banner span {
transform: translate(142px, -250px);
}
}

@media screen and (max-width : 391px){
.modal-cont{
width: 330px;
}
.modal #btn-close-popup-banner span {
transform: translate(132px, -238px);
}
}

@media screen and (max-width : 361px){
.modal-cont{
width: 320px;
}
.modal #btn-close-popup-banner span {
transform: translate(132px, -232px);
}
}

/*---------------------------
thanksページ
---------------------------*/
.thanks-inner {
padding: 0 21px 34px;
}
.thanks-inner p:nth-of-type(1) {
margin-top: 0;
margin-bottom: 5px;
}

/*---------------------------
吹き出し・オーバーレイ
---------------------------*/
.hukidasi-btn .hukidasi {
width: 270px;
}
.over-ray .hukidasi {
width: 270px;
}

/*---------------------------
SP
---------------------------*/
header{
position: absolute;
left:0px;
right: 0;
top:0px;
border-radius:0;
background: #fff;
z-index: 3;
padding: 5px 14px 5px 20px;
}
.fv .img-text {
position: absolute;
left: -130px;
right: 0;
top: -134px;
bottom: 0;
margin: auto;
width: 61%;
}
.fv .img-bg {
position: relative;
z-index: -1;
top: 44px;
}
.fv .img-main {
position: absolute;
width: 150px;
left: 0;
right: 0;
bottom: 36px;
margin: auto;
}
.fv .img1 {
position: absolute;
width: 46px;
top: 116px;
left: 10px;
}
.fv .img2{
position: absolute;
width: 46px;
top: 116px;
right: 10px;
}
.fv .img3 {
position: absolute;
width: 56px;
bottom: 102px;
left: 49px;
}
.fv .img4 {
position: absolute;
width: 48px;
bottom: 107px;
right: 49px;
}
.sec-soudan.fvcta{
margin:0;
background: #FFF;
padding: 20px 18px 20px;
border-radius:0 40px 0 40px;
}
.sec-soudan.fvcta .mark:after{
display: none;
}
main{
margin-top:-70px;
}
.main-in{
position: relative;
z-index: 2;
}
.dot-area,.dot-area2{
background: url(img/bg-dot.svg) repeat center / 800px;
}
.dot-area2{
margin-top: -1px;
padding-bottom: 160px;
}
.bg-w{
background: #fff;
padding: 0px 0 0px;
border-radius: 0 40px 0 0px;
display: none;
}
.icon-wrap{
display:none;
justify-content: space-between;
padding: 0px 40px;
margin-bottom: 5px;
}
.icon-wrap .cont {
color: #0f4174;
font-size: 15px;
font-weight: 700;
text-align: center;
line-height: 1.3;
}
.icon-wrap img{
width: auto;
height: 40px;
display: block;
margin: 0 auto 6px;
}
.entry-btn {
display: block;
width: 340px;
margin: 0 auto;
background: #ff692e;
box-shadow: 0 6px 0 #e8390a;
border-radius: 50px;
text-align: center;
color: #fff;
font-weight: bold;
font-size: 22px;
padding: 10px 0 16px;
}
.entry-btn .yellow {
display: block;
text-align: center;
font-size: 16px;
color: #fdee1f;
margin-bottom: 6px;
font-weight: 400;
}
.fv-check-box{
width:100%;
margin:0;
display: none;
}
.fv-check-box .fv-check-h{
color: #0e3f75;
font-size: 20px;
padding: 13px 0 28px;
position: relative;
text-align: center;
font-weight: bold;
}
.fv-check-box .fv-check-h:before{
content: '';
display: block;
width: 20px;
height: 15px;
position: absolute;
top: -30px;
left: -200px;
right: 0;
bottom: 0;
margin: auto;
background: url(img/fv-tenten.svg) no-repeat center / contain;
}
.fv-check-box .fv-check-h:after{
content: '';
display: block;
width: 250px;
height: 25px;
position: absolute;
left: 0;
right: 0;
bottom: -7px;
margin:auto;
background: url(img/fv-yaji.svg) no-repeat center / contain;
}
.fv-check-box ul{
width:100%;
background:#0e3f75;
padding:5px 20px 5px;
margin: 0 0 5px;
}
.fv-check-box ul li{
list-style: none;
padding:8px 0 8px 30px;
margin: 0;
color:#FFF;
position: relative;
}
.fv-check-box ul li:before{
content: '';
display: block;
width: 20px;
height: 20px;
position: absolute;
top:0;
left:0px;
bottom:0px;
margin: auto;
background: url(img/fv-check.svg) no-repeat center / contain;
}


section {
padding: 50px 0 80px;
}
.h2-eng {
position: relative;
color: #0d3f74;
padding-left: 40px;
font-size: 16px;
font-weight: 600;
padding-bottom: 2px;
margin-bottom: 6px;
}
.h2-eng:before, .h2-eng:after {
content: '';
width: 23px;
height: 2px;
position: absolute;
left: 0;
top: 0;
bottom: 0;
margin: auto;
background: #fc5c82;
}
.h2-eng:after {
width: 12px;
height: 12px;
border-radius: 3px;
left: 22px;
}
section h2 {
color: #0d3f74;
text-align: left;
font-weight: 900;
padding-left: 20px;
font-size: 28px;
}
.sec-about{
padding-bottom: 30px;
z-index: 2;
}
.sec-about .img{
display: block;
width: calc(100% - 36px);
margin: 0 auto;
border-radius: 20px;
}
.sec-about h3 {
background: rgb(0 156 237 / 80%);
color: #fff;
width: 296px;
border-radius: 0 0 30px 0;
padding: 0 0 0 26px;
font-size: 22px;
font-weight: 600;
line-height: 1.3;
margin-top: -20px;
position: relative;
z-index: 2;
height: 80px;
display: flex;
align-items: center;
}
.sec-about .text-wrap{
background: #fff;
margin-left: 18px;
border-radius: 10px 0 0 10px;
padding: 32px 16px 12px;
margin-top: -20px;
margin-bottom: 40px;
}
.sec-about .text-wrap:last-child{
margin-bottom: 0;
}
.sec-about .text-wrap p{
line-height: 1.5;
margin-bottom: 10px;
}
.sec-about .text-wrap p:last-child{
margin-bottom: 0;
}
.sec-soudan{
background: none;
padding: 0 18px;
}
.sec-soudan.top{
background: linear-gradient(to bottom, #f9f9f9 0%,#f9f9f9 50% , #fff 50%);
padding-top: 30px;
z-index: 2;
}
.sec-soudan-in{
border-radius: 20px;
padding:0;
}
.sec-soudan h2 {
text-align: center;
color: #0d3f74;
font-size: 26px;
line-height: 1.3;
font-weight: 800;
margin-bottom: 26px;
position: relative;
padding-left: 68px;
}
.sec-soudan h2:before {
content: '';
display: block;
width: 100px;
height: 100px;
position: absolute;
left: -4px;
bottom: -6px;
background: url(img/icon-muryou.svg) no-repeat center / contain;
}
.soudan-wrap{
background: none;
padding: 0;
}
.line-btn,.advisor-btn{
width: 330px;
border-radius: 50px;
display: block;
margin: 0 auto;
color: #fff;
font-size: 24px;
height: 70px;
line-height: 70px;
background: #06c655;
box-shadow: 0 5px 0 #008937;
border: 0;
font-family: "Noto Sans JP", sans-serif;
font-weight: 500;
}
.advisor-btn{
background: #ff692e;
box-shadow: 0 5px 0 #d61f00;
font-size: 24px;
margin-top: 24px;
}
.line-btn:before,.line-btn:after,.soudan-wrap:before{
display: none;
}
.mark{
justify-content: flex-start;
position: relative;
}
.mark:after {
content: '';
display: block;
width: 100px;
height: 100px;
position: absolute;
right: 6px;
top: -30px;
background: url(img/icon-hanasu.svg) no-repeat center / contain;
}
div.mark p {
color: #a0a0a0;
line-height: 1.6;
}
.sec-recruit {
background: #fff;
border-radius: 0 0 0 40px;
z-index: 1;
padding-bottom: 50px;
}
.sec-recruit ul{
padding: 0 18px;
margin-bottom: 40px;
}
.sec-recruit li{
margin-bottom: 20px;
}
.sec-recruit li a{
display: block;
border-radius: 10px;
box-shadow: 0 2px 5px 2px rgba(0,0,0,5%);
padding: 10px;
color: #103f77;
line-height: 1.4;
background: #fff;
}
.sec-recruit li h3{
border-bottom: 2px dashed #d6e0e9;
padding: 10px 5px;
font-size: 15px;
}
.sec-recruit li h4 {
padding: 10px 5px 10px 30px;
font-size: 13px;
font-weight: 600;
position: relative;
}
.sec-recruit li h4:before {
content: '';
display: block;
width: 20px;
height: 14px;
background: url(img/icon-listyaji.svg) no-repeat center / 9px #0d3e76;
border-radius: 5px;
position: absolute;
left: 5px;
top: 12.5px;
margin: auto;
}
.sec-recruit .micro{
margin-top: 0;
}
.sec-flow{
z-index: 1;
padding-bottom: 30px;
}
.sec-flow h2{
line-height: 1.4;
}
.sec-flow h3{
background: #0b9de8;
height: 94px;
display: flex;
align-items: center;
width: 90%;
color: #fff;
border-radius: 0 50px 50px 0;
padding-left: 20px;
font-size: 22px;
font-weight: 600;
gap: 12px;
line-height: 1.2;
position: relative;
z-index: 2;
}
.sec-flow h3 .step-num {
background: #fff;
width: 46px;
height: 46px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: #22244a;
font-size: 12px;
font-weight: 800;
line-height: 1.1;
}
.sec-flow h3 .step-num .b{
font-size: 20px;
}
.sec-flow .arrow {
position: relative;
margin-bottom: 90px;
}
.sec-flow .arrow:after {
content: '';
display: block;
width: 30px;
height: 40px;
position: absolute;
left: 50%;
bottom: -64px;
transform: translate(-50%,0);
background: url(img/icon-stepyaji.svg) no-repeat center / contain;
}
.sec-flow .img{
width: 260px;
height: 260px;
display: block;
margin: -26px auto 10px;
}
.sec-flow p{
padding: 0 18px;
line-height: 1.5;
}
.micro {
margin: 60px auto 10px;
position: relative;
color: #d61f00;
font-size: 16px;
font-weight: 700;
width: fit-content;
}
.micro:before, .micro:after {
content: '';
display: block;
width: 8px;
height: 18px;
position: absolute;
bottom: -2px;
border-left: 2px solid #d61f00;
border-right: 2px solid #d61f00;
}
.micro:before{
left: -20px;
transform: skew(30deg);
}
.micro:after{
right: -20px;
transform: skew(-30deg);
}
.sec-qa{
background: url(img/bg-daen6.svg) no-repeat left -230px top 410px / 400px;
padding-top: 0;
padding-bottom: 200px;
margin-top: -90px;
}
.sec-qa h2:after{
content: '';
display: block;
width: 100%;
height: 200px;
position: absolute;
top: calc(100% + 24px);
left: 0;
bottom: -10px;
background: url(img/bg-qa.jpg) no-repeat center / cover;
z-index: -1;
}
.sec-qa h2{
margin-bottom: 110px;
}
.sec-qa-in{
margin: 0 18px;
background: #fff;
border-radius: 14px;
padding: 12px;
}
.sec-qa-in:before {
content: '';
display: block;
width: 400px;
height: 340px;
position: absolute;
right: -220px;
top: 900px;
z-index: -1;
background: url(img/bg-daen7.svg) no-repeat center / contain;
}
.qa-cont{
margin: 0;
border-bottom: 2px dotted #f3f3f3;
}
.qa-cont:last-of-type{
border-bottom: 0;
}
.qa-cont label{
background: none;
color: #0e3f77;
}
.qa-cont label:before {
background: url(img/icon-q.svg) no-repeat center / contain;
width: 14px;
left: 8px;
}
.qa-cont .puramai{
width: 24px;
height: 24px;
right: 8px;
margin: auto;
}
.qa-cont .puramai span{
width: 100%;
background: #0b9de8;
border-radius: 3px;
}
.qa-cont .puramai span:before, .qa-cont .puramai span:after{
background: #fff;
width: 10px;
height: 2px;
}
.answer{
padding: 0 8px;
}
input:checked ~ .answer{
padding-bottom: 20px;
}
.answer-in{
background: #f9f9f9;
border-radius: 14px;
padding: 15px;
}
.answer:before{
display: none;
}
.answer p{
margin-bottom: 20px;
}
.answer p:last-child{
margin-bottom: 0;
}
.sec-soudan.bottom {
margin-top: -140px;
position: relative;
z-index: 3;
}
.sec-soudan.bottom div.mark p{
color: #fff;
}
body footer{
padding: 230px 18px 24px;
background: #23254c;
text-align: left;
margin-top: -189px;
position: relative;
z-index: 2;
}
.footer-in{
border-top: 1px solid #c7cad3;
padding-top: 30px;
}
footer ul {
margin: 26px 0;
display: block;
padding-left: 14px;
}
footer li{
margin-bottom: 14px;
}
footer li a {
color: #fff;
position: relative;
padding-left: 18px;
}
footer li a:before{
content: '';
display: block;
width: 10px;
height: 10px;
border-radius: 2px;
position: absolute;
left: 0;
top: 0;
bottom: 0;
margin: auto;
background: #fff;
}
.tousyou {
border: 0;
background: #fff;
border-radius: 6px;
justify-content: flex-start;
padding: 12px 20px;
}
.tousyou img {
width: 40px;
}
.tousyou p {
font-size: 11px;
color: #0e4073;
line-height: 1.5;
font-weight: 700;
}
.copyright{
color: #fff;
text-align: center;
font-weight: 300;
}
.gizi-relative1,.gizi-relative2{
position: relative;
}
.sec-enjoy:before,.sec-enjoy:after,.sec-about:before,.sec-about h2:before,.sec-about h2:after,.gizi-relative1:before,.gizi-relative1:after,.sec-recruit:before,.sec-flow:before,.sec-flow:after,.gizi-relative2:before,.gizi-relative2:after,.sec-qa:before,.sec-qa:after,.sec-qa h2:before{
content: '';
display: block;
position: absolute;
}
.sec-enjoy:before{
width: 88px;
height: 60px;
background: url(img/icon-akusyu.svg) no-repeat center / contain;
right: 12px;
top: -10px;
}
.sec-enjoy:after {
width: 390px;
height: 350px;
background: url(img/bg-daen1.svg) no-repeat center / contain;
right: -210px;
top: -6px;
z-index: -2;
}
.sec-about h2:before {
width: 120px;
height: 140px;
background: url(img/bg-line1.svg) no-repeat center / contain;
right: -30px;
top: -30px;
z-index: -1;
}
.sec-about h2:after {
width: 390px;
height: 350px;
background: url(img/bg-daen1.svg) no-repeat center / contain;
right: -210px;
top: -120px;
z-index: -2;
}
.gizi-relative1:before {
width: 350px;
height: 210px;
background: url(img/bg-daen2.svg) no-repeat center / contain;
left: -170px;
bottom: -110px;
z-index: -2;
}
.gizi-relative1:after {
width: 150px;
height: 150px;
background: url(img/bg-line2.svg) no-repeat center / contain;
left: -80px;
bottom: -82px;
z-index: -1;
}
.sec-recruit:before {
width: 180px;
height: 250px;
background: url(img/bg-line3.svg) no-repeat center / contain;
right: -74px;
top: -50px;
z-index: -1;
}
.sec-flow:before {
width: 360px;
height: 300px;
background: url(img/bg-daen3.svg) no-repeat center / contain;
right: -190px;
top: -50px;
z-index: -2;
}
.sec-flow:after {
width: 190px;
height: 190px;
background: url(img/bg-line4.svg) no-repeat center / contain;
right: -80px;
top: -110px;
z-index: -1;
}
.gizi-relative2:before {
width: 240px;
height: 240px;
background: url(img/bg-daen4.svg) no-repeat center / contain;
left: -70px;
top: -140px;
z-index: -2;
}
.gizi-relative2:after {
width: 180px;
height: 140px;
background: url(img/bg-line5.svg) no-repeat center / contain;
left: -110px;
top: -40px;
z-index: -1;
}
.sec-qa:before {
width: 200px;
height: 200px;
background: url(img/bg-line6.svg) no-repeat center / contain;
right: -10px;
top: -10px;
z-index: -2;
}
.sec-qa:after {
width: 260px;
height: 260px;
background: url(img/bg-daen5.svg) no-repeat center / contain;
right: -90px;
top: -110px;
z-index: -3;
}
.under-line{
font-weight: bold;
background: linear-gradient(transparent 60%, #fffbd0 0%);
}

@media screen and (max-width : 391px){
.fv .img-main{
width: 142px;
}
.sec-soudan h2{
padding-left: 80px;
}
.mark:after{
width: 96px;
right: -6px;
}
.tousyou{
padding: 12px 0 12px 16px;
}
}

@media screen and (max-width : 376px){
header{
padding: 5px 12px 5px 20px;
}
.fv .img-main {
width: 140px;
bottom: 30px;
}
.sec-soudan h2 {
font-size: 25px;
padding-left: 74px;
}
.sec-soudan h2:before{
width: 88px;
}
.mark:after{
width: 88px;
}
.micro{
font-size: 15px;
}
.tousyou {
padding: 12px 0 12px 12px;
}
}

@media screen and (max-width : 361px){
header {
padding: 5px 10px 5px 18px;
}
.fv .img-text{
width: 62%;
position: absolute;
left: -105px;
right: 0;
top: -51px;
bottom: 0;
margin: auto;
}
.bg-w {
margin: 25px 0 0;
}
.entry-btn{
width: 310px;
}
.sec-soudan h2{
font-size: 24px;
}
.line-btn, .advisor-btn{
width: 290px;
}
.advisor-btn{
font-size: 24px;
}
.mark:after {
width: 76px;
right: -10px;
}
.micro:before, .micro:after{
height: 16px;
}
.micro:before {
left: -16px;
}
.micro:after {
right: -16px;
}
.tousyou p {
font-size: 10px;
}
}

/*---------------------------
アニメーション
---------------------------*/
.fv .img-main {
animation: ueshita 8s ease-in-out infinite alternate;
}
.fv .img1 {
animation: fuwawa 3s ease-in-out infinite alternate;
}
.fv .img2 {
animation: fuwawa 2.5s ease-in-out infinite alternate;
}
.fv .img3 {
animation: fuwawa 3.5s ease-in-out infinite alternate;
}
.fv .img4 {
animation: fuwawa 4s ease-in-out infinite alternate;
}
@keyframes fuwawa {
0% {
transform:translate(0, 0) rotate(-7deg);
}
50% {
transform:translate(0, -7px) rotate(0deg);
}
100% {
transform:translate(0, 0) rotate(7deg);
}
}
@keyframes ueshita {
0% {
transform:translate(0, 0) rotate(0deg);
}
50% {
transform:translate(0, -6px) rotate(0deg);
}
100% {
transform:translate(0, 0) rotate(0deg);
}
}




/*---------------------------
下層
---------------------------*/
.all-wrap.lower{
background: url(img/bg-dot.svg) repeat center / 800px #fdfdfd;
}
.lower header{
box-shadow: 0 0 10px rgba(0,0,0,5%);
}
.lower main{
margin-top: 0;
}
.sec-recruitDetail{
padding-top: 100px;
padding-bottom: 0;
background: url(img/bg-kasou.jpg) repeat center / 900px;
}
.sec-recruitDetail h1 {
background: #0b9de8;
color: #fff;
padding: 20px;
border-top: 3px solid #0d3f74;
border-bottom: 3px solid #0d3f74;
font-size: 24px;
margin-bottom: 10px;
line-height: 1.3;
}
.h1-bottom {
padding: 0 18px;
line-height: 1.3;
color: #103f75;
font-weight: 700;
}
.tag{
padding: 0 18px;
display: flex;
gap: 8px;
margin: 20px 0;
}
.tag li {
background: #fff;
border-radius: 4px;
color: #0a9ee8;
box-shadow: 0 0 0 1px #0b9de8;
width: 86px;
text-align: center;
padding: 7px 0;
font-size: 14px;
font-weight: 600;
}
.sec-recruitDetail-in{
background: linear-gradient(to bottom, transparent 0px,transparent  60px, #fff 60px);
position: relative;
z-index: 1;
}
.h1-bottom + .sec-recruitDetail-in{
margin-top: 16px;
}
.sec-recruitDetail-in .bg-w{
border-radius: 10px;
padding: 18px 16px 26px 0;
margin: 0 18px 60px;
position: relative;
box-shadow: 0 0 10px 0px rgb(0 0 0 / 2%);
}
.sec-recruitDetail-in h2 {
color: #fff;
background: #0e4075;
border-radius: 0 30px 30px 0;
font-size: 16px;
font-weight: 500;
padding: 10px 0 10px 14px;
width: 260px;
margin: 22px 0px 8px;
}
.sec-recruitDetail-in h2:first-child{
margin-top: 0;
}
.sec-recruitDetail-in .bg-w p{
padding-left: 14px;
line-height: 1.5;
margin-bottom: 10px;
}
.sec-recruitDetail-in h3{
line-height: 1.5;
padding-left: 14px;
color: #0d9ce8;
}
.sec-recruitDetail-in .bg-w .kome{
color: #fc6a31;
padding-left: 14px;
line-height: 1.5;
}
.sec-recruitDetail-in .bg-w:before {
content: '';
display: block;
width: 170px;
height: 150px;
background: url(img/bg-daen1.svg) no-repeat center / contain;
position: absolute;
left: -42px;
bottom: -278px;
}
.sec-recruitDetail-in .bg-w:after {
content: '';
display: block;
width: 180px;
height: 140px;
background: url(img/bg-line5.svg) no-repeat center / contain;
position: absolute;
left: -70px;
bottom: -70px;
z-index: -1;
}
.sec-recruitDetail-in .bg-blue {
background: #0b9de8;
border-radius: 40px 40px 0 0;
padding: 34px 0 38px;
position: relative;
}
.sec-recruitDetail-in .bg-blue:before {
content: '';
display: block;
width: 100px;
height: 40px;
position: absolute;
left: 0;
right: 0;
top: -32px;
margin: auto;
background: url(img/kasou-yaji-ten.svg) no-repeat center / contain;
animation: scrolls 3.5s infinite;
}
.sec-recruitDetail-in .bg-blue:after{
content: '';
display: block;
width: 100px;
height: 100px;
position: absolute;
left: 0;
right: 0;
bottom: -92px;
margin: auto;
background: url(img/kasou-yaji.svg) no-repeat center / contain;
animation: scrolls 3.5s infinite;
}
.sec-recruitDetail-in .bg-blue ul{
padding-left: 50px;
}
.sec-recruitDetail-in .bg-blue li {
color: #fff;
position: relative;
font-size: 27px;
width: fit-content;
z-index: 1;
margin-bottom: 22px;
}
.sec-recruitDetail-in .bg-blue li:last-child{
margin-bottom: 0;
}
.sec-recruitDetail-in .bg-blue li:before{
content: '';
display: block;
width: 12px;
height: 12px;
border-radius: 3px;
position: absolute;
left: -26px;
top: 0;
bottom: 0;
margin: auto;
background: #fede19;
}
.sec-recruitDetail-in .bg-blue li:after{
content: '';
display: block;
width: calc(100% + 14px);
height: 6px;
position: absolute;
left: -5px;
bottom: -4px;
background:#19b2f5 ;
z-index: -1;
border-radius: 10px;
}
.sec-recruitDetail-in .bg-blue ul:after {
content: '';
display: block;
width: 178px;
height: 152px;
position: absolute;
right: -28px;
bottom: -136px;
background: url(img/fv-icon-main.svg) no-repeat center / contain;
animation: ueshita 8s ease-in-out infinite alternate;
}
.lower .sec-soudan.bottom {
margin-top: 110px;
}

@media screen and (max-width : 391px){
.sec-recruitDetail-in .bg-blue li{
font-size: 26px;
}
}

@media screen and (max-width : 376px){
.sec-recruitDetail h1{
font-size: 22px;
}
.sec-recruitDetail-in .bg-blue ul {
padding-left: 48px;
}
.sec-recruitDetail-in .bg-blue li {
font-size: 25px;
}
.sec-recruitDetail-in .bg-blue li:before{
width: 10px;
height: 10px;
}
.sec-recruitDetail-in .bg-blue ul:after{
width: 160px;
}
}

@media screen and (max-width : 361px){
.sec-recruitDetail-in .bg-blue li {
font-size: 24px;
}
.sec-recruitDetail-in .bg-w:before{
left: -72px;
}
}

@keyframes scrolls {
0% {
transform: rotate(0deg) translate(0, 0);
}
80% {
transform: rotate(0deg) translate(0px, 15px);
}
0%, 80%, 100% {
opacity: 1;
}
40% {
opacity: 1;
}
}


/*---------------------------
サンクスページ、利用規約ページ調整
---------------------------*/
.thanks-title,.thanks-title.rule{
padding-top: 150px;
}
.thanks-title:before,.thanks-title.rule:before{
top: 120px;
}
.other main{
margin-top: 0;
}
.other footer{
padding-top: 0;
margin-top: 0;
}
.other .footer-in{
border-top: 0;
}
.other .line-btn{
text-align: center;
}

/*---------------------------
LINEボタン調整 241022
---------------------------*/
.line-btn{
text-align: center;
}

/*---------------------------
TOP　FV調整
---------------------------*/
.icon-wrap .cont {
font-size: 14px;
}
.icon-wrap{
margin-bottom: 0;
padding: 10px 40px 20px !important;
}
.micro-orange{
margin: 0 auto 10px;
position: relative;
color: #ff8300;
font-size: 20px;
font-weight: 700;
width: fit-content;
}
.micro-orange:before, .micro-orange:after {
content: '';
display: block;
width: 2px;
height: 20px;
position: absolute;
bottom: 0px;
background: #ff8300;
}
.micro-orange:before{
left: -14px;
transform: skew(40deg);
}
.micro-orange:after{
right: -14px;
transform: skew(-40deg);
}
.micro-bottom{
margin-top: 16px;
text-align: center;
font-size: 13px;
}

.sec-soudan.fvcta h2.micro-orange {
margin: 0 auto 10px;
padding:0;
position: relative;
color: #2f5190;
font-size: 18px;
font-weight: 700;
width: fit-content;
}
.sec-soudan.fvcta h2.micro-orange:before{
content: '';
display: block;
width: 2px;
height: 20px;
position: absolute;
bottom: 0px;
background: #2f5190;
left: -14px;
transform: skew(40deg);
}
.sec-soudan.fvcta h2.micro-orange:after{
content: '';
display: block;
width: 2px;
height: 20px;
position: absolute;
bottom: 0px;
background: #2f5190;
right: -14px;
transform: skew(-40deg);
}

@media only screen and (orientation:landscape) and (max-width : 813px),(orientation:portrait) and (max-width : 753px){

.soudan-wrap li button{
font-size: 12px;
}
}


@media screen and (max-width : 431px){
.fv .img-text {
position: absolute;
left: -130px;
right: 0;
top: -140px;
bottom: 0;
margin: auto;
width: 61%;
}
}
@media screen and (max-width : 415px){
.fv .img-text {
position: absolute;
left: -128px;
right: 0;
top: -134px;
bottom: 0;
width: 61%;
}
}
@media screen and (max-width : 391px){
.fv .img-text {
position: absolute;
left: -119px;
right: 0;
top: -120px;
bottom: 0;
margin: auto;
width: 61%;
}
.icon-wrap{
padding: 10px 30px 20px !important;
}
}
@media screen and (max-width : 376px){
.icon-wrap {
padding: 0px 15px;
}
.fv .img-text {
position: absolute;
left: -113px;
right: 0;
top: -113px;
bottom: 0;
margin: auto;
width: 61%;
}
.kyoka-num {
font-size: 12px;
}
}
@media screen and (max-width : 361px){
.fv .img-text {
position: absolute;
left: -109px;
right: 0;
top: -103px;
bottom: 0;
margin: auto;
width: 61%;
}
.kyoka-num {
font-size: 12px;
}
}

.sec-soudan.top,.sec-soudan.bottom{
background: #FFF;
padding: 40px 10px 19px;
box-sizing: border-box;
}
.sec-soudan.bottom div.mark p {
color: #a0a0a0;
line-height: 1.4;
}
.sec-case{
padding: 30px 0 50px;
}
.sec-case:before {
content: '';
display: block;
position: absolute;
width: 180px;
height: 250px;
background: url(img/bg-line3.svg) no-repeat center / contain;
right: -74px;
top: -50px;
z-index: -1;
}
.sec-case:after {
content: '';
display: block;
position: absolute;
width: 260px;
height: 260px;
background: url(img/bg-daen4.svg) no-repeat center / contain;
left: -50px;
bottom: 40px;
z-index: -1;
}
.sec-case .slick-track{
padding: 10px 0;
}
.sec-case .slide-cont{
width: 320px;
margin: 0 8px;
}
.sec-case .slide-cont img{
width: 100%;
box-shadow: 0 2px 5px 2px rgba(0,0,0,5%);
border-radius: 36px;
}
.slider-arrow {
top: 0;
bottom: 0;
margin: auto;
height: 76px;
width: 38px;
box-shadow: 0 0 3px rgba(0,0,0,10%);
padding: 0;
}
.slider-prev{
left: 0;
border-radius: 0 24px 24px 0;
padding-right: 6px;
}
.slider-next{
right: 0;
border-radius: 24px 0 0 24px;
padding-left: 6px;
}
.slider-arrow:before{
display: none;
}
.slider-arrow:after{
content: '';
display: block;
width: 20px;
height: 20px;
}
.slider-prev:after{
background: url(img/case-yaji-l.svg) no-repeat center / contain;
}
.slider-next:after{
background: url(img/case-yaji-r.svg) no-repeat center / contain;
}

@media screen and (max-width : 376px){
.sec-case .slide-cont{
width: 300px;
}
}

@media screen and (max-width : 361px){
.sec-case .slide-cont{
width: 290px;
}
}

/*---------------------------
FVボタン調整 241108
---------------------------*/
.sec-soudan.fvcta .line-btn{
position:relative;
padding:0 0 0 46px;
}
.sec-soudan.fvcta .line-btn:before{
content: '無料';
display:inline-block;
width: 58px;
height: 28px;
position: absolute;
top:0;
bottom: 0;
left:30px;
margin:auto;
font-size:18px;
background: #fdff00;
color:#06c655;
line-height:28px;
border-radius:4px;
font-weight:bold;
}
.sec-soudan.fvcta .advisor-btn{
position:relative;
padding:0 0 0 30px;
}
.sec-soudan.fvcta .advisor-btn:before{
content: '無料';
display:inline-block;
width: 50px;
height: 25px;
position: absolute;
top:0;
bottom: 0;
left:30px;
margin:auto;
font-size:16px;
background: #fdff00;
color:#ff692e;
line-height:25px;
border-radius:2px;
font-weight:bold;
}
@media screen and (max-width : 361px){
.sec-soudan.fvcta .line-btn,.sec-soudan.fvcta .advisor-btn{
padding:0 0 0 40px;
}
.sec-soudan.fvcta .line-btn:before,.sec-soudan.fvcta .advisor-btn:before{
width: 42px;
height: 25px;
line-height:25px;
font-size:14px;
left:20px;
}
}

@media screen and (max-width : 376px){
.kyoka-num {
font-size: 12px;
}
}

@media only screen and (orientation:landscape) and (max-width : 813px),(orientation:portrait) and (max-width : 753px){
header {
padding: 5px 12px;
}
body footer{
padding-bottom: 100px;
}
.other footer{
padding-bottom: 24px;
}
}


/*---------------------------
追加調整 241120
---------------------------*/
.slide2 .slide-cont {
width: 320px;
margin: 0 50px;
background: #fff;
padding-bottom: 18px;
}
.slide2 .inner{
display: flex;
margin-bottom: 20px;
}
.slide2 .inner img{
border-radius: 0 18px 18px 18px;
width: 40%;
}
.slide2 .inner .right{
width: 60%;
padding: 14px 14px 0 0;
}
.slide2 .inner .name-wrap {
background: #0b9de8;
display: flex;
justify-content: space-between;
color: #fff;
font-size: 16px;
padding: 8px 14px 8px 14px;
border-radius: 0 30px 30px 0;
margin-bottom: 10px;
}
.slide2 .inner .name-wrap .b{
font-weight: bold;
}
.slide2 .inner dl{
padding-left: 12px;
}
.slide2 .inner dt{
width: 60px;
line-height: 16px;
font-weight: 400;
background: #ccc;
color: #5c7287;
font-size: 10px;
text-align: center;
margin-bottom: 5px;
position: relative;
}
.slide2 .inner dl:last-of-type {
margin-top: 30px;
}
.slide2 .inner dl:last-of-type dt{
background: #ff4363;
color: #fff;
}
.slide2 .inner dl:last-of-type dt:before {
content: '';
display: block;
width: 28px;
height: 16px;
position: absolute;
left: 0;
right: 0;
top: -22px;
margin: auto;
background: url(img/voice-yaji-befaf.svg) no-repeat center / contain;
}
.slide2 .inner dd{
color: #22244b;
}
.slide2 .text-blue,.slide2 .text{
padding: 0 14px;
line-height: 1.6;
}
.slide2 .text-blue{
color: #0f2868;
font-weight: 600;
margin-bottom: 10px;
}
.slide2 .text{
font-weight: 400;
font-size: 14px;
margin-bottom: 0;
}
.micro-bttom {
text-align: center;
margin: 15px 0 0;
font-size: 12px;
}
.sec-soudan.fvcta .kome{
color: #5f7283;
font-size: 10px;
line-height: 1.6;
margin-top: 10px;
padding-left: 8px;
}
.sec-enjoy{
padding-bottom: 40px;
}
.sec-enjoy .img{
display: block;
margin: 0 auto 20px;
width: calc(100% - 20px);
}
.sec-enjoy-in{
margin: 0 18px;
background: #fff;
border-radius: 14px;
padding: 16px;
}
.sec-enjoy-in p{
line-height: 1.5;
}
.sec-enjoy-in p:last-child{
margin-bottom: 0;
}
.sec-enjoy-in .under-line{
background: linear-gradient(transparent 60%, #feeaa3 0%);
}
.sec-soudan.fvcta.enjoy-bottom{
border-radius: 0;
}
.sec-soudan.fvcta.enjoy-bottom h2.micro-orange{
color: #ff6602;
}
.sec-soudan.fvcta.enjoy-bottom h2.micro-orange:before,.sec-soudan.fvcta.enjoy-bottom h2.micro-orange:after{
background: #ff6602 ;
}
.sec-soudan.fvcta.enjoy-bottom .mark:after{
display: block;
top: 0px;
}
.sec-voice{
padding-bottom: 40px;
}
.sec-about h2{
line-height: 1.4;
margin-bottom: 26px;
}
.fv-main-t{
text-align: center;
font-weight: 900;
font-size: 28px;
margin-bottom: 16px;
}
.fv-main-t .top{
margin-left: -14px;
}
.fv-main-t .red{
color: #ff4163;
}
.fv-main-t .green{
display: block;
color: #05c755;
margin-top: 8px;
}
.fv-sub-t {
position: relative;
text-align: center;
line-height: 32px;
font-size: 13px;
font-weight: 600;
overflow: hidden;
margin-bottom: 72px;
}
.fv-sub-t:after {
content: '';
width: 100%;
height: 100%;
position: absolute;
right: 3px;
bottom: 0;
background: #fff;
z-index: -1;
transform-origin: right bottom;
transform: skewX(40deg);
}
.fv .img-wrap{
position: relative;
}
.fv-img-main {
width: 180px;
display: block;
margin: 0 auto;
position: relative;
top:-30px;
}
img[class^="fv-icon"]{
position: absolute;
width: auto;
height: 72px;
}
.fv-icon1 {
left: 50%;
margin-left: -146px;
top: -54px;
animation: ueshita 4s ease-in-out infinite alternate;
}
.fv-icon2{
right: 50%;
margin-right: -155px;
top: -54px;
animation: ueshita 4s ease-in-out infinite alternate;
}
.fv-icon3 {
left: 50%;
margin-left: -196px;
top: 26px;
animation: fuwawa 4s ease-in-out infinite alternate;
}
.fv-icon4{
right: 50%;
margin-right: -196px;
top: 26px;
animation: fuwawa 4s ease-in-out infinite alternate;
}
.fv-icon5 {
left: 50%;
margin-left: -180px;
top: 108px;
animation: ueshita 4s ease-in-out infinite alternate;
}
.fv-icon6{
right: 50%;
margin-right: -180px;
top: 108px;
animation: ueshita 4s ease-in-out infinite alternate;
}

@media screen and (max-width : 391px){
.sec-soudan.fvcta{
padding: 20px 14px 20px;
}
}

@media screen and (max-width : 376px){
.fv-sub-t{
font-size: 12px;
}
.fv-img-main {
width:180px;
}
img[class^="fv-icon"] {
height: 66px;
}
.fv-icon1{
margin-left: -128px;
}
.fv-icon2{
margin-right: -138px;
}
.fv-icon3{
margin-left: -176px;
}
.fv-icon4{
margin-right: -176px;
}
.fv-icon5{
margin-left: -164px;
}
.fv-icon6{
margin-right: -164px;
}
.sec-soudan.fvcta {
padding: 20px 5px 20px;
}
.slide2 .slide-cont {
width: 300px;
}
}

@media screen and (max-width : 361px){
.fv-sub-t:after{
transform: skewX(36deg);
}
.mark{
gap: 3px;
}
.mark img {
width: 46px;
}
.slide2 .slide-cont {
width: 290px;
}
}

/*---------------------------
241209
---------------------------*/

.modal .modal-cont a:hover {
  opacity: 1;
}

/*---------------------------
241224
---------------------------*/
.headbt{
padding-bottom: 3px;
}
.head-line-btn {
width: 160px;
border-radius: 50px;
display: block;
color: #fff;
font-size: 15px;
height: 30px;
line-height: 30px;
background: #06c655;
box-shadow: 0 3px 0 #008937;
font-weight: 800;
text-align: center;
padding-right: 10px;
position: relative;
}
.head-line-btn:after{
content: '';
display: block;
width: 18px;
height: 18px;
position: absolute;
right: 10px;
top: 0;
bottom: 0;
margin: auto;
background: url(img/header02_bt_yaji.svg) #64d800 no-repeat center / 10px;
border-radius: 50px;
}
