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

body{
display: flex;
flex-flow: column;
min-height: 100vh;
margin:0;
padding:0;
font-family: 'Noto Sans JP', sans-serif;
font-size:16px;
color:#000000;
line-height:150%;
}
main{
box-sizing:border-box;
padding:80px 0;
}
ul,li,dl,dt,dd{
margin:0;
padding:0;
list-style:none;
}
a {
text-decoration:none;
}
input[type="checkbox"]{
margin-right:3px;
}
#mv img{
width:100%;
}

#s1,
#s2,
#s3{
position:relative;
}
#s1 p,
#s2 p,
#s3 p{
position:absolute;
font-weight:400;
line-height:245%;
display:none;
}
#s1 strong,
#s2 strong,
#s3 strong{
color:#48adda;
font-weight:500;
}
#s1 h2,
#s2 h2,
#s3 h2{
position:absolute;
margin:0;
width:50px;
opacity:0;
}
#s1 h2 img,
#s2 h2 img,
#s3 h2 img{
width:100%;
}

.mask{
position:absolute;
bottom:0;
width:100%;
height:100%;
background:#fff;
}
.mask.off{
animation-name:bgShow;
animation-delay:0s;
animation-duration:5s;
animation-fill-mode: forwards;
}
@keyframes bgShow{
from {
height:100%;
}
to {
height:0%;
background:transparent;
}
}
.fadeIn{
animation-name:fadeInAnime;
animation-delay:0.5s;
animation-duration:2s;
animation-fill-mode:forwards;
opacity:0;
}
@keyframes fadeInAnime{
from {
opacity: 0;
}
to {
opacity: 1;
}
}


.to_entry,
.to_info{
padding:80px 0;
text-align:center;
}
.to_entry a,
.to_info a
{
display:inline-block;
padding:20px 0;
border:2px solid #963932;
border-radius:10px;
background: linear-gradient(to bottom, #f37e78 -100%, #ec554e);
color:#fff;
font-weight:500;
letter-spacing:0.1em;
}
.to_entry p{
font-size:22px;
}
.to_entry p span{
font-size:15px;
}
.to_back{
padding:0 0 80px;
text-align:center;
}
.to_back a{
display:inline-block;
width:300px;
padding:20px 0;
border:2px solid #868686;
border-radius:10px;
color:#868686;
font-weight:500;
letter-spacing:0.1em;
}

#example{
padding:40px 0;
background:#f7f7f7;
}
#example h2{
color:#205970;
font-size:34px;
font-weight:400;
text-align:center;
margin-bottom:50px;
}
#example ul{
margin:0 auto;
display:flex;
/* justify-content: space-between;*/
justify-content: center;
}
#example li{
box-sizing:border-box;
width:280px;
height:330px;
background:#fffef3;
border:2px solid #205970;
padding:20px;
color:#205970;
}
#example li h3{
margin:0 0 10px;
font-size:20px;
line-height:150%;
letter-spacing:0.05em;
}
#example li p{
font-size:14px;
}
#example li a{
display:inline-block;
width:100%;
padding:10px 0;
border:2px solid #4298be;
border-radius:10px;
/*background: linear-gradient(to bottom, #7cc5e4 -100%, #48adda);*/
background : linear-gradient(0deg, rgba(72, 173, 218, 1) 0%, rgba(127, 198, 229, 1) 100%);
color:#fff;
font-size:16px;
font-weight:500;
letter-spacing:0.1em;
text-align:center;
}

#outline h2{
text-align:center;
color: #205970;
font-size: 34px;
font-weight: 400;
margin-bottom:40px;
}
#outline dl{
box-sizing:border-box;
width:700px;
margin:0 auto;
border:2px solid #48adda;
display:flex;
flex-wrap:wrap;
padding:10px 30px;
}
#outline dt,
#outline dd{
padding:10px 0;
font-size:15px;
}
#outline dt{
width:15%;
margin-right:10%;
text-align-last:justify;
}
#outline dd{
width:75%;
}
#outline dd a.btn{
display: block;
width: 300px;
margin:10px 0;
padding: 5px 0;
border: 1px solid #868686;
border-radius: 10px;
font-size:13px;
color: #000;
text-align:center;
letter-spacing: 0.1em;
}


footer{
margin:0 auto;
border-top:1px solid #000;
text-align:center;
padding:20px 0;
}


/**-- Register ---**/
#entry{
box-sizing:border-box;
margin:0 auto;
border:1px solid #48adda;
padding:50px;
position:relative;
}
#entry h1{
position:absolute;
top:-35px;
left:0px;
padding:0 20px;
background:#fff;
font-size:30px;
font-weight:500;
letter-spacing:0.1em;
}
#entry h1 span{
background:linear-gradient(transparent 60%, #ff6 60%);
}

