@charset "utf-8"; /* =================================================================== sp.css =================================================================== */ @media screen and (max-width: 640px) { /*---------------------------------------------------- 共通 ----------------------------------------------------*/ body { background: #333; } .bg { display: none !important; } #header, footer { width: 100%; margin: 0; } #panels { } #content, #contents, #sidebar { width: 100%; height: auto; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; margin: 0; } #contents, #sidebar { width: 100%; height: auto; margin-bottom: 0.5em; } #contents #mainpanel { width: 320px; height: 200px; } #contents #mainpanel img { width: 320px; height: 200px; } header { height: auto; background: url(/common/images/head_bg.png) repeat-x;/* -webkit-background-size:auto 100%; -moz-background-size:auto 100%; -o-background-size:auto 100%; */ } header #header h1 img { width: 90%; height: auto; margin: 5px auto; } #toplnk { position: relative !important; width: 100%; height: auto; } #toplnk strong, footer, footer .foot { width: 100%; } footer small { text-align: center; line-height: 3em; } #sidebar ul { } #sidebar ul ul { display: block; } #sidebar ul li { font-size: 1.2em; } #sidebar ul a { background-image: url(../images/lis.png), url(../images/bg_b2.png); background-position: 5px 50%, left top; background-repeat: no-repeat, repeat; border-radius: 1em; -webkit-border-radius: 1em; -moz-border-radius: 1em; } #toplnk { display: none !important; visibility: hidden !important; } /*---------------------------------------------------- top ----------------------------------------------------*/ #about { width: 90%; height: auto; margin-top: 1em; } #about .gal { background: #000; overflow: hidden; margin-bottom: 1em; } #about .g5img0, #about .g5img1, #about .g5img2, #about .g5img3, #about .g5img4, #about .g5img5 { width: 48% !important; height: auto !important; position: relative !important; top: auto !important; left: auto !important; float: left; padding: 1px; } #about h2 { padding: 0; } #about ul { padding: 1em; } #about ul li { } /*---------------------------------------------------- e7 ----------------------------------------------------*/ #lineup ul { width: 90%; margin: 0 auto; padding: 1em; } #lineup ul li { width: 48%; } #lineup dl { width: 90%; height: auto; margin: 0 auto 10px; } #lineup dt { width: 95%; margin: 0 auto; position: relative; top: 10px; left: auto; } #lineup dd.lt { padding-left: 2em; } #lineup dd.rt { padding-right: 2em; } #lineup dd { width: 40%; padding: 2em 0; } #lineup dd img { width: 100%; height: auto; } /*---------------------------------------------------- gallery ----------------------------------------------------*/ .ttl { margin: 0 0 1em !important; padding: 0 1em !important; border-radius: 0 !important; -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; } .ttl h2 { display: block; clear: both; } .ttl .social { clear: both; } #gallery .gallery { width: 100%; } .gallery dl { } .gallery dt, .gallery .spl { margin: 1em !important; padding: 0 1em !important; border-radius: 1.5em !important; -webkit-border-radius: 1.5em !important; -moz-border-radius: 1.5em !important; } .gallery dt a { display: block; } .gallery dd { margin: 1em 2em !important; } .gallery dd ul li img { width: 90%; margin: 0 auto; } .report dd ul li { overflow: hidden; } .report dd ul li strong, .report dd ul li p { display: block; float: none; clear: both; } .report dd ul li img { width: 90%; margin: 0 auto; } /*---------------------------------------------------- contact ----------------------------------------------------*/ #contact .inner {} #contact .inner dl {} #contact .inner dl dt { width: auto; float: none; } #contact .inner dl dd { width: auto; margin: 0; } #contact .inner dl dd input { width: 100%; } #contact .inner dl dd textarea { width: 100%; height: 10em; } #contact .btn_area { width: 100%; padding: 0; text-align: center; } #contact .btn_area .btn { float: none; width: 90%; margin: 0 auto 1em; } }