body {
  margin: auto;
  background: #fff;
  font-family: "Noto Sans JP", "Hiragino Sans", 'UD Shin Go Light', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
  max-width: 100%;
  font-size: 16px;
  line-height: 1.4;
  color: #111827;
  font-weight: 400;
}

#content {
  padding: 0;
}

a {
  transition: .3s;
}

.section-inner {
  max-width: 1200px;
  margin: auto;
}

#footer,
#footer.product_footer .footer__bottom {
  padding: 28px 32px;
  max-width: 1921px;
  margin: auto;
}

sub {
  font-size: 55%;
}

.center {
  text-align: center;
}

img {
  max-width: 100%;
  height: auto;
}
.br_tb,
.tb_only,
.under500{
  display: none;
}
/* animation style*/

@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fluffy {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-20px);
  }
}

@keyframes fluffy2 {
  0% {
    opacity: 1;
    transform: translateX(0);
  }

  50% {
    opacity: 1;
  }

  70% {
    opacity: 0;
    transform: translateX(-80px);
  }

  90% {
    transform: translateX(0);
    opacity: 0;
  }

  100% {
    opacity: 1;

  }

}

.fadeIn {
  opacity: 0;
}

.fadeIn.is-active {
  animation: fadeIn .6s forwards;
}

.contact_area .contact:nth-of-type(2),
.assignment_list .assignment:nth-of-type(2),
.contribution_box .contribution:nth-of-type(2),
.lineup_list .lineup:nth-of-type(2),
.support_list .support:nth-of-type(2),
.flow_list .flow_item:nth-of-type(2),
.quality_list .quality:nth-of-type(2),
.achievements_list .achievements:nth-of-type(2) {
  animation-delay: .3s;
}

.contact_area .contact:nth-of-type(3),
.assignment_list .assignment:nth-of-type(3),
.lineup_list .lineup:nth-of-type(3),
.support_list .support:nth-of-type(3),
.flow_list .flow_item:nth-of-type(3),
.quality_list .quality:nth-of-type(3) {
  animation-delay: .6s;
}

.assignment_list .assignment:nth-of-type(4),
.support_list .support:nth-of-type(4) {
  animation-delay: .9s;
}

.assignment_list .assignment:nth-of-type(5),
.support_list .support:nth-of-type(5) {
  animation-delay: 1.2s;
}

.support_list .support:nth-of-type(6) {
  animation-delay: 1.5s;
}

.mainvisual__img img {
  animation: fluffy 5s infinite;
}

.section-mainvisual::after,
.section-mainvisual::before {
  animation: fluffy2 8s infinite;
}

.mainvisual__img::before,
.mainvisual__text::before {
  animation: fluffy2 8s 3s infinite;
}

.mainvisual__img::after {
  animation: fluffy2 8s 6s infinite;
}

/*END animation style*/
/* -----header----- */
.content-header {
  display: flex;
  max-width: 1600px;
  height: 80px;
  margin: auto;
  padding: 2px 0;
  justify-content: space-between;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10;
}

.content-header .header_contact a {
  position: relative;
  display: flex;
  width: 200px;
  padding: 8px 0 10px;
  flex-direction: column;
  justify-content: center;
  border-radius: 50px;
  color: #028894;
  background: #fff;
  border: 3px solid #D0EDF3;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  overflow: hidden;
  z-index: 1;
}

.content-header .header_contact a::after {
  content: "";
  position: absolute;
  display: block;
  width: 8px;
  height: 8px;
  border-right: 2px solid #028894;
  border-top: 2px solid #028894;
  transform: rotate(45deg);
  right: 20px;
  background: none;
}

