@charset "UTF-8";
body {
  position: relative;
  overflow-x: hidden;
  color: #333;
  font-family: "Noto Sans JP", sans-serif;
  background-color: #fff;
}

img {
	width: 100%;
  max-width: 100%;
}
/* ページトップへ */
.pagetop {
  width: 50px;
  height: 50px;
  background-color: #006cbe;
  justify-content: center;
  align-items: center;
  z-index: 2;
  cursor: pointer;
  position: fixed;
  right: 20px;
  bottom: 10px;
  display: none;
  z-index: 4;
  border-radius: 50%;
}
.pagetop__arrow {
  display: block;
  height: 100%;
  width: 100%;
  position: relative;
}
.pagetop__arrow::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin: 0 10px;
  border-top: #fff 2px solid;
  border-right: #fff 2px solid;
  transform: translate(-100%, -30%) rotate(-45deg);
}
.pagetop:hover {
  opacity: 0.7;
}
.fadeUpTrigger {
  opacity: 0;
}
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 0.7s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/*============================================*/
/* BASE STYLE */
/*============================================*/
.p-loan {
	color: #231815;
	font-family: "Zen Maru Gothic", sans-serif;
}
.c-content {
	width: 87.277353%;
	max-width: 1200px;
	margin-inline: auto;
	position: relative;
}
.p-loan__btn {
	display: block;
	width: min(100%, 640px);
	margin-inline: auto;
	padding: 5.34vw 8.14vw 5.34vw 5.08vw;
	background: #FCD64E;
	border-radius: 122px;
	color: #004092;
	font-size: clamp(19px, 2.76vw, 36px);
	font-weight: 700;
	text-align: center;
	position: relative;
	transition: .3s;
}
@media (min-width: 600px) {
	.p-loan__btn {
		padding: clamp(21px, 3.07vw, 40px) clamp(32px, 3.07vw, 50px) clamp(21px, 3.07vw, 40px) 20px;
	}
}
.p-loan__btn::after {
	content: "";
	width: clamp(24px, 3.46vw, 45px);
	aspect-ratio: 1 / 1;
	background: url(../images/icon_arrow_blue.svg) center / contain no-repeat;
	position: absolute;
	right: clamp(24px, 3.46vw, 45px);
	top: 50%;
	transform: translateY(-50%);
}
@media (any-hover: hover) {
	.p-loan__btn:hover {
		background: rgba(252, 214, 78, 0.6);
	}
}
/*============================================*/
/* Hero */
/*============================================*/
.p-loan__hero {
	padding-bottom: clamp(17px, 1.57vw, 30px);
	background-image: url(../images/main_vs_bg_sp.webp);
	background-position: center top;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
}
@media (min-width: 1025px) {
	.p-loan__hero {
		background-image: url(../images/main_vs_bg_pc.webp);
		background-position: center bottom;
	}
}
.p-loan-hero__content {
	text-align: center;
}
@media (min-width: 1025px) {
	.p-loan-hero__content {
		width: 100%;
		max-width: 100%;
	}
}
.p-loan-hero__content img {
	width: 77.099vw;
}
@media (min-width: 1025px) {
	.p-loan-hero__content img {
		width: 62.992125%;
	}
}
.p-loan-hero__txt {
	width: fit-content;
	margin-inline: auto;
	margin-top: 8px;
	padding-left: 1em;
  text-indent: -1em;
	font-size: 10px;
	font-weight: 700;
	line-height: 1.384615;
	text-align: left;
}
@media (min-width: 375px) {
	.p-loan-hero__txt {
		font-size: clamp(13px, 1.15vw, 15px);
	}
}
/*============================================*/
/* Intro */
/*============================================*/
.p-loan__intro {
	padding: 45px 0 38px;
	background: linear-gradient(#04146b 0%, #014b9d 52.03%, #0068b7 100%);
	position: relative;
}
@media (min-width: 600px) {
	.p-loan__intro {
		padding: min(10.46vw, 136px) 0 min(8.76vw, 114px);
	}
}
.p-loan__intro::before {
	content: "";
	width: 100%;
	height: 100%;
	background: url(../images/bg.jpg);
	mix-blend-mode: color-burn;
	opacity: 0.6;
	position: absolute;
	left: 0;
	top: 0;
}
.p-loan-intro__ttl {
	padding-bottom: 22px;
	text-align: center;
	border-bottom: clamp(4px, 0.53vw, 7px) dotted #fff;
}
.p-loan-intro__ttl img {
	max-width: 1125px;
}
.p-loan-intro__subttl {
	margin-top: clamp(15px, 3.23vw, 42px);
	text-align: center;
}
.p-loan-intro__subttl img {
	max-width: 691px;
}
.p-loan-intro__img {
	margin-top: clamp(26px, 3.46vw, 45px);
}
/*============================================*/
/* Plan */
/*============================================*/
.p-loan__plan {
	padding: 40px 0 50px;
	background: #FCCF3D;
	text-align: center;
	position: relative;
}
@media (min-width: 600px) {
	.p-loan__plan {
		padding: min(10vw, 130px) 0 min(6.15vw, 80px);
	}
}
.p-loan__plan::before {
	content: "";
	width: 100%;
	height: 100%;
	background: url(../images/bg.jpg);
	mix-blend-mode: hard-light;
	opacity: 0.53;
	position: absolute;
	left: 0;
	top: 0;
}
.p-loan-plan__ttl img {
	max-width: 1080px;
}
.p-loan-plan__01 {
	margin-top: clamp(25px, 4.15vw, 54px);
}
.p-loan-plan__02 {
	margin-top: clamp(20px, 3.53vw, 46px);
	position: relative;
}
.p-loan-plan02__btn {
	width: min(88.338192%, 640px);
	position: absolute;
	top: 144.274vw;
	top: 86.96319%;
	left: 50%;
	transform: translateX(-50%);
}
@media (min-width: 1025px) {
	.p-loan-plan02__btn {
		top: 80.220994%;
	}
}
.p-loan-plan__03 {
	margin-top: clamp(20px, 4.61vw, 60px);
}
.p-loan-plan__txt {
	width: fit-content;
	margin-inline: auto;
	margin-top: clamp(13px, 2.3vw, 30px);
	padding-left: 1em;
	text-indent: -1em;
	font-size: clamp(14px, 1.53vw, 20px);
	font-weight: 700;
	line-height: 1.428;
	text-align: left;
}
/* 会員組合員の方 */
.p-loan-plan__member {
	margin-top: clamp(40px, 11.53vw, 150px);
}
.p-loan-plan__member-ttl {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 11px;
	position: relative;
	font-size: clamp(24px, 2.92vw, 38px);
	font-weight: 700;
}
.p-loan-plan__member-ttl::before,
.p-loan-plan__member-ttl::after {
	content: "";
	width: clamp(14px, 1.61vw, 21px);
	aspect-ratio: 21 / 37;
	background: url(../images/icon_dia.svg) center / contain no-repeat;
}
.p-loan-plan__member-img {
	margin-top: clamp(16px, 1.53vw, 20px);
}
.p-loan-plan__member-txt {
	width: fit-content;
	margin-inline: auto;
	margin-top: clamp(12px, 2.3vw, 30px);
	padding-left: 1em;
	text-indent: -1em;
	font-size: clamp(14px, 2.07vw, 27px);
	font-weight: 700;
	line-height: 1.5;
	text-align: left;
}
.p-loan-plan__btn {
	margin-top: clamp(20px, 4.61vw, 60px);
}
.p-loan-plan__speech {
	margin-top: clamp(37px, 10vw, 130px);
}
/*============================================*/
/* Inquiry */
/*============================================*/
.p-loan__inquiry {
	padding: clamp(40px, 6.15vw, 80px) 0;
	background: #FD85BA;
	color: #fff;
	text-align: center;
}
.p-loan-inquiry__ttl img {
	max-width: 802px;
}
.p-loan-inquiry__subttl {
	margin-top: clamp(20px, 2.76vw, 36px);
	font-size: clamp(18px, 3.15vw, 41px);
	font-weight: 700;
	line-height: 1.421;
}
@media (min-width: 1025px) {
	.p-loan-inquiry__subttl {
		line-height: 1.5;
	}
}
.p-loan-inquiry__txt {
	margin-top: clamp(15px, 2.07vw, 27px);
	padding-left: 1em;
	text-indent: -1em;
	font-feature-settings: "palt";
	font-size: clamp(18px, 2.84vw, 37px);
	font-weight: 500;
	line-height: 1.495;
}
@media (min-width: 1025px) {
	.p-loan-inquiry__txt {
		text-align: center;
	}
}
.p-loan-inquiry__btn {
	margin-top: clamp(34px, 4.46vw, 58px);
	background: #fff;
	color: #DF0C6B;
}
.p-loan-inquiry__btn::after {
	background-image: url(../images/icon_arrow_red.svg);
}
@media (any-hover: hover) {
	.p-loan-inquiry__btn:hover {
		background: rgba(255, 255, 255, 0.6);
	}
}
/*============================================*/
/* Start */
/*============================================*/
.p-loan__start {
	padding: clamp(40px, 6.92vw, 90px) 0 clamp(40px, 6.15vw, 80px);
	background: #C8EBFF;
	text-align: center;
}
.p-loan-start__txt {
	color: #004092;
	font-size: clamp(18px, 3.38vw, 44px);
	font-weight: 900;
}
@media (min-width: 1025px) {
	.p-loan-start__txt {
		font-weight: 700;
	}
}
.p-loan-start__btn {
	display: block;
	margin-top: clamp(14px, 3.07vw, 40px);
	background: #fff;
	border-radius: clamp(8px, 1.53vw, 20px);
}
.p-loan-start__btn img {
	transition: .3s;
}
@media (any-hover: hover) {
	.p-loan-start__btn:hover img {
		opacity: 0.7;
	}
}
/*============================================*/
/* Notes */
/*============================================*/
.p-loan__notes {
	padding: clamp(40px, 6.15vw, 80px) 0;
	background: #004092;
}
.p-loan__notes p {
	color: #fff;
	font-size: clamp(14px, 1.38vw, 18px);
	line-height: 1.4;
	font-weight: 400;
}
/* # =================================================================
 * # ヘッダー
 * # ================================================================= */
.l-header {
  width: 100vw;
}
.l-header .--flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 77px;
  padding: 10px;
}
@media screen and (min-width: 600px) {
  .l-header .--flex {
    padding: 10px 25px 10px 10px;
  }
}
.l-header .--flex .--item:first-of-type {
  max-width: 200px;
}
.l-header .--flex .--item:nth-of-type(2) {
  max-width: 590px;
}

