@charset "Shift_JIS";
*{
  margin: 0 ;
}
body{
	font-family: メイリオ;
	background-image: none;
	background-position: center top;
	background-color: white;
	background-repeat: repeat;
}

ul{
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
}

div#ttop{
  background-color: black;
  height: 5px;

}
div#ttop h4{
  visibility: hidden;
}
div#top{
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	color: #dfdfdf;
	height: 80px;


}
div#logo{
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

div#logo a img{
    box-shadow: 5px 5px 5px rgb(254, 248, 167);
}

div#top_b{
  height: 80px;
  margin-top: 0px;
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
}

div#top_b h1{
     text-shadow: 2px 2px 2px #000;
}

div#top_b h4{
  font-size: 14px;
 /*
  font-family: メイリオ;
 */
}
div#top a:hover{
  transform: rotate(5deg);
}
div#menu{
  max-width: 1000px;
  margin-top: 20px;
  margin-right: auto;
  margin-bottom: 20px;
  margin-left: auto;
  box-shadow: 0px 8px 8px rgba(0,0,0,0.5);
}
div#menu a:hover{
  filter:alpha(opacity=70);
  /* IE透明度 */
       -moz-opacity:0.70;
  /* Firefox・Netscape透明度 */
       opacity:0.70;
/* Opera・Safari透明度 */
}
div#menu1{
	max-width: 1000px;
	overflow: hidden;
	background-color: rgba(255, 255, 255, 0.7);
	color: black;
	border-width: 1px;
	border-style: solid;
	border-color: black;
	line-height: 1.5;
	padding-bottom: 20px;
}
div#menu1 p{
	font-size: 25px;/*
  font-family: メイリオ;
 */
	text-align: center;
	margin-top: 30px;
	padding-left: 20px;
	padding-right: 20px;
}

div#menu1 p img{
	width: 100%;
}

div#profout{
	background-image: none;
	background-repeat: repeat-x;
	background-position: center top;

}
div#prof{
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 30px;
	max-width: 940px;
	color: #171717;

	background-color: rgba(245, 245, 245, 0.8);
	box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.5);
	border-width: 1px;
	border-style: solid;
	border-color: black;
	line-height: 1.5;
	padding-left: 3%;
	padding-right: 3%;
      overflow: hidden;
}
div#prof h1{
     padding-top: 10px;
     padding-left: 0px;
     padding-right: 0px;
     padding-bottom: 10px;
     text-align: center;
     margin-left: 0px;
     font-size: 200%;
     margin-top: 20px;
     margin-bottom: 10px;
     margin-right: 0%;
     border-width: 0px;
     border-style: solid;
     border-color: black;
     background-color: white;
}
div#prof h2{
	padding-top: 10px;
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	border-left-width: 5px;
	border-bottom-width: 1px;
	border-left-style: solid;
	border-bottom-style: solid;
	border-left-color: black;
	border-bottom-color: black;
	margin-bottom: 5px;
	margin-left: 0%;
	margin-right: 0%;
     text-shadow: 2px 2px 2px #fff;
}


div#prof #logo{
  background-repeat: no-repeat;
  background-position: center top;
  /*
  background-image : url(images/kabe2s.jpg);
  */
	-webkit-transition: all 1s;
  -moz-transition: all 1s;
  -ms-transition: all 1s;
  -o-transition: all 1s;
  transition: all 1s;
  text-align: right;
}
div#prof #logo:hover{
  background-image: url(images/kabe2s.jpg);
  background-repeat: no-repeat;
  background-position: right top;
}
div#prof p{
	padding-top: 5px;
	padding-left: 15px;
	padding-right: 5px;
	padding-bottom: 5px;
	background-repeat: no-repeat;
	background-position: right bottom;
	margin-left: 5%;
	margin-right: 5%;
	font-size: 125%;
}
div#prof p#bl:hover{
  }
div#prof p#bl img{

  margin-left: 0px;
  border-radius: 5px;
  box-shadow: 0px 5px 5px rgba(0,0,0,0.5);
}



div#prof #msg{
  background-color: #808040;
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 5px;
  border-top-left-radius: 10px 10px;
  border-top-right-radius: 10px 10px;
  border-bottom-right-radius: 10px 10px;
  border-bottom-left-radius: 10px 10px;
}
div#prof a{
	color: black;
	text-decoration: none;
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 5px;
	margin-left: 18%;
	margin-right: 18%;
	border-width: 5px;
	border-style: outset;
	border-color: rgb(232, 178, 13);
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	display: block;
	text-align: center;
      border-radius: 10px;
     text-shadow: 2px 2px 2px #fff;

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

}
div#prof a:hover{
	/*border-color: blue;*/
}
div#zen{
  background-image: url(images/kawara.gif);
  background-repeat: repeat;
}
div#zen_out{
     margin-top: 0px;
     margin-right: auto;
     margin-bottom: 0px;
     margin-left: auto;
     border-width: 1px;
     border-style: solid;
     border-color: black white;/*height: 750px;*/
     background-repeat: no-repeat;
     box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.5);
     background-color: #f4e0c5;
     overflow: hidden;
     display: none;
}



