/** breakPoint **/
.p-transportation-costs-hero {
  padding: var(--spacing_5xl) 0;
}
.p-transportation-costs-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 47.667%);
  align-items: center;
  gap: var(--spacing_2xl);
  width: calc(100% - var(--gutter-sp) * 2);
  max-width: 1200px;
  margin: 0 auto;
}
.p-transportation-costs-hero__category {
  display: flex;
  align-items: center;
  gap: var(--spacing_xs);
}
.p-transportation-costs-hero__category-label {
  padding: 2px 6px;
  background-color: var(--color-text-product-accent);
}
.p-transportation-costs-hero__title, .p-transportation-costs-hero__description {
  margin-top: var(--spacing_md);
}
.p-transportation-costs-hero__buttons {
  display: flex;
  align-items: center;
  gap: var(--spacing_lg);
  margin-top: var(--spacing_2xl);
  margin-left: -35px;
}
.p-transportation-costs-hero__buttons .c-button {
  flex: 0 0 310px;
}
.p-transportation-costs-hero__contact {
  flex: 0 0 254px;
  padding: var(--spacing_sm) var(--spacing_xl) var(--spacing_md);
  background-color: var(--color-bg-product-primary);
}
.p-transportation-costs-hero__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius_lg);
}
@media (max-width: 1079px) {
  .p-transportation-costs-hero {
    padding: var(--spacing_2xl) 0;
  }
  .p-transportation-costs-hero__inner {
    display: block;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0 var(--gutter-sp);
  }
  .p-transportation-costs-hero__title, .p-transportation-costs-hero__description {
    margin-top: var(--spacing_md);
  }
  .p-transportation-costs-hero__buttons {
    display: grid;
    gap: var(--spacing_lg);
    width: 100%;
    max-width: 312px;
    margin-top: var(--spacing_2xl);
    margin-left: 0;
  }
  .p-transportation-costs-hero__buttons .c-button {
    width: calc(100% - 27px);
    height: 72px;
    margin-left: 27px;
  }
  .p-transportation-costs-hero__contact {
    width: 100%;
    height: 72px;
  }
  .p-transportation-costs-hero__image {
    margin-top: var(--spacing_2xl);
  }
}

.p-transportation-costs-problem {
  padding: var(--spacing_5xl) var(--gutter-sp);
  background-color: var(--smoke-5, #f2f5f9);
}
.p-transportation-costs-problem__label.c-en-15sb {
  width: fit-content;
  margin: 0 auto;
  padding: 0 6px;
  font-size: 15px;
  line-height: 22px;
  background-color: var(--color-text-product-accent);
}
.p-transportation-costs-problem__title {
  margin-top: var(--spacing_lg);
  text-align: center;
}
.p-transportation-costs-problem__list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--spacing_lg);
  width: 100%;
  max-width: var(--inner-main-pc);
  margin: var(--spacing_4xl) auto 0;
}
.p-transportation-costs-problem__card {
  overflow: hidden;
  border-radius: var(--radius_md);
}
.p-transportation-costs-problem__image {
  display: block;
  width: 100%;
  height: auto;
}
.p-transportation-costs-problem__card-body {
  min-height: 190px;
  margin-top: 0;
  padding: var(--spacing_lg);
  background-color: var(--color-bg-primary);
}
.p-transportation-costs-problem__card-description {
  margin-top: var(--spacing_xs);
}
@media (max-width: 1079px) {
  .p-transportation-costs-problem {
    padding-top: var(--spacing_2xl);
    padding-bottom: var(--spacing_2xl);
  }
  .p-transportation-costs-problem__list {
    grid-template-columns: 1fr;
    max-width: 342px;
    margin-top: var(--spacing_2xl);
  }
  .p-transportation-costs-problem__card-body {
    min-height: 0;
  }
  .p-transportation-costs-problem__image {
    height: 216px;
    object-fit: cover;
  }
}

