@charset "Shift_JIS";
/* 初期設定されている余白を0にする */
body,h1,h2,h3,h4,h5,h6{
       margin:0;   
}
/* 全ページ共通のデザイン用 */
body{
        color:#ffffff;
	font-family:"メイリオ","Time New Roman",sans-serif;
	
	background-image:url("images/kabe-sora.jpg");
	line-height:1.4;
 	letter-spacing :2.0px;
 	margin:0px;  	
}

h1{
	font-size:120%;	
} 

h2{
	font-size:100%;
} 

p{
        /* color:#ffffff; */
	text-align:left;
}
	

img{
	border-width:0;
}
/* ヘッダーの設定 */
.header{
        color:#ffffff;
	width:960px;
	margin-right: auto;
	margin-left: auto;
	text-align:center;
	                  /* 左右から中央にヘッダーを配置する */
}
.header-t{
        color:#000000;
	width:1300px;
	margin-right: auto;
	margin-left: auto;
	text-align:center;
	                  /* 左右から中央にヘッダーを配置する */
}
.main{
	background-color:#153571 ;
        color:#ffffff; 
	width:1000px;
	margin-right: auto;
	margin-left: auto;
	
}

/* 全ページ表示 */
.main-t{
     /* background-color:#153571 ; */
        color:#000000; 
	width:1300px;
	margin-right: auto;
	margin-left: auto;
	
}
.waku1m{
	width:880px;
	margin-right: auto;
	margin-left: auto;
	padding:10px;
	
}
.waku1m img{
	margin-right:10px;
}
.waku2m{
	width:980px;
	margin-right: auto;
	margin-left: auto;
	padding:10px;
}
.waku3m{
	width:500px;
	margin-left:10px;
	padding:10px;
}
.waku4m{
	width:900px;
	margin:20px;
        text-align:center;
        padding:20px;
}
.waku4m-t{
        color:#000000; 
	width:1300px;
	margin-right:80px;
        margin-left:10px;
        text-align:center;
}

