@charset "utf-8";

.banana-about {
  width: 100%;
  overflow: hidden;
  color: #000000;
  background: #ffffff;
  font-family: "Noto Sans JP", sans-serif;
}

.banana-about-stage {
  position: relative;
  width: 390px;
  height: 4070px;
  min-height: 0;
  overflow: hidden;
  isolation: isolate;
  zoom: var(--banana-stage-scale, 1);
  background: #ffffff;
}

.banana-about-stage * {
  box-sizing: border-box;
}

.banana-about-stage h1,
.banana-about-stage h2,
.banana-about-stage h3,
.banana-about-stage p {
  margin: 0;
}

.banana-about-background,
.banana-about-mobile-background,
.banana-about-company-background {
  z-index: 0;
}

.banana-about-hero-copy,
.banana-about-hero-banana,
.banana-about-hero-decoration,
.banana-about-consult,
.banana-about-services,
.banana-about-representative-copy,
.banana-about-representative-photo,
.banana-about-message-panel,
.banana-about-message,
.banana-about-staff-copy,
.banana-about-staff-left,
.banana-about-staff-center,
.banana-about-staff-right,
.banana-about-coral,
.banana-about-company-decoration,
.banana-about-company-table,
.banana-about-company-photo {
  z-index: 1;
}

.banana-about-background,
.banana-about-mobile-background,
.banana-about-decoration,
.banana-about-crop,
.banana-about-company-background {
  position: absolute;
  display: block;
}

.banana-about-hero-background {
  display: none;
}

.banana-about-mobile-hero-background {
  top: 0;
  left: 0;
  width: 390px;
  height: 693px;
  object-fit: cover;
}

.banana-about-mobile-consult-background {
  left: 8px;
  height: 375px;
  max-width: none;
  object-fit: cover;
  transform: translateX(375px) rotate(90deg);
  transform-origin: top left;
}

.banana-about-mobile-consult-background-first {
  top: 702px;
  width: 372px;
  object-position: left center;
}

.banana-about-mobile-consult-background-middle {
  top: 1074px;
  width: 371px;
  object-position: center;
}

.banana-about-mobile-consult-background-last {
  top: 1445px;
  width: 366px;
  object-position: right center;
}

.banana-about-first-background,
.banana-about-second-background,
.banana-about-third-background,
.banana-about-fourth-background {
  height: 373px;
  max-width: none;
  object-fit: cover;
  transform: translateX(373px) rotate(90deg);
  transform-origin: top left;
}

.banana-about-first-background {
  width: 329px;
  object-position: left center;
}

.banana-about-second-background {
  width: 328px;
  object-position: right center;
}

.banana-about-third-background,
.banana-about-fourth-background {
  width: 430px;
}

.banana-about-third-background {
  object-position: left center;
}

.banana-about-fourth-background {
  object-position: right center;
}

.banana-about-representative {
  position: absolute;
  top: 1811px;
  left: 0;
  width: 390px;
  height: 657px;
  overflow: hidden;
}

.banana-about-staff {
  position: absolute;
  top: 2468px;
  left: 0;
  width: 390px;
  height: 860px;
  overflow: hidden;
}

.banana-about-representative .banana-about-first-background,
.banana-about-staff .banana-about-third-background {
  top: 0;
  left: 10px;
}

.banana-about-representative .banana-about-second-background {
  top: 329px;
  left: 10px;
}

.banana-about-staff .banana-about-fourth-background {
  top: 430px;
  left: 10px;
}

.banana-about-company-background {
  top: 3368px;
  left: 0;
  width: 394px;
  height: 1076px;
  overflow: hidden;
}

.banana-about-company-background img {
  position: absolute;
  top: 0;
  left: 0;
  width: 1076px;
  height: 394px;
  max-width: none;
  object-fit: cover;
  transform: translateX(394px) rotate(90deg);
  transform-origin: top left;
}

.banana-about-hero-copy {
  position: absolute;
  top: 216px;
  left: 34px;
  width: 339px;
  text-align: left;
}

.banana-about-hero-copy h1 {
  color: #092a69;
  font-size: 38px;
  font-weight: 700;
  line-height: normal;
  white-space: nowrap;
}

.banana-about-hero-copy p {
  margin-top: 26px;
  width: 311px;
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
}

.banana-about-crop {
  overflow: hidden;
}

.banana-about-crop img {
  position: absolute;
  display: block;
  max-width: none;
}

