html { height:100%; }

body{height: 100%;}



a{
    color:#808080;
    font-style:normal;
    text-decoration:underline;
}

a:hover {
    color:#999999;
    font-style:normal;
    text-decoration:underline;
}

a.linklink{
MARGIN-left:0px;
MARGIN-top:5%;
color:#808080;
display:block;
width:90%;
padding-top:10%;
padding-bottom:13%;
text-align:center;
border-width : 1px 1px 1px 1px;
border-style: solid;
border-color:#808080;
background:#FFFFFF;
text-decoration: none;
transform: rotate(0deg);
transform-origin: center center;
transition: transform .5s;
}


a.linklink::before
{
  content:"▷";
  color:#808080;
  background:none;
  border:0px solid ;
  border-color:#808080;
  text-decoration: none;
  font-size: 150%;/* コメント*/
  }

a.linklink:hover::before
{
  content:"▶︎";
  color:#FFFFFF;
  background:none;
  border:0px solid ;
  border-color:#808080;
  text-decoration: none;
  font-size: 150%;/* コメント*/
  }


a.linklink:hover{
color:#FFFFFF;
background:#c0c0c0;
border-width : 0px 0px 1px 1px;
border-color:#808080;
text-decoration: none;
transform: rotate(-1deg);
transform-origin: center center;
transition: transform .3s;
}

img.outn{
 width:100%; height:auto;
 filter: opacity(50%);
}



/*pc_cssです*/

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






BODY {
  font-family: "Noto Sans JP", sans-serif;
	background-image: none;
	background-repeat: none;
  color: #808080;
	letter-spacing: 0.1em;
	MARGIN:0;
}


.rotate {
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}



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





h1 {
  font-size: 150%; /* コメント*/
  color: #808080;/* コメント*/
  MARGIN: auto;
  MARGIN-TOP: 0%;
  width: 90%;
  border: #808080 solid 0px;
  border-left: none;
  border-right: none;
  border-bottom:none;
  PADDING-TOP: 0px;
  PADDING-BOTTOM: 50px;
}



h2 {
  font-size: 90%;/* コメント*/
  color: #808080;/* コメント*/
  margin-bottom: 10%;
}

h2.tate {
  font-size: 90%;/* コメント*/
  color: #808080;/* コメント*/
  MARGIN: AUTO;
  writing-mode: vertical-rl;
}


h2.tdd {
  font-size: 90%;/* コメント*/
  color: #808080;/* コメント*/
  margin-bottom: 10%;

}

h3{
  font-size: 90%; /* コメント*/
  color: #808080;/* コメント*/
  MARGIN: AUTO;

}

h3.ft{
  font-size: 90%; /* コメント*/
  color: #808080;/* コメント*/
  writing-mode: vertical-rl;
  height: 30%;
}


img.aaa{
	width :50%; height:auto;
}


.box_contents1{
	clear:both;
	BORDER-TOP: #F0F0F0 0px solid;
  border-bottom:#808080 1px solid;
  border-left:#F0F0F0 0px solid;
  border-right: #808080 1px solid;
	WIDTH: 50%;
  HEIGHT: auto; 
	PADDING-TOP: 0%;
	PADDING-BOTTOM: 5%;
	PADDING-RIGHT: 2%;
	PADDING-LEFT: 2%;
	MARGIN:1%;
	MARGIN-TOP: 2%;
	MARGIN-BOTTOM: 2%;
}

.top_contents1{
	clear:both;
	BORDER-TOP: #808080 0px solid;
        border-bottom:#808080 0px solid;
        border-left:#808080 0px solid;
        border-right:#808080 0px solid;
	WIDTH: 50%;
        HEIGHT: auto; 
	PADDING-TOP: 0;
	PADDING-BOTTOM: 0;
	PADDING-RIGHT: 0;
	PADDING-LEFT: 0;
	MARGIN:1%;
	MARGIN-TOP: 0;
	MARGIN-BOTTOM:0;
}



.ft_contents1{
  clear:both;
	BORDER-TOP: #808080 0px solid;
  border-bottom:#808080 0px solid;
  border-left:#808080 1px solid;
  border-right:#808080 0px solid;
  vertical-align:middle;
	WIDTH: 50%;
  HEIGHT: 100vh; 
	PADDING-TOP: 2%;
	PADDING-BOTTOM: 0%;
	MARGIN-TOP: 5%;
	MARGIN-BOTTOM: 5%;
}


*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

table {
  border-collapse: collapse;
  width: 90%;
  table-layout: fixed;
  display: table;
}

table th {
  background-color: none;
  text-align: center;
  padding: 0%;
  width: 30%;
  border-top: 1px solid #808080;
  border-bottom: 1px solid #808080;
}

table td {
  background-color: none;
  text-align: left;
  padding: 5%;
  width: 70%;
  border-bottom: 0px solid #808080;
  border-right: 1px solid #808080;
  
}


#outnavi {
  position: fixed;
  right: 0;
  top: 0;
  padding-right: 0px;
  padding-bottom: 0px;
  width: 5%;
  height: auto;
  z-index: 1;
}


#guy {
  position: fixed;
  right: 0px;
  bottom: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  width: 35%;
  height: auto;
  z-index: 1;
}

#guy img {
  width: 100%;
  height: auto;
  vertical-align: baseline;
}

#kuji {
  position: fixed;
  left: 55%;
  top: 2%;
  padding-right: 5px;
  padding-bottom: 0px;
  width: 33%;
  height: auto;
  z-index: 1;
}

#kuji img {
  width: 100%;
  height: auto;
  -webkit-transform: rotate(0deg);/* コメント*/
  -moz-transform: rotate(0deg);/* コメント*/

  vertical-align: baseline;
}



}/* コメント*/


