@charset "shift_jis";
/* Updated 2025/12/26.T */
/*---------------------------------------------
base
---------------------------------------------*/
@font-face {
  font-family: 'noto-sans-black';
  src:url(/kojin/campaign/fonts/NotoSansJP-Black.woff);
}
body {
  min-width: initial;
}
#footer-content {
  margin-top: 0;
}
#footer-fixed .panel {
  background: #ffffff99;
}
.section-main {
  background: url(/kojin/campaign/cardloan_20260115/imgs/index_bg_txt_01.png) 3vw 20% / 22.813vw no-repeat, url(/kojin/campaign/cardloan_20260115/imgs/index_img_man_01.png) calc((100% - 500px) / 2 - 8vw) 78% / min(15vw,180px) no-repeat, url(/kojin/campaign/cardloan_20260115/imgs/index_img_woman_01.png) calc((100% + 500px) / 2 + 8vw) 78% / min(15vw,145px) no-repeat, linear-gradient(122.3deg, #e2efbc 0, #e2efbc 23%, transparent 19%, transparent 100%) center top / 100% 34% no-repeat, linear-gradient(122.3deg, transparent 0, transparent 79%, #c1dbec 79%, #c1dbec 100%) center bottom / 100% 41% no-repeat, linear-gradient(122.3deg, #d7f1e9 0, #d7f1e9 50%, #95c5e7 50%, #95c5e7 100%) center top no-repeat;
  background-attachment: fixed;
}
@media screen and (max-width: 1799px) {
  .section-main {
    background: url(/kojin/campaign/cardloan_20260115/imgs/index_bg_txt_01.png) 3vw 20% / 22.813vw no-repeat, linear-gradient(122.3deg, #e2efbc 0, #e2efbc 23%, transparent 19%, transparent 100%) center top / 100% 34% no-repeat, linear-gradient(122.3deg, transparent 0, transparent 79%, #c1dbec 79%, #c1dbec 100%) center bottom / 100% 41% no-repeat, linear-gradient(122.3deg, #d7f1e9 0, #d7f1e9 50%, #95c5e7 50%, #95c5e7 100%) center top no-repeat;
    background-attachment: fixed;
  }
}
@media screen and (max-width: 1129px) {
  .section-main {
    background: linear-gradient(122.3deg, #e2efbc 0, #e2efbc 23%, transparent 19%, transparent 100%) center top / 100% 34% no-repeat, linear-gradient(122.3deg, transparent 0, transparent 79%, #c1dbec 79%, #c1dbec 100%) center bottom / 100% 41% no-repeat, linear-gradient(122.3deg, #d7f1e9 0, #d7f1e9 50%, #95c5e7 50%, #95c5e7 100%) center top no-repeat;
    background-attachment: fixed;
  }
}
/*---------------------------------------------
block
---------------------------------------------*/
#containment-area [class*=title-]+:not(.exception):not(.content-block01):not(.content-block02):not(.card-overflowing01) {
  margin-top: -1px;
}
.content-block01 {
  max-width: initial;
  padding: initial;
  overflow-y: hidden;
}
@media screen and (max-width: 767px) {
  .content-block01 {
    padding: initial;
  }
}
.content-block01>.inner {
  max-width: 500px;
  margin: auto;
  box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 767px) {
  .content-block01>.inner {
    max-width: 767px;
  }
}
.content-block01:not(:first-child) {
  margin-top: initial;
}
@media screen and (max-width: 767px) {
  .content-block01:not(:first-child) {
    margin-top: initial;
  }
}
.section-block01 {
  width: 100%;
  margin: auto;
  padding: 18% min(4.8vw, 24px);
}
.section-block01.-inner {
  padding: 11% 0 0;
}
.section-block01.-bg01 {
  background: linear-gradient(122.3deg, #d7f1e9 0, #d7f1e9 14%, #c1dbec 14%, #c1dbec 100%) no-repeat;
}
.section-block01.-bg02 {
  background: linear-gradient(122.3deg, transparent 0, transparent 21%, #c6de78 21%, #c6de78 63%, #e2efbc 63%, #e2efbc 100%) center top no-repeat, linear-gradient(122.3deg, transparent 0, transparent 10%, #d7f1e9 10%, #d7f1e9 100%) center bottom / 100% 97% no-repeat, #c1dbec;
}
.section-block01.-bg03 {
  background: linear-gradient(122.3deg, transparent 0, transparent 25%, #d7f1e9 25%, #d7f1e9 100%) center top no-repeat, linear-gradient(122.3deg, transparent 0, transparent 13%, #c1dbec 13%, #c1dbec 100%) center bottom / 100% 97% no-repeat, #e2efbc;
}
.section-block01.-bg04 {
  background: #f3f8f6;
}
.section-block01.-bg05 {
  background: #e1f4eb;
}
/*---------------------------------------------
table
---------------------------------------------*/
.table-wrap {
  border: 3px solid #004831;
  border-radius: 20px;
  overflow: hidden;
}
.table-row {
  font-size: 1.9rem;
}
@media screen and (max-width: 767px) {
  .table-row {
    font-size: 3.733vw;
  }
}
.table-row>.header {
  padding: 3%;
  text-align: center;
  font-weight: bold;
  color: #003927;
  background: #a0c81e;
}
.table-row>.data {
  padding: 5% 3%;
}
/*---------------------------------------------
box
---------------------------------------------*/
.box-green {
  padding: 2.3%;
  color: #fff;
  background: #004831;
}
.box-radius01 {
  margin: 28px 16px 0;
  padding: 1px 8px 12px;
  border-radius: 16px;
  background: #fff;
  font-size: 1.8rem;
}
.box-radius01>.img01 {
  margin-top: 4px;
}
.box-radius02 {
  color: #000;
  border-radius: 20px;
  background: #fff;
  line-height: 1.5;
  letter-spacing: initial;
}
.box-radius02.-shadow {
  font-weight: bold;
  text-align: center;
  background: #ffffff99;
  box-shadow: 0px 0px 20px 0px #00000014;
}
.box-radius02.-nav {
  display: none;
  position: fixed;
  top: 14%;
  right: 3%;
  padding: 2.9% 1%;
  max-width: 365px;
  width: 24%;
  font-weight: normal;
  background: linear-gradient(122.3deg, #ffffff99 0, #ffffff99 80%, #fff 79%, #fff 100%) 0 0 no-repeat, linear-gradient(122.3deg, #fff 0, #fff 27%, transparent 27%, transparent 100%) 0 0 / 100% 16% no-repeat;
  z-index: 2;
}
@media screen and (max-width: 1129px) {
  .box-radius02.-nav {
    display: none !important;
  }
}
.box-radius02.-lh {
  padding: min(6.4vw, 34px) 0 0;
  line-height: 2;
  font-size: 2.7rem;
}
@media screen and (max-width: 767px) {
  .box-radius02.-lh {
    font-size: 5.333vw;
  }
}
.box-radius02.-lh>.txt {
  letter-spacing: 0.06em;
  line-height: 2.1;
}
.box-radius02.-lh>.txt .large01 {
  -webkit-text-stroke: 0.08em;
  font-size: 1.3em;
}
.box-radius02.-inner {
  width: 90%;
  margin: auto;
  padding: 1.6% 1% 3%;
}
.box-radius02.-inner>.ttl {
  font-size: 2.4rem;
}
@media screen and (max-width: 767px) {
  .box-radius02.-inner>.ttl {
    font-size: 4.8vw;
  }
}
.box-radius02.-inner>.txt {
  margin-top: 1%;
  letter-spacing: 0.08em;
  -webkit-text-stroke: 0.08em;
  font-size: 2.6rem;
}
@media screen and (max-width: 767px) {
  .box-radius02.-inner>.txt {
    font-size: 5.333vw;
  }
}
.box-radius02.-inner>.txt>.large01 {
  font-size: 1.5em;
}
.box-radius02.-img,
.box-radius02.-img>* {
  position: relative;
}
.box-radius02.-img::before {
  content: '';
  position: absolute;
  left: -2%;
  top: -7%;
  width: 104%;
  height: 104%;
  background: url(/kojin/campaign/cardloan_20260115/imgs/index_bg_02.png) center center / contain no-repeat;
}
.box-circle {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  width: 264px;
  height: 264px;
  padding: 5%;
  text-align: center;
  font-size: 1.8rem;
  color: #4d7f6f;
  background: #fff;
  border: 3px solid #80a398;
  border-radius: 50%;
}
@media screen and (max-width: 767px) {
  .box-circle {
    width: 53vw;
    height: 53vw;
    font-size: 4.8vw;
  }
}
.text-step {
  font-size: 2.1rem;
  letter-spacing: 0.06em;
  -webkit-text-stroke: 0.13em;
}
@media screen and (max-width: 767px) {
  .text-step {
    font-size: 4.267vw;
  }
}
.text-step>.num {
  font-size: 1.6em;
}
.box-circle.-color02 {
  color: #017a4f;
  border-color: #017a4f;
}
.box-circle.-color03 {
  color: #003927;
  border-color: #003927;
}
.box-circle>.txt {
  font-weight: bold;
  color: #006444;
}
.box-circle.-color01::before,
.box-circle.-color02::before {
  content: '';
  position: absolute;
  bottom: -8%;
  width: 98px;
  height: 98px;
  mask-image: url(/kojin/campaign/cardloan_20260115/imgs/index_ico_tri_01.svg);
  -webkit-mask-image: url(/kojin/campaign/cardloan_20260115/imgs/index_ico_tri_01.svg);
}
@media screen and (max-width: 767px) {
  .box-circle.-color01::before,
  .box-circle.-color02::before {
    width: 20vw;
    height: 20vw;
  }
}
.box-circle.-color01::before {
  right: -4%;
  transform: rotate(-42deg);
  background: #80a398;
}
.box-circle.-color02::before {
  left: -4%;
  transform: rotate(42deg);
  background: #017a4f;
}
/*---------------------------------------------
card
---------------------------------------------*/
.card-normal01.-green01 {
  border: 3px solid #004831;
  border-radius: 10px;
}
.card-normal01.-green01>.inner>.body:not(:first-child)::before {
  height: 3px;
  background: #004831;
}
.toggle-block01>[role=tablist]>[role=tab]::after {
  mask-image: url(/kojin/cmn/imgs/ico_arrow_right_01.svg);
  -webkit-mask-image: url(/kojin/cmn/imgs/ico_arrow_right_01.svg);
  background: #141d1d;
}
/*---------------------------------------------
campaign-box01
---------------------------------------------*/
.campaign-box01 {
  position: relative;
  border-radius: 16px;
  background: #ffffff99;
  box-shadow: 0px 0px 20px 0px #00000014;
  text-align: center;
}
.campaign-box01::before {
  content: '';
  position: absolute;
  left: -2%;
  top: 15%;
  width: 104%;
  height: 104%;
  background: url(/kojin/campaign/cardloan_20260115/imgs/index_bg_02.png) center top / contain no-repeat;
}
.campaign-box01>.wrap01 {
  padding: 24px 0 16px;
}
.campaign-box01>.wrap01>.txt01 {
  padding: 0 11.5px;
}
.campaign-box01>.wrap01>.txt02 {
  margin-top: 6px;
  color: #004831;
  font-weight: bold;
  letter-spacing: 0.08em;
}
.campaign-box01>.wrap01>.imgWrap01 {
  position: relative;
  display: inline-block;
  margin-top: 34px;
}
.campaign-box01>.wrap01>.imgWrap01>.img01 {
  position: absolute;
  top: -20px;
  left: -100px;
  width: 99px;
  height: auto;
}
.campaign-box01>.wrap01>.imgWrap02 {
  margin-top: 12px;
  padding: 0 19px;
}
.campaign-box01>.wrap02 {
  padding: 6px 0 12px;
  background: #004831;
  border-radius: 0 0 16px 16px;
  color: #fff;
}
.campaign-box01>.wrap02>.txt01 {
  font-size: 2.0rem;
  font-weight: bold;
  line-height: 2.0;
  letter-spacing: 0em;
}
.campaign-box01>.wrap02>.txt02 {
  margin-top: 10px;
  font-size: 1.2rem;
  line-height: 1.5;
  letter-spacing: 0em;
}
.campaign-box01>.wrap02>.img01 {
  margin-top: 4px;
}
.campaign-box01 .btn-list01:not(:first-child) {
  margin-top: 10px;
}
/*---------------------------------------------
app-box01
---------------------------------------------*/
.app-box01 {
  position: relative;
  margin-top: 50px;
  padding: 26px 0;
  border: 3px solid #ffe204;
  border-radius: 16px;
  background: #fff;
  text-align: center;
  font-weight: bold;
}
.app-box01>.txt01 {
  position: absolute;
  left: 15px;
  top: -26px;
}
.app-box01>.txt02 {
  padding: 0 18px;
  color: #004831;
  letter-spacing: 0.08em;
}
.app-box01>.txt03 {
  margin-top: 16px;
  font-size: 2.0rem;
}
.app-box01>.img01 {
  margin-top: 12px;
  padding: 0 16px;
}
.app-box01>.img02 {
  margin-top: 12px;
  padding: 0 12px;
}
@media screen and (max-width: 374px) {
  .app-box01>.txt01 {
    left: 0;
  }
}
/*---------------------------------------------
image
---------------------------------------------*/
.img-caption>.txt {
  margin-top: 16px;
  text-align: left;
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  .img-caption>.txt {
    font-size: 4.267vw;
  }
}
/*---------------------------------------------
step-txt01
---------------------------------------------*/
.step-txt01 {
  position: relative;
  margin-top: 16px;
}
/*---------------------------------------------
list
---------------------------------------------*/
.list-step>* {
  position: relative;
}
.list-step>*::after {
  content: '';
  position: absolute;
  width: 175px;
  height: 232px;
}
@media screen and (max-width: 767px) {
  .list-step>*::after {
    width: 34.667vw;
    height: 45.333vw;
  }
}
.list-step>.step01::after {
  top: 2%;
  right: 4%;
  background: url(/kojin/campaign/cardloan_20260115/imgs/index_img_woman_01.png) center center / contain no-repeat;
}
.list-step>.step02::after {
  top: 6%;
  left: -3%;
  background: url(/kojin/campaign/cardloan_20260115/imgs/index_img_man_01.png) center center / contain no-repeat;
}
.list-step>.step03::after {
  bottom: -10%;
  right: 6%;
  background: url(/kojin/campaign/cardloan_20260115/imgs/index_img_man_02.png) center center / contain no-repeat;
}
.list-step>.step02 {
  text-align: right;
}
.list-step>:not(:first-child) {
  margin-top: -4%;
}
.list-nav {
  color: #004831;
}
.list-nav>.title {
  position: relative;
  display: inline-block;
  font-size: min(2.865vw, 4.0rem);
  -webkit-text-stroke: 0.05em;
}
.list-nav>.title::before {
  content: '';
  position: absolute;
  bottom: 6px;
  width: 100%;
  height: 0.075em;
  background: linear-gradient(90deg, #004831 0, #004831 26%, transparent 26%, transparent 30%, #004831 30%, #004831 46%, transparent 46%, transparent 49%, #004831 49%, #004831 100%);
}
.list-nav>.item {
  text-align: left;
  font-size: min(1.302vw, 1.8rem);
}
.list-nav>.item:first-of-type {
  margin-top: 2.223em;
}
.list-nav>.item:not(:first-of-type) {
  margin-top: 1.334em;
}
.list-nav>.item>.link.-active::before {
  content: '';
  position: absolute;
  left: 0;
  top: calc(50% - 1em);
  width: 2em;
  height: 2em;
  mask: url(/kojin/campaign/cardloan_20260115/imgs/index_ico_tri_01.svg) no-repeat;
  -webkit-mask: url(/kojin/campaign/cardloan_20260115/imgs/index_ico_tri_01.svg) no-repeat;
  background: #017a4f;
  transform: rotate(270deg);
}
.list-nav>.item>.link {
  position: relative;
  display: block;
  padding-left: 12%;
  text-decoration: none;
}
.list-nav>.item>.link:hover {
  text-decoration: underline;
}
.list-nav>.item>.link.-active {
  font-weight: bold;
}
#content-area .list-notice01._t-red01 {
  margin-top: 9%;
  font-weight: bold;
  font-size: 2.1rem;
}
@media screen and (max-width: 767px) {
  #content-area .list-notice01._t-red01 {
    font-size: 4.267vw;
  }
}
/*---------------------------------------------
title
---------------------------------------------*/
@media screen and (min-width: 768px) {
  .title-mv {
    background: url(/kojin/campaign/cardloan_20260115/imgs/index_bg_01.png) center repeat-x, linear-gradient(122.3deg, #e2efbc 0, #e2efbc 29.7%, transparent 29.7%, transparent 100%) center 0 / 100% 25% no-repeat, linear-gradient(122.3deg, transparent 0, transparent 77%, #c1dbec 77%, #c1dbec 100%) center bottom / 100% 79.4% no-repeat, linear-gradient(122.3deg, #c1dbec 0, #c1dbec 34.8%, #d7f1e9 34.8%, #d7f1e9 58.6%, #95c5e7 58.6%, #95c5e7 100%) 0 0 no-repeat;
  }
}
.title-balloon {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 2% 9%;
  color: #004831;
  border: 4px solid #004831;
  border-radius: 100px;
  background: #fff;
}
.title-balloon>.inner {
  font-size: 3.4rem !important;
}
@media screen and (max-width: 767px) {
  .title-balloon>.inner {
    font-size: 6.4vw !important;
  }
}
.title-balloon.-small01 {
  line-height: 1;
}
.title-balloon::before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -1em;
  width: 1.7em;
  height: 1em;
  background: #004831;
  clip-path: polygon(100% 0, 0 0, 50% 100%);
  -webkit-clip-path: polygon(100% 0, 0 0, 50% 100%);
  transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
  .title-heading02 {
    margin-bottom: 10.667vw;
  }
}
@media screen and (max-width: 767px) {
  .title-heading03 {
    margin-bottom: 5.867vw;
  }
}
[class*=section-block]>[class*=title-heading],
[class*=title-heading]>.inner {
  margin-top: 0;
}
/*---------------------------------------------
button
---------------------------------------------*/
.btn-type01.-orange01,
.btn-type01.-yellow01 {
  margin-bottom: 5px;
  font-size: 2.1rem;
  border: 3px solid #003927;
  box-shadow: 0 5px 0 0 #003927;
}
.btn-type01.-orange01 {
  background: #ff5f1c;
}
.btn-type01.-yellow01 {
  background: #ffe204;
}
@media screen and (max-width: 767px) {
  .btn-type01.-orange01,
  .btn-type01.-yellow01 {
    font-size: 4.267vw;
  }
}
.btn-type01>.inner {
  min-height: 2.5em;
  letter-spacing: 0.12em;
}
.btn-type01.-large01 {
  width: min(84vw, 418px);
}
/*---------------------------------------------
icon
---------------------------------------------*/
.icon-link01.-orange01>.inner::after {
  background-image: url(/kojin/cmn/imgs/ico_arrow_right_02.svg);
}
/*---------------------------------------------
glyph
---------------------------------------------*/
[class*=glyph-]>.inner {
  padding-left: 1.5em;
}
.glyph-tel02>.inner::before {
  background: url(/kojin/campaign/cardloan_20260115/imgs/index_ico_tel_01.svg) 0 0 / 100% auto no-repeat;
}
/*---------------------------------------------
icon-blank01
---------------------------------------------*/
a.icon-blank01.-red01 {
  color: #c83030;
}
/*---------------------------------------------
js
---------------------------------------------*/
@media screen and (max-width: 767px) {
  .carousel-block02 {
    overflow: initial;
  }
}
.carousel-block02.-small01>.list {
  position: relative;
  top: -1.3em;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .carousel-block02.-small01 {
    margin-right: initial;
    margin-left: initial;
  }
}
.carousel-block02.-small01>.list .item>.inner {
  width: 320px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .carousel-block02.-small01>.list .item>.inner {
    width: 80vw;
    max-width: initial;
    margin-right: 4.8vw;
    margin-left: 4.8vw;
  }
}
.carousel-block02.-small01>.list .inner>.detail {
  margin-top: 10% !important;
}
.slick-slide img {
  display: inline-block;
}
.carousel-block02>.list>.slick-arrow.slick-prev {
  left: 0;
}
.carousel-block02>.list>.slick-arrow.slick-next {
  right: 0;
}
.carousel-block02>.list>.slick-arrow {
  top: calc(50% - ((66px - 7px) / 2));
  width: 66px;
  height: 66px;
  mask: url(/kojin/campaign/cardloan_20260115/imgs/index_ico_tri_01.svg) 0 0 / contain no-repeat;
  -webkit-mask: url(/kojin/campaign/cardloan_20260115/imgs/index_ico_tri_01.svg) 0 0 / contain no-repeat;
  background: #a0c81e;
  border-radius: initial;
}
.carousel-block02>.list>.slick-arrow.slick-prev {
  transform: rotate(90deg);
}
.carousel-block02>.list>.slick-arrow.slick-next {
  transform: rotate(270deg);
}
.carousel-block02>.list>.slick-arrow:before {
  content: initial;
}
.carousel-block02>.list.slick-dotted {
  padding-bottom: 30px;
}
.carousel-block02.-small01:not(:first-child) {
  margin-top: 18%;
}
/*---------------------------------------------
text
---------------------------------------------*/
.text-mark01 {
  background: linear-gradient(transparent 90%, #004831 10%);
}
.txt [class*="large"] {
  line-height: 1;
}
/*---------------------------------------------
general
---------------------------------------------*/
._t-bolber {
  font-family: 'noto-sans-black' !important;
  font-weight: 900 !important;
}
._inner-mt01>:not(:first-child) {
  margin-top: 2% !important;
}
._inner-mt02>:not(:first-child) {
  margin-top: 3.5% !important;
}
._inner-mt03>:not(:first-child) {
  margin-top: 4.7% !important;
}
@media screen and (min-width: 768px) {
  [class*="_inner-mt"]>._sp-content:first-child+* {
    margin-top: 0 !important;
  }
}
@media screen and (max-width: 767px) {
  [class*="_inner-mt"]>._pc-content:first-child+* {
    margin-top: 0 !important;
  }
}
._fs14 {
  font-size: 1.9rem !important;
}
@media screen and (max-width: 767px) {
  ._fs14 {
    font-size: 3.733vw !important;
  }
}
._fs16 {
  font-size: 2.1rem !important;
}
@media screen and (max-width: 767px) {
  ._fs16 {
    font-size: 4.267vw !important;
  }
}
._fs18 {
  font-size: 2.4rem !important;
}
@media screen and (max-width: 767px) {
  ._fs18 {
    font-size: 4.8vw !important;
  }
}
._fs20 {
  font-size: 2.7rem !important;
}
@media screen and (max-width: 767px) {
  ._fs20 {
    font-size: 5.333vw !important;
  }
}
._fs24 {
  font-size: 3.2rem !important;
}
@media screen and (max-width: 767px) {
  ._fs24 {
    font-size: 6.4vw !important;
  }
}
._fsXs {
  font-size: 1.6rem !important;
}
@media screen and (max-width: 767px) {
  ._fsXs {
    font-size: 3.2vw !important;
  }
}