﻿.dli-arrow-right {
    display: inline-block;
    vertical-align: middle;
    color: #333;
    line-height: 1;
    position: relative;
    width: 1em;
    height: 0.1em;
    background: currentColor
  }
  
  .dli-arrow-right::before {
    content: '';
    width: 0.65em;
    height: 0.65em;
    border: 0.1em solid currentColor;
    border-left: 0;
    border-bottom: 0;
    transform: rotate(45deg);
    transform-origin: top right;
    position: absolute;
    top: 50%;
    right: -0.05em;
    box-sizing: border-box
  }
  
  .header .block-inner {
    display: flex
  }
  
  .header .block-inner .blc01 {
    flex-basis: calc(100% * 2/3)
  }
  
  .header .block-inner .blc01 img {
    object-fit: cover;
    width: 100%;
    height: 100%
  }
  
  .header .block-inner .blc02 {
    flex-basis: calc(100% * 1/3);
    background: #14294E;
    padding: 20px 4%;
    display: flex;
    align-items: center
  }
  
  .header .block-inner .blc02 img {
    max-width: 582px;
    width: 100%;
    margin: 0 auto
  }
  
  @media screen and (max-width: 576px) {
    .header .block-inner {
      flex-wrap: wrap
    }
    .header .block-inner .blc01 {
      flex-basis: 100%
    }
    .header .block-inner .blc02 {
      flex-basis: 100%;
      background: #14294E
    }
  }
  
  .campain_img_area {
    margin-top: -7px;
    overflow-x: clip;
    width: 100%
  }
  
  .campain_img_area .campain_img {
    text-align: center
  }
  
  .campain_img_area .campain_img img {
    position: relative;
    width: 104%;
    left: -2%;
    max-width: 2000px;
    margin: 0 auto
  }
  
  @media screen and (max-width: 576px) {
    .campain_img_area {
      margin-top: -13px
    }
    .campain_img_area .campain_img img {
      width: 108%;
      left: -4%
    }
  }
  
  .sec01 {
    background: #EFF3F5;
    margin-top: -5.2vw
  }
  
  .sec01 .wrap {
    max-width: 2000px;
    width: 100%;
    margin: 0 auto;
    background: url("../img/stamprally/stamprally_img07.png") no-repeat top left, url("../img/stamprally/stamprally_img11.png") no-repeat bottom right;
    padding: 120px 0
  }
  
  .sec01 .sec-ttl {
    text-align: center;
    margin-bottom: 120px;
    font-weight: bold;
    font-size: clamp(2.4rem, 3.2vw, 4.8rem);
    line-height: 1.8;
    letter-spacing: 0.1em
  }
  
  .sec01 .sec-body {
    text-align: center
  }
  
  .sec01 .sec-body .txt {
    font-weight: 500;
    letter-spacing: 0.1em;
    font-size: clamp(1.6rem, 2vw, 2.4rem);
    line-height: 2;
    margin-bottom: 60px
  }
  
  .sec01 .sec-body .txt:last-child {
    margin-bottom: 0
  }
  
  @media screen and (max-width: 1920px) {
    .sec01 .wrap {
      background-size: 40vw, 30vw
    }
  }
  
  @media screen and (max-width: 1140px) {
    .sec01 .wrap {
      position: relative;
      z-index: 0
    }
    .sec01 .wrap::before {
      content: "";
      z-index: -1;
      display: block;
      width: 100%;
      height: 100%;
      background: rgba(255, 255, 255, 0.6);
      position: absolute;
      top: 0;
      left: 0
    }
    .sec01 .sec-ttl {
      margin-bottom: 60px
    }
    .sec01 .sec-body .txt {
      margin-bottom: 40px
    }
  }
  
  @media screen and (max-width: 576px) {
    .sec01 {
      margin-top: -13vw
    }
    .sec01 .wrap {
      position: static;
      background: none;
      padding: 0px 0 60px
    }
    .sec01 .wrap .img {
      margin-bottom: 20px
    }
    .sec01 .wrap img {
      width: 100%
    }
    .sec01 .sec-ttl {
      margin-bottom: 40px
    }
    .sec01 .sec-body .txt {
      letter-spacing: 0;
      margin-bottom: 20px
    }
  }
  
  .sec02 {
    background: #14294E;
    color: #fff;
    padding: 120px 2%
  }
  
  .sec02 .wrap {
    max-width: 900px;
    width: 100%;
    margin: 0 auto
  }
  
  .sec02 .sec-ttl {
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    margin-bottom: 1em;
    font-size: clamp(2.6rem, 2.6vw, 4.1rem);
    letter-spacing: 0.2em;
    font-weight: bold;
    text-align: center
  }
  
  .sec02 .sec-body .txt {
    font-weight: 500;
    letter-spacing: 0.1em;
    font-size: clamp(1.6rem, 1.8vw, 1.8rem);
    margin-bottom: 1em;
    padding-left: 1em;
    text-indent: -0.65em
  }
  
  @media screen and (max-width: 767px) {
    .sec02 {
      padding: 60px 2%
    }
  }
  
  .btn_area {

    text-align: center
  }
  
  .btn_area .btn a {
    display: inline-block;
    color: #14294E;
    font-size: clamp(1.6rem, 2vw, 2.8rem);
    border-bottom: 2px solid #14294E;
    padding: 0.5em 0.2em;
    font-weight: bold;
    letter-spacing: 0.1em;
    overflow: hidden;
    position: relative;
    z-index: 1
  }
  
  .btn_area .btn a .dli-arrow-right {
    width: 2.5em;
    margin-left: 0.5em;
    height: 2px
  }
  
  .btn_area .btn a .dli-arrow-right::before {
    width: 0.5em;
    height: 0.5em;
    border: 2px solid currentColor;
    border-left: 0;
    border-bottom: 0
  }
  
  .btn_area .btn a::after {
    background: #14294E;
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 100%;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: 0.2s cubic-bezier(0.45, 0, 0.55, 1);
    z-index: -1
  }
  
  .btn_area .btn a:hover {
    color: #fff
  }
  
  .btn_area .btn a:hover .dli-arrow-right {
    color: #fff
  }
  
  .btn_area .btn a:hover::after {
    transform: scale(1, 1)
  }
  
  .btn_area .btn_ttl {
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    font-size: clamp(2rem, 2vw, 4.1rem);
    margin-bottom: 60px;
    letter-spacing: 0.2em;
    font-weight: bold;
    line-height: 1.2;
    color: #14294E
  }
  
  @media screen and (max-width: 767px) {
    .btn_area {
      padding: 60px 0
    }
    .btn_area .btn a {
      border: 1px solid #14294E;
      padding: 0.7em 0.7em
    }
    .btn_area .btn a .dli-arrow-right {
      width: 1em;
      height: 1px;
      position: relative;
      top: -0.7em
    }
    .btn_area .btn a .dli-arrow-right::before {
      border: 1px solid currentColor;
      border-left: 0;
      border-bottom: 0
    }
    .btn_area .btn_ttl {
      margin-bottom: 40px;
      line-height: 1.6
    }
  }
  
  .sec03 .wrap {
    max-width: 1700px;
    width: 100%;
    margin: 0 auto
  }
  
  .sec03 .sec-ttl {
    color: #14294E;
    font-weight: bold;
    font-size: clamp(3rem, 5vw, 7rem);
    letter-spacing: 0.1em;
    line-height: 1.3;
    margin-bottom: 20px;
    margin-top: 120px
  }
  
  .sec03 .sec-ttl .span {
    font-size: clamp(1.8rem, 2vw, 3rem);
    display: inline-block;
    margin-left: 1em;
    letter-spacing: 0.3em
  }
  
  .sec03 .ttl_cap {
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    font-size: clamp(2rem, 2vw, 4.1rem);
    margin-bottom: 100px;
    letter-spacing: 0.2em;
    font-weight: bold;
    line-height: 1.6;
    color: #14294E
  }
  
  .sec03 .sec-body {
    max-width: 1700px;
    width: 100%;
    margin: 0 auto
  }
  
  .sec03 .sec-body .ul .li {
    display: flex;
    padding: 100px 0;
    border-bottom: 1px solid #000
  }
  
  .sec03 .sec-body .ul .li.tp01 {
    border-left: 34px solid #758497
  }
  
  @media screen and (max-width: 767px) {
    .sec03 .sec-body .ul .li.tp01 {
      border-left: 18px solid #758497
    }
  }
  
  .sec03 .sec-body .ul .li.tp01 .num {
    color: #758497
  }
  
  .sec03 .sec-body .ul .li.tp02 {
    border-left: 34px solid #C5BEB1
  }
  
  @media screen and (max-width: 767px) {
    .sec03 .sec-body .ul .li.tp02 {
      border-left: 18px solid #C5BEB1
    }
  }
  
  .sec03 .sec-body .ul .li.tp02 .num {
    color: #C5BEB1
  }
  
  .sec03 .sec-body .ul .li .blc01 {
    flex-basis: 10%;
    text-align: center;
    padding: 0 1%
  }
  
  .sec03 .sec-body .ul .li .blc01 .num {
    font-size: clamp(3rem, 6vw, 8rem);
    font-weight: bold;
    letter-spacing: 0.03em;
    font-family: "Noto Sans JP", "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
    line-height: 1
  }
  
  .sec03 .sec-body .ul .li .blc02 {
    flex-basis: 35%;
    padding: 0 8% 0 0
  }
  
  .sec03 .sec-body .ul .li .blc02 .place {
    color: #14294E;
    font-weight: bold;
    letter-spacing: 0.2em;
    font-size: clamp(2rem, 2.4vw, 2.8rem);
    margin-bottom: 100px
  }
  
  .sec03 .sec-body .ul .li .blc02 .ttl {
    font-size: clamp(3rem, 3.2vw, 6rem);
    letter-spacing: 0.1em;
    font-weight: bold;
    margin-bottom: 20px;
    color: #394451
  }
  
  .sec03 .sec-body .ul .li .blc02 .txt {
    font-size: clamp(1.6rem, 1.8vw, 2.2rem);
    letter-spacing: 0.1em;
    font-weight: bold;
    line-height: 2;
    margin-bottom: 40px
  }
  
  .sec03 .sec-body .ul .li .blc02 .rink a {
    display: block;
    position: relative;
    text-align: right;
    font-weight: bold;
    letter-spacing: 0.1em;
    font-size: clamp(1.6rem, 2vw, 2rem);
    padding: 0 2em 0.5em 0;
    overflow: hidden;
    z-index: 1
  }
  
  .sec03 .sec-body .ul .li .blc02 .rink a::before {
    content: "";
    display: block;
    width: 100%;
    height: 20px;
    border-bottom: 1px solid #000;
    border-right: 1px solid #000;
    transform: skew(45deg);
    position: absolute;
    left: -12px;
    bottom: 0
  }
  
  .sec03 .sec-body .ul .li .blc02 .rink a::after {
    background: #14294E;
    position: absolute;
    bottom: 0;
    left: 0;
    content: '';
    width: 99.3%;
    height: 3px;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: 0.2s cubic-bezier(0.45, 0, 0.55, 1);
    z-index: -1
  }
  
  .sec03 .sec-body .ul .li .blc02 .rink a:hover::after {
    transform: scale(1, 1)
  }
  
  .sec03 .sec-body .ul .li .blc03 {
    flex-basis: 55%
  }
  
  @media screen and (max-width: 1140px) {
    .sec03 .sec-ttl {
      margin-top: 60px
    }
    .sec03 .ttl_cap {
      margin-bottom: 60px
    }
    .sec03 .sec-body .ul .li {
      padding: 50px 0;
      flex-wrap: wrap
    }
    .sec03 .sec-body .ul .li .blc01 {
      flex-basis: 20%;
      text-align: center;
      padding: 0 1%
    }
    .sec03 .sec-body .ul .li .blc02 {
      flex-basis: 80%;
      padding: 0 2% 0 0
    }
    .sec03 .sec-body .ul .li .blc02 .place {
      margin-bottom: 60px
    }
    .sec03 .sec-body .ul .li .blc03 {
      flex-basis: 100%;
      text-align: center
    }
    .sec03 .sec-body .ul .li .blc03 .img {
      padding: 0 2%
    }
  }
  
  .footer {
    background: #14294E;
    padding: 60px 2% 20px
  }
  
  .footer .footer-logo {
    text-align: center;
    margin-bottom: 80px
  }
  
  .footer .footer-logo a {
    display: block;
    max-width: 250px;
    width: 100%;
    margin: 0 auto
  }
  
  .footer .footer-copy {
    text-align: center;
    color: #fff
  }
  
  .footer .footer-copy a {
    color: #fff
  }
  
  @media screen and (max-width: 767px) {
    .footer {
      padding: 40px 2% 20px
    }
    .footer .footer-logo {
      margin-bottom: 40px
    }
  }
  
  
  /*# sourceMappingURL=lp_style.css.map */