@charset "UTF-8";

*{
  margin: 0;
}

.logo img{
	background-color: rgba(0, 0, 0, 0.5);
	border-width: 1px;
	border-style: solid;
	border-color: black;
}

.logo img:hover{
	background-color: rgba(0, 255, 0, 0.5);
}


body{
	color: silver;
	background-image: url(ph3/achi2.jpg);
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: center center;/* 背景画像をbody要素に表示 */
	background-size: cover;/* 背景画像をbody要素にフィット */
	background-color: black;
	font-family: メイリオ;
}
h1{
  margin-top: 10px;
  margin-left: 60px;
  margin-right: 30px;
  margin-bottom: 10px;
}
div#content{
  margin-left: auto;
  margin-right: auto;
  max-width: 1000px;
}

div#content a img{
     box-shadow: 5px 5px 5px rgb(0,0,0);
}

div#content p{
	font-size: 15px;

}
div#msg1{
	border-top-left-radius: 10px 10px;
	border-top-right-radius: 10px 10px;
	border-bottom-right-radius: 10px 10px;
	border-bottom-left-radius: 10px 10px;
	text-align: center;
	margin-top: 50px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 100px;
	border-width: 1px;
	border-style: solid;
	border-color: black;
       box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
}

div#msg1:hover{
	background-color: rgba(243, 243, 243, 0.3);
}

div#msg1 img{
	margin-top: 5px;
	margin-left: 5px;
	margin-right: 5px;
	margin-bottom: 10px;
	border-width: 3px;
	border-style: solid;
	border-color: white;
	border-top-left-radius: 0px 0px;
	border-top-right-radius: 0px 0px;
	border-bottom-right-radius: 50px 50px;
	border-bottom-left-radius: 50px 50px;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}

div#msg1 img:hover{
	border-color: maroon;
	border-top-left-radius: 50px 50px;
	border-top-right-radius: 50px 50px;
	border-bottom-right-radius: 0px 0px;
	border-bottom-left-radius: 0px 0px;
}

p#sura{
	margin-top: 25px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	display: block;
	max-width: 910px;
	color: #111111;

 background: -moz-linear-gradient(top,#fdfdfd 0,#d1d1d1 100%);
 background: -webkit-linear-gradient(top,#fdfdfd 0,#d1d1d1 100%);
 background: -o-linear-gradient(top,#fdfdfd 0,#d1d1d1 100%);
 background: -ms-linear-gradient(top,#fdfdfd 0,#d1d1d1 100%);

	padding-top: 0px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
}

p#sura a{
	font-size: 24px;

	text-decoration: none;
	border-width: 1px;
	border-style: solid;
	border-color: black;
	color: black;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0px;

	padding-top: 3px;
	padding-left: 3px;
	padding-right: 3px;
	padding-bottom: 3px;
	display: block;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}

#sura a:hover{
	background-color: black;
	color: white;
}

div#msg2 img {
	width: 100%;
	height: 100%;
}

div#fut{
	bottom: 0px;
	z-index: 99;
	width: 100%;
	padding-top: 10px;
	background-color: rgba(255, 141, 0, 0.2);
	background-image: none;
	background-repeat: no-repeat;
	background-position: center top;
	box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.5);
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: black;
	padding-left: 2%;
	padding-right: 2%;
	padding-bottom: 10px;

}
div#fut p{
	color: white;
	padding-top: 5px;
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	display: block;
	font-family: メイリオ;
}

div#fut p a{
	color: white;
	display: inline-block;
      text-shadow: 2px 2px 2px #000;
}

div#fut p a:visited{
	color: white;
}

div#fut p a.sp{
      display: none;
}

div#fut img{
	box-shadow: 8px 8px 8px rgba(0, 0, 0, 0.5);
	vertical-align: middle;
	margin-right: 5px;
	margin-top: 5px;
}



.on{
  visibility: visible;
}
.off{
  visibility: hidden;
}
div#phlist{
	display: none;
}


/* ウィンドウ幅が0〜799pxの場合に適用するCSS */
@media screen and ( max-width:799px )
{

  div#msg1 {
   display: none;
   }

   div#fut p a.pc{
   display: none;
   }

   div#fut p a.sp{
   display: inline-block;
   color: #b9e4ff;
   }

}

#test{
     color: blue;
}

/* ウィンドウ幅が800px以上の場合に適用するCSS */
@media screen and ( min-width:800px )
{

  div#msg2 {
   display: none;
   }

}