@charset "UTF-8";
/* general 
-------------------------------------------- */
:root {
  --color-pink: #f222c3;
  --color-pink2: #ffa4de;
  --color-red: #fe0000;
  --color-blue: #2411b6;
  --color-blue2: #138aff;
  --color-sky: #7ecef4;
  --color-purple: #967bdc;
  --color-violet: #5e90e7;
  --color-yellow: #ffff01;
  --color-iyo: #007260;
  --color-black: #333;
  --gradation: linear-gradient(135deg, #f222c3 0, #5d92ed 100%);
  --fs-small: 14px;
  --fs-medium: clamp(1.25rem, 1.068rem + 0.91vw, 1.75rem);
  --fs-large: clamp(1.5rem, 1.364rem + 0.68vw, 1.875rem);
  --ff-gothic: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "Meiryo UI", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  --ff-yu-go: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "Meiryo UI", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  --ff-yu-go-l: "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "Meiryo UI", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  /* --ff-rubik: "Rubik", sans-serif; */
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
html {
  font-size: 16px;
  scroll-behavior: smooth;
}
body {
  font-family: var(--ff-yu-go);
  line-height: 1.75;
  color: var(--color-black);
}

h1,h2,h3,h4,h5,h6,p,a,li,figcaption,dt,dd,th,td,input,textarea,label {
  color: var(--color-black);
  margin: 0;
}
h1,h2,h3,h4,h5,h6 {
  font-weight: 700;
  font-family: var(--ff-gothic);
  font-feature-settings: "palt";
}
ol,ul {
  list-style: none;
}
img {
  max-width: 100%;
}
a img {
  transition: 0.3s;
}
a:hover {
  text-decoration: none;
  opacity: 0.8;
  color: inherit;
}
:is(p, ul):last-child {
  margin-bottom: 0;
}
#wrap {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}
@media screen and (min-width: 640px) {
  a[href^="tel"] {
    pointer-events: none;
  }
}
@media screen and (max-width: 640px) {
  html {
  }
}
/* parts
-------------------------------------------- */
.fs-small {
  font-size: var(--fs-small);
}
.fs-medium {
  font-size: var(--fs-medium);
}
.fs-large {
  font-size: var(--fs-large);
}
.fs-20 {
  font-size: clamp(1.125rem, 0.911rem + 0.95vw, 1.625rem);
}
.font-gothic {
  font-family: var(--ff-gothic);
}
.color-pink {
  color: var(--color-pink) !important;
}
.color-blue {
  color: var(--color-blue2);
}
.color-red {
  color: var(--color-red);
}
.color-iyo {
  color: var(--color-iyo);
}
.color-wht {
  color: #fff !important;
}
.link-txt {
  text-decoration: underline;
  color: var(--color-blue);
}
.link-arrow::before {
  content: "";
  background: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22a%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.987%22%20height%3D%2212.681%22%20viewBox%3D%220%200%206.987%2012.681%22%3E%3Cpolyline%20points%3D%22.413%20.413%206.403%206.403%20.539%2012.268%22%20fill%3D%22none%22%20stroke%3D%22%231a378c%22%20stroke-linecap%3D%22round%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%221%22%2F%3E%3C%2Fsvg%3E")
    no-repeat;
  background-size: contain;
  background-position: 50% 50%;
  width: 7px;
  height: 1em;
  display: inline-block;
  margin-right: 7px;
  vertical-align: middle;
}
:where(ul, ol).fineindent {
  padding-left: 15px;
  & > li {
    text-indent: -1em;
  }
}
p.fineindent {
  margin-left: 1em;
  text-indent: -1em;
}
.bg-yellow {
  background-color: var(--color-yellow);
}
.bg-wht {
  background-color: #fff;
}
.bg-pink {
  background-color: var(--color-pink);
}
.bg-blue {
  background-color: var(--color-blue);
}
.bg-purple {
  background-color: rgba(150, 122, 220, 0.1);
}
.bg-gray {
  background-color: #f1f1f1;
}
.bg-gradation {
  background: linear-gradient(135deg, rgba(242, 34, 195, 0.2) 0, rgba(94, 144, 231, 0.2) 100%);
}
@media screen and (max-width: 640px) {
  :where(a, p, div, li, h3):has(> wbr) {
    word-break: keep-all;
  }
}
@media screen and (max-width: 768px) {
  li.sp-close:not(.uk-open):not(:has([aria-expanded])) .uk-accordion-content {
    display: none;
  }
  .uk-accordion-content {
    font-size: 0.875rem;
  }
}

/*アニメーション*/
.is-active {
  animation: buruburu 1s linear infinite;
  scale: 1;
}
@keyframes buruburu {
  0% {transform: translateX(0);}
  20% {transform: translateX(-5px);}
  40% {transform: translateX(5px);}
  60% {transform: translateX(-5px);}
  80% {transform: translateX(5px);}
  90% {transform: translateX(0px);}
}
.grad-text {
  /*グラデーション文字*/
  font-weight: 700;
  background: var(--gradation);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.btn-grad {
  border-radius: 3em;
  display: inline-block;
  background: linear-gradient(to bottom, #9fc0ff 0%, #138aff 100%);
  color: #fff;
  font-family: var(--ff-yu-go-l);
  font-weight: 700;
  font-size: clamp(1rem, 0.85rem + 0.67vw, 1.25rem);
  width: 300px;
  max-width: 100%;
  padding: 10px;
  text-align: center;
  &:hover {
    color: #fff;
  }
}
.uk-text-bold {
  font-family: var(--ff-yu-go-l);
}
/* header
-------------------------------------------- */
header {
  background: #fff;
  position: relative;
  width: 100%;
  margin: 0 auto;
}
.header__iyogin {
  text-align: center;
  background: #fff;
}
.header.uk-sticky-fixed.uk-active {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.header__logo {
  padding: 20px 10px 20px;
  width: 336px;
}
.header__nav {
  padding-right: 22px;
}
.header__nav .header__nav-inner {
  display: flex;
}
.header__nav .header__nav-inner li a {
  position: relative;
}
.header__nav .header__nav-inner li a::after {
  content: '';
    background: url(../img/arrow-pink.svg) no-repeat;
    background-position: 50% 100%;
    background-size: contain;
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-left: 3px;
}
.header__container {
  position: relative;
  max-width: 1340px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 960px) {
  .header__container {
    /* display: block; */
  }
  .header__logo {
    padding: 10px 20px;
    /* margin: auto; */
    width: auto;
  }
}
/* main
-------------------------------------------- */
main {
  display: block;
  border: 5px solid var(--color-blue);
}
section {
  margin: 0;
  padding-block: 60px;
  /* &:has(h2.sec__title-main:first-child) {
    padding-top: 0;
  } */
}
[class*="sec__inner"] {
  max-width: 1110px;
  margin-left: auto;
  margin-right: auto;
}
.sec__inner-small {
  max-width: 980px;
}
.sec__inner-x-small {
  max-width: 725px;
}
.sec__inner-xx-small {
  max-width: 680px;
}
@media screen and (max-width: 960px) {
  section {
    /* padding: 60px 0; */
  }
  [class*="sec__inner"] {
    padding-left: 20px;
    padding-right: 20px;
  }
  .sec__inner,
  .sec__inner-small,
  .sec__inner-x-small {
    max-width: 100%;
  }
}
#kv__area {
  margin: 0 auto;
  padding-block: 0;
  text-align: center;
  background: none;
}
.kv__top {
  background: url(../img/kv_bg.svg);
  background-size: cover;
  background-position: 50%;
}
#kv__area .kv__container {
  margin: 0 auto;
  position: relative;
}
.kv__top h1 {
  padding-top: 30px;
}
@media screen and (max-width: 640px) {
  .kv__top h1 {
  }
}
.kv__copy {
  background-color: var(--color-blue);
  margin-top: calc(50px + 11vw);
  position: relative;
}
@media screen and (max-width: 640px) {
  .kv__copy {
  margin-top: calc(50px + 8vw);
  }
}
.kv__copy::before, .sec__challenge::after {
  content: '';
  background: url(../img/bg_round.svg) no-repeat;
  background-size: 204%;
  height: 11vw;
  width: 100%;
  display: block;
  position: absolute;
  left: 0;
  top: -11vw;
  background-position: 50% 0;
}
.kv__copy picture {
  display: inline-block;
  margin-top: -100px;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 640px) {
  .kv__copy picture {
    margin-top: 0;
  }
}
.sec__challenge {
  background-color: var(--color-blue);
  position: relative;
}
.sec__challenge::after {
  background-position: 50% 100%;
  top: 100%;
  z-index: 1;
}
.uk-grid.gap-small {
  gap: 10px;
}
.sec__challenge .present .uk-background-default {
  border-radius: 20px;
  padding: 20px 30px;
  text-align: center;
}
.lottery {
  padding: 30px 10px;
  border-radius: 20px;
}
.lottery ul {
  max-width: min(92%, 960px);
  margin-inline: auto;
}
.sec__title-main {
  margin-bottom: 50px;
  text-align: center;
}
.sec__title-sub {
  margin-bottom: 30px;
}
* + .sec__title-sub {
  margin-top: 40px;
}
@media screen and (min-width: 640px) {
  .sec__title-main > span {
    font-size: 60%;
  }
}
@media screen and (max-width: 640px) {
}
.lead {
  font-size: 1.125rem;
  font-family: var(--ff-yu-go-l);
  font-weight: 700;
}

@media screen and (min-width: 640px) {
  .sec__toukaku {
    background: url(../img/bg_dohyou.png) no-repeat 50% 100% / cover;
    padding-top: 60px;
  }
}
@media screen and (max-width: 640px) {
  .sec__toukaku {
    padding-block: 30px;
  }
  .sec__toukaku .sec__inner {
    padding: 0;
  }
}

.sec__join {
  background: var(--color-sky);
  padding-top: 14vw;
  padding-top: max(14vw, 90px);
  position: relative;
}
.sec__join .sec__title-main {
  margin-bottom: 25px;
}
@media screen and (min-width:640px) {
  .sec__join::before {
    content: '';
    background: url(../img/bg_triangle.svg) no-repeat;
    background-size: cover;
    background-position: 0 0;
    position: absolute;
    display: block;
    width: 100%;
    height: 13.5vw;
    left: 0;
    bottom: -1px;
    z-index: 0;
  }
}
@media screen and (max-width:640px) {
  .sec__summary {
    padding-top: 200px;
    position: relative;
    margin-top: -200px;
  }
  .sec__summary::before {
    content: '';
    background: url(../img/bg_triangle.svg) no-repeat;
    background-size: cover;
    background-position: 0 0;
    position: absolute;
    display: block;
    width: 100%;
    height: 13.5vw;
    left: 0;
    top: -13.5vw;
    z-index: 0;
  }
}
.sec__join .lottery2 {position: relative; z-index: 1;}
.lottery2 > div:nth-child(2) {
  position: relative;
}
.lottery2 > div:nth-child(2) .acnt-btn {
  position: absolute;
  bottom: 45px;
  left: 50%;
  transform: translateX(-50%);
  width: 80%;
  text-align: center;
  border: 1px solid #ff00c8;
  border-radius: 20px;
  padding: 30px 20px 40px;
}
@media screen and (max-width:640px) {
  .lottery2 > div:nth-child(2) .acnt-btn {
    padding: min(5vw,20px);
    bottom: min(7vw,5%);
  }
  .lottery2 > div:nth-child(2) .acnt-btn p {
    font-size: min(5vw, 14px);
  }
}




@media screen and (max-width: 640px) {

}

@media screen and (min-width: 768px) {

}


@media screen and (min-width: 768px) {

}

hr.grad {
  border-image: var(--gradation) 1;
}

.uk-accordion-title {
  background-color: var(--color-blue);
  color: #fff;
  font-weight: 700;
  font-size: 1.5rem;
  font-size: clamp(1.125rem, 0.9rem + 1vw, 1.5rem);
  padding: 15px;
  font-family: var(--ff-gothic);
  &:hover,
  &:focus {
    color: #fff;
  }
  @media screen and (min-width: 640px) {
  }
}
.sec__notice {
  position: relative;
  padding-block: 60px 120px;
}
.sec__notice > div {
  position: relative;
  z-index: 1;
}
.sec__notice::before,.sec__notice::after {
  content: '';
  background: url(../img/bg_round-pink.svg);
  display: block;
  background-size: cover;
  background-position: 50% 0;
  background-repeat: no-repeat;
  display: block;
  width: 100%;
  height: 25vw;
  position: absolute;
  left: 0;
  top: -1px;
}
.sec__notice::after {
  background-image:url(../img/bg_round-blue.svg);
  top: unset;
  bottom: -1px;
}

.uk-accordion-title::before {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Crect%20fill%3D%22%23fff%22%20width%3D%2213%22%20height%3D%222%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%20%3Crect%20fill%3D%22%23fff%22%20width%3D%222%22%20height%3D%2213%22%20x%3D%226%22%20y%3D%220%22%20%2F%3E%3C%2Fsvg%3E");
}
.uk-open .uk-accordion-title::before {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Crect%20fill%3D%22%23fff%22%20width%3D%2213%22%20height%3D%222%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%3C%2Fsvg%3E");
}
.uk-accordion-content {
  margin-top: 0;
  padding: 30px;
}
.sec__notice .uk-accordion-content {
}
.uk-accordion > :nth-child(n+2) {
  margin-top: 60px;
}
@media screen and (max-width: 640px) {
  .uk-accordion > :nth-child(n+2) {
    margin-top: 30px;
  }
}
.uk-accordion-content .uk-table-responsive {
  margin-block: 0;
}
.uk-accordion-content .uk-table-responsive tr > :first-child {
  padding-left: 0;
}
.sec__summary {
  background-color: var(--color-pink2);
}
.summary table {
  border-collapse: collapse;
  width: 100%;
}
.summary table thead {
  th {
    color: #fff;
    font-weight: 700;
    &:nth-child(2) {
      background: var(--color-blue2);
      border-radius: 20px 20px 0 0;
    }
    &:nth-child(3) {
      background: var(--color-pink);
      border-radius: 0 20px 0 0;
    }
  }
}
@media screen and (max-width:640px) {
  .summary table thead th {
    background: var(--color-blue2);
    border-radius: 10px 10px 0 0;
  }
  .summary table.summary-sp + table.summary-sp thead th {
    background-color: var(--color-pink);
  }
}
.summary table thead:has(th:nth-child(3)) th:nth-child(2) {
  border-radius: 20px 0 0 0;
}
.summary table tbody tr:nth-child(n + 2) {
  border-top: 1px solid var(--color-blue);
}
.summary table tbody :where(th, td) {
  background-color: #fff;
  padding: 10px;
}
.summary table tbody th {
  color: var(--color-blue);
  font-weight: 700;
}
.summary table tbody td {
  border-left: 1px solid var(--color-blue);
}
.summary table tbody td {
  text-align: center;
}
.summary table tr:nth-last-child(n+2) {
}
@media screen and (min-width: 640px) {
  .summary table tbody th {
    width: 10em;
  }
  .summary table tbody td {
    width: calc((100% - 10em) / 2);
  }
}

@media screen and (max-width: 640px) {
  .summary table tbody th {
    /*min-width: 5em;*/
  }
}

.sec__recommend {
  background: rgba(242, 34, 195, 0.1);
}



.sec__document {
  background: var(--gradation);
  color: #fff;
}
.sec__document a.uk-background-default {
  display: block;
  border-radius: 20px;
  text-align: center;
  position: relative;
  padding: 20px 50px 20px 20px;
}
.sec__document a.uk-background-default .grad-text {
  font-size: clamp(1rem, 0.925rem + 0.33vw, 1.125rem);
  font-size: clamp(1.05rem, 1.023rem + 0.14vw, 1.125rem);
  font-family: var(--ff-yu-go-l);
  font-weight: 700;
}
.sec__document a.uk-background-default p + p {
  color: #666;
  line-height: 1.35;
}
.sec__document a.uk-background-default::after {
  content: "";
  background: url(../img/icn_pdf.svg) no-repeat 50% 50% / contain;
  display: inline-block;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 63px;
}
@media screen and (max-width:640px) {
  .sec__document a.uk-background-default::after {
    width: min(8vw, 34px);
    height: 43px;
    right: 15px;
  }
}
#contact * {
  color: #fff;
}
#contact h3 {
  font-size: clamp(1.125rem, 0.975rem + 0.67vw, 1.375rem);
  font-family: var(--ff-yu-go-l);
  font-weight: 700;
  margin-block: 40px;
}
#contact h3 + * {
  margin: 40px auto;
  font-size: 1.25rem;
  font-weight: 700;
}
#contact [class*="sec__inner"] {
  position: relative;
}


