@charset "utf-8";

/*-----------------------------------*/
/* modal window common style
/*-----------------------------------*/
#modalOverlay{
	position: fixed;
	z-index: 10000;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background: #000;
	display: none;
}
.modal-window{
	left: 0;
	right: 0;
	/* padding: 2rem; */
	background: #fff;
	border: solid 1px #B4C3CC;
	width: 96%;
	max-width: 640px;
	box-sizing: border-box;
	box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);
	margin: auto;
	max-height: 95vh;
	overflow-y: scroll;
}
.modal-window::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 4px;
}
.modal-window::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background-color: rgba(0,0,0,0.4);
	box-shadow: 0 0 1px rgba(255,255,255,0.5);
}
@media screen and (orientation:landscape){
	#modal-overlay{
		width: 100%;
		height: 100%;
	}
	.modal-window{
		width: 96%;
	}
}
.modal-window--flex{
	top: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	right: 0 !important;
	margin: auto !important;
	box-sizing: border-box;
}
.modal-window .btn-close{
	position: absolute;
	top: 1rem;
	right: 1rem;
	display: block;
	width: 2.2rem;
	height: 2.2rem;
    border-radius: 50%;
    text-align: center;
	cursor: pointer;
	transform: rotate(135deg);
	background: url('../images/modal_close.png') no-repeat center center;
	background-size: cover;
}
.modal-window .btn-close:before,
.modal-window .btn-close:after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	background: #373737;
}
.modal-window .btn-close:before {
	width: 0.1rem;
    height: 100%;
}
.modal-window .btn-close:after {
	height: 0.1rem;
	width: 100%;
}
.modal-window .btn-close--inner{
	top: 4px;
	right: 4px;
}
.modal-window .btn-close--inner-2{
	top: -1px;
	right: -2px;
}
/* disable overlay click */
.static-overlay:after{
	display: block;
	content: '';
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	background: transparent;
	z-index: -1;
}

/*-----------------------------------*/
/* modal dialog common style
/*-----------------------------------*/
.modal-window.dialog .modal-ttl{
	margin: 0 0 15px;
	padding: 0;
	font-weight: bold;
	font-size: 1.6rem;
	text-align: center;
	line-height: 1.5;
}
.modal-window.dialog p{
	line-height: 1.5;
}
.modal-window.dialog .btn-style{
    width: 15rem;
}
.modal-window .ui-notice-list[class*='listmark'] ul li{
	font-size: 1.2rem;
}
@media screen and (min-width: 960px){
	.modal-window .ui-notice-list[class*='listmark'] ul li{
		font-size: 1.2rem;
	}
}
/*-----------------------------------*/
/* #dialog-form
/*-----------------------------------*/
.modal-window .modal-form-wrap{
	padding: 0 0.4rem;
}
.modal-window .modal-form-wrap .modal-form-item{
	margin-bottom: 1rem;
	font-size: 1.4rem;
}
.modal-window .modal-form-wrap .modal-form-item.required:before{
	content: "*";
	color: #EB4D3D;
	font-size: 1.4rem;
	display: inline-block;
	margin-right: 0.5rem;
}
.modal-window .modal-form-wrap .questant-list > li + li{
	margin-top: 1rem;
}
/* dialog-ex-answer */
.modal-window .answer-detail-wrap{
	max-height: 65vh;
	overflow-y: scroll;
}
@media screen and (min-width: 960px){
	.modal-window .answer-detail-wrap::-webkit-scrollbar {
		-webkit-appearance: none;
		width: 4px;
	}
	.modal-window .answer-detail-wrap::-webkit-scrollbar-thumb {
		border-radius: 4px;
		background-color: rgba(0,0,0,0.4);
		box-shadow: 0 0 1px rgba(255,255,255,0.5);
	}
}