/*
* top
*
* @author: kawai
* @date: 2021.01.26
* @breakpoint:
*    -> pc/[min-width:960px]
*    -> tab/[min-width:560 - max-width:959]
*    -> sp/[max-width:559]
*/
.top-title-en {
  font-size: min(6.8 * 1rem,6.8 * 10 / 1920 * 100vw);
  line-height: 1;
  position: relative;
  z-index: 2;
  margin-top: -1.0416666667vw;
  margin-bottom: 1.5625vw;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .top-title-en {
    font-size: 3.5416666667vw;
  }
}
@media screen and (-ms-high-contrast: none) and (min-width: 192rem), screen and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-title-en {
    font-size: 6.8rem;
  }
}
@media screen and (max-width: 559px) {
  .top-title-en {
    font-size: min(6.8 * 1rem,6.8 * 10 / 375 * 100vw);
  }
}
@media screen and (max-width: 559px) {
  .top-title-en {
    font-size: min(4 * 1rem,4 * 10 / 1920 * 100vw);
    line-height: 1.2;
    margin-top: 0;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none), screen and (max-width: 559px) and (-ms-high-contrast: active) {
  .top-title-en {
    font-size: 2.0833333333vw;
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none) and (min-width: 192rem), screen and (max-width: 559px) and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-title-en {
    font-size: 4rem;
  }
}
@media screen and (max-width: 559px) and (max-width: 559px) {
  .top-title-en {
    font-size: min(4 * 1rem,4 * 10 / 375 * 100vw);
  }
}

.top-title-ja {
  font-size: min(5 * 1rem,5 * 10 / 1920 * 100vw);
  margin-bottom: 1.5625vw;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .top-title-ja {
    font-size: 2.6041666667vw;
  }
}
@media screen and (-ms-high-contrast: none) and (min-width: 192rem), screen and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-title-ja {
    font-size: 5rem;
  }
}
@media screen and (max-width: 559px) {
  .top-title-ja {
    font-size: min(5 * 1rem,5 * 10 / 375 * 100vw);
  }
}
@media screen and (max-width: 559px) {
  .top-title-ja {
    font-size: min(2.4 * 1rem,2.4 * 10 / 1920 * 100vw);
    margin-bottom: 4vw;
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none), screen and (max-width: 559px) and (-ms-high-contrast: active) {
  .top-title-ja {
    font-size: 1.25vw;
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none) and (min-width: 192rem), screen and (max-width: 559px) and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-title-ja {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 559px) and (max-width: 559px) {
  .top-title-ja {
    font-size: min(2.4 * 1rem,2.4 * 10 / 375 * 100vw);
  }
}

.top-mv {
  position: relative;
}
.top-mv picture {
  width: 100%;
  height: 23.9583333333vw;
  max-height: 460px;
}
.top-mv__catch {
  position: absolute;
  top: 50%;
  right: 5%;
  transform: translateY(-60%);
  color: white;
}
.top-mv__catch h2 {
  font-size: min(7.2 * 1rem,7.2 * 10 / 1920 * 100vw);
  font-weight: bold;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .top-mv__catch h2 {
    font-size: 3.75vw;
  }
}
@media screen and (-ms-high-contrast: none) and (min-width: 192rem), screen and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-mv__catch h2 {
    font-size: 7.2rem;
  }
}
@media screen and (max-width: 559px) {
  .top-mv__catch h2 {
    font-size: min(7.2 * 1rem,7.2 * 10 / 375 * 100vw);
  }
}
.top-mv__catch p {
  font-size: min(3.2 * 1rem,3.2 * 10 / 1920 * 100vw);
  padding-left: 10px;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .top-mv__catch p {
    font-size: 1.6666666667vw;
  }
}
@media screen and (-ms-high-contrast: none) and (min-width: 192rem), screen and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-mv__catch p {
    font-size: 3.2rem;
  }
}
@media screen and (max-width: 559px) {
  .top-mv__catch p {
    font-size: min(3.2 * 1rem,3.2 * 10 / 375 * 100vw);
  }
}
.top-mv img {
  max-height: 300px;
}
@media screen and (max-width: 559px) {
  .top-mv__catch {
    position: absolute;
    top: auto;
    right: auto;
    bottom: 10%;
    transform: translateY(0);
    color: white;
    text-align: center;
    width: 100%;
  }
  .top-mv__catch h2 {
    font-size: min(3.6 * 1rem,3.6 * 10 / 1920 * 100vw);
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none), screen and (max-width: 559px) and (-ms-high-contrast: active) {
  .top-mv__catch h2 {
    font-size: 1.875vw;
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none) and (min-width: 192rem), screen and (max-width: 559px) and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-mv__catch h2 {
    font-size: 3.6rem;
  }
}
@media screen and (max-width: 559px) and (max-width: 559px) {
  .top-mv__catch h2 {
    font-size: min(3.6 * 1rem,3.6 * 10 / 375 * 100vw);
  }
}
@media screen and (max-width: 559px) {
  .top-mv__catch p {
    font-size: min(1.8 * 1rem,1.8 * 10 / 1920 * 100vw);
    padding: 0;
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none), screen and (max-width: 559px) and (-ms-high-contrast: active) {
  .top-mv__catch p {
    font-size: 0.9375vw;
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none) and (min-width: 192rem), screen and (max-width: 559px) and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-mv__catch p {
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 559px) and (max-width: 559px) {
  .top-mv__catch p {
    font-size: min(1.8 * 1rem,1.8 * 10 / 375 * 100vw);
  }
}

.top-company {
  background-repeat: no-repeat;
  background-position: left 30% bottom;
  background-image: url(../img/top/top_bg_company.svg);
  background-size: 140%;
}

.top-company-content {
  padding-top: 6.25vw;
  margin-bottom: 4.1666666667vw;
  display: flex;
  justify-content: center;
}
.top-company-content__info h4,
.top-company-content__info p {
  text-align: center;
}
.top-company-content__photo {
  width: 50%;
  height: 15.625vw;
  max-height: 300px;
}
@media screen and (max-width: 559px) {
  .top-company-content {
    background-size: 220%;
    background-position: left 5% top 20%;
    display: block;
    padding-top: 10.6666666667vw;
  }
  .top-company-content__info {
    width: auto;
    padding-left: 3%;
    padding-right: 3%;
    text-align: left;
  }
  .top-company-content__info h4,
  .top-company-content__info p,
  .top-company-content__info span {
    text-align: left;
  }
  .top-company-content__info p {
    margin-bottom: 8vw;
  }
  .top-company-content__photo {
    width: auto;
    height: auto;
  }
}

.top-company-btn {
  display: flex;
  justify-content: center;
  padding-bottom: 40px;
}
.top-company-btn li {
  margin: 0 20px;
}
@media screen and (max-width: 559px) {
  .top-company-btn {
    display: block;
  }
  .top-company-btn li {
    margin: 0 auto 10px;
  }
  .top-company-btn a {
    margin-left: auto;
    margin-right: auto;
  }
}

.top-business {
  margin-top: 6.25vw;
  background-image: url(../img/top/top_bg_business.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 120%;
}
@media screen and (max-width: 559px) {
  .top-business {
    margin-top: 16vw;
    background-image: url(../img/top/sp_top_bg_business.svg);
    background-size: 200%;
    background-position: left 30% top 60%;
    padding-bottom: 5.3333333333vw;
  }
}

.top-business h3 {
  text-align: right;
  margin-right: 3%;
}

.top-business h4 {
  text-align: right;
  margin-right: 3%;
}

.top-business-content {
  display: flex;
  justify-content: space-between;
  margin: 0 3%;
  padding-top: 20px;
}
@media screen and (max-width: 559px) {
  .top-business-content {
    display: block;
  }
}
.top-business-content li {
  width: 32%;
}
@media screen and (max-width: 559px) {
  .top-business-content li {
    width: auto;
  }
}
.top-business-content__item {
  background-color: white;
  border: 1px solid #C4C4C4;
  padding: 1.0416666667vw;
  height: 21.875vw;
  max-height: 420px;
  min-height: 260px;
}
.top-business-content__svg-outer {
  height: 9.375vw;
  max-height: 180px;
  margin-bottom: 1.0416666667vw;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 559px) {
  .top-business-content__svg-outer {
    display: block;
  }
}
.top-business-content__svg img {
  height: 100%;
  width: auto;
}
.top-business-content__cutting {
  height: 5.1041666667vw;
  max-height: 98px;
}
.top-business-content__robot {
  height: 5.8333333333vw;
  max-height: 112px;
}
.top-business-content__writer {
  height: 4.4270833333vw;
  max-height: 85px;
}
.top-business-content__item h5 {
  font-size: clamp(2 * 1rem,3 * 10 / 1920 * 100vw,4 * 1rem);
  text-align: center;
  margin-bottom: 1.0416666667vw;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .top-business-content__item h5 {
    font-size: 1.5625vw;
  }
}
@media screen and (-ms-high-contrast: none) and (min-width: 192rem), screen and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-business-content__item h5 {
    font-size: 3rem;
  }
}
@media screen and (max-width: 559px) {
  .top-business-content__item h5 {
    font-size: min(3 * 1rem,3 * 10 / 375 * 100vw);
  }
}
.top-business-content__item p {
  font-size: clamp(1.2 * 1rem,2.2 * 10 / 1920 * 100vw,3.2 * 1rem);
  display: flex;
  margin: 0 auto;
  width: 85%;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .top-business-content__item p {
    font-size: 1.1458333333vw;
  }
}
@media screen and (-ms-high-contrast: none) and (min-width: 192rem), screen and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-business-content__item p {
    font-size: 2.2rem;
  }
}
@media screen and (max-width: 559px) {
  .top-business-content__item p {
    font-size: min(2.2 * 1rem,2.2 * 10 / 375 * 100vw);
  }
}
@media screen and (max-width: 559px) {
  .top-business-content__svg-outer {
    position: absolute;
  }
  .top-business-content__item {
    padding: 6.4vw 6.4vw 6.4vw 35.7333333333vw;
    min-height: 0;
    height: auto;
    margin-bottom: 20px;
    position: relative;
  }
  .top-business-content li:first-child .top-business-content__item .top-business-content__svg-outer {
    left: 11%;
    top: 22%;
  }
  .top-business-content li:nth-child(2) .top-business-content__item .top-business-content__svg-outer {
    left: 8%;
    top: 22%;
  }
  .top-business-content li:nth-child(3) .top-business-content__item .top-business-content__svg-outer {
    left: 6%;
    top: 24%;
  }
  .top-business-content__item h5 {
    font-size: min(2 * 1rem,2 * 10 / 1920 * 100vw);
    text-align: left;
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none), screen and (max-width: 559px) and (-ms-high-contrast: active) {
  .top-business-content__item h5 {
    font-size: 1.0416666667vw;
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none) and (min-width: 192rem), screen and (max-width: 559px) and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-business-content__item h5 {
    font-size: 2rem;
  }
}
@media screen and (max-width: 559px) and (max-width: 559px) {
  .top-business-content__item h5 {
    font-size: min(2 * 1rem,2 * 10 / 375 * 100vw);
  }
}
@media screen and (max-width: 559px) {
  .top-business-content__item p {
    font-size: min(1.6 * 1rem,1.6 * 10 / 1920 * 100vw);
    text-align: left;
    display: block;
    width: auto;
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none), screen and (max-width: 559px) and (-ms-high-contrast: active) {
  .top-business-content__item p {
    font-size: 0.8333333333vw;
  }
}
@media screen and (max-width: 559px) and (-ms-high-contrast: none) and (min-width: 192rem), screen and (max-width: 559px) and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-business-content__item p {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 559px) and (max-width: 559px) {
  .top-business-content__item p {
    font-size: min(1.6 * 1rem,1.6 * 10 / 375 * 100vw);
  }
}
@media screen and (max-width: 559px) {
  .top-business-content__cutting {
    height: 21.0666666667vw;
    top: 22%;
  }
  .top-business-content__robot {
    height: 21.3333333333vw;
    top: 20%;
  }
  .top-business-content__writer {
    height: 18.9333333333vw;
    top: 22%;
  }
}

.top-product {
  margin-top: 7.8125vw;
  padding-top: 1.0416666667vw;
  background-image: url(../img/top/top_bg_product.svg);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100%;
}
.top-product h3 {
  margin-left: 3%;
}
.top-product h4 {
  margin-left: 3%;
}
@media screen and (max-width: 559px) {
  .top-product {
    margin-top: 16vw;
    background-image: url(../img/top/sp_top_bg_product.svg);
    background-position: center top 55%;
    background-size: 102%;
  }
}

.top-product-content {
  display: flex;
  justify-content: center;
  padding-bottom: 5.2083333333vw;
}
.top-product-content li {
  width: 15.625vw;
  margin: 0 1.7708333333vw;
}
.top-product-content__item img {
  display: block;
}
.top-product-content__item h5 {
  background-color: rgb(10, 10, 10);
  color: white;
  text-align: center;
  font-size: min(2 * 1rem,2 * 10 / 1920 * 100vw);
  padding: 1.0416666667vw;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .top-product-content__item h5 {
    font-size: 1.0416666667vw;
  }
}
@media screen and (-ms-high-contrast: none) and (min-width: 192rem), screen and (-ms-high-contrast: active) and (min-width: 192rem) {
  .top-product-content__item h5 {
    font-size: 2rem;
  }
}
@media screen and (max-width: 559px) {
  .top-product-content__item h5 {
    font-size: min(2 * 1rem,2 * 10 / 375 * 100vw);
  }
}
@media screen and (max-width: 559px) {
  .top-product-content {
    display: block;
    padding-top: 8vw;
  }
  .top-product-content li {
    width: 300px;
    margin: 0 auto 20px;
  }
}

.top-product-btn {
  padding-bottom: 5.2083333333vw;
}
.top-product-btn ._btn {
  margin: 0 auto;
}
@media screen and (max-width: 559px) {
  .top-product-btn {
    padding-bottom: 13.3333333333vw;
  }
}