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

* {
    padding:0;
    margin:0;
    text-align:center;
}
 
h1 {
    background-color:#cccccc;
    color:white;
    font-size:20px;
    padding:4px;
}

body {
  position:relative;
}
 
/* モーダルウィンドウのスタイル */
.modal {
  position:absolute;
  width:100%;
  height:100vh;
  top:0;
  left:0;
  display:none;
}
 
/* オーバーレイのスタイル */
.overLay {
  position:fixed;
  top:0;
  left:0;
  background:rgba(200,200,200,0.9);
  width:100%;
  height:100vh;
  z-index:10;
}
 
/* モーダルウィンドウの中身のスタイル */
.modal .inner {
  position:absolute;
  z-index:11;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
	width: 80%;
	padding: 20px;
	border: 1px #98801E solid;
	border-radius: 5px;
	text-align: center;
	background: #000;
}
.modal_inner_ttl{
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	line-height: 28px;
	padding: 8px 0;
	margin-bottom: 30px;
	border-bottom: 1px #98801E solid;
}
.modal_inner_subTtl{
	color: #fff;
	font-size: 14px;
}
.modal_inner_contents{
	margin-bottom: 20px;
	border-bottom: 1px #98801E solid;
}

.modal_inner_txt{
	color: #fff;
	font-size: 14px;
	text-align: center;
	margin: 0 auto 15px;
}

@keyframes modal{
  0% {top:-100%}
  100% {top:50%}
}
@keyframes modalClose {
  0% {top:50%}
  100% {top:100%}
}