@charset "UTF-8";
/* CSS Document */

*{
	margin:0;
	padding:0;
}
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
:root ol, :root ul {
    margin: 0 auto;
    padding: 0;
}
/*=========================================================*/
html{
	overflow-y:scroll;
}

body{
	font-weight:normal;
	text-decoration:none;
	color:#333;
	font-size:18px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height:1.4;
	word-break:break-all;
	-webkit-text-size-adjust:100%;
	min-width:1024px;
}

/*全体共通部分*/
#wrap,
#header,
#cont,
#footer,
.gra,
.btnArea,
.main_cont,
#service,
#q_a,
#payment,
#rental_service,
#online{
	overflow:hidden;
	clear:both;
}

h1,h2,h3,h4,h5,h6{
	font-weight:normal;
	font-size:18px;
	color:#333;
}

.main_cont{
	width:900px;
	margin:0 auto;
	text-align:center;
}

/* ボタンエリア */
.btnArea p a{
	text-decoration: underline;
}
.btnArea p a:hover{
	text-decoration: none;
}
.btnArea p{
	color: #061649;
	display: inline-block!important;
}
.btnArea img{
	max-width: 460px!important;
	margin: 5px auto 10px!important;
}
.btnArea .notes,#service_box_top p.notes{
	font-size: 16px;
	display: inline-block!important;
}

/* setting */
.red{color:#ff403c;}
.bold{font-weight:bold;}
.mt25{margin-top: 25px;}
.mt45{margin-top: 45px;}
.mb50{margin-bottom: 50px;}
.pb15{padding-bottom: 15px;}
a{color:#333;text-decoration:none;display: inline-block;}
a:hover{opacity: .7;text-decoration:underline;}

/*=========================================================*/
/*ヘッダー*/
	#header{
	height:auto;
	background-color:#f3f3f3;
	background-image:url(../../../img/entrance/campaign112/main_img.jpg);
	background-position:center bottom;
	background-repeat:no-repeat;
	background-size: auto 100%;
}

	#top_box{
		background-color:#001b57;
		padding-top:11px;
		padding-bottom:12px;
	}

	#header #main_title {
		background-color: rgba(255,255,255,0.9);  /* 背景の設定 */
		border: 20px solid rgba(0,23,74,.8);  /* ボーダーの設定 */
		-moz-background-clip: padding;
		-webkit-background-clip: padding;
		background-clip: padding-box;
		width:600px;
		height:auto;
		margin:20px auto 20px;
		padding: 10px 0 20px;
		line-height: 1.6;
		text-align: center;
		box-sizing: border-box;
	}

	#header #main_title img{
	max-width: 550px;
	margin: 0 auto;
	}

	#header #main_title .newMember{
	background-color: #eaedf7;
	width: 520px;
	margin: 0 auto 15px;
	padding-bottom:15px;
	text-align: center;
	color: #061649;
	}
	
	#header #main_title .newMember>p{
	font-size: 18px;
	padding-top:10px;
	}
	#header #main_title p a{
	font-size: 20px;
	color: #061649;
	text-decoration: underline;
	}
	#header #main_title p a:hover{
	text-decoration: none;
	}


/*ヘッダー TSUTAYAプレミアム追加部分*/
	img {
		max-width: 100%;
		vertical-align: middle;
		height: auto;
	}

	#top_box h1 {
		width: 1024px;
		height: 31px;
		margin: 0 auto;
	}


	#top_box h1 .btn_discas {
		border-right: 1px solid #fff;
		padding-right: 20px;
		margin-right: 15px;
	}

	#top_box h1 .btn-header {
		float: right;
	}
/*=========================================================*/
/*タブメニュー*/
#menu{
	border-bottom:1px solid #ccc;
	width: 100%;
}

#menu ul{
	width:1024px;
	overflow:hidden;
	margin:0 auto;
	display: flex;
}

#menu li{
	width:33.33%;
	display:flex;
	text-align:center;
	box-sizing:border-box;
	border-left:1px solid #ccc;
	line-height:24px;
	padding:8px 0 10px;
}

#menu li:first-child{
	border-left:0;
}

#menu li a{
	width:100%;
	padding-right:3px;
	display:block;
	background-image: url("../../../img/entrance/entrance01/arrow.png");
	background-repeat:no-repeat;
	background-position:90% 60%;
	box-sizing:border-box;
	padding-top:6px;
	align-self: center;
}



