.event{
background: #fcf88f;
}
.requirement{
background: #2cc994;
transition: background-color 0.4s;
}
.requirement.cc02{
background: #ffad3b;
transition: background-color 0.4s;
}
.requirement.cc03{
background: #ffd84b;
transition: background-color 0.4s;
}



.recruit-main{
max-width: 1300px;
background: #fff;
margin: 0 auto;
padding: 60px 0 0;
border-radius: 0 0 40px 40px;
overflow: hidden;
}
.recruit-main-inner{
width: 92%;
max-width: 1000px;
margin: 0 auto 70px;
display: flex;
}
.event .recruit-main-inner{
display: flex;
justify-content: space-between;
}
.recruit-main-inner-pr{
width: 300px;
display: flex;
align-items: center;
}
.event .recruit-main-inner-pr{
width: 480px;
display: flex;
align-items: center;
}
.event .recruit-main-inner-sd{
width: calc(100% - 530px);
}


.recruit-main-inner h1{
font-family: "Dela Gothic One", sans-serif;
font-weight: 400;
font-size: 59px;
line-height: 1;
}
.recruit-main-inner p.sub{
font-family: "Montserrat", sans-serif;
font-weight: 800;
font-size: 25px;
line-height: 1.5;
}
.recruit-main-inner p{
font-weight: 700;
padding: 5% 0 0;
}
.requirement-main-ill{
width: 100%;
max-width: 316px;
}



.rec-contents{

}
.rec-contents-inner{
width: 92%;
max-width: 1000px;
margin: 0 auto;
}


.rec-contents-ttl{
width: 100%;
max-width: 600px;
font-family: "Dela Gothic One", sans-serif;
font-weight: 400;
font-size: 38px;
border-top: 8px solid #e82b20;
border-bottom: 8px solid #e82b20;
text-align: center;
margin: 0 auto 6%;
}



.rec-tab-box{
max-width: 900px;
margin: 0 auto;
display: flex;
justify-content: space-between;
}
.rec-tab-once{
width: 31%;
}
.rec-tab-once:hover{
cursor: pointer;
}
.rec-tab-once img{
opacity: 0;
transition: .2s opacity;
}
.rec-tab-once.active img,
.rec-tab-once:hover img{
opacity: 1;
transition: .2s opacity;
}
.tab01{
background: url("../images/rec-tab01-b.svg") no-repeat center center;
background-size: 100% auto;
}
.tab02{
background: url("../images/rec-tab02-b.svg") no-repeat center center;
background-size: 100% auto;
}
.tab03{
background: url("../images/rec-tab03-b.svg") no-repeat center center;
background-size: 100% auto;
}



.tab-cont01,
.tab-cont02,
.tab-cont03{
width: 100%;
padding: 8% 0 10%;
display: none;
}
.tab-cont01.show,
.tab-cont02.show,
.tab-cont03.show{
display: block;
animation: fadein 0.8s 1;
}
@keyframes fadein {0% {opacity: 0;}100% {opacity: 1;}
}
dl.job-description{
width: 100%;
display: flex;
flex-wrap: wrap;
}
dl.job-description dt{
width: 204px;
padding: 28px 0;
border-bottom: 1px solid #0aae89;
color: #fff;
font-size: 20px;
font-weight: 800;
}
dl.job-description dd{
width: calc(100% - 204px);
font-size: 15px;
font-weight: 700;
padding: 28px 0;
border-bottom: 1px solid #0aae89;
}
dl.job-description dd a{
text-decoration: underline;
color: #000;
}
.tab-cont02 dl.job-description dt,
.tab-cont02 dl.job-description dd{
border-bottom: 1px solid #f15a24;
}

.qa-box{
padding: 28px 0 0;
}

.qa-once{
margin: 0 0 4%;
}
.qa-q{
position: relative;
background: #fcf88f;
padding: 16px 60px 16px 84px;
font-size: 20px;
font-weight: 700;
line-height: 1.6;
}
.qa-q::after{
position: absolute;
width: 58px;
height: 100%;
top: 0;
left: 0;
background: #f15a24;
color: #fff;
content: 'Q.';
text-align: center;
font-family: "Montserrat", sans-serif;
font-weight: 800;
font-size: 19px;
display: flex;
align-items: center;
justify-content: center;
}
.qa-a{
padding: 24px 16px 24px 84px;
font-size: 15px;
font-weight: 700;
line-height: 1.6;
display: none;
}
.qa-a.active{
display: block;
}
.qa-q .icon{
position: absolute;
top: 50%;
right: 22px;
width: 15px;
height: 15px;
content: '';
transform: translateY(-50%);
}



.qa-q .icon::before,
.qa-q .icon::after{
content: '';
display: inline-block;
width: 15px;
height: 2px;
background-color: #001F6B;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
transition: opacity 0.5s;
}

.qa-q .icon::after{
transform: translateY(-50%) rotate(90deg);
transition: transform 0.5s;
}

.qa-q.active .icon::before{
opacity: 0;
}

.qa-q.active .icon::after{
transform: translateY(-50%) rotate(180deg);
}






