@charset "UTF-8";
/* CSS Document */
.itembox{
	padding-top:20px;
}
.itembox::after{
	display:block;
	clear:both;
	content:"";
}
.mainimgbox{
	float:left;
	width:880px;
	padding-bottom:30px;
	border-bottom: 1px solid var(--bordergray);
}
.mainimgwrap{
	width:860px;
	position:relative;
	margin:0 auto;
	background-color:black;
}

.mainimgbox img{
	display:block;
	margin:0 auto;
}
.mainimgbox a{
	width:100%;
	height:100%;
	position: absolute;
	top:0;
	left:0;
	background-image:url("/static/img/common/movie_play_btn.png");
	background-repeat: no-repeat;
	background-position: center;
}
.paymentbox{
	width:370px;
	float:right;
}
.paymentwrap{
	background-color:var(--lightgray);
	padding:10px;
}
.couponbox{
	background-color:#FFFFFF;
	padding:20px;
	border: 1px solid var(--bordergray);
}
.couponbox a{
	display:block;
	font-size:1.8rem;
	color:var(--textcolor);
	background: rgb(211,211,211);
	background: -moz-linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	background: -webkit-linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	background: linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d3d3d3",endColorstr="#ffffff",GradientType=1);
	text-align: center;
	border: 1px solid var(--bordergray);
	border-radius:5px;
	padding:20px 15px;
	text-align: center;
	font-weight: bold;
}
.couponbox a::before{
	content:url("/static/img/common/coupon_ico.png");
	margin-right:10px;
	vertical-align: middle;
}

.variations{
	background-color:#FFFFFF;
	border: 1px solid var(--bordergray);
	margin-top:10px;
}
.variations h2{
	color:#FFFFFF;
	font-size:1.8rem;
	line-height:1em;
	display:block;
	padding:10px;
	background-color:var(--deepblue);
	text-align: center;
	margin:0;
}
.ppvbox, .photobookbox, .monthlybox, .monthlyphotobox{
	width:300px;
	margin:22px auto 0 auto;
	border: 1px solid var(--bordergray);
}
.ppvbox h3{
	color:#FFFFFF;
	font-size:1.8rem;
	line-height:1em;
	display:block;
	padding:10px;
	background-color:var(--lightblue);
	text-align: center;
	margin:0;
}
.variations form ul {
	padding:10px 10px 0 10px;
}
.variations form ul li{
	display:flex;
	border-bottom: 1px solid var(--bordergray);
	padding-bottom: 10px;
	margin-bottom:10px;
}
.variations form ul li .radiobox{
	width:15%;
}
.variations form ul li .optioninfo{
	width:85%;
	display:flex;
	flex-wrap: wrap;
	float:right;
	margin-top:-18px;
}
.variations form ul li .optioninfo .label{
	width:100%;
	font-size:1.8rem;
	font-weight: bold;
	padding-bottom: 10px;
	display:inline-block;
}
.variations form ul li .optioninfo .price_area{
	width:40%!important;
	font-size:1.8rem;
	font-weight: bold;
	color:var(--orange);
/*
	padding-bottom: 10px;
	display:inline;
*/
	text-align:right;
}
.variations form ul li .optioninfo .price table{
	width:100%;
}

