@charset "utf-8";
/* CSS Document */

body{ font-family: YakuHanJP,'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', sans-serif; color: #0f0930;box-sizing: border-box;}
/*文字のインデント*/
.indentback{
  text-indent: -1em;
  padding-left: 2em;
}

/*背景 ------------------------------- */
#main {
    display: block;
    width: 100%;
    height: auto;
    min-height: 100vh;	
	background-image:url("../img/img01_pc.jpg");
    background-repeat: repeat-x , no-repeat;
    background-size:  cover;
    background-position: bottom , center;
	background-attachment: fixed;
    position: relative;
}

/*コンテンツ枠 ------------------------------- */
.wrapper { display: block; width: 100%; max-width: 1184px; height: auto; margin: 0 auto;}

.wrapperContents_low2 {
	display: block;
    background: url("../img/bg_low02.png");
	width: 96.8%;
	max-width: 1156px;
	padding: 1.6%;
}
.box { width: 100%; max-width: 1156px; height:auto;}


/*DVDバナー ---------------------------------- */
header { width: 100%; height: auto; position: relative;}
.mainImg { display: block; width: 100%; max-width:833px;  vertical-align: bottom; margin: 0 auto;}
.complete { display: block; position: absolute; bottom: 4%; left: -4%;}

.container{ background-color: #fff; padding: 3% 3%; margin-bottom: 2%;}
h2 { display: block; font-size: 30px; line-height: 1.4; color: #e95377; text-align: center; font-weight: normal; margin-bottom: 3%;}
h2 span { font-size: 22px;}
h4 {
	background-color: #e95377;
    padding: 1.6%;
    margin-bottom: 2%;
	color: #fff;
	text-align: center;
}
h4 br { display: none;}
.setImgbox { display: block; background-color: #ffe1e1; padding:2% 2% 2% 0%;}
.material { display: inline-block; vertical-align: top; width: 47.5%; padding-left: 2%; line-height: 1.4;}
.material  img { width: 100%; height:auto;}
.mt{ margin: 2% 0 0 0;}
.pb { padding: 0 0 2% 0;}
.midashi01 { background-color: #e95377; border-radius: 13px; padding: 3%; text-align: center; color: #fff; font-size: 20px; margin-bottom: 2%;}
.text{ line-height: 1.5; padding: 1% 0 0 0;}

.brb01{border-bottom: #dcdcdc 1px solid;}
.productName { display: block; font-size: 20px; line-height: 1.2; margin-top: 3%; padding-bottom: 2%; border-bottom: #dcdcdc 1px solid;}
h3 { font-size: 18px; font-weight: normal;padding: 2% 0; border-bottom: #dcdcdc 1px solid; }

.material02 { display: inline-block; vertical-align: top; width: 49%; line-height: 1.4; padding: 2% 0;}
.material03 { display: inline-block; vertical-align: top; width: 100%; line-height: 1.4; padding: 2% 0;}

.purchaseButtonbox { display: block; background-color: #c4e3c3;}
.purchaseButtonTitle { background-color: #73c571; padding: 2%; text-align: center; font-size: 18px; color: #fff; line-height: 1.4;}
.purchaseButtonbox ul { padding: 3% 1.6% 3% 3%;}
.purchaseButtonbox ul li { list-style: none; display: inline-block; margin-right: 1.4%;}


/*コンプリートエディション*/
.color02 { color: #ff7612;}
.red{ color: #F00;}
.setImgbox02 { display: block;  background-color: #fcecc5; padding:2% 2% 2% 0%;}
.midashi02 {
    background-color: #fba05e;
    border-radius: 13px;
    padding: 3%;
    color: #fff;
    font-size: 20px;
	line-height: 1.4;
    margin-bottom: 2%;
}
.productName span { display: block; font-size: 14px; line-height: 1.4;}
.text span { display: block; color: #ff5400; font-size: 14px; font-weight: bold;}
.arm { padding: 3%; line-height: 1.4;}
.textB { font-weight: bold;}
.btn { display: block;  width: 22%; height: auto; background-color: #73c571; color: #fff; font-weight: bold; border-radius: 6px; padding: 1.5%; text-align: center;text-decoration: none; }
.btn:hover { background-color: #419b3f; }

/*DVDとブルーレイ*/
.container02 { }
.containerBox{ display: inline-block; background-color: #fff; width: 45%;  padding: 2%; vertical-align: top; }
.mR01 { margin-right: 1.4%;}
.setImgbox03 {
    display: block;
    background-color: #fff;
    padding: 2% 2% 2% 0%;
}
.material04 { display: inline-block; vertical-align: top; width: 100%; line-height: 1.4; padding: 2% 0;}
.material05 { display: inline-block; vertical-align: top; width: 100%; line-height: 1.4; }
.purchaseButtonbox02 { display: block; background-color: #c4e3c3;}
.purchaseButtonbox02 ul { padding: 3% 1.6% 1.2% 3%;}
.purchaseButtonbox02 ul li {
    list-style: none;
    display: inline-block;
    margin: 0 1.4% 1.8% 0;
    width: 23.6%;
}

/*レンタル*/
.container03{ background-color: #fff; padding: 3% 3%; margin-top: 2%;}
.rental { color:#7689c7; margin-bottom: 0%; }
.cent{text-align: center;}
.cent br{ display: none;}


footer{ display:block; width: 100%; height: auto; padding: 3% 0;}
footer small { display: block; text-align: center; color: #fff; line-height: 1.4; margin-bottom: 3%;}
footer ul { text-align: center;}
footer ul li { display: inline-block;}
.purchaseButtonbox02 ul li  img { width: 100%;}

@media screen and (max-width: 768px){
	#main {background:none} /*PC用の背景はオフ*/
	body{ font-family: 'ヒラギノ角ゴ ProN W3', 'Lucida Grande', 'Hiragino Kaku Gothic ProN', sans-serif; color: #0f0930;box-sizing: border-box;}
	body::before {
	  content:"";
	  display:block;
	  position:fixed;
	  top:0;
	  left:0;
	  z-index:-1;
	  width:100%;
	  height:100vh;
	  background:url(../img/img01_sp.jpg) center/cover no-repeat; /*fixedをトル！*/
	  -webkit-background-size:cover;/*Android4*/
	  font-feature-settings : "palt"1;
	  }

	.container { padding: 4%;}
	.db { display: block!important}
	.complete { position: relative; width: 92%; max-width: 400px; margin: 0 auto; left: auto;}
	.complete img { width: 100%;}
	.wrapperContents_low2 { width: 90%; margin: 0 auto;}
	
	h4 { line-height: 1.4;}
	h4 br { display: block;}
	h2 { font-size: 1.3rem;}
	h2 span{ font-size: 0.9rem;}
	h2 br { display: none;}
	.material { width: 98%; padding-right: 2%; margin-bottom: 2%;}
	.midashi01 { font-size: 0.9rem;}
	.text  { font-size: 0.8rem;}
	
	.productName { font-size: 1.2rem;}
	.material02 ,.material03 { display: block; width: 100%; font-size: 0.8rem; line-height: 1.6;}
	.purchaseButtonTitle { font-size: 1.0rem; line-height: 1.2;}
	.purchaseButtonbox ul li { width: 31.5%;}
	.purchaseButtonbox ul li img { width: 100%;}
	.btn {  width: 64%; padding: 3%;}
	
	
	.midashi02 {font-size: 1rem;}
	
	.arm { font-size: 0.8rem; line-height: 1.6;}
	
	.containerBox { width: 92%; padding: 4%;}
	.material04 { width: 100%; font-size: 0.8rem;}
	.purchaseButtonbox02 ul li { width: 31.5%;}
	
	.cent br{ display: block;}
	
	footer small { font-size: 0.8rem; color: #000;}
	.mR01 { margin-right: auto; margin-bottom: 1%;}
}