*{
margin:0;
padding:0;
text-align:center;
font-family:"メイリオ","Hiragino Kaku Gothic ProN",sans-serif;
}
a img{
border:none;
}
img{
vertical-align:bottom;
max-width:100%;
}
li{
list-style-type: none;
}

body{
margin:0 auto;
background-color:transparent;
}

#container{/*jsで管理*/
/*position:absolute;
top:50%;
left:50%;
transform: translate(-50%, -50%);
width: 100%;*/
/*opacity:0;
display:none;*/
margin:0 auto;
width: 100%;
max-width:1200px;
display:none;
}

header{
position:relative;
z-index:1;
margin:0 auto 0 auto;
width:80%;
}
header .logo{
position:absolute;
bottom: 0%;
left: 26.5%;
width: 48%;
}

#content{
position:relative;
z-index:0;
margin:-14.5% auto 0 auto;
width:80%;
font-size:0;
}
#content .bg{
padding:0 7%;
background:url(images/entry_bg_pc.png) 50% 0% repeat-y;
background-size: contain;
}

#illust{
padding-top:13%;
}
#illust img{
border-radius:20px;
}

#link{
margin:2% auto 0 auto;
max-width: 100%;
}
#link ul{
display:table;
table-layout:fixed;
margin:0 auto;
width:100%;
}
#link li{
display:table-cell;
vertical-align:middle;
padding:0 2%;
}
#link li:nth-of-type(1), #link li:nth-of-type(3){
width:28%;
}
#link li:nth-of-type(2){
width:44%;
}

.mobile{
display:none;
}

.SPhover{
opacity: 0.7;
}


@media (max-width: 767px) {
header{
width:90%;
}
header .logo{
bottom: 0;
left: 9%;
width: 82%;
}
#content{
margin:-28% auto 0 auto;
width:90%;
}
#content .bg{
background:url(images/entry_bg.png) 50% 0% repeat-y;
background-size: contain;
}

#illust{
margin:0 auto;
padding-top:24%;
width:96%;
}

#link{
margin:4% auto 0 auto;
}
#link ul{
display:block;
width:85%;
}
#link li{
display:block;
}
#link li:nth-of-type(1), #link li:nth-of-type(2){
width:100%;
}
#link li:nth-of-type(3){
margin:4% auto 0 auto; 
width:70%;
}

.mobile{
display:inline;
}
}
