/* -999px
  ------------------------------ */
  @media screen and (max-width:999px) {
    html {
      scroll-padding-top: 106px;
    }
    .header {
      height: 106px;
      padding: 0 20px;
    }
    .header-inner {
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 10px 0 20px;
    }
    .header h1 {
      display: none;
    }
    .header-logo {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 2px;
      width: 210px;
      margin-top: 0;
    }
    .header-logo-inner {
      justify-content: center;
      padding: 0 10px;
    }
    .header-logo1 {
      width: 100%;
      max-width: 100%;
    }
    .header-logo2 {
      width: 98px;
    }
    .header-logo3 {
      width: 90px;
    }
    .header-right {
      position: fixed;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 77px;
      padding: 0 10px;
      background-color: rgba(255, 255, 255, 0.9);
      justify-content: center;
      align-items: center;
      gap: 14px;
    }
    .header-phone-link {
      width: 100%;
      max-width: 226px;
      margin-top: 0;
    }
    .header-inquiry-link {
      width: 100%;
      max-width: 184px;
      margin-top: 0;
    }
  }
  /* -768px
  ------------------------------ */
  @media screen and (max-width:767px) {
    .sp-only {
      display: block;
    }
    .sp-none {
      display: none;
    }

    .fv {
      margin-top: 106px;
    }
    .fv .container {
      width: 100%;
      height: 86.97vw;
      background-image: url(../images/bg_fv_sp01.jpg);
    }
    .fv .content {
      width: 83.7%;
    }

    .intro .container {
      width: 100%;
      flex-direction: column;
    }
    .intro .left-top {
      font-size: clamp(2rem, 6.97vw, 3.4rem);
      text-align: center;
    }
    .intro .left-bottom {
      font-size: clamp(4.3rem, 13.4vw, 6.6rem);
    }
    .intro .content {
      font-size: clamp(1.8rem, 5.6vw, 2.8rem);
    }
    .intro .total {
      font-size: clamp(4.6rem, 14.4vw, 7.2rem);
    }
    .intro .price {
      font-size: clamp(8.8rem, 27.4vw, 13.7rem);
    }   
    .intro .label {
      font-size: clamp(1.2rem, 3.28vw, 1.6rem);
      width: clamp(72px, 22.35vw, 109px);
    }     
    .intro .cost {
      font-size: clamp(2.9rem, 9.2vw, 4.6rem);
    }
    .intro .annotation {
      font-weight: clamp(1.1rem, 3.28vw, 1.4rem);
    }
    
    .feature {
      padding: 60px 20px ;
    }    
    .feature .wrapper {
      padding: 10px;
    }
    .feature .container {
      padding: 40px 10px 20px;
    }
    .feature .title {
      font-size: clamp(2rem, 4.4vw, 3.4rem);
    }
    .feature .content {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
      margin-top: 20px;
    }
    .feature .cards {
      gap: 30px 40px;
    }
    .feature .card-num {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
      padding: 6px 10px;
    }
    .feature .card-box {
      padding: 16px 10px 20px;
    }
    .feature .card-title {
      font-size: clamp(1.7rem, 2.6vw, 2rem);
    }
    .feature .card-content {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }
    
    .grave {
      padding: 60px 20px;
      background-size: contain;
    }
    .grave .title {
      font-size: clamp(2rem, 4.4vw, 3.4rem);
    }
    .grave .content {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
      margin-top: 20px;
    }
    .grave .container {
      flex-direction: column;
      align-items: center;
      margin-top: 60px;
    }
    .grave figcaption {
      font-weight: clamp(1.1rem, 3.28vw, 1.4rem);
    }
    .grave .box {
      margin-top: 40px;
    }
    .grave .box-title {
      font-size: clamp(1.7rem, 2.6vw, 2rem);
      padding: 10px;
    }
    .grave .detail-title {
      font-size: clamp(1.6rem, 2.3vw, 1.8rem);
    }
    .grave .detail {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }
    .grave .price-label {
      font-weight: clamp(1.1rem, 3.28vw, 1.4rem);
    }
    .grave .price-cost {
      font-size: clamp(3.6rem, 5.8vw, 4.5rem);
    }
    .grave .price {
      font-size: clamp(8rem, 13vw, 10rem);
    }
    .grave .small {
      font-size: clamp(2.6rem, 4.3vw, 3.3rem);
    }
    .grave .other-title {
      font-size: clamp(1.6rem, 2.3vw, 1.8rem);
    }    
    .grave .other-price {
      font-size: clamp(1.7rem, 2.6vw, 2rem);
    }
    .grave .annotation {
      font-weight: clamp(1.1rem, 3.28vw, 1.4rem);
    }
    .hakajimai {
      width: 100%;
      padding-bottom: 60px;
    }
    .hakajimai .title {
      font-size: clamp(2rem, 4.4vw, 3.4rem);
      padding: 40px 20px;
    }
    .hakajimai .content {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
      margin-top: 40px;
    }    
    .hakajimai .flow-container {
      margin-top: 40px;
      gap: 50px;
    }
    .hakajimai .flow {
      display: grid;
      column-gap: 10px;
      grid-template-columns: clamp(48px, 8vw, 62px) 1fr;
      grid-template-rows: clamp(48px, 8vw, 62px) 1fr;
    }
    .hakajimai .flow-top {
      display: flex;
      flex-direction: column;
      gap: 8px;
      grid-column: 2 / 3;
      grid-row: 1 / 2;
    }    
    .hakajimai .flow-num {
      font-size: clamp(1.1rem, 3.28vw, 1.4rem);
    }
    .hakajimai .flow-title {
      font-size: clamp(1.6rem, 2.3vw, 1.8rem);
    }
    .hakajimai .flow-bottom {
      display: contents;
    }
    .hakajimai .flow-icon {
      width: clamp(48px, 8vw, 62px);
      height: clamp(48px, 8vw, 62px);
      grid-column: 1 / 2;
      grid-row: 1 / 2;
    }
    .hakajimai .flow-content {
      font-size: clamp(1.1rem, 3.28vw, 1.4rem);
      grid-column: 1 / 3;
      grid-row: 2 / 3;
      padding: 10px 20px;
      margin-top: 10px;
    }    
    .hakajimai .annotation {
      font-size: clamp(1.1rem, 3.28vw, 1.4rem);
    }    
    
    .works {
      padding-bottom: 60px;
    }      
    .works .title {
      font-size: clamp(2rem, 4.4vw, 3.4rem);
      padding: 40px 20px 60px;
    }    
    .works .wrapper {
      padding: 40px 20px;
      margin: -20px auto 0;
    }
    .works .content {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }    
    .works .container {
      flex-direction: column;
      align-items: center;
      gap: 20px;
      padding: 20px;
      margin-top: 40px;
    }
    .works .inner-content {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }
    .works .image-box {
      width: 100%;
      max-width: 420px;
    }
    .works figcaption {
      font-size: clamp(1.1rem, 3.28vw, 1.4rem);
    }
    
    .slides {
      margin-top: 40px;
    }
    .swiper-slide {
      width: 240px;
    }
    
    .overview {
      width: 100%;
      padding-bottom: 60px;
    }
    .overview .title {
      font-size: clamp(2rem, 4.4vw, 3.4rem);
      padding: 60px 20px 80px;
    }    
    .overview .wrapper {
      padding: 40px 20px;
      margin: -40px auto 0;
    }
    .overview .content {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }    
    .overview .container {
      max-width: 420px;
      margin: 30px auto 0;
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 1fr 1fr;
    }
    .overview .logo1 {
      grid-row: 1 / 2;
      grid-column: 1 / 3;
      width: 80%;
      margin: auto;
    }
    .overview .logo2 {
      grid-row: 2 / 3;
      grid-column: 1 / 2;
    }
    .overview .logo3 {
      grid-row: 2 / 3;
      grid-column: 2 / 3;
    }
    .overview .table {
      margin-top: 40px;
    }
    .overview .table tr {
      display: flex;
      flex-direction: column;
    }
    .overview .table th,
    .overview .table td {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
      padding: 10px;
      text-align: center;
    }
    
    .inquiry .title {
      font-size: clamp(2rem, 4.4vw, 3.4rem);
      padding: 30px 20px;
    }    
    .inquiry .wrapper {
      padding: 20px 20px 60px;
    }
    .inquiry .content {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }    
    .entryform table tr {
      display: flex;
      flex-direction: column;
    }
    .entryform table td:nth-of-type(odd) {
      width: 100%;
      padding: 12px 10px;
    }
    .entryform table td:nth-of-type(even) {
      padding: 12px 20px;
      line-height: 1.4;
    }
    .entryform input {
      margin: 0;
    }    
    .entryform input[name="request[]"] {
      margin: 20px 1em 0 0;
    }    
    .entryform p {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }

    .present {
      margin: 60px auto 0;
    }    
    .present .title {
      font-size: clamp(1.7rem, 2.6vw, 2rem);
      padding: 10px;
    }
    .present .container {
      padding: 20px;
      flex-direction: column;
    }
    .present .phone {
      width: 100%;
      max-width: 360px;
    }
   
    .footer {
      font-weight: clamp(1.1rem, 3.28vw, 1.4rem);
    }    
    .footer .top {
      padding: 30px 20px 40px;
    }
    .footer .wrapper {
      flex-direction: column;
      align-items: center;
    }
    .footer .logo1 {
      margin: auto;
    }    
    .footer .container-right {
      width: 100%;
      max-width: 415px;
      margin: 30px auto 0;
      align-self: flex-start;
    }
    .footer .logo2,
    .footer .logo3 {
      max-width: 280px;
      margin: auto;
    }
    .footer .annotation {
      margin: 30px auto 0;
    }    
    .footer .bottom {
      padding: 20px 10px 60px;
      margin-bottom: 77px;
    }

    .privacy {
      padding: 40px 20px 60px;
      margin-top: 106px;
    }
    .privacy .title {
      font-size: clamp(2.5rem, 3.9vw, 3rem);
    }
    .privacy .container {
      margin: 40px auto 0;
    }
    .privacy .content-title {
      font-size: clamp(1.6rem, 2.3vw, 1.8rem);
      margin-top: 40px;
    }
    .privacy .content {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }    
    .privacy .content-num {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }
    .privacy .inner-title {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }    
    .privacy .inner-content {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }
    .privacy ul li {
      font-size: clamp(1.4rem, 2vw, 1.6rem);
    }
    .privacy .link {
      margin-top: 40px;
    }
  }