* {outline:none;}

html,body {
	height:100%;
  scroll-behavior: smooth;
  font-size:14px;
}

@font-face {
	font-family: 'mplus';
	src: url(../font/mplus-1p-regular.woff);
}

body {
	margin:0px;
	/* font-family: "mplus", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif; */
}

a, a:hover {text-decoration:none;}

p, a, textarea {font-size:1rem;}

@media screen and (max-width:500px) {
	p, a, textarea {font-size:0.8rem;}
}

h2 {margin:0 0 30px;}
@media screen and (max-width:500px) {
  h2 {font-size:24px;}
}

.pc-none {display:none;}
.sp-none {display:block;}
@media screen and (max-width:500px) {
  .pc-none {display:block;}
  .sp-none {display:none;}
}

#app {
  position:relative;
	display: none;
	height:100vh;
  opacity:0;
}

.flash {
  position:fixed;
  top:0;
  z-index:1000; 
  width:100vw;
  height:30px;
  padding-left:10px;
  line-height:30px;
  transition:.3s;
}
.flash-error {background:rgba(255,0,0,.5);}
.flash-miss {background:rgba(150,150,150,.5);}
.flash-success {background:rgba(0,255,0,.5);}
.flash-close {
  position: absolute;
  top:4px;right:10px;bottom:auto;left:auto;
  font-size:21px;
  cursor: pointer;
}

.annotation {
  margin-top:10px;
  text-align: left;
  font-size:0.8rem;
}

.loading {position: relative;width:100vw;height:100vh;opacity:1;}
.loading img {position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:100px;}