@charset "utf-8";

/*root*/

:root{

    /*color*/
    --blue:#4474B3;
    --orange:#FE9C0D;
    --lightblue:#CAD8EA;
    --lightorange:#FBE8CC;
    --darkblue:#1A2C44;
    --back:#F9F8F4;

    /*font-size*/
    /*base-size:1200px*/
    --fontsize-8:min(0.66666vw,8px);
    --fontsize-10:min(0.83333vw,10px);
    --fontsize-11:min(0.91666vw,11px);
    --fontsize-12:min(1vw,12px);
    --fontsize-13:min(1.08333vw,13px);
    --fontsize-14:min(1.16666vw,14px);
    --fontsize-16:min(1.33333vw,16px);
    --fontsize-18:min(1.5vw,18px);
    --fontsize-20:min(1.66666vw,20px);
    --fontsize-24:min(2vw,24px);
    --fontsize-30:min(2.5vw,30px);
    --fontsize-32:min(2.66666vw,32px);
    --fontsize-36:min(3vw,36px);
    --fontsize-40:min(3.33333vw,40px);
    --fontsize-45:min(3.75vw,45px);
    --fontsize-48:min(4vw,48px);
    --fontsize-56:min(4.66666vw,56px);
    --fontsize-64:min(5.33333vw,64px);
    --fontsize-80:min(6.66666vw,80px);
    --fontsize-96:min(8vw,96px);
    --fontsize-100:min(8.33333vw,100px);
    --fontsize-128:min(10.66666vw,128px);
    --fontsize-144:min(12vw,144px);
    --fontsize-160:min(13.33333vw,160px);
    --fontsize-162:min(13.5vw,162px);
    --fontsize-180:min(15vw,180px);
    --fontsize-240:min(20vw,240px);

}

/*common*/

body{
    font-family:"Inter","Noto Sans JP","hiragino-kaku-gothic-pron",sans-serif;
    /* font-size: 16px; */
    /* font-size:1.25vw; */
    font-size: var(--fontsize-16);
    color:var(--darkblue);
    font-weight:400;
    line-height:1.75;
    background:#fff;
    font-style: normal;
    letter-spacing: 0.05em;
}

.overflow{
    overflow-x:hidden;
}

.blue{
    color:var(--blue);
    font-weight:700;
}

.orange{
    color:var(--orange);
    font-weight:700;
}

h2{
    text-align:center;
    font-size:var(--fontsize-24);
    font-weight:500;
    padding:min(5.33333vw,64px) 0;
}

.section__wrap{
    margin:0 min(16.66666vw,200px);
}

.medium{
    font-weight:500;
}

.sp{
    display: none;
}

.pc{
    display:block;
}


/*header*/

header{
    position:fixed;
    z-index:99999;
    width:100%;
}

.h__wrap{
    display:flex;
    justify-content: space-between;
    align-items: center;
    background:#fff;
}

.h-logo{
    margin-left:24px;
    padding: min(1.12708vw, 13.525px) 0;
}

.h-logo img{
    width:min(9.16666vw,110px);
}

.header__nav--list{
    display:flex;
    font-size:var(--fontsize-14);
    gap:min(2vw,24px);
    align-items: center;
}

.header__nav--item{
    position:relative;
    /* padding:min(2.16666vw,26px) 0; */
    cursor: pointer;
    /* border-bottom:1px solid var(--blue); */
}

.header__nav--item a{
    display: inline-block;
}

.header__nav--item::before{
    content:'';
    display:none;
    position:absolute;
    width:5px;
    height:5px;
    border-radius: 50%;
    top:15px;
    left:0;
    right:0;
    margin:0 auto;
    background:var(--blue);
}

.navlast{
    margin-right: min(1.6666vw, 20px);
}

.header__inquiry a{
    display: block;
    padding:min(2.16666vw,26px) min(6vw,72px);
    color:#fff;
    font-weight:bold;
    background:var(--orange);
    position:relative;
    z-index:1;
    transition: .3s;
}

.header__inquiry a::before{
    /* content:'';
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    z-index:-1;
    background:#29528b;
    transform-origin:100% 50%;
    transform:scaleX(0);
    transition:transform ease .3s; */
}

.hamburger {
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width: 20px;
  height: 16px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  z-index: 1001;
}

.hamburger span {
  display: block;
  height: 2px;
  width:20px;
  background: var(--blue);
  transition: all 0.3s ease;
  border-radius: 2px;
}

