BODY {
     margin:0px;          /* ページ全体のmargin */
     padding:0px;         /* ページ全体のpadding */
     text-align:center;   /* 下記のautoに未対応用のセンタリング */
      font-family: 'Meiryo UI',sans-serif; font-size: 16px; line-height:150%; color: #333333;
background-color:#000000;
}

a.linklink{
MARGIN:auto;
display:block;
width:900px;
color: #000000;
padding-top:10px;
padding-bottom:10px;
text-align:center;
border:2px solid;
border-color:#666666;
background:#FFFFFF;
}

a.linklink:hover{
color: #FF0000;
}


/*pc_cssここから*/

@media screen and (min-width:768px){

.toumei{

  animation: fadeIn 5s ease 0.3s infinite normal;

}

@keyframes fadeIn { /*animetion-nameで設定した値を書く*/

  0% {opacity: 1} /*アニメーション開始時は不透明度0%*/

  50% {opacity: 0.4} /*アニメーション終了時は不透明度100%*/

  100% {opacity: 1} /*アニメーション終了時は不透明度100%*/

}

.kaiten{
  animation:5s linear 1 rotation1;
}

@keyframes rotation1{
  0%{ transform:rotateY(0);}
  100%{ transform:rotateY(360deg); }
}

.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

h1 {
  font-size: 200%; /* 文字サイズを15px */
  color: #ffffff;/* 文字色を#FF99CC */
  MARGIN-left: 0px;
  MARGIN-top: 50px;
  MARGIN-bottom: 10px;
    text-shadow    : 
       2px  2px 1px #003366,
      -2px  2px 1px #003366,
       2px -2px 1px #003366,
      -2px -2px 1px #003366,
       2px  0px 1px #003366,
       0px  2px 1px #003366,
      -2px  0px 1px #003366,
       0px -2px 1px #003366;   
}


h2 {
  font-size: 16px; /* 文字サイズを12px */
  color: #FFFFFF;/* 文字色を#FFFFFF */
  MARGIN-TOP: 5px;
}


h3 {
  font-size: 16px; /* 文字サイズを12px */
  color: #666666;/* 文字色を#666666 */
  MARGIN-LEFT: 5px;
  font-family: 'Meiryo UI',sans-serif;
}

p {
  font-size: 100%; /* 文字サイズを17px */
  color: #FFFFFF;/* 文字色を#666666 */
  MARGIN-TOP: 5px;
}



.alpha a:hover img {
  opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
}


img.history {
width: auto;
height: auto;
}

img {
width: 100%;
height: auto;
}


#box_header {
	WIDTH: 900px;
	MARGIN:auto;
	MARGIN-TOP: 10px;
	MARGIN-BOTTOM: 10px; 
}

.box_line {
	clear: both;
	WIDTH: 900px;
	MARGIN:auto;
	MARGIN-TOP: 10px;
	MARGIN-BOTTOM: 10px; 
	BORDER-TOP: #666666 1px dashed;
}

#pan {
	clear: both;
	WIDTH: 900px;
	MARGIN:auto;
}

#container {
	MARGIN:auto;
	MARGIN-TOP: 10px;
	width: 900px;
	max-width: 100%;
}

#navigation {
      float: none;
      width: 900px;
      max-width: 100%;
}

.contents01 {
clear: both;
	float: none;
	width: 900px;
	max-width: 100%;
	line-height:150%;
	background-color: #666666;
}

.contents02 {
	margin:auto;
	clear: both;
	float: none;
	width: 80%;
	max-width: 100%;
	line-height:150%;
	text-align:left;
	line-height:200%;
}

.contents03 {
	clear: both;
	float: none;
	width: 900px;
	max-width: 100%;
	line-height:150%;
	PADDING-TOP:10px
}

.contch00 {
	clear: both;
	float: none;
	width: 900px;
	max-width: 100%;
	line-height:150%;
	padding-TOP:10px;
	padding-bottom:5px;
}

.contch01 {
	clear: both;
	float: LEFT;
	width: 300px;
	height: 284px;
	border-right:1px dashed;
	border-color:#666666;
}

.contch02 {
	MARGIN-Left:301px;
	padding-LEFT:10px;
	width: 580px;
	line-height:150%;
}




.conthis00 {
	clear: both;
	float: none;
	width: 900px;
	max-width: 100%;
	line-height:150%;
	padding-TOP:10px;
}

.conthis01 {
	clear: both;
	float: LEFT;
	width: 300px;
	height: 420px;
	border-right:1px dashed;
	border-color:#666666;
}

.conthis02 {
	MARGIN:auto;
	width: 900px;
	line-height:150%;
}

#box_footer {
	clear: both;
	WIDTH: 900px;
	MARGIN:auto;
	MARGIN-TOP: 10px;
	MARGIN-BOTTOM: 10px;
	PADDING-TOP: 0px;
	PADDING-LEFT: 0px;
	PADDING-BOTTOM:0px;
	font-size: 100%; color: #001a43;
	line-height:150%;
}

#box_contents{
	
        BORDER-TOP: #666666 1px dashed;
	WIDTH: 70%; 
	PADDING-TOP: 0px;
	PADDING-BOTTOM: 0px
	PADDING-LEFT: 5px;
	MARGIN-BOTTOM: 10px;
	font-size: 90%; color: #666666;
	line-height:150%;
}

}

