/***
 * thiga add 2021-12-08
 */

.fade:disabled {
  opacity: .6;
  cursor: default;
}

/***
 * thiga add 2021-10-18 
 */

.btnSection{
  background: linear-gradient(to right, rgba(255,167,0,1) 0%,rgba(255,208,52,1) 100%);
  padding: 3.625em 0;
}
.btnSection .btn{
  width: 21.26em;
  font-size: 1.9rem;
  letter-spacing: 0.03em;
  font-weight: bold;
  margin: 0 auto;
}
.btnSection .btn a{
  display: flex;
  justify-content: center;
  align-items: center;
  height: 3.42em;
  background: #000;
  color: #fff;
  border-radius: 0.4em;
  box-shadow: 0 0 0.625em rgba(0,0,0,0.16);
  transition: 0.3s;
}
.btnSection .btn a:hover{
  opacity: 0.7;
}
.btnSection .btn img{
  width: 1em;
}
.btnSection .btn img,
.btnSection .btn i{
  margin-right: 0.5em;
}
.btnSection .btn i{
  color: #fff;
}


.ttl_cmn {
  margin-bottom: 6rem;
  color: #000;
  text-align: center;
  position: relative; }
  @media screen and (max-width: 959px) {
    .ttl_cmn {
      margin-bottom: 4rem; } }
  .ttl_cmn::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -0.7rem;
    width: 1.5rem;
    height: 14rem;
    -webkit-transform: translate(-50%, -50%) skew(25deg);
    -ms-transform: translate(-50%, -50%) skew(25deg);
    transform: translate(-50%, -50%) skew(25deg);
    display: none; }
    @media screen and (max-width: 959px) {
      .ttl_cmn::before {
        display: block; } }
  .ttl_cmn.white::before {
    background: #fff; }
  .ttl_cmn.grey::before {
    background: #F6F6F6; }
  .ttl_cmn .ttl_ja {
    font-size: 6rem;
    font-weight: 600;
    margin-bottom: 1rem;
    line-height: 7rem; }
    @media screen and (max-width: 959px) {
      .ttl_cmn .ttl_ja {
        font-size: 4rem; } }
  .ttl_cmn .ttl_eng {
    font-family: "Jost";
    font-size: 1.2rem;
    font-weight: 700;
    display: block;
    text-transform: uppercase; }
    @media screen and (max-width: 959px) {
      .ttl_cmn .ttl_eng {
        font-size: 1.6rem; } }
  .ttl_cmn > * {
    position: relative;
    z-index: 10; }

.btn_cmn {
  max-width: 50rem;
  width: 100%;
  margin: 0 auto;
  height: 10rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 4rem;
  font-size: 2.6rem;
  font-weight: 600;
  color: #DA5077;
  border: 0.6rem solid #DA5077;
  border-radius: 6rem;
  position: relative;
  transition: all ease 0.3s; }
  @media screen and (max-width: 959px) {
    .btn_cmn {
      height: 8.1rem;
      font-size: 2.6rem; } }
  .btn_cmn:hover {
    background-color: #DA5077;
    color: #fff; }
    .btn_cmn:hover::after {
      color: #fff; }
  .btn_cmn::after {
    left: 5rem;
    top: 50%;
    margin-top: -1.3rem;
    line-height: 100%;
    color: #DA5077;
    font-size: 2.5rem;
    position: absolute;
    font-family: "Font Awesome 5 Free";
    font-weight: 900; }
  .btn_cmn._mail::after {
    content: "\f0e0"; }
  .btn_cmn._arrow::after {
    content: "\f105"; }


/* sec_basic */
#sec_basic .bg {
  height: 97.6rem;
}

@media screen and (max-width: 959px) {
  #sec_basic .bg {
    height: auto; } }


/* overview */
#overview{
    text-align: center;
    margin: 3.625em auto 0;
}
#overview .img{
    padding: 0 3.125em;
}
#overview .voice{
    background: linear-gradient(to bottom, rgba(240,240,240,1) 0%,rgba(255,255,255,1) 100%);
    padding: 2em 0 0;
    margin-top: -6.125em;
    padding-top: 7.875em;
}
#overview .voice .txt{
    text-align: center;
    margin: 0 0 2.56em;
}
#overview .lists{
    display: flex;
    justify-content: center;
    background: #fff;
    border-radius: 0.625em;
    box-shadow: 0 0 0.625em rgba(0,0,0,0.16);
}
#overview .lists li{
    width: 20%;
    text-align: center;
    padding: 2em 2.5em 2.5em;
    /*line-height: 1.0;*/
}
#overview .lists li .good{
    width: 4em;
    height: auto;
    vertical-align: top;
}
#overview .lists li img{
    width: 8.625em;
}
#overview .lists li + li{
    border-left: 1px solid #ddd;
}
#overview .lists .ttl{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-flow: column;
    height: 2.7em;
    text-align: center;
    font-size: 1.7rem;
    font-weight: bold;
    line-height: 1.4;
    background: url(../img/index/img_balloon_pc.png) bottom center no-repeat;
    background-size: 100% auto;
    padding: 0 0 1.2em;
    margin-top: 0.5em;
}
#overview .lists .ttl span{
    position: relative;
    display: inline-block;
}
#overview .lists li p{
    font-size: 1.4rem;
    margin: 1em 0 0;
}
#overview .system{
    width: 36.4375em;
    text-align: center;
    margin: 2.625em auto 0;
}