.banana-about-hero-banana {
  top: 440px;
  left: 137px;
  width: 248px;
  height: 253px;
}

.banana-about-hero-banana img {
  top: -229px;
  left: -287px;
  width: 574px;
  height: 482px;
}

.banana-about-hero-decoration {
  top: 566px;
  left: 26px;
  width: 101px;
  height: 101px;
}

.banana-about-consult {
  position: absolute;
  top: 767px;
  left: 52px;
  width: 286px;
  text-align: center;
}

.banana-about-consult p {
  width: 287px;
}

.banana-about-stage h2 {
  color: #0160b8;
  font-size: 20px;
  font-weight: 700;
  line-height: normal;
}

.banana-about-consult p,
.banana-about-representative-copy p,
.banana-about-staff-copy p {
  margin-top: 12px;
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
}

.banana-about-representative-copy p,
.banana-about-staff-copy p {
  text-align: left;
}

.banana-about-services {
  position: absolute;
  top: 954px;
  left: 52px;
  display: flex;
  flex-direction: column;
  width: 286px;
}

.banana-about-service {
  position: relative;
  width: 286px;
  height: 157px;
  flex: 0 0 157px;
  text-align: center;
}

.banana-about-service-tall {
  height: 175px;
  flex-basis: 175px;
}

.banana-about-service-body {
  position: absolute;
  top: 11px;
  left: 0;
  width: 286px;
  height: 145px;
  padding-top: 40px;
  border-radius: 8px;
  background: #ffffff;
}

.banana-about-service-tall .banana-about-service-body {
  height: 164px;
}

.banana-about-service-body h3 {
  color: #0160b8;
  font-size: 16px;
  font-weight: 700;
  line-height: 19px;
}

.banana-about-service-body p {
  margin-top: 16px;
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
}

.banana-about-service-number {
  position: absolute;
  top: 0;
  left: 128px;
  display: block;
  width: 31px;
  height: 31px;
  border-radius: 50%;
  color: #ffffff;
  background: #0160b8;
  font-size: 24px;
  font-weight: 700;
  line-height: 31px;
  text-align: center;
}

