/* 共通
------------------- */
.pc {
	display: block;
}
.sp {
	display: none;
}

main img {
	width: 100%;
	height: auto;
}

.inner_840 {
	width: 840px;
	margin: 0 auto;
	position: relative;
}
.inner_1040 {
	width: 1040px;
	margin: 0 auto;
	position: relative;
}

.txt {
	font-size: 16px;
	line-height: 1.8em;
}

.white {
	color: #fff;
}
.gold {
	color: #BEAC61;
}

a .img-over {
	overflow: hidden;
}
	a .img-over img {
		-moz-transition: -moz-transform 0.2s linear;
		-webkit-transition: -webkit-transform 0.2s linear;
		-o-transition: -o-transform 0.2s linear;
		-ms-transition: -ms-transform 0.2s linear;
		transition: transform 0.2s linear;
	}
	a:hover .img-over img {
		-webkit-transform: scale(1.05);
		-moz-transform: scale(1.05);
		-o-transform: scale(1.05);
		-ms-transform: scale(1.05);
		transform: scale(1.05);
	}
@media screen and (max-width: 1044px) {
	.inner_840 {
		width: 90%;
	}
	.inner_1040 {
		width: 90%;
	}
	
	.txt {
		font-size: 15px;
		line-height: 1.7em;
	}
}
@media screen and (max-width: 768px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	.txt {
		font-size: 14px;
		line-height: 1.6em;
	}
}





/* pagetitle
------------------- */
#pagetitle {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 300px;
	background: #000 url("../images/ikflix/pagetitle_pht.jpg") no-repeat center;
	border-bottom: solid 1px #BEAC61;
}
@media screen and (max-width: 768px) {
	#pagetitle {
		height: 220px;
		background: #000 url("../images/ikflix/pagetitle_pht.jpg") no-repeat center / auto 100%;
	}
		#pagetitle h1 {
			width: 90%;
			max-width: 280px;
		}
}





/* read
------------------- */
#read {
	background: #000;
}
	#read .inner_840 {
		border-top: solid 25px #BEAC61;
		border-bottom: solid 1px #4F4F4F;
		padding: 40px 0;
		text-align: center;
	}
@media screen and (max-width: 1044px) {
	#read .inner_840 {
		border-top: solid 20px #BEAC61;
		padding: 35px 0;
	}
}
@media screen and (max-width: 768px) {
	#read .inner_840 {
		border-top: solid 15px #BEAC61;
		padding: 30px 0;
	}
}





/* pickup
------------------- */
#pickup {
	background: #000 url("../images/ikflix/pickup_bg.gif") repeat-x center bottom;
	padding-top: 50px;
	padding-bottom: 80px;
}
	#pickup .cell {
		display: none;
	}
	#pickup .cell.active {
		display: block;
	}
		#pickup .cell .text-pht {
			display: flex;
			justify-content: space-between;
			align-items: flex-start;
		}
			#pickup .cell .text-pht .text {
				width: 47%;
				order: 1;
			}
				#pickup .cell .text-pht .text h2 {
					font-size: 24px;
					font-weight: 700;
					line-height: 1.4em;
					padding: 10px 0 12px 0;
					text-align: center;
				}

				#pickup .cell .text-pht .text .other {
					display: flex;
					justify-content: flex-start;
					align-items: center;
					margin-top: 25px;
				}
					#pickup .cell .text-pht .text .other .match {
						font-size: 15px;
						font-weight: 700;
						margin-right: 12px;
					}
					#pickup .cell .text-pht .text .other .label {
						height: 22px;
						border: solid 1px #B9B4B3;
						border-radius: 3px;
						padding: 0 8px;
						font-size: 12px;
						font-weight: 700;
						line-height: 20px;
					}

				#pickup .cell .text-pht .text .txt {
					margin-top: 15px;
				}

			#pickup .cell .text-pht a.pht {
				display: block;
				width: 47%;
				overflow: hidden;
				order: 2;
				position: relative;
			}
			#pickup .cell .text-pht a.pht:before {
				content: "";
				width: 100%;
				height: 100%;
				background: url("../images/ikflix/icon_movie.svg") no-repeat center / 15%;
				position: absolute;
				top: 0;
				left: 0;
				z-index: 2;
				opacity: 0.9;
				pointer-events: none;
			}
@media screen and (max-width: 1044px) {
	#pickup {
		padding-top: 40px;
		padding-bottom: 60px;
	}
		#pickup .cell .text-pht .text h2 {
			font-size: 22px;
		}

		#pickup .cell .text-pht .text .other .match {
			font-size: 14px;
		}
		#pickup .cell .text-pht .text .other .label {
			font-size: 11px;
		}
}
@media screen and (max-width: 768px) {
	#pickup {
		padding-top: 40px;
		padding-bottom: 40px;
	}
		#pickup .cell .text-pht {
			display: block;
		}
			#pickup .cell .text-pht .text {
				width: 100%;
				margin-top: 20px;
			}
				#pickup .cell .text-pht .text h2 {
					font-size: 18px;
				}

				#pickup .cell .text-pht .text .other {
					margin-top: 17px;
				}
	
			#pickup .cell .text-pht a.pht {
				width: 100%;
			}
}





