@charset "utf-8";
/* 共通 */
.top_ttl {
    margin-bottom: 30px;
}
.top_ttl h2 {
    -webkit-background-clip: text!important;
    -webkit-text-fill-color: transparent;
    display: inline-block;
  font-size: 60px;
  line-height: 1.3;
}
.top_ttl span {
    display: block;
    font-size: 18px;
    font-weight: 500;
    padding-left: 70px;
    position: relative;
    margin-top: 5px;
}
.top_ttl span::before {
content: '';
position: absolute;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
        transform: translateY(-50%);
display: inline-block;
width: 57px;
height: 1px;
background-color: #6d6d6d;
}
/* top_mv */
.top_mv {
    overflow-x: hidden;
    padding-top: 85px;
    position: relative;
}
.top_mvInn {
    position: relative;
    max-width: 1100px;
    width: 90%;
    margin: 0 auto;
}
.top_mv h2 {
    max-width: 488px;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    z-index: 1;
}
.top_mvMovie {
    max-width: 1100px;
    width: 90%;
    margin: 0 auto;
}
.p-fv-deco figure {
    position: absolute;
}
.p-fv-deco figure:first-of-type {
    width: 295px;
    top: 13%;
    left: -5%;
}
.p-fv-deco figure:nth-of-type(2) {
    width: 131px;
    top: 2%;
    left: 20%;
}
.p-fv-deco figure:nth-of-type(3) {
    width: 393px;
    top: 1%;
    right: -16.5%;
}
.p-fv-deco figure:nth-of-type(4) {
    width: 327px;
    bottom: 5%;
    left: -6%;
}
.p-fv-deco figure:nth-of-type(5) {
    width: 436px;
    bottom: 9%;
    left: -16.5%;
}
.p-fv-deco figure:nth-of-type(6) {
    width: 454px;
    bottom: 0;
    right: 3%;
}
/* workstyle */
.workstyle {
    padding: 50px 0 70px;
}
.workstyle_inn {
   -webkit-box-orient: horizontal;
   -webkit-box-direction: reverse;
       -ms-flex-direction: row-reverse;
           flex-direction: row-reverse;
}
.workstyle_txt {
    width: 46%;
    margin-top: 60px;
    position: relative;
}
.workstyle_txt::before {
    content: '';
    display: inline-block;
    background: url(../common/img/ill_gb.png) no-repeat top center / 100% auto;
    width: 157px;
    height: 161px;
    position: absolute;
    right: 2%;
    bottom: 2%;
}
.workstyle .top_ttl h2 {
    background: -o-linear-gradient(left, #76bbc9,  #f6d05f);
    background: -webkit-gradient(linear, left top, right top, from(#76bbc9),  to(#f6d05f));
    background: linear-gradient(90deg, #76bbc9,  #f6d05f);
  }
  .workstyle_inn h3 {
    font-size: 24px;
  }
  .workstyle_inn p {
    line-height: 2.2;
    margin-top: 10px;
    position: relative;
    z-index: 1;
  }
.workstyle_inn figure {
    margin-left: calc(50% - 50vw);
    max-width: 600px;
    width: 52%;
    min-width: 47vw;
    position: relative;
}
.workstyle_inn figure::before {
    content: '';
    display: inline-block;
    background: url(../common/img/ill_yellow.png) no-repeat top center / 100% auto;
    width: 199px;
    height: 180px;
    position: absolute;
    right: -40px;
    top: 0;
}
.workstyle .more_btn {
    margin-top: 70px;
}
.workstyle .more_btn a::after {
    -webkit-filter: brightness(0) saturate(100%) invert(89%) sepia(98%) saturate(5735%) hue-rotate(160deg) brightness(83%) contrast(85%);
            filter: brightness(0) saturate(100%) invert(89%) sepia(98%) saturate(5735%) hue-rotate(160deg) brightness(83%) contrast(85%);
}
/* number */
.number {
    background: url(../img/top/number_bg.jpg) no-repeat center top / cover;
    padding: 60px 0 40px;
}
.number .top_ttl {
    margin-bottom: 45px;
}
.number .top_ttl h2 {
    background: -o-linear-gradient(left, #76bbc9,  #a2be66);
    background: -webkit-gradient(linear, left top, right top, from(#76bbc9),  to(#a2be66));
    background: linear-gradient(90deg, #76bbc9,  #a2be66);
}
.number_list ul {
    margin-bottom: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}
.number_list ul li {
   width: 24%;
   max-width: 225px;
}
.number_list ul li.number02 {
    width: 49%;
    max-width: 484px;
 }
 .number_list ul li img {
    border-radius: 30px;
    -webkit-box-shadow: 0px 0 16px 0px rgba(73, 73, 73, .08);
            box-shadow: 0px 0 16px 0px rgba(73, 73, 73, .08);
 }
 /* recruitBtn */
 .recruitBtn {
    background: url(../img/top/recruit_btnBg.jpg) no-repeat center /cover;
    max-width: 1000px;
    width: 90%;
    margin: 70px auto 0;
    border-radius: 5px;
    padding: 50px 40px 70px;
    position: relative;
 }
 .recruitBtn::after {
    content: '';
position: absolute;
left: 50%;
top: -20px;
-webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
        transform: translateX(-50%);
display: inline-block;
width: 1px;
height: 57px;
background: -o-linear-gradient(#494949, #fff);
background: -webkit-gradient(linear, left top, left bottom, from(#494949), to(#fff));
background: linear-gradient(#494949, #fff);
 }
 .recruitBtn h2 {
    text-align: center;
    color: #fff;
    font-size: 60px;
    line-height: 1;
    text-shadow: #000000 0 0 15px;
 }
 .recruitBtn span {
    display: block;
    font-size: 18px;
    font-weight: 500;
    color: #fff;
    text-align: center;
    text-shadow: #000000 0 0 15px;
 }
 .recruitBtn ul {
    margin: 30px auto 0;
 }
 .recruitBtn ul li {
    width: 47%;
 }
 .recruitBtn ul li a {
    display: block;
    position: relative;
    width: 100%;
    background-color: rgb(255, 255, 255, .8);
    -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
    border-radius: 5px;
    padding: 30px 30px 40px 20px;
 }
 .recruitBtn ul li:first-child a {
    border: 1px solid #ef858c;
 }
 .recruitBtn ul li:nth-child(2) a {
    border: 1px solid #f4a45c;
 }
 .recruitBtn ul li:first-child a::after {
    content: '';
    display: inline-block;
    background: url(../common/img/recruit_btnIll01.png) no-repeat top center / 100% auto;
    width: 154px;
    height: 153px;
    position: absolute;
    right: 20px;
    bottom: 10px;
 }
 .recruitBtn ul li:nth-child(2) a::after {
    content: '';
    display: inline-block;
    background: url(../common/img/recruit_btnIll02.png) no-repeat top center / 100% auto;
    width: 154px;
    height: 153px;
    position: absolute;
    right: 20px;
    bottom: 10px;
 }
 .recruitBtn ul li a h3 {
-webkit-background-clip: text!important;
-webkit-text-fill-color: transparent;
display: inline-block;
font-size: 40px;
text-shadow: #fff 0 0 15px;
line-height: 1.2;
 }
 .recruitBtn ul li:first-child a h3 {
    background: -o-linear-gradient(left, #da2c37,  #ef858c);
    background: -webkit-gradient(linear, left top, right top, from(#da2c37),  to(#ef858c));
    background: linear-gradient(90deg, #da2c37,  #ef858c);
 }
 .recruitBtn ul li:nth-child(2) a h3 {
    background: -o-linear-gradient(left, #e97710,  #eb9a51);
    background: -webkit-gradient(linear, left top, right top, from(#e97710),  to(#eb9a51));
    background: linear-gradient(90deg, #e97710,  #eb9a51);
 }
 .recruitBtn ul li a p {
    font-size: 18px;
    font-weight: 500;
    text-shadow: #fff 0 0 15px;
    line-height: 1;
    margin: 5px 0 70px;
 }
 .recruitBtn ul li:first-child a p {
    color: #dc5e66;
 }
 .recruitBtn ul li:nth-child(2) a p {
    color: #e97710;
 }
 .recruitBtn ul li a figure {
    width: 27px;
    margin: 0 0 0 auto;
    -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    position: relative;
 }
 .recruitBtn ul li a:hover figure {
    margin-right: -4px;
 }
 .recruitBtn ul li:first-child a figure img {
    -webkit-filter: brightness(0) saturate(100%) invert(54%) sepia(54%) saturate(2176%) hue-rotate(316deg) brightness(88%) contrast(96%);
            filter: brightness(0) saturate(100%) invert(54%) sepia(54%) saturate(2176%) hue-rotate(316deg) brightness(88%) contrast(96%);
 }
 .recruitBtn ul li:nth-child(2) a figure img {
    -webkit-filter: brightness(0) saturate(100%) invert(50%) sepia(13%) saturate(6588%) hue-rotate(2deg) brightness(99%) contrast(88%);
            filter: brightness(0) saturate(100%) invert(50%) sepia(13%) saturate(6588%) hue-rotate(2deg) brightness(99%) contrast(88%);
 }
 .recruitBtn ul li a figure::after {
    content: '';
    position: absolute;
    right: -13px;
    top: 80%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    display: inline-block;
    width: 48px;
    height: 48px;
    border: 1px solid #494949;
    border-radius: 50px;
 }
 /* award */
 .award {
    background: url(../img/about/dev_bg.jpg) no-repeat top /cover;
    padding: 30px 0 50px;
    margin: 60px auto 0;
 }
 .award .top_ttl {
    text-align: center;
    position: relative;
 }
 .award .top_ttl h2 {
    background: linear-gradient(90deg, #a2be66,  #f6d05f);
 }
 .award .top_ttl span {
    padding: 0;
 }
 .award .top_ttl span::before {
    content: none;
}
.award .top_ttl::before {
    content: '';
    position: absolute;
    left: 50%;
    top: -20%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    display: inline-block;
    height: 57px;
    width: 1px;
    background-color: #6d6d6d;
}
.award p {
    text-align: center;
    margin: 0 auto 30px;
}
.award li {
    width: 31%;
}
.award li img {
    border-radius: 5px;
}
.award_youtube {
    max-width: 700px;
    margin: 50px auto 0;
}
.award_youtube iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16/9; 
}
/* instagram */
.instagram {
    padding: 60px 0;
}
.instagram_ttlCont {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
}
.instagram .top_ttl {
    margin-bottom: 0;
}
.instagram .top_ttl h2 {
    background: -o-linear-gradient(left, #f0a0a5,  #f6d05f);
    background: -webkit-gradient(linear, left top, right top, from(#f0a0a5),  to(#f6d05f));
    background: linear-gradient(90deg, #f0a0a5,  #f6d05f);
}
.instagram_cont {
    margin: 50px auto 0;
}
.instagram_cont li img { border-radius: 5px !important; }
/* about */
.about {
    padding-bottom: 70px;
}
.about_txt {
    width: 46%;
    margin-top: 60px;
    position: relative;
}
.about_txt::before {
    content: '';
    display: inline-block;
    background: url(../common/img/ill_yo.png) no-repeat top center / 100% auto;
    width: 176px;
    height: 202px;
    position: absolute;
    right: 0;
    bottom: 2%;
}
.about .top_ttl h2 {
    background: -o-linear-gradient(left, #76bbc9,  #a2be66);
    background: -webkit-gradient(linear, left top, right top, from(#76bbc9),  to(#a2be66));
    background: linear-gradient(90deg, #76bbc9,  #a2be66);
  }
  .about_inn p {
    line-height: 2.2;
  }
.about_inn figure {
    margin-right: calc(50% - 50vw);
    max-width: 600px;
    width: 52%;
    min-width: 47vw;
    position: relative;
}
.about_inn figure::before {
    content: '';
    display: inline-block;
    background: url(../common/img/ill_pink.png) no-repeat top center / 100% auto;
    width: 118px;
    height: 103px;
    position: absolute;
    left: -20px;
    top: 20px;
}
.about .more_btn {
    margin-top: 70px;
}
.about .more_btn a::after {
    -webkit-filter: brightness(0) saturate(100%) invert(89%) sepia(98%) saturate(5735%) hue-rotate(160deg) brightness(83%) contrast(85%);
            filter: brightness(0) saturate(100%) invert(89%) sepia(98%) saturate(5735%) hue-rotate(160deg) brightness(83%) contrast(85%);
}
/* top_line */
.top_line img {
    width: 100vw;
}
/* message */
.message {
    padding-top: 35px;
    text-align: center;
    position: relative;
}
.message::before {
    content: '';
    display: inline-block;
    background: url(../img/top/message_ill01.png) no-repeat top center / 100% auto;
    width: 231px;
    height: 133px;
    position: absolute;
    left: 0;
    top: 60px;
}
.message::after {
    content: '';
    display: inline-block;
    background: url(../img/top/message_ill02.png) no-repeat top center / 100% auto;
    width: 298px;
    height: 180px;
    position: absolute;
    right: 0;
    bottom: -8%;
}
.message h2 {
    -webkit-background-clip: text!important;
    -webkit-text-fill-color: transparent;
    display: inline-block;
  font-size: 60px;
  line-height: 1.3;
  background: -o-linear-gradient(left, #328ac2,  #59bcd0);
  background: -webkit-gradient(linear, left top, right top, from(#328ac2),  to(#59bcd0));
  background: linear-gradient(90deg, #328ac2,  #59bcd0);
  position: relative;
  padding-top: 60px;
}
.message h2::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    display: inline-block;
    width: 1px;
    height: 57px;
    background-color: #6d6d6d;
    }
.message span {
    display: block;
    font-size: 18px;
    font-weight: 500;
    margin-top: 5px;
}
.message p {
    text-align: left;
    line-height: 2.2;
    margin: 20px auto 0;
    position: relative;
    z-index: 1;
}
@media only screen and (max-width: 1024px) {
    .p-fv-deco figure:first-of-type {
        width: 230px;
        left: 4%;
    }
    .p-fv-deco figure:nth-of-type(2) {
        width: 110px;
        left: 25%;
    }
    .p-fv-deco figure:nth-of-type(3) {
        width: 260px;
        right: -10%;
    }
    .p-fv-deco figure:nth-of-type(4) {
        width: 250px;
        left: -3%;
    }
    .p-fv-deco figure:nth-of-type(5) {
        width: 260px;
        left: -7%;
    }
    .p-fv-deco figure:nth-of-type(6) {
        width: 330px;
        right: -2%;
    }
}
@media only screen and (max-width: 768px) {
    /* 共通 */
.top_ttl {
    margin-bottom: 20px;
}
.top_ttl h2 {
  font-size: 40px;
}
.top_ttl span {
    font-size: 16px;
    padding-left: 50px;
}
.top_ttl span::before {
width: 40px;
}
/* top_mv */
.top_mv {
    padding-top: 70px;
    overflow-x: hidden;
}
.top_mv h2 {
    width: 55vw;
    left: 0;
}
.top_mvMovie {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
}
.p-fv-deco figure:first-of-type {
    width: 180px;
}
.p-fv-deco figure:nth-of-type(2) {
    width: 100px;
}
.p-fv-deco figure:nth-of-type(3) {
    width: 180px;
}
.p-fv-deco figure:nth-of-type(4) {
    width: 200px;
}
.p-fv-deco figure:nth-of-type(5) {
    width: 220px;
}
.p-fv-deco figure:nth-of-type(6) {
    width: 200px;
}
/* workstyle */
.workstyle {
    padding: 30px 0 40px;
}
.workstyle_txt {
    width: 100%;
    margin-top: 0;
}
.workstyle_txt::before {
    width: 110px;
        height: 111px;
        right: 0;
        bottom: unset;
        top: 5%;
        opacity: .8;
}
  .workstyle_inn h3 {
    font-size: 18px;
  }
  .workstyle_inn p {
    margin-top: 5px;
  }
.workstyle_inn figure {
    max-width: 600px;
    width: 90%;
    margin-top: 40px;
    min-width: unset;
}
.workstyle_inn figure::before {
    width: 120px;
    height: 110px;
}
.workstyle .more_btn {
    margin: 30px 0 0 auto;
}
/* number */
.number {
    padding: 40px 0 30px;
}
.number .top_ttl {
    margin-bottom: 30px;
}
.number_list ul {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin:0 auto 10px;
    max-width: 480px;
}
.number_list ul li {
   width: 48%;
}
.number_list ul li.number02 {
    width: 100%;
 }
 .number_list ul:first-of-type li.number02, .number_list ul:nth-of-type(3) li.number02, .number_list ul:nth-of-type(4) li.number02 {
    margin-top: 10px;
 }
 .number_list ul:nth-of-type(2) li.number02 {
    margin-bottom: 10px;
 }
  /* recruitBtn */
  .recruitBtn {
    margin: 50px auto 0;
    padding: 30px 5% 50px;
 }
 .recruitBtn::after {
top: -20px;
height: 40px;
 }
 .recruitBtn h2 {
    font-size: 40px;
 }
 .recruitBtn span {
    font-size: 16px;
 }
 .recruitBtn ul {
    margin: 20px auto 0;
    max-width: 400px;
 }
 .recruitBtn ul li {
    width: 100%;
 }
 .recruitBtn ul li:first-child {
    margin-bottom: 20px;
 }
 .recruitBtn ul li a {
    padding: 15px 20px 30px 10px;
 }
 .recruitBtn ul li:first-child a::after {
    width: 114px;
    height: 113px;
    bottom: 5px;
 }
 .recruitBtn ul li:nth-child(2) a::after {
    width: 114px;
    height: 113px;
    bottom: 5px;
 }
 .recruitBtn ul li a h3 {
font-size: 28px;
letter-spacing: 0;
position: relative;
z-index: 1;
 }
 .recruitBtn ul li a p {
    font-size: 16px;
    margin: 5px 0 40px;
 }
 .recruitBtn ul li a figure {
    width: 22px;
 }
 .recruitBtn ul li a figure::after {
    right: -10px;
    width: 40px;
    height: 40px;
 }
  /* award */
  .award {
    padding: 20px 0 40px;
    margin: 40px auto 0;
 }
.award .top_ttl::before {
    top: -15%;
    height: 40px;
}
.award p {
    margin: 0 auto 20px;
}
.award li {
    width: 100%;
    margin: 0 auto 20px;
    max-width: 400px;
}
.award_youtube {
    max-width: 400px;
    margin: 40px auto 0;
}
 /* instagram */
.instagram {
    padding: 40px 0;
}
.instagram .more_btn {
    margin: 20px  0 0 auto;
}
/* about */
.about {
    padding-bottom: 40px;
    overflow-x: hidden;
}
.about_txt {
    width: 100%;
    margin-top: 0;
}
.about_txt::before {
    width: 126px;
    height: 132px;
    bottom: unset;
    top: 5%;
    opacity: .8;
}
.about_inn p {
    position: relative;
    z-index: 1;
}
.about_inn figure {
    width: 100%;
        margin-top: 40px;
        min-width: 95vw;
        max-width: 100%;
}
.about_inn figure::before {
    width: 100px;
    height: 80px;
    top: 10px;
}
.about .more_btn {
    margin: 30px 0 0 auto;
}
/* message */
.message {
    padding-top: 20px;
}
.message::before {
    width: 180px;
        height: 107px;
        top: 30px;
}
.message::after {
    width: 200px;
    height: 117px;
    bottom: -3%;
}
.message h2 {
  font-size: 40px;
  padding-top: 35px;
  position: relative;
  z-index: 1;
}
.message h2::before {
    height: 40px;
    }
.message span {
    font-size: 16px;
    position: relative;
  z-index: 1;
}
}
@media only screen and (max-width: 500px) {
    .p-fv-deco figure:first-of-type {
        width: 120px;
    }
    .p-fv-deco figure:nth-of-type(2) {
        width: 60px;
    }
    .p-fv-deco figure:nth-of-type(3) {
        width: 110px;
    }
    .p-fv-deco figure:nth-of-type(4) {
        width: 100px;
    }
    .p-fv-deco figure:nth-of-type(5) {
        width: 120px;
    }
    .p-fv-deco figure:nth-of-type(6) {
        width: 130px;
    }
}