﻿body {
	margin:				0px auto;
	max-width:			780px;
	width:				90vw;
	background-image:	url(pic/Back03.jpg);
	background-size:	cover;
	height:				100%;
}


input {
	font-size:			18px;
	border-radius: 		7px;
	background-color:	rgba(255,255,255,0.7)
}

textarea {
	border-radius: 		7px;
	font-family:		serif;
	font-style:			italic;
	font-size:			16px;
	color:				#b22222;
	line-height:		18px;
	background-color:	rgba(255,255,255,0.7)
}


select {
	border-radius: 		7px;
}

.week_label {
	position:			relative;			/* ボックスの位置を指定する */
	padding:			0px 5px 0px 5px;	/* ボックス内側の余白を指定する */
	background-color:	#e2edf9;			/* ボックスの背景色を指定する */
}

ul.week li{
	border-style:		grove,ridge,inset,outset;
	border-color:		#cccccc;
	border-radius: 		7px;
	padding:			0px 0px 0px 3px;
	display:			inline-block;
	list-style:			none;
	text-align:			left;
}


.boxes {
  margin: auto;
  padding: 50px;
  background: #484848;
}


/*Checkboxes styles*/
input[type="checkbox"] { display: none; }

input[type="checkbox"] + label {
	display:				block;
	position:				relative;
	padding-top:			3px;
	padding-left:			24px;
	font-size:				18px;
	line-height:			24px;
	cursor:					pointer;
	-webkit-user-select:	none;
	-moz-user-select:		none;
	-ms-user-select:		none;
	vertical-align:			middle;
}

input[type="checkbox"] + label:last-child { margin-bottom: 0; }

input[type="checkbox"] + label:before {
  content:				'';
  display:					block;
  margin-top:				6px;
  width:					16px;
  height:					16px;
  border:					1px solid #808000;
  position:					absolute;
  left:						0;
  top:						0;
  opacity:					0.6;
  -webkit-transition:		all .12s, border-color .08s;
  transition:				all .12s, border-color .08s;
}

input[type="checkbox"]:checked + label:before {
  width:					10px;
  top:						-5px;
  left:						5px;
  border-radius:			0;
  opacity:					1;
  border-top-color:			transparent;
  border-left-color:		transparent;
  -webkit-transform:		rotate(45deg);
  transform:				rotate(45deg);
}


.label {
	margin:					5px;				/* ラベルの外側の余白を指定する */
	cursor:					pointer;
    text-align:				left;
}


.brck01 {
	line-height:		10px;
}


.ckColor01 {
	color:					#b22222;
	background-color:		rgba(255,255,255,0.7);
}

.ckColor02 {
	color:					#005243;
	background-color:		rgba(255,255,255,0.7);
}


input#btnStart {
    display: inline-block;
    text-decoration: none;
    background:			rgba(127,255,255,0.7);
    color:				#202f55;
    width: 122px;
    font-size: 20px;
    height: 120px;
    line-height: 120px;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    overflow: hidden;
    box-shadow: inset 0px 3px 0 rgba(255,255,255,0.3), 0 3px 3px rgba(0, 0, 0, 0.3);
    font-weight: bold;
    border-bottom: solid 3px #549fa9;
    text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.65);
	transition: .4s;
	cursor:				pointer;
}
input#btnSubmit.btn:active{
    -ms-transform: translateY(1px);
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.35);
    border-bottom: none;
}

input#btnClear {
    display: inline-block;
    text-decoration: none;
    background:			rgba(255,255,178,0.7);
    color:				#72640c;
    width: 122px;
    font-size: 20px;
    height: 120px;
    line-height: 120px;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    overflow: hidden;
    box-shadow: inset 0px 3px 0 rgba(255,255,255,0.3), 0 3px 3px rgba(0, 0, 0, 0.3);
    font-weight: bold;
    border-bottom: solid 3px #549fa9;
    text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.65);
    transition: .4s;
	cursor:				pointer;
}

button#btnSubmit {
    display: inline-block;
    text-decoration: none;
    background: #5dc3d0;
    color: rgb(82, 109, 150);
    width: 122px;
    font-size: 20px;
    height: 120px;
    line-height: 120px;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    overflow: hidden;
    box-shadow: inset 0px 3px 0 rgba(255,255,255,0.3), 0 3px 3px rgba(0, 0, 0, 0.3);
    font-weight: bold;
    border-bottom: solid 3px #549fa9;
    text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.65);
	transition: .4s;
	cursor:				pointer;
}
button#btnSubmit.btn:active{
    -ms-transform: translateY(1px);
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.35);
    border-bottom: none;
}

input#button {
    display: inline-block;
    text-decoration: none;
    background: #f7d76e;
    color: rgb(82, 142, 150);
    width: 122px;
    font-size: 20px;
    height: 120px;
    line-height: 120px;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    overflow: hidden;
    box-shadow: inset 0px 3px 0 rgba(255,255,255,0.3), 0 3px 3px rgba(0, 0, 0, 0.3);
    font-weight: bold;
    border-bottom: solid 3px #549fa9;
    text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.65);
    transition: .4s;
	cursor:				pointer;
}
input#button.btn:active{
    -ms-transform: translateY(1px);
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.35);
    border-bottom: none;
}