#entry dl{
display:flex;
flex-wrap:wrap;
}
#entry dt,
#entry dd{
font-size:18px;
padding:10px 0 10px;
}
#entry dt{
width:25%;
}
#entry dd{
width:75%;
}
#entry dd p{
font-size:14px;
margin:0 0 10px;
}
#entry dd p a{
text-decoration:underline;
}
#entry dd strong{
display:block;
font-size:13px;
color:#ec554e;
}
#entry input[type="text"],
#entry textarea{
box-sizing:border-box;
padding:5px;
width:100%;
}
#entry input.s50{
width:50%;
}
#entry label{
display:inline-block;
font-size:15px;
margin-right:1em;
line-height:180%;
}
.submit{
text-align:center;
margin:30px 0 0;
}
#entry button{
width:200px;
margin:0 10px;
padding:10px 0;
border-radius:10px;
color:#fff;
font-size:20px;
font-weight:500;
letter-spacing:0.1em;
}
#entry button.go{
border:2px solid #963932;
background: linear-gradient(to bottom, #f37e78 -100%, #ec554e);
}
#entry button.back{
border:2px solid #333;
background: #999;
}

/**-- Information --**/
#information{
box-sizing:border-box;
margin:0 auto;
border:1px solid #48adda;
padding:200px 0;
position:relative;
}
#information h1{
position:absolute;
top:-35px;
left:0px;
padding:0 20px;
background:#fff;
font-size:30px;
font-weight:500;
letter-spacing:0.1em;
}
#information h1 span{
background:linear-gradient(transparent 60%, #ff6 60%);
}
#information p{
text-align:center;
}


/**--     Job     --**/
#pagemv{
margin:0 auto;
background:url('../img/pagemv.jpg') no-repeat transparent;
background-size:cover;
text-align:center;
}
#pagemv p{
color:#fff;
font-size:45px;
letter-spacing:0.5em;
margin-top:120px;
}
.wrapper{
margin:0 auto;
}
.job h1{
margin:0 0 70px;
font-weight : bold;
font-size : 36px;
line-height : 56px;
letter-spacing : 1.8px;
color : #48ADDA;
}
.job .naiyo{
margin-bottom:70px;
}
.job .naiyo h2,
.job .condition h2{
box-sizing:border-box;
background:#48ADDA;
color:#fff;
letter-spacing:0.05em;
font-weight:400;
margin-bottom:0;
padding:10px;
width:150px;
text-align:center;
}
.job .naiyo dl{
background:url('../img/job_bg.png') repeat-y;
background-size:35px;
padding:50px 0 0;
}
.job .naiyo dt{
background:url('../img/job_bg2.png') no-repeat 0 6px;
background-size:53px;
margin-left:35px;
padding-bottom:40px;
padding-left:65px;
font-size:28px;
color:#48ADDA;
font-weight:500;
}
.job .naiyo dd{
margin-left:35px;
padding-left:65px;
padding-bottom:40px;
}
.job .naiyo dt:nth-child(7){
margin-left:0;
padding-left:95px;
background:#ffffff url('../img/job_bg3.png') no-repeat bottom 45px left;
background-size:88px;
}
.job .naiyo dd:last-child{
margin-left:0;
padding-left:95px;
background:#fff;
}

.job .condition{
position:relative;
}
.job .condition h2{
position:absolute;
margin:0;
top:-20px;
letter-spacing:1em;
text-indent:1em;
}
.job .condition dl{
display:flex;
flex-wrap:wrap;
margin-left:35px;
padding:60px;
border:1px solid #48ADDA;
font-size:20px;
}
.job .condition dt,
.job .condition dd{
padding-bottom:20px;
}
.job .condition dt{
box-sizing:border-box;
text-align:justify;
text-align-last:justify;
width:17%;
padding-right:3%;
border-right:1px dashed #48ADDA;
}
.job .condition dd{
box-sizing:border-box;
width:77%;
padding-left:3%;
}

.fadeIn{
animation-name:fadeInAnime;
animation-duration:2s;
animation-fill-mode:forwards;
opacity:0;
}
@keyframes fadeInAnime{
from {
opacity: 0;
}
to {
opacity: 1;
}
}


/* privacypolicy */
.privacy{
}
.privacy p{
line-height:200%;
margin-bottom:30px;
font-size:15px;
}

.privacy .to_back{
margin-top:80px;
}


/*
   PC -----------------------------------
 */
@media screen and (min-width: 429px){

.pc{
display:block;
}
.sp{
display:none;
}


#mv{
width:1200px;
margin:0 auto;
}
footer{
width:900px;
}

#s1,
#s2,
#s3{
width:900px;
margin:0 auto 80px;
}
#s1 p,
#s2 p,
#s3 p{
width:610px;
font-size:20px;
}

