@charset "euc-jp";

section {
background:#FFF;
color:#677; text-align:center;
}
section > h1 {
background:linear-gradient(#012,#345);
color:#FFF; font-size:16px;
padding:16px;
}
section > h2 {
background:linear-gradient(#024,#039);
box-shadow:0 2px 4px #003 inset;
border-top:#699 solid 2px; border-bottom:#9CC solid 2px;
color:#FFF; font-size:18px; line-height:1; text-shadow:0 1px 2px #003;
padding:16px 32px 8px;
}
@media screen and ( max-width:480px ) {
section > h2 { font-size:14px; padding:8px 16px;}
}

/*↓メイン↓*/
.main img { width:100%; display:block;}
.main div {
position:relative;
background:linear-gradient(#012,#345);
text-shadow:0 1px 2px #011;
padding:16px 32px;
}
.main div:before {/* ぼかし */
position:absolute; left:0; right:0; bottom:100%;
height:32px;
background:linear-gradient(rgba(0,17,34,0),rgba(0,17,34,1));
content:'';
}
.main h2 { color:#FC0; font-size:24px;}
.main h3 { color:#FFF; font-size:16px; margin:8px 0 16px;}
.main p  { color:#CDD; font-size:20px;}
.main span { color:#F03; margin-left:0.5em;}
@media screen and ( max-width:480px ) {
.main div { padding:16px;}
.main h2 { font-size:18px;}
.main h3 { font-size:14px;}
.main p  { font-size:16px;}
}
/*↑メイン↑*/
/*↓購入↓*/
.store p:nth-of-type(1) { font-size:16px; line-height:1.5;}
.store p:nth-of-type(2) { font-size:14px; margin-top:16px;}
.store p span { color:#F03;}
.store ul {
display:flex; flex-wrap:wrap; justify-content:space-around;
margin:0 !important;
}
.store li {
width:288px;
line-height:1; text-align:center;
margin:16px 8px 0 !important;
}
.store li:before { content:'' !important;}
.store li img {
display:block;
width:100%;
margin:0 auto 16px;
}
.store li:nth-of-type(1) h3 { border-color:#E68;}
.store li:nth-of-type(2) h3 { border-color:#1AF;}
.store a {/* 購入ボタン */
display:block;
background:linear-gradient(#F90,#F33);
box-shadow:0 0 4px #F33 inset,0 2px 4px #011;
border:solid 2px #FFF; border-radius:8px;
color:#FFF !important; font-size:24px; text-decoration:none !important;
padding:0.5em;
}
@media screen and ( max-width:768px ) {
.store p:nth-of-type(1) { font-size:14px;}
.store p:nth-of-type(2) { font-size:12px;}
.store a { font-size:18px;}
}
/*↑購入↑*/
/*↓仕様↓*/
.detail {
display:flex; flex-wrap:wrap;
font-size:14px; line-height:1.25;
}
.detail *:nth-child(n+3) { margin-top:0.5em;}
.detail dt {
position:relative;
width:25%;
color:#39C; text-align:right;
padding-right:1em;
}
.detail dt:after { position:absolute; right:0; top:0; content:'：';}
.detail dd { float:right; width:75%; text-align:left;}
@media screen and ( max-width:480px ) {
.detail { font-size:12px;}
.detail *:nth-child(n+3) { margin-top:0;}
.detail dt { width:100%; text-align:left; padding:0;}
.detail dt:nth-of-type(n+2) { margin-top:1em;}
.detail dt:after { position:initial;}/* 「：」を浮遊させない */
.detail dd { width:100%; padding-left:2em;}
}
/*↑仕様↑*/
/*↓作品↓*/
.story img { display:block; width:100%;}
.story p {
position:relative;
background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.5) 32px,#000 96px);
color:#FFF; font-size:14px; line-height:1.5; text-shadow:0 1px 2px #000;
padding:32px; margin-top:-96px;
}
@media screen and (max-width:480px) {
.story p { font-size:12px; padding:16px;}
}
/*↑作品↑*/
/*↓日誌↓*/
.diary div { padding:32px;}
.diary p { font-size:14px; line-height:1.5;}
.diary h4 { color:#39C; font-size:12px; margin-top:16px;}
.diary img { display:block; width:100%;}
@media screen and (max-width:480px) {
.diary div { padding:16px;}
.diary h4 { font-size:14px;}
}
/*↑日誌↑*/
/*↓商標↓*/
.copy { background:linear-gradient(#012,#345); padding:8px 24px;}
.copy ul {
display:flex; flex-wrap:wrap; justify-content:center;
color:#CDD; font-size:10px; text-align:left;
padding:4px;
}
.copy li { position:relative; padding:4px;}
@media screen and ( max-width:480px ) {
.copy { padding:8px;}
.copy ul { font-size:10px;}
}
/*↑商標↑*/