.variations form ul li .optioninfo .price{
	width:100%;
	font-size:1.8rem;
	font-weight: bold;
	text-align: right;
/*
	padding-bottom: 10px;
*/
	text-align:left;
}
.variations form ul li .optioninfo .datebox{
	width:100%;
	display:flex;
}
.variations form ul li .optioninfo .datelabel{
	width:60%;
}
.variations form ul li .optioninfo .date{
	width:40%;
	text-align: right;
}
.variations form button[type=submit]{
	font-size:1.8rem;
	color:#FFF;
	font-weight: bold;
	text-align: center;
	display:block;
	margin:0 auto;
	width:280px;
	border-radius: 5px;
	padding:10px;
	background-color:var(--orange);
	border:none;
}
.variations .caution{
	padding:10px;
	font-size:1.2rem;
	line-height:1.5em;
}
.variations .caution ul li{
	display:flex;z
}
.variations .caution ul li .label{
	width:30%;
}
.variations .caution ul li .data{
	width:70%;
}
.photobookbox h3{
	color:#FFFFFF;
	font-size:1.8rem;
	line-height:1em;
	display:block;
	padding:10px;
	background-color:var(--lightblue);
	text-align: center;
	margin:0;
}
.monthlybox h3{
	color:#FFFFFF;
	font-size:1.8rem;
	line-height:1em;
	display:block;
	padding:10px;
	background-color:#F48E8D;
	text-align: center;
	margin:0;
}
.monthlybox a, 
.monthlyphotobox a{
	display:block;
	color:var(--textcolor);
	background: rgb(211,211,211);
	background: -moz-linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	background: -webkit-linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	background: linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d3d3d3",endColorstr="#ffffff",GradientType=1);
	border: 1px solid var(--bordergray);
	border-radius:5px;
	position: relative;
	margin:10px 10px 0 10px;
	padding:10px;
}
.monthlybox a::after,
.monthlyphotobox a::after{
	content:url("/static/img/common/download_ico.png");
	margin-right:10px;
	right:10px;
	top:30%;
	display: block;
	position: absolute;
}
.monthlybox a .linklabel,
.monthlyphotobox a .linklabel{
	font-size:18px;
	font-weight: bold;
}
.monthlyphotobox h3{
	color:#FFFFFF;
	font-size:1.8rem;
	line-height:1em;
	display:block;
	padding:10px;
	background-color:#F48E8D;
	text-align: center;
	margin:0;
}
.extarnal a{
	display:block;
	color:var(--textcolor);
	background: rgb(211,211,211);
	background: -moz-linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	background: -webkit-linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	background: linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d3d3d3",endColorstr="#ffffff",GradientType=1);
	border: 1px solid var(--bordergray);
	border-radius:5px;
	position: relative;
	margin:10px 10px 0 10px;
	padding:10px;
	text-align: center;
}
.extarnal{
	padding:10px;
}
.extarnal ul li{
	padding-top:10px;
}
.userbox{
	padding:10px;
}
.userwrap{
	padding:10px;
	background-color:#FFFFFF;
}
.userbox a{
	display:block;
	color:var(--textcolor);
	background: rgb(211,211,211);
	background: -moz-linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	background: -webkit-linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	background: linear-gradient(0deg, rgba(211,211,211,1) 0%, rgba(255,255,255,1) 70%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d3d3d3",endColorstr="#ffffff",GradientType=1);
	border: 1px solid var(--bordergray);
	border-radius:5px;
	position: relative;
	margin:10px 10px 0 10px;
	padding:10px 10px;
	text-align: center;
	position:relative;
}
.userbox a.ico_favorite::before{
	position:absolute;
	content:url("/static/img/common/favorite_ico.png");
	left:10px;
	top:8px;
}
.userbox a.ico_review::before{
	position:absolute;
	content:url("/static/img/common/writereview_ico.png");
	left:10px;
	top:8px;
}

.iteminfo {
    width: 880px;
    float: left;
    padding-top: 30px;
	line-height: 1.7em;
}
.iteminfo .textinfo .title{
	padding: 0 1em;
}


.iteminfo .textinfo .description {
	margin-top: 20px;
    border-bottom: 1px solid var(--bordergray);
	padding: 0 1em 20px 1em;
}

.iteminfo .specbox {
	padding-bottom: 30px;
    border-bottom: 1px solid var(--bordergray);
}
.iteminfo .specbox {
	padding-bottom: 30px;
    border-bottom: 1px solid var(--bordergray);
}
.iteminfo .modelprofielbox {
	padding-bottom: 30px;
    border-bottom: 1px solid var(--bordergray);
}
.iteminfo .sampleimagebox {
	padding-bottom: 30px;
    border-bottom: 1px solid var(--bordergray);
}
.iteminfo ul {
    margin-top: 20px;
}

.iteminfo ul li {
    display: flex;
    margin-left:10px;
    margin-right:10px;
}

.iteminfo ul li .label {
    width: 20%;
}

.iteminfo ul li .data {
    width: 100%;
}

.iteminfo ul li ul {
    margin-top: 0;
}

.iteminfo ul li ul li .label {
    width: 10%;
}

.iteminfo ul li ul li .data {
    width: 90%;
}
.iteminfo .sampleimagebox ul{
/*
	display: -webkit-box;
*/
	display: ruby;
	flex-wrap: wrap;
	justify-content: space-between;
}
.iteminfo .sampleimagebox ul li{
/*
	width:200px;
*/
	width:180px;
	padding-bottom:30px;
}
.iteminfo .sampleimagebox ul li img{
	width:200px;
/*
	height:112px;
*/
	height:auto;
}
.reviewbox{
	padding-top:30px;
	padding-bottom: 30px;
    border-bottom: 1px solid var(--bordergray);
}
.reviewwrap {
	background-color: var(--lightgray);padding: 30px;
}
.reviewbox h2 {
    margin-top: 0;
}

.iteminfo .reviewbox ul li {
    display: block;
    margin-top: 20px;
}

.reviewbox ul li .rating {
    color: var(--orange);
}

.reviewbox ul li .meta {
    color: #707070;
    font-size: 1.2rem;
}

.reviewbox ul li .meta::before {
    content: "by ";
}

.reviewbox ul li .meta .user {
	padding-right: 1em;
}
.relebant{
	clear:both;
	padding-top:1px;
}
@media screen and (max-width:599px){
.mainimgbox {
    float: none;
    width: 100%;
    padding-bottom: 0;
    border-bottom: none;
}

.mainimgwrap {
    width: 100%;
}

.mainimgbox img {
    width: 100%;
}

.contentsnavi {
    padding-top: var(--fsbase);
}

.contentsnavi ul {
    display: flex;
    padding: var(--fsbase);
}

.contentsnavi ul li {
    width: 50%;
    padding: 1rem;
}

.contentsnavi ul li a {
    border: 1px solid var(--lightblue);
    padding: 10px;
    text-align: center;
    /* width: 100%; */
    display: block;
}

.paymentbox {
    width: 100%;
    float: none;
}

.iteminfo {
    width: 100%;
    float: none;
}

.iteminfo h1 {
    line-height: 1.2em;
}

.specbox, .modelprofielbox, .sampleimagebox, .reviewbox {
    padding-left: 1rem;
    padding-right: 1rem;
}

.sampleimagebox {
    padding-left: 0;
    padding-right: 0;
}

.iteminfo .sampleimagebox ul {
    display: block;
}

.iteminfo .sampleimagebox ul li {
    float: left;
    width: 33%;
    padding-left: 1rem;
    padding-bottom: 1rem;
    padding-right: 1rem;
    box-sizing: border-box;
}

.iteminfo .sampleimagebox ul li img {
    width: 100%;
    height: auto;
}

.iteminfo .sampleimagebox ul::after {
    content: "";
    display: block;
    clear: both;
}

.iteminfo .sampleimagebox h2 {
    padding-left: 1rem;
}

.iteminfo ul li .label {
    width: 35%;
}

.iteminfo ul li .data {
    width: 65%;
}

.iteminfo ul li ul li .label {
    width: 25%;
}

.iteminfo ul li ul li .data {
    width: 75%;
}

.relebant h2 {
    padding-left: 1rem;
}
}





/* --- 商品タイトルの行間調整（追記） --- */
.iteminfo .title h1 {
	line-height: 1.3; /* 行の高さをフォントサイズの1.5倍に設定 */
}