@charset "UTF-8";
/* ---------------------------------------

  our_business/01-05.html

--------------------------------------- */
#our-business {
  overflow: auto;
}

#our-business .l-wrapper {
  background-color: #16a599;
}

#our-business .l-wrapper.bg02 {
  background-color: #be402d;
}

#our-business .mv {
  position: relative;
  height: 100vh;
  overflow: hidden;
}

@media (max-width: 1100px) {
  #our-business .mv {
    height: 70vh;
  }
}

@media (max-width: 840px) {
  #our-business .mv {
    height: 40vh;
  }
}

@media (max-width: 767px) {
  #our-business .mv {
    height: 100vh;
  }
}

#our-business .mv::before {
  content: "";
  position: absolute;
  inset: 0;
  /* 上下左右いっぱい */
  background-image: url("../../img/our_business/01/mv.png");
  background-repeat: no-repeat;
  background-size: 80%;
  background-position: right top;
  opacity: 0;
  -webkit-transform: translateX(40px);
          transform: translateX(40px);
  -webkit-animation: bgFadeIn 0.8s ease-out forwards;
          animation: bgFadeIn 0.8s ease-out forwards;
}

@media (max-width: 767px) {
  #our-business .mv::before {
    background-size: 190%;
    background-position: center bottom;
    background-image: url("../../img/our_business/01/mv_sp.png");
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
  }
}

#our-business .mv.sanrin::before {
  background-image: url("../../img/our_business/02/mv.png");
  background-size: 72%;
}

@media (max-width: 840px) {
  #our-business .mv.sanrin::before {
    background-size: 180%;
    background-position: 40% bottom;
    background-image: url("../../img/our_business/02/mv_sp.png");
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
  }
}

#our-business .mv.tatsu::before {
  background-image: url("../../img/our_business/03/mv.png");
  background-size: 74%;
}

@media (max-width: 840px) {
  #our-business .mv.tatsu::before {
    background-size: 190%;
    background-position: 30% bottom;
    background-image: url("../../img/our_business/03/mv_sp.png");
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
  }
}

#our-business .mv.kanri::before {
  background-image: url("../../img/our_business/04/mv.png");
  background-size: 73%;
}

@media (max-width: 840px) {
  #our-business .mv.kanri::before {
    background-size: 190%;
    background-position: 50% bottom;
    background-image: url("../../img/our_business/04/mv_sp.png");
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
  }
}

#our-business .mv.eigyo::before {
  background-image: url("../../img/our_business/05/mv.png");
  background-size: 75%;
}

@media (max-width: 840px) {
  #our-business .mv.eigyo::before {
    background-size: 190%;
    background-position: 50% bottom;
    background-image: url("../../img/our_business/05/mv_sp.png");
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
  }
}

@-webkit-keyframes bgFadeIn {
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@keyframes bgFadeIn {
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

#our-business .mv .mv-division {
  position: absolute;
  top: 30%;
  left: 5%;
  -webkit-transform: translateY(-30%);
          transform: translateY(-30%);
  color: #fff;
  opacity: 0;
  -webkit-transform: translateY(40px);
          transform: translateY(40px);
  -webkit-animation: bgFadeIn 0.8s ease-out forwards;
          animation: bgFadeIn 0.8s ease-out forwards;
}

@media (max-width: 1100px) {
  #our-business .mv .mv-division {
    top: 10%;
    -webkit-transform: translateY(-10%);
            transform: translateY(-10%);
  }
}

@media (max-width: 840px) {
  #our-business .mv .mv-division {
    top: 3%;
    -webkit-transform: translateY(-3%);
            transform: translateY(-3%);
  }
}

@keyframes bgFadeIn {
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

#our-business .mv .division {
  display: inline-block;
  border: 1px solid #fff;
  border-radius: 90px;
  font-size: clamp(18px, 2.5vw, 30px);
  line-height: 1;
  padding: 7px 30px 10px;
  margin-bottom: 40px;
}

@media (max-width: 840px) {
  #our-business .mv .division {
    margin-bottom: 10px;
  }
}

#our-business .mv .division-name {
  font-size: clamp(36px, 6vw, 80px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.1em;
  margin-bottom: 30px;
}

@media (max-width: 840px) {
  #our-business .mv .division-name {
    margin-bottom: 10px;
  }
}

#our-business .mv .division-lead {
  font-size: clamp(13px, 2vw, 20px);
  line-height: 1.8;
  letter-spacing: 0.1em;
}

