@charset "utf-8";

/* ------------------------------------------
	-
	-
		--
		--
		--
		--
		--
------------------------------------------ */

/* ==============================================================
	MODAL BUTTON AREA
============================================================== */
.modalbtnArea{
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
	width:1125px;
	margin: 0 auto;
}
@media screen and (max-width:750px){
	.modalbtnArea{
		width:100%;
	}
}
.modalbtnArea .contentsArea{
	width:335px;
	margin: 0 20px 60px;
	text-align: left;
}
@media screen and (max-width:750px){
	.modalbtnArea .contentsArea{
		width:90%;
		margin: 0 auto 60px;
		text-align: left;
	}
}
.modalbtnArea .contentsArea h2{
	padding: 20px 0 75px 25px;
	font-size: 18px;
	letter-spacing: 0.2em;
	margin-bottom: 20px;
	line-height: 1.3;
}
@media screen and (max-width:750px){
	.modalbtnArea .contentsArea h2{
		padding: 20px 0 45px 25px;
		font-size: 16px;
	}
}
.modalbtnArea .contents01 h2{	border-left: 50px solid #d1d0a5;}
.modalbtnArea .contents02 h2{	border-left: 50px solid #a5d1c8;}
.modalbtnArea .contents03 h2{	border-left: 50px solid #cbb9a9;}
.modalbtnArea .contents04 h2{	border-left: 50px solid #d7baba;}
.modalbtnArea .contents05 h2{	border-left: 50px solid #c9c7d9;}
.modalbtnArea .contents06 h2{	border-left: 50px solid #e6d2bc;}
.modalbtnArea .contents07 h2{	border-left: 50px solid #d5dbc5;}
.modalbtnArea .contents08 h2{	border-left: 50px solid #e3d9e2;}
.modalbtnArea .contents09 h2{	border-left: 50px solid #c1d1c4;}

@media screen and (max-width:750px){
	.modalbtnArea .contents01 h2{	border-left: 30px solid #d1d0a5;}
	.modalbtnArea .contents02 h2{	border-left: 30px solid #a5d1c8;}
	.modalbtnArea .contents03 h2{	border-left: 30px solid #cbb9a9;}
	.modalbtnArea .contents04 h2{	border-left: 30px solid #d7baba;}
	.modalbtnArea .contents05 h2{	border-left: 30px solid #c9c7d9;}
	.modalbtnArea .contents06 h2{	border-left: 30px solid #e6d2bc;}
	.modalbtnArea .contents07 h2{	border-left: 30px solid #d5dbc5;}
	.modalbtnArea .contents08 h2{	border-left: 30px solid #e3d9e2;}
	.modalbtnArea .contents09 h2{	border-left: 30px solid #c1d1c4;}
}
.modalbtnArea .contentsArea p{
	padding-left: 1.5em;
	font-size: 14px;
	line-height: 1.7;
	margin-bottom: 10px;
}
@media screen and (max-width:750px){
	.modalbtnArea .contentsArea p{
		font-size: 12px;
		line-height: 1.7;
	}
}
.modalbtnArea .contentsArea .modal-open{
	text-decoration: underline;
	position: relative;
	cursor: pointer;
}
.modalbtnArea .contentsArea:not(.contents09) .modal-open::before{
	content: "Q.";
  position: absolute;
  top: -5px;
  left:-1.5em;
	font-weight: 600;
}
@media screen and (max-width:750px){
}






/* ==============================================================
	MODAL CONTENTS AREA
============================================================== */

.modal-content {
	position:fixed;
	display:none;
	z-index:2;
	margin:0;
	z-index: 11000;
}
@media screen and (max-width:750px){
	.modal-content {
	}
}
.modal-content .modal-content-innerArea{
	width:900px;
	background:#fff;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	overflow-x: hidden;
	max-height:80vh;
}
@media screen and (max-width:750px){
	.modal-content .modal-content-innerArea{
		width:90%;
		margin: 0 auto;
	}
}
.modal-content .modal-content-inner{
	padding:95px 130px;
	position: relative;
}
@media screen and (max-width:750px){
	.modal-content .modal-content-inner{
		padding:30px 20px;
		position: relative;
	}
}
.modal-content h2 {
	font-size: 21px;
	margin: 0 auto 80px;
	line-height: 1.8;
}
@media screen and (max-width:750px){
	.modal-content h2 {
		font-size: 18px;
		margin: 0 auto 40px;
	}
}
.modal-content img {
	margin-bottom: 20px;
}
.modal-content p {
	margin:0;
	padding:0;
	text-align: left;
	line-height: 2.1;
}
@media screen and (max-width:750px){
	.modal-content p {
		font-size: 12px;
	}
}
.modal-content p a.modal-close{
	font-size: 30px;
	width:30px;
	height:50px;
	margin: 0 0 0 auto;
	display: block;
}
@media screen and (max-width:750px){
	.modal-content p a.modal-close{
		font-size: 26px;
		margin: 0 5% 0 auto;
	}
}
.modal-content p a.modal-close:hover{
	cursor: pointer;
	opacity: 0.7;
}
.modal-overlay {
	z-index: 10999;
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:120%;
	background-color:rgba(220,220,220,0.6);
}
@media screen and (max-width:750px){
	.modal-overlay {
		z-index:10000;
	}
}
.modal-content .modal-content-inner ul{
	margin:15px auto 0 25px;
}
.modal-content .modal-content-inner ul li{
	text-align: left;
	font-size: 14px;
	padding: 0 0 2em 0;
	list-style-type: decimal;
	line-height: 2.1;
}
@media screen and (max-width:750px){
	.modal-content .modal-content-inner ul li{
		font-size: 12px;
		line-height: 2.1;
		padding-bottom: 8px;
	}
}