.ul{
    display: inline-block;
    font-size: 3.1rem;
    font-weight: bold;
    text-align: center;
    background: url(../img/index/border_overview.png) center bottom no-repeat;
    background-size: 100% auto;
    line-height: 1.0;
    margin: 0;
    padding: 0 0 0.7em;
}
.ul span{
    display: inline-block;
    background: url(../img/index/dots_overview.png) 0 0 repeat-x;
    background-size: 1em auto;
    padding: 0.35em 0 0;
}

.grad {
    background: linear-gradient(transparent 60%, #6EDFE8 60%);
}

@media screen and (max-width: 1000px) {
    
    #overview .lists li{
        padding: 2em 1.5em;
    }
    #overview .lists .ttl{
        font-size: 2.0rem;
    }
    #overview .system{
        width: 42em;
    }
    .btnSection .btn{
      width: 24em;
      font-size: 2.4rem;
    }
    .btnSection .btn a{
      height: 4em;
    }
    .ul{
        font-size: 4rem;
    }
}

@media screen and (max-width : 767px){

    #overview{
        margin: 6.4vw 0 0;
    }
    #overview .img{
        padding: 4.2vw 8vw 0;
    }
    #overview .lists{
        display: block;
    }
    #overview .voice{
        margin-top: -82vw;
        padding-top: 86.4vw;
    }
    #overview .voice .txt{
        margin-bottom: 5vw;
    }
    #overview .lists .ttl{
        height: auto;
        font-size: 1.6rem;
        line-height: 1.6;
        background: url(../img/index/img_balloon_sp.png) bottom center no-repeat;
        background-size: 100% auto;
        margin-bottom: 2vw;
        padding-bottom: 6.8vw;
    }
    #overview .lists li{
        width: auto;
        padding: 10vw 8vw 5.4vw;
    }
    #overview .lists li + li{
        border-top: 1px solid #ddd;
        padding-top: 5.4vw;
    }
    #overview .lists li .good{
        width: 22vw;
    }
    #overview .lists li img{
        width: 40vw;
    }
    #overview .system{
        width: 82vw;
        margin-top: 6.8vw;
    }
    .ul{
        font-size: 1.5rem;
    }
    .btnSection{
      padding: 5.3vw 0;
    }
    .btnSection .btn{
      width: 77vw;
      font-size: 1.6rem;
    }
    .btnSection .btn a{
      height: 12vw;
    }
}

/* overview */
#overview {
  margin-top: 10rem;
  padding-bottom: 16rem; }

@media screen and (max-width: 959px) {
  #overview {
    padding-bottom: 0; } }

#overview .big_lato {
  text-align: center;
  position: relative;
  z-index: -1; }

#overview .sec_ttl {
  position: absolute;
  left: 50%;
  top: 6rem;
  transform: translateX(-50%);
  white-space: nowrap; }