.content-header .header_contact a::before {
  background: #D0EDF3;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}

.content-header .header_contact a:hover {
  opacity: 1;
}

.content-header .header_contact a:hover::before {
  transform: scale(1, 1);
}
.content-header .header_logo{
  width: 150px;
}

/* -----section-mainvisual----- */
.section-mainvisual {
  padding: 120px 0;
  background-color: #00B4C5;
  position: relative;
  overflow: hidden;
}

.section-mainvisual::before,
.section-mainvisual::after,
.mainvisual__img::before,
.mainvisual__img::after,
.mainvisual__text::before {
  display: block;
  content: '';
  position: absolute;
}

.section-mainvisual::before {
  bottom: -6.5px;
  left: -209px;
  width: 500px;
  height: 224.5px;
  background: url(/img/motor_solution/mv_motor_solution_sub_02.webp) no-repeat center top;
  background-size: cover;
}

.section-mainvisual::after {
  top: 157px;
  right: -41px;
  width: 151px;
  height: 68.5px;
  background: url(/img/motor_solution/mv_motor_solution_sub_04.webp) no-repeat center top;
  background-size: cover;
}

.section-mainvisual .section-inner {
  position: relative;
  max-width: 1554px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.mainvisual__img {
  position: relative;
}

.mainvisual__img::before {
  top: -48px;
  left: -222px;
  width: 363px;
  height: 174px;
  background: url(/img/motor_solution/mv_motor_solution_sub_01.webp) no-repeat center top;
  background-size: cover;
}

.mainvisual__img::after {
  top: -48px;
  right: 165px;
  width: 325.5px;
  height: 96px;
  background: url(/img/motor_solution/mv_motor_solution_sub_03.webp) no-repeat center top;
  background-size: cover;
}

.mainvisual__text::before {
  bottom: -153px;
  right: -201px;
  width: 375px;
  height: 202px;
  background: url(/img/motor_solution/mv_motor_solution_sub_05.webp) no-repeat center top;
  background-size: cover;
}

/* メインビジュアル テキスト */
.mainvisual__text {
  position: relative;
  max-width: 740px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 37px;
  z-index: 1;
}

.mainvisual__title {
  color: #FFF;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  font-size: 56px;
  font-weight: 900;
  line-height: 1.2;
}

.mainvisual__subtitle {
  color: #FFF;
  font-size: 28px;
  font-weight: 500;
}

.mainvisual__points {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 33px;
  align-self: stretch;
}

.mainvisual__points .point {
  display: flex;
  width: 190px;
  height: 190px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 120px;
  background: #FDFCDB;
  box-shadow: 0 0 24px 0 rgba(255, 98, 64, 0.35);
}

.mainvisual__points .point .point_text {
  color: #01A8AE;
  text-align: center;
  font-size: 32px;
  font-weight: 700;
  position: relative;
  line-height: 1.2;
  z-index: 1;
}

.mainvisual__points .point .point_text span {
  position: absolute;
  left: 0;
  top: 0;
  text-shadow: 0px 5px 10px rgba(100, 100, 100, 0.10);
  -webkit-text-stroke-width: 8px;
  -webkit-text-stroke-color: #FFF;
  letter-spacing: 0;
  z-index: -1;
}

.contact_area {
  display: flex;
  gap: 16px;
}
.contact_area .contact{
  cursor: pointer;
}
.contact_area .contact a {
  position: relative;
  display: flex;
  width: 234px;
  padding: 15px 0 17px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  flex-direction: column;
  border-radius: 50px;
  color: #fff;
  text-align: center;
  background: #F97316;
  font-size: 20px;
  font-weight: 500;
  position: relative;
  z-index: 1;
  overflow: hidden;
  cursor: pointer;
}

.contact_area .contact a::after {
  top: 50%;
  content: "";
  position: absolute;
  display: block;
  width: 8px;
  height: 8px;
  margin-top: -5px;
  border-right: 2px solid #fff;
  border-top: 2px solid #fff;
  right: 20px;
  background: none;
  transform: rotate(45deg);

}

.contact_area .contact.item01 a {
  color: #028894;
  background: #fff;
}


.contact_area .contact.item01 a::after {
  border-right: 2px solid #028894;
  border-top: 2px solid #028894;
}

.contact_area .contact a::before {
  background: #ffa668;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}

.contact_area .contact.item01 a::before {
  background: #D0EDF3;
}

.contact_area .contact a:hover::before {
  transform: scale(1, 1);
}

.contact_area .contact.item01 a:hover::after {
  border-right: 2px solid #028894;
  border-top: 2px solid #028894;
}

.contact_area .contact a:hover {
  opacity: 1;
}

/* content01（課題セクション） */
.section-content.content01 {
  background: #D0EDF3;
  padding: 80px 0;
  border-radius: 80px 80px 0 0;
  text-align: center;
}

.section-content.content01 .title {
  color: #028894;
  font-size: 48px;
  font-weight: 600;
  letter-spacing: 1.44px;
  margin-bottom: 41px;
}

.section-content.content01 .underline {
  position: relative;
  z-index: 1;
  display: inline-block;
}

.section-content.content01 .underline::after {
  width: 100%;
  height: 15px;
  background: #FFF22C;
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}

.assignment_list {
  display: flex;
  gap: 32px;
  justify-content: center;
}

.assignment {
  border-radius: 100px;
  background: #FFF;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.06);
  display: flex;
  width: 200px;
  height: 200px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.assignment img {
  object-fit: contain;
}

.assignment p {
  font-size: 18px;
  color: #028894;
  font-weight: 700;
}

/* content02（テキストセクション） */
.content02 {
  background: #fff;
  padding: 40px 0 80px;

}

.content02,
.content02 .section-inner {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 41px;
}

.content02 .bg_blue {
  padding: 38px 78px;
  border-radius: 20px;
  background: rgba(208, 237, 243, 0.50);
}

.content02 .bg_blue .title {
  margin-bottom: 5px;
}
.content02 h2.title,
.content02 .wide_image{
  margin: auto;
}
.content02 h2.title{
  max-width: 1388px;
}
 .content02 .wide_image{
  padding: 0 25px;
}

.contribution_title {
  padding: 20px 0;
}

.contribution_box {
  display: flex;
  justify-content: center;
  gap: 60px;
}

.contribution_box .contribution {
  display: flex;
  padding: 30px 24px 24px 24px;
  width: 522px;
  flex-direction: column;
  gap: 25px;
  border-radius: 10px;
  background: rgba(231, 245, 248, 0.65);
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.10);
}

.contribution_box .contribution .title {
  text-align: center;
  font-size: 24px;
  font-weight: 700;
}
.contribution_box .note{
  margin-top: 25px;
}
.note {
  color: #028894;
  font-size: 12px;
  font-weight: 500;
}

.regulation_list {
  display: flex;
  flex-direction: column;
  gap: 19px;
  margin-left: 30px;
}

.regulation_list .regulation {
  display: flex;
  align-items: center;
  gap: 16px;
}

.regulation_list .regulation .year {
  display: flex;
  width: 80px;
  height: 21px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  border-radius: 16px;
  background: #73BE45;
  color: #FFF;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}

.regulation_list .regulation.item02 .year {
  background: #21AC7E;
}

.regulation_list .regulation.item03 .year {
  background: #01A8AE;
}

.regulation_list .regulation.item04 .year {
  background: #00B4C5;
}

.regulation_list .regulation .text {
  font-weight: 500;
}

/* content03（ラインナップセクション） */
.content03_01,
.content05_02 {
  background: url("/img/motor_solution/bg_motor_solution_01.svg")repeat center top;
  background-size: 14px;
  padding: 80px 0;
}

.content05_02 {
  padding: 70px 0;
}

.content03_02 {
  background: #00B4C5;
  padding: 55px 0;
  overflow: hidden;
  position: relative;
}

.lineup_list {
  margin: 30px auto 0;
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
  justify-content: center;
}

.lineup_list .lineup {
  display: flex;
  padding: 50px;
  width: calc(50% - 120px);
  flex-direction: column;
  justify-content: center;
  gap: 32px;
  border-radius: 20px;
  background: #FFF;
  box-shadow: 4px 4px 20px 0 rgba(0, 0, 0, 0.10);
}

.lineup_list .lineup.item01 {
  width: 100%;
    align-items: center;
  flex-direction: row;
  justify-content: left;
}

.lineup_list .lineup_text .title {
  font-size: 24px;
  font-weight: 700;
  position: relative;
  margin-bottom: 16px;
  padding-bottom: 16px;
}

.lineup_list .lineup.item01 .lineup_text {
  width: 711px;
}

.lineup_list .item03 .lineup_text .title {
  margin-bottom: 0;
  padding-bottom: 0;
}

.lineup_list .lineup_text .title::before {
  display: block;
  content: '';
  width: 100%;
  height: 1px;
  background: #CDCDCD;
  position: absolute;
  bottom: 0;
}

.lineup_list .item03 .lineup_text .title::before {
  display: none;
}

.features_title {
  color: #028894;
  font-size: 18px;
  font-weight: 900;
}

.features_list {
  margin-top: 8px;
}

.features_list li {
  padding: 10px 15px;
  align-items: center;
  display: flex;
  gap: 15px;
  border-radius: 5px;
  background: rgba(208, 237, 243, 0.50);
}

.features_list li::before {
  content: "⚫︎";
  color: #028894;
  font-size: 6px;
}

.features_list li:nth-of-type(n+2) {
  margin-top: 6px;
}

.lineup_list .lineup.item01 .lineup_img {
  position: relative;
}

.lineup_list .lineup.item01 .lineup_pick {
  position: absolute;
  top: -17px;
  left: -28px;
  display: inline-block;
  border-radius: 40px;
  background: #028894;
  color: #FFF;
  text-align: center;
  font-size: 24px;
  font-weight: 900;
  line-height: 12.8px;
  /* 53.333% */
  letter-spacing: 1.2px;
  padding: 15px 69px;
}

/* content03_02 */
.content03_02 .section-inner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
  position: relative;
}

.content03_02 .section-inner::before,
.content03_02 .section-inner::after,
.contact_text::before,
.contact_text::after {
  position: absolute;
  display: block;
  content: '';
}

.content03_02 .section-inner::before {
  width: 272px;
  height: 130px;
  left: -175px;
  top: -43px;
  background: url(/img/motor_solution/img_motor_solution_09.webp) no-repeat center top;
  background-size: cover;
}

.content03_02 .section-inner::after {
  width: 271px;
  height: 146px;
  right: -140px;
  top: 6px;
  background: url(/img/motor_solution/img_motor_solution_08.webp) no-repeat center top;
  background-size: cover;
}

.contact_text {
  color: #fff;
  margin: auto;
  width: fit-content;
  position: relative;
}

.contact_text::before {
  width: 150px;
  height: 148px;
  left: -150px;
  top: 0;
  background: url(/img/motor_solution/img_motor_solution_06.webp) no-repeat center top;
  background-size: cover;
}

.contact_text::after {
  width: 76px;
  height: 56px;
  right: 50px;
  top: -10px;
  background: url(/img/motor_solution/img_motor_solution_07.webp) no-repeat center top;
  background-size: cover;
  z-index: 1;
}

.contact_text .title,
.content06_02 .title {
  color: #FFF;
  font-size: 36px;
  font-weight: 700;
  line-height: 45.6px;
  /* 126.667% */
  letter-spacing: 2.16px;
  margin-bottom: 16px;
}

.contact_text .sub_text {
  font-weight: 500;
  line-height: 24px;
  /* 150% */
}

.content03_02 .contact_area a,
.content06_02 .contact_area a {
  box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.13);
}

.content03_02 .contact_area,
.content06_02 .contact_area {
  justify-content: center;
}

/* content04（TMEICならラクラクセクション） */
.content04 {
  background: #E7F5F8;
  padding: 63px 0 80px;
}

.content04 .section-inner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 51px
}

.support_box {
  position: relative;
  display: flex;
  margin-top: 40px;
  padding: 0 40px 45px 40px;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 35px;
  background: #FFF;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.10);
}

.support_box .subtitle {
  position: absolute;
  top: -40px;
  left: 0;
  right: 0;
  margin: auto;
  position: relative;
  padding: 20px 90px;
  color: #FFF22C;
  text-align: center;
  font-size: 38px;
  font-weight: 500;
  border-radius: 50px;
  background: #00B4C5;
  z-index: 1;
}

.support_box .subtitle::before {
  content: "";
  position: absolute;
  bottom: -7px;
  left: 50%;
  width: 35px;
  height: 35px;
  box-sizing: border-box;
  background-color: #00B4C5;
  rotate: 135deg;
  translate: -50%;
  z-index: -1;
}

.support_list {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}

.support_list .support {
  width: calc(33.333% - 24px);
  word-break: break-all;
  display: flex;
  gap: 20px;
  padding: 30px 0;
  align-items: center;
}

.support_list .support .support_text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
  width: 218px;
}