div#zen_in{
  max-width: 1000px;

  margin-top: 0px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0px;
  box-shadow: 0px 8px 8px rgba(0,0,0,0.5);
  overflow: hidden;
}

div#page{
	max-width: 1000px;
}

div#page img{
	width: 100%;
}

div#page li{
	list-style-type: none;
	background-image: url(ph5s/bizen00.png);
	background-repeat: no-repeat;
	background-position: left top;/* 背景画像をhtml要素に表示 */
       background-size: 100%;
}



div#zen_in img{
  border-width: 1px;
  border-style: solid;
  border-color: white;
}
table#tb1{
  margin-top: 0px;
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  max-width : 800px;
  height : 43px;
}
table#tb1 a{
  width: 160px;
  height: 43px;
  text-decoration: none;
  display: block;
  font-size: 24px;
  color: white;
}
table#tb1 a:hover{
  color: black;
  background-color : white;
}
table#tb1 td{
  width: 160px;
  height : 43px;
  background-image: url(images/off.png);
  background-repeat: no-repeat;
  text-align: center;
  line-height: 2;
}
table#tb2 img{
  border-radius: 10px;
}
table#tb2{
  color: blue;
  margin-top: 2px;
  margin-bottom: 2px;
}
table#tb2 a{
  color: blue;
  text-decoration: none;
}
div#panel{
  border-width: 5px;
  border-style: ridge;
  border-color: white;
  border-radius: 10px;
  background-color: rgba(32, 32, 32, 0.5);
}
div#panel .b{
  border-width: 3px;
  border-style: ridge;
  border-color: black;
  padding-top: 5px;
  padding-left: 3px;
  padding-right: 3px;
  padding-bottom: 5px;
  font-size : 18px;
  background-color: white;
  border-radius: 10px;
  color: black;
}
div#panel .b:hover{
  padding-top: 10px;
  padding-bottom: 10px;
  color: white;
  background-color: rgb(47, 0, 0);
}
div#panel .c:hover{
  transform: rotate(20deg);
}
div#fut{
     bottom: 0px;
     z-index: 99;
     max-width: 1000px;
     background-color: #eeddcf;
     background-image: none;
     background-repeat: repeat;
     background-position: center top;
     box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.5);
     padding-top: 10px;
     padding-left: 1%;
     padding-right: 1%;
     padding-bottom: 10px;
     margin-left: auto;
     margin-right: auto;
     overflow: hidden;
}
div#fut p{
     color: black;
     padding-top: 5px;
     padding-left: 5px;
     padding-right: 5px;
     padding-bottom: 5px;
     display: block;
     text-shadow: 2px 2px 2px #fff;
     margin-bottom: 5px;
     line-height: 1;
     font-size: 150%;
}

div#fut p a{
	color: black;
	display: inline-block;
}

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

div#fut img{
     box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
     vertical-align: middle;
     margin-right: 5px;
     margin-bottom: 5px;
     padding-top: 0px;
     padding-left: 0px;
     padding-right: 0px;
     padding-bottom: 0px;
     margin-top: 5px;
     margin-left: 5px;
     border-width: 5px;
     border-style: outset;
     border-color: silver;
}


.in{
  position: relative;
  max-width: 800px;
  visibility: visible;
}
.in img{
  /*position:absolute;*/
  left:0;
  top:0;
}
.out{
  position: relative;
  max-width: 800px;
  visibility: hidden;
}
.in2{
  visibility: visible;
}
.out2{
  visibility: hidden;
}
div#logotougaku:hover{
  background-color: white;
}
.box_skitter{
  background: none;
}





.blinking{
-webkit-animation:blink 25s ease-in-out infinite alternate;
-moz-animation:blink 25s ease-in-out infinite alternate;
animation:blink 25s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
20% {
opacity:1;
}
30% {
opacity:0;
}
40% {
opacity:0;
}
50% {
opacity:1;
}
}
@-moz-keyframes blink{
20% {
opacity:1;
}
30% {
opacity:0;
}
40% {
opacity:0;
}
50% {
opacity:1;
}
}
@keyframes blink{
20% {
opacity:1;
}
30% {
opacity:0;
}
40% {
opacity:0;
}
50% {
opacity:1;
}
}



#img1.blinking {
    animation-delay: 3s;
    -webkit-animation-delay: 3s;
}

#img2.blinking {
    animation-delay: 6s;
    -webkit-animation-delay: 6s;
}

#img3.blinking {
    animation-delay: 9s;
    -webkit-animation-delay: 9s;
}

#img4.blinking {
    animation-delay: 12s;
    -webkit-animation-delay: 12s;
}

#img5.blinking {
    animation-delay: 15s;
    -webkit-animation-delay: 15s;
}

#img6.blinking {
    animation-delay: 18s;
    -webkit-animation-delay: 18s;
}

#img7.blinking {
    animation-delay: 21s;
    -webkit-animation-delay: 21s;
}





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

   }

  body{
   background-image: none;
   }

}


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



}