* {
  margin: 0;
  padding: 0;
}

html {
	background:url("/images/bg.jpg") top center;
	background-repeat:repeat-y;
}

body {
	margin:0 auto;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#wrapper {
  padding: 10px;
  }

h1,h2,h3,h4,h5,pre {
  margin: 0 auto 10px;
  line-height: 1.3em;
  }

p {
padding: 5px;
}

#header {
	margin:0 auto;
	max-width: 980px;
}

#maintext {
	background-color:#FFF;
	margin:0 auto;
	padding: 10px;
	font-size:1em;
  	max-width: 960px;
}

.maincopy {
	text-align:center;
	font-size:1.5em;
	font-weight: bold;
	text-shadow: -1px -2px 3px #808080;
}

.topcopy {
	margin-left : auto ; margin-right : auto ;
	width:85%;
	font-size:1.1em;
}

.stdtext {
	margin-left : auto ; margin-right : auto ;
	font-size:0.9em;
	width:85s%;
	padding:5px;
}

.rightnote {
	font-size:0.8em;
	text-align:right;
	padding:10px;
}

.snote {
	font-size:0.8em;
	padding:10px;
	color:#333333;
}

.tabletext {
	font-size:0.9em;
	padding:5px;
}

.img-r {
    float: right;
	max-width: 100%;
	height:auto;
	margin:5px;
    padding: 5px;
}

.img-l {
    float: left;
	max-width: 100%;
	height:auto;
	margin:5px;
    padding: 5px;
}

.autoimg {
	max-width: 100%;
	height:auto;
}

.sasie {
	max-width: 100%;
	height:auto;
	padding:15px;
}

#footer {
	margin-left : auto ; margin-right : auto ;
	border-top:thin solid #CCC;
	max-width: 960px;
}

#footer .footlink {
	padding:5px;
	text-align:center;
	font-size:smaller;
}
#footer p {
	padding:10px;
	text-align:center;
	font-size:smaller;
}


.sampletext {
	font-size:12px;
	line-height:16px;
	}

.clear {
clear:both;
}
.clear hr {
display:none;
}

.centertext {
	text-align:center;
	font-size:large;
}

.notice {
	color:#FF0000;
}

.centerred {
	text-align:center;
	font-weight:bold;
	font-size:large;
	color:#FF0000;
}

hr {
	margin:20px;}

.whitebox {
	margin-left : auto ; margin-right : auto ;
	box-shadow:#CCC;
	color:#333333;
	width:80%;
	background-color:#E6F0F0;
	padding:10px;
	border:double #666;
}

.yellowbox {
	margin-left : auto ; margin-right : auto ;
	box-shadow:#CCC;
	color:#333333;
	width:60%;
	background-color:#FFFF00;
	padding:10px;
	border:double #666;
}

.graybox {
	margin-left : auto ; margin-right : auto ;
	box-shadow:#CCC;
	width:85%;
	background-color:#F0F0F0;
	padding:10px;
	font-size:14px;
	border:double #666;
}

.rightbox {
	float:right;
	width:50%;
	padding:10px;
	margin:10px;
	border:thin #666;
}

li {margin-left:30px;}

h1 {
	font-weight:bolder;
	font-size:1.7rem;
	margin-top:5px;
	margin-bottom:5px;
	border-bottom:solid 2px #333;
	color:#333:
}


h2 {
	font-weight:bolder;
	font-size:1.2rem;
	margin-left:10px;
	margin-right:10px;
	margin-top:5px;
	margin-bottom:5px;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:10px;
	border-radius: 10px;        /* CSS3草案 */  
	-webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
	-moz-border-radius: 10px;   /* Firefox用 */ 
	border:solid 1px #004030;
	background-color:#CCFFCC;
	color:#004030;
}


h3 {
	font-weight:bolder;
	font-size:1.1rem;
	background-color:#EFFFBF;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 10px;
	margin-left:5px;
	margin-right:5px;
	border-left:double #002DB2;
	border-bottom:1px solid #002DB2;
}

h4 {
	font-weight:bolder;
	font-size:1.0rem;
	border-top:double #002DB2;
	border-bottom:double #002DB2;
	color:#002DB2;
	margin-left:5px;
	margin-right:5px;
	margin-top:20px;
	margin-bottom:5px;
	padding-left:5px;
}