#contact .time {
  font-size: clamp(0.75rem, 0.6rem + 0.67vw, 1rem);
}
.telcenter {
  font-size: clamp(0.75rem, 0.659rem + 0.45vw, 1rem);
}
#totop {
  transition: ease 0.3s all;
  position: fixed;
  bottom: 105px;
  right: 80px;
  z-index: 100;
}
#totop a {
  display: block;
  z-index: 100;
  width: 120px;
  height: 130px;
  background: url(../img/totop.png) center / contain;
  background-repeat: no-repeat;
  /* filter: drop-shadow(0 0 1px rgba(255,255,255,0.5)); */
}

.footer {
  padding: 60px 0 110px;
  background-color: var(--color-blue);
  color: #fff;
  background-image:
  url(../img/footer_bg01.png),
  url(../img/footer_bg02.png),
  url(../img/footer_bg03.png);
  background-position: calc(50% - 385px) 36%, 78% 45%, 100% 50%;
  background-size: auto, auto, auto;
  background-repeat: no-repeat, no-repeat, no-repeat;
}
@media screen and (max-width: 1100px) {
  .footer {
    padding: 60px 0 110px;
    background-image:
    url(../img/footer_bg01.png),
    url(../img/footer_bg02.png),
    url(../img/footer_bg03.png);
    background-position: calc(50% - 35vw) 36%, 78% 45%, 100% 50%;
    background-size: 27vw, 18vw, 10vw;
    background-repeat: no-repeat, no-repeat, no-repeat;
  }
}
@media screen and (max-width: 640px) {
  .footer {
    padding: 30px 0 240px;
    background-image:
    url(../img/footer_bg01.png),
    url(../img/footer_bg02.png);
    background-position: 0 86%, 93% 84%;
    background-size: 45vw, 29vw;
    background-repeat: no-repeat, no-repeat;
  }
}
.footer * {
  color: inherit;
}
.footer__copyright {
  font-size: 0.85rem;
  margin-top: 40px;
  color: #fff;
}
.footer__bnr {
  opacity: 0;
}
.footer__bnr .btn-grad {
  width: 500px;
  max-width: 100%;
}
.footer__bnr.is-show {
  background: linear-gradient(90deg, #ff8cd5 0, var(--color-pink) 100%);
  text-align: center;
  display: block;
  position: fixed;
  left: 0;
  bottom: 0;
  padding: 20px 10px;
  width: 100%;
  height: auto;
  z-index: 99;
  opacity: 1;
  transition: opacity 2s;
}
.iyobank-logo img {
  max-width: 220px;
}
.iyobank-logo {
  background: #fff;
  border-radius: 2em;
  padding: 10px 30px;
  width: fit-content;
}
@media screen and (max-width: 640px) {
  #totop {
    /* display: none !important; */
    right: -20px;
    bottom: 60px;
  }
  .footer small {font-size: min(3vw, 12px);}
  .footer__copyright {margin-top: 20px;}
}
/*-- AGENT --*/
.down {
  background: linear-gradient(to right, #E2EBFC 0%, #F9DDF5 100%);
  padding: 0;
  overflow: hidden;
}
@media screen and (min-width:640px) {
  .down .inner::before {
    content: "";
    left: -100px;
    top: 0;
    background: url("https://www.iyobank.co.jp/sp/agent/images/down_bg.png") left center no-repeat;
    background-size: 80% auto;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
  }
}
.down .inner {
  display: flex;
  justify-content: flex-end;
  padding: 20px 0;
  box-sizing: border-box;
  position: relative;
}
.down .cont {
  padding-right: 10%;
  position: relative;
  z-index: 1;
}
.down .logo_area {
  text-align: center;
}
.down .logo_area .tx {
  font-weight: bold;
  font-size: clamp(1.8rem, 1.351rem + 0.96vw, 2.5rem);
  font-size: clamp(1.025rem, 0.795rem + 1.02vw, 1.563rem);
}
.down .logo_area .logo_down {
  margin: 10px 0;
}
.down .c2 {
  margin-top: 10px;
  display: flex;
  justify-content: space-around;
  width: 100%;
  max-width: 280px;
}
.down .c2 a {
  display: block;
  
  transition: all 0.3s ease;
}
@media (min-width: 640px) {
  .down .c2 a { width: 49%;}
}
.down .c2qr img {
  max-width: 76px;
}
@media (max-width: 640px) {
  .down .cont {
  padding-right: 10px;
  }
  .down .sp_img {
    width: 47%;
    display: block;
  }
  .down .cont {
    width: 53%;
  }
  .down .c2 {
    flex-wrap: wrap;
    margin-top: 20px;
    gap: 10px;
  }
  .down .c2 a img {
    max-width: 157px;
  }
}