@charset "utf-8";

/*
************************************************************************
* モーダル、ダイアログ
************************************************************************
*/

/* ################################################################################################ */
/* ## PC                         ################################################################## */
/* ################################################################################################ */
#modal
{
	z-index:100;
	position:fixed;
	top:0;
	bottom:0;
	left:0;
	right:0;
	
	width:100%;
	height:100%;
	
	background-color:rgba(0,0,0,0.3);
	
	display: none;
	justify-content: center;
	align-items: center;
}
#modal.show
{
	display: flex;
}
#modal-contents
{
	background-color:#FFFFFF;
	border-radius:1em;
	padding:1em;

	width:95%;
	max-width:480px;
	
	height:auto;
	
	box-shadow: 5px 5px 5px 0px #00000040;
}
#modal-contents > .body
{
	width:100%;
}
#modal-contents > .body > .modal-contents-title
{
	display: flex;
	line-height:1.4;
	width:100%;
}
#modal-contents > .body > .modal-contents-title > i
{
	line-height:1.4;
	color:var(--main-color-01);
	margin-right: 0.25em;
}
#modal-contents > .body > .modal-contents-title > span
{
	font-weight:bold;
	font-size:1.5em;
}
#modal-contents > .body > .modal-contents-body
{
	margin:0.5em 0em;

	width:100%;
    max-height: calc(70vh - 6em);
	height:auto;
}
#modal-contents > .modal-contents-footer
{
	width:100%;
	border-top:1px solid #CCCCCC;
	padding:1em 0em 0em 0em;
}


#modal-contents.error-modal
{
	border:3px solid #c40404;
}
#modal-contents.error-modal > .body > .modal-contents-title
{
	color:#c40404;
}
#modal-contents.error-modal > .body > .modal-contents-title > i
{
	color:#c40404;
}

#modal-contents.info-modal
{
	border:3px solid #666666;
}
#modal-contents.info-modal > .body > .modal-contents-title
{
	color:#000000;
}

#modal-contents.ticket-list > .body > .modal-contents-body > .ticket-item
{
	border-top:1px solid #EFEFEF;
	padding: 0.5em 0em;

	display: flex;
	align-items: center;
	align-content: center;

	height:auto;
}
#modal-contents.ticket-list > .body > .modal-contents-body > .ticket-item > .ticket-info
{
	flex: 1 1 auto;
}
#modal-contents.ticket-list > .body > .modal-contents-body > .ticket-item > .ticket-info > .ticket-name
{
	display: flex;
	align-items: center;
	align-content: center;
}
#modal-contents.ticket-list > .body > .modal-contents-body > .ticket-item > .ticket-info > .ticket-name > i
{
	font-size: 1.5em !important;
	margin-right: 0.25em;
	color:var(--body-icon-color);
}
#modal-contents.ticket-list > .body > .modal-contents-body > .ticket-item > .ticket-ope
{
	flex: 0 0 auto;
	color:var(--body-icon-color);
	font-size:2em !important;
	line-height: 1 !important;
	cursor: pointer;
}
#modal-contents.ticket-list > .body > .modal-contents-body > .ticket-item > .ticket-ope:hover
{
	opacity: 0.6;
}

#modal-contents.asign-list > .body > .modal-contents-body.scroll-y
{
	overflow-y: scroll;
	max-height: calc(70vh - 12em);
}
#modal-contents.asign-list > .body > .modal-contents-body > .asign-item
{
	border-top:1px solid #EFEFEF;
	padding: 0.5em 0em;

	display: flex;
	align-items: center;
	align-content: center;

	height:auto;
}
#modal-contents.asign-list > .body > .modal-contents-body > .asign-item > .asign-info
{
	flex: 1 1 auto;
}
#modal-contents.asign-list > .body > .modal-contents-body > .asign-item > .asign-info > .asign-name
{
	display: flex;
	align-items: center;
	align-content: center;
}
#modal-contents.asign-list > .body > .modal-contents-body > .asign-item > .asign-info > .asign-name > i
{
	font-size: 1.5em !important;
	margin-right: 0.25em;
	color:var(--body-icon-color);
}
#modal-contents.asign-list > .body > .modal-contents-body > .asign-item > .asign-status
{
	flex: 0 0 auto;
	color:var(--body-icon-color);
	line-height: 1 !important;
}
#modal-contents.asign-list > .body > .modal-contents-body > .asign-item > .asign-ope
{
	flex: 0 0 auto;
	color:var(--body-icon-color);
	font-size:2em !important;
	line-height: 1 !important;
	cursor: pointer;
}
#modal-contents.asign-list > .body > .modal-contents-body > .asign-item > .asign-ope:hover
{
	opacity: 0.6;
}


#modal-contents.seat-select > .modal-contents-body
{
	overflow-y: scroll;
	overflow-x: scroll;
	max-height: calc(80vh - 5em);
}
#modal-contents.seat-select > .modal-contents-body > table tr th.head

/* ################################################################################################ */
/* ## TAB                        ################################################################## */
/* ################################################################################################ */
@media screen and (max-width:1200px) {
}

/* ################################################################################################ */
/* ## スマホサイト用スタイル ###################################################################### */
/* ################################################################################################ */
@media screen and (max-width:640px) {
}