/* ☓に変形するスタイル */
.hamburger.active span:nth-child(1) {
  transform: translateY(9px) rotate(45deg);
}

.hamburger.active span:nth-child(2) {
  opacity: 0;
}

.hamburger.active span:nth-child(3) {
  transform: translateY(-5px) rotate(-45deg);
}

/*main*/

#mv{
    margin-top: min(6.08083vw, 72.97px);
    padding-bottom:3.33333vw;
    background-image: url(../img/mv.png);
    background-repeat: no-repeat;
    /* background-size:cover; */
    background-size: 108%;
    background-position: 0 17%;
    
}

.mv__wrap{
    padding:0 min(16.66666vw,200px);
}

.mv__wrap .mv__title{
    width:min(38.75vw,680px);
    padding-top:2.25vw;
    padding-bottom:4vw;
    display: block;
}

.mv__wrap .mv__txt{
    display: block;
    
}

.mv__wrap #mv__txt1{
    width:min(20.16666vw,380px);
    padding-bottom:min(1.5vw,18px);
}

.mv__wrap #mv__txt2{
    width:min(30vw,550px);
}

/*trouble*/

#trouble{
    position: relative;
    padding-bottom:min(4.16666vw,50px);
}

#trouble h2{
    padding-bottom:min(6vw,72px);
}

.deco__left{
    width:100%;
    height:100%;
    position:absolute;
    top:min(3.33333vw,40px);
    left:0;
    background-image:url(../img/deco_orange.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position:left;
    z-index:-1;
}

.deco__right{
    width:100%;
    height:100%;
    position:absolute;
    top:max(-7.5vw,-90px);
    right:0;
    background-image:url(../img/deco_blue.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position:right;
    z-index:-1;
}

.trouble__content{
    display: flex;
    justify-content: center;
}

.trouble__content--left{
    margin-right:min(6vw,72px);
    position:relative;
}

.trouble__content--left img{
    position:absolute;
    top:0;
    left:max(-9.66666vw,-116px);
    width:min(12vw,144px);
    display: block;
    padding-top:min(3.75vw,45px);
}

.trouble__content--right img{
    display: block;
}

.trouble__content--right img:first-child{
    width:min(30vw,360px);
    margin-bottom:min(1.33333vw,16px);
}

.trouble__content--right img:nth-child(2){
    width:min(35.66666vw,428px);
    margin-bottom:min(1.33333vw,16px);
}

.trouble__content--right img:last-child{
    width:min(31.41666vw,377px);
}

/*message*/
#message{
    background:var(--back);
    padding:min(7.08333vw,85px) 0;
}

.message--list{
    display: flex;
    justify-content: center;
    align-items: center;
}

.message__left--item{
    font-size:var(--fontsize-32);
    font-weight:500;
    margin-right:min(9vw,108px);
}

.message__left--item .blue{
    font-size:var(--fontsize-36);
    font-weight:700;
}

.message__right--item{
    font-size: var(--fontsize-18);
}

/*point*/

#point{
    padding-bottom:min(10vw,120px);
}

.point--list{
    margin:0 auto;
    display: flex;
    justify-content: center;
    margin-bottom:min(6.66666vw,80px);
    max-width:1026px;
}

.point--item{
    border-radius: min(1.3333vw,16px);
    border:2px solid var(--darkblue);
    max-width:496px;
    width:50%;
}

#point1{
    margin-right:min(2.83333vw,34px);
}

.point--item__content{
    display: flex;
    flex-direction: column;
    align-items: center; 
}

.point--item__title{
    font-size: var(--fontsize-18);
    margin-top:min(2vw,24px);
}
.point--item__img img{
    /* width:100%; */

}

#point1 .point--item__title{
    margin-bottom:min(2.5vw,30px);
    text-align: center;
}

#point1 .point--item__img{
    margin-bottom:min(1.08333vw,13px);
    text-align: center;
}

.point--item__txt{
    margin:0 min(2.83333vw,34px);
    max-width:350px;
    font-size:var(--fontsize-16);
}

#point1 .point--item__txt{
    margin-bottom:min(2vw,24px);
}

#point2 .point--item__title{
    margin-bottom:min(1.75000vw,21px);
    text-align: center;
}

#point2 .point--item__img{
    margin-bottom:min(0.66666vw,8px);
    text-align: center;
}

