@charset "utf-8";

/* ******* 共通 ******* */
html {
    font-family:'メイリオ','Meiryo','ＭＳ Ｐゴシック', 'MS PGothic', sans-serif,'ヒラギノ角ゴシック', 'Hiragino Sans', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN';
    letter-spacing:0em;
    }
body {
    width:830px;
    background-color:white;
    font-size:12pt;
    margin-right:auto;
    margin-left:auto;
    }
header,nav,main,footer{
    text-align:center;
}
a{
    overflow:hidden;
}
.sp{
    display:none;
}

/* ******* header ******* */
header{
    margin-top:0.5rem;
    margin-bottom:-0.5rem;
    padding:0;
    overflow:hidden;
    position:relative;
}
header div{
    width:100%;
    margin:0;
}
header div.top{
    position:absolute;
    top:0;
    text-align:right;
    font-size:0.8rem;
    height:1rem;
}

header div>a{
    display:inline-block;
}
header div>a>img{
    height:100%;
}
div.top>a,div.top>a:visited{
    color:rgb(60,60,60);
}


/* ******* nav ******* */
nav{
    width:100%;
    margin-top:3px;
    height:40px;
}
nav img{
    width:87px;
    margin-right:5px;
}
nav img:last-of-type{
    margin-right:0;
}

/* ******* main ******* */
main>div{
    width:100%;
    text-align:left;
    overflow:hidden;
}
main>div:first-child{
    display:flex;
    flex-wrap:nowrap;
    justify-content:space-between;
    margin-bottom:1rem;
}
main>div>a{
	font-family:'Yu Mincho';
	font-size:1.5rem;
	color:black;
	text-decoration:none;
	font-weight:bold;
    text-align:center;
    width:30%;
}
main>div>a>img.pc{
    border:1px solid black;
    width:100%;
}

main>div>ul{
    display:block;
    width:530px;
    height:570px;
    overflow-y:scroll;
    background-color:#eeeeee;
    border:inset 2px gray;
    line-height:1.5rem;
    float:left;
    margin:0 30px 0 0;
    padding-top:0.5rem;
	padding-right:0.5rem;
	padding-left:0.5rem;
}
main li{
    list-style-type:none;
	padding-left:0.5rem;
	margin-bottom:1rem;
}
main ul>label{
    display:block;
    text-indent:-0.3rem;
}
main ul>label:before{
    content:"【";
}
main ul>label:after{
    content:"】\a";
    white-space:pre;
}

main>div span{
    color:red;
}
main>div>p{
    display:block;
    margin:0;
    padding:0;
    text-align:center;
}
main>div>p>a{
    display:inline-block;
    margin:0 20px;
}
main>div>p>a>img{
    max-width:230px;
    height:auto;
}
main iframe,div.twitter{
    display:block;
    width:250px;
    margin-left:0px;
    float:right;
}
main div.twitter{
    height:280px;
    overflow-y:scroll;
    border:none;
}

footer{
    border-top:1px solid black;
    margin-top:5px;
    line-height:1.5rem;
}
/*
@media screen and (max-width:830px){
    .pc{
        display:none;
    }
    body{
        width:80%;
    /    background-image:url("image/pcsp/back.gif");/

    }
    header,main,footer{
        background:white;
    }

    /header/
	header{
		height:auto;
	}
    header a.left{
        width:100%;
    }
    header a>img.sp{
        display:block;
        width:100%;
    }

    /navigation/
    nav.sp{
        display:block;
        width:100%;
        height:100px;
        position:fixed;
        top:10;
        right:10;
        text-align:right;
    }
    nav.sp>label>img{
        width:30px;
        height:30px;
        background-color:white;
        border-radius:5px;
    }
    nav.sp>input,nav.sp>div{
        display:none;
    }
    nav.sp>input:checked + div{
        display:block;
    }

    /main/
    main>div:first-child{
        flex-wrap:wrap;
        width:100%;
    }
    main>div>a{
        width:100%;
        text-align:center;
		margin-top:10%;	
    }
    main a>img.sp{
        display:block;
        width:100%;
    }
    main>div{
		margin-top:10%;
        text-align:left;
    }

    main>div>ul{
        display:block;
        text-align:left;
        width:100%;
        height:200px;
        overflow-y:scroll;
        margin-bottom:5px;
		padding-right:0rem;
		padding-left:0rem;
	}
	main li{
		list-style-type:none;
	}
	main ul>li:nth-child(2n){
		padding-left:1rem;
    }
    main>div>img{
        margin-left:0;
    }
    main iframe,main div.twitter{
        width:100%;
        height:300px;
        margin-top:10px;
        margin-left:auto;
        margin-right:auto;
    }
    /footer/
    footer{
        margin-top:10px;
    }

}*/