header .h-wrap #menu .site-title {
  opacity: 0;
  transition: opacity .3s; }
header.h-fixed .h-wrap #menu .site-title {
  opacity: 1; }

main #hero .hero-wrap {
  padding: 17rem 3rem 3rem; }
  main #hero .hero-wrap div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 13rem; }
    main #hero .hero-wrap div h1 {
      max-width: 845px;
      width: 100%;
      margin-right: 2rem; }
    main #hero .hero-wrap div h2 {
      font-size: 1.5rem;
      line-height: 3rem;
      max-width: 19rem;
      letter-spacing: 0.3rem; }
  main #hero .hero-wrap .hero-pic {
    width: 100%; }
    main #hero .hero-wrap .hero-pic.sp {
      display: none; }
main #services .services-wrap {
  position: relative;
  margin-bottom: 10rem;
  padding-top: 5rem; }
  main #services .services-wrap .wrap {
    position: relative;
    z-index: 2;
    margin: 0 auto; }
  main #services .services-wrap .title01, main #services .services-wrap .ser-top-item {
    color: #fff; }
  main #services .services-wrap .ser-top-item {
    margin: 3.5rem auto;
    font-size: 1.7rem;
    font-weight: bold;
    line-height: 4rem;
    letter-spacing: 0.3rem; }
  main #services .services-wrap ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center; }
    main #services .services-wrap ul li {
      width: calc(50% - 1rem/2);
      overflow: hidden; }
      main #services .services-wrap ul li a {
        padding-top: 50%; }
        main #services .services-wrap ul li a:before {
          padding-top: 50%; }
      main #services .services-wrap ul li:first-child {
        margin: 0 1rem 1rem 0; }
        main #services .services-wrap ul li:first-child a:before {
          background: url("../img/top/bg_ser01.jpg"); }
      main #services .services-wrap ul li:nth-child(2) {
        margin: 0 0 1rem 0; }
        main #services .services-wrap ul li:nth-child(2) a:before {
          background: url("../img/top/bg_ser02.jpg"); }
      main #services .services-wrap ul li:nth-child(3) {
        margin: 0 1rem 0 0; }
        main #services .services-wrap ul li:nth-child(3) a:before {
          background: url("../img/top/bg_ser03.jpg"); }
      main #services .services-wrap ul li:last-child a:before {
        background: url("../img/top/bg_ser04.jpg"); }
  main #services .services-wrap .used-car {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 5rem; }
    main #services .services-wrap .used-car p {
      margin-right: 3rem; }
  main #services .services-wrap .back-black {
    background: #000;
    position: absolute;
    content: "";
    z-index: 1;
    top: 0;
    right: 0;
    width: calc(100% - 3rem);
    height: 38rem; }
main #company .company-wrap {
  position: relative;
  background: #000;
  padding: 16rem 0; }
  main #company .company-wrap .wrap {
    position: relative;
    z-index: 2;
    color: #fff;
    margin: 0 auto; }
    main #company .company-wrap .wrap .inner {
      max-width: 34rem; }
      main #company .company-wrap .wrap .inner dl dt {
        font-size: 1.7rem;
        font-weight: bold;
        letter-spacing: 0.3rem;
        line-height: 4rem;
        margin: 4rem 0 3rem; }
  main #company .company-wrap .sp {
    display: none; }
  main #company .company-wrap .back-left, main #company .company-wrap .back-right {
    position: absolute;
    content: "";
    z-index: 1;
    top: 0;
    width: 50%;
    height: 100%; }
  main #company .company-wrap .back-left {
    left: 0; }
    main #company .company-wrap .back-left img {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%); }
  main #company .company-wrap .back-right {
    background: url("../img/top/bg_con-r.jpg") no-repeat center/cover;
    right: 0; }