h5 {
	border-bottom:dotted #333;
	font-size:1.0rem;
	font-weight:bolder;
	padding-left:2px;
	margin-left:10px;
	margin-top:5px;
	margin-bottom:5px;
	margin-right:10px;
}

h6	{
	font-size:0.9rem;
	font-weight:bold;
	margin-left:10px;
	margin-right:10px;
	padding-left:20px;
	}


.titlebox {
	background-color:#91002D;
	line-height: 2em;
	margin-left:50px;
	margin-right:50px;
	color:#FFFFFF;
	font-size:1.2em;
	font-weight:bold;
	border-radius: 10px;        /* CSS3草案 */  
	-webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
	-moz-border-radius: 10px;   /* Firefox用 */ 
}

.prof {
	margin-left:40px;
}

td	{
	padding:5px;
}

.whitetitle {
	color:#FFFFFF;
	font-weight:bold;
}

.gb1 {
	font-size:0.9em;
	text-align:center;
	vertical-align:middle;
	background-color:#E6F0F0;
	}

.gb2 {
	font-size:0.9em;
	text-align:center;
	vertical-align:middle;
	background-color:#E6E6E6;
}

.gb3 {
	font-size:0.9em;
	text-align:center;
	vertical-align:middle;
	background-color:#FFC;
}	

.notebox {
	font-size:0.7em;
	text-align:center;
	vertical-align:middle;
	background-color:#f4a460;
	color:#FFFFFF;
	border:solid 1px #F8F8F8;
}	

a.btn {
  display: inline-block;
  margin: 10px 10px 0;
  font-weight:bold;
  padding: .6em 1.1em;
  font-size: 1em;
  text-decoration: none;
  outline: none;
  color: #000000;
  background-color: #FFFF66;
  border-radius: 3px;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-box-shadow: 0 0 0 -1px #004030, 0 0 0 -1px #004030;
  box-shadow: 0 0 0 -1px #004030, 0 0 0 -1px #004030;
  border: 1px solid #004030;
  -webkit-transition: -webkit-box-shadow .3s;
  transition: box-shadow .3s;
}

a.btn:hover, a.btn:focus {
  -webkit-box-shadow: 0 0 0 1px #004000, 0 0 0 2px #004000;
  box-shadow: 0 0 0 1px #004000, 0 0 0 2px #004000;
  -webkit-transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
  transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
  -webkit-animation: gelatine 0.5s 1;
  background-color: #FFFF00;
  animation: gelatine 0.5s 1;
}

a.btn-secondary {
  background:#CCCCFF;
  display: inline-block;
  margin: 10px 10px 0;
  font-weight:bold;
  padding: .6em 1.1em;
  font-size: 1em;
  text-decoration: none;
  outline: none;
  color: #000000;
  border-radius: 3px;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-box-shadow: 0 0 0 -1px #004030, 0 0 0 -1px #004030;
  box-shadow: 0 0 0 -1px #004030, 0 0 0 -1px #004030;
  border: 1px solid #004030;
  -webkit-transition: -webkit-box-shadow .3s;
  transition: box-shadow .3s;
}
}
a.btn-secondary:hover {
  -webkit-box-shadow: 0 0 0 1px #004000, 0 0 0 2px #004000;
  box-shadow: 0 0 0 1px #004000, 0 0 0 2px #004000;
  -webkit-transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
  transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
  -webkit-animation: gelatine 0.5s 1;
  background:#CCCCCC;
  animation: gelatine 0.5s 1;
}

a.btn-3rd {
  background:#005830;
  -webkit-box-shadow: 0 0 0 -2px #cff09e, 0 0 0 -1px #006680;
  box-shadow: 0 0 0 -2px #cff09e, 0 0 0 -1px #c8c8a9;
}
a.btn-3rd:hover {
  -webkit-box-shadow: 0 0 0 2px #cff09e, 0 0 0 4px #0096CC;
  box-shadow: 0 0 0 2px #cff09e, 0 0 0 4px #bebe99;
}

a.btn-sub {
  background: #C60;
  -webkit-box-shadow: 0 0 0 -2px #cff09e, 0 0 0 -1px #c8c8a9;
  box-shadow: 0 0 0 -2px #cff09e, 0 0 0 -1px #c8c8a9;
}
a.btn-sub:hover {
  -webkit-box-shadow: 0 0 0 2px #cff09e, 0 0 0 4px #bebe99;
  box-shadow: 0 0 0 2px #cff09e, 0 0 0 4px #bebe99;
} 
  
