@charset "UTF-8";

/* ここからデモページ用のコード */
body {
	width: 100% ;
	/*height: 5000px ;*/
	padding: 0 ;
}
/* ここまでデモページ用のコード */

#modal-content {
	width: 70% ;
	margin: 0 ;
	padding: 20px ;
	border: 2px solid #aaa ;
	background: #fff ;
	position: fixed ;
	display: none ;
	z-index: 2 ;
	height: 400px;
	overflow: auto;
	top: 50px !important;
}
#modal-overlay {
	z-index: 1 ;
	display: none ;
	position: fixed ;
	top: 0 ;
	left: 0 ;
	width: 100% ;
	height: 120% ;
	background-color: rgba( 0,0,0, 0.75 ) ;
}
.button-link {
	color: #00f;
	text-decoration: underline ;
}
.button-link:hover {
	cursor: pointer ;
	color: #f00 ;
}
.posi {
	position: absolute;
	right: 20px;
	top: 25px;
}

#modal-content li {
	margin-bottom: 30px;
	letter-spacing: 0.05em;
}
#modal-content li span {
	font-size: 0.85rem;
	color: #af873b;
}
#modal-content.please h3 {
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 25px;
	padding-bottom: 5px;
	letter-spacing: 0.1em;
	border-bottom: 5px solid #d61518;
}
#modal-content.please p {
	line-height: 2em;
	text-align: justify;
	margin-bottom: 20px;
}
#modal-content.please p:nth-of-type(2) {
	margin-bottom: 10px;
}
#modal-content.please p.address {
	background: #ededed;
	padding: 20px;
	width: 70%;
}
#modal-content.please p.pbig {
	font-weight: 700;
	font-size: 16px;
	line-height: 180%;
	border-bottom: 1px solid #d61518;
	padding-bottom: 5px;
	margin-bottom: 10px;
}
#modal-content.please p.pbig:before {
	content: "●";
	padding-right: 5px;
}

@media screen and (max-width: 768px){
#modal-content {
	width: 95%;
	left: 35px !important;
}

}

@media screen and (max-width: 480px){
body {
	height: 1800px;
}
#modal-content {
	height: 500px;
	left: 6px !important;
}
#modal-content p:nth-of-type(1) {
	font-size: 1rem !important;
}
#modal-content li {
	font-size: 0.85rem;
	margin-bottom: 20px;
}
#modal-content li span {
	font-size: 0.8rem;
}
#modal-content.please p {
	line-height: 1.8em;
}
#modal-content.please p.pbig {
	font-size: 14px;
}
#modal-content.please p.address {
	width: 100%;
}

}