/**** CSSリセット ****/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-style:normal; font-weight: normal; font-size: 100%; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } html{ overflow-y: scroll; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } input, textarea,{ margin: 0; padding: 0; } ol, ul{ list-style:none; } table{ border-collapse: collapse; border-spacing:0; } caption, th{ text-align: left; } a:focus { outline:none; } .clearfix:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; } .clearfix { min-height: 1px; } * html .clearfix { height: 1px; /*¥*//*/ height: auto; overflow: hidden; /**/ } .both{ clear:both; } /*テキストシャドウ { text-shadow: 1px 1px 3px #000; } */ /*ボックスシャドウ { -moz-box-shadow: 1px 1px 3px #000; -webkit-box-shadow: 1px 1px 3px #000; box-shadow: 1px 1px 3px #000; } */ /*ボックスシャドウ内側 { -moz-box-shadow: inset 1px 1px 3px #000; -webkit-box-shadow: inset 1px 1px 3px #000; box-shadow: inset 1px 1px 3px #000; } */ /*角丸 { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; } */ /*トランジション { -webkit-transition: 1.5s; -moz-transition: 1.5s; -o-transition: 1.5s; transition: 1.5s; } */ /*透明 { filter: alpha(opacity=25); -moz-opacity:0.25; opacity:0.25; } */ /*背景のみ透明 { background-color:rgba(255,255,255,0.2); } */ /*グラデーション { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#000000'); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#000000')"; background-image: -moz-linear-gradient(top, #ffffff, #000000); background-image: -ms-linear-gradient(top, #ffffff, #000000); background-image: -o-linear-gradient(top, #ffffff, #000000); background-image: -webkit-gradient(linear, center top, center bottom, from(#ffffff), to(#000000)); background-image: -webkit-linear-gradient(top, #ffffff, #000000); background-image: linear-gradient(top, #ffffff, #000000); } */ /*スマホ対応 @media screen and (max-width: 480px){ } @media screen and (max-width: 320px){ } */ /**** CSSリセット END ****/ html { font-size: 62.5%; } body{ font-family: "メイリオ",'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro', "MS Pゴシック", sans-serif; background-image:url(a1.png); background-attachment:fixed; font-size:14px; font-size:1.4rem; } p{ margin-bottom:0.6em; } b{ font-weight:bold; } i{ font-style:italic; } h1 img{vertical-align: text-bottom;} h3{ font-size:18px; font-size:1.8rem; border-bottom:#03C solid 2px; border-left:#03C solid 10px; padding:5px; margin:0 0 5px 0; font-weight:bold; } h4{ font-size:16px; font-size:1.6rem; border-left:#393 solid 6px; padding:2px 5px; margin:0 0 5px 0; } h5{ font-size:16px; font-size:1.6rem; border-left:#C93 solid 4px; padding:2px 5px; margin:0 0 5px 0; } table{ padding:3px 5px; width:100%; border:1px solid #000; th{ padding:3px 3px; font-size:16px; } tr{ padding:3px; font-size:15px; border-bottom:#000 solid 1px; } td{ padding:3px 10px; font-size:15px; } } .movie01 { position: relative; width: 100%; iframe{ position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; } } nav#menu_pc{ ul{ li{ a{ font-size:14px; } } } } #contents{ width:96%; float:right; padding:0 2% 2%; overflow:hidden; font-size:14px; font-size:1.4rem; color:#000; h2{ font-size:28px; font-size:2.8rem; padding:30px 0; margin-top:30px; text-align:center; background:rgba(255,255,255,0.4); color:#900; font-family: "ヒラギノ明朝 Pro W3","HG明朝E","MS P明朝","MS 明朝",serif; } section{ margin-bottom:25px; margin-bottom:2.5rem; &.news{ dl{ margin-bottom:42px; margin-bottom:4.2rem; } .postdate{ display:block; font-size:12px; font-size:1.2rem; } .postname{ display:block; font-size:20px; font-size:2.0rem; line-height:20px; line-height:2.0rem; } } &.pagenav{ a,span{ padding: 3px 10px; border:#666 solid 1px; background:#fff; } } .castlist,.stafflist{ margin:0 0 30px 0; } .castlisttable,.stafflisttable{ border:none; tr{ border:none; td{ padding:0; } } } } } #side{ section{ clear:left; margin-bottom:20px; margin-bottom:2.0rem; } } #side_news{ width:91.66%;//330px; padding:0 4.16%; h2{ font-size:16px; font-size:1.6rem; text-align:center; font-weight:bold; } dl{ width:100%; clear:both; margin-bottom:5px; display:block; overflow:hidden; } dt{ font-size:12px; font-size:1.2rem; width:24%; float:left; display:block; margin:0; color:rgb(7, 7, 200); } dd{ float:right; font-size:12px; font-size:1.2rem; width:76%; display:block; margin:0; a{ text-decoration:underline; color:#000; &:hover{ color:#C00; } } } } @media screen and (min-width:930px){ #menu_sp,#menu_sp_open{display:none!important;} //#menu_pc{display:block!important;} #wrapper{ width:1030px; margin:0 auto; overflow:hidden; background:#fcfcfc; } .sp_on{ display:none; } #menu_pc{ display:block } header,#side{ width:360px; float:left; background:#fefefe; overflow:hidden; } nav#menu_pc{ text-align:center; border-top:#BBB solid 2px; border-bottom:#BBB solid 2px; margin-bottom:15px; a{ display:inline-block; color:#000; text-decoration:none; padding:8px; } a:hover{ color:#F00; } } #contents{ h2{ margin-bottom:18px!important; border-bottom: #900 2px solid; } section{ &.news{ dd{ margin-left:10px; } } } } #side{ /* padding-bottom:90000px; margin-bottom:-90000px;*/ } #side_banner{ text-align:center; a{ display:inline-block; width:234px; height:60px; margin-bottom:7px; img{ vertical-align: text-bottom; } } } #logo{ width:100%;//360px; height:auto; } footer{ width:360px; clear:both; address{ font-size:10px; font-size:1.0rem; } } #main{ width:670px; float:right; } } @media screen and (min-width:1030px){ #wrapper{width:1030px;} header,#side{ width:360px !important; } } @media screen and (min-width:930px) and (max-width:1029px){ #wrapper{width:930px;} header,#side{ width:260px !important; } #side_news{ dt,dd{ width:100%; float:left; } } } @media screen and (min-width:240px) and (max-width:929px){ #menu_sp_open{display:none;} #wrapper{width:100%;max-width:670px;margin:0 auto;} header{ background:#FFF; #logo{ width:50%; margin:0 25%; } #menu_sp{ width:100%; overflow:hidden; li{ a{ display:inline-block; color:#000; text-decoration:none; padding:1%; float:left; width:23%; text-align:center; color:#000; background:#FFF; } a:hover{ color:#C00; } } } } #contents{ clear:left; background:#FFF; h2{ font-size:28px; font-size:2.8rem; padding:30px 0; margin-top:0; text-align:center; background:rgba(255,255,255,0.4); color:#900; font-family: "ヒラギノ明朝 Pro W3","HG明朝E","MS P明朝","MS 明朝",serif; } } header,#side{ width:100%; float:left; background:#fff; overflow:hidden; } nav#menu_pc{ border-top:#BBB solid 2px; border-bottom:#BBB solid 2px; width:100%; a{ display:inline-block; color:#000; text-decoration:none; padding:12px 2%; } a:hover{ color:#F00; } } #side_banner{ text-align:center; width: 98%; padding:1%; a{ display:inline-block; width:234px; height:60px; margin:1%; img{ vertical-align: text-bottom; } } } #side_news{ max-width:450px; max-width:45.0rem; margin:0 auto; dt,dd{ width:100%; } } footer{ display:block; height:50px; clear: both; address{ font-size:1.0rem; height:70px; line-height:70px; line-height:7.0rem; } } } @media screen and (min-width:240px) and (max-width:669px){ #menu_sp_open{display:block;} #menu_sp{display:none;} header{ h1{ text-align:center; } #logo{ display:inline-block; margin:0; max-width:300px; max-width:30.0rem; min-width:230px; min-width:23.0rem; } #menu_sp{ //display:none; li{ border-bottom:2px dashed #CC0000; a{ width:100%; float:none; height:22px; line-height:22px; line-height:2.2rem; } } } } #menu_sp_open{ width:98%; height:24px; line-height:24px; line-height:2.4rem; background:#C00; color:#FFF; font-weight:bold; padding:2% 1%; text-align:center; } } @media screen and (min-width:670px) and (max-width:929px){ #menu_sp{ display:block!important; border-bottom:2px #666 solid; border-top:2px #666 solid; } }