@charset "utf-8";

*{ letter-spacing: 0; }
html{ overflow-y: scroll; }
/* 要素のフォントサイズやマージン・パディングをリセットしています */
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}
/* 新規追加要素のデフォルトはすべてインライン要素になっているので、section要素などをブロック要素へ変更しています */
article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section {display:block;}
/* マーカー（行頭記号）を表示しないようにしています */
ol, ul {list-style:none;}
/* 引用符の表示が出ないようにしています */
blockquote, q {quotes:none;}
/* blockquote要素、q要素の前後にコンテンツを追加しないように指定しています */
blockquote:before, blockquote:after, q:before, q:after {content:'';content:none;}
/* a要素のフォントサイズなどをリセットしフォントの縦方向の揃え位置を親要素のベースラインに揃えるようにしています */
a {margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;}
/* ins要素のデフォルトをセットし、色を変える場合はここで変更できるようにしています */
ins {background-color:#ff9;color:#000;text-decoration:none;}
/* mark要素のデフォルトをセットし、色やフォントスタイルを変える場合はここで変更できるようにしています
また、mark要素とは、文書内の検索結果で該当するフレーズをハイライトして、目立たせる際に使用するようです。 */
mark {background-color:#ff9;color:#000;font-style:italic;font-weight:bold;}
/* テキストに打ち消し線が付くようにしています */
del {text-decoration:line-through;}
/* IEではデフォルトで点線を下線表示する設定ではないので、下線がつくようにしています
また、マウスオーバー時にヘルプカーソルの表示が出るようにしています */
abbr[title], dfn[title] {border-bottom:1px dotted;cursor:help;}
/* 隣接するセルのボーダーを重ねて表示し、間隔を0に指定しています */
table {border-collapse:collapse;border-spacing:0;}
/* 水平罫線のデフォルトである立体的な罫線を見えなくしています */
hr {border:none;border-top:dotted 1px #ededed;height:1px;color:#FFFFFF;margin:10px 0;}
/* 縦方向の揃え位置を中央揃えに指定しています */
input, select {vertical-align:middle;}
/* 画像を並べた時に隙間が出来ないように指定しています */
img {
vertical-align:top;
font-size:0;
line-height:0;
border:0;
-ms-interpolation-mode:bicubic;
max-width:100%;
height:auto;
width:auto\9; /* ie8 */
}

textarea{font-size:100%;}
table{
width: 100%;
border-collapse:collapse;
border-spacing:0;
table-layout: fixed;
word-break: break-all;
word-wrap: break-word;
}
/*--------------------------------------------------------
IEハック
-------------------------------------------------------*/
* html button,* html input,* html select,* html textarea{ vertical-align: middle; } /* IE6 */
*+html button,*+html input,*+html select,*+html textarea{ vertical-align: middle; } /* IE7 */
* html button,* html input{ overflow: visible; } /* IE6 */
*+html button,*+html input{ overflow: visible; } /* IE7 */
* html hr{ margin: 0 0 1.2em; } /* IE6 */
*+html hr{ margin: 0 0 1.2em; } /* IE7 */
* html table{ border-collapse: collapse; } /* IE6 */
*+html table{ border-collapse: collapse; } /* IE7 */


/*PC*/
@media screen and (max-width: 2560px) {
    body{
        /*background-color: #cccccc;*/
    }
    .movie_pc { display: grid; }
    .movie_sp { display: none; }
}

/*iPad横*/
@media screen and (max-width: 1280px) {
    body{
        /*background-color: #666666;*/
    }
    .movie_pc { display: block; }
    .movie_sp { display: none; }
}

/*タブレット横*/
@media screen and (max-width: 980px) {
    body{
        /*background-color: #ff0000;*/
    }
    .movie_pc { display: block; }
    .movie_sp { display: none; }
}

/*iPad縦*/
@media screen and (max-width: 840px) {
    body{
        /*background-color: #ffff00;*/
    }
    .movie_pc { display: block; }
    .movie_sp { display: none; }
}

/*タブレット縦 青*/
@media screen and (max-width: 736px) {
    body{
        /*background-color: #379ad8;*/
    }
    .movie_pc { display: none; }
    .movie_sp { display: block; }
}

/*スマホ縦 緑*/
@media screen and (max-width: 480px) {
    body{
        /*background-color: #20c44f;*/
    }
    .movie_pc { display: none; }
    .movie_sp { display: block; }
}