.support_list .support picture {
  width: 100px;
  height: 100px;
}

.support_list .support .support_subtitle {
  color: #F97316;
  font-size: 24px;
  font-weight: 700;

}

/* content05（導入の流れセクション） */
/* content05_01 */
.content05_01 {
  background: #fff;
  padding: 80px 0;
}

.content05_01 .title {
  color: #028894;
  font-size: 48px;
  font-weight: 700;
  line-height: 43.2px;
  /* 90% */
  letter-spacing: 7.2px;
  margin-bottom: 63px;
}

.content05_01 .flow_list {
  display: flex;
  gap: 109px;
  flex-wrap: wrap;
  justify-content: center;
  color: #028894;
  font-size: 28px;
  font-weight: 600;
  line-height: 36px;
}

.content05_01 .flow_list .flow_item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: 315px;
  position: relative;
}

.content05_01 .flow_list .flow_item:nth-of-type(n+2):after {
  content: "";
  position: absolute;
  top: 50%;
  left: -60px;
  transform: translateY(-50%);
  border: 21px solid transparent;
  border-left: 21px solid #028894;
}

.content05_01 .flow_list .flow_item .step {
  color: #00B4C5;
  font-size: 20px;
  border-radius: 30px;
  width: 100px;
  border: 3px solid #00B4C5;
  line-height: 1;
  width: 98%;
  padding: 2px 0;
}