a.btn:active,
a.btn-sub:active,
a.btn-3rd:active,
a.btn-secondary:active {
  background: #4ecdc4;
  -webkit-transition-duration: 0;
  transition-duration: 0;
  -webkit-box-shadow: 0 0 0 2px #cff09e, 0 0 0 4px #3ac7bd;
  box-shadow: 0 0 0 2px #cff09e, 0 0 0 4px #3ac7bd;
}

a.smallbtn {
  display: inline-block;
  margin: 5px 5px 0;
  padding: .4em .8em;
  font-size:0.9em;
  font-weight:bold;
  text-decoration: none;
  outline: none;
  color: #FFFF66;
  background-color: #468C00;
  border-radius: 3px;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-box-shadow: 0 0 0 -2px #cff09e, 0 0 0 -1px #fe4365;
  box-shadow: 0 0 0 -2px #cff09e, 0 0 0 -1px #fe4365;
  border: none;
  -webkit-transition: -webkit-box-shadow .3s;
  transition: box-shadow .3s;
}
a.smallbtn:hover, a.smallbtn:focus {
  -webkit-box-shadow: 0 0 0 2px #468C00, 0 0 0 4px #468C00;
  box-shadow: 0 0 0 2px #468C00, 0 0 0 4px #468C00;
  -webkit-transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
  transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
  -webkit-animation: gelatine 0.5s 1;
  animation: gelatine 0.5s 1;
  background-color: #004010;
}

a.smallbtn:active {
  background: #468C00;
  -webkit-transition-duration: 0;
  transition-duration: 0;
  -webkit-box-shadow: 0 0 0 2px #468C00, 0 0 0 4px #468C00;
  box-shadow: 0 0 0 2px #468C00, 0 0 0 4px #468C00;
}

a.smallbtn2 {
  display: inline-block;
  margin: 5px 5px 0;
  padding: .4em .8em;
  font-weight:bold;
  font-size:0.9em;
  text-decoration: none;
  outline: none;
  color: #FFFF66;
  background-color: #00661A;
  border-radius: 3px;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-box-shadow: 0 0 0 -2px #cff09e, 0 0 0 -1px #fe4365;
  box-shadow: 0 0 0 -2px #cff09e, 0 0 0 -1px #fe4365;
  border: none;
  -webkit-transition: -webkit-box-shadow .3s;
  transition: box-shadow .3s;
}
a.smallbtn2:hover, a.smallbtn2:focus {
  -webkit-box-shadow: 0 0 0 2px #cff09e, 0 0 0 4px #ff0364;
  box-shadow: 0 0 0 2px #cff09e, 0 0 0 4px #ff0364;
  -webkit-transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
  transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8);
  -webkit-animation: gelatine 0.5s 1;
  animation: gelatine 0.5s 1;
  background: #004000;
}

a.smallbtn2:active {
  background: #004000;
  -webkit-transition-duration: 0;
  transition-duration: 0;
  -webkit-box-shadow: 0 0 0 2px #cff09e, 0 0 0 4px #3ac7bd;
  box-shadow: 0 0 0 2px #cff09e, 0 0 0 4px #3ac7bd;
}

input[type="radio"] , input[type="checkbox"]{
   -webkit-transform: scale(1.5);
   transform: scale(1.5);
   margin-right: 0.5em;
}
input#submit_button {
padding: 10px 20px;
font-size: 1.2em;
background-color: #248;
color:#FFFFFF;
}
input#submit_button:hover {
background-color: #24d;
}

input[type="radio"] , input[type="checkbox"]{
   -webkit-transform: scale(1.2);
   transform: scale(1.2);
   margin-right: 0.5em;
}


@media only screen and (max-width: 640px){
body,p {
	font-size: 0.9em;
  }
html,h1,h2,h3,h4.h5,h6 {
	font-size: 1em;
}
#wrapper{
	font-size:1em;
  }
.topcopy{
	font-size:0.9em;
  }
.maintext{
	font-size:0.8em;
  }
.bodytext{
	font-size:0.8em;
  }
.centertext{
	font-size:0.8em;
  }
td {
	font-size:0.7em;
 }
}