@font-face { font-family: 'Kosugi Maru'; src: url('KosugiMaru-Regular.ttf') format('truetype'); }

* {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  box-sizing: border-box;
  line-height: 1.0;
  -webkit-user-select: none;
  -webkit-text-size-adjust: 100%;
  font-family: 'Kosugi Maru', sans-serif;
}

html {
  margin: 0px;
  padding: 0px;
  height: 100%;
}

body {
  position: relative;
  margin: 0px;
  padding: 0px;
  height: 100%;
  overflow: hidden;
  background-color: #f0f0f0;
}

span { display: inline; }

a { text-decoration: none; }

table {
  margin: 0px;
  padding: 0px;
  border: none;
  border-collapse: separate;
  border-spacing: 0;
}

th,td {
  text-align:left;
  font-weight: normal;
  border-top: none;
  border-right: none;
  border-left: none;
}

ul {
  display: block;
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

li {
  display: inline-block;
  margin: 0px;
  padding: 0px;
}

img {
  overflow: hidden;
  vertical-align: bottom;
  pointer-events: none;
  -webkit-backface-visibility: hidden;
}
img.us { -webkit-user-select: auto; }

h2,h3,h4 {
  display: inline-block;
  margin: 0px;
  padding: 0px;
  line-height: 1;
  font-weight: normal;
}

button {
  position: relative;
  border: none;
  background-color: transparent;
  vertical-align: bottom;
  outline: none;
}

textarea {
  display: block;
  resize: none;
}

input[type=text],
input[type=number],
textarea {
	-webkit-user-select : auto;
	margin-bottom: 0px;
	border: solid 1px #606060;
	border-radius: 0px;
}

.wrapper {
  position: relative;
  height: 100%;
  width: 100%;
  max-width: 750px;
  margin: 0px auto;
}

#contents_wrapper,
#dialog {
	position: fixed;
	top: 0px;
	left: 0px;
  height: 100%;
  width: 100%;
  max-width: 750px;
  background-color: #ffffff;
}

#dialog { z-index: 9999999; }

	#dialog_inner {
		position: relative;
		line-height: 1.5;
	}

	.dialog_btn_spacer {
		display: inline-block;
		width: var(--size-5);
	}

.relative { position: relative; }
.absolute { position: absolute; }

.fc_white  { color: #ffffff; }
.fc_red    { color: #ff7070; }
.fc_blue   { color: #7070ff; }

.bg_white  { background-color: #ffffff; }

.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }
.mcenter { margin-left: auto; margin-right: auto; }

.hidden { display: none; }
.block { display: block; }
.iblock { display: inline-block; }

.bold { font-weight: bold; }

.footer { position: absolute; bottom: 0px; left: 0px; }

.va_t { vertical-align: top; }
.va_b { vertical-align: bottom; }

.of { overflow: auto; -webkit-overflow-scrolling: touch; }

.border_d { border: dotted 1px #606060; }
.border_s { border: solid 1px #606060; }

/* ***** size ***** */
:root {
	--size-3:   3px;
	--size-5:   5px;
	--size-10:  10px;
	--size-15:  15px;
	--size-20:  20px;
	--size-25:  25px;
	--size-30:  30px;
	--size-40:  40px;
	--size-50:  50px;
	--size-85:  85px;
	--size-100: 100px;
	--size-120: 120px;
	--size-150: 150px;
	--size-160: 160px;
	--size-300: 300px;
	--size-350: 350px;
	--size-400: 400px;
	--size-500: 500px;
	--size-600: 600px;
	--size-650: 650px;
}

@media only screen and (max-width: 750px) {
	:root {
		--size-3:   0.40vw;
		--size-5:   0.67vw;
		--size-10:  1.33vw;
		--size-15:  2.00vw;
		--size-20:  2.67vw;
		--size-25:  3.33vw;
		--size-30:  4.00vw;
		--size-40:  5.33vw;
		--size-50:  6.67vw;
		--size-85:  11.33vw;
		--size-100: 13.33vw;
		--size-120: 16.00vw;
		--size-150: 20.00vw;
		--size-160: 21.33vw;
		--size-300: 40.00vw;
		--size-350: 46.67vw;
		--size-400: 53.33vw;
		--size-500: 66.67vw;
		--size-600: 80.00vw;
		--size-600: 80.00vw;
		--size-650: 86.67vw;
	}
}

.radi50p { border-radius: 50%; }

.radi10 { border-radius: var(--size-10); }
.radi20 { border-radius: var(--size-20); }
.radi30 { border-radius: var(--size-30); }

.h10 { height: var(--size-10); }
.h50 { height: var(--size-50); }
.h100 { height: var(--size-100); }
.h150 { height: var(--size-150); }
.h300 { height: var(--size-300); }
.h350 { height: var(--size-350); }
.h400 { height: var(--size-400); }
.h500 { height: var(--size-500); }
.h600 { height: var(--size-600); }

.h100p { height: 100%; }

.w100 { width: var(--size-100); }
.w150 { width: var(--size-150); }

.w10p { width: 10%; }
.w20p { width: 20%; }
.w23p { width: 23%; }
.w25p { width: 25%; }
.w30p { width: 30%; }
.w40p { width: 40%; }
.w45p { width: 45%; }
.w48p { width: 48%; }
.w50p { width: 50%; }
.w60p { width: 60%; }
.w70p { width: 70%; }
.w75p { width: 75%; }
.w90p { width: 90%; }
.w95p { width: 95%; }
.w100p { width: 100%; }

.lh1_5 { line-height: 1.5; }
.lh2_0 { line-height: 2.0; }

.p5 { padding: var(--size-5); }
.p10 { padding: var(--size-10); }
.p15 { padding: var(--size-15); }
.p20 { padding: var(--size-20); }
.p30 { padding: var(--size-30); }
.p50 { padding: var(--size-50); }

.mt5 { margin-top: var(--size-5); }
.mt10 { margin-top: var(--size-10); }
.mt20 { margin-top: var(--size-20); }
.mt25 { margin-top: var(--size-25); }
.mt30 { margin-top: var(--size-30); }
.mt50 { margin-top: var(--size-50); }
.mt100 { margin-top: var(--size-100); }

.mb20 { margin-bottom: var(--size-20); }
.mb30 { margin-bottom: var(--size-30); }