.feature--list{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    max-width:1026px;
    margin:0 auto;
}

.feature--item{
    max-width:1026px;
}

.feature--item:not(:last-child){
    margin-bottom:min(6vw,72px);
}

.feature{
    margin-bottom:min(4.16666vw,50px);
}

.feature__num{
    color:#fff;
    background:var(--blue);
    font-size:var(--fontsize-14);
    font-weight:500;
    padding:min(0.41666vw,5px) min(1.66666vw,20px);
    border-radius:9999px;
    margin-right:min(0.66666vw,8px);
}

.feature__title{
    display: inline-block;
    font-size:var(--fontsize-24);
    font-weight:500;
}

.feature__content{
    display: flex;
    /* justify-content: space-between; */
}

.feature__content li{
    width:50%;
}

.feature__img img{
    width:100%;
}

.feature__txt{
    /* max-width:400px; */
    font-size: var(--fontsize-16);
}

.feature__left{
    margin-right:min(4.16666vw,50px);
}

/*work*/

#work{
    background:var(--back);
    padding-bottom:min(10vw,120px);
}

#work__ttl2{
    padding-top:min(6.66666vw,80px);
}

.work__wrap{
    max-width:1026px;
    margin: 0 auto;
}

.work__wrap p{
    max-width:min(38.41666vw,461px);
    font-size: var(--fontsize-16);
    margin-bottom:min(2.33333vw,28px);
}

.work--list{
    display: flex;
    max-width:1026px;
    justify-content: center;
    align-items: flex-end;
}

.work--item:first-child{
    width:61%;
}

.work--item:last-child{
    width:39%;
}

.work--item span{
    font-size: var(--fontsize-16);
    font-weight:500;
    border:2px solid var(--darkblue);
    border-radius: 99999px;
    padding:min(0.83333vw,10px) min(2.66666vw,32px);
    background:#fff;
    display: inline-block;
    margin-bottom:min(0.83333vw,10px);
    margin-right:min(0.66666vw,8px);
}

.image__position{
    position:relative;
}

.image__position img{
    position:absolute;
    bottom:max(-3.50000vw,-42px);
}

.ex--list{
    display: flex;
    max-width:1026px;
    margin: 0 auto;
    border:2px solid var(--darkblue);
    border-radius: min(1.3333vw,16px);
}

.ex--item{
    width:calc(100% /3);
    /* border:2px solid var(--darkblue);
    border-radius: min(1.3333vw,16px); */
    background:#fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
}

.ex--item:first-child{
    border-radius:min(1.3333vw,16px) 0 0 min(1.3333vw,16px);
    border-right:2px solid var(--darkblue);
}

.ex--item:last-child{
    border-radius:0 min(1.3333vw,16px) min(1.3333vw,16px) 0;
    border-left:2px solid var(--darkblue);
}

.ex--item .balloon__out{
    position:absolute;
    top:max(-1.66666vw,-20px);
}

.ex--item .balloon{
    font-size:var(--fontsize-16);
    font-weight:500;
    background: var(--blue);
    color:#fff;
    display: inline-block;
    padding:min(0.41666vw,5px) min(3.75vw,45px);
    border-radius: 99999px;
    
}

.ex--item .balloon::before{
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -8px;
  border: 8px solid transparent;
  border-top: 8px solid var(--blue);
}

.ex--item .ex__content{
    font-size:var(--fontsize-16);
    margin:0 min(2.5vw,30px);
}

.ex__content{
    max-width: 201px;
}

.ex--item:first-child .ex__content{
    margin-bottom: min(1.66666vw, 20px);
    margin-top: min(3.58333vw, 43px);
}

.ex--item:nth-child(2) .ex__content{
    margin-left: min(4.16666vw, 50px);
}

/*interview*/

#interview{
    padding-bottom:min(12vw,120px);
}

.interview__exp{
    text-align: center;
    margin-bottom:min(5.83333vw,70px);
}

.interview__wrap{
    max-width:1026px;
    margin:0 auto;
}

#interview1{
    margin-bottom:min(7.75vw,93px);
}

.interview__intro{
    display:flex;
    justify-content: center;
    align-items:center;
}

.interview__people{
    position:relative;
    display: inline-block;
}

.interview__num{
    font-size:var(--fontsize-96);
    font-weight:700;
    position: absolute;
    letter-spacing: 0.07em;
}

