body {
	background-color: #002961;
	background-image: url("../imgated.png");
	animation-name: snow;
	animation-duration: 20s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-direction: normal;
	animation-fill-mode: none;
	animation-play-state: running;
}

html {
	font-size: 32px;
}

.texture {
	font-size: 1rem;
	font-family: original;
	line-height: 150%;
	color: #66FFCC;
	text-align: center;
}

.name {
	text-decoration: underline;
	text-align: center;
	font-size: 2rem;
}

.date {
	font-size: 2rem;
	line-height: 150%;
}

.kurotokage {
	font-family: original;
	font-size: 2rem;
	text-align: center;
	line-height: 150%;
}

@keyframes snow {
	0% {
		background-position: left top;
		width: 100%;
	}
	100% {
		background-position: right bottom;
		width: 100%;
	}
}

h1 {
	font-size: 5rem;
	color: red;
	text-align: center;
}

.sec-title {
	font-size: 3rem;
	font-family: original;
	color: #d7003a;
}

#twitter {
	display: block;
	height: 38rem;
	text-align: center;
}

#gmap {
	height: 100%;
	width: 90%;
	margin-right: 5%;
	margin-left: 5%;
}

#access {
	height: 20rem;
}

.title-border {
	display: flex;
	align-items: center;
}
.title-border:before,
.title-border:after {
	border-top: 5px solid;
	color: #d7003a;
	content: "";
	flex-grow: 1;
}
.title-border:before {
	margin-right: 1rem;
}
.title-border:after {
	margin-left: 1rem;
}

@font-face {
	font-family: original;
	src: url("../fonts/Mamelon.otf") format("opentype");
}

.each_charactor {
	width: 32%;
}

.pop {
	width: 100%;
}

/* モーダルCSS */
.modalArea {
  display: none;
  position: fixed;
  z-index: 10; /*サイトによってここの数値は調整 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.modalBg {
  width: 100%;
  height: 100%;
  background-color: rgba(30,30,30,0.9);
}

.modalWrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
  width: 70%;
  max-width: 500px;
  padding: 10px 30px;
  background-color: #002961;
}

.closeModal {
  position: absolute;
  top: 0.5rem;
  right: 1rem;
  cursor: pointer;
}