#our-business .section-episode {
  position: relative;
  padding: 7% 5%;
}

#our-business .section-episode .epi-content {
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  gap: 5%;
}

#our-business .section-episode .epi-content .epi-left {
  width: 15%;
  height: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  /* 縦に積む */
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  /* 横方向を中央揃え */
  text-align: center;
  position: relative;
}

#our-business .section-episode .epi-content .epi-left .epi-title {
  font-size: clamp(18px, 4vw, 32px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.1em;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  /* 縦書き（右から左へ進む） */
  -webkit-text-orientation: upright;
          text-orientation: upright;
  text-align: center;
  margin-bottom: 20px;
}

@media (max-width: 1100px) {
  #our-business .section-episode .epi-content .epi-left .epi-title {
    font-size: clamp(16px, 2.4vw, 24px);
  }
}

#our-business .section-episode .epi-content .epi-left .epi-div {
  display: inline-block;
  border: 1px solid #fff;
  border-radius: 90px;
  font-size: clamp(16px, 2.5vw, 22px);
  font-weight: 700;
  line-height: 1;
  padding: 10px 30px;
  margin-bottom: 20px;
}

@media (max-width: 1100px) {
  #our-business .section-episode .epi-content .epi-left .epi-div {
    font-size: clamp(14px, 1.8vw, 18px);
    -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
            writing-mode: vertical-rl;
    padding: 20px 10px;
  }
}

@media (max-width: 840px) {
  #our-business .section-episode .epi-content .epi-left .epi-div {
    border-radius: 30px;
    padding: 20px 10px;
  }
}

@media (max-width: 540px) {
  #our-business .section-episode .epi-content .epi-left .epi-div {
    font-size: 12px;
  }
}

#our-business .section-episode .epi-content .epi-left .epi-divName {
  font-size: clamp(16px, 2.5vw, 22px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.1em;
  text-align: center;
  margin-bottom: 50px;
}

@media (max-width: 1100px) {
  #our-business .section-episode .epi-content .epi-left .epi-divName {
    font-size: clamp(14px, 1.8vw, 18px);
    -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
            writing-mode: vertical-rl;
  }
}

@media (max-width: 540px) {
  #our-business .section-episode .epi-content .epi-left .epi-divName {
    height: 140px;
    margin-bottom: 20px;
  }
}

#our-business .section-episode .epi-content .epi-left .epi-illust {
  width: 100%;
}

@media (max-width: 540px) {
  #our-business .section-episode .epi-content .epi-left .epi-illust {
    width: 140%;
  }
}

#our-business .section-episode .epi-content .epi-right {
  width: 90%;
  position: relative;
  height: 80vh;
  overflow: hidden;
}

@media (max-width: 840px) {
  #our-business .section-episode .epi-content .epi-right {
    width: 100%;
    height: auto;
  }
}

#our-business .section-episode .epi-content .epi-right .epi-list {
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0;
  /* 余白打消し（必要なら） */
  padding: 0;
}

#our-business .section-episode .epi-content .epi-right .epi-item {
  position: absolute;
  background-color: #fff;
  inset: 0;
  margin: 0;
  border-radius: 30px;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

@media (max-width: 840px) {
  #our-business .section-episode .epi-content .epi-right .epi-item {
    position: relative;
    display: block;
    margin-bottom: 20px;
  }
  #our-business .section-episode .epi-content .epi-right .epi-item:last-child {
    margin-bottom: 0;
  }
}

#our-business .section-episode .epi-content .epi-right .epi-item.num01 {
  z-index: 1;
}

#our-business .section-episode .epi-content .epi-right .epi-item.num02 {
  z-index: 2;
}

#our-business .section-episode .epi-content .epi-right .epi-item.num03 {
  z-index: 3;
}

#our-business .section-episode .epi-content .epi-right .epi-item.num04 {
  background-image: url("../../img/our_business/01/ep4_img.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  z-index: 4;
}

#our-business .section-episode .epi-content .epi-right .epi-item.num04.sanrin {
  background-image: url("../../img/our_business/02/ep4_img.jpg");
}

#our-business .section-episode .epi-content .epi-right .epi-item.num04.tatsu {
  background-image: url("../../img/our_business/03/ep4_img.jpg");
}

#our-business .section-episode .epi-content .epi-right .epi-item.num04.kanri {
  background-image: url("../../img/our_business/04/ep4_img.jpg");
}

