/* global */
*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
body {
	font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", serif;
	font-size: 1px;
	line-height: 1;
	font-weight: 400;
	color: #000;
	background-color: #ffe100;
	text-align: center;
}
h1, h3, h4, h5, h6 {
	margin: 0;
	font-weight: 400;
}
a,
a:hover,
a:focus {
	text-decoration: none;
	color: #fff;
}
figure {
	margin: 0;
}
iframe,
img {
	vertical-align: top;
	max-width: 100%;
}
button {
	cursor: pointer;
}
.wrapper {
	max-width: 850px;
	margin: 0 auto;
	display: none;
}
#header {
	padding-top: 39px;
	margin-bottom: 73px;
}
#header figure:nth-child(1) {
	padding-right: 24px;
}
#header figure:nth-child(2) {
	margin: -40px 0 -45px;
	position: relative;
	z-index: 1;
}
#header article{
	text-align: left;
	margin: 69px auto 0;
	width: 675px;
	max-width: 100%;
}
#header article .sp-only{
	display: none;
}
#header article p {
	margin-top: 26px;
}
#header article p img{
	width: 100%;
}
#main {
	margin-bottom: 25px;
}
.amazon {
	max-width: 688px;
	margin: 0 auto 72px;
}
.amazon h3 {
	margin-bottom: 2px;
}
.amazon h3 + figure {
	text-align: left;
	margin-bottom: 14px;
	padding-left: 3px;
}
.introduction .video {
	position: relative;
	cursor: pointer;
	margin-bottom: 42px;
}
.introduction .video button {
	padding: 0;
	border: 0;
	background-color: transparent;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 100%;
}
.introduction .video button:focus {
	outline: none;
}
.introduction .cast{
	text-align: left;
	width: 675px;
	max-width: 100%;
	margin: 0 auto 28px;
}
.introduction .cast .sp-only{
	display: none;
}
.introduction article{
	margin-bottom: 63px;
}
.introduction article p .sp-only{
	display: none;
}
.introduction figure {
	margin-bottom: 28px;
}
.introduction {
	margin-bottom: 24px;
	display: none;
}
.introduction.active{
	display: block;
}
.introduction h3{
	margin-bottom: 46px;
}
.introduction .airi-matsui {
	text-align: right;
    margin-top: 43px;
    margin-bottom: 44px;
    padding-right: 85px;
}
.introduction .airi-matsui img {
	width: 173px;
}
.introduction .airi-matsui.type2 {
	position: relative;
	text-align: left;
	padding-left: 85px;
}
.introduction .airi-matsui.type2 .cast2 {
	position: absolute;
	bottom: 0;
	right: 85px;
}

.introduction#episode4 .airi-matsui img {
	width: 272px;
}