/* content05_02 */
.content05_02 .section-inner {
  max-width: 1258px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 28px;
}

.point_list {
  display: flex;
  gap: 40px
}

.point_item {
  display: flex;
  padding: 30px;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.04);
}

.point_item.item01 {
  gap: 14px;
  width: 538px;
}
.point_item.item01 .note{
    margin-left: 1.2rem;
}
.point_item.item01 .note span{
      margin-left: -1rem;
}
.point_item.item02 {
  gap: 9px;
}

.point_item.item03 {
  gap: 19px;
  margin-top: 17px;
}

.point_item.item01+.fadeIn {
  width: 615px;

}

.point_support {
  display: flex;
  align-items: center;
  gap: 13px 18px;
  max-width: 300px;
  justify-content: center;
  flex-wrap: wrap;
}

.point_support li {
  display: flex;
  align-items: center;
  flex-direction: column;
  width: 137px;
  padding: 15px 0;
  color: #393939;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  border-radius: 10px;
  background: #E7F5F8;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.10);
}

.item03 .point_support li {
  padding: 7px 0;

}

.point_title {
  color: #FFF22C;
  text-align: center;
  padding: 6px 0;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  /* 130.909% */
  border-radius: 25px;
  background: #00B4C5;
  max-width: 295px;
  width: 100%;
}

.point_item .subtitle {
  font-weight: 700;
  text-align: center;
}

.select-wrap {
  position: relative;
  width: 100px;
}

/* ▼アイコン */
.select-wrap::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid #00B4C5;
  transform: translateY(-50%);
  pointer-events: none;
}

#motorSelect {
  width: 100%;
  padding: 0px 10px 0 30px;
  font-weight: 500;
  color: #00B4C5;
  border: 2px solid #00B4C5;
  border-radius: 5px;
  background: #fff;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
  height: 35px;
}

/* フォーカス時 */
#motorSelect:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(31, 182, 195, 0.25);
}

/* 未選択時（プレースホルダー風） */
#motorSelect:has(option[value=""]:checked) {
  color: #aaa;
  font-weight: normal;
}

.select-row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-bottom: 3px;
}

.select_text {
  font-size: 20px;
  font-weight: 700;
}

.select_text .text_blue {
  color: #01A8AE;
  font-size: 24px;
}

select {
  padding: 10px 16px;
  font-size: 16px;
}

button {
  max-width: 392px;
  width: 100%;
  padding: 9px 0;
  font-weight: 700;
  background: #00B4C5;
  color: #fff;
  border-radius: 3px;
  border: none;
  cursor: pointer;
  font-size: 16px;
  transition: .3s;
}

button:hover {
  background: #FFF22C;
  color: #00B4C5;
}

.result {
  display: flex;
  justify-content: center;
  gap: 5px;
  text-align: right;
  font-size: 14px;
  font-weight: 700;
  align-items: end;
  margin-bottom: 10px;
}

.result .price {
  font-family: "Roboto", sans-serif;
  font-size: 53px;
  font-weight: bold;
  color: #028894;
  text-align: right;
  font-weight: 900;
  line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

#priceValue {
  padding: 0 12px;
  position: relative;
}

#priceValue::after {
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  z-index: -1;
  left: 0;
  width: 100%;
  height: 18px;
  background: #FFF22C
}