@media screen and (max-width: 1024px) {
  .l-header .--flex .--item:first-of-type {
    max-width: 200px;
  }
  .l-header .--flex .--item:nth-of-type(2) {
    max-width: 550px;
  }
  .w300 {
    max-width: 300px;
  }
}
@media screen and (max-width: 768px) {
  .pcNone {
    display: block;
  }
}
@media screen and (max-width: 600px) {
  .l-header .--flex {
    height: 60px;
  }
  .l-header .w300 {
    max-width: 200px;
  }
  .l-header h1 {
    max-width: 140px;
  }
}
/* # =================================================================
 * # フッター
 * # ================================================================= */
.l-footer {
  padding: 20px 0;
  text-align: center;
}
.l-footer img {
  max-width: 148px;
  width: 100%;
}
/* # =================================================================
 * # Utility
 * # ================================================================= */
.spNone {
  display: none;
}
@media screen and (min-width: 1025px) {
  .spNone {
    display: block;
  }
}

@media screen and (min-width: 1025px) {
  .pcNone {
    display: none;
  }
}

@media screen and (min-width: 600px) {
  .tabNone {
    display: none;
  }
}

.tabBlock {
  display: none;
}
@media screen and (min-width: 600px) {
  .tabBlock {
    display: block;
  }
}

.tabsBlock {
  display: none;
}
@media screen and (min-width: 769px) {
  .tabsBlock {
    display: block;
  }
}

@media screen and (min-width: 769px) {
  .tabsNone {
    display: none;
  }
}
/* !Txt ------------------------------------------------------------------ */
.alC {
  text-align: center;
}

.alR {
  text-align: right;
}

.fwB {
  font-weight: 700;
}