#our-business .section-episode .epi-content .epi-right .epi-item.num04.eigyo {
  background-image: url("../../img/our_business/05/ep4_img.jpg");
}

#our-business .section-episode .epi-content .epi-right .epi-item.num04 .epi-body {
  width: 100%;
  font-size: clamp(16px, 2vw, 20px);
  line-height: 1.8;
  letter-spacing: 0.1em;
  color: #fff;
  text-align: center;
  padding-top: 50%;
  position: relative;
}

@media (max-width: 840px) {
  #our-business .section-episode .epi-content .epi-right .epi-item.num04 .epi-body {
    padding: 80% 10%;
  }
}

#our-business .section-episode .epi-content .epi-right .epi-item.num04 .epi-desc {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  height: auto;
  overflow-y: none;
}

@media (max-width: 840px) {
  #our-business .section-episode .epi-content .epi-right .epi-item.num04 .epi-desc {
    padding: 0 5% 0;
    font-size: clamp(14px, 1.8vw, 18px);
  }
}

#our-business .section-episode .epi-content .epi-right .epi-img {
  width: 40%;
}

@media (max-width: 840px) {
  #our-business .section-episode .epi-content .epi-right .epi-img {
    width: 100%;
  }
}

#our-business .section-episode .epi-content .epi-right .epi-img img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

#our-business .section-episode .epi-content .epi-right .epi-body {
  width: 60%;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.1em;
  padding: 4%;
  color: #231815;
  position: relative;
}

@media (max-width: 840px) {
  #our-business .section-episode .epi-content .epi-right .epi-body {
    width: 100%;
    padding: 7%;
  }
}

#our-business .section-episode .epi-content .epi-right .epi-num {
  color: #dcdcdc;
  font-size: clamp(14px, 2vw, 22px);
  /* 小～大画面に応じて変化 */
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0em;
  text-align: right;
  margin-bottom: 20px;
}

#our-business .section-episode .epi-content .epi-right .epi-num span {
  font-weight: 400;
  line-height: 0.7;
  vertical-align: top;
  /* ← 上揃え */
  font-size: clamp(40px, 10vw, 100px);
}

#our-business .section-episode .epi-content .epi-right .epi-bodyTtl {
  font-size: clamp(20px, 2.5vw, 36px);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0em;
  margin-bottom: 20px;
}

#our-business .section-episode .epi-content .epi-right .epi-desc {
  width: 92%;
  line-height: 2;
  letter-spacing: 0.02em;
  height: 20em;
  overflow-y: auto;
}

@media (max-width: 1100px) {
  #our-business .section-episode .epi-content .epi-right .epi-desc {
    width: 100%;
    height: 70%;
  }
}

@media (max-width: 840px) {
  #our-business .section-episode .epi-content .epi-right .epi-desc {
    width: 100%;
  }
}

#our-business .section-business {
  background-color: #c1e8e4;
  padding: 7% 5%;
  width: 100%;
  height: auto;
  background-image: url("../../img/our_business/business_bg01.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left bottom;
  position: relative;
  z-index: 20;
}

@media (max-width: 840px) {
  #our-business .section-business {
    background-image: url("../../img/our_business/other_bg_top_sp.png");
  }
}

#our-business .section-business.num02 {
  background-color: #ebc3c3;
  background-image: url("../../img/our_business/business_bg02.jpg");
}

@media (max-width: 840px) {
  #our-business .section-business.num02 {
    background-image: url("../../img/our_business/other_bg_top_sp02.png");
  }
}

#our-business .section-business .intro {
  text-align: center;
  margin-bottom: 80px;
}

@media (max-width: 840px) {
  #our-business .section-business .intro {
    margin-bottom: 30px;
  }
}

#our-business .section-business .intro .intro-ttl {
  font-size: clamp(20px, 4vw, 36px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.1em;
  margin-bottom: 30px;
}

#our-business .section-business .intro .intro-desc {
  font-size: clamp(14px, 1.6vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.1em;
}

#our-business .section-business .business-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5%;
  margin-bottom: 80px;
  justify-items: center;
}

@media (max-width: 840px) {
  #our-business .section-business .business-list {
    display: block;
  }
}

@media (max-width: 840px) {
  #our-business .section-business .business-list .business-item {
    margin-bottom: 30px;
  }
  #our-business .section-business .business-list .business-item:last-child {
    margin-bottom: 0;
  }
}