.rec-entry-sec{
background: #fff;
}

















.event-cont-wrap{
margin: 8% 0 12%;
}
.event-cont-ill{
display: block;
width: 90%;
max-width: 372px;
margin: 0 auto 2%;
}
.event-box{
margin: 0 0 12%;
}


.event-once{
border-radius: 40px;
overflow: hidden;
margin: 0 0 5%;
}

.event-head{
background: #2cc994;
padding: 3% 10% 3% 6%;
position: relative;
display: flex;
}
.event-head:hover{
cursor: pointer;
opacity:0.8;
transition: .4s opacity;
}
.event-head::after{
position: absolute;
top: 50%;
right: 6%;
width: 40px;
height: 40px;
content: '';
transform: translateY(-50%) rotate(180deg);
background: url("../images/event-ac-close.svg") no-repeat center center;
background-size: 100% auto;
transition: .4s transform;
}
.event-head.active::after{
transform: translateY(-50%) rotate(0);
background: url("../images/event-ac-close.svg") no-repeat center center;
background-size: 100% auto;
transition: .4s transform;
}
.event-head-pr{
width: 440px;
color: #fff;
display: flex;
align-items: center;
}
.event-head-pr-inner{
display: flex;
}
.event-head-pr-pr{
width: 134px;
font-family: "Montserrat", sans-serif;
font-weight: 800;
font-size: 84px;
line-height: 76px;
border-right: 2px solid #fff;
}
.event-head-pr-pr p{
font-size: 18px;
line-height: 20px;
}
.event-head-pr-sd{
font-size: 30px;
font-weight: 800;
line-height: 1.5;
padding: 10px 0 0 30px;
}
.event-head-sd{
width: calc(100% - 460px);
}




.event-cont{
background: #fff;
padding: 5% 6%;
display: none;
}
.event-cont-box{
display: flex;
justify-content: space-between;
margin: 0 0 7%;
}
.event-cont-box-pr{
width: 48%;
}
.event-cont-box-sd{
width: 48%;
}
.event-cont-ttl{
font-family: "Dela Gothic One", sans-serif;
font-weight: 400;
font-size: 23px;
color: #008e51;
line-height: 1;
margin: 0 0 6%;
padding: 0 0 0 18px;
border-left: 5px solid #008e51;
}

.event-recommend{
display: flex;
border-radius: 1000px;
border:4px solid #ffd84b;
}
.event-recommend-pr{
width: 208px;
background: #ffd84b;
font-family: "Dela Gothic One", sans-serif;
font-weight: 400;
font-size: 20px;
color: #e82b20;
line-height: 1;
padding: 8px 0 8px 80px;
position: relative;
border-radius: 100px 0 0 100px;
}
.event-recommend-ill{
position: absolute;
bottom: 6px;
left: 20px;
width: 50px;
}
.event-recommend-sd{
font-weight: 800;
font-size: 20px;
color: #008e51;
line-height: 1;
display: flex;
align-items: center;
padding: 0 3%;
}

.online-box{
background: #fff;
margin: 0 auto 12%;
padding: 5% 6%;
border-radius: 40px;
}
.online-cont{
width: 100%;
display: flex;
border-bottom: 1px solid #e6e6e6;
padding: 34px 0;
}
.online-cont p{
font-size: 20px;
font-weight: 700;
}
.online-cont p.indent{
padding-left: 1em; /* 1行目の記号分の余白を作る */
  text-indent: -1em; /* 1行目だけを左に突き出す */
}
.online-cont p span{
color: #2cc994;
}
.online-cont p span.dt{
display: inline-block;
width: 178px;
text-align: justify;
}
.online-cont-pr{
width: 162px;
min-height: 100px;
background: #2cc994;
border-radius: 30px;
color: #fff;
text-align: center;
display: flex;
align-items: center;
font-size: 22px;
font-weight: 700;
justify-content: center;
}
.online-cont-sd{
padding: 0 0 0 30px;
display: flex;
flex-direction: column;
justify-content: center;
}
.online-cont-full{
width: 100%;
font-size: 17px;
font-weight: 700;
padding: 34px 0;
}



.line-box{
padding: 0 0 12%;
}
.rec-entry-sec .line-box{
padding: 10% 0 10%;
}
.line-entry{
width: 90%;
max-width: 600px;
margin: 0 auto 4%;
}
.line-booking{
width: 90%;
max-width: 580px;
margin: 0 auto 5%;
}
.line-qr{
max-width: 216px;
margin: 0 auto;
}
.line-att{
text-align: center;
font-size: 12px;
margin: 0 auto 14px;
}



