/*color*/
/*font*/
.hero {
  color: #fff; }
  .hero__container {
    position: relative; }
  .hero .hero-content__logo {
    position: relative; }
    .hero .hero-content__logo:before {
      content: "";
      display: block;
      width: 60px;
      height: 5px;
      position: absolute;
      bottom: 0;
      left: 0;
      background: #f6f936; }
  .hero .hero-content__txt {
    font-weight: bold;
    line-height: 1.625;
    letter-spacing: 2px; }
    .hero .hero-content__txt__sub {
      margin-top: 4px;
      display: block; }
  .hero .hero-img {
    content: ""; }
  @media screen and (min-width: 769px) {
    .hero__container {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      height: 37vw;
      min-height: 480px;
      max-height: 90vh;
      padding: 6.25vw 0 6.25vw 8vw;
      background: url(../images/webcon/hero_02.jpg) no-repeat center/cover; }
    .hero .hero-content {
      width: calc(100% - 53.75vw); }
      .hero .hero-content__logo {
        width: 24vw;
        margin-bottom: 2.1vw;
        padding-bottom: 2.1vw; }
      .hero .hero-content__txt--main {
        font-size: 2.5vw; }
      .hero .hero-content__txt--sub {
        font-size: 1.6vw; }
      .hero .hero-content__btn .btn {
        margin-top: 2.1vw;
        margin-left: 0; }
    .hero .hero-img {
      position: absolute;
      width: 53.75vw;
      height: 104%;
      top: 0;
      right: 0;
      background: url(../images/webcon/hero_08.png) no-repeat center right/contain; } }
  @media screen and (max-width: 768px) {
    .hero__container {
      padding-top: 10vw;
      background: url(../images/webcon/sp_hero_02.jpg) no-repeat center/cover; }
    .hero .hero-content {
      padding: 0 10px;
      text-align: center; }
      .hero .hero-content__logo {
        width: 68vw;
        margin: 0 auto 4.2vw;
        padding-bottom: 4.2vw; }
        .hero .hero-content__logo:before {
          width: 132px;
          height: 3px;
          left: calc(50% - 66px); }
      .hero .hero-content__txt--main {
        font-size: 7vw; }
      .hero .hero-content__txt--sub {
        margin-top: 4px;
        display: block;
        font-size: 3.6vw; }
      .hero .hero-content__btn .btn {
        margin: 5vw auto 0; }
    .hero .hero-img {
      position: relative;
      top: 20px;
      margin-top: 3vw;
      width: 100%;
      padding-top: 75.9%;
      background: url(../images/webcon/sp_hero_08.png) no-repeat center/contain; } }

#point {
  background: #ebf6ff; }

.point-list__item:not(:last-child) {
  margin-bottom: 32px; }

.point-card__ttl {
  margin-bottom: 28px;
  line-height: 1.25;
  color: #0054af; }
  .point-card__ttl--num {
    font-size: 8rem; }
  .point-card__ttl--main {
    font-size: 2.6rem; }

@media screen and (min-width: 769px) {
  .point-card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }
    .point-card__content {
      width: calc(100% - 360px); }
    .point-card__img {
      width: 300px; }
    .point-card__txt {
      font-size: 1.8rem; }
    .point-list__item:nth-child(even) .point-card {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; } }

@media screen and (max-width: 768px) {
  .point-card__ttl {
    margin-bottom: 16px;
    text-align: center; }
    .point-card__ttl--num {
      font-size: 6rem; }
    .point-card__ttl--main {
      font-size: 2.4rem; }
  .point-card__img {
    margin-top: 20px;
    text-align: center; } }

@media screen and (min-width: 769px) {
  .work-list {
    margin-bottom: -40px; }
    .work-list__item {
      margin-bottom: 40px; } }

.work-card {
  display: block;
  color: inherit;
  text-decoration: none;
  -webkit-transition: all .15s;
  -o-transition: all .15s;
  transition: all .15s; }
  .work-card__img {
    background: #f6f6f6;
    text-align: center;
    padding: 20px 10px;
    margin-bottom: 16px; }
    .work-card__img img {
      height: 120px;
      width: auto; }
  .work-card__ttl {
    position: relative;
    font-size: 2.1rem;
    text-align: center;
    line-height: 1.25;
    margin-bottom: 12px;
    padding-bottom: 24px; }
    .work-card__ttl:before {
      content: "";
      display: block;
      width: 14px;
      height: 14px;
      position: absolute;
      left: calc(50% - 7px);
      bottom: 5px;
      border-right: 3px solid #36a0f9;
      border-bottom: 3px solid #36a0f9;
      -webkit-transition: all .15s;
      -o-transition: all .15s;
      transition: all .15s;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }
  .work-card__txt {
    font-size: 14px;
    line-height: 1.75; }
  .work-card:hover .work-card__img {
    opacity: .8; }
  .work-card:hover .work-card__ttl:before {
    bottom: 2px; }

#price {
  background: #0054af; }
  #price .ttl {
    color: #fff; }

.price-sheet {
  background: #fff;
  color: initial;
  padding: 40px;
  border: 12px solid #ddd; }
  .price-sheet__content {
    border-bottom: 1px solid #ddd; }
  @media screen and (max-width: 768px) {
    .price-sheet {
      padding: 20px;
      padding-bottom: 30px;
      border-width: 8px; } }

.price-num {
  margin-bottom: 24px;
  text-align: center;
  line-height: 1.25;
  font-weight: bold; }
  .price-num__num {
    font-size: 6rem; }
  .price-num__unit {
    font-size: 3rem; }
  .price-num__note {
    font-size: 2rem; }
  .price-num--lg .price-num__num {
    font-size: 7.2rem; }
  .price-num--lg .price-num__unit {
    font-size: 4rem; }
  .price-num--lg .price-num__note {
    font-size: 3rem; }
  @media screen and (max-width: 768px) {
    .price-num__num {
      font-size: 4rem; }
    .price-num__unit {
      font-size: 2rem; }
    .price-num__note {
      font-size: 1.6rem; }
    .price-num--lg .price-num__num {
      font-size: 4rem; }
    .price-num--lg .price-num__unit {
      font-size: 2rem; }
    .price-num--lg .price-num__note {
      font-size: 1.6rem; } }

.bg-ttl {
  font-size: 2.1rem;
  text-align: center;
  line-height: 1.25;
  margin-bottom: 12px;
  padding: 6px;
  background: #e2f1fd; }