/*モーダルを開くボタン*/
.modal-open {
	display: inline-block;
}

/*モーダル本体の指定 + モーダル外側の背景の指定*/
.modal-container {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	background: rgba(0, 0, 0, 80%);
	overflow: auto;
	visibility: hidden;
	transition: .3s;
	box-sizing: border-box;
	z-index: 999999;
	opacity: 0;
}

/*モーダル本体の擬似要素の指定*/
.modal-container:before {
	content: "";
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}

/*モーダル本体に「active」クラス付与した時のスタイル*/
.modal-container.is-active {
	opacity: 1;
	visibility: visible;
}

/*モーダル枠の指定*/
.modal-body {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	max-width: 1000px;
	width: 90%;
	height: 90%;
}

/*モーダルを閉じるボタンの指定*/
.modal-close {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	top: 10px;
	right: 20px;
	width: 40px;
	height: 40px;
	font-size: 30px;
	line-height: 1;
	padding: 5px;
	color: #4b4b4b;
	cursor: pointer;
	border: 1px solid #4b4b4b;
	border-radius: 50%;
	z-index: 99;
}

/*モーダル内のコンテンツの指定*/
.modal-content {
	background: #fff;
	text-align: left;
	padding: 0 0 50px 0;
	font-size: 1em;
	height: 100%;
	overflow-x: scroll;
}

.modal-content-inner {
	width: 90%;
	margin: 0 auto;
}

.modal-content h3 {
	font-weight: 500;
	font-size: 2rem;
	text-align: center;
	background: #a0a0a0;
	color: #fff;
	padding: 15px;
}

.modal-content h4 {
	font-size: 2.4rem;
	color: #797979;
	font-weight: 400;
	text-align: center;
	margin: 20px auto;
}

.modal-content h5 {
	background: #efefef;
	color: #4f4f4f;
	padding: 5px;
	font-size: 1.6rem;
	margin: 0 auto;
}

.modal-content ul {
	font-size: 1.5rem;
	font-weight: 400;
	line-height: 2;
	margin: 10px auto 30px;
}

.modal-content ul li {
	position: relative;
	padding: 0 5px 0 20px;
}

.modal-content ul li::before {
	display: block;
	content: "●";
	color: #797979;
	position: absolute;
	left: 0;
}

.modal-content ul.banklist {
	column-count: 3;
}

.modal-content span.highlight {
	color: #d0340f;
}

.modal-content ul.arealist {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 10px;
}

.modal-content ul.arealist li {
	width: 16.66%;
}

.modal-content p {
	font-size: 1.5rem;
	font-weight: 400;
	margin: 10px auto;
}

.modal-content p.al_c {
	text-align: center;
}

.modal-content .p-singlepage-caution ul {
	margin: 0 auto;
}

.modal-block {
	padding: 20px;
}

.modal-block ul {
	margin: 0 auto;
}

.modal-block ul li {
	position: relative;
	padding-left: 20px;
}

.modal-block ul li::before {
	display: none;
}

.modal-block ul li span {
	position: absolute;
	left: 0;
	color: #e88778;
}

.modal-block ul li small {
	display: block;
	line-height: 1.8;
}

.modal-block ul li a.red {
	color: #d0340f;
	border: 1px solid #d0340f;
	border-radius: 15px;
	font-size: 1.5rem;
	padding: 0 20px;
	margin-top: 10px;
}

.modal-arrow {
	text-align: center;
	margin: 10px auto;
}

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

	.modal-content ul.banklist {
		column-count: 2;
	}

	.modal-content ul.arealist li {
		width: 33.33%;
	}
}



.privacy-close {
	color: #393939;
}


/* モーダル */
.p-privacy {
	padding: 20px;
}

.p-privacy h4 {
	font-size: 1.6rem !important;
	font-weight: 500 !important;
	border-bottom: 1px solid #707070;
	padding-bottom: 5px !important;
	background: #efefef !important;
	padding: 6px 10px !important;
}

.p-privacy ol {
	margin-left: 20px;
}

.p-privacy ol li {
	list-style: decimal;
	margin-bottom: 0;
}

.p-privacy ol li p {
	font-size: 1.4rem;
}

.p-privacy ul {
	line-height: normal;
	margin: 0;
}

.p-privacy ul li {
	list-style: none;
	margin-bottom: 0;
}

.p-privacy .dl-li {
	margin-bottom: 20px;
}

.p-privacy .dl-li dt {
	font-weight: 600;
}

@media (min-width: 1024px) {
	.p-privacy .dl-li {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		padding: 0 1em;
	}

	.p-privacy .dl-li dt {
		width: 11.2rem;
		-ms-flex-negative: 0;
		flex-shrink: 0;
		font-weight: 500;
	}
}

.modal-consul-inner {
	padding: 40px;
}

.modal-consul h3 {
	background: #ba9477;
}

.modal-consul .modal-consul-flex {
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
}

.modal-consul .modal-consul-flex-txt {
	width: 70%;
}

.modal-consul .modal-consul-flex-txt.w100 {
	width: 100%;
}

.modal-consul h4 {
	font-size: clamp(1.8rem, 1.172vw + 0.9rem, 2.4rem);
	display: flex;
	justify-content: space-between;
	background: none;
	color: #232323;
}

.modal-consul h5 {
	font-size: 1.6rem;
	color: #4f4f4f;
	background: #f5efeb;
}

.modal-consul p {
	font-size: 1.5rem;
}

.modal-consul .p-singlepage-caution {
	margin: 10px auto;
}

.modal-consul .modal-consul-flex-img {
	width: 25%;
}

.modal-consul .modal-consul-flex-img img {
	width: 100%;
	max-width: 100%;
}

.modal-consul .p-singlepage__btn {
	margin: 30px auto;
}

.modal-consul .p-singlepage__btn__box {
	margin: 0 auto;
}

.modal-consul .p-singlepage__btn__box a p {
	text-align: center;
	color: #fff;
}

.modal-consul-contact {
	padding: 20px;
}

.modal-consul-contact p {
	text-align: center;
}

.modal-block-flex {
	display: flex;
	justify-content: center;
}

.modal-block-flex-box {
	text-align: center;
	width: 33%;
	margin: 0 auto 20px;
}

.modal-block-flex-box img{
	width: 100%;
}

.modal-block-flex-box p {
	line-height: 1.5;
}

.modal-block-flex-box a.dl_btn {
	color: #323232;
	border: 1px solid #323232;
	border-radius: 15px;
	font-size: 1.5rem;
	padding: 0 20px;
	margin-top: 10px;
}

@media screen and (max-width:480px) {
	.modal-consul-inner {
		padding: 20px;
	}

	.modal-block-flex {
		flex-wrap: wrap
	}
	
	.modal-block-flex-box {
		width: 100%;
	}
}
