@import "../../../../css/menu2.css";

/* TableMark Short Movie Files */

/* common setting */
/* display none */
ul#mainNav,#navFooter {
    display:none;
}
#navHeader {
    margin:0 auto;
}
.pagetop_sp,.pagetop_sp a,.pt {
    display:none;
}

/* common setting END */


/* PCレイアウト */

/* head */
#head {
    width:860px;
    margin:0 auto;
    text-align:center;
}
#head h2 {
    float:left;
    margin:0 auto;
    text-align:center;
}


/* main title area */
#mainTitleArea {
    width:100%;
    height:346px;
    background:#BEAB81 no-repeat center top;
    background-size:cover;
}
.mainTitleInner {
    width:950px;
    margin:0 auto;
    padding:80px 0 0;
    text-align:center;
    line-height:1.6;
    font-size:20px;
    color:#ffffff;
}
.mainTitleInner h3 {
    margin:0 auto 10px;
}


/* movie area */
#movieArea {
    width:100%;
    height:326px;
    background:url("../images/movie_area_bg.png");
    margin:0 auto 55px;
}
.movieAreaInner {
    width:950px;
    margin:0 auto;
    padding:28px 0 0;
}
.movieAreaInner .movieUdon {
    float:left;
    width:453px;
    margin-right:44px;
    text-align:left;
}
.movieAreaInner .movieRice {
    float:left;
    width:453px;
    text-align:left;
}
.movieAreaInner iframe {
    overflow:hidden;
    width:453px;
    height:255px;
    border:none;
    margin:0 0 5px;
}

/* line */
.line {
    width:100%;
    height:1px;
    border-bottom:1px solid #cccccc;
}
.line_sp {
    display:none;
}


/* lead area */
#lead {
    width:950px;
    background:url("../images/img_ooku_bg.jpg") no-repeat 760px bottom;
    margin:0 auto 60px;
    text-align:left;
    line-height:2.2;
    font-size:14px;
}
#lead p.bg {
    position:relative;
    padding:0 230px 20px 0;
}
#lead p.bg a {
    position:absolute;
    left:760px;
    bottom:0;
    display:block;
    width:145px;
    height:168px;
}


/* images area */
#imagesArea {
    width:950px;
    margin:0 auto 40px;
    padding:35px 0 0;
    text-align:center;
    line-height:1.8;
    font-size:16px;
}
#imagesArea .udon {
    float:left;
    width:475px;
}
#imagesArea .rice {
    float:left;
    width:475px;
}
#imagesArea .udon p img,#imagesArea .rice p img {
    margin:0 0 10px;
}
#imagesArea .udon .outline {
    background:url("../images/outline_udon_bg.png") no-repeat;
    padding:85px 0 2em;
}
#imagesArea .rice .outline {
    background:url("../images/outline_rice_bg.png") no-repeat;
    padding:85px 0 2em;
}


/* cast & staff */
#cast {
    width:950px;
    margin:0 auto;
}

.director {background:url("../images/title_director.png") no-repeat 0 0;margin:0 0 30px;}
.starring {background:url("../images/title_starring.png") no-repeat 0 0;margin:0 0 10px;}
.music {background:url("../images/title_music.png") no-repeat 0 55px;margin:0 0 30px;}
.staff {background:url("../images/title_cast_staff.png") no-repeat 0 0;}

#cast .image {
    float:left;
    width:254px;
    padding:30px 0 0;
}
#cast .text {
    float:right;
    width:680px;
    padding:65px 0 0;
    text-align:left;
    line-height:2.0;
    font-size:12px;
}
#cast .text h4 {
    margin:0 0 30px;
    font-size:18px;
    font-weight:normal;
}
#cast .text h5 {
    font-size:14px;
    font-weight:normal;
}
#cast .text p span {
    font-size:14px;
}
#cast .text p {
    margin:0 0 1em;
}
#cast .text p.interview {
    background:url("../images/icon_mic.png") no-repeat 0 0;
    padding:40px 0 0;
    line-height:1.8;
    font-size:14px;
}

#cast .icon_music {
    text-align:right;
}

#cast .staff {
    margin:0 0 50px;
    padding:50px 0 0 270px;
    text-align:left;
    line-height:1.8;
    font-size:12px;
}
#cast .staff .cast {
    float:left;
    width:140px;
}
#cast .staff .production {
    float:left;
    width:480px;
    padding:0 0 0 40px;
    border-left:2px solid #cccccc;
}

#cast .staff h4 {
    margin:0 0 10px;
    font-weight:normal;
}
#cast .staff h5 {
    display:inline-block;
    margin:0 0 0.5em;
    border-bottom:1px solid #cccccc;
    font-size:12px;
}
#cast .staff .cast ul {
    margin:0 0 1em;
}
#cast .staff ul li {
    margin:0 0 0.5em;
}




/* 949px以下 */
/*-------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 949px) {

/* head */
#head {
    width:80%;
    text-align:center;
}
#head h2 {
    float:none;
}


/* main title area */
#mainTitleArea {
    width:100%;
    height:346px;
    background:no-repeat center top;
    background-size:cover;
}
.mainTitleInner {
    width:90%;
}


/* movie area */
#movieArea {
    height:auto;
}
.movieAreaInner {
    width:80%;
    padding:28px 0 0;
}
.movieAreaInner .movieUdon {
    float:none;
    margin:0 auto 20px;
}
.movieAreaInner .movieRice {
    float:none;
    margin:0 auto 20px;
}


/* lead area */
#lead {
    width:80%;
    background-position:right bottom;
}
#lead p.bg {
    padding:0 160px 0 0;
}
#lead p.bg a {
    left:auto;
    right:0;
    bottom:0;
    width:145px;
    height:168px;
}


