@charset "utf-8";
/* CSS Document */

/**************************
 modal.css
**************************/

.modalBox {
	position:relative;
	display:none;
	/*width:100%;*/
	text-align:left;
	width:700px;
	background:#fff;
	padding:40px;
}

.modalBox .twoColumn { overflow:hidden; font-size: 1.4rem;}
.modalBox .twoColumn .firstColumn { float:left; width:55%;}
.modalBox .twoColumn .secondColumn { float:right; width:40%; text-align:center;}


.modalBox .btnPrev {
	position:absolute;
	top:38%;
	left:-100px;
	z-index:100003;
	width:46px;
}

.modalBox .btnPrev img {
	width:46px;
	height:91px;
	height:auto;
}

.modalBox .btnNext {
	position:absolute;
	top:38%;
	right:-100px;
	z-index:100003;
	width:46px;
}

.modalBox .btnNext img {
	width:46px;
	height:91px;
	height:auto;
}

.modalBox .btnClose {
	position:fixed;
	top:20px;
	right:20px;
	z-index:100003;
	width:46px;
}
.modalBox .btnClose img {
	width:47px;
	height:47px;
	height:auto;
}

.modalBox .btnClose {
	position:fixed;
	top:20px;
	right:20px;
	z-index:100003;
	width:46px;
}

.modalBox p {
	color:#333;
	line-height:1.5;
	margin-bottom:10px;
}

.modalBox h4 {
	font-size:1.6em;
	color:#333;
	line-height:1.3;
	padding-bottom:15px;
	margin-bottom:15px;
	border-bottom:1px solid #333;
	font-weight:normal;
}

.modalBox ul li {
	list-style:disc;
	margin:0 0 10px 30px;
	line-height:1.3;
}


#modal-win {
	width:80%; left:10%;
	position: absolute;
}
#modal-win-inner {
	margin: 0 auto;
	position: relative;
	z-index: 100002;
}
#modal-bg {
	width: 100%;
	height: 100%;
	background-color: #000000;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100001;
	cursor: pointer;
}
@media screen and (max-width: 980px) {
.modalBox {width:100%;}
.modalBox .btnNext { right:-8%; width:30px; top:42%;}
.modalBox .btnPrev { left:-8%; width:30px; top:42%;}
}
@media screen and (max-width: 640px) {
#modal-win {
	width:90%; left:5%;
}
.modalBox .twoColumn .firstColumn { float:none; width:100%;}
.modalBox .twoColumn .secondColumn { float:none; width:100%; padding-bottom:10px;}

.modalBox .btnNext { width:20px; right:-10%; display:none;}
.modalBox .btnPrev { width:20px; left:-10%; display:none;}

.modalBox {
	position:relative;
	display:none;
	/*width:100%;*/
	width:100%;
	padding:40px 5% 5%;
}

.modalBox .btnClose { top:0; right:0; padding:5px; position:absolute; background:#000; text-align:center; width:30px;}
.modalBox .btnClose img {
	width:25px;
	height:auto;
}

.modalBox p {
	line-height:1.2;
}



#modal-win-inner {
	margin: 0 auto;
	position: relative;
	z-index: 100002;
}
#modal-bg {
	width: 100%;
	height: 100%;
	background-color: #000000;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100001;
	cursor: pointer;
}

}