#num1{
    color:var(--orange);
    bottom:min(8.33333vw,100px);
    left:min(1vw,12px);
}

#num2{
    color:var(--blue);
    bottom:min(8.33333vw,100px);
    right:min(1vw,12px);
}

.interview__people img{
    width:min(16.66666vw,200px);
    margin-left: min(5.83333vw, 70px);
    margin-right:min(6.66666vw,80px);
}

.interview__title .interview__outline{
    font-size:var(--fontsize-20);
    font-weight:500;
    max-width:450px;
    padding-bottom:min(1.33333vw,16px);
    border-bottom:1px solid var(--darkblue);
}

.interview__title .interview__name{
    padding-top:min(1.33333vw,16px);
}

.jobdescription{
    margin-top:min(2.66666vw,32px);
    margin-bottom:min(3.33333vw,40px);
}

.interview__specific{
    display: flex;
}

.schedule__title{
    font-weight:500;
    margin-bottom:min(1vw,12px);
    text-align: center;
    margin-right:min(5vw,60px);
}

.schedule img{
    width:min(31.66666vw,380px);
    margin-right:min(5vw,60px);
}

.qa__title{
    font-weight:500;
    margin-bottom:min(1vw,12px);
    text-align: center;
}

.qa dt{
    font-weight:500;
    border-bottom:1px solid var(--darkblue);
    padding-bottom:2px;
    margin-bottom:min(1.5vw,18px);
}

.qa dd{
    font-size:var(--fontsize-14);
}

.qa dd:first-of-type{
    margin-bottom:min(4.66666vw,56px);
}

/*recruit_detail*/

#recruit_detail{
    background:var(--back);
    padding-bottom:min(12vw,120px);
}

.dl__detail{
    max-width:1026px;
    margin:0 auto;
}

.dl__detail dt{
    color:var(--blue);
    width:25%;
}

.dl__flex{
    display: flex;
    margin-bottom:min(2vw,24px);
}

.dl__detail dd{
    width:75%;
}

/*flow*/

#flow{
    padding-bottom:min(12vw,120px);
}

.flow__wrap{
    max-width:1026px;
    margin:0 auto;
}

.flow__out--list{
    display:flex;
    justify-content: center;
    margin-bottom:min(5.33333vw,64px);
}

.period__img{
    margin-right:min(5.33333vw,64px);
}

.period__img img{
    width:min(4.5vw,54px);
}

.flow__in--list{
    display:flex;
    flex-direction: column;
}

.flow__in--item{
    display: flex;
    
}

.flow__img{
    margin-bottom:min(4vw,48px);
    margin-right:min(3.33333vw,40px);
    position:relative;
}

.flow__in--item:last-child .flow__img{
    margin-bottom:0;
}

.flow__img img{
    width:min(6.66666vw,80px);
}

.flow__img::before{
    position:absolute;
    content:'';
    display: block;
    top: calc(min(6.66666vw, 80px));
    width:2px;
    height:50px;
    background:var(--blue);
    left:50%;
    right:50%;
    transform:translate(-50%);
    z-index:-1;
}

.flow__in--item:last-child .flow__img::before{
    display: none;
}

.flow__txt .flow__step{
    color:var(--blue);
    font-size:var(--fontsize-18);
    font-weight:700;
    margin-right:min(3vw,36px);
}

.flow__txt .flow__title{
    font-size:var(--fontsize-18);
    font-weight:500;
}

.flow__txt .flow__entrybtn{
    color:#fff;
    font-weight:500;
    background:var(--orange);
    border-radius: 99999px;
    padding:min(0.33333vw,4px) min(3.16666vw,38px);
    margin-top:min(1vw,12px);
    display: block;
}

.flow__txt .flow__title a{
    
}

.flow__caution{
    font-size:var(--fontsize-12);
    max-width: 694px;
    margin: 0 auto;
}

/*link__area*/

#link__area{
    background: var(--back);
    padding-bottom:min(12vw,120px);
}

.link__wrap{
    display: flex;
    justify-content: center;
}

.link__btn a{
    background:#fff;
    display: block;
    border-radius:6px;
}

.service__btn a{
    border:2px solid var(--blue);
    padding:min(2.66666vw,32px) min(6.25vw,75px);
    margin-right:min(6vw,60px);
}

.company__btn a{
    border:2px solid var(--orange);
    padding:min(2.66666vw,32px) min(7.66666vw,92px);
}