.p-transportation-costs-feature {
  padding: var(--spacing_5xl) var(--gutter-sp);
}
.p-transportation-costs-feature__title {
  margin-top: var(--spacing_lg);
  text-align: center;
}
.p-transportation-costs-feature__list {
  display: grid;
  gap: var(--spacing_2xl);
  width: 100%;
  max-width: var(--inner-main-pc);
  margin: var(--spacing_4xl) auto 0;
}
.p-transportation-costs-feature__item {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  overflow: hidden;
  border-radius: var(--radius_lg);
  background-color: var(--smoke-5, #f2f5f9);
}
.p-transportation-costs-feature__body {
  min-width: 0;
  padding: 0 48px;
}
.p-transportation-costs-feature__number {
  margin-bottom: 8px;
}
.p-transportation-costs-feature__item-title {
  margin-bottom: 16px;
}
.p-transportation-costs-feature__lead {
  margin-bottom: var(--spacing_lg);
}
.p-transportation-costs-feature__point {
  display: flex;
}
.p-transportation-costs-feature__image {
  margin-top: 0;
  background-color: var(--smoke-20, #dde2e8);
}
.p-transportation-costs-feature__image img {
  display: block;
  width: 100%;
  height: auto;
}
.p-transportation-costs-feature__more {
  margin: var(--spacing_4xl) auto 0;
  background-color: var(--color-bg-product-primary);
}
@media (max-width: 1079px) {
  .p-transportation-costs-feature {
    padding-top: var(--spacing_2xl);
    padding-bottom: var(--spacing_xl);
  }
  .p-transportation-costs-feature__list {
    max-width: 342px;
    margin-top: 43px;
  }
  .p-transportation-costs-feature__item {
    grid-template-columns: 1fr;
  }
  .p-transportation-costs-feature__body {
    padding: var(--spacing_lg) var(--spacing_lg) 18px;
  }
  .p-transportation-costs-feature__item:nth-child(4) .p-transportation-costs-feature__body {
    padding-bottom: 9px;
  }
  .p-transportation-costs-feature__item-title.c-title-40b {
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 125%;
    letter-spacing: 1.4px;
  }
  .p-transportation-costs-feature__item:first-child .p-transportation-costs-feature__item-title span.u-display-none {
    letter-spacing: 0.8px;
  }
  .p-transportation-costs-feature__image {
    height: 262px;
  }
  .p-transportation-costs-feature__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .p-transportation-costs-feature__more {
    margin-top: 48px;
  }
}

.p-transportation-costs-flow {
  padding: var(--spacing_5xl) var(--gutter-sp) var(--spacing_2xl);
}
.p-transportation-costs-flow__title {
  margin-top: var(--spacing_lg);
  text-align: center;
}
.p-transportation-costs-flow__image {
  display: block;
  width: 100%;
  max-width: 1040px;
  height: auto;
  margin: var(--spacing_2xl) auto 0;
}
@media (max-width: 1079px) {
  .p-transportation-costs-flow {
    padding-top: var(--spacing_2xl);
  }
  .p-transportation-costs-flow__image {
    max-width: 342px;
  }
}

.p-transportation-costs-collaboration__inner {
  width: calc(100% - var(--gutter-sp) * 2);
  max-width: 1200px;
}
.p-transportation-costs-collaboration__box {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  height: 373px;
  overflow: hidden;
  border-radius: var(--radius_sm);
  background-color: var(--brand-color-payroll-primary);
}
.p-transportation-costs-collaboration__body {
  align-self: center;
  padding: var(--spacing_2xl);
}
.p-transportation-costs-collaboration__logo img {
  display: block;
  width: 344px;
  height: auto;
}
.p-transportation-costs-collaboration__description {
  max-width: 440px;
}
.p-transportation-costs-collaboration__button.c-primary-button {
  width: 100%;
  max-width: 363px;
  min-height: 59px;
  color: var(--color-text-primary);
  gap: var(--spacing_md);
}
.p-transportation-costs-collaboration__button .c-primary-button__icon {
  position: relative;
  inset: auto;
  transform: none;
}
.p-transportation-costs-collaboration__image {
  display: block;
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 1079px) {
  .p-transportation-costs-collaboration__box {
    grid-template-columns: minmax(0, 1fr);
    height: auto;
  }
  .p-transportation-costs-collaboration__body {
    padding: var(--spacing_lg);
  }
  .p-transportation-costs-collaboration__logo img {
    width: 168px;
  }
  .p-transportation-costs-collaboration__description {
    max-width: none;
  }
  .p-transportation-costs-collaboration__button.c-primary-button {
    min-height: 45px;
  }
  .p-transportation-costs-collaboration__image {
    height: auto;
    aspect-ratio: 896/600;
  }
}

.p-transportation-costs-benefit {
  padding: var(--spacing_5xl) 0 var(--spacing_2xl);
}
.p-transportation-costs-benefit__label.c-en-15sb {
  width: fit-content;
  margin: 0 auto;
  padding: 0 6px;
  font-size: 15px;
  line-height: 22px;
  background-color: var(--color-text-product-accent);
}
.p-transportation-costs-benefit__title {
  margin-top: var(--spacing_lg);
  text-align: center;
}
.p-transportation-costs-benefit__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--spacing_lg);
  width: 100%;
  max-width: var(--inner-main-pc);
  margin: var(--spacing_4xl) auto 0;
}
.p-transportation-costs-benefit__item {
  min-height: 262px;
  padding: var(--spacing_lg);
  border-radius: var(--radius_md);
  background-color: var(--expense-5);
}
.p-transportation-costs-benefit__item-inner {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: var(--spacing_lg);
}
.p-transportation-costs-benefit__icon {
  display: block;
  width: 56px;
  height: 56px;
}
.p-transportation-costs-benefit__item-title {
  margin-bottom: var(--spacing_md);
}
.p-transportation-costs-benefit__points.c-body-16r {
  padding-left: var(--spacing_lg);
  list-style: disc;
}
.p-transportation-costs-benefit__points.c-body-16r li {
  list-style: disc;
}
@media (max-width: 1079px) {
  .p-transportation-costs-benefit {
    padding-top: var(--spacing_2xl);
    padding-bottom: var(--spacing_xl);
  }
  .p-transportation-costs-benefit__list {
    grid-template-columns: 1fr;
    max-width: 342px;
    margin-top: var(--spacing_2xl);
  }
  .p-transportation-costs-benefit__item {
    min-height: 0;
  }
}

