@charset "UTF-8";
.fc-apply{
	position: relative;
}
.fc-apply::before,
.fc-apply::after{
	content: '';
	display: block;
	position: absolute;
	width: 40%;
	height: 100%;
	top: 0;
}
.fc-apply::before{
	background: url(../img/common/logo-bg-left.svg)no-repeat;
	background-position: top 50% left -200px;
	background-size: contain;
	left: 0;
}
.fc-apply::after{
	background: url(../img/common/logo-bg-right.svg)no-repeat;
	background-position: top 10% right -200px;
	background-size: contain;
	right: 0;
}

.fc-apply .tx-lead{
	margin-bottom: calc(30px * var(--space-scale-s));
}
.fc-apply .c-tx .tx .t-en{
	font-size: 2rem;
}
.fc-apply .c-tx .tx{
	text-align: center;
}
.fc-apply .c-tx .tx span{
	font-weight: 600;
}

.sec-sumaho .card-step{
	padding: 30px;
	max-width: 400px;
	border: solid 2px var(--bg-black);
	border-radius: 50px;
	background: var(--bg-white);
}
.sec-sumaho .card-step .ph{
	border-radius: 20px;
	overflow: hidden;
	border: solid 1px var(--bg-black-10);
	max-width: 280px;
	margin: 0 auto 10px;
}
.card-step .tx{
	font-size: 14px;
	text-align: left;
	min-height: 4rem;
	max-width: 280px;
	margin: 0 auto;
}
.fc-apply .sec-sumaho{
	max-width: 400px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
}
.card-step .title-en{
	display: table;
	margin: 0 auto 10px;
	border-radius: 30px;
	background: var(--bg-black);
	padding: 2px 16px 0;
	font-size: 16px;
	color: var(--color-white);
}
.card-step .tx-card-title::before{
	content: '';
	display: block;
	width: 40px;
	height: 2px;
	background: var(--bg-black);
	position: absolute;
	left: calc((100% - 40px) / 2);
	bottom: -10px;
}
.card-step .tx-card-title{
	position: relative;
	margin-bottom: 30px;
}

.card-step li{
	text-align: center;
}



/**ナビを数字にする
 * *************/
.sec-sumaho .swiper-pagination {
  display: flex;
  justify-content: center;
  gap: 4px;
  margin-top: 20px;
  position: static;
}

.sec-sumaho .swiper-pagination-bullet {
  width: 32px;
  height: 32px;
  border-radius: 4px;
  border: solid 1px var(--bg-black);
  background: var(--bg-black);
  color: var(--color-main);
  opacity: 1;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 14px;
  font-weight: bold;
}

.sec-sumaho .swiper-pagination-bullet-active {
  background: var(--bg-main);
  color: var(--bg-black);
}



@media screen and (max-width: 1179px) {


	.fc-apply::before{
		background: url(../img/common/logo-bg-left.svg)no-repeat;
		background-position: top 50% left -400px;
		background-size: 200%;
		left: 0;
	}
	.fc-apply::after{
		background: url(../img/common/logo-bg-right.svg)no-repeat;
		background-position: top 10% right -400px;
		background-size: 200%;
		right: 0;
	}



}
@media screen and (max-width: 1023px) {





}
@media screen and (max-width: 767px) {


	.sec-sumaho .swiper-wrapper{
		gap: 0px;
	}
	.sec-sumaho .card-step{
		padding: 20px 30px 10px;
	}

	.card-step .tx{
		font-size: 10px;
	}
	.sec-pay .icon-line-group .icon-line {
        width: 100%;
    }
    .sec-pay .icon-line-group .icon-line .ph-icon {
        width: 110px;
        height: 110px;
    }
	.sec-pay .icon-line-group .icon-line li {
	    font-size: 14px;
	}
	.sec-pay .bg-kakomi{
	    font-size: 14px;
	}
	.fc-apply .tx-lead + .tx span,
	.fc-apply .tx-lead + .tx{
		font-size: 16px;
		letter-spacing: 0.5px;
	}

	.fc-apply::before,
	.fc-apply::after{
		display: none;}


}
@media screen and (max-width: 376px) {


    .sec-pay .icon-line-group .icon-line .ph-icon {
        width: 80px;
        height: 80px;
    }


}  