/*モバイルcss*/

@media screen and (max-width:767px){

.toumei{

  animation: fadeIn 5s ease 0.3s infinite normal;

}

@keyframes fadeIn { /*animetion-nameで設定した値を書く*/

  0% {opacity: 1} /*アニメーション開始時は不透明度0%*/

  50% {opacity: 0.4} /*アニメーション終了時は不透明度100%*/

  100% {opacity: 1} /*アニメーション終了時は不透明度100%*/
}

.kaiten{
  animation:5s linear 1 rotation1;
}

@keyframes rotation1{
  0%{ transform:rotateY(0);}
  100%{ transform:rotateY(360deg); }
}


.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

h1 {
  font-size: 150%; /* 文字サイズを15px */
  color: #ffffff;/* 文字色を#FF99CC */
  MARGIN-left: 0px;
  MARGIN-top: 50px;
  MARGIN-bottom: 10px;
    text-shadow    : 
       2px  2px 1px #003366,
      -2px  2px 1px #003366,
       2px -2px 1px #003366,
      -2px -2px 1px #003366,
       2px  0px 1px #003366,
       0px  2px 1px #003366,
      -2px  0px 1px #003366,
       0px -2px 1px #003366;   
}


h2 {
  font-size: 90%; /* 文字サイズを12px */
  color: #FFFFFF;/* 文字色を#FFFFFF */
  MARGIN-TOP: 5px;
}


h3 {
  font-size: 90%; /* 文字サイズを12px */
  color: #666666;/* 文字色を#666666 */
  MARGIN-LEFT: 5px;
  font-family: 'Meiryo UI',sans-serif;
}

p {
  font-size: 90%; /* 文字サイズを17px */
  color: #FFFFFF;/* 文字色を#666666 */
  MARGIN-TOP: 5px;
}

a{/*リンクされた文字*/
    color:#666666;
    font-style:normal;
    text-decoration:underline;
}

a:hover {/*マウスをのせたとき*/
    color:#001a43;
    font-style:normal;
    text-decoration:underline;
}

.alpha a:hover img {
  opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
}

a.linklink{
MARGIN:auto;
display:block;
width:100%;
color: #000000;
padding-top:10px;
padding-bottom:10px;
text-align:center;
border:2px solid;
border-color:#666666;
background:#FFFFFF;
}

a.linklink:hover{
color: #FF0000;
}


img{
width: 100%;
height: auto;
}


#pan {
	clear: both;
	WIDTH: 100%;
	MARGIN:auto;
}

#box_header {
	WIDTH: 100%;
	MARGIN:auto;
	MARGIN-TOP: 10px;
	MARGIN-BOTTOM: 10px;
}

.box_line {
	clear: both;
	WIDTH: 100%;
	MARGIN:auto;
	MARGIN-TOP: 10px;
	MARGIN-BOTTOM: 10px; 
	BORDER-TOP: #666666 1px dashed;
}

#container {
	MARGIN:auto;
	MARGIN-TOP: 10px;
	width: 100%;
	max-width: 100%;
}

#navigation {
      float: none;
      width: 100%;
      max-width: 100%;
}

.contents01 {
clear: both;
	float: none;
	width: 100%;
	max-width: 100%;
	line-height:150%;
	background-color: #666666;
}

.contents02 {
	clear: both;
	float: none;
	MARGIN:auto;
	width: 80%;
	max-width: 100%;
	line-height:150%;
	text-align:left;
}

.contents03 {
	clear: both;
	float: none;
	width: 90%;
	max-width: 100%;
	line-height:150%;
	PADDING-TOP:10px
}

.contch00 {
	clear: both;
	float: none;
	MARGIN:auto;
        width: 100%;
	max-width: 100%;
	line-height:150%;
	padding-TOP:10px;
	padding-bottom:5px;
}

.contch01 {
	clear: both;
	float: LEFT;
	width: 30%;
	border-color:#666666;
}

.contch02 {
	clear: both;
	width: 100%;
	line-height:150%;
	border-bottom:1px dashed;
}




.conthis00 {
	clear: both;
	float: none;
	MARGIN:auto;
	width: 95%;
	max-width: 100%;
	line-height:150%;
	padding-TOP:10px;
}

.conthis01 {
	clear: both;
	float: LEFT;
	width: 30%;
	height: auto;
	border-color:#666666;
}

.conthis02 {
	clear: both;
	width: 100%;
	line-height:150%;
	border-bottom:1px dashed;

}

#box_footer {
	clear: both;
	WIDTH: 90%;
	MARGIN:auto;
	MARGIN-TOP: 10px;
	MARGIN-BOTTOM: 10px;
	PADDING-TOP: 0px;
	PADDING-LEFT: 0px;
	PADDING-BOTTOM:0px;
	font-size: 100%; color: #001a43;
	line-height:150%;
}




#box_contents{
	
        BORDER-TOP: #666666 1px dashed;
	WIDTH: 70%; 
	PADDING-TOP: 0px;
	PADDING-BOTTOM: 0px
	PADDING-LEFT: 5px;
	MARGIN-BOTTOM: 10px;
	font-size: 90%; color: #666666;
	line-height:150%;
}


}
/*モバイルボディここまで*/