/*=========================================================*/
/*コンテンツ部分*/
#cont{
}
	/*---------------共通部分---------------*/
	
	#cont h3{
			font-size:40px;
			margin-top:65px;
			margin-bottom:20px;
		}
	
	#cont h3+p{
			font-size:20px;
			margin-bottom:35px;
		}
	#cont #online h3+p{
			margin-bottom:20px;
		}
	
	.gra{/*背景グラデーション*/
		background-image:url(../../../img/entrance/entrance01/gra.jpg);
		background-repeat:repeat-x;
		background-position:bottom center;
	}
	


/*-----サービスについて-----*/
#cont #service{
	overflow:hidden;
}

	#cont #service .service_box{
			overflow:hidden;
	}

	#cont #service .service_box #service_box_top,
	#cont #service .service_box #service_box_left,
	#cont #service .service_box #service_box_right{
			background-repeat:no-repeat;
			background-position:center top;
	}
    #cont #service #service_box_top {
    	width: 900px;
    	margin-bottom: 20px;
    	margin: 0 auto;
    	text-align: center;
	}
    #service_box_top p{
    	display:block;
	}

	#cont #service .service_box #service_box_left,
	#cont #service .service_box #service_box_right{
			width:440px;
			height:231px;
	}

	#cont #service .service_box #service_box_left{
			float:left;
			background-image: url(../../../img/entrance/entrance01/images/service_box_08.png);
	}

	#cont #service .service_box #service_box_right{
			float:right;
			background-image: url(../../../img/entrance/entrance01/images/service_box_09.png);
	}

	#cont #service .service_box #service_box_top h4,
	#cont #service .service_box #service_box_left h4,
	#cont #service .service_box #service_box_right h4,
	#cont #service .service_box #service_box_top p,
	#cont #service .service_box #service_box_left p,
	#cont #service .service_box #service_box_right p{
		display:none;
	}

	#cont #service .service_box + .btn_box
	{
		margin-top: 50px;
	}

/*-----オンライン動画-----*/
#cont #online{
}

	#cont #online .f_18{
		font-size:18px;
	}

	#cont #online .note{
		display:inline-block;
		width:680px;
		text-align:left;
		font-size: 17px;
		line-height: normal;
	}
	#cont #online ul{
		list-style-type:none;
	}

	#cont #online ul#on_list_1{
		margin-top:65px;
		overflow:hidden;
	}
		#cont #online ul#on_list_1 li{
			background-repeat:no-repeat;
			background-position:center;
			width:225px;
			height:258px;
			float:left;
			text-indent:-9999px;
		}
		
		#cont #online ul#on_list_1 li.on_li_1{
			background-image:url(../../../img/entrance/entrance01/images/online_01_b.jpg);
		}
		
		#cont #online ul#on_list_1 li.on_li_2{
			background-image:url(../../../img/entrance/entrance01/images/online_02.jpg);
		}
		
		#cont #online ul#on_list_1 li.on_li_3{
			background-image:url(../../../img/entrance/entrance01/images/online_03.jpg);
		}
		
		#cont #online ul#on_list_1 li.on_li_4{
			background-image:url(../../../img/entrance/entrance01/images/online_04.jpg);
		}
		
		#cont #online ul#on_list_1 li.on_li_5{
			background-image:url(../../../img/entrance/entrance01/images/online_05.jpg);
			height:264px;
			clear:both;
		}
		
		#cont #online ul#on_list_1 li.on_li_6{
			background-image:url(../../../img/entrance/entrance01/images/online_06.jpg);
			height:264px;
		}
		
		#cont #online ul#on_list_1 li.on_li_7{
			background-image:url(../../../img/entrance/entrance01/images/online_07.jpg);
			height:264px;
		}
		
		#cont #online ul#on_list_1 li.on_li_8{
			background-image:url(../../../img/entrance/entrance01/images/online_08.jpg);
			height:264px;
		}
		
	/*=============*/
	#cont #online h4{
		background-image:url(../../../img/entrance/entrance01/images/online_09.jpg);
		background-repeat:no-repeat;
		background-position:center;
		width:900px;
		height:74px;
		text-indent:-9999px;
	}
	
	#cont #online ul#on_list_2{
		background-image: url(../../../img/entrance/campaign112/img_handling.jpg);
		background-repeat:no-repeat;
		background-position:center;
		width:900px;
		height:400px;
	}
	
		#cont #online ul#on_list_2 li{
			text-indent:-9999px;
		}
		
	#cont #online ul#on_list_2+.btn_box {
		margin-top: 50px;
	}	