.content05_02 .note,
.content06_01 .note {
  font-size: 14px;
}

/* quality_box */
.quality_box {
  margin-top: 20px;
  display: flex;
  padding: 45px 48px 50px 48px;
  flex-direction: column;
  align-items: center;
  border-radius: 25px;
  background: #00B4C5;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.10);
}

.quality_box .title {
  color: #FFF22C;
  font-size: 40px;
  font-weight: 700;
  line-height: 38.4px;
  letter-spacing: 2px;
  margin-bottom: 48px;
}

.quality_list {
  display: flex;
  gap: 48px;
}

.quality_list .quality {

  display: flex;
  width: 320px;
  height: 320px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 170px;
  background: #FFF;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.10);
}

.quality_list .quality_title {
  color: #028894;
  font-size: 24px;
  font-weight: 700;
}

/* content06（導入実績セクション） */
.content06 {
  position: relative;
  overflow: hidden;
}

.content06_01 {
  background: #fff;
  padding: 80px 0;
}

.content06_02 {
  background: #00B4C5;
  padding: 50px 0;
}


.content06_01 .achievements_list {
  display: flex;
  gap: 50px;
  margin-top: 48px;
  justify-content: center;
}

.content06_01 .achievements_list .achievements {
  display: flex;
  padding: 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  border-radius: 12px;
  border: 4px solid #028894;
  background: #FFF;
  box-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.06);
  position: relative;
}

.achievements_list .achievements_title {
  font-size: 24px;
  font-weight: 600;
}

.achievements_list .achievements_box {
  border-radius: 5px;
  background: #E7F5F8;
  padding: 14px 20px;
}

.content06_02 .section-inner {
  display: flex;
  flex-direction: column;
  gap: 36px;
  position: relative;
}

.content06_01 .achievements_list .achievements::before,
.content06_02 .section-inner::before,
.content06_02 .section-inner::after {
  position: absolute;
  display: block;
  content: '';
}

.content06_01 .achievements_list .achievements::before {
  width: 62px;
  height: 62px;
  left: -30px;
  top: -30px;
  background: url(/img/motor_solution/icon__motor_solution_15.webp) no-repeat center top;
  background-size: cover;
}

.content06_02 .section-inner::before {
  width: 272px;
  height: 130px;
  left: -175px;
  top: -193px;
  background: url(/img/motor_solution/img_motor_solution_09.webp) no-repeat center top;
  background-size: cover;
}

.content06_02 .section-inner::after {
  width: 271px;
  height: 146px;
  right: -140px;
  top: -150px;
  background: url(/img/motor_solution/img_motor_solution_08.webp) no-repeat center top;
  background-size: cover;
}
/* ------------Responsive（1700）------------ */

@media (max-width: 1700px) {
.content02 .wide_image{
  max-width: 1160px;
}
}

/* ------------Responsive（1600）------------ */
@media (max-width: 1600px) {
  .content01 .section-inner,
    .content03 .content03_01 .section-inner,
  .content04 .section-inner,
  .content05 .content05_01 .section-inner,
  .content06 .content06_01 .section-inner {
    padding: 0 25px;

  }

  .content02 .title+.section-inner {
    padding: 0 29px;
    max-width: 1052px;
  }

  .content02 .wide_image+.section-inner {
    padding: 0 29px;
  }

  .content03 .content03_02 .section-inner{
    padding: 0 0 0 30px;
  }
  .content06 .content06_02 .section-inner {
    padding: 0 30px;
  }

  .content05 .content05_02 .section-inner {
    padding: 0 40px;
  }

  /* -----header----- */
  .content-header {
    padding: 2px 50px;
  }

  /* -----section-mainvisual----- */


  .section-mainvisual::after {
    top: 284px;
    right: -59px;
  }

  .section-mainvisual .section-inner {
    padding: 0 64px 0 81px;
    justify-content: center;
    align-items: end;
  }

  .mainvisual__img {
    width: 598px;
    margin-right: -77px;
    z-index: 10;
  }

  .mainvisual__img::before {
    top: -112px;
    left: -142px;
  }

  .mainvisual__img::after {
    top: -180px;
    right: 0;
  }

  .mainvisual__text::before {
    bottom: -157px;
    right: -141px;
  }

  /* content02（テキストセクション） */
  .content02 .bg_blue {
    padding: 38px 67px;
  }

  .contribution_box .contribution {
    width: 50%;
  }
.content02 h2.title {
  padding: 0 25px;
  margin: auto;
}
.content02 h2.title{
  max-width: 1170px;
}


  /* content03_02 */
  .content03_02 .section-inner {
    gap: 35px;
  }

  .contact_text::after {
    right: -80px;
    top: 0;
  }
  .lineup_list .lineup.item01{
        width: -webkit-fill-available;
  }

  /* content04（TMEICならラクラクセクション） */
  .content04 .pcwideonly {
    display: none;
  }

  /* content05_02 */
  .point_item.item01 {
    width: 47%;
  }

  .point_item.item01+.fadeIn {
    width: 49%;
  }

  /* content06（導入実績セクション） */

  .content06_02 .section-inner::before {

    left: -100px;
    top: -12px;
  }

  .content06_02 .section-inner::after {
    right: -155px;
    top: 37px;
  }

}

