@charset "utf-8";

@media only screen and (max-width: 640px) {
/*============================
#bookLinkArea
============================*/
#bookLinkArea { width: inherit; margin: 40px 20px 0; }
#bookLinkArea ul.clearFix { margin: 0 auto; }
#bookLinkArea ul.clearFix li { float: left; width: 22%; margin-left: 4%; }
#bookLinkArea ul.clearFix li:first-child { margin-left: 0; }
#bookLinkArea ul.clearFix li a { font-size: 0.875em; }
#bookLinkArea ul.clearFix li.on a {}

/*============================
#bookListArea
============================*/
#bookListArea { width: inherit; margin: 40px 20px 0; }
#bookListArea .md_subTitleBar { margin-top: 40px; }
#bookListArea .md_subTitleBar h3 {}
#bookListArea .md_subTitleBar h3 span {}
#bookListArea .bookContent {}
#bookListArea .bookContent ul {}
#bookListArea .bookContent ul li { width: 100%; margin-right: 0; margin-top: 20px;}
#bookListArea .bookContent ul li:nth-child(2n) {}
#bookListArea .bookContent ul li .image { width: 30%; }
#bookListArea .bookContent ul li .image img { width: 100%; height: auto; }
#bookListArea .bookContent ul li .data { width: 65%; }
#bookListArea .bookContent ul li .data .date {}
#bookListArea .bookContent ul li .data .title { line-height: 1.2; }
#bookListArea .bookContent ul li .data .text {}

/*============================
#movieListArea
============================*/
#movieListArea { width: inherit; margin: 40px 20px 0; }
#movieListArea .Content ul li { padding: 20px; margin-top: 30px; }
#movieListArea .Content ul li .image { width: 100%; }
#movieListArea .Content ul li .image img { width: 100%; height: auto; }
#movieListArea .Content ul li .data .title { margin-top: 10px;line-height: 1.2; }
#movieListArea .Content ul li .data .title span {}
#movieListArea .Content ul li .data .staffBox { height: auto; margin-top: 10px; border-top: solid 1px #dedede; border-bottom: solid 1px #dedede; padding: 20px 0;  }
#movieListArea .Content ul li .data .staffBox .staff { float: none; width: 100%; box-sizing: border-box; padding-left: 0; }
#movieListArea .Content ul li .data .staffBox .staff table {}
#movieListArea .Content ul li .data .staffBox .staff table td { padding: 5px 10px; }
#movieListArea .Content ul li .data .staffBox .staff table td em { font-weight: bold; }
#movieListArea .Content ul li .data .staffBox .staff table td span { color: #a1332c; }
#movieListArea .Content ul li .data .staffBox .cast { float: none; width: 100%; margin-top: 20px; }
#movieListArea .Content ul li .data .staffBox .cast table {}
#movieListArea .Content ul li .data .staffBox .cast table td { display: block; padding: 5px 10px; }
#movieListArea .Content ul li .data .staffBox .cast table td em { font-weight: bold; }
#movieListArea .Content ul li .data .staffBox .cast table td span { color: #a1332c; }
#movieListArea .Content ul li .data .text { margin-top: 20px; font-size: 1em;line-height: 1.5; text-align: left; }
#movieListArea .Content ul li .data .text span {margin-left: 0;}

}