main #origin .origin-wrap {
  margin: 10rem auto 12rem; }
  main #origin .origin-wrap .top {
    display: flex;
    justify-content: space-between;
    align-content: flex-start; }
    main #origin .origin-wrap .top div {
      max-width: 40rem;
      margin-right: 2rem; }
      main #origin .origin-wrap .top div h3 {
        font-size: 1.7rem;
        font-weight: bold;
        letter-spacing: 0.3rem; }
      main #origin .origin-wrap .top div p {
        font-family: "Barlow Condensed", sans-serif;
        font-size: 1.6rem;
        color: #b50005; }
    main #origin .origin-wrap .top .ori-text {
      max-width: 505px; }
  main #origin .origin-wrap ul {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 7rem; }
    main #origin .origin-wrap ul li {
      width: calc(33.333% - 1rem/3);
      overflow: hidden; }
      main #origin .origin-wrap ul li:nth-child(2) {
        margin: 0 1rem; }
      main #origin .origin-wrap ul li a {
        padding-top: 100%; }
        main #origin .origin-wrap ul li a:before {
          padding-top: 100%; }
      main #origin .origin-wrap ul li:first-child a:before {
        background: url("../img/top/bg_ori01.jpg"); }
      main #origin .origin-wrap ul li:nth-child(2) a:before {
        background: url("../img/top/bg_ori02.jpg"); }
      main #origin .origin-wrap ul li:last-child a:before {
        background: url("../img/top/bg_ori03.jpg"); }
main .expansion-btn li a {
  color: #fff;
  font-weight: bold;
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  box-sizing: border-box; }
  main .expansion-btn li a:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    width: 100%;
    height: auto;
    transition: all .3s ease-out;
    display: block; }
  main .expansion-btn li a .pic-text {
    position: absolute;
    z-index: 2;
    display: block;
    width: 100%;
    bottom: 0;
    left: 0;
    padding: 0 0 13px 25px;
    box-sizing: border-box; }
  main .expansion-btn li a .pic-arrow {
    position: absolute;
    content: "";
    bottom: 0;
    right: 0;
    width: 55px;
    height: 55px;
    background: #b50005;
    border: 1px solid #b50005;
    overflow: hidden;
    box-sizing: border-box; }
    main .expansion-btn li a .pic-arrow span {
      position: absolute;
      content: "";
      width: 12px;
      height: 12px;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 2;
      background: url("../img/common/icon_arrow_w.png") no-repeat center/12px; }
    main .expansion-btn li a .pic-arrow:before {
      content: "";
      position: absolute;
      top: 0;
      right: -50px;
      bottom: 0;
      left: 0;
      z-index: 1;
      border-right: 50px solid transparent;
      border-bottom: 56px solid #fff;
      transform: translateX(-100%);
      transition: .45s transform; }
  main .expansion-btn li a:hover:before {
    transform: scale(1.1); }
  main .expansion-btn li a:hover .pic-arrow span {
    background: url("../img/common/icon_arrow_r.png") no-repeat center/12px; }
  main .expansion-btn li a:hover .pic-arrow:before {
    transform: translateX(0); }

@media screen and (max-width: 1110px) {
  main #hero .hero-wrap {
    padding: 12rem 3rem 3rem; }
    main #hero .hero-wrap div {
      display: block;
      margin-bottom: 5rem; }
      main #hero .hero-wrap div h1 {
        max-width: 845px;
        width: 100%;
        margin-right: 5rem; }
      main #hero .hero-wrap div h2 {
        max-width: 100%;
        margin-top: 2rem; } }