.p-transportation-costs-reason {
  padding: var(--spacing_5xl) var(--gutter-sp);
  background-color: var(--expense-5);
}
.p-transportation-costs-reason__label.c-en-15sb {
  width: fit-content;
  margin: 0 auto;
  padding: 0 6px;
  font-size: 15px;
  line-height: 22px;
  background-color: var(--color-text-product-accent);
}
.p-transportation-costs-reason__title {
  margin-top: var(--spacing_lg);
  text-align: center;
}
.p-transportation-costs-reason__list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  width: 100%;
  max-width: var(--inner-main-pc);
  margin: var(--spacing_4xl) auto 0;
}
.p-transportation-costs-reason__item {
  padding: var(--spacing_lg);
  border-radius: var(--radius_md);
  background-color: var(--color-bg-primary);
}
.p-transportation-costs-reason__icon {
  display: block;
  width: 56px;
  height: 56px;
  margin-bottom: var(--spacing_md);
}
.p-transportation-costs-reason__item-title {
  margin-bottom: var(--spacing_md);
}
@media (max-width: 1079px) {
  .p-transportation-costs-reason {
    padding-top: var(--spacing_2xl);
    padding-bottom: var(--spacing_2xl);
  }
  .p-transportation-costs-reason__list {
    grid-template-columns: 1fr;
    max-width: 342px;
    margin-top: 58px;
  }
}