/*-----CD/DVDレンタル-----*/
#cont #rental_service{
}

	#cont #rental_service ul{
		overflow:hidden;
		list-style-type:none;
		margin-top:70px;
		display: flex;
		justify-content:center;
		align-items:flex-end;
	}

	#cont #rental_service ul li{
		background-repeat:no-repeat;
		background-position:center;
		flex-basis:225px;
		height:251px;
		text-indent:-9999px;
	}

		#cont #rental_service ul li.re_li_1{
			background-image:url(../../../img/entrance/entrance01/images/rental_01_b.jpg);
		}
	
		#cont #rental_service ul li.re_li_2{
			background-image:url(../../../img/entrance/entrance01/images/rental_02.jpg);
		}
	
		#cont #rental_service ul li.re_li_3{
			background-image:url(../../../img/entrance/entrance01/images/rental_03.jpg);
		}
	
		#cont #rental_service ul li.re_li_4{
			background-image:url(../../../img/entrance/entrance01/images/rental_04.jpg);
		}
	
	
		#cont #rental_service .flow_img{
			margin-top:45px;
			margin-bottom:35px;
		}
/*-----お支払い-----*/
#payment{
	padding-bottom:80px;
}
	
		#payment #carriers h4,
		#payment #credit h4,
		#payment #carriers ul,
		#payment #credit ul{
			background-repeat:no-repeat;
			background-position:center;
			width:445px;
			text-indent:-9999px;
		}
		
		#payment #carriers h4,
		#payment #credit h4{
			height:61px;
		}
	
		#payment #carriers ul,
		#payment #credit ul{
			height:108px;
			list-style-type:none;
		}
	
	#payment #carriers{
		float:left;
	}
	
	
		#payment #carriers h4{
			background-image:url(../../../img/entrance/entrance01/images/pay_01.png);
		}
	
		#payment #credit h4{
			background-image:url(../../../img/entrance/entrance01/images/pay_02.png);
		}
	
		#payment #carriers ul{
			background-image:url(../../../img/entrance/entrance01/images/pay_03.png);
		}
	
		#payment #credit ul{
			background-image:url(../../../img/entrance/entrance01/images/pay_04.png);
		}

		#payment #credit {
		width: 445px;
		margin: 0 auto;
		}
	

/*-----よくある質問-----*/
#cont #q_a a{
	text-decoration: underline;
}
#cont #q_a a:hover{
	text-decoration: none;
}

#cont #q_a .accordion p{
	text-align:left;
	border-top:1px solid #d6d6d6;
}

#cont #q_a .accordion {
	border-bottom:1px solid #d6d6d6;
}
	.accordion p.question {
			 cursor:pointer;
			 background-image:url(../../../img/entrance/entrance01/images/q_a_01.png);
			 background-repeat:no-repeat;
			 background-position:left top;
		 }
	.accordion p.question:hover{
	color:#ff403c;
		 }
	p.question span{
		display:block;
		padding:27px 60px;
			 background-image: url(../../../img/entrance/entrance01/q_a_accordion.png);
			 background-repeat:no-repeat;
			 background-position: right top;
		}
	p.question .open {
		}
	#cont #q_a .accordion p.question+p {
			display:none;
			border-top:1px dashed #d6d6d6;
			 background-image:url(../../../img/entrance/entrance01/images/q_a_02.png);
			 background-repeat:no-repeat;
			 background-position:left top;
			padding:27px 30px 27px 60px;
		}
		
		#cont #q_a .btn_box{
			margin-top:50px;
		}




/*=========================================================*/
/*フッター*/
#footer{
	background-color:#011c58;
}

	#footer .main_cont{
		width:960px;
	}

	#footer #page_top{
		width:70px;
		height:80px;
		float:right;
	}
		#footer #page_top a{
			text-indent:-9999px;
			width:70px;
			height:80px;
			display:block;
			background-image:url(../../../img/entrance/entrance01/page_top.gif);
			background-repeat:no-repeat;
			background-position:right center;
		}

#footer a{
	color:#fff;
}

	#footer #page_top+ul{
		margin-top:30px;
	}

	#footer ul{
		overflow:hidden;
		list-style-position:outside;
		list-style-type:none;
		margin-bottom:10px;
	}

	#footer ul li{
		float: left;
		border-left:1px solid #fff;
		overflow:hidden;
		font-size:14px;
		line-height:18px;
	}

	#footer ul li:first-child{
		border-left: none;
	}

	#footer ul li a{
		padding-left:10px;
		padding-right:10px;
		line-height:18px;
	}
	
	#footer ul li:first-child a{
		padding-left:0;
	}

	#footer ul li a:hover{
		text-decoration:underline;
	}

address{
	font-size:12px;
	color:#fff;
	font-style:normal;
	text-align:center;
	margin-top:30px;
	margin-bottom:30px;
}

.newMember .attention {
    font-size: 12px;
    text-align: left;
    padding: 0 4%;
}

.red{
color:#ff4440;
}