.banana-about-hero-copy h1,
.banana-about-hero-copy p,
.banana-about-consult h2,
.banana-about-consult p,
.banana-about-service-body p,
.banana-about-representative-copy p,
.banana-about-message,
.banana-about-staff-copy p,
.banana-about-company-value {
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.banana-about-representative-copy {
  position: relative;
  top: auto;
  left: auto;
  width: 320px;
  margin: 77px 0 0 48px;
  text-align: center;
}

.banana-about-representative-photo {
  position: relative;
  top: auto;
  left: auto;
  width: 294px;
  height: 196px;
  margin: 4px auto 0;
  border-radius: 4px;
}

.banana-about-representative-photo img {
  top: -14px;
  left: -82px;
  width: 437px;
  height: 291px;
}

.banana-about-message-panel {
  position: relative;
  top: auto;
  left: auto;
  width: 328px;
  height: 140px;
  margin: 18px auto 0;
}

.banana-about-message-panel img {
  top: 0;
  left: 0;
  width: 328px;
  height: 140px;
}

.banana-about-message {
  position: absolute;
  top: 31px;
  left: 24px;
  width: 280px;
  color: #0160b8;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.45;
  text-align: center;
}

.banana-about-staff-copy {
  position: relative;
  top: auto;
  left: auto;
  width: 298px;
  margin: 61px auto 0;
  text-align: center;
}

.banana-about-staff-left,
.banana-about-staff-center,
.banana-about-staff-right {
  border-radius: 4px;
}

.banana-about-staff-left {
  position: relative;
  top: auto;
  left: auto;
  width: 298px;
  height: 164px;
  margin: 22px auto 0;
}

.banana-about-staff-left img {
  top: -34px;
  left: 0;
  width: 298px;
  height: 199px;
}

.banana-about-staff-center {
  position: relative;
  top: auto;
  left: auto;
  width: 299px;
  height: 198px;
  margin: 10px auto 0;
}

.banana-about-staff-center img {
  top: -17px;
  left: -59px;
  width: 371px;
  height: 247px;
}

.banana-about-staff-right {
  position: relative;
  top: auto;
  left: auto;
  width: 295px;
  height: 182px;
  margin: 10px auto 0;
}

.banana-about-staff-right img {
  top: -38px;
  left: -23px;
  width: 369px;
  height: 247px;
}

.banana-about-coral {
  top: 689px;
  left: -22px;
  width: 96px;
  height: 96px;
  transform: rotate(-11.48deg);
}

.banana-about-company-decoration {
  top: 3348px;
  left: 255px;
  width: 126px;
  height: 69px;
}

.banana-about-company h2 {
  position: absolute;
  top: 3408px;
  left: 32px;
  z-index: 1;
  display: block;
  width: 120px;
  text-align: left;
}

.banana-about-company-table {
  position: absolute;
  top: 3470px;
  left: 32px;
  width: 325px;
  overflow: hidden;
  background: #ffffff;
}

.banana-about-company-row {
  display: flex;
  flex-direction: column;
  width: 325px;
  height: 76px;
  border-bottom: 1px solid #9c9c9c;
}

.banana-about-company-row:nth-child(1),
.banana-about-company-row:nth-child(2),
.banana-about-company-row:nth-child(3) {
  height: 76px;
}

.banana-about-company-row:nth-child(4) {
  height: 110px;
  border-bottom: 0;
}

.banana-about-company-label,
.banana-about-company-value {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  text-align: center;
}

.banana-about-company-row:nth-child(1) .banana-about-company-label,
.banana-about-company-row:nth-child(1) .banana-about-company-value,
.banana-about-company-row:nth-child(2) .banana-about-company-label,
.banana-about-company-row:nth-child(2) .banana-about-company-value,
.banana-about-company-row:nth-child(3) .banana-about-company-label,
.banana-about-company-row:nth-child(3) .banana-about-company-value,
.banana-about-company-row:nth-child(4) .banana-about-company-label {
  width: 100%;
  height: 38px;
}

.banana-about-company-row:nth-child(4) .banana-about-company-value {
  width: 100%;
  height: 72px;
  padding: 0 24px;
}

.banana-about-company-label {
  background: #badef7;
}

.banana-about-company-value {
  background: #ffffff;
}

.banana-about-company-photo {
  top: 3832px;
  left: 32px;
  width: 325px;
  height: 188px;
}

.banana-about-company-photo img {
  top: -13px;
  left: 0;
  width: 343px;
  height: 228px;
}

@media (min-width: 768px) {
.banana-about-mobile-background,
.banana-about-fourth-background {
  display: none;
}

.banana-about {
  width: 100%;
  overflow: hidden;
  color: #000000;
  background: #ffffff;
  font-family: "Noto Sans JP", sans-serif;
}

.banana-about-stage {
  position: relative;
  width: 1000px;
  height: 1720px;
  min-height: 0;
  overflow: hidden;
  zoom: var(--banana-stage-scale, 1);
  background: #ffffff;
}

.banana-about-stage * {
  box-sizing: border-box;
}

.banana-about-stage h1,
.banana-about-stage h2,
.banana-about-stage p {
  margin: 0;
}

.banana-about-background,
.banana-about-decoration,
.banana-about-crop,
.banana-about-company-background {
  position: absolute;
  display: block;
}

.banana-about-background {
  display: block;
  left: 0;
  width: 1000px;
  height: 333px;
  object-fit: cover;
}

.banana-about-hero-background { top: 0; }
.banana-about-first-background { top: 340px; }
.banana-about-second-background { top: 673px; left: -6px; }
.banana-about-third-background { top: 1006px; left: -6px; }

.banana-about-company-background {
  top: 1355px;
  left: 0;
  width: 1000px;
  height: 366px;
  overflow: hidden;
}

.banana-about-company-background img {
  position: absolute;
  top: -68px;
  left: 0;
  width: 1000px;
  height: 482px;
  max-width: none;
}

.banana-about-hero-copy {
  position: absolute;
  top: 80px;
  left: 267px;
  width: 466px;
  text-align: center;
}

.banana-about-hero-copy h1 {
  color: #092a69;
  font-size: 50px;
  font-weight: 700;
  line-height: normal;
  white-space: nowrap;
}

.banana-about-hero-copy p {
  margin-top: 7px;
  width: 100%;
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
  text-align: center;
  white-space: nowrap;
}

.banana-about-crop {
  overflow: hidden;
}

.banana-about-crop img {
  position: absolute;
  display: block;
  max-width: none;
}

.banana-about-hero-banana {
  top: 80px;
  left: 733px;
  width: 248px;
  height: 253px;
}

.banana-about-hero-banana img {
  top: -229px;
  left: -287px;
  width: 574px;
  height: 482px;
}

.banana-about-hero-decoration {
  top: 213px;
  left: 112px;
  width: 101px;
  height: 101px;
}

.banana-about-consult {
  position: absolute;
  top: 373px;
  left: 213px;
  width: 574px;
  text-align: center;
}

.banana-about-stage h2 {
  color: #0160b8;
  font-size: 24px;
  font-weight: 700;
  line-height: normal;
}

.banana-about-consult p,
.banana-about-representative-copy p,
.banana-about-staff-copy p {
  margin-top: 12px;
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
  white-space: nowrap;
}

.banana-about-services {
  position: absolute;
  top: 475px;
  left: 54px;
  display: flex;
  width: 913px;
  height: 176px;
}

.banana-about-service {
  position: relative;
  width: 169.074px;
  height: 175.415px;
  margin-right: 16.907px;
  flex: 0 0 169.074px;
  text-align: center;
}

.banana-about-service:last-child {
  margin-right: 0;
}

.banana-about-service-body {
  position: absolute;
  top: 11.415px;
  left: 0;
  width: 169.074px;
  height: 164px;
  padding-top: 40px;
  border-radius: 8px;
  background: #ffffff;
}

.banana-about-service-tall,
.banana-about-service-tall .banana-about-service-body {
  height: 175.415px;
}

.banana-about-service-tall .banana-about-service-body {
  height: 164px;
}

.banana-about-service-body h3 {
  margin: 0;
  color: #0160b8;
  font-size: 16px;
  font-weight: 700;
  line-height: 19px;
}

.banana-about-service-body p {
  margin: 16px 0 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
}

.banana-about-service-number {
  position: absolute;
  top: 0;
  left: 69.24px;
  display: block;
  width: 30.594px;
  height: 30.983px;
  border-radius: 50%;
  color: #ffffff;
  background: #0160b8;
  font-size: 24px;
  font-weight: 700;
  line-height: 30.983px;
  text-align: center;
}

.banana-about-representative-copy {
  position: absolute;
  top: 707px;
  left: 0;
  width: 574px;
  text-align: center;
}

.banana-about-representative-photo {
  top: 707px;
  left: 541px;
  width: 400px;
  height: 267px;
}

.banana-about-representative-photo img {
  top: -19px;
  left: -111px;
  width: 594px;
  height: 396px;
}

.banana-about-message-panel {
  top: 824px;
  left: 88px;
  width: 412px;
  height: 176px;
}

.banana-about-message-panel img {
  top: 0;
  left: 0;
  width: 412px;
  height: 176px;
}

.banana-about-message {
  position: absolute;
  top: 867px;
  left: 94px;
  width: 387px;
  color: #0160b8;
  font-size: 18px;
  font-weight: 700;
  line-height: normal;
  text-align: center;
}

.banana-about-staff-copy {
  position: absolute;
  top: 1038px;
  left: 207px;
  width: 574px;
  text-align: center;
}

.banana-about-staff-left {
  top: 1131px;
  left: 40px;
  width: 319px;
  height: 176px;
  border-radius: 4px;
}

.banana-about-staff-left img {
  top: -37px;
  left: 0;
  width: 319px;
  height: 213px;
}

.banana-about-staff-center {
  top: 1131px;
  left: 387px;
  width: 253px;
  height: 176px;
  border-radius: 4px;
}

.banana-about-staff-center img {
  top: -6.12px;
  left: -49.46px;
  width: 313.54px;
  height: 208.95px;
}

.banana-about-staff-right {
  top: 1131px;
  left: 667px;
  width: 286px;
  height: 176px;
  border-radius: 4px;
}

.banana-about-staff-right img {
  top: -37px;
  left: -22px;
  width: 358px;
  height: 239px;
}

.banana-about-coral {
  top: 308px;
  left: 13px;
  width: 125px;
  height: 125px;
  transform: rotate(-11.48deg);
}

.banana-about-company-decoration {
  top: 1331px;
  left: 864px;
  width: 126px;
  height: 69px;
}

.banana-about-company h2 {
  position: absolute;
  top: 1376px;
  left: 41px;
  width: 120px;
  text-align: center;
}

.banana-about-company-table {
  position: absolute;
  top: 1436px;
  left: 54px;
  width: 420px;
  height: auto;
  overflow: hidden;
  background: #ffffff;
}

.banana-about-company-row {
  display: flex;
  width: 420px;
  height: 51px;
  border-bottom: 1px solid #9c9c9c;
}

.banana-about-company-row:last-child {
  border-bottom: 0;
}

.banana-about-company-label,
.banana-about-company-value {
  height: 51px;
  font-size: 16px;
  font-weight: 500;
  line-height: 51px;
  white-space: nowrap;
}

.banana-about-company-label {
  width: 111px;
  background: #badef7;
  text-align: center;
}

.banana-about-company-value {
  width: 309px;
  padding-left: 18px;
  background: #ffffff;
}

.banana-about-company-photo {
  top: 1436px;
  left: 511px;
  width: 442px;
  height: 256px;
}

.banana-about-company-photo img {
  top: -18px;
  left: 0;
  width: 467px;
  height: 311px;
}

.banana-about .banana-about-first-background,
.banana-about .banana-about-second-background,
.banana-about .banana-about-third-background,
.banana-about .banana-about-company-background img {
  transform: none;
}

.banana-about .banana-about-first-background,
.banana-about .banana-about-second-background,
.banana-about .banana-about-third-background {
  object-position: center;
}

.banana-about .banana-about-fourth-background {
  display: none;
}

.banana-about .banana-about-services {
  flex-direction: row;
}

.banana-about .banana-about-company h2 {
  display: block;
}

.banana-about .banana-about-company-row:nth-child(1),
.banana-about .banana-about-company-row:nth-child(2),
.banana-about .banana-about-company-row:nth-child(3),
.banana-about .banana-about-company-row:nth-child(4) {
  height: 51px;
  flex-direction: row;
}

.banana-about .banana-about-company-label,
.banana-about .banana-about-company-value,
.banana-about .banana-about-company-row:nth-child(1) .banana-about-company-label,
.banana-about .banana-about-company-row:nth-child(1) .banana-about-company-value,
.banana-about .banana-about-company-row:nth-child(2) .banana-about-company-label,
.banana-about .banana-about-company-row:nth-child(2) .banana-about-company-value,
.banana-about .banana-about-company-row:nth-child(3) .banana-about-company-label,
.banana-about .banana-about-company-row:nth-child(3) .banana-about-company-value,
.banana-about .banana-about-company-row:nth-child(4) .banana-about-company-label,
.banana-about .banana-about-company-row:nth-child(4) .banana-about-company-value {
  display: block;
  height: 51px;
}

.banana-about .banana-about-company-label,
.banana-about .banana-about-company-row:nth-child(1) .banana-about-company-label,
.banana-about .banana-about-company-row:nth-child(2) .banana-about-company-label,
.banana-about .banana-about-company-row:nth-child(3) .banana-about-company-label,
.banana-about .banana-about-company-row:nth-child(4) .banana-about-company-label {
  width: 111px;
  padding: 0;
}

.banana-about .banana-about-company-value,
.banana-about .banana-about-company-row:nth-child(1) .banana-about-company-value,
.banana-about .banana-about-company-row:nth-child(2) .banana-about-company-value,
.banana-about .banana-about-company-row:nth-child(3) .banana-about-company-value,
.banana-about .banana-about-company-row:nth-child(4) .banana-about-company-value {
  width: 309px;
  padding: 0 0 0 18px;
  text-align: left;
}

.banana-about .banana-about-consult p {
  width: auto;
}

.banana-about .banana-about-representative,
.banana-about .banana-about-staff {
  position: static;
  width: auto;
  height: auto;
  overflow: visible;
}

.banana-about .banana-about-representative .banana-about-first-background {
  top: 340px;
  bottom: auto;
  left: 0;
}

.banana-about .banana-about-representative .banana-about-second-background {
  top: 673px;
  bottom: auto;
  left: -6px;
}

.banana-about .banana-about-staff .banana-about-third-background {
  top: 1006px;
  bottom: auto;
  left: -6px;
}

.banana-about .banana-about-representative-copy,
.banana-about .banana-about-representative-photo,
.banana-about .banana-about-message-panel,
.banana-about .banana-about-staff-copy,
.banana-about .banana-about-staff-left,
.banana-about .banana-about-staff-center,
.banana-about .banana-about-staff-right {
  margin: 0;
}

.banana-about .banana-about-message {
  top: 43px;
  left: 6px;
}
}

/* SiblooのStyle Manager非対応ルールをeditor CSSから分離 */
* {
  box-sizing: border-box
}

@media (min-width: 768px) {
  .banana-about .banana-about-representative-copy p,
  .banana-about .banana-about-staff-copy p {
    text-align: center;
  }
}
