﻿@charset "UTF-8"; 

/*▼フォント類の基本セット。上が明朝系、下がゴシック系。どちらかは消すこと！▼*/ 
body {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
body {
	font-family: "游ゴシック", Arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Helvetica Neue,sans-serif;
}
/*▲フォント類の基本セット▲*/ 
/*▼背景と全体▼*/
html {
    font-size: 100%;
    background-color: #666666;
    font-family: 'M PLUS Rounded 1c', sans-serif;
}
#wrapper {
    margin: 0 auto;
    width: 1080px;
    background-color: #FFFFFF;
}
a, a:hover,
a h1, a h1:hover,
a img, a img:hover {
    transition-duration: 0.7s;
}
/*▲背景と全体▲*/ 

/*▼ヘッダー▼*/
header {
    background-color: #000;
    color: #FFF;
}
header a {
    text-decoration: none;
}
header a h1 {
    padding: 16px 16px 8px 16px;
    text-align: left;
    font-size: 32px;
    color: #FFF;
}
header a h1:hover {
    opacity: 0.7;
}
header img {
    vertical-align: bottom;
}
nav ul {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    padding: 8px;
}
nav ul li a {
    display: block;
    border-radius: 16px;
    padding: 16px;
    background-color: #333;
    font-size: 24px;
    font-weight: bold;
    letter-spacing: 2px;
    color: #FFF;
    text-decoration: none;
}
nav ul li a:hover {
    background-color: #AAA;
    color: #444;
}
#index nav ul li a.index,
#illust nav ul li a.illust,
#dict nav ul li a.dict,
#link nav ul li a.link {
    background-color: #FFF;
    color: #000;
}
/*▲ヘッダー▲*/

/*▼コンテンツブロック▼*/
#contents {
    display: flex;
    justify-content: space-evenly;
}
.bigbox,
.middlebox,
.littlebox {
    margin: 8px 0;
    box-sizing: border-box;
    border: #333399 4px solid;
	border-radius: 16px;
    padding: 16px;
}
.bigbox {
    width: 1064px;
}
.middlebox {
    width: 704px;
}
.littlebox {
    width: 344px;
}
.bigbox h3,
.middlebox h3,
.littlebox h3 {
    font-size: 20px;
    margin-bottom: 4px;
}
.bigbox section,
.middlebox section,
.littlebox section {
    margin-bottom: 16px;
    line-height: 1.5em;
}
/*▼メインブロック▼*/
main {
    background-color: #FFF;
}
main h2 {
    font-size: 24px;
    margin-bottom: 16px;
    border-radius: 12px;
    padding: 12px;
    width: fit-content;
    background-color: #444;
    color: #FFF;
}
main section p {
    text-indent: 1em;
    line-height: 1.5em;
}
/*▲メインブロック▲*/ 

/*▼サブ▼*/
aside {
    background-color: #CCCCCC;
}
aside section a img:hover {
    filter: brightness(200%)
}
/*▲サブ▲*/ 
/*▲コンテンツブロック▲*/

/*▼フッター▼*/
footer {
    padding: 16px;
    text-align: right;
    background-color: #000;
    color: #FFF;
}
/*▲フッターー▲*/ 


/*▼ タブレット対応 ▼*/ 

/*▲ タブレット対応 ▲*/ 

/*▼ デスクトップPC対応 ▼*/ 

/*▲ デスクトップPC対応 ▲*/

