@charset "UTF-8";

/* CSS Document */
.over-width {
  display: none;
}

.sp-image,
.sp-image2 {
  display: none;
}

.pc-none {
  display: none;
}

.footer-fix {
  display: none;
}

@media screen and (max-width: 767px) {

  /*html {
  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif"
}*/
  body {
    max-width: 100%;
    min-width: inherit;
    position: relative;
    font-size: 15px;
  }

  /*a {
  color: inherit;
  text-decoration: inherit;
}
img{
  max-width: 100%;
  height: auto;
}*/
  .pc-none {
    display: block;
  }

  .sp-none {
    display: none;
  }

  .minchou {
    font-family: 'Noto Serif JP', serif;
    font-weight: 300;
    font-size: 35px;
    text-align: inherit;
  }

  .minchou2 {
    font-family: 'Noto Serif JP', serif;
    font-weight: 300;
    font-size: 25px;
    letter-spacing: 15px;
  }

  .minchou4 {
    font-family: 'Noto Serif JP', serif;
    font-weight: 300;
    font-size: 20px;
    letter-spacing: 15px;
  }

  .inner {
    max-width: 767px;
    width: 100%;
    padding: 0 20px;
    margin: 0 auto;
  }

  nav {
    background: rgba(0, 0, 0, .35);
    padding: 26px 0 18px 0;
    width: 100%;
    z-index: 200;
  }

  .pc-nav {
    display: none;
  }

  .fix-top {
    position: fixed;
    z-index: 1;
    min-width: 1366px;
    display: none;
  }

  .fix-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .top-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .top-logo {
    width: 40%;
  }

  .nav-list {
    color: #fff;
    text-align: center;
    list-style: none;
    flex-grow: 2;
    font-size: 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .fv-title {
    transform: scale(.7);
  }

  .mv {
    background: url("../img/MV@2x.jpg") no-repeat right;
    background-size: cover;
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 100;
    margin-bottom: 50px;
  }

  .in-mv {
    display: flex;
    justify-content: center;
    max-width: 300px;
    margin: inherit;
    position: relative;
  }

  .in-mv h2 {
    width: 290px;
    margin-bottom: 30px;
    margin-right: -40px;
    font-family: 'Noto Serif JP', serif;
    font-weight: 400;
    font-size: 48px;
    line-height: 1.2;
    color: #fff;
    /*background: url("../img/Okada spirits.png") center no-repeat;
  background-size: 113px;
  background-position: 90% 50% ;*/
  }

  .top-mv {
    background: #000;
    padding-top: 87px;
    display: block;
  }

  .top-mv .movie {
    height: calc(100vh - 191px);
  }

  .top-mv .movie::after {
    height: calc(100vh - 191px);
  }

  .top-mv .movie video {
    height: calc(100vh - 191px);
  }

  .top-mv .in-mv {
    margin: inherit;
    display: block;
    max-width: 100%;
  }

  .in-mv .eng.sp {
    display: block;
  }

  .in-mv .eng.pc {
    display: none;
  }

  .in-mv h2 {
    font-size: 33px;
    line-height: calc(43 / 33);
    margin-top: 0;
  }

  .in-mv .fade {
    position: absolute;
    width: 113px;
    height: 35px;
    background: url("../img/Okada spirits.png") center no-repeat;
    background-size: 123px;
    top: 25%;
    left: 67%;
  }

  .in-mv .dec {
    background: url("../img/top-sp-dec.png") center no-repeat;
    background-size: cover;
    height: 20px;
    line-height: 20px;
    font-size: 9px;
    color: #920844;
    padding-left: 5px;
    width: 220px;
  }

  .t-caret {
    color: #707070;
  }

  .t-caret {
    font-size: 0;
  }

  .t-caret:before {
    font-size: 9px;
    content: "｜";
  }

  .about {
    margin-bottom: 90px;
    position: relative;
  }

  .about h2 {
    margin-bottom: calc(70% + 60px);
  }

  .about .flex-box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
  }

  .about .flex-box .image-box {
    width: 100vw;
    margin-left: inherit;
    position: relative;
    height: 0;
    padding-bottom: 60%;
    display: none;
  }

  .over-width {
    display: block;
    position: absolute;
    top: 15%;
    margin-left: -15%;
    padding-right: 35px;
    overflow-x: hidden;
  }

  .about .flex-box p {
    width: 100%;
    font-size: 15px;
  }

  .recuruit {
    margin-bottom: 40px;
  }

  .recuruit .flex-box {
    display: flex;
    flex-wrap: wrap;
  }

  .recuruit .flex-1 {
    /*width: 50%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 180px 40px 180px 0;*/
    width: 100%;
    background-size: 100% auto;
    padding-bottom: 76%;
  }

  .recuruit .flex-1 .in-flex {
    position: absolute;
    display: flex;
    justify-content: center;
    width: 100%;
    align-items: baseline;
    top: 45%;
  }

  .recuruit .flex-1 .in-flex .arow {
    width: 30px;
  }

  .recuruit .flex-1 .in-flex h3 {
    letter-spacing: 5px;
    font-size: 30px;
  }

  .recuruit .flex-1 .in-flex .fade {
    background: url("../img/recruit-font.png") 0 0 no-repeat;
    position: absolute;
    background-size: contain;
    width: 170px;
    height: 100px;
    top: -130%;
    left: 52%;
  }

  .recuruit .flex-2 {
    width: 100%;
    padding-bottom: 76%;
    background: url("../img/recruit-bg02N.jpg") 0 0 no-repeat;
    background-size: 100% auto;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    position: relative;
  }

  .recuruit .btn-wrap {
    position: absolute;
    top: 45%;
    width: 50%;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    font-size: 11px;
  }

  /*.recuruit .recruit-btn{
  background: url("../img/btn-bg.png") center center no-repeat;
  padding: 5px 7px 7px 5px;
  width: 50%;
  display: flex;
  justify-content: center;
  min-width: 135px;
  max-width: 175px;
}
.recuruit .recruit-btn a {
  text-align: center;
  background: #fff;
  width: 100%;
  padding: 3px;
  box-shadow: 2px 2px 0px #000;
}
.recuruit .recruit-btn a:hover{
  position: relative;
  top: 1px;
  left: 1px;
  box-shadow: none;
  opacity: .7;
}
.recuruit p {
  width: 100%;
  text-align: center;
}
*/
  .sp-image,
  .sp-image2 {
    display: block;
  }

  .business-title {
    background: url("../img/bg-business-title@2x.png") repeat;
    background-size: 1400px;
    padding: 0px 0 20px 0;
  }

  .business-title h2 .bg-font {
    background: url("../img/BUSINESS.png") center no-repeat;
    background-size: 80px;
    background-position: 60% 0;
    padding-top: 30px;
  }

  .business-title h2 {
    margin: 0 auto;
  }

  .business-title h2 img {
    display: none;
  }

  .business h3 {
    margin-bottom: 15px;
  }

  .doboku {
    background: #fff;
    background-size: cover;
    height: auto;
    position: relative;
  }

  .doboku .sp-image {
    background: url("../img/top_doboku_sp.jpg") center no-repeat;
    background-size: cover;
    background-attachment: inherit;
    height: 0;
    position: relative;
    padding-bottom: 243px;
  }

  .doboku .sp-layout {
    background: url("../img/space01@2x.png") repeat;
    background-size: 1400px 100%;
    padding: 0 20px 20px 20px;
  }

  .doboku .card {
    width: calc(100%);
    background-color: #fff;
    padding: 20px 20px;
    box-shadow: 5px 5px 0px #236791;
    position: relative;
    left: 0;
    margin-top: -35px;
  }

  .doboku .bg img {
    display: none;
  }

  .doboku .sp-flex {
    display: flex;
    justify-content: space-between;
  }

  .doboku .sp-flex h3 {
    width: 80%;
  }

  .doboku .sp-image2 {
    width: 50%;
    margin-top: -15%;
  }

  .doboku .card span {
    color: #920844;
  }

  .doboku .card p {
    line-height: 2.2;
    background-position: 100%;
  }

  .space1 {
    display: none;
  }

  .space2 {
    display: none;
  }

  .ict {
    background: #fff;
    background-size: cover;
    height: auto;
    position: relative;
  }

  .ict .sp-image {
    background: url("../img/top_ict_sp.jpg") center no-repeat;
    background-size: cover;
    background-attachment: inherit;
    height: 0;
    position: relative;
    padding-bottom: 243px;
  }

  .ict .sp-layout {
    background: url("../img/space02@2x.png") repeat;
    background-size: 1400px 100%;
    padding: 0 20px 20px 20px;
  }

  .ict .card {
    width: calc(100%);
    background-color: #fff;
    padding: 20px 20px;
    box-shadow: 5px 5px 0px #AD3C73;
    position: relative;
    left: 0;
    margin-top: -35px;
  }

  .ict .bg img {
    display: none;
  }

  .ict .sp-flex {
    display: flex;
    justify-content: space-between;
  }

  .ict .sp-flex h3 {
    width: 80%;
  }

  .ict .sp-image2 {
    width: 50%;
    margin-top: -8%;
  }

  .ict .card span {
    color: #920844;
  }

  .ict .card p {
    line-height: 2.2;
    background-position: 100%;
  }

  .business .btn-wrap {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin: 30px 0 40px 0;
  }

  .business .btn-wrap .corn {
    width: 100%;
    text-align: center;
  }

  /*.business .business-btn{
  background: url("../img/btn-bg.png") center center no-repeat;
  padding: 5px 7px 7px 5px;
  width: 100%;
  display: flex;
  justify-content: center;
  min-width: 135px;
  max-width: 190px;
}
.business .business-btn a {
  text-align: center;
  background: #fff;
  width: 100%;
  padding: 3px;
  box-shadow: 2px 2px 0px #000;
}
.business .btn-wrap p{
  width: 100%;
}
.business .business-btn a:hover{
  position: relative;
  top: 1px;
  left: 1px;
  box-shadow: none;
}*/
  /*.bnrs{
  position: relative;
  z-index: 2;
  color: #fff;
}*/

  .top-sdgs .bnr-wrap {
    padding: 35px 0;
  }

  .top-sdgs .bnr-wrap .bnr {
    max-width: 300px;
  }

  .bnrs .big-bnr .text-wrap {
    padding-top: 50px;
  }

  .bnrs .text-wrap {
    padding-top: 30px;
  }

  .bnrs .big-bnr .text-wrap .chara-img {
    position: absolute;
    top: 60%;
    left: 95%;
    width: 58px;
  }

  .bnrs .big-bnr {
    background: url("../img/big-bnr@2x.jpg") no-repeat center bottom;
    background-size: cover;
    height: 232px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
  }

  .big-bnr .bg-font {
    background: url("../img/coprofile.png") center no-repeat;
    background-size: 108px;
    background-position: 75% -10px;
    padding: 30px 10px 0 10px;
    text-align: center;
    margin-top: 0px;
  }

  .big-bnr .minchou {
    color: #fff;
    letter-spacing: 10px;
    padding-left: 10px;
    font-size: 30px;
  }

  .big-bnr .dec {
    background: url("../img/dec.png") no-repeat;
    background-size: cover;
    font-size: 10px;
    color: #920844;
    padding-left: 5px;
    width: 150px;
    margin: 15px auto;
  }

  .big-bnr .more {
    text-align: center;
    font-size: 9px;
  }

  .mid-bnr {
    display: flex;
  }

  .mid-bnr .minchou2 {
    font-size: 20px;
    letter-spacing: 5px;
  }

  .sekou-bnr {
    background: url("../img/sekou-bnr@2x.jpg") no-repeat center bottom;
    background-size: cover;
    width: 50%;
    height: 110px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .sekou-bnr .bg-font {
    background: url("../img/works.png") center no-repeat;
    background-size: 40px;
    background-position: 55% -5px;
    padding: 10px 0px 0 10px;
    text-align: center;
    margin: -5px 0 25px 0;
  }

  /*.sekou-bnr .sub-title {
  position: absolute;
  top: 65%;
  color: #fff;
}*/
  .sekou-bnr .more {
    text-align: center;
    font-size: 9px;
    margin-left: 7px;
    letter-spacing: -.3px;
  }

  .kanren-bnr {
    background: url("../img/kanren-bnr@2x.jpg") no-repeat center bottom;
    background-size: cover;
    width: 50%;
    height: 110px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .kanren-bnr .bg-font {
    background: url("../img/Affiliated.png") center no-repeat;
    background-size: 56px;
    background-position: 90% -5px;
    padding: 15px 0px 0 10px;
    text-align: center;
    margin: -10px 0 0px 0;
  }

  /*.kanren-bnr .sub-title {
  position: absolute;
  top: 65%;
  color: #fff;
}*/
  .kanren-bnr .more {
    text-align: center;
    font-size: 9px;
    margin-left: 7px;
    letter-spacing: -.3px;
  }

  .kanren-bnr .sub-title p {
    font-size: 10px;
    text-align: center;
    margin-bottom: 10px;
    margin-left: 5px;
  }

  /*.bnrs a:hover{
  
}
.white-space{
  position: relative;
  height: 115px;
  background: #fff;
  z-index: 2;
}
  .cover{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: ;
  position: absolute;
  height: 100%;
}
.cover:hover{
  background: rgba(255,255,255,0.25);
}*/
  footer {
    background: #5F9652;
    color: #fff;
    position: relative;
    z-index: 2;
  }

  footer .contact-wrap {
    display: none;
  }

  footer .footer-text {
    padding: 45px 0 35px 0;
  }

  footer .footer-text .text-tel {
    margin: 15px 0;
  }

  footer .adress {
    line-height: 2.5;
  }

  footer .adress-name {
    font-weight: bold;
  }

  footer .copy {
    font-size: 9px;
    padding: 10px;
  }

  .footer-fix {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    color: #fff;
    position: fixed;
    bottom: 0;
    text-align: center;
    margin: 0 auto;
    background: rgba(0, 0, 0, .65);
    padding: 10px 0 10px 0;
    letter-spacing: 1px;
    font-weight: 200;
    z-index: 10
  }

  .footer-fix .tel-icon {
    width: 50%;
    border-right: solid 1px;
  }

  .footer-fix .contact-icon {
    width: 50%;
  }

  .footer-fix img {
    width: 30px;
  }

  #loader p {
    color: #920844;
    font-family: 'Noto Serif JP', serif;
    font-weight: 400;
    font-size: 30px;
  }

  #loader .t-caret {
    font-size: 0;
  }

  #loader .t-caret:before {
    font-size: 30px;
    content: "｜";
  }

  #loader p img {
    display: inline-block;
  }

  /*recruito*/
  #recruit .mv {
    background: url("../img/mv-recruit.jpg") no-repeat left;
    background-size: cover;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 100;
    margin-bottom: 52px;
  }

  #recruit .in-mv {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 15%;
    margin-bottom: 60px;
    position: relative;
  }

  #recruit .in-mv h2 {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    width: 100%;
    white-space: nowrap;
    margin-bottom: 0px;
    font-family: 'Noto Serif JP', serif;
    font-weight: 400;
    font-size: 48px;
    line-height: 1.2;
    position: relative;
    left: -35%;
    ;
    /*background: url("../img/Okada spirits.png") center no-repeat;*/
  }

  #recruit .in-mv .fade {
    position: absolute;
    width: 140px;
    height: 72px;
    background: url("../img/font-recruit.png") center no-repeat;
    background-size: contain;
    top: 36%;
    left: 43%;
  }

  #recruit .in-mv .dec {
    background: url("../img/top-sp-dec.png") center no-repeat;
    background-size: cover;
    font-size: 9px;
    color: #920844;
    padding-left: 5px;
    width: 291px;
  }

  .t-caret {
    color: #707070;
  }

  .t-caret {
    font-size: 0;
  }

  .t-caret:before {
    font-size: 9px;
    content: "｜";
  }

  .recruit01 {
    margin-bottom: 60px;
  }

  .recruit01 h2 {
    text-align: left;
    width: 280px;
    margin: 0 auto 30px auto;
  }

  .recruit01 .flex-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
  }

  .recruit01 .flex-box .image-box {
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 0;
    position: relative;
  }

  .recruit01 .flex-box .image-box .fade {
    position: absolute;
    width: 157px;
    height: 76px;
    background: url("../img/Message.png") center no-repeat;
    background-size: 157px;
    top: 20%;
    left: 45%;
  }

  .recruit01 .flex-box .image-box .chara {
    width: 113px;
  }

  .recruit01 .flex-box .image-box p {
    width: 120px;
    font-size: 10px;
    text-align: center;
    padding-bottom: 10px;
    line-height: 1.5;
    margin-right: 50px;
    flex-shrink: 2;
  }

  .recruit01 .flex-box .image-box p span {
    font-size: 25px;
  }

  .recruit01 .flex-box .text-1 {
    width: 100%;
    line-height: 2.5;
  }

  .recruit02 {
    background: #EBEBD9;
    padding-bottom: 0px;
    position: relative;
    margin-bottom: 0px;
  }

  .recruit02 .business-title {
    background: none;
    padding: 50px 0 40px 0;
    position: relative;
    text-align: center;
  }

  .recruit02 .business-title .fade {
    position: absolute;
    width: 73px;
    height: 55px;
    background: url("../img/about-rec.png") center no-repeat;
    background-size: contain;
    top: 20%;
    left: 43%;
  }

  .recruit02-dl:nth-of-type(2n) {
    background: #E3E3CB;
  }

  .recruit02-dl dl {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    margin: 0 auto;
    padding: 20px 20px;
    line-height: 2.5;
  }

  .recruit02-dl dt {
    min-width: 193px;
    margin-right: 22px;
    color: #249024;
  }

  .recruit02 .sp-line {
    margin-top: 60px;
    background: url("../img/sp-line.png") center no-repeat;
    background-size: cover;
    height: 6px;
  }

  .recruit02 .inner {
    position: static;
    padding: 0;
    background: #fff;
  }

  .sien {
    width: 100%;
    margin: 0 auto;
    background: #fff;
    background-size: cover;
    padding: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    top: 0;
    left: 0;
    position: static;
    height: 100%;
  }

  .sien h2,
  h4 {
    color: #920844;
  }

  .sien h2 {
    font-size: 35px;
    margin-bottom: 30px;
  }

  .sien .d-f {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    line-height: 2.5;
  }

  .sien .dis {
    font-weight: normal;
    width: 100%;
  }

  .sien .flex {
    width: 100%;
  }

  .recruit03 {
    padding: 0px 0;
  }

  .recruit03 h2 {
    font-size: 20px;
    text-align: center;
    padding-top: 60px;
    background: url("../img/bg-support.png") center no-repeat;
    background-size: contain;
    width: 100%;
  }

  .recruit03 .inner .img-box {
    margin-bottom: -7px;
    text-align: right;
  }

  .recruit04 {
    background: url("../img/give.jpg") center no-repeat;
    background-position: 35% 0;
    ;
    background-size: cover;
    padding: 48px 0px;
  }

  .recruit04 .d-f {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .recruit04 .d-f .flex1 {
    width: 100%;
    color: #fff;
  }

  .recruit04 .d-f .flex1 h2 {
    margin-bottom: 33px;
    letter-spacing: 15px;
    text-align: center;
  }

  .recruit04 .d-f .flex1 p {
    line-height: 2.5;
  }

  .recruit04 .d-f .flex2 {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .recruit04 .d-f .flex2 p {
    font-size: 25px;
    width: 100%;
    text-align: center;
    background: url("../img/arrow.png") center no-repeat;
    background-color: #fff;
    background-size: 42px;
    background-position: 20%;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 0;
    padding-left: 10%;
    margin-bottom: 30px;
  }

  .recruit05-title {
    position: relative;
    padding: 80px 0 30px 0;
  }

  .recruit05-title h2 {
    letter-spacing: 15px;
    text-align: center;
  }

  .recruit05-title .fade {
    position: absolute;
    background: url("../img/Interview.png") center no-repeat;
    background-size: contain;
    width: 170px;
    height: 100px;
    top: 10%;
    left: 26%;
  }

  .recruit05-1,
  .recruit05-2,
  .recruit05-3 {
    padding: 30px 0 20px 0;
    position: relative;
  }

  .recruit05 .d-f {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    color: #fff;
  }

  .recruit05 .d-f .flex1 {
    width: 100%;
    height: 417px;
  }

  .recruit05 .flex1 .minchou2 {
    letter-spacing: 5px;
    margin-bottom: 22px;
    line-height: 1.7;
  }

  .recruit05 .flex2 .minchou2 {
    letter-spacing: 5px;
  }

  .recruit05 .dec {
    margin-bottom: 200px;
    background: url("../img/top-sp-dec.png") no-repeat;
    background-size: contain;
    width: 212px;
    font-size: 9px;
    color: #920844;
    padding-top: 2px;
    padding-left: 5px;
    height: 26px;
    margin-left: 5px;
  }

  .recruit05 .dec .type {
    margin-top: 0;
  }

  .recruit05 .name {
    display: flex;
    justify-content: center;
    width: 100%;
    font-weight: bold;
    position: relative;
    font-size: 10px;
  }

  .recruit05 .d-f .flex2 {
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
  }

  .recruit05 .d-f2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    color: #fff;
  }

  .recruit05 .d-f2 .name {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-left: 40px;
  }

  .d-f2 {
    width: 100%;
  }

  .recruit05 .d-f2 .flex1 {
    width: 100%;
  }

  .recruit05 .d-f2 .flex2 {
    order: 1;
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
  }

  .recruit05-1 {
    background: url("../img/bg-interview01N.jpg") center no-repeat;
    background-size: cover;
    position: relative;
  }

  .recruit05-1 .fade {
    position: absolute;
    top: -300%;
    left: 0;
    background: url("../img/r-y.png") center no-repeat;
    background-size: contain;
    width: 100%;
    height: 174px;
  }

  .recruit05-2 {
    background: url("../img/bg-interview02N.jpg") left no-repeat;
    background-size: cover;
    background-position: 10%;
    position: relative;
  }

  .recruit05-2 .fade {
    position: absolute;
    top: -270%;
    left: 0%;
    background: url("../img/a-k.png") center no-repeat;
    background-size: contain;
    width: 100%;
    height: 167px;
  }

  .recruit05-3 {
    background: url("../img/bg-interview03N.jpg") right no-repeat;
    background-position: 60%;
    background-size: cover;
    position: relative;
  }

  .recruit05-3 .fade {
    position: absolute;
    top: -300%;
    left: 0%;
    background: url("../img/a-n.png") center no-repeat;
    background-size: contain;
    width: 100%;
    height: 170px;
  }

  .int-cover {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    position: absolute;
    height: 100%;
    top: 0;
  }

  .int-cover:hover {
    background: rgba(255, 255, 255, .5);
  }

  .recruit06 {
    padding: 80px 0 40px 0;
  }

  .recruit06-title {
    padding: 56px 0;
    position: relative;
  }

  .recruit06-title h2 {
    letter-spacing: 15px;
    text-align: center;
  }

  .recruit06-title .fade {
    position: absolute;
    top: 0%;
    left: 42%;
    background: url("../img/Ourbusiness.png") center no-repeat;
    background-size: contain;
    width: 168px;
    height: 95px;
  }

  .recruit06 .text-1 {
    font-weight: normal;
    line-height: 2.5;
    margin-bottom: 65px;
  }

  .recruit06 .d-f {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .recruit06 .flex1 {
    width: 100%;
    margin-bottom: 28px;
  }

  .recruit06 .flex1 h3 {
    margin-bottom: 28px;
    text-align: center;
  }

  .recruit06 .flex1 h5 {
    text-align: center;
    font-size: 16px;
    margin: 28px 0;
  }

  .recruit06 .flex1 p {
    line-height: 2.5;
  }

  .recruit07 {
    padding: 60px 0 60px 0;
    background-color: #EBEBD9;
    margin-bottom: 60px;
  }

  .recruit07 h2 {
    text-align: center;
    margin-bottom: 50px;
    letter-spacing: 15px;
  }

  .recruit07 .d-f {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .recruit07 .flex1 {
    width: 100%;
    margin-bottom: 40px
  }

  .recruit07 .flex1 h5 {
    text-align: center;
  }

  .recruit07 .flex1 p {
    line-height: 2.5;
    text-align: justify;
    margin-bottom: 0px;
  }

  .recruit07 .flex2 {
    width: 100%;
  }

  .recruit07 .flex2 dl {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 60px;
  }

  .recruit07 .flex2 dt {
    width: 100%;
    margin-bottom: 20px;
  }

  .recruit07 .flex2 dd {
    width: 100%;
  }

  .recruit07 h5 {
    font-size: 16px;
    margin-bottom: 25px;
  }

  /*モーダル*/
  .modal-fix {
    display: none;
  }

  .modal-fix2 {
    display: none;
  }

  .modal-fix3 {
    display: none;
  }

  .modal-title {
    z-index: 2;
  }

  .modal-title .inner {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 70px;
  }

  .modal-title h2 {
    width: 50%;
    text-align: center;
    margin: 0 auto;
  }

  .modal-title .modal_close a {
    position: fixed;
    z-index: 10000;
    color: #fff;
    font-weight: bold;
    background: url("../img/close-btn.png") center no-repeat;
    background-size: 35px;
    height: 50px;
    line-height: 50px;
    background-position: 100%;
    padding-right: 50px;
    cursor: pointer;
  }

  #modaal-close {
    z-index: 3;
    display: none;
  }

  .modal-d-f {
    position: relative;
    z-index: 0;
    background: #fff;
    align-items: flex-start;
    margin-top: 70px;
  }

  .modal-d-f .flex {
    position: relative;
  }

  .modal-d-f .pc-none {
    background: url("../img/modal-1-img.jpg") center no-repeat;
    background-size: cover;
    width: 100%;
    color: #fff;
    padding: 50vh 10px 10px 10px;
    margin-bottom: 30px;
    text-shadow: 1px 1px 10px #000;
  }

  .modal-d-f .modal2 {
    background: url("../img/modal-2-img.jpg") center no-repeat;
    background-size: cover;
    width: 100%;
    color: #fff;
    padding: 50vh 10px 10px 10px;
    margin-bottom: 30px;
    text-shadow: 1px 1px 10px #000;
  }

  .modal-d-f .modal3 {
    background: url("../img/modal-3-img.jpg") center no-repeat;
    background-size: cover;
    width: 100%;
    color: #fff;
    padding: 50vh 10px 10px 10px;
    margin-bottom: 30px;
    text-shadow: 1px 1px 3px #000;
  }

  .modal-d-f h3 {
    margin-top: 0px;
  }

  .modal-d-f .flex {
    width: 100%;
  }

  /*business*/
  #business .mv {
    background: url("../img/mv-business.jpg") no-repeat left;
    background-size: cover;
    background-position: 20%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 100;
    margin-bottom: 0;
    justify-content: center;
  }

  #business .in-mv {
    align-items: center;
    justify-content: center;
    margin: 0 auto;
  }

  #business .in-mv h2 {
    margin-bottom: 30px;
    font-size: 44px;
    position: relative;
    width: 220px;
    margin: 0 auto 30px auto;
  }

  .business01 {
    margin-top: 0px;
    position: relative;
    z-index: 100;
  }

  .business01 .inner {
    background: #fff;
  }

  .business01 .bg-white {
    background: #fff;
  }

  .business01-title {
    padding: 20px 0;
  }

  .business01-title h2 {
    text-align: center;
  }

  .business01-title .fade {
    position: absolute;
    top: 50px;
    left: 53%;
    width: 20%;
  }

  .business01 p {
    padding: 20px 0;
  }

  .business02 {
    background: #F3F5F2;
  }

  .business02-mv {
    background: url("../img/business02-mv.jpg") center no-repeat;
    background-size: cover;
    height: 250px;
  }

  .business02-mv2 {
    background: url("../img/business02-mv2.jpg") center no-repeat;
    background-size: cover;
    height: 250px;
  }

  .business02 .abso {
    position: relative;
    width: 50%;
    margin-right: auto;
    text-align: center;
  }

  .business02 .abso h3 {
    margin-top: -120px;
    margin-left: 10%;
  }

  .business02 .abso2 {
    margin-top: -120px;
    position: relative;
    width: 50%;
    margin-right: auto;
    text-align: center;
  }

  .business02 .abso2 h3 {
    margin-top: 0px;
    margin-left: 120%;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: upright;
    width: 40px;
  }

  .business02 .abso2 h3 img {}

  .business02 .d-f1 {
    background: url("../img/busines02-bg1-sp.png") left no-repeat;
    background-size: 80%;
    background-position: 200% 50%;
    margin-top: -40px;
    padding: 30px 0;
  }

  .business02 .d-f1_2 {
    background: url("../img/busines02-bg2-sp.png") no-repeat;
    background-size: 90%;
    background-position: 300% 50%;
    margin-top: -40px;
  }

  .business02 .d-f1 .inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    height: 100%;
  }

  .business02 .d-f1 .flex1 {
    width: 100%;
  }

  .business02 .d-f1_2 .flex1 {
    order: 0;
  }

  .business02 .d-f1 .flex1 h5 {
    font-size: 16px;
    margin-bottom: 15px;
  }

  .business02 .d-f1 .flex1 p {
    line-height: 2.5;
  }

  .business02 .d-f1 .flex2 h6 {
    font-size: 16px;
    margin-bottom: 15px;
    color: #920844;
  }

  .business02 .d-f1 .flex2 ul {
    list-style: none;
  }

  .business02 .d-f1 .flex2 ul li {
    padding: 6px 0 9.5px 0;
    border-top: solid .5px #707070;
  }

  .business02 .d-f1 .flex2 ul li:last-of-type {
    border-bottom: solid .5px #707070;
    ;
  }

  .business02 .d-f2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 60px;
    margin-top: -0px;
  }

  .business02 .d-f2-1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: -30px;
    margin-top: 0px;
  }

  .business02 .d-f2 img {
    margin-bottom: 10px;
  }

  .business02 .d-f2 p {
    margin-bottom: 40px;
  }

  .business02 .slider {
    display: block;
    margin-bottom: 125px;
    margin-top: -0px;
    background: #5F9652;
    padding: 0px 0 30px 0;
  }

  .business02 .slider img {
    margin-bottom: 10px;
  }

  .mid-bnr {
    display: flex;
  }

  .mid-bnr .minchou2 {
    font-size: 20px;
    letter-spacing: 5px;
  }

  .mid-bnr1 {
    background: url("../img/mid-bnr1.jpg") no-repeat center bottom;
    background-size: cover;
    width: 50%;
    height: 110px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .mid-bnr1 .bg-font {
    background: url("../img/CoProfile.png") center no-repeat;
    background-size: 60px;
    background-position: 105% -400%;
    padding: 10px 0px 0 10px;
    text-align: center;
    margin: -5px 0 25px 0;
  }

  /*.sekou-bnr .sub-title {
  position: absolute;
  top: 65%;
  color: #fff;
}*/
  .mid-bnr1 .more {
    text-align: center;
    font-size: 9px;
    margin-left: 7px;
    letter-spacing: -.3px;
  }

  .mid-bnr2 {
    background: url("../img/kanren-bnr@2x.jpg") no-repeat center bottom;
    background-size: cover;
    width: 50%;
    height: 110px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .mid-bnr2 .bg-font {
    background: url("../img/Affiliated.png") center no-repeat;
    background-size: 56px;
    background-position: 90% -5px;
    padding: 15px 0px 0 10px;
    text-align: center;
    margin: -10px 0 0px 0;
  }

  /*.kanren-bnr .sub-title {
  position: absolute;
  top: 65%;
  color: #fff;
}*/
  .mid-bnr2 .more {
    text-align: center;
    font-size: 9px;
    margin-left: 7px;
    letter-spacing: -.3px;
  }

  .mid-bnr2 .sub-title p {
    font-size: 10px;
    text-align: center;
    margin-bottom: 10px;
    margin-left: 5px;
  }

  /*works*/
  #works .mv {
    background-size: cover;
    background-position: 20%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 100;
    margin-bottom: 0;
    justify-content: center;
  }

  #works .in-mv {
    align-items: center;
    justify-content: center;
    margin: 0 auto;
  }

  #works .in-mv h2 {
    margin-bottom: 30px;
    font-size: 36px;
    position: relative;
    width: 220px;
    margin: 0 auto 30px auto;
  }

  .works01 {
    margin-top: 0px;
    position: relative;
    z-index: 100;
  }

  .works01 .inner {
    background: #fff;
  }

  .works01 .bg-white {
    background: #fff;
  }

  .works01-title {
    padding: 20px 0;
  }

  .works01-title h2 {
    text-align: center;
  }

  .works01-title .fade {
    position: absolute;
    top: 15%;
    left: 53%;
    width: 20%;
  }

  .works01 p {
    padding: 20px 0;
  }

  .works02 .d-f {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .works02 .d-f .flex {
    width: 100%;
    text-align: center;
    margin-bottom: 115px;
  }

  .works02 .d-f .flex img {
    margin-bottom: 15px;
  }

  /*associated*/
  #associated .mv {
    background-size: cover;
    background-position: 40%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 100;
    margin-bottom: 0;
    justify-content: center;
  }

  #associated .in-mv {
    align-items: center;
    justify-content: center;
    margin: 0 auto;
  }

  #associated .in-mv h2 {
    margin-bottom: 30px;
    font-size: 44px;
    position: relative;
    width: 220px;
    margin: 0 auto 30px auto;
  }

  .associated01 {
    margin-top: 0px;
    position: relative;
    z-index: 100;
  }

  .associated01 .inner {
    background: #fff;
  }

  .associated01 .bg-white {
    background: #fff;
  }

  .associated01-title {
    padding: 20px 0;
  }

  .associated01-title h2 {
    text-align: center;
  }

  .associated01-title .fade {
    position: absolute;
    top: 15%;
    left: 53%;
    width: 45%;
  }

  .associated01 p {
    padding: 20px 0;
  }

  .associated02 {
    margin-bottom: 50px;
  }

  .associated02 .d-f {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .associated02 .d-f .flex {
    width: 100%;
    margin-bottom: 15px;
  }

  .associated02 .d-f .flex-text {
    width: 100%;
    padding: 35px 0;
  }

  .associated02 .d-f .flex-text h5 {
    color: #920844;
    font-size: 16px;
  }

  .associated02 .d-f .flex-text dl {
    border-top: solid .5px #707070;
    display: flex;
    justify-content: space-between;
    padding: 10px 10px 6px 0;
  }

  .associated02 .d-f .flex-text dl:nth-last-child(1) {
    border-bottom: solid .5px #707070;
  }

  .associated03 {
    margin-bottom: 120px;
  }

  .associated03 h3 {
    color: #920844;
    text-align: center;
    padding: 15px;
    margin-bottom: 40px;
    border: solid .5px #920844;
    font-size: 16px;
  }

  .associated03 .d-f {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .associated03 .d-f .flex1 {
    width: 100%;
    margin-bottom: 30px;
  }

  .associated03 .d-f .flex1 dl {
    display: flex;
    justify-content: space-between;
    line-height: 2.7;
  }

  .associated03 .d-f .flex1 dt {
    width: 20%;
    font-weight: bold;
  }

  .associated03 .d-f .flex1 dd {
    width: 70%;
  }

  .associated03 .d-f .flex2 {
    width: 100%;
  }

  .associated03 .d-f .flex2 dl {
    line-height: 2.7;
  }

  .associated03 .d-f .flex2 dt {
    font-weight: bold;
  }

  .mid-bnr3 {
    background: url("../img/sekou-bnr.jpg") no-repeat center bottom;
    background-size: cover;
    width: 50%;
    height: 110px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .mid-bnr3 .bg-font {
    background: url("../img/Works.png") center no-repeat;
    background-size: 45px;
    background-position: 50% -9px;
    padding: 10px 0px 0 10px;
    text-align: center;
    margin: -5px 0 25px 0;
  }

  /*.sekou-bnr .sub-title {
  position: absolute;
  top: 65%;
  color: #fff;
}*/
  .mid-bnr3 .more {
    text-align: center;
    font-size: 9px;
    margin-left: 7px;
    letter-spacing: -.3px;
  }

  /*company*/
  #company .mv {
    background: url("../img/mv-company.jpg") no-repeat center;
    background-size: cover;
    background-position: ;
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 100;
    margin-bottom: 0;
    justify-content: center;
  }

  #company .in-mv {
    align-items: center;
    justify-content: center;
    margin: 0 auto;
  }

  #company .in-mv h2 {
    margin-bottom: 30px;
    font-size: 44px;
    position: relative;
    width: 220px;
    margin: 0 auto 30px auto;
  }

  .company01 {
    margin-top: -100px;
    position: relative;
    z-index: 100;
  }

  .company01 .inner {
    background: #fff;
  }

  .company01 .bg-white {
    background: #fff;
  }

  .company01-title {
    padding: 20px 0;
  }

  .company01-title h2 {
    text-align: center;
  }

  .company01-title .fade {
    position: absolute;
    top: 1px;
    left: 55%;
  }

  .company01 .d-f {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 20px 0px;
    line-height: 2.7;
    font-size: 13px;
  }

  .company01 .d-f a {
    display: flex;
    background: url("../img/corn.png") center no-repeat;
    justify-content: center;
    background-size: 30px;
    width: 30%;
    padding: 50px 0px 0px 0px;
    color: #920844;
    font-weight: bold;
  }

  .border-p {
    border: solid 1px #920844;
    color: #920844;
    text-align: center;
    font-size: 16px;
    padding: 11px;
  }

  .dl-box {
    padding: 10px 0px;
  }

  .dl-box dl {
    display: flex;
    flex-wrap: wrap;
    padding: 20px 0px;
    border-bottom: solid 0.5px #707070;
    line-height: 2.7;
  }

  .dl-box dt {
    font-weight: bold;
    width: 100%;
  }

  .dl-box dd {
    width: 100%;
    font-size: 14px;
  }

  .dl-flex-wrap {
    padding: 10px 0px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .dl-flex-wrap h5 {
    font-size: 16px;
    line-height: 2.7;
    color: #920844;
    border-bottom: solid 0.5px #707070;
    width: 100%;
  }

  .dl-flex-wrap .m-t {
    margin-top: 60px;
  }

  .dl-flex {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding: 0px;
    margin-bottom: 60px;
  }

  .dl-flex dl {
    width: 100%;
    padding-right: 10px;
    display: flex;
    justify-content: space-between;
    border-bottom: solid 0.5px #707070;
    line-height: 2.7;
  }

  /*.dl-flex dl:nth-last-of-type(1){
  border-bottom: solid 0.5px #707070;
}*/
  .company02 {
    margin-bottom: 60px;
  }

  .company03 {
    background: url("../img/company-staff.jpg") no-repeat center bottom;
    padding-bottom: 40%;
    background-size: cover;
    margin-bottom: 60px;
  }

  .company04 {
    margin-bottom: 60px;
  }

  .company05 {
    margin-bottom: 30px;
  }

  .company05 h3 {
    margin-bottom: 60px;
  }

  .company05 .d-f {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .company05 .d-f .flex {
    width: 100%;
    text-align: center;
    line-height: 2.7;
    margin-bottom: 65px;
  }

  .company05 .d-f .flex h5 {
    font-size: 16px;
    color: #920844;
  }

  .company05 .d-f .tokuchan {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding-left: 0px;
    text-align: left;
  }

  .company05 .d-f .tokuchan .img-box {
    width: 30%;
  }

  .company06 {
    background: url("../img/company-06.jpg") no-repeat center bottom;
    padding-bottom: 40%;
    background-size: cover;
    margin-bottom: 60px;
  }

  .company07 {
    margin-bottom: 60px;
  }

  .company08 {
    margin-bottom: 60px;
  }

/* SDGs　*/
  #sdgs .mv {
    background: url(../img/mv-sdgs.jpg) no-repeat center;
    background-size: cover;
  }

  .sdgs01 {
    padding: 60px 0 50px;
  }

  .sdgs01::before {
    width: 120px;
    height: 120px;
  }

  .sdgs01 .sdgs01-title {
    margin-bottom: 13px;
  }

  .sdgs01 .title-s {
    font-size: 25px;
  }

  .sdgs01 .title-l {
    font-size: 40px;  
  }

  .sdgs01 .text {
    font-size: 15px;
    display: table;
    margin: 0 auto 30px;
    text-align: left;
  }

  .sdgs01 .img {
    width: auto;
    margin: 0 auto 36px;
  }

  .sdgs01 .sign::after {
    width: 48px;
    height: 72px;
    right: -64px;
  }

  .sdgs01 .sign .date {
    font-size: 13px;
  }

  .sdgs01 .sign .sign-wrap {
    display: block;
  }

  .sdgs01 .sign .sign-wrap .img {
    width: 106px;
    margin-left: 0;
    text-align: right;
  }

  .sdgs01 .sign .sign-wrap .chara-img {
    margin-left: auto;
    margin-top: 10px;
  }

  .sdgs02 {
    padding: 0 0 120px;
  }

  .sdgs02 .img-wrap {
    padding: 40px 20px 200px 20px;
  }

  .sdgs02 .img-wrap .img-wrap-inner {
    width: auto;
    justify-content: flex-start;
  }

  .sdgs02 .img-wrap .img {
    width: calc((100% - 20px) / 3);
    margin-left: 10px;
  }

  .sdgs02 .img-wrap .img:nth-child(n + 4) {
    margin-top: 10px;
  }

  .sdgs02 .img-wrap .img:nth-child(5n + 1) {
    margin-left: 10px;
  }

  .sdgs02 .img-wrap .img:first-child, .sdgs02 .img-wrap .img:nth-child(3n + 1) {
    margin-left: 0;
  }

  .sdgs02 .img-wrap .img-wrap-inner::after {
    content: '';
    width: calc((100% - 20px) / 3);
  }

  .sdgs02 .list  {
    margin-top: -150px;
  }

  .sdgs02 .list .sdgs02-title {
    margin-bottom: 30px;
  }

  .sdgs02 .list .sdgs02-title .sdgs02-title-img {
    width: 200px;
    margin: 0 auto;
  }

  .sdgs02 .list .sdgs02-title h2 {
    font-size: 25px; 
  }

  .sdgs02 .list ul {
    flex-direction: column;
    padding: 0 15px;
  }

  .sdgs02 .list ul .item {
    display: flex;
    align-items: center;
    width: 100%;
    border-top: 1px solid #B4B4B4;
    padding: 18px 0;
  }

  .sdgs02 .list ul .item:nth-last-child(-n+2) {
    border-bottom: 1px solid #B4B4B4;
  }

  .sdgs02 .list ul .item .img {
    width: 120px;
  }

  .sdgs02 .list ul .item p {
    margin-left: 15px;
    font-size: 15px;
    line-height: calc(28/15);
  }
}