@charset "utf-8";

body,figure,h1,h2,h3,h4,h5,h6,li,ol,p,ul{
margin:0;padding:0
}

a,body{
color:#FFF
}

#topimg,img{
height:auto
}

p,ul.newsbox li{
word-break:break-all
}



a:hover,footer a{
text-decoration:none
}

.c,footer,h2{
text-align:center
}

body{
overflow:hidden;
font:14px/2 Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
background:url(../images/back.jpg);
 background-position: center center;

  background-repeat: no-repeat;

  background-attachment: fixed;

  background-size: cover;

  background-color: #000000;
}

#PC-menu,#menu{
font-weight:700
}

h2{
width:95%
}

h4{
position:center
}

ul{
list-style-type:none
}

img{
border:none;
vertical-align:bottom;
max-width:100%
}

html{
overflow:auto
}

i{
color:#e6e6fa
}

span{
margin-left:10px;
font-weight:700;
font-size:16px;
}

a:hover{
color:#fff100
}

#container{
width:100%;
margin:0 auto
}

#top-head{
line-height:1;
z-index:999;
position:fixed;
margin:0 -200%;
padding:0 200%;
height:110px;
background:linear-gradient(to bottom,rgba(0,0,0,.9),rgba(0,0,0,.9),rgba(0,0,0,0))
}

#top-head .logo{
padding-top:10px;
padding-left:20px;
width:10%;
min-width:90px
}

#main,#topimg{
padding-top:50px
}

#PC-menu{
display:inline-block;
margin-top:-25px;
padding-left:150px;
position:fixed
}

#PC-menu ul li{
display:inline-block;
padding-right:20px
}

#menu{
font-size:18px
}

.mobile-menu{
display:none
}

.navToggle{
display:none
}

#topimg{
width:50%;
  margin: 0 auto;
}

#main{
width:800px;
margin-top:-10px;
padding-bottom:30px;
margin-right:auto;
margin-left:auto;

}

#main h2{
clear:both;
margin:0 auto;
font-size:160%;
color:#fff;
background:rgba(10,10,10,.6);
padding:5px;
border-radius:1px;
-webkit-box-shadow:0 0 5px #dda0dd;
box-shadow:0 0 5px #dda0dd
}

#main h2 a{
display:block;
padding-top:100px;
margin-top:-100px
}

#main p{
padding:.5em 15px 1em
}

#main p+p{
padding-top:0
}

#main h2+p,#main h3+p{
padding-top:0;
margin-top:-5px
}

#main h4{
font-size:110%;
color:#fff;
background:#000;
padding:0 15px
}

#main h5{
clear:both;
font-size:150%;
background:linear-gradient(to right,rgba(51,51,51,.9),rgba(101,101,101,.1))
}

ul.newsbox li{
display:block;
background:linear-gradient(to right,rgba(101,101,101,.9),rgba(101,191,191,.1));
padding:10px;
font-size:12px;
margin-bottom:1px;
color:#fff
}

#main .member{

  margin: 0 auto;
  width: 800px;
line-height:50%;
}

ul.prof li{
margin-top:15px;
margin-left:10px;
line-height:150%;

}




#main .member ul.prof{
overflow:hidden;
background:linear-gradient(to right,rgba(101,101,101,.9),rgba(101,191,191,.1))
}

#main :after{
display:block;
clear:both;
content:""
}

footer{
clear:both;
padding-top:15px;
padding-bottom:15px
}





.r{
text-align:right
}

.c{
text-align:center
}

.big{
font:bold large;
margin-right:110px
}





@media (max-width:1025px){

body::before {
content: "";
background: url(../images/backmini.jpg) no-repeat center top;
background-size: cover;

display: block;
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
z-index: -1;
}

#container{
width:auto;
margin:0
}

#PC-menu{
display:none
}

.mobile-menu{
display:inherit
}




nav.mobile-menu {
position: fixed;
    z-index: 2;
    top: 0;
    left: 0;

    color: #000;
    text-align: center;
    transform: translateY(-100%);
    transition: all 0.6s;
    width: 100%;
}
 
nav.mobile-menu ul {
    background: rgba( 200, 0, 0, 0.55 );
    margin: 0 auto;
    padding: 0;
    width: 100%;
}
 
nav.mobile-menu ul li {
    font-size: 1.2em;
    list-style-type: none;
    padding: 0;
    width: 100%;
    border-bottom: 1px dotted #333;
}
 
/* 最後はラインを描かない */
nav.mobile-menu ul li:last-child {
    padding-bottom: 0;
    border-bottom: none;
}
 
nav.mobile-menu ul li a {
    display: block;
    color: #FFF;
    padding: 1em 0;
}
 
/* このクラスを、jQueryで付与・削除する */
nav.mobile-menu.active {
    transform: translateY(0%);
}

nav.mobile-menu a {
  padding: 0 .3em;
  transition: all .3s;
}
nav.mobile-menu a:hover {
  color: #fff;
  background-color: rgba( 85,00, 0, 0.95 );
}



.navToggle {
    display: block;
    position: fixed;    /* bodyに対しての絶対位置指定 */
    right: 13px;
    top: 12px;
    width: 42px;
    height: 51px;
    cursor: pointer;
    z-index: 3;
    text-align: center;
}
 
.navToggle span {
    display: block;
    position: absolute;    /* .navToggleに対して */
    width: 30px;
    border-bottom: solid 3px #eee;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
    left: 6px;
}
 
.navToggle span:nth-child(1) {
    top: 9px;
}
 
.navToggle span:nth-child(2) {
    top: 18px;
}
 
.navToggle span:nth-child(3) {
    top: 27px;
}
 
.navToggle span:nth-child(4) {
    border: none;
    color: #eee;
    font-size: 9px;
    font-weight: bold;
    top: 34px;
}


/* 最初のspanをマイナス45度に */
.navToggle.active span:nth-child(1) {
    top: 18px;
    left: 6px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
 
/* 2番目と3番目のspanを45度に */
.navToggle.active span:nth-child(2),
.navToggle.active span:nth-child(3) {
    top: 18px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}



#contents{
padding:0;
margin:180px 15px
}

#main{

width:auto
}

#main .member{
width:auto;
margin:0
}



}