.meisai-waku{
	padding:5px;
	width:460px;
        height:250px;
	margin-left:auto;
	margin-right:auto;
	float:left;
}
/* フォームを中心 */
.waku-ml{
	width:380px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

.kakoi{
	width:950px;
	border-style:ridge;
	border-width:2px;
	border-color:#ffffff;
	margin:10px;
	padding:10px;
	overflow:hidden;
}

.ooigawa{
	text-align:center;
	width:700px;
	margin-right: auto;
	margin-left: auto;
	padding:10px;
}
.richi{
	margin-right:20px;
}

/* 固定ヘッドの設定 */
.box{
	background-color:# ;
	top:0px;
	height:120px;
	position:fixed;  
	z-index: 10;     
}

.box-t{
	background-color:# ;
	top:0px;
	height:120px;
   
}
/* 固定ヘッドの位置調整の設定 */
.box1{
	color:#ffffff;
	padding-top: 200px;
   	margin-top: -200px;

}
/* 左側のインフォメーション域を設置する */
.saidol{
	background-color:#170b58;
	text-align:center;
	width:140px;
	float:left;
	margin-top:20px;
	margin-left:10px;
	padding:10px;
	position:fixed;
	z-index: 20;
	line-height:1.5;
 	letter-spacing :2.3px;
	display:block;
}


/* 動画の個々の枠の設定 */
.douga{
	width:320px;
	height:280px;
	margin:0;
	text-align:center;
	font-size:90%;
}


/* 動画の横3つをセンターへ設定 */
.dougawaku{
	width:970px;
	height:300px;
	padding:5px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}
.dougawaku1{
	width:970px;
	height:250px;
	padding:5px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

/* フッターのデザイン用 */
.footer{
	background-color:#000000;
	width:1000px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;

}
.foot{
	color:#ffffff;
	margin:0;
	text-align:center;
	border-style:ridge;
	border-width:2px;
	border-color:#ffffff;
	width:700px;
	margin-left:auto;
	margin-right:auto;
	
}


/* リンク部分のデザイン用 */
a{
	color:#ffffff;
}
a:link{
	color:#ffffff;
}
a:hover{
	color:#ffffff;
}
a:visited{
	color:#ffffff;
}

/* 配置レイアウト用 */
.center{
	text-align:center;
}

/* メニュ名 */
.center2{
	width:82px;
	display:none;
}
/* フロート */
.fl{
	float:left;
}
.fr{
	float:right;
}
.cl{
	clear:both;
}

hr{
	clear:both;
}

/* ボタンエリア */
.navi{
	width:930px;
	padding:0px;
	margin-left:auto;
	margin-right:auto;
	list-style-type:none;
	display:block;
}
.navi2{
	width:100%;
	margin-right: auto;
	margin-left: auto;
	display:none;
}
.navi li{
	float:left;
}
.aida{
	padding-right:5px;
}


/* ボタンエリアここまで */
/* スライドショー用 */
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }
/* ここまで　スライドショー用 */
/* このlogohは画像サイズ設定用　*/
.logohx{
	width:60px;
	height:30px;
}
.logohh{
	width:1000px;
	height:90px;
}
.logohh1{
	width:1000px;
	height:10px;
}
.logoh0{
	width:1000px;
	height:120px;
}

/* このlogoh1はサイトへのバナーのロゴ */
.logoh1{
	width:140px;
	height:auto;
}
/* このlogoh2はリンクへのボタン */
.logoh2{
	width:150px;
	height:47px;
}
/* このlogoh3はGIFアニメ */
.logoh3{
	width:300px;
	height:120px;
}
/* このlogoh31はウルトラGIFアニメ */
.logoh31{
	width:800px;
	height:272px;
}

/* このlogoh4はスマホ用ボタン */
.logoh4{
	width:500px;
	height:40px;
}

/* このhabaはサムネイル画像 */
.haba{
	width:230px;
	height:138px;
}
/* このhaba1はフナッシー画像 */
.haba1{
	width:97px;
	height:147px;
}
/* このhaba2は拡大画像のサムネイル */
.haba2{
	width:320px;
	height:250px;
}
.haba3{
	width:225px;
	height:126px;
}
.haba4{
	width:300px;
	height:168px;
}
.haba41{
	width:300px;
	height:168px;
}
.haba5{
	width:300px;
	height:191px;
}

.haba6{
	width:150px;
	height:90px;
}
.haba7{
	width:240px;
	height:157px;
}
.haba8{
	width:190px;
	height:114px;

}
.haba9{
	width:500px;
	height:673px;

}
.haba10{
	width:700px;
	height:394px;

}
.haba11{
	width:350px;
	height:282px;

}
.haba12{
	width:500px;
	height:355px;

}

.sumaho{
	display:none;
}
.pc{
	display:block;
}
/*　ここから　ドロワーメニュー */
nav.menu{
	display:none;
}
#menu{
	display:none;
}

