@charset "utf-8";
body{ 
    font-family:"游明朝","りょうゴシック", sanserif; 
	background: #749fd4;
	background-image: radial-gradient(circle at 50% -25px, rgba(240 248 252 / 50%) 30px 30px, #B9D7F4 100px 100px, #a5c7ee 150px 150px, #7ca4d4 300px 300px, #749fd4 100% 100%);
    margin:0;  
}

h1 { font-size: 45pt; 
padding: 10px 15px 5px;
font-weight: normal; 
font-family:"Voyager grotesque","Helvetica","游明朝","りょうゴシック","Helvetica", "sanserif"; 
/* color: rgba(249, 249, 250, 0.9); */
/* color: rgba(249, 249, 250, 0.4);
text-shadow: 2px 2px 2px rgba(206, 218, 250, .9), 0 0 rgba(41, 62, 121, .9); */

color: rgba(255, 255, 250, 0.6);
text-shadow:
        1px 1px 1px rgba(255, 255, 250, 0.1),
        1px -1px 1px rgba(255, 255, 250, 0.1),
        -1px 1px 1px rgba(255, 255, 250, 0.1),
        -1px -1px 1px rgba(255, 255, 250, 0.1),
        0 0 35px rgba(63, 63, 90, 0.4),
		0 3px 3px rgb(0 0 0 / 20%);
}


h2 { 
font-size: 18pt; 
color:#ffc0c0;
text-shadow:
        0 0 35px rgba(63, 63, 90, 0.4),
		0 3px 3px rgb(0 0 0 / 20%);
}

hr { 
	height: 0pt; 
	width:500px; 
	color: #87ceeb; 
	margin-right: 
	auto; 
}

p { 
font-size: 14pt;
line-height: 130%; 
}

a { 	overflow:hidden;
    	outline:none;}

a:link { color: #0645ad }    
a:visited { color: #0645ad }   
a:hover { color: #ff0066 } 
a:active { color: pink }   


/*ボックス*/

div.box_a { 
	width: 98%; 
	height: 10%;
	font-size: 11pt; 
	margin-left: auto; 
	margin-right: auto; 
	margin: 0 auto; 
	text-align: right; 
	line-height: 130%; 
	
	background-color: rgba(255, 255, 255, .2);
	padding: 1em;
          }

div.box_a1 { 
	width: 800px; 
	margin-left: auto; 
	margin-right: auto; 
	margin: 0 auto; 
	text-align: center; 
	font-size: 15pt; 
	line-height: 130%; 
          }

div.box_b {
	width: 700px; 
	font-size: 15pt; 
	text-align: center; 
	line-height: 130%;
	background-color: rgba(255, 255, 255, .2);
	margin: 0 auto; 
	padding: 1em 30px 1em 30px;

	position: relative;
	-webkit-box-shadow: 1px 2px 4px rgba(0,0,0,.5);
	-moz-box-shadow: 1px 2px 4px rgba(0,0,0,.5);
	box-shadow: 1px 2px 4px rgba(0,0,0,.5);
          }


div.box_c { 
	width: 800px; 
	margin-left: auto; 
	margin-right: auto; 
	margin: 0 auto; 
	text-align: center; 
	font-size: 15pt; 
	line-height: 130%; 
          }


/*ボタン*/

.button {
	display: inline-block;
	width: 150px;
	height: 30px;
	text-align: center;
	text-decoration: none;
	line-height: 200%;
	outline: none;
    margin:8px 10px 8px;

	background-color: rgba(255, 255, 255, .2);
	border-radius: 4px;
	color: teal;
	box-shadow: 0 3px 3px rgba(0, 0, 0, .2), inset 0 1px 1px rgba(255, 255, 255, .7);
	text-shadow: 0px 1px 0px rgba(0, 0, 0, .4);

}

.button::before,
.button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button,
.button::before,
.button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.button:hover {
	background-color: rgba(255, 255, 255, .3);
}

/*ボタン２(パカパカ)*/

.button2 {
	display: inline-block;
	width: 150px;
	height: 30px;
	text-align: center;
	text-decoration: none;
	line-height: 110%;
	outline: none;
	
	position: relative;
	z-index: 2;
	border: 2px solid #333;
	color: #fff;
	-webkit-perspective: 300px;
	perspective: 300px;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
}
.button2::before,
.button2::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button2,
.button2::before,
.button2::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.button2:hover {
	background-color: rgba(255, 255, 255, .3);
	color: #333;
}

.button2::after {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #333;
	-webkit-transform-origin: center bottom;
	transform-origin: center bottom;
	-webkit-transform: rotateX(0);
	transform: rotateX(0);
}

.button2:hover::after {
	-webkit-transform: rotateX(-180deg);
	transform: rotateX(-180deg);
}
	

/*ボタン・メインメニュー*/

.button_a {
	display: inline-block;
	width: 200px;
	height: 60px;
	text-align: center;
    text-decoration:none;
	line-height: 16px;
	outline: none;
    margin:0 20px 0 20px;
    
	position: relative;
	z-index: 2;
	background-color: rgba(255, 255, 255, .4);
	border-radius: 4px;
	color: teal;
	box-shadow: 0 3px 3px rgba(0, 0, 0, .2), inset 0 1px 1px rgba(255, 255, 255, .7);
	text-shadow: 0px 1px 0px rgba(0, 0, 0, .4);
				}

.button_a::before,
.button_a::after {
    position: absolute;
	z-index: -1;
	content: '';
    left: 0;
	width:100%;
	height: 50%;
	background-color: rgba(255, 255, 255, .4);
}



.button_a:hover {
	background-color: #fff;
	border-color: #59b1eb;
	color: #59b1eb;
}


.button_a,
.button_a::before,
.button_a::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}



.button_a::before {
	top: 0;
}
.button_a::after {
	bottom: 0;
}
.button_a:hover::before,
.button_a:hover::after {
	height: 0;
	background-color: #59b1eb;
}


/* クラス */

.title_red {
    color:#ec1359;
}

.title_green {
    color:#00a54f;
}


.small {
    font-size:small;
    line-height:20px;
		}

.t_dec_n {
    text-decoration:none;
    
}

.kankaku {
    float:left;
}

.puyopuyo {
    margin:0 0 0 90px;
}