/* footer */
footer{
    background:var(--white);
    
}

.cookieCaution{
    padding:0 32px;
    padding-top:min(2.66666vw,32px);
    background:var(--white);
    display: flex;
}

.cookieCaution__in{
    max-width:1026px;
    margin:0 auto;
}

.cookieCaution__text{
    font-size:8px;
    margin-bottom:16px;
}

.cookieCaution__logo--list{
    display: flex;
    justify-content: center;
    margin-bottom:20px;
}

.cookieCaution__logo--item:first-child{
    width:39px;
    margin-right:8px;
}

.cookieCaution__logo--item:last-child{
    width:60px;
}

.cookieCaution__logo--item img{
    width:100%;
}

.copyright{
    color:#fff;
    font-size:8px;
    padding:4px 0;
    background:var(--blue);
    text-align: center;
}

/*fix__bnr*/
.fix__bnr{
    background:rgba(255, 221, 167, 0.95);
    width:100%;
    position:fixed;
    bottom:0;
    left:0;
    z-index:-1;
    opacity:0;
    transform:translateY(100%);
    transition: opacity 0.4s ease, transform 0.4s ease;
    pointer-events: none;
}

.fix__bnr.is-show {
  opacity: 1;
  transform: translateY(0);
  z-index: 999999;
  pointer-events: auto;
}

.bnr__wrap{
    max-width:1026px;
    margin:0 auto;
    padding:min(1.66666vw,20px) 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.bnr__txt{
    font-size:var(--fontsize-18);
    color:var(--orange);
    font-weight:500;
    margin-bottom:min(0.25vw,3px);
}

.bnr__btn{
    color:#fff;
    font-weight:700;
    background:var(--orange);
    border-radius: 8px;
    padding:min(1.66666vw,20px) min(8.33333vw,100px);
    font-size:var(--fontsize-20);
    display: flex;
}

.bnr__btn img{
    margin-left:min(1vw,12px);
    display: inline-block;
}

.bnr__fluffy{
    display: flex;
    align-items: center;
}

/*hover*/

.header__nav--item{
    position:relative;
}

.header__nav--item:hover{
    color:var(--blue);
    font-weight:700;
}

.is-current{
    color:var(--blue);
    font-weight:700;
    position:relative;
}

.is-current::before{
    content:"";
    display: block;
    position:absolute;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    top: -10px;
    left: 0;
    right: 0;
    margin: 0 auto;
    background: var(--blue);
}

.header__inquiry a{
    position:relative;
}

.header__inquiry a::before{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: #fca41f;
    transform-origin: 100% 50%;
    transform: scaleX(0);
    transition: transform ease .3s;
}

.header__inquiry a:hover::before{
    transform-origin: 0% 50%;
    transform: scaleX(1);
}

.flow__entrybtn:hover{
    background:#fca41f;
}

.service__btn a{
    position:relative;
    z-index:1;
}

.service__btn a::before{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: #eff4fa;
    transform-origin: 100% 50%;
    transform: scaleX(0);
    transition: transform ease .3s;
}

.service__btn a:hover::before{
    transform-origin: 0% 50%;
    transform: scaleX(1);
}

.company__btn a{
    position:relative;
    z-index:1;
}

.company__btn a::before{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: #fdf8f0;
    transform-origin: 100% 50%;
    transform: scaleX(0);
    transition: transform ease .3s;
}

.company__btn a:hover::before{
    transform-origin: 0% 50%;
    transform: scaleX(1);
}


.bnr__btn:hover{
    background:#fca41f;
}

/*completion*/

.background{
    background:var(--back);
    height:100vh;
    position:relative;
}

.entry__content{
    text-align: center;
}

.entry__txt{
    font-size:var(--fontsize-16);
    text-align: center;
    margin-bottom:min(2.33333vw,28px);
    padding-top:min(11vw,132px);
}

.return__top a{
    display: block;
    padding:min(0.83333vw,10px) min(7.08333vw,85px);
    color:#fff;
    font-size: var(--fontsize-16);
    font-weight:500;
    text-align: center;
    background:var(--orange);
    border-radius: 8px;
    margin-bottom:min(2.5vw,30px);
}

.return__top a:hover{
    background:#fca41f;
}

.entry__img{
    margin: 0 auto;
    display: block;
}

.margin-top{
    margin-top:min(6.08083vw, 72.97px);
}

.entry__footer{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}