@charset "shift_jis";
/* Updated 2026/02/27.ht */

/*-------------------------
common
-------------------------*/
#footer-content {
  background: #004831;
}
._c-gray {
  color: #56635F!important;
}
._mt10 {
  margin-top: 10px!important;
}
._mt14 {
  margin-top: 14px!important;
}
._mt15 {
  margin-top: 15px!important;
}
._mt20 {
  margin-top: 20px!important;
}
._mt25 {
  margin-top: 25px!important;
}
._mt26 {
  margin-top: 26px!important;
}
._mt28 {
  margin-top: 28px!important;
}
._mt30 {
  margin-top: 30px!important;
}
._mt38 {
  margin-top: 38px !important;
}
._mt45 {
  margin-top: 45px !important;
}
._mt46 {
  margin-top: 46px !important;
}
._mt47 {
  margin-top: 47px !important;
}
._mt60 {
  margin-top: 60px !important;
}
._mt62 {
  margin-top: 62px !important;
}
._mt67 {
  margin-top: 67px !important;
}
._mt74 {
  margin-top: 74px !important;
}

@media screen and (max-width: 767px) {
  ._sp-mt00 {
    margin-top: 0px!important;
  }
  ._sp-mt02 {
    margin-top: 2px!important;
  }
  ._sp-mt04 {
    margin-top: 4px!important;
  }
  ._sp-mt06 {
    margin-top: 6px!important;
  }
  ._sp-mt10 {
    margin-top: 10px!important;
  }
  ._sp-mt12 {
    margin-top: 12px!important;
  }
  ._sp-mt14 {
    margin-top: 14px!important;
  }
  ._sp-mt15 {
    margin-top: 15px!important;
  }
  ._sp-mt16 {
    margin-top: 16px!important;
  }
  ._sp-mt18 {
    margin-top: 18px!important;
  }
  ._sp-mt20 {
    margin-top: 20px!important;
  }
  ._sp-mt22 {
    margin-top: 22px!important;
  }
  ._sp-mt23 {
    margin-top: 23px!important;
  }
  ._sp-mt24 {
    margin-top: 24px!important;
  }
  ._sp-mt26 {
    margin-top: 26px!important;
  }
  ._sp-mt30 {
    margin-top: 30px!important;
  }
  ._sp-mt31 {
    margin-top: 31px!important;
  }
  ._sp-fs10 {
    font-size: 1.0rem !important;
  }
  ._sp-fs22 {
    font-size: 2.2rem !important;
  }
  ._sp-fs18 {
    font-size: 1.8rem !important;
  }
  ._sp-fs16 {
    font-size: 1.6rem !important;
  }
  ._sp-fs12 {
    font-size: 1.2rem !important;
  }
  ._sp-fs13 {
    font-size: 1.3rem !important;
  }
  ._sp-fs60 {
    font-size: 6.0rem!important;
  }
}
a[target="_blank"][href*=".smbc.co.jp"],
a[target="_blank"][href^="/"]:not([href$=".pdf"]) {
  outline: none;
}
a[target="_blank"][href*=".smbc.co.jp"]::after,
a[target="_blank"][href^="/"]:not([href$=".pdf"])::after {
  display: none;
}

#wrap #mainArea.-full .main-inner {
  padding-top: 80px;
}
@media screen and (max-width: 767px) {
  #wrap #mainArea.-full .main-inner {
    padding-top: 62px;
  }
}

.title-section01 {
  margin-top: 94px;
  padding: 0px 0px 9px;
}
@media screen and (max-width: 767px) {
  .title-section01 {
    margin-top: 80px;
    padding: 0px 16px 14px;
  }
  .title-section01 .title {
    line-height: 1.5;
  }
}

.card-btn-wrap03 .item .inner {
  padding-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .card-btn-wrap03 .item .inner {
    padding: 30px 50px 40px 114px;
  }
}

.card-btn-wrap03 .item .inner .title01 {
  margin-top: 10px;
  font-size: 16px;
}

@media screen and (max-width: 767px) {
  .card-btn-wrap03 .item .inner .icon {
    left: 32px;
  }
}

.card-btn-wrap03 .item .inner::after {
  bottom: 7px;
  right: calc(50% - 11px);
  transform: rotate(90deg);
}

@media screen and (max-width: 767px) {
  .card-btn-wrap03 .item .inner::after {
    right: 19px;
    bottom: calc(50% - 11px);
  }
}

.card-wrap03 {
  display: block;
  margin-top: 30px;
}
@media screen and (max-width: 767px) {
  .card-wrap03 {
    margin-top: 24px;
  }
}

.card-wrap03 > .item {
  width: 100%;
  padding: 0;
}

.card-wrap03 > .item .point {
  position: absolute;
  left: 0;
  top: 0;
  width: 64px;
  height: 64px;
  background: url(/hojin/cmn/imgs/bg_frame_green_01.png) no-repeat 0 0 / 100%;
  color: #fff;
  font-size: 1.4rem;
  font-family: roboto;
}
.card-wrap03 > .item .point > span {
  display: block;
  position: absolute;
  left: 4px;
  top: 14px;
  transform: rotate(-45deg);
}

.card-wrap03 > .item > a {
  display: block;
  padding: 46px 42px;
  text-decoration: none;
  color: #141D1D;
  transition: background-color 0.3s ease-out;
}
.card-wrap03 > .item > a:hover {
  background: #f5f5f5;
}
@media screen and (max-width: 767px) {
  .card-wrap03 > .item > a {
    padding: 46px 31px;
  }
}

.list-circle01.-green01 > .item::before {
  background: #004831;
}

.ttl-txt01 {
  margin-top: 29px;
  padding: 6px 16px;
  color: #fff;
  text-align: center;
  font-weight: bold;
  font-size: 18px;
  background: #004831;
}
@media screen and (max-width: 767px) {
  .ttl-txt01 {
    padding: 4px 16px;
    font-size: 14px;
  }
}

.text-mark01 {
  background: linear-gradient(transparent 60%, #eef5d7 60%);
}