@media screen and (max-width: 920px) {
  main #hero .hero-wrap {
    padding: 7rem 3rem 3rem; }
    main #hero .hero-wrap div {
      margin-bottom: 2.5rem; }
      main #hero .hero-wrap div h1 {
        margin-right: 0; }
      main #hero .hero-wrap div h2 {
        margin-top: 2rem; }
    main #hero .hero-wrap .hero-pic.sp {
      display: block; }
    main #hero .hero-wrap .hero-pic.pc {
      display: none; }
  main #services .services-wrap {
    margin-bottom: 3rem; }
    main #services .services-wrap .ser-top-item {
      line-height: 3rem; }
    main #services .services-wrap .used-car {
      display: block;
      margin-top: 3rem;
      padding-bottom: 3rem; }
      main #services .services-wrap .used-car p {
        margin: 0 auto 1.5rem;
        color: #fff;
        width: fit-content;
        text-align: left; }
      main #services .services-wrap .used-car a {
        margin: 0 auto; }
    main #services .services-wrap .back-black {
      width: 100%;
      height: 100%; }
  main #company .company-wrap {
    padding: 8rem 0;
    background: rgba(0, 0, 0, 0.5); }
    main #company .company-wrap .wrap .inner {
      max-width: 100%; }
      main #company .company-wrap .wrap .inner dl dt {
        line-height: 3rem; }
        main #company .company-wrap .wrap .inner dl dt br {
          display: none; }
    main #company .company-wrap .back-left, main #company .company-wrap .back-right {
      z-index: -1; }
    main #company .company-wrap .back-left {
      background: #000; }
      main #company .company-wrap .back-left img {
        width: 85%; }
  main #origin .origin-wrap {
    margin: 3rem auto; }
    main #origin .origin-wrap .top {
      display: block; }
      main #origin .origin-wrap .top div {
        max-width: 100%;
        margin: 0 auto 1.5rem; }
      main #origin .origin-wrap .top .ori-text {
        max-width: 100%; }
    main #origin .origin-wrap ul {
      flex-wrap: wrap;
      margin-top: 3rem; }
      main #origin .origin-wrap ul li {
        width: calc(50% - 1rem/2);
        overflow: hidden;
        margin: 0 1rem 1rem 0; }
        main #origin .origin-wrap ul li:nth-child(2) {
          margin: 0 0 1rem 0; }
        main #origin .origin-wrap ul li:last-child {
          margin: 0 auto 1rem 0; } }
@media screen and (max-width: 600px) {
  main #hero .hero-wrap {
    padding: 7rem 2rem 2rem; }
  main #services .services-wrap {
    padding-top: 2rem;
    margin-bottom: 2rem; }
    main #services .services-wrap .ser-top-item {
      margin: 2rem auto; }
    main #services .services-wrap ul {
      display: block;
      max-width: 40rem;
      margin: 0 auto; }
      main #services .services-wrap ul li {
        width: 100%;
        overflow: hidden;
        margin: 0 auto 2rem !important; }
        main #services .services-wrap ul li:last-child {
          margin-bottom: 0 !important; }
        main #services .services-wrap ul li a span {
          padding: 0 0 5px 1rem; }
    main #services .services-wrap .used-car {
      padding-bottom: 4rem; }
  main #company .company-wrap {
    padding: 0;
    background: #000; }
    main #company .company-wrap .wrap {
      background: url("../img/top/bg_con-l_sp.jpg") no-repeat bottom left/contain; }
      main #company .company-wrap .wrap .inner {
        padding: 3.5rem 0 4rem; }
        main #company .company-wrap .wrap .inner dl dt {
          margin: 2rem auto 1.5rem; }
    main #company .company-wrap .sp {
      width: 100%;
      display: block; }
    main #company .company-wrap .back-left, main #company .company-wrap .back-right {
      display: none; }
  main #origin .origin-wrap {
    margin: 4rem auto 2rem; }
    main #origin .origin-wrap ul {
      display: block;
      max-width: 40rem;
      margin: 2rem auto 0; }
      main #origin .origin-wrap ul li {
        width: 100%;
        margin: 0 auto 2rem !important; }
        main #origin .origin-wrap ul li:last-child {
          margin-bottom: 0 !important; }
    main #origin .origin-wrap .expansion-btn li a .pic-text {
      padding: 0 0 13px 2rem; } }