@charset "utf-8";
/* CSS Document */

/*　さりー！！！！リセット　*/
html{overflow-y:scroll;}

h1, h2, h3, h4, h5, h6{font-weight:normal;font-size:100%;}

.clearfix:after {
content: '';
display: block;
clear: both;
height: 0;
}

html, body,div,h1,h2,h3,h4,h5,h6,p,ul,li,dl,dt,dd {
margin:0;
padding:0;
}

section,nav,article,header,footer{display:block;}

img {border:0;}

a{color:blue;text-decoration:none;}

a:hover{color:red;}

ul{list-style-type:none;}

li{list-style:none;}

address,strong,em{font-style:normal;font-weight:nomal;}

body{
	font-size:10px;
	letter-spacing:3px;
	line-height:1.8;
	color:#000;
	font-family: "メイリオ", Meiryo, Arial, Helvetica, sans-serif;
	margin:0px 0 0px;
	overflow:auto;
}
/*反転時の背景色 */
::selection {
background:lightseagreen;
color:#fff;
}
/* Firefox対応*/
::-moz-selection {
background:lightseagreen;
color:#fff;
}
/*--------------背景画像について-------------------------*/
img.bg {
 /* Set rules to fill background */
min-height: 100%;
min-width: 1024px;
/* Set up proportionate scaling */
width: 100%;
height: auto;
/* Set up positioning */
position: fixed;
/* またはabsolute; */
top: 0;
left: 0;
}
	 
@media screen and (max-width: 1024px){
img.bg{
left: 50%;
margin-left: -512px; }
}

/*共通のものヘッダー*/
#wrapper{
position:relative;
}
header{
width:960px;
padding: 0 20px 3em;
margin:0 auto;
}
header h1{
color: #fff;
    font-family: 'Amatic SC',cursive;
    font-size: 6.5em;
    letter-spacing: 0.1em;
}
header #top_logo{
color: #FFF;
    font-family: 'Amatic SC',cursive;
    font-size: 6.5em;
    letter-spacing: 0.1em;
	display:inline;
}
header p{
color: #fff;
    letter-spacing: 1.1em;
    margin-top: -2em;
}
header a{
color:#fff;

-webkit-transition: all 1s ease-out;
    -moz-transition: all 1s ease-out;
    -o-transition: all 1s ease-out;
    transition: all 1s ease-out;
}
header a:hover{
color:#fff;
text-shadow: 0 1px 2px #fff;
-webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
/*コンテンツ*/
#container{
margin:0 auto;
padding:0 20px;
width:960px;
}
#leftbody{
width:300px;
float:left;
}
#rightbody{
width:655px;
float:left;
}
#rightbody .h1{
 color: #555555;
    font-weight: bold;
    margin-bottom: 1em;
    text-align: right;
    text-shadow: 0 1px 1px #FFFFFF;
}
/*左メニュー*/
nav ul li{
letter-spacing:0;
font-size:3.5em;
font-family: 'Amatic SC', cursive;
}
nav ul li a{
/*color:#2064a1;*/
color:#000;
text-shadow: 0 1px 2px #FFF;
-webkit-transition: all 1s ease-out;
    -moz-transition: all 1s ease-out;
    -o-transition: all 1s ease-out;
    transition: all 1s ease-out;
}
nav ul li a:hover{
color:#fff;
-webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
#icon div{
float:left;
margin-right:0.2em;
font-size:2em;
color:teal;
}
.select a{
color:#fff;
}
/*右コンテンツ*/
#rightbody section{
    margin-bottom: 2em;
    padding:4em;
	background-color:#333;
	background-color: rgba(0,0,0,0.5); 
	color:#fff;
	border-radius:0.5em;
}

#rightbody section h1{
font-weight:bold;
}
#rightbody section h2{
font-weight:bold;
}
/*フッター*/
footer{
margin-top:10em;
width:960px;
padding:3em 20px;
margin:0 auto;
}
footer address{
text-align:right;
}
/*スムーススクロールのボタン*/
.totop a{
display:block;
text-align:right;
color:#000;
opacity:0.7;
font-size:1.2em;
}
.totop a:hover{
color:#fff;
-webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}