@charset "UTF-8";
/*
* detail.css
* Copyright (c) ULM design Co.,Ltd. - http://www.ulm-design.com
* v1.0
* Last update 160410
*/


/*-----------------------------------------------------

@global

------------------------------------------------------*/
html,body {
	background-image: url(../img/common/bg.jpg);
    background-position: center center;
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
}

#wrapper{
	width:1024px;
	margin:0 auto;
	background:#000;
}

header{
	width:100%;
}

header a{
	width:1024px;
	display:block;
	margin:0 auto;
}

.sp-br{
	display: none;
}

h1{
	font-size: 24px;
	padding: 0 0 13px;
	letter-spacing:0;
}

#contents{
	width: 960px;
	margin: 0 auto;
	padding:0px 0 30px;
	background: #FFF;
	border-bottom-left-radius: 8px;
	-moz-border-bottom-left-radius: 8px;
	-webkit-border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	-moz-border-bottom-right-radius: 8px;
	-webkit-border-bottom-right-radius: 8px;
}

.inner{
}

#post-img-container{
	float:left;
}
#post-img-container p{
	width:560px;
}
#post-img-container p img{
	width:100%;
}

#post-txt-container{
	float:left;
	width: 380px;
    padding: 0 0 0 20px;
}

.status-container{
    padding: 0;
}

/*****
icon
******/
.icon-container {
    width: 48px;
    height: 48px;
    margin: 0 10px 0 0;
    overflow: hidden;
	display: inline-block;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.icon-container img {
    width: 100%;
    height: 100%;
}


.txt-container{
	width: 78%;
}

.status{
    font-size: 12px;
    line-height: 1;
    color: #444;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    padding: 4px 0;
}

/*--------------------------

@name

----------------------------*/
.name{
	margin: 0 10px 0 0;
    letter-spacing: 1px;
    font-size: 14px;
    line-height: 1.2;
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sex{
	font-size:12px;
	line-height:1.5;
	padding:0;
}
.man{
	color: #6EB2FC;	
}
.woman{
	color:#FC77B7;
}


.comment{
	display: block;
    padding: 0 0 5px;
    margin: 10px 0 0;
    word-wrap: break-word;
    font-size: 16px;
    color: #444;
    line-height: 1.6;
}

.post-time {
    color: #A2A2A2;
    font-size: 10px;
    display: block;
    padding: 0 0 3px;
    margin: 0;
}


#post-btn-container{
	width:100%;
}

#post-btn-container li{
	width:180px;
	float:left;
	padding:0 10px 0 0;
}
#post-btn-container li:last-child{
	padding:0;
}

/*------------------------------------

@point

-------------------------------------*/
.point-container{
	width:80px;
	height:15px;
	background-image:url(../../assets/img/review/starBg.png);
	background-repeat:no-repeat;
	vertical-align: top;
	display: block;
	margin: 0 10px 0 0;
}
.point{
	display:block;
	overflow:hidden;
	height:15px;
}
.point img{
	vertical-align: top;
	overflow:hidden;
}
.point1{ width:16px;}
.point2{ width:32px;}
.point3{ width:48px;}
.point4{ width:64px;}
.point5{ width:80px;}



/*--------------------------

@movie

----------------------------*/
#movie-container{
	width:100%;
	margin: 20px auto 20px;
}


/*--------------------------

@about

----------------------------*/
#about-container{
	width:100%;
}

.about-description{
	font-size: 15px;
    color: #000;
    line-height: 1.8;
    padding: 0 0 20px;
}

.about-description span.strong{
	font-size: 28px;
    color: #85001A;
	line-height:1.4;
	padding:20px 0 15px;
	display:block;
}

.about-description span.small{
	font-size:12px;
	color:#666;
}

#about-btn-container{
	width:850px;
	margin:20px auto 0;
}
#about-btn-container li{
	display:block;
	float:left;
    margin: 0px 1% 0 0;
    width: 24%;
}
#about-btn-container li .btn-1{
	font-size:13px;
}
#about-btn-container li:last-child{
	margin:0;
}



.btn-0{width:100%;}
.btn-1{width:100%;}

#footer{
	width:1024px;
	padding:30px 0 50px;
}


#sns-container{
	margin:20px 0;
}
#sns-container li{
	float:left;
	padding:0 10px 0 0;
	line-height:1;
}

.btn-1{
	color:#fff;
	background: #1e84d2;
}

.btn-1:hover{
	color:#fff;
	background: #177cca;
}

#chara-copy{
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    color: #000;
	line-height:1.8;
	width: 90%;
    margin: 0 auto 30px;
}

#chara-name{
    text-align: center;
    padding: 10px 0 0;
    color: #ea376f;
	line-height:1.2;
    font-size: 16px;
	font-weight:bold;
}
#chara-copy span{
	font-weight:normal;
}
#chara-actor{
	text-align:center;
	font-size:12px;
	padding:0 0 15px;
}

.description{
	text-align: center;
	font-weight: normal;
	/*padding: 20px 0 0 0;*/
	line-height: 1.7;
}

.movie-ttl {
    text-align: center!important;
    padding: 20px 0;
    color: #e70012;
}

@media screen and (max-width: 640px) {
html,body{
	line-height:1.7;
	font-size:12px;
	background:#000;
}

#wrapper{
	width:100%;
	margin:0 auto;
}
	
.pc-br{
	display: none;
}	
	
.sp-br{
	display: block;
}	

h1{
	font-size:20px;
	padding:0 0 5px;
}
header{
	width:100%;
	padding:0 0;
}

header a{
	width:100%;
	display:block;
	margin:0 auto;
}


#contents{
	width: 100%;
	margin: 0 auto ;
	padding: 10px 0px;
	background: #FFF;
	border-radius:0;
	-webkit-border-radius:0;
	-moz-border-radius:0;
}

#post-img-container{
	width:100%;
	padding:0 0 20px;
	float:none;
}

#post-img-container p{
	width:100%;
}

#post-txt-container{
	width:94%;
	margin:0 auto;
	padding:0;
	float:none;
}

#chara-copy{
	margin:0 auto;
}

/*--------------------------

@post-btn-container

----------------------------*/
#post-btn-container{
	width:100%;
}

#post-btn-container li{
	width: 90%;
    margin: 0 auto;
    float: none;
    padding: 0 0 5px;
    display: block;
}
#post-btn-container li:last-child{
	padding:0;
}


/*--------------------------

@movie

----------------------------*/
#movie-container{
	width:100%;
	margin:10px auto 10px;
}


/*--------------------------

@about

----------------------------*/
#about-container{
	width:94%;
	margin:0 auto;
}

.about-description{
	font-size: 13px;
    color: #000;
    line-height: 1.5;
    padding: 0 0 15px;
}

.about-description span.strong{
	font-size: 16px;
    color: #85001A;
	padding:5px 0 10px;
}
.about-description span.small{
	font-size:12px;
	color:#666;
}
#about-container p{
	font-size:14px;
	text-align:left;
	line-height:1.8;
}


#about-btn-container{
	width:94%;
	margin:10px auto 0;
	padding: 20px 0 20px;
}

#about-btn-container li{
	display:block;
	float:left;
	margin:0 10px 0 0;
	width:220px;
}
#about-btn-container li:last-child{
	margin:0;
}


#about-btn-container li{
	width:100%;
	float:none;
}

#sns-container{
	width:100%;
	margin:10px 0 20px;
}

.btn-0{width:85%;}
.btn-1{width:85%;}

#footer{
	width:100%;
	padding:10px 0;
}

#footer-inner{
	width:90%;
	padding:10px 5%;
}


}