#our-business .section-business .business-list .business-item .business-img {
  width: 100%;
  margin-bottom: 20px;
}

#our-business .section-business .business-list .business-item .business-img img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

#our-business .section-business .business-list .business-item .business-name {
  font-size: clamp(16px, 1.8vw, 18px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.1em;
  margin-bottom: 10px;
}

#our-business .section-business .staff {
  text-align: center;
}

#our-business .section-business .staff .staff-ttl {
  font-size: clamp(20px, 4vw, 36px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.1em;
  margin-bottom: 20px;
}

#our-business .section-business .staff .staff-img {
  display: block;
  width: 50%;
  height: auto;
  margin: 0 auto 20px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

@media (max-width: 840px) {
  #our-business .section-business .staff .staff-img {
    width: 100%;
  }
}

#our-business .section-business .staff .staff-img:hover {
  opacity: 0.7;
}

#our-business .section-business .staff .staff-img img {
  display: block;
  width: 100%;
  height: auto;
}

#our-business .section-other {
  background-color: #fff;
  padding: 7% 5% 0;
  width: 100%;
  height: auto;
  background-image: url("../../img/our_business/leaf_bg.png");
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: left top;
  position: relative;
  z-index: 20;
}

@media (max-width: 840px) {
  #our-business .section-other {
    background-image: url("../../img/our_business/other_bg_sp.png");
    background-size: 100%;
    padding-top: 15%;
  }
  #our-business .section-other.num02 {
    background-image: url("../../img/our_business/other_bg_sp.png");
  }
}

#our-business .section-other .other-ttl {
  color: #fff;
  font-size: clamp(40px, 10vw, 120px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0em;
  text-align: center;
  margin-bottom: 80px;
}

@media (max-width: 840px) {
  #our-business .section-other .other-ttl {
    width: 100%;
    margin-bottom: 40px;
  }
}

#our-business .section-other .other-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  row-gap: 50px;
  -webkit-column-gap: 50px;
     -moz-column-gap: 50px;
          column-gap: 50px;
  margin-bottom: 200px;
}

@media (max-width: 840px) {
  #our-business .section-other .other-list {
    display: block;
    margin-bottom: 0;
    padding-bottom: 100px;
    text-align: center;
  }
}

#our-business .section-other .other-list .other-item {
  width: 40%;
}

@media (max-width: 840px) {
  #our-business .section-other .other-list .other-item {
    width: 100%;
    margin-bottom: 50px;
  }
  #our-business .section-other .other-list .other-item:last-child {
    margin-bottom: 0;
  }
}

#our-business .section-other .other-list .other-item a {
  position: relative;
  display: inline-block;
}

#our-business .section-other .other-list .other-item a::after {
  content: "";
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  -webkit-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}

#our-business .section-other .other-list .other-item a:hover::after {
  opacity: 1;
}

#our-business .section-other .other-list .other-item.num01 a::after {
  background-image: url("/assets/img/our_business/business_btn01_ro.png");
}

#our-business .section-other .other-list .other-item.num02 a::after {
  background-image: url("/assets/img/our_business/business_btn02_ro.png");
}

#our-business .section-other .other-list .other-item.num03 a::after {
  background-image: url("/assets/img/our_business/business_btn03_ro.png");
}

#our-business .section-other .other-list .other-item.num04 a::after {
  background-image: url("/assets/img/our_business/business_btn04_ro.png");
}

#our-business .section-other .other-list .other-item.num05 a::after {
  background-image: url("/assets/img/our_business/business_btn05_ro.png");
}

#our-business .section-other .entryBtn {
  text-align: center;
  margin-bottom: 50px;
}

@media (max-width: 540px) {
  #our-business .section-other .entryBtn {
    position: relative;
    top: 70px;
  }
}

#our-business .section-other .entryBtn .entryBtn-txt {
  text-decoration: none;
  display: inline-block;
  border: 4px solid #afafaf;
  padding: 10px 50px;
  color: #afafaf;
  font-size: 50px;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: 0.2em;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

#our-business .section-other .entryBtn .entryBtn-txt:hover {
  background-color: #afafaf;
  color: #fff;
  text-decoration: none;
}

#our-business .section-other .hashirukun {
  width: 13%;
  height: auto;
  margin: auto;
  position: relative;
  top: 50px;
}

@media (max-width: 840px) {
  #our-business .section-other .hashirukun {
    width: 40%;
  }
}