@media screen and (max-width: 767px) {
  #overview .sec_ttl {
    top: 2rem; } }


/* sec_detail */
#sec_detail {
  padding: 9rem 0;
  background-color: #F7F7F7; }
  @media screen and (max-width: 767px) {
    #sec_detail {
      padding: 6rem 0; } }
  @media screen and (max-width: 767px) {
    #sec_detail .ttl_cmn {
      margin-bottom: 2rem; } }
  @media screen and (max-width: 767px) {
    #sec_detail .ttl_cmn .ttl_ja {
      margin-bottom: 0; } }
  #sec_detail .detail {
    display: flex;
    justify-content: space-between;
    flex-flow: wrap; }
    #sec_detail .detail_list {
      width: 28.6%; }
      @media screen and (max-width: 767px) {
        #sec_detail .detail_list {
          width: 100%; } }
      @media screen and (max-width: 767px) {
        #sec_detail .detail_list._left {
          order: 2; } }
      @media screen and (max-width: 767px) {
        #sec_detail .detail_list._right {
          order: 3;
          margin-top: 1.6rem; } }
      #sec_detail .detail_list li {
        margin-bottom: 1.6rem;
        padding: 2rem 2.5rem;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.06);
        background-color: #fff;
        border-radius: 3rem;
        min-height: 22.5rem;
        position: relative; }
        @media screen and (max-width: 767px) {
          #sec_detail .detail_list li {
            padding: 2.7rem 4.5rem 4.5rem; } }
        #sec_detail .detail_list li:last-child {
          margin-bottom: 0; }
        #sec_detail .detail_list li .detail_ttl {
          text-align: center;
          padding: 0 3rem;
          margin-bottom: 1rem; }
          #sec_detail .detail_list li .detail_ttl .ttl_ja {
            font-size: 2.8rem;
            font-weight: 600; }
            @media screen and (max-width: 767px) {
              #sec_detail .detail_list li .detail_ttl .ttl_ja {
                font-size: 2.8rem; } }
          #sec_detail .detail_list li .detail_ttl .ttl_eng {
            font-family: "Jost";
            font-size: 1.2rem;
            font-weight: 700;
            text-transform: uppercase; }
            @media screen and (max-width: 767px) {
              #sec_detail .detail_list li .detail_ttl .ttl_eng {
                font-size: 2.1rem; } }
        #sec_detail .detail_list li .text {
          font-size: 1.4rem;
          margin-bottom: 1rem; }
          @media screen and (max-width: 767px) {
            #sec_detail .detail_list li .text {
              font-size: 2.4rem; } }
        #sec_detail .detail_list li .btn_cmn {
          height: auto;
          padding: 1.1rem;
          width: 100%;
          border-width: 0.3rem;
          font-size: 1.6rem; }
          @media screen and (max-width: 767px) {
            #sec_detail .detail_list li .btn_cmn {
              font-size: 2.6rem; } }
        #sec_detail .detail_list li .num {
          position: absolute;
          font-size: 4rem;
          color: #15B811;
          font-weight: 600;
          font-family: "Jost";
          left: 2.5rem;
          top: 2rem;
          line-height: 100%; }
          @media screen and (max-width: 767px) {
            #sec_detail .detail_list li .num {
              font-size: 7.3rem;
              left: 4.5rem; } }
    #sec_detail .detail .detail_phone {
      width: 38.4%; }
      @media screen and (max-width: 767px) {
        #sec_detail .detail .detail_phone {
          width: 100%;
          order: 1;
          text-align: center; } }
  #sec_detail .text_guide {
    margin-bottom: 4.4rem;
    margin-top: 2rem;
    text-align: center;
    color: #DA5077;
    font-size: 6rem;
    font-weight: 600;
    line-height: 8rem; }
    @media screen and (max-width: 767px) {
      #sec_detail .text_guide {
        font-size: 5rem; } }
    #sec_detail .text_guide .highlight {
      padding: 0 2.5rem; }
      @media screen and (max-width: 767px) {
        #sec_detail .text_guide .highlight {
          padding: 0 2rem; } }

#sec_free .wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-flow: wrap; }

