
@media only screen and (min-width:769px) {

html { background:#000000; }
body { color:#000000; font-size:12px; font-size:1.2em; line-height:1em; overflow-wrap:break-word; word-wrap:break-word; }

a { display:block; color:#000000; text-decoration:none; transition:all 0.125s linear; }
a img { transition:all 0.125s linear; }
a img.of { opacity:1; }
a img.on { opacity:0; }
a:hover { text-decoration:underline; }
a:hover img { opacity:0.75; }
a:hover img.of { opacity:0; }
a:hover img.on { opacity:1; }
img { display:block; max-width:100%; }

div.loading { position:fixed; left:0; top:0; width:100%; height:100%; background:#000000; z-index:999; }

div#page {}

div#page header.page { position:fixed; left:0; right:0; bottom:100px; width:301px; margin:auto; z-index:1; }
div#page header.page div.header {}
div#page header.page div.header h1 {}

div#page nav.page { position:fixed; left:0; top:20px; width:100%; z-index:1; }
div#page nav.page div.nav {}
div#page nav.page div.nav ul { text-align:center; font-size:0; line-height:0; }
div#page nav.page div.nav ul li { display:inline-block; padding:0 18px 0 18px; }

div#page div.page {}

div#page aside.lyrics { position:fixed; right:15px; top:15px; z-index:1; }
div#page aside.lyrics div.aside {}
div#page aside.lyrics div.aside div.lyrics {}
div#page aside.lyrics div.aside div.lyrics ul {}
div#page aside.lyrics div.aside div.lyrics ul li { padding:0 0 10px 0; }
div#page aside.lyrics div.aside div.lyrics ul li a { padding:10px 20px 10px 20px; font-size:1.2rem; line-height:1em; color:#ffffff; background:#000000; transition:all 0.125s linear; box-sizing:border-box; }
div#page aside.lyrics div.aside div.lyrics ul li a:hover { text-decoration:none; background:#888888; }

div#page aside.youtube {}

div#page aside.social { position:fixed; left:15px; top:15px; z-index:1; }
div#page aside.social ul { font-size:0; line-height:0; }
div#page aside.social ul li { display:inline-block; height:20px; padding:0 10px 0 0;  overflow:hidden; }

div#page footer.page { position:fixed; left:0; bottom:20px; width:100%; z-index:1; }
div#page footer.page div.footer {}
div#page footer.page div.footer small { display:block; text-align:center; font-size:1.0rem; line-height:1em; color:#ffffff; }
div#page footer.page div.footer small a { display:inline; color:#ffffff;  }

section.content { width:769px; height:600px; background:#ffffff; box-sizing:border-box; }
section.content div.section { width:100%; height:100%; overflow:auto; box-sizing:border-box; }
section.content div.section header.content { width:640px; margin:0 auto; }
section.content div.section header.content h1 { padding:40px 0 40px 0; }
section.content div.section header.content h1 img { margin:0 auto; }
section.content div.section div.content { width:640px; margin:0 auto; }
section.content div.section footer.content { width:640px; margin:0 auto; }
section.content div.section footer.content nav {}
section.content div.section footer.content nav ul { padding:0 0 40px 0; text-align:right; font-size:0; line-height:0; }
section.content div.section footer.content nav ul li { display:inline-block; }
section.content div.section footer.content nav ul li a { padding:8px 24px 8px 24px; background:#cccccc; }
section.content div.section footer.content nav ul li a:hover img { opacity:0.5; }

main.top {}
main.top iframe { display:none; }

main.product {}
main.product div.content {}
main.product div.content ul { width:560px; margin:0 auto; text-align:center; font-size:0; line-height:0; }
main.product div.content ul li { display:inline-block; width:240px; padding:20px; }
main.product div.content ul li a { font-size:1.4rem; line-height:1.5em; text-decoration:none; }
main.product div.content ul li a figure {}
main.product div.content ul li a figure figcaption { padding:10px 0 0 0; text-align:center; }

main.promotion {}
main.promotion div.content div.sp { display:none; }

main.movie {}
main.movie div.content {}
main.movie div.content ul {}
main.movie div.content ul li { padding:0 0 40px 0; }
main.movie div.content ul li div.iframe {}
main.movie div.content ul li div.iframe iframe { width:640px; height:360px; }

main.lyrics {}
main.lyrics div.lyrics { height:600px; overflow:auto; }
main.lyrics div.lyrics p.lyrics { position:relative; padding:0 0 20px 0; }
main.lyrics div.lyrics p.lyrics span { position:absolute; left:0; top:0; width:100%; height:100%; }
main.lyrics div.lyrics p.more { padding:0 20px 20px 20px; }
main.lyrics div.lyrics p.more a { padding:10px 0 10px 0; text-align:center; font-size:1.2rem; line-height:1em; color:#ffffff; border:1px solid #ffffff; }
main.lyrics div.lyrics p.more a:hover { text-decoration:none; color:#000000; background:#ffffff; }
main.lyrics div.lyrics p.back { display:none; }

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color:rgba(0,0,0,0.75); }
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color:rgba(0,0,0,0.85); }
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color:rgba(0,0,0,0.9); }

.mbYTP_wrapper iframe { -webkit-transform:scale(1.4); transform:scale(1.4); }

}

@media only screen and (max-width:768px) {

html { background:#000000; }
body { color:#000000; font-size:12px; font-size:1.2em; line-height:1em; -webkit-text-size-adjust:100%; text-size-adjust:100%; overflow-wrap:break-word; word-wrap:break-word; }

a { display:block; color:#000000; text-decoration:none; }
img { display:block; max-width:100%; }

div.loading { position:fixed; left:0; top:0; width:100%; height:100%; background:#000000; z-index:999; }

div#page { background:url(../images/bg.jpg) top center no-repeat fixed; background-size:auto 200px; }

div#page header.page { padding:145px 0 30px 0; }
div#page header.page div.header {}
div#page header.page div.header h1 { width:300px; margin:0 auto; }

div#page nav.page {}
div#page nav.page div.nav { padding:0 20px 20px 20px; }
div#page nav.page div.nav ul { font-size:0; line-height:0; border-top:solid 1px rgba(255,255,255,0.2); border-left:solid 1px rgba(255,255,255,0.2); }
div#page nav.page div.nav ul li { display:inline-block; width:50%; vertical-align:top; border-bottom:solid 1px rgba(255,255,255,0.2); border-right:solid 1px rgba(255,255,255,0.2); box-sizing:border-box; }
div#page nav.page div.nav ul li a { padding:10px 10px 10px 10px; }
div#page nav.page div.nav ul li a img { max-width:none; height:20px; }

div#page div.page {}

div#page aside.lyrics {}
div#page aside.lyrics div.aside {}
div#page aside.lyrics div.aside div.lyrics {}
div#page aside.lyrics div.aside div.lyrics ul { padding:0 20px 0 20px; font-size:0; line-height:0; }
div#page aside.lyrics div.aside div.lyrics ul li { display:inline-block; width:100%; padding:0 0 20px 0; box-sizing:border-box; }
div#page aside.lyrics div.aside div.lyrics ul li a { padding:10px; font-size:1.2rem; line-height:1em; color:#ffffff; border:solid 1px rgba(255,255,255,0.2); background:#000000; }

div#page aside.youtube { display:none; }

div#page aside.social {}
div#page aside.social ul { padding:0 0 20px 0; text-align:center; font-size:0; line-height:0; }
div#page aside.social ul li { display:inline-block; height:20px; padding:0 5px 0 5px;  overflow:hidden; }

div#page footer.page {}
div#page footer.page div.footer {}
div#page footer.page div.footer small { display:block; padding:0 0 20px 0; text-align:center; font-size:1.0rem; line-height:1em; color:#ffffff; }
div#page footer.page div.footer small a { display:inline; font-size:1.0rem; line-height:1em; color:#ffffff; }

section.content { position:absolute; left:0; top:0; width:100%; height:100%; background:#ffffff; box-sizing:border-box; }
section.content div.section { width:100%; height:100%; overflow:auto; box-sizing:border-box; -webkit-overflow-scrolling:touch; }
section.content div.section header.content { padding:0 10px 0 10px; }
section.content div.section header.content h1 { padding:20px 0 20px 0; }
section.content div.section header.content h1 img { margin:0 auto; }
section.content div.section div.content { padding:0 10px 0 10px; }
section.content div.section footer.content { padding:0 10px 0 10px; }
section.content div.section footer.content nav {}
section.content div.section footer.content nav ul { padding:0 0 20px 0; text-align:right; font-size:0; line-height:0; }
section.content div.section footer.content nav ul li { display:inline-block; }
section.content div.section footer.content nav ul li a { padding:8px 24px 8px 24px; background:#cccccc; }
section.content div.section footer.content nav ul li a:hover img { opacity:0.5; }

main.top { padding:0 20px 20px 20px; }
main.top div.iframe { position:relative; width:100%; padding:56.25% 0 0 0; }
main.top div.iframe iframe { position:absolute; top:0; left:0; width:100% !important; height:100% !important; }

main.product {}
main.product div.content {}
main.product div.content ul { text-align:center; font-size:0; line-height:0; }
main.product div.content ul li { display:inline-block; width:50%; padding:0 10px 20px 10px; box-sizing:border-box; }
main.product div.content ul li a { font-size:1.4rem; line-height:1.5em; text-decoration:none; }
main.product div.content ul li a figure {}
main.product div.content ul li a figure figcaption { padding:10px 0 0 0; text-align:center; }

main.promotion {}
main.promotion div.content div.sp {}

main.movie {}
main.movie div.content {}
main.movie div.content ul {}
main.movie div.content ul li { padding:0 0 20px 0; }
main.movie div.content ul li div.iframe { position:relative; width:100%; padding:56.25% 0 0 0; }
main.movie div.content ul li div.iframe iframe { position:absolute; top:0; left:0; width:100% !important; height:100% !important; }

main.lyrics {}
main.lyrics div.lyrics {}
main.lyrics div.lyrics p.lyrics { position:relative; padding:0 0 20px 0; }
main.lyrics div.lyrics p.lyrics span { position:absolute; left:0; top:0; width:100%; height:100%; }
main.lyrics div.lyrics p.more { padding:0 20px 20px 20px; }
main.lyrics div.lyrics p.more a { padding:10px 0 10px 0; text-align:center; font-size:1.2rem; line-height:1em; color:#ffffff; border:1px solid #ffffff; }
main.lyrics div.lyrics p.back { padding:0 20px 20px 20px; }
main.lyrics div.lyrics p.back a { padding:10px 0 10px 0; text-align:center; font-size:1.2rem; line-height:1em; color:#ffffff; border:1px solid #ffffff; }

}

main.promotion {}
main.promotion div.content {}
main.promotion div.content div.sp { padding:0 0 40px 0; text-align:center; font-size:1.2rem; line-height:1.5em; }
main.promotion div.content ul {}
main.promotion div.content ul li {}
main.promotion div.content ul li h2 { padding:0 0 20px 0; text-align:center; font-size:1.4rem; line-height:1em; font-weight:bold; }
main.promotion div.content ul li dl { padding:0 0 20px 0; }
main.promotion div.content ul li dl dt { padding:0 0 10px 0; }
main.promotion div.content ul li dl dt img { margin:0 auto; }
main.promotion div.content ul li dl dd {}
main.promotion div.content ul li dl dd span { display:block; text-align:center; padding:0 0 20px 0; font-size:1.2rem; line-height:1em; }
main.promotion div.content ul li dl dd textarea { width:100%; margin:0 0 20px 0; font-size:1.2rem; height:4em; background-color:rgba(0,0,0,0.2); }