.event .others-wrap{background: #2cc994;}
.requirement .others-wrap{background: #2cc994;}



@media (max-width: 767px) { 
.recruit-main {
margin: 0 auto;
padding: 8% 0 0;
border-radius: 0 0 5vw 5vw;
}
.requirement .recruit-main {
border-radius: 0;
}
.rec-tab-once {
width: 33%;
}
.recruit-main-inner {
width: 88%;
max-width: 1000px;
margin: 0 auto 10%;
display: block;
}
.recruit-main-inner-pr {
width: 100%;
display: block;
}
.recruit-main-inner-sd{
width: 100%;
}
.recruit-main-inner-sd img{
display: block;
margin: 4% auto 0;
width: 70%;
}

dl.job-description {
width: 100%;
display: block;
}
dl.job-description dt {
width: 100%;
padding: 5% 0 10px;
border-bottom: none;
color: #fff;
font-size: 16px;
}
dl.job-description dd {
width: 100%;
font-size: 14px;
padding: 0 0 5%;
border-bottom: 1px solid #0aae89;
}
.tab-cont02 dl.job-description dt {
border-bottom: none;
}
.tab-cont01, .tab-cont02, .tab-cont03 {
padding: 8% 0 14%;
}
.rec-entry-sec .line-box {
padding: 20% 0 20%;
}



.qa-q::after {
position: absolute;
width: 40px;
font-size: 18px;
display: flex;
align-items: center;
justify-content: center;
}
.qa-q {
position: relative;
padding: 12px 38px 12px 50px;
font-size: 14px;
line-height: 1.6;
}
.qa-q .icon {
right: 14px;
width: 14px;
height: 14px;
content: '';
transform: translateY(-50%);
}
.qa-a {
padding: 5% 0 8%;
font-size: 14px;
}



.event .recruit-main-inner {
display: block;
width: 88%;
margin: 0 auto 8%;
}
.recruit-main-inner p.sub {
font-size: 22px;
}
.recruit-main-inner h1 {
font-size: 34px;
line-height: 1;
}
.event-cont-wrap {
margin: 18% 0 18%;
}
.event .recruit-main-inner-pr {
width: 100%;
display: block;
}
.event .recruit-main-inner-sd {
width: 100%;
}
.event .recruit-main-inner-sd img {
width: 80%;
display: block;
margin: 4% auto 0;
}

.event-box {
margin: 0 0 20%;
}
.rec-contents-inner {
width: 88%;
}
.event-cont-ill {
width: 70%;
margin: 0 auto 4%;
}

.rec-contents-ttl {
font-size: 28px;
border-top: 4px solid #e82b20;
border-bottom: 4px solid #e82b20;
margin: 0 auto 8%;
line-height: 1.1;
padding: 8px 0;
}
.online-box {
padding: 2% 5% 7%;
border-radius: 5vw;
}
.online-cont {
display: block;
border-bottom: 1px solid #e6e6e6;
padding: 5% 0;
}
.online-cont-pr {
width: 100%;
min-height: auto;
border-radius: 18px;
display: block;
font-size: 16px;
padding: 8px;
margin: 0 0 5%;
}
.online-cont-sd {
padding: 0 0 0;
display: block;
}
.online-cont p span.dt {
display: block;
width: 100%;
text-align:left;
}
.online-cont p {
font-size: 14px;
margin: 0 0 3%;
}
.online-cont-full {
font-size: 14px;
padding: 3% 0;
}
.line-qr {
width: 50%;
max-width: auto;
margin: 0 auto;
}
.event-once {
border-radius: 5vw;
margin: 0 0 8%;
}
.event-head {
padding: 8% 5% 6% 5%;
display: block;
}
.event-head-pr {
width: 100%;
display: flex;
align-items: center;
}
.event-head-sd {
width: 100%;
}
.event-head-sd img{
width: 60%;
display: block;
margin: 4% auto 0;
}
.event-head-pr-sd {
font-size: 20px;
font-weight: 800;
line-height: 1.5;
padding: 0 0 0 18px;
}
.event-head-pr-pr {
width: 80px;
font-size: 44px;
line-height: 40px;
border-right: 1px solid #fff;
}
.event-head-pr-pr p {
font-size: 14px;
line-height: 15px;
}
.event-head::after {
right: 5%;
width: 30px;
height: 30px;
}
.event-cont {
padding: 6% 5%;
display: none;
}
.event-cont-box {
display: block;
margin: 0 0 7%;
}
.event-cont-box-pr {
width: 100%;
}
.event-cont-box-sd {
width: 100%;
padding: 8% 0 0;
}
.event-cont-ttl {
font-size: 20px;
line-height: 1;
margin: 0 0 6%;
padding: 0 0 0 14px;
border-left: 4px solid #008e51;
}
.event-recommend {
display: block;
border-radius: 18px;
border: 2px solid #ffd84b;
margin: 10% 0 0;
}
.event-recommend-pr {
width: 100%;
font-size: 18px;
line-height: 1;
padding: 14px 0 14px 24px;
position: relative;
border-radius: 14px 14px 0 0;
text-align: center;
}
.event-recommend-sd {
font-size: 16px;
display: block;
padding: 5% 5%;
line-height: 1.7;
}
.event-recommend-ill {
bottom: 6px;
left: 6px;
width: 38px;
}

.line-box {
padding: 0 0 30%;
}
.event-head:hover {
    cursor: pointer;
    opacity: 1;
}
.line-att,.line-qr {
display: none;
}


}