/* コメント、ここからスマホ*/

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

  html{
    height: 100%;
  }
        
  
  BODY {
    background-image: none;
    background-repeat: none;
    font-family: "Noto Serif JP", serif;
    font-family: "Noto Sans JP", sans-serif;
    height: 100%;
    color: #808080;
    letter-spacing: 0.1em;
    MARGIN:0;
  }


  a.linklink{
    MARGIN-left:0px;
    MARGIN-top:5%;
    color:#808080;
    display:block;
    width:90%;
    padding-top:10%;
    padding-left:5%;
    padding-bottom:12%;
    text-align:left;
    border-width : 0px 0px 0px 1px;
    border-style: solid;
    border-color:#808080;
    background:none;
    text-decoration: none;
    transform: rotate(0deg);
    transform-origin: center center;
    transition: transform .5s;
    }

    a.linklink::before
{
  content:"▷";
  color:#808080;
  background:none;
  border:0px solid ;
  border-color:#808080;
  text-decoration: none;
  font-size: 150%;/* コメント*/
  }

a.linklink:hover::before
{
  content:"▶︎";
  color:#808080;
  background:none;
  border:0px solid ;
  border-color:#808080;
  text-decoration: none;
  font-size: 150%;/* コメント*/
  }
  
    a.linklink:hover{
      color:#808080;
      /*
      background: linear-gradient(45deg, #d558c8 1%, #24d292 100%);
      コメント*/
      background:#FFFFFF; 
      filter: opacity(45%);

      border-width : 0px 0px 0px 1px;
      border-color:#808080;
      text-decoration: none;
      transform: rotate(-1deg);
      transform-origin: center center;
      transition: transform .3s;
      }





.rotate {
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}


h1 {
  font-size: 120%;/* コメント*/ 
  color: #808080;/* コメント*/
  MARGIN-TOP: 0px;
  MARGIN-bottom: 20px;
  width: 90%;
  BORDER-TOP: #808080 1px solid;
  border-left: yellow 0px;
  border-bottom:#808080 0px solid;
  PADDING-TOP: 5%;
  PADDING-BOTTOM: 5%;
}

h2 {
  font-size: 60%;/* コメント*/
  color: #808080;/* コメント*/
  MARGIN-TOP: 2%;
  line-height:200%;
}

h2.tate {
  font-size: 90%;/* コメント*/
  color: #808080;/* コメント*/
  margin: auto;
  writing-mode: vertical-rl;
}

h2.tdd {
  font-size: 90%;/* コメント*/
  color: #808080;/* コメント*/
  MARGIN-TOP: 20px;
}

h3 {
  font-size: 90%;/* コメント*/
  color: #808080;/* コメント*/
}

h3.ft{
  font-size: 90%;/* コメント*/
  color: #808080;/* コメント*/
  writing-mode: vertical-rl;
}

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

img.aaa{
	width :50%; height:auto;
	margin: 0px;
}

img.bbb{
	width :auto; height:70%;
}

img.edu2{
width:100px;
height:auto;
}
	
.box_contents1{
	align: left;
  clear:both;
	BORDER-TOP: #808080 0px solid;
  border-bottom: #808080 0px solid;
  border-left:#808080 0px solid;
  border-right:#808080 0px solid;
	WIDTH: 98%;
        HEIGHT: auto; 
	PADDING-TOP: 5%;

  PADDING-BOTTOM: 0%;
	MARGIN:auto;
	MARGIN-TOP: 5%;
	MARGIN-BOTTOM: 15%;
}

.top_contents1{
	clear:both;
	BORDER-TOP: #808080 1px solid;
        border-bottom:#808080 0px solid;
        border-left:#808080 1px solid;
        border-right:#808080 0px solid;
	WIDTH: 100%;
        HEIGHT: auto; 
	PADDING: 0px;
	MARGIN-TOP: 5px;
	MARGIN-BOTTOM:0px;
}

.ft_contents1{
  clear:both;
	BORDER-TOP: #808080 0px solid;
  border-bottom: #808080 0px solid;
  border-left:#808080 0px solid;
  border-right:#808080 0px solid;
	WIDTH: 98%;
  HEIGHT: 100vh; 
	PADDING-TOP: 5%;
  PADDING-BOTTOM: 0%;
	MARGIN:auto;
	MARGIN-TOP: 5%;
	MARGIN-BOTTOM: 15%;
}

*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

table {
  border-collapse: collapse;
  width: 90%;
}
table th,
table td {
  padding: 10px;
  border: 0px solid #808080;
}

table th {
  background-color: none;
  text-align: center;
  width: 30%;
  border-top: 1px solid #808080;
  border-bottom: 1px solid #808080;
}

table td {
 
  border-top: 0px solid #808080;
  border-bottom: 0px solid #808080;
}

#outnavi {
  position: fixed;
  right: 0;
  top: 0;
  padding-right: 5px;
  padding-top: 5px;
  width: 10%;
  height: auto;
  z-index: 1;
}

#guy {
  position: fixed;
  right: 0;
  bottom: 0;
  padding-right: 0px;
  padding-bottom: 0px;
  width: 25%;
  height: auto;
  z-index: 1;
}

#guy img {
  width: 100%;
  height: auto;
  vertical-align: baseline;
  filter: opacity(100%);
}

#kuji {
  position: fixed;
  left: 5%;
  top: 1%;
  padding-right: 5px;
  padding-bottom: 0px;
  width: 33%;
  height: auto;
  z-index: 1;
  background-color: #ffffff;
}

#kuji img {
  width: 100%;
  height: auto;
  vertical-align: baseline;
  -webkit-transform: rotate(0deg);/* コメント*/
  -moz-transform: rotate(0deg);/* コメント*/
}

}/* コメント*/