/* ----------------------
C.PASMOへチャージ（セブン銀行）
----------------------- */
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col{
	background: #fff;
	border-radius: 12px;
	padding: 30px;
	display: flex;
	margin-top: 40px;
	flex-wrap: wrap;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col-inner{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col-img{
	width: 590px;
	display: flex;
	align-items: center;
}

.uni-block-pasmocharge-seven-4col-img figure{
	width: 295px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col-txt{
	font-size: 16px;
	font-weight: 400;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col-result{
	font-size: 28px;
	font-weight: 600;
	margin-top: 10px;
}

/* 2列 */
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider{margin-top: 32px;}
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider.splide .splide__track{overflow: visible;}
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider.splide{
	visibility: initial;
	margin-top: 32px;
	padding: 0;
}

.uni-block-pasmocharge-seven-slider ul{
	display: flex;
	flex-wrap: wrap;
	gap: 60px;
	justify-content: flex-start;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider{margin-top: 32px;}
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul li{
	position: relative;
	width: calc(100% / 2 - 30px);
	background: #fff;
	border-radius: 12px;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul li:after{
	position: absolute;
	content: "";
	width: 24px;
	height: 48px;
	top: 50%;
	left: -27px;
	transform: translate(-50%, -50%);
	background: url(../../../img/usr/top/step_arrow.svg) no-repeat;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul li:first-child:after,
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul li:nth-child(3):after,
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul li:nth-child(5):after,
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul li:nth-child(7):after,
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul li:nth-child(9):after{display: none;}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider li {
	position: relative;
	padding: 0 32px 32px 32px;
	box-shadow: 0 1px 6px 1px rgba(0, 0, 0, .05);
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider li.uni-block-tmp-ast{padding: 0 32px 62px 32px;}
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .uni-block-tmp-list-step{
	font-size: 24px;
	font-weight: 600;
	text-align: center;
	margin-top: 40px;	
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .uni-block-tmp-list-img{margin-top: 40px;}
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .uni-block-tmp-list-img figure{
	display: flex;
	align-items: center;
	justify-content: center;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .uni-block-tmp-list-ttl{
	font-size: 24px;
	font-weight: 600;
	text-align: center;
	padding-top: 30px;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .uni-block-tmp-list-ast{
	font-size: 14px;
	font-weight: 400;
	margin-top: 10px;
	text-align: left;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider h3{
	font-size: 24px;
	font-weight: 600;
	text-align: center;
	position: relative;
	min-height: 67px;
	padding-top: 20px;
	padding-bottom: 16px;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider h3:before,
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider h3:after{
	width: 14px;
	height: 4px;
	left: 50%;
	position: absolute;
	content: "";
	bottom: 0;
	transform: translate(0, -50%);
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider h3:before{
	background: #A1D8E6;
	border-radius: 4px 0 0 4px;
	margin-left: -14px;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider h3:after{
	background: #F6BCB8;
	border-radius: 0 4px 4px 0;
	margin-right: -14px;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .uni-block-tmp-list-txt{
	font-size: 16px;
	font-weight: 400;
	text-align: left;
	margin-top: 16px;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .uni-block-tmp-list-txt-m{
	font-size: 14px;
	font-weight: 400;
	text-align: left;
	margin-top: 16px;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .uni-block-tmp-list-app-btn{
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .uni-block-tmp-list-app-btn a{
	display: inline-block;
	padding: 0 5px;
}

.uni-block-pasmocharge-seven-h3{
	text-align: center;
	position: relative;
}

.uni-block-pasmocharge-seven-h3 h3{
	display: inline-block;
	position: absolute;
	left: 50%;
	transform: translate(-50%, 0);
	bottom: -120px;
}

.uni-block-pasmocharge-seven-h3 h3 span{
	font-size: 32px;
	font-weight: 600;
	display: block;
	padding: 0 70px;
	position: relative;
}

.uni-block-pasmocharge-seven-h3 h3 span:before,
.uni-block-pasmocharge-seven-h3 h3 span:after{
	position: absolute;
	content: "";
	width: 41px;
	height: 33px;
}

.uni-block-pasmocharge-seven-h3 h3 span:before{
	left: 0;
	background: url(../../../img/usr/use/pasmocharge_seven/deco_lt.svg) no-repeat;
}

.uni-block-pasmocharge-seven-h3 h3 span:after{
	right: 0;
	background: url(../../../img/usr/use/pasmocharge_seven/deco_rt.svg) no-repeat;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-arrow{
	position: relative;
	text-indent: -9999px;
	display: inline-block;
	width: 1360px;
	height: 130px;
	overflow: hidden;
	margin-top: 60px;
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-arrow::before,
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-arrow::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: calc(50% - 2px);
  width: 8px;
  height: 1000px;
  border-radius: 9999px;
  background-color: #EFECEC;
  transform-origin: 50% calc(100% - 2px);
}

.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-arrow::before {transform: rotate(80deg);}
.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-arrow::after {transform: rotate(-80deg);}

@media screen and (max-width: 768px){

	/* step */
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul{
		justify-content: space-between;
		flex-wrap: initial;
		gap: initial;
	}

	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul li{box-sizing: border-box;}
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .uni-block-tmp-list-ttl{font-size: calc(16 / 375* 100vw);}
	
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul{
		gap: 0 0;
		flex-wrap: initial;
	}
	
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul li{
		flex-shrink: 0;
		width: 100%;
	}

	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider.splide{padding: 0 30px;}
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider ul li:after{display: none;}
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider h3{font-size: 20px;}
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider li{padding: 0 24px 24px 24px;}
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider.splide .splide__track{overflow: hidden;}
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .uni-block-tmp-list-txt{
		white-space: normal;
		font-size: calc(14 / 375* 100vw);
	}
	
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .splide__arrow--prev{
		background: url(../../../img/usr/top/step_arrow.svg) no-repeat;
		width: 24px;
		height: 48px;
		left: -6px;
		margin-top: -20px;
		border-radius: 0;
		transform: rotate(-180deg);
	}

	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .splide__arrow--next{
		background: url(../../../img/usr/top/step_arrow.svg) no-repeat;
		width: 24px;
		height: 48px;
		right: -6px;
		border-radius: 0;
	}

	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-slider .splide__arrow[disabled]{display: none;}

	/* 4列 */
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col{
		margin-top: 24px;
		display: block;
		background: transparent;
		padding: 0;
	}

	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col-inner{
		margin-bottom: 10px;
		width: auto;
		min-width: auto;
		display: block;
		background: #fff;
		padding: 20px;
		border-radius: 12px;
	}

	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col > div.uni-block-pasmocharge-seven-4col-inner:last-child{margin-bottom: 0;}
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col-img{
		width: auto;
		justify-content: center;
	}

	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col-img figure{width: auto;}
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col p{text-align: center;}
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-4col .uni-block-pasmocharge-seven-4col-result{
		text-align: center;
		font-size: 24px;
	}

	.uni-block-pasmocharge-seven-h3{
		text-align: center;
		position: relative;
	}
	
	.uni-block-pasmocharge-seven-h3 h3{
		display: inline-block;
		position: absolute;
		left: 50%;
		transform: translate(-50%, 0);
		bottom: -50px;
		width: 100%;
	}
	
	.uni-block-pasmocharge-seven-h3 h3 span{
		font-size: 24px;
		font-weight: 600;
		display: inline-block;
		padding: 0 50px;
		position: relative;
	}
	
	.uni-block-pasmocharge-seven-h3 h3 span:before,
	.uni-block-pasmocharge-seven-h3 h3 span:after{
		position: absolute;
		content: "";
		width: 32px;
		height: 25px;
	}
	
	.uni-block-pasmocharge-seven-h3 h3 span:before{
		left: 0;
		background: url(../../../img/usr/use/pasmocharge_seven/deco_lt.svg) no-repeat;
		background-size: 32px auto;
	}
	
	.uni-block-pasmocharge-seven-h3 h3 span:after{
		right: 0;
		background: url(../../../img/usr/use/pasmocharge_seven/deco_rt.svg) no-repeat;
		background-size: 32px auto;
	}
	
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-arrow{
		position: relative;
		text-indent: -9999px;
		display: inline-block;
		width: calc(100% + 30px);
		height: 100px;
		left: -15px;
		overflow: hidden;
		margin-top: 0;
	}
	
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-arrow::before,
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-arrow::after {
	  content: "";
	  position: absolute;
	  bottom: 0;
	  left: calc(50% - 2px);
	  width: 8px;
	  height: 1000px;
	  border-radius: 9999px;
	  background-color: #EFECEC;
	  transform-origin: 50% calc(100% - 2px);
	}
	
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-arrow::before {transform: rotate(80deg);}
	.page-type-use-pasmocharge-seven .uni-block-pasmocharge-seven-arrow::after {transform: rotate(-80deg);}
	.page-type-use-pasmocharge-seven .uni-block-tmp-notes-box{margin-top: 10px;}
}