/* contents
------------------- */
#contents {
	background: #000 url("../images/ikflix/contents_bg.gif") repeat-x center bottom;
	padding-top: 60px;
	padding-bottom: 60px;
}
	#contents .row {
		margin-bottom: 50px;
	}
	#contents .row:nth-last-child(1) {
		margin-bottom: 0;
	}
		#contents .row h2 {
			background: url("../images/ikflix/tit_icon.svg") no-repeat left center;
			font-size: 23px;
   			font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
			font-weight: 700;
			line-height: 30px;
			padding-left: 40px;
			margin-bottom: -5px;
			position: relative;
		}
		#contents .row h2:before {
			content: "";
			height: 10px;
			border-top: solid 1px #BEAC61;
			border-bottom: solid 1px #BEAC61;
			position: absolute;
			top: 50%;
			right: 0;
			margin-top: -5px;
		}
		#contents .row:nth-child(1) h2:before {
			width: -webkit-calc(100% - 200px);
			width: calc(100% - 200px);
		}
		#contents .row:nth-child(2) h2:before {
			width: -webkit-calc(100% - 320px);
			width: calc(100% - 320px);
		}

		#contents .row .list {
			display: flex;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
		}
			#contents .row .list a.linkbox {
				display: block;
				width: 23.5%;
				margin-top: 30px;
				margin-right: 2%;
			}
			#contents .row .list a.linkbox:nth-child(4n) {
				margin-right: 0;
			}
				#contents .row .list a.linkbox .text {
					margin-top: 12px;
					padding-left: 10px;
					border-left: solid 3px #BEAC61;
				}
					#contents .row .list a.linkbox .text h3 {
						font-size: 14px;
						font-weight: 700;
						color: #fff;
					}
					#contents .row .list a.linkbox .text time {
						font-size: 12px;
						color: #fff;
					}
					#contents .row .list a.linkbox.active .text h3 {
						color: #BEAC61;
					}
					#contents .row .list a.linkbox.active .text time {
						color: #BEAC61;
					}
@media screen and (max-width: 1044px) {
	#contents {
		padding-top: 50px;
		padding-bottom: 50px;
	}
		#contents .row {
			margin-bottom: 40px;
		}
			#contents .row h2 {
				font-size: 21px;
			}
			#contents .row:nth-child(1) h2:before {
				width: -webkit-calc(100% - 180px);
				width: calc(100% - 180px);
			}
			#contents .row:nth-child(2) h2:before {
				width: -webkit-calc(100% - 280px);
				width: calc(100% - 280px);
			}

			#contents .row .list a.linkbox {
				width: 31%;
				margin-top: 30px;
				margin-right: 3.5%;
			}
			#contents .row .list a.linkbox:nth-child(4n) {
				margin-right: 3.5%;
			}
			#contents .row .list a.linkbox:nth-child(3n) {
				margin-right: 0;
			}
				#contents .row .list a.linkbox .text h3 {
					font-size: 13px;
				}
				#contents .row .list a.linkbox .text time {
					font-size: 11px;
				}
}
@media screen and (max-width: 768px) {
	#contents {
		padding-top: 40px;
		padding-bottom: 40px;
	}
		#contents .row {
			margin-bottom: 40px;
		}
			#contents .row h2 {
				font-size: 20px;
				margin-bottom: 20px;
			}
			#contents .row:nth-child(1) h2:before {
				width: -webkit-calc(100% - 160px);
				width: calc(100% - 160px);
			}
			#contents .row:nth-child(2) h2:before {
				width: -webkit-calc(100% - 260px);
				width: calc(100% - 260px);
			}

			#contents .row .scroll {
				overflow-x: scroll;
				width: 112%;
				margin-left: -20px;
			}
			#contents .row .list {
				display: inline-block;
				white-space: nowrap;
				margin-left: 6%;
			}
				#contents .row .list a.linkbox {
					display: inline-block;
					width: 150px;
					margin-top: 0;
					margin-right: 20px;
					white-space: normal;
				}
				#contents .row .list a.linkbox:nth-child(4n) {
					margin-right: 20px;
				}
				#contents .row .list a.linkbox:nth-child(3n) {
					margin-right: 20px;
				}
					#contents .row .list a.linkbox .text h3 {
						font-size: 13px;
						overflow: hidden;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
					}
					#contents .row .list a.linkbox .text time {
						font-size: 11px;
					}
}