#sec_free .info {
  width: 45%; }
  @media screen and (max-width: 959px) {
    #sec_free .info {
      width: 100%;
      margin-bottom: 2rem; } }
  #sec_free .info .ttl {
    font-size: 4rem;
    font-weight: 600;
    color: #70ad47;
    line-height: 4rem;
    margin-bottom: 1rem; }
    @media screen and (max-width: 959px) {
      #sec_free .info .ttl {
        font-size: 3rem; } }
  #sec_free .info .discount {
    font-size: 7rem;
    font-weight: 600;
    line-height: 5.5rem; }
    @media screen and (max-width: 959px) {
      #sec_free .info .discount {
        font-size: 5.6rem; } }
    #sec_free .info .discount .price {
      color: #70ad47;
      text-decoration: line-through; }
    #sec_free .info .discount .arrow {
      color: #DA5077;
      font-size: 5rem;
      padding: 0 1rem;
      font-family: Jost; }
  #sec_free .info .ttl_campaign {
    font-size: 4.5rem;
    font-weight: 600;
    margin-bottom: 2rem; }
    @media screen and (max-width: 959px) {
      #sec_free .info .ttl_campaign {
        font-size: 3.5rem; } }
  #sec_free .info .text_campaign {
    font-size: 3rem;
    font-weight: 600;
    background-color: #ffff00;
    line-height: 3rem;
    text-align: center;
    padding: 1.3rem;
    margin-bottom: 3rem; }
    @media screen and (max-width: 959px) {
      #sec_free .info .text_campaign {
        margin-bottom: 2rem; } }
  #sec_free .info .price_sell {
    font-size: 5.5rem;
    font-weight: 600;
    margin-bottom: 3.5rem; }
    @media screen and (max-width: 959px) {
      #sec_free .info .price_sell {
        font-size: 4.5rem; } }
  #sec_free .info .worry_info {
    border: 0.1rem solid #878787;
    padding: 2rem;
    position: relative;
    min-height: 4rem; }
    #sec_free .info .worry_info .text_stt {
      position: absolute;
      left: 0;
      top: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: #fff2cc;
      width: 10rem;
      text-align: center;
      height: 4rem;
      font-size: 2rem;
      font-weight: 600;
      font-family: Jost; }
    #sec_free .info .worry_info .ttl_sub {
      margin-left: 8rem;
      font-size: 2.5rem;
      text-align: center;
      font-weight: 600;
      margin-bottom: 2rem; }
      @media screen and (max-width: 959px) {
        #sec_free .info .worry_info .ttl_sub {
          margin-left: 0;
          padding-top: 5rem;
          font-size: 3.5rem;
          line-height: 5rem; } }
      #sec_free .info .worry_info .ttl_sub .highlight {
        padding: 0 1rem; }
    #sec_free .info .worry_info .agency_plan {
      text-align: center;
      font-size: 2.4rem;
      margin-bottom: 1rem; }
      @media screen and (max-width: 959px) {
        #sec_free .info .worry_info .agency_plan {
          font-size: 3rem; } }
    #sec_free .info .worry_info .text {
      font-size: 1.8rem;
      text-align: center; }
      @media screen and (max-width: 959px) {
        #sec_free .info .worry_info .text {
          font-size: 2.2rem; } }

#sec_free .table_wrap {
  width: 48%; }
  @media screen and (max-width: 959px) {
    #sec_free .table_wrap {
      width: 100%; } }
  #sec_free .table_wrap .table_price {
    width: 100%;
    border-collapse: collapse; }
    #sec_free .table_wrap .table_price th, #sec_free .table_wrap .table_price td {
      border: 1px solid #878787;
      vertical-align: middle;
      padding: .5em 0.5em; }
    #sec_free .table_wrap .table_price td {
      text-align: center; }
    #sec_free .table_wrap .table_price .thead {
      background-color: #ffc000;
      color: #fff;
      text-align: center; }
    #sec_free .table_wrap .table_price .ttl_body {
      width: 2rem;
      line-height: initial; }
    #sec_free .table_wrap .table_price .ttl_sub {
      text-align: left;
      background-color: #f2f2f2; }
  #sec_free .table_wrap .text_note {
    text-align: right;
    font-size: 1.3rem;
    padding-top: 1rem; }