/* btn */
.btn-base{
  display: block;
  border-radius: 999px;
  background: #fff;
  color: #00766E;
}
.btn-arrow{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  &::after{
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background: url(/images/rn2026/common/icon/arrow-right.svg) no-repeat;
    transition: all .3s;
  }
}
.btn-arrow-large{
  &::after{
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    background: url(/images/rn2026/common/icon/arrow-right-large.svg) no-repeat;
    transition: all .3s;
  }
}
.btn-border{
  border-radius: 999px;
  box-shadow: 0 0 10px 0 rgba(0, 165, 154, 0.30);
  background: #fff;
  border: 1px solid #fff;
  transition: all .3s;
  &:hover{
    border: 1px solid #008D84;
  }
}
.btn-clr-blk{
  color: #333;
}
.btn-ylw-whi{
  background: #FEE144;
  transition: all .3s;
  &:hover{
    background: #fff;
  }
}
.btn-whi-ylw{
  transition: all .3s;
  &:hover{
    background: #FEE144;
  }
}
.btn-whi-gry{
  transition: all .3s;
  &:hover{
    background: #DBF0EF;
  }
}
.btn-whi-grn{
  transition: all .3s;
  &:hover{
    color: #fff;
    background: #00766E;
  }
  &.btn-arrow{
    &:hover{
      &::after{
        background: url(/images/rn2026/common/icon/arrow-right-whi.svg) no-repeat;
      }
    }
  }
}
.btn-ylw-grn{
  background: #FEE144;
  transition: all .3s;
  &:hover{
    color: #fff;
    background: #00766E;
    &::after{
      background: url(/images/rn2026/common/icon/arrow-right-whi.svg) no-repeat;
    }
    &.btn-arrow-large{
      &::after{
        background: url(/images/rn2026/common/icon/arrow-right-large-whi.svg) no-repeat;
      }
    }
  }
}
.btn-cta{
  &:hover{
    color: #333;
  }
}

/* cta */
.cta{
  background: #008D84;
  padding: 56px 0;
  @media screen and (max-width: 767px){
    padding: 24px 32px;
  }
}
.cta-base{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
  @media screen and (max-width: 767px){
    display: block;
  }
}
.cta-inner-btn{
  display: flex;
  align-items: center;
  gap: 8px;
  @media screen and (max-width: 767px){
    flex-direction: column;
    margin-top: 8px;
    li{
      width: 100%;
    }
  }
}
.cta-read{
  color: #fff;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: 1.6px;
  @media screen and (max-width: 767px){
    font-size: 26px;
  }
}
.cta-logo{
  margin: 24px 0 56px;
  @media screen and (max-width: 767px){
    margin: 16px 0 8px;
  }
}

.cta-a{
  .btn-cta{
    padding: 10px 24px;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: .9px;
  }
  @media screen and (max-width: 1000px){
    padding: 24px 32px;
    .spb{
      display: block;
    }
    .pcb{
      display: none;
    }
    .cta-base{
      display: block;
    }
    figure{
      img{
        width: 100%;
      }
    }
    .cta-inner-btn{
      li{
        width: 50%;
      }
    }
  }
  @media screen and (max-width: 767px){
    .cta-inner-btn{
      li{
        width: 100%;
      }
    }
  }
}
.cta-b{
  .btn-cta{
    padding: 13px 0;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 1px;
    width: 368px;
    @media screen and (max-width: 767px){
      width: 100%;
    }
  }
  @media screen and (max-width: 767px){
    .cta-right{
      margin-top: 16px;
    }
  }
}