/* スマフォサイズCSS */
@media(max-width:500px){
.center2{
	top:38px;
	left:1px;
	position:fixed;  
	z-index: 10;  
	display:block; 
}
.logohh{
	width:100%;
	height:100%;
}
.logohh1{
	width:100%;
	height:100%;
}
.logoh0{
	width:100%;
	height:auto;
}
.logoh1{
	width:95%;
	height:auto;
}
.logoh2{
	width:100%;
	height:auto;
}
.logoh3{
	width:40%;
	height:40%;
}
.logoh31{
	width:100%;
	height:100%;
}
.logoh4{
	width:100%;
	height:100%;
}
.haba{
	width:48%;
	height:48%;
	margin-left:1px;
}
.haba1{
	width:70%;
	height:70%;
}
.haba2{
	width:100%;
	height:100%;
}
.haba3{
	width:48%;
	height:48%;
}
.haba4{
	width:48%;
	height:48%;
}
.haba41{
	width:100%;
	height:100%;
}
.haba5{
	width:100%;
	height:100%;
}

.haba6{
	width:100%;
	height:100%;
}
.haba7{
	width:100%;
	height:100%;
}
.haba8{
	width:100%;
	height:100%;
}
.haba9{
	width:100%;
	height:100%;
}
.haba10{
	width:100%;
	height:100%;
}
.haba11{
	width:100%;
	height:100%;
}
.haba12{
	width:90%;
	height:90%;
}
.waku1m{
	width:95%;
}
.waku2m{
	width:95%;
}
.waku3m{
	width:95%;
}
.waku4m{
	width:95%;
	margin:5px;
        text-align:center;
        padding:5px;
}
.waku4m-t{
	width:95%;
	margin:5px;
        text-align:center;
        padding:5px;
}

/* フォームを中心 */
.waku-ml{
	width:50%;
	height:auto;
	margin:0;
}
.ooigawa{
	text-align:center;
	width:95%;
	margin-right: auto;
	margin-left: auto;
	padding:10px;
}
.richi{
	margin-right:5px;
}
.kakoi{
	width:90%;
}
/* 左側のインフォメーション域を設置する */

.saidol{	
	width:20%;
	font-size:70%;
	background-color:rgba(0,0,102,0.5);
	margin-top:50px;
	margin-left:5px;
	display:none;
}
.header {
	width: 100%;
}
.header-t {
	width: 100%;
}

.main{
	width: 95%;
}
.main-t{
	width: 95%;
}

h1{
	font-size:100%;
} 
h2{
	width:95%;
	margin-left:auto;
	margin-right:auto;
} 

.footer {
	width: 95%;
}
.foot {
	width: 95%;
}
.box {
	width: 95%;
	float: none;
}
.box1 {
	width: 95%;
}

/* ボタンエリア */
.navi{
	display:none;
}

.navi li{
	float:none;
}

.navi ul{
	width:70%;
	padding:0;
	margin-right: auto;
	margin-left: auto;
}
.navi2{
	width:90%;
	margin-right: auto;
	margin-left: auto;
	display:block;
}
.navi2 img{
	width:100%;
	height:auto;
}
/* 動画の個々の枠の設定 */
.douga{
	width:100%;
	height:100%;
	float:none;
}
.douga1{
	width:100%;
	height:100%;
	float:none;
}
/* 動画の横3つをセンターへ設定 */
.dougawaku{
	width:100%;
	height:auto;
}
.dougawaku1{
	width:100%;
	height:auto;
}
.meisai-waku{
	width:100%;
	height:auto;
}
.sumaho{
	display:block;
}
.pc{
	display:none;
}
nav.menu{
	display:block;
}
#menu{
	display:block;
}

/* ハンバーガーボタン */

nav.menu			{ width:40px; height:38px; top: 60px; left:10px; position:fixed; cursor:pointer; overflow:hidden; z-index:9999; background-color: #64f288; }
nav .menu1			{ width:25px; height:2px; background-color: #000; top:0px; position:absolute; margin:8px; } 
nav .menu2			{ width:25px; height:2px; background-color: #000; top:8px; position:absolute;  margin:8px; } 
nav .menu3
			{ width:25px; height:2px; background-color: #000; top:16px; position:absolute; margin:8px;  }
/* ハンバーガーボタン */
nav .menu1,nav .menu2,nav .menu3
					{ transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; /* Opera */ -moz-transition: all 0.5s ease-out; /* Firefox */
					 -webkit-transition: all 0.5s ease-out; /* GoogleChrome, Safari */ -ms-transition: all 0.5s ease-out; /* IE */ }
/* ハンバーガーボタン */
nav .menuclick1		{ top:8px; -o-transform: rotate(405deg); -moz-transform: rotate(405deg); -webkit-transform: rotate(405deg);
				 	-ms-transform: rotate(405deg); transform: rotate(405deg); }
nav .menuclick2		{ background-color:rgba(255,255,255,0);  }
nav .menuclick3		{ top:8px; -o-transform: rotate(-405deg); -moz-transform: rotate(-405deg);
					-webkit-transform: rotate(-405deg); -ms-transform: rotate(-405deg); transform: rotate(-405deg); }
/*　ドロワーメニュー */
#menu{
color:#e632e4;
position: fixed;
width:170px;
height:320px;
font-weight: bold;
display: none;
left: 10px;
top: 90px;
line-height:1.9;

list-style-type: none;
background-color: rgba(097, 102, 107, 0.8);
border: 0px solid #000;
padding: 20px 20px 0px 20px;
z-index: 9999;
}
/*by misallychan.com*/
/*　ここまで　ドロワーメニュー */
/* リンク部分のデザイン用 */
a{
	color:#ffffff;
	font-size:90%;
}
a:link{
	color:#ffffff;
	font-size:90%;
}
a:hover{
	color:#ffffff;
	font-size:90%;
}
a:visited{
	color:#ffffff;
	font-size:90%;
}
}