.introduction#episode5 .airi-matsui,
.introduction#episode6 .airi-matsui
{
	margin-top: 48px;
}
.introduction#episode8 .airi-matsui {
	margin-top: 56px;
}
.introduction#episode5 .airi-matsui img {
	width: auto;
}
.introduction#episode6 .airi-matsui img {
	width: 290px;
}
.introduction#episode8 .airi-matsui img:first-child {
	width: 214px;
}
.documentary {
	max-width: 567px;
	margin: 63px auto 0;
}
.documentary:after {
	content: '';
	display: table;
	clear: both;
}
.documentary h3 {
	margin-bottom: 49px;
}
.documentary figure {
	width: 50%;
	float: left;
	text-align: left;
}
.documentary figure:last-child {
	padding-left: 3px;
	padding-top: 2px;
}
/* modal */
#modal {
	background: #000;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: none;
	z-index: 2010;
}
#modal .close {
	position: absolute;
	top: 20px;
	right: 20px;
	background: transparent;
	border: 0;
	width: 30px;
	height: 30px;
	padding: 0;
	z-index: 2020;
	text-indent: -999em;
}
#modal .close:before,
#modal .close:after {
	content: '';
	display: block;
	width: 40px;
	height: 1px;
	background-color: #fff;
}
#modal .close:hover:before,
#modal .close:hover:after {
	background-color: rgb(255, 225, 0);
}
#modal .close:before {
	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	     -o-transform: rotate(45deg);
	        transform: rotate(45deg);
    margin-left: -5px;
}
#modal .close:after {
	-webkit-transform: rotate(-45deg);
	   -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	     -o-transform: rotate(-45deg);
	        transform: rotate(-45deg);
    margin-top: -3px;
    margin-left: -5px;
}
#modal .close:hover,
#modal .close:focus {
	opacity: 100;
	filter: alpha(opacity=100);
	outline: none;
}
.modal-inner {
	display: table;
	width: 100%;
	height: 100%;
}
.modal-content {
	display: table-cell;
	width: 100%;
	height: 100%;
	vertical-align: middle;
}
#modal-video {
	width: 100%;
	height:80%;
	min-height: 500px;
}
#footer ul {
	padding-left: 0;
	list-style: none;
}
#tabs-nav{
	position: relative;
	margin-top: 70px;
}
#tabs-nav .sharp{
	position: absolute;
	left: 0;
}
#tabs-nav figure{
	margin-bottom: 29px;
}
#tabs-nav figure .sp-only{
	display: none;
}
#tabs-nav ol{
	list-style-type: none;
	padding: 0;
	margin: 0 -26px 71px 10px;
	overflow-y: hidden;
}
#tabs-nav ol:after{
	content: '';
	display: block;
	clear: both;
}
#tabs-nav ol li {
	display: block;
	width: 12.5%;
	float: left;
	position: relative;
}
#tabs-nav ol li:before{
	content: '';
	display: block;
	width: 34px;
	height: 34px;
	position: absolute;
	right: -16px;
	top: 5;
	bottom: 0;
	margin: auto 0;
	background-image: url('../img/numbers/slash.png');
}
#tabs-nav ol li .active_num{
	display: none;
}
#tabs-nav ol li.active .inactive_num{
	display: none;
}
#tabs-nav ol li.active .active_num{
	display: inline;
}
#tabs-nav ol li.disabled:before{
	background-image: url('../img/numbers/slash_disabled.png');
}
#tabs-nav ol li:last-child:before{
	content: none
}
footer p img{
	width:252px;
}
footer ul li:first-child img{
	width:297px;
}
footer ul li:last-child img{
	width:128px;
}
/* responsive */
@media (min-width: 768px) {
	.documentary h3 + figure > img {
		max-width: 280px;
	}
	.documentary figure:last-child > img {
		max-width: 280px;
	}
	#episode7 .documentary figure:last-child > img {
		max-width: 311px;
	}
	#footer ul {
		max-width: 495px;
		margin: 0 auto 41px;
	}
	#footer ul:after {
		content: '';
		display: table;
		clear: both;
	}
	#footer li {
		float: left;
	}
	#footer li:first-child {
		margin-right: 63px;
	}
	#footer li:last-child {
		padding-top: 4px;
	}
	#footer p {
		padding-right: 1px;
		margin-bottom: 22px;
	}
}
@media (max-width: 767px) {
	#header {
		margin-bottom: 51px;
		padding-top: 20px;
	}
	#header figure:nth-child(1) {
		padding: 0 24px 0 15px;
	}
	#header figure:nth-child(2) {
		margin: -13px 0 -20px;
		padding: 0 30px;
	}
	#header article h2 .pc-only{
		display: none;
	}
	#header article h2 .sp-only{
		display: inline;
		width:224px;
	}
	.amazon {
		padding: 0 15px;
		margin-bottom: 40px;
	}
	.amazon h3 + figure > img {
		width: 24px;
	}
	.amazon h3 {
		margin: 0 auto;
		margin-bottom:20px;
		width: 90%;
	}
	.introduction {
		margin-bottom: 34px;
	}
	.introduction h3 {
		padding: 0 20px;
		margin-bottom: 40px;
	}
	.introduction figure {
		margin-bottom: 14px;
	}
	.introduction .airi-matsui {
		padding-right: 40px;
		margin-top: 21px;
		margin-bottom: 21px;
	}
	.introduction .airi-matsui img {
		width: 87px;
	}
	.introduction .airi-matsui.type2 {
		padding-left: 40px;
	}
	.introduction#episode4 .airi-matsui img {
		width: 136px;
	}
	.introduction#episode5 .airi-matsui img:first-child {
		width: 97px;
	}
	.introduction#episode5 .airi-matsui img:last-child {
		width: 86px;
	}
	.introduction#episode6 .airi-matsui img {
		width: 145px;
	}
	.introduction#episode8 .airi-matsui img:first-child {
		width: 107px;
	}
	.introduction .airi-matsui.type2 .cast2 {
		right: 40px;
	}
	.documentary h3 {
		margin-bottom: 24px;
		padding: 0 20px;
	}
	#footer ul {
		padding: 10px 0;
	}
	#footer li {
		width: 100%;
		padding: 0 !important;
	}
	#footer li + li {
		margin-top: 35px;
	}
	#footer li:last-child{
		margin: 50px 0 50px;
	}
	#footer p{
		margin: 5px 0;
	}
	#header article{
		margin: 25px auto 0;
		padding: 0 15px;
	}
	.introduction .cast{
		padding: 0 15px;
	}
	.introduction .cast .pc-only{
		display: none;
	}
	.introduction .cast .sp-only{
		display: inline;
		width: 76px;
	}
	.introduction article{
		width: 675px;
		max-width: 100%;
		padding: 0 15px;
		margin: 0 auto 62px;
	}
	#tabs-nav{
		margin-top: 52px;
	}
	#tabs-nav figure{
		margin-bottom: 20px;
	}
	#tabs-nav figure .pc-only{
		display: none;
	}
	#tabs-nav figure .sp-only{
		display: block;
		width: 100%;
		text-align: left;
	}
	#tabs-nav figure .sp-only img{
		display: block;
	}
	#tabs-nav figure .sp-only img:first-child{
		margin-bottom: 14px;
	}
	#tabs-nav figure .sp-only img:last-child{
		width:121px;
	}
		
	#tabs-nav ol{
		margin: 0px -15px 71px 0px
	}
	#tabs-nav ol li a img{
		height: 17px;
	}
	#tabs-nav .sharp{
		height: 13px;
	}
	#tabs-nav ol li:before{
		width: 17px;
		height: 17px;
		-webkit-background-size: 100%;
		background-size: 100%;
		background-repeat: no-repeat;
		right: -8px;
	}
}
@media (max-width: 570px) {
	.documentary figure {
		float: none;
		width: auto;
		margin:auto;
		text-align: center;
	}
	.documentary h3 + figure > img {
		width: 280px;
	}
	.documentary figure:last-child {
		padding-left: 0;
		padding-top: 30px;
	}
	.documentary figure img {
		width: 220px;
	}
	#footer ul {
		padding: 0 15px;
	}
	#footer li {
		margin-top: 55px;
	}
}
@media (max-width: 414px){
	.amazon{
		padding: 0;
		width: 295px;
		max-width: 100%;
		margin: 0 auto 40px;
	}
	.introduction h3{
		padding: 0;
		width: 285px;
		max-width: 100%;
		margin: 0 auto 40px;
	}
	#header article{
		
		margin-left:5%;
		margin-right:5%;
		width: 90%;
		padding: 0;
	}
	.introduction article {
		margin-left:5%;
		margin-right:5%;
		width: 90%;
		padding: 0;
	}
	#header article p .pc-only{
		display: none;
	}
	#header article p .sp-only{
		display: inline;
	}
	.introduction article p .pc-only{
		display: none;
	}
	.introduction article p .sp-only{
		display: inline;
		width: 100%;
	}

	footer ul li:first-child img{
		width:240px;
	}
	footer ul li:last-child img{
		width:120px;
	}
}