#footer {
	position:			fixed;
//	display:			flex;
	bottom:				0;
	width:				95vw;
	max-width:			780px;
	height:				30px;
	text-align:			right;
	color:				#cd853f;
}

.display_l {
	display:			inherit;
}

.display_s {
	display:			none;
}

.br-use {
	display:			none;
}


.title1 {
	font-family:		serif;
	font-style:			italic;
	color:				#dc143c;
	font-size:			46px;
	text-align:			center;
	line-height:		64px;"
}

.stitle1 {
	font-family:		serif;
	font-style:			italic;
	color:				#005243;
	font-size:			20px;
	text-align:			center;
	line-height:		28px;"
}


.stitle2 {
	font-family:		serif;
	font-style:			italic;
	font-weight:		bolder;
	color:				#ff0000;
	font-size:			32px;
	text-align:			center;
	line-height:		72px;"
}

.font02 {
	font-family:		serif;
	font-style:			italic;
	font-weight:		bolder;
	color:				#ff0000;
	font-size:			36px;
	text-align:			center;
	line-height:		42px;"
}

.font03 {
	font-family:		serif;
	font-style:			italic;
	color:				#556b2f;
	font-size:			36px;
	line-height:		38px;
}


.font05 {
	font-family:		serif;
	font-style:			italic;
	color:				#800080;
	font-size:			22px;
	line-height:		26px;
}

.font06 {
	font-family:		serif;
	font-style:			italic;
	color:				#b22222;
	font-size:			26px;
	line-height:		32px;
}


div.link {
	color:				#808000;
}

div.visited {
	color:				#556b2f;
}



.tbl01 {
	width:				100%;
}

.td01 {
	width:				700px;
	font-size:			24px;
}


table.tbl02 {
	width:				98vw;
	font-family:		serif;
	font-style:			italic;
	font-size:			22px;
	color:				#800080;
	border-radius:		7px;
}
table.tbl02 tbody tr :nth-child(1) {
	width:				30vw;
	vertical-align:		middle;
	font-family:		serif;
	font-style:			italic;
	font-size:			20px;
	text-align:			center;
	color:				#b22222;
}
table.tbl02 tbody tr :nth-child(2) {
	vertical-align:		middle;
	font-family:		serif;
	text-align:			left;
	font-style:			italic;
	font-size:			34px;
	color:				#b22222;
}


table.tbl03 {
	width:				100vw;
	font-family:		serif;
	font-style:			italic;
	color:				#800080;
	border-radius:		7px;
}
table.tbl03 tbody tr :nth-child(1) {
	width:				200px;
	vertical-align:		middle;
	font-family:		serif;
	font-style:			italic;
	font-size:			12px;
	text-align:			center;
	color:				#b22222;
}
table.tbl03 tbody tr :nth-child(2) {
	vertical-align:		middle;
	font-family:		serif;
	font-style:			italic;
	font-size:			32px;
	text-align:			left;
	color:				#b22222;
}


table.tbl04 {
	width:				100vw;
	font-family:		serif;
	font-style:			italic;
	font-size:			18px;
	line-height:		32px;
	border-radius:		7px;
}
table.tbl04 tbody tr :nth-child(1) {
	min-width:			130px;
	vertical-align:		top;
	font-family:		serif;
	font-style:			italic;
	color:				#b22222;
}
table.tbl04 tbody tr :nth-child(2) {
	min-width:			500px;
	font-family:		serif;
	font-style:			italic;
	color:				#b22222;
}


table.tbl05 {
	width:				90vw;
	font-family:		serif;
	font-style:			italic;
	font-size:			18px;
	color:				#b22222;
	line-height:		32px;
	border-radius:		7px;
}
table.tbl05 tbody tr :nth-child(1) {
	min-width:			20px;
	text-align:			right;
	vertical-align:		top;
	font-family:		serif;
	font-style:			italic;
}
table.tbl05 tbody tr :nth-child(2) {
	font-family:		serif;
	font-style:			italic;
}


table.tbl06 {
	width:				90vw;
	font-family:		serif;
	font-style:			italic;
	font-size:			18px;
	line-height:		32px;
	color:				#b22222;
	background-color:	rgba(255,255,255,0.7);
	border-radius:		7px;
}


.linehigh01{
	line-height:		24px;
}

table.title_l{
	color:					#000000;
	text-align:				center;
	max-width:				780px;
	width:					90vw;
	background-color:		rgba(248,244,230,0.75);
}

.frame01{
	width:				80vw;
	max-width:			700px;
	border:				1px solid #556b2f;
	padding:			10px;
	font-size:			0.9em;
	margin-top:			-20px;
	background-color:	rgba(255,255,255,0.5);
}


.btnSubmit{
    border:				0px;
    width:				250px;
    height:				40px;
    background:			url(pic/Check.gif) left top no-repeat;
}