#s1{
height:477px;
background:url('../img/p1bg.png') repeat-x transparent;
background-size:cover;
}
#s1 p{
top:30px;
left:50px;
}
#s1 h2{
top:0;
left:725px;
}
#s2{
background:url('../img/p2bg.png') repeat-x transparent;
background-size:cover;
height:429px;
}
#s2 h2{
top:0;
left:126px;
}
#s2 p{
top:30px;
right:50px;
}
#s3{
background:url('../img/p3bg.png') repeat-x transparent;
background-size:cover;
height:380px;
margin-bottom:0;
}
#s3 h2{
top:0;
left:771px;
}
#s3 p{
top:30px;
left:106px;
}

#example ul{
width:900px;
}
.to_entry a,
.to_info a
{
width:400px;
font-size:30px;
}
.to_back a{
width:300px;
font-size:30px;
}

#entry,
#information{
width:900px;
}

#pagemv{
width:1200px;
height:300px;
}
.wrapper{
width:800px;
}




} /* END:PC */

/*
   MOBILE -----------------------------------
 */
@media screen and (max-width:428px){

.pc{
display:none;
}
.sp{
display:block;
}

main{
padding:40px 0;
}
footer{
width:80%;
}
#mv{
width:auto;
margin:0 auto;
}
#s1,
#s2,
#s3{
margin: 0 20px 30px;
padding:20px;
border:1px solid #48ADDA;
}

#s1 h2,
#s2 h2,
#s3 h2{
width:30px;
}

#s1 p,
#s2 p,
#s3 p{
font-size:13px;
width:80%;
}

#s1{
height:390px;
/* background:url('../img/p1bg.png') repeat-x transparent;*/
background-size:cover;
}
#s1 p{
padding-right:50px;
}
#s1 h2{
top:-10px;
right:-8px;
}
#s2{
height:285px;
/* background:url('../img/p2bg.png') repeat-x transparent;*/
background-size:cover;
}
#s2 h2{
top:-10px;
left:-8px;
}
#s2 p{
padding-left:30px;
}
#s3{
height:250px;
/*background:url('../img/p3bg.png') repeat-x transparent;*/
background-size:cover;
margin-bottom:0;
}
#s3 h2{
top:-10px;
right:-8px;
}
#s3 p{
padding-right:50px;
}
.to_entry,
.to_info{
padding:40px 0;
}
.to_entry a,
.to_info a
{
width:80%;
font-size:18px;
padding:10px 0;
}
.to_back a{
width:60%;
font-size:18px;
padding:10px 0;
}
.to_entry p{
font-size:20px;
}
.to_entry p span{
display:block;
font-size:13px;
}

#example {
padding: 20px 0 40px;
}
#example h2{
font-size:20px;
margin-bottom:30px;
}
#example li h3{
font-size:16px;
}

#outline{
margin:0 20px;
}
#outline h2{
font-size:20px;
margin-bottom:30px;
}
#outline dl{
width:100%;
display:block;
padding:10px;
}
#outline dt,
#outline dd{
width:100%;
padding:0;
font-size:14px;
}
#outline dt{
text-align:left;
text-align-last:left;
}
#outline dd{
margin-bottom:15px;
}
#outline dd a.btn{
margin:10px auto;
}







#entry{
margin:0 20px;
padding:20px;
}
#entry h1,
#information h1 {
font-size:24px;
}
#entry dl{
display:block;
}
#entry dt,
#entry dd{
width:100%;
padding:0 0 10px;
font-size:15px;
}
#entry input[type="text"],
#entry textarea{
padding:0;
}
#entry button{
margin-bottom:20px;
}

#information{
margin:0 20px;
}

#pagemv{
width:100%;
height:150px;
}
#pagemv p{
margin-top:60px;
font-size:25px;
}
.wrapper{
margin:0 20px;
}
.job h1{
font-size:20px;
line-height:40px;
margin:0 0 40px;
}

.job .naiyo h2, .job .condition h2 {
width: 110px;
font-size:18px;
}
.job .naiyo dl{
background:url('../img/job_bg.png') repeat-y left -10px top;
background-size:35px;

}
.job .naiyo dt {
background: url('../img/job_bg2.png') no-repeat 0 6px;
background-size: 53px;
margin-left: 25px;
padding-bottom: 20px;
padding-left: 65px;
font-size: 18px;
color: #48ADDA;
font-weight: 500;
}

.job .naiyo dt:nth-child(7) {
background:#ffffff url('../img/job_bg3.png') no-repeat bottom 25px left -10px;
background-size:88px;
padding-left:85px;
}
.job .naiyo dd{
margin-left: 25px;
padding-bottom:20px;
}
.job .naiyo dd:last-child{
margin-left:0;
padding-left:85px;
background:#fff;
}

.job .condition dl {
margin-left: 25px;
padding: 50px 20px 30px;
font-size: 15px;
}













} /* END:MOBILE */