/* ------------Responsive（1200）------------ */
@media (max-width: 1200px) {
  .section-mainvisual .section-inner {
    flex-direction: column-reverse;
  }

  .section-mainvisual .section-inner,
  .mainvisual__text {
    align-items: center;
  }

  .mainvisual__img {
    z-index: 0;
    margin-right: 0px;
    margin-left: -25%;
    margin-top: 0;
  }

  .section-mainvisual::before {
    bottom: 17px;
  }

  .section-mainvisual::after {
    top: 507px;
    right: -30px;
  }

  .mainvisual__img::before {
    top: -500px;
    left: -242px;
  }

  .mainvisual__img::after {
    top: -630px;
    right: -440px;
  }

  .mainvisual__text::before {
    bottom: -360px;
    right: -250px;
  }

  .assignment_list {
    flex-wrap: wrap;
    max-width: 768px;
    justify-content: center;
    margin: auto;
  }

  .content05_01 .flow_list,
  .quality_list {
    flex-direction: column;
    align-items: center;
  }

  .content05_01 .flow_list {
    gap: 83px;
  }

  .quality_list {
    gap: 48px;
  }

  .content05_01 .flow_list .flow_item {
    max-width: 500px;
    width: 100%;
  }

  .content05_01 .flow_list .flow_item:nth-of-type(n+2):after {
    top: -50px;
    left: 45%;
    border: 21px solid transparent;
    border-left: 21px solid #028894;
    transform: rotate(90deg);
  }


}

/* ------------Responsive（1024）------------ */
@media (max-width: 1024px) {
  #footer,
#footer.product_footer .footer__bottom {
  padding: 28px 0 24px;
}
.br_tb{
  display: block;
}
.support_box{
  margin-top: 80px;
}
.support_box .subtitle{
  top: -80px;
}
.support_box .subtitle{
  border-radius: 100px;
}
.support_list{
    flex-direction: column;
    align-items: center;
    gap: 0;
    margin: -50px auto 0;
}
.support_list .support{
padding: 25px 0;
}
.support_list .support{
  width: 100%;
}
.support_list .support .support_text{
  justify-content: flex-start;
  width: auto;
}
.support_list .support br{
  display: none;
}
}
/* ------------Responsive（768）------------ */
@media (max-width: 768px) {
  .content02 .title+.section-inner{

        padding: 0 40px;
  }
  /* -----header----- */
  .content-header {
    padding: 2px 25px;
  }

  /* -----section-mainvisual----- */
.section-mainvisual{
    padding: 117px 0 57px;
}
.mainvisual__text{
  gap: 25px;
}
.mainvisual__title{
font-size: 50px;
}
.mainvisual__subtitle{
 font-size: 24px; 
}
.mainvisual__points .point{
  width: 173px;
  height: 173px;
}
.contact_area .contact a{
  width: 207px;
}
.mainvisual__img{
  width: 615px;
        margin-left: -15%;
        margin-top: -22px;
}
.section-mainvisual::before{
    left: -155px;
  width: 322px;
  height: 145px;
}
    .section-mainvisual::after {
width: 117px;
height: 53px;
top: 463px;
right: -28px;
    }
.mainvisual__img::before{
          top: -428px;
        left: -195px;
}
.mainvisual__img::after{
          top: -527px;
        right: -149px;
}
    .mainvisual__text::before {
        bottom: -316px;
        right: -181px;
    }

    /* content01（課題セクション） */
.section-content.content01 .title{
  font-size: 36px;
  margin-bottom: 81px;
}
  /* content02（テキストセクション） */

  .content02{
   padding: 47px 0 80px; 
  }
  .content02 h2.title, .content02 .wide_image{
    margin: auto;
    padding: 0 10px;
  }
  .content02 h2.title{
    max-width: 694px;
  }
  .content02 .wide_image{
  max-width: 557px;
    }
    .content02 .bg_blue{
      padding: 38px 44px 42px;

    }
    .contribution_box{
      flex-direction: column;
    align-items: center;
    gap: 25px;
    max-width: 710px;
    }
    .contribution_box .contribution{
        width: -webkit-fill-available;
      padding: 30px 24px;
      align-items: center;
    }
    .regulation_list{
    margin-left: 0px;
    max-width: 522px;
    width: 100%;
}
    /* content03_01 */
    .content03_01 h2.title{
    max-width: 653px;
    margin: auto;
    }

    .lineup_list{
margin: 86px auto 0;
    }
    .lineup_list .lineup{
      flex-direction: column;
    align-items: center;
    width: 100%;
    }
    .lineup_text,
.lineup_list .lineup.item01 .lineup_text{
  width: 100%;
}
    .lineup_list .lineup.item01{
      flex-direction: column;
    }
    .lineup_list .lineup.item01 .lineup_pick{
left: -10px;
padding: 14px 64px 16px 64px;
    }
    .lineup_list .lineup .lineup_img{
      width: 100%;
      text-align: center;
    }
    .lineup_list .lineup.item01 .lineup_img img{
      width: 297px;
        }
       .lineup_list .lineup.item02 .lineup_img img{
          width: 286px;
        }
/* content03_02 */
.content03_02{
  padding: 89px 0 73px;
}
.content03_02 .section-inner::before,
.content03_02 .section-inner::after{
  display: none;
}
.contact_text{
padding-left: 145px;
margin: 0;
}
.content03_02 .contact_area{
padding-right: 30px;
}
.content03_02 .contact_area .contact a,
 .content06_02 .contact_area .contact a{
  width: 100%;
}
.contact_text .title, .content06_02 .title{
  font-size: 36px;
}
.contact_text::before{
  left: -20px;
}
.contact_text::after{
    width: 74px;
    height: 54px;
            right: 26px;
        top: -6px;
}
.content03_02 .contact_area, .content06_02 .contact_area{
      flex-direction: column;
      gap: 16px;
}
.content06_02 .contact_area{
  gap: 25px;
}
/* content04（TMEICならラクラクセクション） */
.content04 {
  background: #E7F5F8;
  padding: 63px 0 80px;
}
.support_box{
  margin-top: 87px;
}
.support_box .subtitle{
  top: -87px;
    line-height: 1.2;
    font-size: 32px;
    padding: 15px 0 19px;
    max-width: 523px;
    width: 100%;
}
.support_list{
        margin: -73px 0 0;
}

/* content05_02 */
.content05_02 {
    padding: 80px 0 ;
}
.content05_02 .section-inner{
  gap: 33px;
}
.point_list{
flex-direction: column;
gap: 20px;
max-width: 686px;
}

.point_item.item01+.fadeIn,
.point_item.item01{
        width: unset;
}
/* content06（導入実績セクション） */
.content06_01 .achievements_list{
        gap: 115px;
        flex-direction: column;
        margin: 70px auto 0;
        align-items: center;
        max-width: 652px;
}
.content06_01 .achievements_list .achievements,
.achievements_list .achievements_box{
        width: -webkit-fill-available;
}
.content06_01 .achievements_list .achievements img{
  width: 100%;
}
.content06_01 .achievements_list .achievements::before{
width: 76px;
height: 76px;
top:-29px;
left: -28px;
}
/* content06_02 */
.content06_02 .section-inner::before,.content06_02 .section-inner::after{
  display: none;
}
}