.p-transportation-costs-faq {
  padding: var(--spacing_5xl) var(--gutter-sp);
  background-color: var(--expense-5);
}
.p-transportation-costs-faq__inner {
  width: 100%;
  max-width: var(--inner-main-pc);
  margin: 0 auto;
}
.p-transportation-costs-faq__label.c-index {
  min-height: 22px;
  margin: 0 auto;
}
.p-transportation-costs-faq__title {
  margin-top: var(--spacing_lg);
  text-align: center;
}
.p-transportation-costs-faq__list {
  width: 100%;
  max-width: 800px;
  margin: var(--spacing_4xl) auto 0;
}
.p-transportation-costs-faq__item {
  margin-bottom: var(--spacing_lg);
}
.p-transportation-costs-faq__item:last-child {
  margin-bottom: 0;
}
.p-transportation-costs-faq .c-faq-item__answer-text {
  padding-top: 0;
}
.p-transportation-costs-faq .c-faq-item__answer {
  color: var(--color-text-primary);
}
.p-transportation-costs-faq .c-faq-item__answer::before {
  color: var(--color-bg-product-primary);
}
@media (max-width: 1079px) {
  .p-transportation-costs-faq {
    padding-top: var(--spacing_2xl);
    padding-bottom: var(--spacing_2xl);
  }
  .p-transportation-costs-faq__label.c-index {
    margin-left: 0;
  }
  .p-transportation-costs-faq__title {
    text-align: left;
  }
  .p-transportation-costs-faq__list {
    margin-top: var(--spacing_xl);
  }
  .p-transportation-costs-faq .c-faq-item__answer-text {
    margin-right: 0;
  }
}

.p-transportation-costs-closing-cta {
  padding: var(--spacing_5xl) var(--gutter-sp);
  color: var(--color-text-inverse);
  background-color: var(--color-bg-product-primary);
}
.p-transportation-costs-closing-cta__inner {
  width: 100%;
  max-width: var(--inner-main-pc);
  margin: 0 auto;
}
.p-transportation-costs-closing-cta__title, .p-transportation-costs-closing-cta__description {
  text-align: center;
}
.p-transportation-costs-closing-cta__description {
  max-width: 800px;
  margin: var(--spacing_lg) auto 0;
}
.p-transportation-costs-closing-cta__content {
  display: grid;
  grid-template-columns: 345px 356px;
  align-items: center;
  justify-content: center;
  gap: var(--spacing_lg);
  margin-top: 54px;
}
.p-transportation-costs-closing-cta__buttons {
  display: grid;
  gap: var(--spacing_lg);
}
.p-transportation-costs-closing-cta__button.c-button {
  margin-top: 0;
}
.p-transportation-costs-closing-cta__button-label {
  color: var(--color-bg-product-primary);
}
.p-transportation-costs-closing-cta__button-title {
  color: var(--color-text-primary);
}
.p-transportation-costs-closing-cta__image {
  display: block;
  width: 356px;
  height: auto;
  border-radius: var(--radius_xs);
}
@media (min-width: 1080px) {
  .p-transportation-costs-closing-cta__button.c-button {
    margin-left: 25px;
  }
}
@media (max-width: 1079px) {
  .p-transportation-costs-closing-cta {
    padding-top: var(--spacing_2xl);
    padding-bottom: var(--spacing_5xl);
  }
  .p-transportation-costs-closing-cta__description {
    max-width: 342px;
  }
  .p-transportation-costs-closing-cta__content {
    grid-template-columns: minmax(0, 342px);
    gap: var(--spacing_2xl);
    margin-top: var(--spacing_md);
  }
  .p-transportation-costs-closing-cta__image {
    width: 342px;
  }
}

/*# sourceMappingURL=ad-transportation-costs.css.map */