/* images area */
#imagesArea {
    width:90%;
    line-height:1.8;
    font-size:12px;
}
#imagesArea img {
    max-width:100%;
    height:auto;
}
#imagesArea .udon {
    width:48%;
    margin:0 1%;
}
#imagesArea .rice {
    width:48%;
    margin:0 1%;
}
#imagesArea .udon .outline {
    background-size:contain;
    padding:18% 0 2em;
}
#imagesArea .rice .outline {
    background-size:contain;
    padding:18% 0 2em;
}


/* cast & staff */
#cast {
    width:90%;
}

.director {;margin:0 0 30px;}
.starring {margin:0;}
.music {background:url("../images/title_music.png") no-repeat 0 0;margin:0 0 30px;}
.staff {}

#cast .image {
    width:25%;
    padding:60px 0 0;
}
#cast .image img {
    max-width:100%;
    height:auto;
}
#cast .text {
    width:73%;
    padding:11% 0 0;
}
#cast .starring2 {
    margin:0 0 40px;
}
#cast .starring2 .image {
    padding:0;
}
#cast .starring2 .text {
    padding:3% 0 0;
}
#cast .icon_music {
    text-align:right;
}
#cast .icon_music img {
    width:43%;
}
#cast .music .text {
    padding:12% 0 0;
}

#cast .staff {
    padding:65px 0 0;
}
#cast .staff .cast {
    width:24%;
}
#cast .staff .production {
    float:right;
    width:69%;
    padding:0 0 0 4%;
}

#cast .staff h4 {
    margin:0 0 10px;
    font-weight:normal;
}
#cast .staff h5 {
    display:inline-block;
    margin:0 0 0.5em;
    border-bottom:1px solid #cccccc;
    font-size:12px;
}
#cast .staff .cast ul {
    margin:0 0 1em;
}
#cast .staff ul li {
    margin:0 0 0.5em;
}



}
/*-------------------------------------------------------------------------------------------*/
/* 949px以下 END */



/* 640px以下 */
/*-------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 640px) {

img, object, embed, video {
    width:100%;
    height:auto;
}

/* head */
#head {
    padding:1em 0 0;
}
#head h2.ballon img {
    width:70%;
}


/* main title area */
#mainTitleArea {
    height:auto;
}
.mainTitleInner {
    width:90%;
    padding:30px 0;
    font-size:12px;
}


/* movie area */
#movieArea {
    height:auto;
    margin:0 auto 15px;
}
.movieAreaInner {
    width:80%;
    padding:28px 0 0;
}
.movieAreaInner .movieUdon {
    width:100%;
}
.movieAreaInner .movieRice {
    width:100%;
}

.movieAreaInner div {
    overflow:hidden;
    position:relative;
    height:0;
    padding-top:25px;
    padding-bottom:56.25%;
}
 
.movieAreaInner div iframe {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
.movieAreaInner div span {
    position:absolute;
    bottom:0;
}


/* line */
.line_sp {
    display:block;
    width:100%;
    height:1px;
    border-bottom:1px solid #cccccc;
}

/* lead area */
#lead {
    width:80%;
    background:none;
    margin:0 auto 3em;
}
#lead p.bg {
    padding:0;
}
#lead p.bg a {
    display:none;
}


/* images area */
#imagesArea {
    width:100%;
    font-size:11px;
}
#imagesArea img {
    max-width:100%;
    height:auto;
}
#imagesArea .udon {
    float:none;
    width:96%;
    margin:0 auto 3em;
}
#imagesArea .rice {
    float:none;
    width:96%;
    margin:0 auto;
    padding:35px 0 0;
}
#imagesArea .udon .outline {
    background-position:center top;
    padding:17% 0 2em;
}
#imagesArea .rice .outline {
    background-position:center top;
    padding:17% 0 2em;
}


/* cast & staff */
#cast {
    width:100%;
    margin:0 auto;
}

.director {background-position:1em 0;margin:0 0 3em;}
.starring {background-position:1em 0;margin:0 0 1.5em;}
.music {background-position:1em 0;margin:0 0 3em;}
.staff {background-position:1em 0;}

#cast .image {
    float:none;
    width:60%;
    margin:0 auto;
    padding:50px 0 0;
}
#cast .text {
    float:none;
    width:90%;
    margin:0 auto;
    padding:0;
    text-align:center;
}
#cast .text h4 {
    margin:0 auto 0.5em;
    text-align:center;
}
#cast .text p {
    text-align:left;
}
#cast .text p {
    margin:0 0 1em;
}
#cast .text p.interview {
    background-position:center top;
}
#cast .text p.interview br {
    display:none;
}
#cast .text p.interview strong {
    display:block;
    text-align:center;
}

#cast .icon_music {
    text-align:center;
}
#cast .music .text {
    padding:0;
}

#cast .staff {
    width:100%;
    margin:0 auto 50px;
    padding:70px 0 0 0;
}
#cast .staff .cast {
    float:none;
    width:90%;
    margin:0 auto 2em;
}
#cast .staff .production {
    float:none;
    width:90%;
    margin:0 auto;
    padding:0;
    border-left:none;
}
#cast .staff h4 {
    margin:0 0 10px;
}
#cast .udon {
    float:left;
    margin-right:2.5em;
}
#cast .rice {
    float:left;
}





/* page top */
.pagetop_sp {
    display:none;
    position:fixed;
    bottom:2%;
    right:2%;
}
.pagetop_sp a {
	display:block;
	width:60px;
	height:60px;
	background:url("/common/images/responsive/sp/up.png") no-repeat 0 0;
	font-size:0.1em;
	text-decoration:none;
	text-indent:-9999px;
}


}
/*-------------------------------------------------------------------------------------------*/
/* 640px以下 END */