@media only screen and (min-width: 700px) and (max-width: 768px) {
.tb_only{
  display: block;
}
}
/* ------------Responsive（500）------------ */
@media (max-width: 700px) {

  .section-mainvisual .section-inner{
    padding: 0 20px;
  }
  .mainvisual__text{
    width: 100%;
  }
.mainvisual__title{
  font-size: 24px;
}
.mainvisual__subtitle{
  font-size:15px;
  text-align: center;
}
.mainvisual__points{
gap: 1%;
}
.mainvisual__points .point {
        width: 111px;
        height: 111px;
    }
.mainvisual__points .point .point_text{
  font-size: 20px;
}
.mainvisual__text .contact_area{
        flex-direction: column;
        gap: 10px;
        align-items: center;
        margin-top: 240px;
}
.mainvisual__text .contact_area .contact{
 width: 311px;
}
.mainvisual__text .contact_area a{
width: 100%;
}
    .mainvisual__img {
        width: 480px;
        margin-left: 0;
        margin-top: 0;
        position: absolute;
    }
    .section-content.content01 .underline{
      display: unset;
    }
    .section-content.content01 .underline::after{
          width: 200%;
    left: -228px;
    }
    .content01 h2.title .under500{
      display: block;
    }
    
}
/* ------------Responsive（500）------------ */
@media (max-width: 500px) {
  body {
  font-size: 14px;
}
.over500{
  display: none;
}    .support_list .support br.under500,
  .under500{
display: block;
  }
    .content01 .section-inner,
    .content02 .wide_image+.section-inner,
    .content03 .content03_01 .section-inner,
      .content03 .content03_02 .section-inner,
  .content04 .section-inner,
  .content05 .content05_01 .section-inner,
  .content05 .content05_02 .section-inner,
  .content06 .content06_01 .section-inner,
  .content06 .content06_02 .section-inner {
    padding: 0 10px;

  }

  .content02 .title+.section-inner {
    padding: 0 14px;
  }

.content-header{
  padding: 0 10px ;
  height: 50px;
}
.content-header .header_logo{
width: 100px;
}
.content-header .header_contact a{
    width: 140px;
    padding: 5px 0 6px;
font-size: 13px;
}

.section-mainvisual{
  padding: 60px 0 130px;
}
.section-mainvisual .section-inner{
  padding: 0 10px;
}
.content-header .header_contact a::after{
    border-right: 1px solid #028894;
    border-top: 1px solid #028894;
    margin-top: 1px;
    width: 6px;
    height: 6px;
}
.mainvisual__text{
  gap: 15px;
}
    .mainvisual__img {
width: 332px;
height: 224px;
top: 40%;
    }
.contact_area .contact a{
font-size: 16px;
padding: 8px 0 10px;
}
.section-mainvisual::before,
.section-mainvisual::after{
  display: none;
}
.mainvisual__img::before{
  width: 116px;
height: 56px;
        top: -266px;
        left: -55px;
}
.mainvisual__img::after{
        width: 201px;
        height: 59px;
        top: -36px;
        right: 0px;
}
    .mainvisual__text::before {
      width: 93px;
      height: 50px;
        bottom: 180px;
        right: -40px;
    }
    .mainvisual__points .point .point_text span{
    text-shadow: 0px 2px 8px rgba(100, 100, 100, 0.10);
    -webkit-text-stroke-width: 6px;
    }
    .section-content.content01{
    padding: 50px 0 76px;
    margin-top: -70px;
    position: relative;
    z-index: 1;
    }
    .section-content.content01 .title{
      font-size: 20px;
        margin-bottom: 25px;
    }
        .section-content.content01 .underline::after {
        left: -130px;
    height: 8px;
    }

    .assignment_list{
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 0 15px;
    justify-items: center;
    }
      .assignment_list .assignment:nth-child(3) {
    grid-column: 1 / -1;
  }
    .assignment{
      width:150px;
      height:150px;
    }
    .assignment p{
      font-size: 15px;
    }
    .assignment picture{
      width: 45px;
    }
    .assignment.item01 picture{
      width: 39px;
    }

    .content02{
      padding: 35px 0 55px;
    }
    .content02 .bg_blue{
      padding: 38px 22px 34px;
    }
.contribution_title {
    padding: 18px 0;
}
.contribution_box .contribution{
  padding: 30px 24px;
}
.contribution_box .contribution + .contribution{
  padding: 30px 10px 30px 24px;
}
.contribution_box .contribution .title{
  font-size: 20px;
}
.note {
    font-size: 10px;
}
.regulation_list{
  gap:15px
}
.content03_01, .content05_02{
  padding: 50px 0;
}
    .lineup_list {
        margin: 36px auto 0;
    }
    .lineup_list .lineup{
      padding: 25px 20px 30px 20px;
    }
.lineup_list .lineup.item01 .lineup_pick{
  font-size: 16px;
  padding: 6px 28px 8px ;
}
.lineup_list .lineup.item01 .lineup_img img{
  width: 230px;
}
.lineup_list .lineup.item02 .lineup_img img{
width: 248px;
}
.lineup_list .lineup_text .title{
  font-size: 18px;
  
}
.lineup_list .lineup_text .title .sp_small{
  font-size: 14px;
}
.features_title{
  font-size: 16px;
}

.content03_02{
  padding: 52px 0 54px;
}
.contact_text{
  padding-left: 0;
}
.contact_text::before{
  display: none;
}
.contact_text::after{
          width: 44px;
        height: 32px;
        right: -26px;
        top: -4px;
}
.contact_text .title, .content06_02 .title{
  font-size: 20px;
  line-height: 1.4;
}
.contact_text .sub_text{
  font-size: 14px;
  
}
.content03_02 .contact_area{
 padding-right: 0;
}
.content04{
  padding: 45px 0 80px;
}
.content04 .section-inner{
  gap:20px;
}
.support_box{
  margin-top: 65px;
  padding: 0 20px 25px 20px;
}
.support_box .subtitle{
  font-size: 20px;
  width: 100%;
  padding: 7px 0 10px;
  top: -65px;
}
.support_list .support picture{
  width: 50px;
  height: 50px;
  
}
.support_list .support .support_text{
  gap:10px;
}
.support_list .support .support_subtitle{
  font-size: 18px;
}
.support_box .subtitle::before{
    bottom: -4px;
    width: 25px;
    height: 25px;
}
.content05_01{
  padding: 60px 0;
}
.content05_01 .title{
  margin-bottom: 45px;
  font-size: 24px;
}
.content05_01 .flow_list{
  gap:59px;
    font-size: 20px;

}
  .content05_01 .flow_list .flow_item .step{
    font-size: 16px;
  }
  .content05_01 .flow_list .flow_item:nth-of-type(n+2):after{

        top: -34px;
        border: 12px solid transparent;
        border-left: 12px solid #028894;
  }
  .point_item{
    padding: 30px 24px; 
  }
  .point_title{
    width: 293px;
    font-size: 18px;
  }
  .select_text{
    font-size: 20px;
  }
  .select_text .text_blue{
    font-size: 22px;
  }
  .point_item .subtitle{
    font-size: 16px;
  }
  .result{
    font-size: 13px; 
  }
  .result .price{
    font-size: 42px;
    
  }
  .content05_02 .note, .content06_01 .note{
    font-size: 11px;
  }
   .content06_01 .point_item.item03 .note{
    font-size: 10px;
    
   }
  .point_item.item01{
    gap:22px;
    padding: 30px 10px;
  }
  .result{
    gap: 5px;
  }
#priceValue{
  padding: 0 2px;
}
  .quality_box{
    margin-top: 0;
    padding: 40px 10px 45px 10px;

  }
  .quality_box .title{
    font-size: 20px;
    margin-bottom: 25px;
  }
  .quality_list{
    gap:15px;
  }
  .quality_list .quality{
width: 269px;
height: 269px;
  }
  .quality_list .quality picture img{
    height: 79px;
    width: auto;
  }
  .quality_list .quality_title{
    font-size: 20px;
  }
  
  .content06_01{
    padding: 50px 0;
  }
  .content06_01 .achievements_list{
    gap:55px;
    max-width: 340px;
  }
  .content06_01 .achievements_list .achievements{
    padding: 32px 20px;
  }
  .achievements_list .achievements_box{
  font-size: 13px;
  padding: 12px 0 12px 10px;
}
.achievements_list .achievements_box .note{
  font-size: 14px;
}
.content06_01 .achievements_list .achievements::before {
        width: 54px;
        height: 54px;
        top: -29px;
        left: -14px;
    }
.content06_02{
  padding: 45px 0;
}
.content06_02 .title{
  margin-bottom: 0;
}
.content06_02 .contact_area{
  gap:15px;
}

}