@charset "utf-8";
html{
	overflow-y: scroll;
	scrollbar-gutter: stable;
}
#container{
	max-width: calc(100vh * 0.5);
	margin: 0 auto;
	z-index: 2;
}
#head .headWrap .hNav ul li{
	display: none;
}
#head .headWrap .hNav ul li.split{
	display: block;
}
@media screen and (max-width: 750px) {
	#container{
		max-width: 100%;
		margin: 0 auto;
		z-index: 2;
	}
}

	.split_layout{
		display: none;
	}

@media all and (min-width: 751px) {
	.split_layout{
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		background-color: #fff;
		width: 100vw;
		height: 100vh;
		overflow: hidden;
	}
	.split_left,
	.split_right{
		display: flex;
		justify-content: center;
		align-items: center;
		position: absolute;
		top: 0;
		width: calc(50% - ((100vh * 0.499) / 2));
		height: 100%;
		padding: calc(100vw * (75 / 1366)) calc(100vw * (70 / 1366));
		overflow: hidden;
		box-sizing: border-box;
	}
	.split_left{
		left: 0;
	}
	.split_right{
		right: 0;
	}
	.split_left::after,
	.split_right::after{
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		background-color: #000;
		background-repeat: no-repeat;
		background-size: cover;
		width: 100%;
		height: 100%;
		z-index: -2;
	}
	.split_left::after{
		background-image: url(../img/cp2026biscuit/bg_left_pc.jpg);
		background-position: right center;
	}
	.split_right::after{
		background-image: url(../img/cp2026biscuit/bg_right_pc.jpg);
		background-position: left center;
	}
	.split_menu_lists{
		position: relative;
		margin-bottom: min(calc(100vw * (56 / 1366)), 56px);
	}
	.split_menu_lists > li{
		position: relative;
		margin-bottom: min(calc(100vw * (24 / 1366)), 24px);
		font-family: "Instrument Serif", serif;
	}
	.split_menu_lists > li:first-letter{
		font-style: italic;
	}
	.split_menu_lists > li > a{
		font-size: min(calc(100vw * (34 / 1366)), 34px);
		color: #fff;
	}
	.split_menu_lists > li ul{
		margin-top: min(calc(100vw * (24 / 1366)), 24px);
		margin-bottom: min(calc(100vw * (24 / 1366)), 24px);
	}
	.split_menu_lists > li li{
		margin-bottom: min(calc(100vw * (12 / 1366)), 12px);
	}
	.split_menu_lists > li li a{
		font-size: min(calc(100vw * (18 / 1366)), 18px);
		color: #fff;
	}
	.split_menu .bnr{
		width: min(calc(100vw * (315 / 1366)), 315px);
	}
	.split_menu a:hover{
		opacity: .6;
	}
}
@media screen and (max-width: 1279px) {
	.split_menu{
		display: none;
	}	
}
/* common */
#head{
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease;
}
#head.is-active{
	pointer-events: auto;
	opacity: 1;
}
@media screen and (max-width: 750px) {
	#head{
		position:fixed;
		top:0;
		left:0;
		right: 0;
		width:100%;
		z-index: 100;
	}

}
@media all and (min-width: 751px) {
	.pageTop.fixed{
		position: fixed;
		margin-bottom: 0!important;
	}

	#head{
		position:fixed;
		top:0;
		left:0;
		right: 0;
		width:100%;
		max-width: calc(100vh * 0.5);
		margin: auto;
		z-index: 100;
	}
	#head .headWrap {
		background-image: url("../img/common/header_bg_sp.png");
		background-repeat: repeat-x;
		/* background-image: none;
		background-color: transparent; */
	}
	#head .headWrap{
		position: relative;
		height: inherit;
	}
	#head .headWrap h1{
		padding:3.65% 0;
	}

	#head .headWrap h1 img{
		width: 54.4%;
	}
	#head .headWrap .hNav .btnMenu{
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: 6.6%;
		margin: 5.2% 4.3% 0 0;
	}
	#head .headWrap .hNav .btnMenu a{
		display: block;
	}
	#head .headWrap .hNav .btnMenu img{
		/* width: 6.85%;*/
	}
	#head .headWrap .hNav ul{
		position: absolute;
		position: fixed;
		top: 0;
		left: 0;
		display: none;
		right:auto;
		left: 0;
		right: 0;
		top: 0;
		/* width: 23.6%; */
		margin: 4%;
		z-index: 10000;
		max-width: calc(100vh * 0.5);
		padding: calc((100vh * 0.5) * (30 / 750));
		margin: 0 auto;
		box-sizing: border-box;
		pointer-events: none;
	}
	#head .headWrap .hNav ul li{
		width: 45.198%;
		width: calc((100vh * 0.5) * (80 / 750));
		pointer-events: auto;
	}
	#head .headWrap .hNav ul li.shop{
		margin-left: 9.604%;
	}
	#head .header_line{
		/* display: none; */
		background: url("../img/common/header_line_sp.png");
		background-position: center;
		background-repeat: repeat;
		height: 4px;
	}
	#head #gNav .btnClose{
		position: fixed;
		position: absolute;
		top: 0;
		right: 0;
		display: block;
		width: 6.6%;
		margin: 4.4% 4.3% 0 0;
	}
	#head #gNav{
		display: none;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		float: none;
		width: 100%;
		height: 100%;
		margin-bottom: 0;
		z-index: 9999;
		background-color: #442212;
		max-width: calc(100vh * 0.5);
		margin: 0 auto;
	}

	#head #gNav ul{
		background: none;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		height: 0;
		margin: auto;
		/*padding-bottom: 115%*/
		padding-bottom: 73.867%;
		padding-bottom: 87.333%;
		padding-bottom: 107.333%;
		padding-bottom: 102.333%;
		font-size: 0;
		display: inherit;
		display: none;
	}
	#head #gNav ul.split{
		display: inherit;
	}
	#head #gNav ul li{
		/*margin-bottom: 30px;*/
		margin: 10.667% auto;
		width: 86.66%;
	}
	#head #gNav ul li.sp{
		display: block!important;
	}
	#head #gNav ul li.spBnr{
		display: block;
		width: 79.333%;
	}
	#foot .sns{
		display: block;
		border-top: solid 1px #fff;
		background-color: #fff;
		padding: 9% 0 0 0 ;
		font-size: 0;
	}
	#foot .sns li{
		display: inline-block;
		width: 11.2%;
		margin: 0 4%; 
		float: inherit;
	}
	#foot .sns li img{
		width: inherit;
	}

	.fWrap{
		width: 100%;
		margin: 0 auto;
		padding: 8% 0;
	}
	#fNav{
		float: none;
		margin-bottom: 7.333%;
		font-size: 0;
		text-align: center;
	}
	#fNav li{
		margin-right: 4%;
	}
	#fNav li:last-child{
		margin-right: 0;
	}
	#fNav li a{
		font-size: calc((100vh * 0.5) * (24 / 750));
	}
	#fNav li a:hover{
		opacity: 1;
	}
	.fWrap .copyright{
		float: none;
		font-size: calc((100vh * 0.5) * (20 / 750));
		text-align: center;
	}
	.fWrap .copyright a{
		float: none;
		display: block;
		width: 30.133%;
		margin: 0 auto 8%;
	}
}
/* Products List
---------------------------------------------*/
@media all and (min-width: 751px) {
	#products_link {
		padding: 60px 0 20px;
		padding: 8% 0 13.333%;
		padding: 8% 0 .1%;
	}
	#products_link_inner {
		margin: 0 auto;
		width: calc((100vh * 0.5) * (620 / 750));
		max-width: 960px;
	}
	#products_link h2 {
		margin-bottom: 3.226%;
		padding-top: 3.065%;
		height: calc((100vh * 0.5) * (64 / 750));
	}
	#products_link h2 img {
		width: 44.516%;
	}
	#products_link h2::after {
		top: calc((100vh * 0.5) * (12 / 750));
		right: calc((100vh * 0.5) * (52 / 750));
		font-size: calc((100vh * 0.5) * (35 / 750));
	}
	#products_list ul {
		margin-right: 0;
	}
	#products_list ul li {
		margin: 0 3.065% 3.065% 0;
		width: 31.290%;
	}
	#products_list ul li:nth-child(3n) {
		margin-right: 0;
	}
	#products_list ul li a:hover {
		opacity: 1;
	}
}

#mainContents{
	font-family: "Instrument Serif", serif;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 400;
}
#mainContents a{
	transition: opacity .4s;
}
#mainContents a:hover{
	opacity: .7;
}
#mainContentsWrapper picture{
	display: block;
}

.bg.js-mask-target{
	position: absolute;
	top: 0;
	left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 0;
}
.bg.js-mask-target svg{
  display: block;
	width: 99.5%;
	height: 100%;
}
#svg-mask {
  width: calc(100vw * (315 / 750));
  margin: 0 auto;
}
.mask-path {
  fill: none;
  stroke: #ffffff;
  stroke-width: 12;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 800;
  stroke-dashoffset: 800;
}
.is-active .mask-path {
  animation: draw 1.2s ease forwards;
	animation-delay: .4s;
}
@media screen and (min-width: 768px) {
}
@keyframes draw {
	to {
		stroke-dashoffset: 0;
	}
}

.kv_area{
  position: relative;
  width: 100%;
  max-width: 100%;
  height: 100%;
  overflow: hidden;
  /* opacity: 0;
  visibility: hidden; */
}
.kv_slide {
  width: 100%;
  height: 100%;
}
.kv_slide .swiper-slide {
  width: 100%;
  height: 100%;
}
.kv_slide .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
@media screen and (min-width: 768px) {
  .kv_area {
    max-width: calc((100vh * 0.5));
		height: 100vh;
  }
}

.story_area{
	position: relative;
	background-color: #8f9cb1;
}
.story_area::before{
	content: '';
	position: absolute;
	top: 0;
  left: 0;
	background-color: #8f9cb1;
	background-image: url("../img/cp2026biscuit/concept_bg.jpg");
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: cover;
  width: 100%;
  height: 100%;
	/* filter: grayscale(100%);
	transition: filter .8s ease;
	will-change: filter; */
}
/* .story_area.is-active::before{
	filter: grayscale(0%);
} */
.story_wrap{
	position: relative;
	margin: 0 auto;
	padding: calc(100vw * (240 / 750)) 0 calc(100vw * (203 / 750));
}
.story_title{
	width: calc(100vw * (570 / 750));
	margin: 0 auto;
	padding-bottom: calc(100vw * (254 / 750));
}
.story_items{
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100vw * (672 / 750));
	margin-top: calc(100vw * (98 / 750));
	margin-left: calc(100vw * (48 / 750));
}
.story_items .story_item{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}
.story_item.mov01{
	animation: movY1_sp 4s ease-in-out infinite alternate;
}
.story_item.mov02{
	animation: movY2_sp 3s ease-in-out infinite alternate;
}
.story_item.mov03{
	animation: movY3_sp 3.5s ease-in-out infinite alternate;
}
.story_text{
	font-size: calc(100vw * (24 / 750));
	color: #fff;
	letter-spacing: -0.04em;
	line-height: calc(26/12);
	text-align: center;
}
@media all and (min-width: 751px) {
	.story_wrap{
		padding: calc((100vh * 0.5) * (240 / 750)) 0 calc((100vh * 0.5) * (203 / 750));
	}
	.story_title{
		width: calc((100vh * 0.5) * (570 / 750));
		padding-bottom: calc((100vh * 0.5) * (254 / 750));
	}
	.story_items{
		width: calc((100vh * 0.5) * (672 / 750));
		margin-top: calc((100vh * 0.5) * (98 / 750));
		margin-left: calc((100vh * 0.5) * (48 / 750));
	}
	.story_item.mov01{
		animation: movY1 4s ease-in-out infinite alternate;
	}
	.story_item.mov02{
		animation: movY2 3s ease-in-out infinite alternate;
	}
	.story_item.mov03{
		animation: movY3 3.5s ease-in-out infinite alternate;
	}
	.story_text{
		font-size: calc((100vh * 0.5) * (24 / 750));
	}
}

[class*="_title"]{
	font-family: "Instrument Serif", serif;
	font-size: calc(100vw * (120 / 750));
	letter-spacing: -0.02em;
	text-align: center;
}
[class*="_title"]:first-letter{
	font-style: italic;
}
@media all and (min-width: 751px) {
	[class*="_title"]{
		font-size: calc((100vh * 0.5) * (120 / 750));
	}
}

.movie_area{
	position: relative;
	background-color: #fff;
}
.movie_wrap{
	position: relative;
	margin: 0 auto;
	padding: calc(100vw * (140 / 750)) 0 calc(100vw * (10 / 750));
}
.movie_title{
	margin-bottom: calc(100vw * (70 / 750));
}
.movie_sec{
	position: relative;
	padding-top: 20px;
	margin: 0 auto;
	margin-top: -20px;
}
.movie_box{
	position: relative;
	display: flex;
	justify-content: space-between;
	width: calc(100vw * (690 / 750));
	margin: 0 auto;
	margin-bottom: calc(100vw * (160 / 750));
}
.radio .movie_box:last-child{
	margin-bottom: 0;
}
.web .movie_box{
	width: calc(100vw * (510 / 750));
}
.movie_genre{
	font-family: "Instrument Serif", serif;
	font-size: calc(100vw * (28 / 750));
	letter-spacing: -0.02em;
	writing-mode: vertical-rl;
}
.movie_base{
	position: relative;
	width: calc(100vw * (630 / 750));
	z-index: 2;
}
.web .movie_base{
	width: calc(100vw * (450 / 750));
}
.movie_thumb{
	background-color: #fff;
}
.movie_thumb img{
	display: block;
	background-color: #fff;
	/* filter: grayscale(100%);
	transition: filter .5s ease;
	will-change: filter; */
}
/* .movie_thumb img.is-active{
	filter: grayscale(0%);
} */
.movie_ttl{
	margin: calc(100vw * (28 / 750)) auto;
	font-size: calc(100vw * (28 / 750));
	color: #fff;
	letter-spacing: -0.02em;
	text-align: center;
}
.movie_base_bg{ 
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1;
}
.tv .movie_box{
	margin-right: 0;
}
.movie_box.web01{
	flex-direction: row-reverse;
	margin-left: 0;
}
.movie_box.web02{
	margin-right: 0;
}
.making .movie_box{
	flex-direction: row-reverse;
	margin-left: 0;
}
.interview .movie_box{
	margin-right: 0;
}
.movie_box.radio01{
	flex-direction: row-reverse;
	margin-left: 0;
}
.movie_box.radio02{
	margin-right: 0;
}
.movie_box.radio03{
	flex-direction: row-reverse;
	margin-left: 0;
}
@media all and (min-width: 751px) {
	.movie_wrap{
		padding: calc((100vh * 0.5) * (140 / 750)) 0 calc((100vh * 0.5) * (10 / 750));
	}
	.movie_title{
		margin-bottom: calc((100vh * 0.5) * (70 / 750));
	}
	.movie_box{
		width: calc((100vh * 0.5) * (690 / 750));
		margin-bottom: calc((100vh * 0.5) * (160 / 750));
	}
	.web .movie_box{
		width: calc((100vh * 0.5) * (510 / 750));
	}
	.movie_genre{
		font-size: calc((100vh * 0.5) * (28 / 750));
	}
	.movie_base{
		width: calc((100vh * 0.5) * (630 / 750));
	}
	.web .movie_base{
		width: calc((100vh * 0.5) * (450 / 750));
	}
	.movie_ttl{
		margin: calc((100vh * 0.5) * (28 / 750)) auto;
		font-size: calc((100vh * 0.5) * (28 / 750));
	}
}


.talent_area{
	position: relative;
	background-color: #fff;
}
.talent_wrap{
	position: relative;
	margin: 0 auto;
	padding: calc(100vw * (140 / 750)) 0 calc(100vw * (10 / 750));
}
.talent_title{
	margin-bottom: calc(100vw * (74 / 750));
}
.talent_sec{
	position: relative;
	margin: 0 auto;
	margin-top: calc(100vw * (120 / 750));
}
.talent_sec.nakamura{
	margin-top: 0;
}
.talent_photo_wrap{
	position: relative;
	margin: 0 auto;
}
.talent_photo{
	position: relative;
	width: calc(100vw * (450 / 750));
	margin: 0 auto;
	margin-bottom: calc(100vw * (50 / 750));
	z-index: 2;
}
.talent_photo img{
	display: block;
	background-color: #fff;
	/* filter: grayscale(100%);
	transition: filter .5s ease;
	will-change: filter; */
}
/* .talent_photo img.is-active{
	filter: grayscale(0%);
} */
.talent_photo .caption{
	position: absolute;
	right: 0;
	bottom: 0;
	margin-bottom: calc(100vw * (10 / 750));
	font-size: calc(100vw * (20 / 750));
	color: #fff;
	z-index: 2;
}
.talent_photo_bg{
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
	height: calc(100vw * (315 / 750));
	margin: auto;
}
.talent_profile{
	position: relative;
	width: calc(100vw * (630 / 750));
	margin: 0 auto;
	padding: calc(100vw * (20 / 750)) 0 calc(100vw * (10 / 750));
}
.talent_name{
	margin-bottom: calc(100vw * (34 / 750));
	text-align: center;
}
.talent_name_en{
	margin-bottom: calc(100vw * (40 / 750));
	font-family: "Instrument Serif", serif;
	font-size: calc(100vw * (80 / 750));
	font-style: italic;
}
.talent_name_jp{
	border-top: solid 1px #000;
	border-bottom: solid 1px #000;
	padding: calc(100vw * (20 / 750)) 0;
	font-size: calc(100vw * (26 / 750));
}
.talent_data{
	position: relative;
	font-size: calc(100vw * (24 / 750));
	line-height: calc(20/12);
	letter-spacing: -0.04em;
}
.talent_site{
	position: relative;
	width: calc(100vw * (315 / 750));
	margin: 0 auto;
	margin-top: calc(100vw * (50 / 750));
}
.talent_site > a{
	position: relative;
	display: block;
	/* border: solid 1px #000; */
	border-radius: 50%;
	width: 100%;
	padding: calc(100vw * (34 / 750)) 0;
	margin: 0 auto;
	margin-top: calc(100vw * (50 / 750));
	font-family: "Instrument Serif", serif;
	font-size: calc(100vw * (40 / 750));
	text-align: center; 
}
.talent_site > a::after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0; 
	right: 0;
	display: block;
	background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2029.56%2013.2%22%3E%3Cpath%20d%3D%22m.85%2C7.5h21.61c-2.07%2C1.1-3.96%2C2.52-5.61%2C4.2-.33.33-.33.87%2C0%2C1.2%2C0%2C0%2C0%2C0%2C0%2C0%2C.25.33.72.4%2C1.05.15.05-.04.1-.09.15-.15%2C4.88-4.9%2C9.19-5.4%2C10.32-5.4h.49s.02-.1.03-.1h.22c.02-.1.03-.1.05-.1h.08s.03-.1.04-.1h.07c.01-.1.02-.1.03-.1h.02s.02%2C0%2C.03-.1h.04s0-.1.01-.1h.03s0-.07.01-.1h0s0-.1%2C0-.1h0s0-.07%2C0-.1h0s0-.07%2C0-.1h0s0-.1%2C0-.1h-.02c0-.1%2C0-.1-.01-.1h-.01s-.01-.1-.02-.1h-.04s-.01-.1-.02-.1h-.04s-.02-.1-.03-.1h-.08c-.01-.1-.02-.1-.04-.1h-.09s-.03-.1-.05-.1h-.26c-.02-.1-.04-.1-.05-.1h-.41c-1.14%2C0-5.44-.5-10.31-5.4-.25-.33-.72-.4-1.05-.15-.05.04-.1.09-.15.15-.33.33-.33.87%2C0%2C1.2%2C0%2C0%2C0%2C0%2C0%2C0%2C1.61%2C1.71%2C3.51%2C3.13%2C5.61%2C4.2H.85c-.5.04-.86.48-.82.98.04.43.38.77.81.82Z%22%20style%3D%22fill%3A%23000%3B%20fill-rule%3Aevenodd%3B%20stroke-width%3A0px%3B%22%2F%3E%3C%2Fsvg%3E');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	width: calc(100vw * (30 / 750));
	height: calc(100vw * (14 / 750));
	margin: auto 0;
	margin-right: calc(100vw * (24 / 750));
}
@media all and (min-width: 751px) {
	.talent_wrap{
		padding: calc((100vh * 0.5) * (140 / 750)) 0 calc((100vh * 0.5) * (10 / 750));
	}
	.talent_title{
		margin-bottom: calc((100vh * 0.5) * (74 / 750));
	}
	.talent_sec{
		margin-top: calc((100vh * 0.5) * (120 / 750));
	}
	.talent_photo{
		width: calc((100vh * 0.5) * (450 / 750));
		margin-bottom: calc((100vh * 0.5) * (50 / 750));
	}
	.talent_photo .caption{
		margin-bottom: calc((100vh * 0.5) * (10 / 750));
		font-size: calc((100vh * 0.5) * (20 / 750));
	}
	.talent_photo_bg{
		height: calc((100vh * 0.5) * (315 / 750));
	}
	.talent_profile{
		width: calc((100vh * 0.5) * (630 / 750));
		padding: calc((100vh * 0.5) * (20 / 750)) 0 calc((100vh * 0.5) * (10 / 750));
	}
	.talent_name{
		margin-bottom: calc((100vh * 0.5) * (34 / 750));
	}
	.talent_name_en{
		margin-bottom: calc((100vh * 0.5) * (40 / 750));
		font-size: calc((100vh * 0.5) * (80 / 750));
	}
	.talent_name_jp{
		padding: calc((100vh * 0.5) * (20 / 750)) 0;
		font-size: calc((100vh * 0.5) * (26 / 750));
	}
	.talent_data{
		font-size: calc((100vh * 0.5) * (24 / 750));
	}
	.talent_site{
		width: calc((100vh * 0.5) * (315 / 750));
		margin-top: calc((100vh * 0.5) * (50 / 750));
	}
	.talent_site > a{
		padding: calc((100vh * 0.5) * (34 / 750)) 0;
		margin-top: calc((100vh * 0.5) * (50 / 750));
		font-size: calc((100vh * 0.5) * (40 / 750));
		transition: all 0.4s ease!important;
	}
	.talent_site > a::after{
		width: calc((100vh * 0.5) * (30 / 750));
		height: calc((100vh * 0.5) * (14 / 750));
		margin-right: calc((100vh * 0.5) * (24 / 750));
	}
	.talent_site > a:hover{
		background-color: #000;
		color: #fff;
		opacity: 1!important;
	}
	.talent_site > a:hover::after{
	background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2029.56%2013.2%22%3E%3Cpath%20d%3D%22m.85%2C7.5h21.61c-2.07%2C1.1-3.96%2C2.52-5.61%2C4.2-.33.33-.33.87%2C0%2C1.2%2C0%2C0%2C0%2C0%2C0%2C0%2C.25.33.72.4%2C1.05.15.05-.04.1-.09.15-.15%2C4.88-4.9%2C9.19-5.4%2C10.32-5.4h.49s.02-.1.03-.1h.22c.02-.1.03-.1.05-.1h.08s.03-.1.04-.1h.07c.01-.1.02-.1.03-.1h.02s.02%2C0%2C.03-.1h.04s0-.1.01-.1h.03s0-.07.01-.1h0s0-.1%2C0-.1h0s0-.07%2C0-.1h0s0-.07%2C0-.1h0s0-.1%2C0-.1h-.02c0-.1%2C0-.1-.01-.1h-.01s-.01-.1-.02-.1h-.04s-.01-.1-.02-.1h-.04s-.02-.1-.03-.1h-.08c-.01-.1-.02-.1-.04-.1h-.09s-.03-.1-.05-.1h-.26c-.02-.1-.04-.1-.05-.1h-.41c-1.14%2C0-5.44-.5-10.31-5.4-.25-.33-.72-.4-1.05-.15-.05.04-.1.09-.15.15-.33.33-.33.87%2C0%2C1.2%2C0%2C0%2C0%2C0%2C0%2C0%2C1.61%2C1.71%2C3.51%2C3.13%2C5.61%2C4.2H.85c-.5.04-.86.48-.82.98.04.43.38.77.81.82Z%22%20style%3D%22fill%3A%23fff%3B%20fill-rule%3Aevenodd%3B%20stroke-width%3A0px%3B%22%2F%3E%3C%2Fsvg%3E');
	}
}


.music_area{
	position: relative;
	background-color: #fff;
}
.music_wrap{
	position: relative;
	margin: 0 auto;
	padding: calc(100vw * (140 / 750)) 0 calc(100vw * (10 / 750));
}
.music_title{
	margin-bottom: calc(100vw * (84 / 750));
}
.music_track{
	position: relative;
	border: solid 1px #000;
	width: calc(100vw * (570 / 750));
	margin: 0 auto;
	margin-bottom: calc(100vw * (80 / 750));
}
.music_track_wrap{
	position: relative;
	width: calc(100vw * (450 / 750));
	padding: calc(100vw * (60 / 750)) 0;
	margin: 0 auto;
}
.music_track::before{
	content: '';
	position: absolute;
	top: calc(100vw * (8 / 750));
	left: calc(100vw * (8 / 750));
	bottom: calc(100vw * (8 / 750));
	right: calc(100vw * (8 / 750));
	border: solid 1px #000;
}
.music_track_img{
	margin-bottom: calc(100vw * (30 / 750));
}
.music_track_img img{
	display: block;
	background-color: #fff;
	/* filter: grayscale(100%);
	transition: filter .5s ease;
	will-change: filter; */
}
/* .music_track_img img.is-active{
	filter: grayscale(0%);
} */
.music_track_title{
	margin-bottom: calc(100vw * (46 / 750));
	text-align: center;
}
.music_track_name{
	margin-bottom: calc(100vw * (10 / 750));
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: calc(100vw * (36 / 750));
	letter-spacing: -0.02em;
}
.music_track_name span{
	display: inline-block;
	margin-bottom: calc(100vw * (10 / 750));
	font-size: calc(100vw * (24 / 750));
}
.music_track_artist{
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: calc(100vw * (28 / 750));
	letter-spacing: -0.02em;
}
.music_track_comment{
	margin-bottom: calc(100vw * (34 / 750));
}
.music_track_comment_ttl{
	border-top: solid 1px #000;
	border-bottom: solid 1px #000;
	padding: calc(100vw * (16 / 750)) 0;
	margin-bottom: calc(100vw * (20 / 750));
	font-family: "Instrument Serif", serif;
	font-size: calc(100vw * (36 / 750));
	text-align: center;
}
.music_track_comment_txt{
	font-size: calc(100vw * (24 / 750));
	letter-spacing: -0.04em;
	line-height: calc(20/12);
}
.music_track_btn{
	position: relative;
	width: calc(100vw * (314 / 750));
	margin: 0 auto;
	margin-top: calc(100vw * (50 / 750));
}
.music_track_btn > a{
	position: relative;
	display: block;
	/* border: solid 1px #000; */
	border-radius: 50%;
	width: 100%;
	padding: calc(100vw * (34 / 750)) 0;
	margin: 0 auto;
	margin-top: calc(100vw * (50 / 750));
	font-family: "Instrument Serif", serif;
	font-size: calc(100vw * (40 / 750));
	text-align: center; 
}
.music_artist_sec{
	position: relative;
	margin: 0 auto;
}
.music_artist_photo_wrap{
	position: relative;
	margin: 0 auto;
}
.music_artist_photo{
	position: relative;
	width: calc(100vw * (450 / 750));
	margin: 0 auto;
	margin-bottom: calc(100vw * (50 / 750));
	z-index: 2;
}
.music_artist_photo img{
	display: block;
	background-color: #fff;
	/* filter: grayscale(100%);
	transition: filter .5s ease;
	will-change: filter; */
}
/* .music_artist_photo img.is-active{
	filter: grayscale(0%);
} */
.music_artist_photo_bg{
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
	height: calc(100vw * (315 / 750));
	margin: auto;
}
.music_artist_profile{
	position: relative;
	width: calc(100vw * (630 / 750));
	margin: 0 auto;
	padding: calc(100vw * (20 / 750)) 0 calc(100vw * (10 / 750));
}
.music_artist_name{
	margin-bottom: calc(100vw * (34 / 750));
	text-align: center;
}
.music_artist_name_en{
	margin-bottom: calc(100vw * (40 / 750));
	font-family: "Instrument Serif", serif;
	font-size: calc(100vw * (80 / 750));
	font-style: italic;
}
.music_artist_data{
	position: relative;
	font-size: calc(100vw * (24 / 750));
	line-height: calc(20/12);
	letter-spacing: -0.04em;
}
.music_artist_site{
	position: relative;
	width: calc(100vw * (315 / 750));
	margin: 0 auto;
	margin-top: calc(100vw * (50 / 750));
}
.music_artist_site > a{
	position: relative;
	display: block;
	/* border: solid 1px #000; */
	border-radius: 50%;
	width: 100%;
	padding: calc(100vw * (34 / 750)) 0;
	margin: 0 auto;
	margin-top: calc(100vw * (50 / 750));
	font-family: "Instrument Serif", serif;
	font-size: calc(100vw * (40 / 750));
	text-align: center; 
}
.music_artist_site > a::after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0; 
	right: 0;
	display: block;
	background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2029.56%2013.2%22%3E%3Cpath%20d%3D%22m.85%2C7.5h21.61c-2.07%2C1.1-3.96%2C2.52-5.61%2C4.2-.33.33-.33.87%2C0%2C1.2%2C0%2C0%2C0%2C0%2C0%2C0%2C.25.33.72.4%2C1.05.15.05-.04.1-.09.15-.15%2C4.88-4.9%2C9.19-5.4%2C10.32-5.4h.49s.02-.1.03-.1h.22c.02-.1.03-.1.05-.1h.08s.03-.1.04-.1h.07c.01-.1.02-.1.03-.1h.02s.02%2C0%2C.03-.1h.04s0-.1.01-.1h.03s0-.07.01-.1h0s0-.1%2C0-.1h0s0-.07%2C0-.1h0s0-.07%2C0-.1h0s0-.1%2C0-.1h-.02c0-.1%2C0-.1-.01-.1h-.01s-.01-.1-.02-.1h-.04s-.01-.1-.02-.1h-.04s-.02-.1-.03-.1h-.08c-.01-.1-.02-.1-.04-.1h-.09s-.03-.1-.05-.1h-.26c-.02-.1-.04-.1-.05-.1h-.41c-1.14%2C0-5.44-.5-10.31-5.4-.25-.33-.72-.4-1.05-.15-.05.04-.1.09-.15.15-.33.33-.33.87%2C0%2C1.2%2C0%2C0%2C0%2C0%2C0%2C0%2C1.61%2C1.71%2C3.51%2C3.13%2C5.61%2C4.2H.85c-.5.04-.86.48-.82.98.04.43.38.77.81.82Z%22%20style%3D%22fill%3A%23000%3B%20fill-rule%3Aevenodd%3B%20stroke-width%3A0px%3B%22%2F%3E%3C%2Fsvg%3E');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	width: calc(100vw * (30 / 750));
	height: calc(100vw * (14 / 750));
	margin: auto 0;
	margin-right: calc(100vw * (24 / 750));
}
@media all and (min-width: 751px) {
	.music_wrap{
		padding: calc((100vh * 0.5) * (140 / 750)) 0 calc((100vh * 0.5) * (10 / 750));
	}
	.music_title{
		margin-bottom: calc((100vh * 0.5) * (84 / 750));
	}
	.music_track{
		width: calc((100vh * 0.5) * (570 / 750));
		margin-bottom: calc((100vh * 0.5) * (80 / 750));
	}
	.music_track_wrap{
		width: calc((100vh * 0.5) * (450 / 750));
		padding: calc((100vh * 0.5) * (60 / 750)) 0;
	}
	.music_track::before{
		top: calc((100vh * 0.5) * (8 / 750));
		left: calc((100vh * 0.5) * (8 / 750));
		bottom: calc((100vh * 0.5) * (8 / 750));
		right: calc((100vh * 0.5) * (8 / 750));
	}
	.music_track_img{
		margin-bottom: calc((100vh * 0.5) * (30 / 750));
	}
	.music_track_title{
		margin-bottom: calc((100vh * 0.5) * (46 / 750));
	}
	.music_track_name{
		margin-bottom: calc((100vh * 0.5) * (10 / 750));
		font-size: calc((100vh * 0.5) * (36 / 750));
	}
	.music_track_name span{
		margin-bottom: calc((100vh * 0.5) * (10 / 750));
		font-size: calc((100vh * 0.5) * (24 / 750));
	}
	.music_track_artist{
		font-size: calc((100vh * 0.5) * (28 / 750));
	}
	.music_track_comment{
		margin-bottom: calc((100vh * 0.5) * (34 / 750));
	}
	.music_track_comment_ttl{
		padding: calc((100vh * 0.5) * (16 / 750)) 0;
		margin-bottom: calc((100vh * 0.5) * (20 / 750));
		font-size: calc((100vh * 0.5) * (36 / 750));
	}
	.music_track_comment_txt{
		font-size: calc((100vh * 0.5) * (24 / 750));
	}
	.music_track_btn{
		width: calc((100vh * 0.5) * (314 / 750));
		margin-top: calc((100vh * 0.5) * (50 / 750));
	}
	.music_track_btn > a{
		padding: calc((100vh * 0.5) * (34 / 750)) 0;
		margin-top: calc((100vh * 0.5) * (50 / 750));
		font-size: calc((100vh * 0.5) * (40 / 750));
		transition: all 0.4s ease!important;
	}
	.music_track_btn > a:hover{
		background-color: #000;
		color: #fff;
		opacity: 1!important;
	}
	.music_artist_photo{
		width: calc((100vh * 0.5) * (450 / 750));
		margin-bottom: calc((100vh * 0.5) * (50 / 750));
	}
	.music_artist_photo_bg{
		height: calc((100vh * 0.5) * (315 / 750));
	}
	.music_artist_profile{
		width: calc((100vh * 0.5) * (630 / 750));
		padding: calc((100vh * 0.5) * (20 / 750)) 0 calc((100vh * 0.5) * (10 / 750));
	}
	.music_artist_name{
		margin-bottom: calc((100vh * 0.5) * (34 / 750));
	}
	.music_artist_name_en{
		margin-bottom: calc((100vh * 0.5) * (40 / 750));
		font-size: calc((100vh * 0.5) * (80 / 750));
	}
	.music_artist_data{
		font-size: calc((100vh * 0.5) * (24 / 750));
	}
	.music_artist_site{
		width: calc((100vh * 0.5) * (315 / 750));
		margin-top: calc((100vh * 0.5) * (50 / 750));
	}
	.music_artist_site > a{
		padding: calc((100vh * 0.5) * (34 / 750)) 0;
		margin-top: calc((100vh * 0.5) * (50 / 750));
		font-size: calc((100vh * 0.5) * (40 / 750));
		transition: all 0.4s ease!important;
	}
	.music_artist_site > a::after{
		width: calc((100vh * 0.5) * (30 / 750));
		height: calc((100vh * 0.5) * (14 / 750));
		margin-right: calc((100vh * 0.5) * (24 / 750));
	}
	.music_artist_site > a:hover{
		background-color: #000;
		color: #fff;
		opacity: 1!important;
	}
	.music_artist_site > a:hover::after{
	background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2029.56%2013.2%22%3E%3Cpath%20d%3D%22m.85%2C7.5h21.61c-2.07%2C1.1-3.96%2C2.52-5.61%2C4.2-.33.33-.33.87%2C0%2C1.2%2C0%2C0%2C0%2C0%2C0%2C0%2C.25.33.72.4%2C1.05.15.05-.04.1-.09.15-.15%2C4.88-4.9%2C9.19-5.4%2C10.32-5.4h.49s.02-.1.03-.1h.22c.02-.1.03-.1.05-.1h.08s.03-.1.04-.1h.07c.01-.1.02-.1.03-.1h.02s.02%2C0%2C.03-.1h.04s0-.1.01-.1h.03s0-.07.01-.1h0s0-.1%2C0-.1h0s0-.07%2C0-.1h0s0-.07%2C0-.1h0s0-.1%2C0-.1h-.02c0-.1%2C0-.1-.01-.1h-.01s-.01-.1-.02-.1h-.04s-.01-.1-.02-.1h-.04s-.02-.1-.03-.1h-.08c-.01-.1-.02-.1-.04-.1h-.09s-.03-.1-.05-.1h-.26c-.02-.1-.04-.1-.05-.1h-.41c-1.14%2C0-5.44-.5-10.31-5.4-.25-.33-.72-.4-1.05-.15-.05.04-.1.09-.15.15-.33.33-.33.87%2C0%2C1.2%2C0%2C0%2C0%2C0%2C0%2C0%2C1.61%2C1.71%2C3.51%2C3.13%2C5.61%2C4.2H.85c-.5.04-.86.48-.82.98.04.43.38.77.81.82Z%22%20style%3D%22fill%3A%23fff%3B%20fill-rule%3Aevenodd%3B%20stroke-width%3A0px%3B%22%2F%3E%3C%2Fsvg%3E');
	}
}


.wallpaper_area{
	position: relative;
	background-color: #fff;
}
.wallpaper_wrap{
	position: relative;
	margin: 0 auto;
	padding: calc(100vw * (140 / 750)) 0 calc(100vw * (66 / 750));
}
.wallpaper_title{
	margin-bottom: calc(100vw * (46 / 750));
}
.wallpaper_dl{
	position: relative;
	width: calc(100vw * (570 / 750));
	margin: 0 auto;
}
.wallpaper_thumb{
	margin: 0 auto;
	margin-bottom: calc(100vw * (20 / 750));
}
.wallpaper_size{
	position: relative;
	margin-bottom: calc(100vw * (80 / 750));
	font-family: "Instrument Serif", serif;
	font-size: calc(100vw * (30 / 750));
	letter-spacing: -0.04em;
	text-align: center;
}
.wallpaper_btn{
	position: relative;
	width: calc(100vw * (315 / 750));
	margin: 0 auto;
	margin-top: calc(100vw * (50 / 750));
}
.wallpaper_btn > a{
	position: relative;
	display: block;
	background-color: #fff;
	/* border: solid 1px #000; */
	border-radius: 50%;
	width: 100%;
	padding: calc(100vw * (34 / 750)) 0;
	margin: 0 auto;
	margin-top: calc(100vw * (50 / 750));
	font-family: "Instrument Serif", serif;
	font-size: calc(100vw * (40 / 750));
	text-align: center; 
}
@media all and (min-width: 751px) {
	.wallpaper_wrap{
		padding: calc((100vh * 0.5) * (140 / 750)) 0 calc((100vh * 0.5) * (66 / 750));
	}
	.wallpaper_title{
		margin-bottom: calc((100vh * 0.5) * (46 / 750));
	}
	.wallpaper_dl{
		width: calc((100vh * 0.5) * (570 / 750));
	}
	.wallpaper_thumb{
		margin-bottom: calc((100vh * 0.5) * (20 / 750));
	}
	.wallpaper_size{
		margin-bottom: calc((100vh * 0.5) * (80 / 750));
		font-size: calc((100vh * 0.5) * (30 / 750));
	}
	.wallpaper_btn{
		width: calc((100vh * 0.5) * (315 / 750));
		margin-top: calc((100vh * 0.5) * (50 / 750));
	}
	.wallpaper_btn > a{
		padding: calc((100vh * 0.5) * (34 / 750)) 0;
		margin-top: calc((100vh * 0.5) * (50 / 750));
		font-size: calc((100vh * 0.5) * (40 / 750));
		transition: all 0.4s ease!important;
	}
	.wallpaper_btn > a:hover{
		background-color: #000;
		color: #fff;
		opacity: 1!important;
	}
}



.remodal.movie{
	padding: 0;
}
.remodal.movie.short{
	width: auto;
	aspect-ratio: 9 / 16;
}
.gallery_wrap .mov{
  position: relative;
  background-color: #333;
  width: 100%;
  margin: 0 auto;
  aspect-ratio: 16 / 9;
}
.short .gallery_wrap .mov{
  aspect-ratio: 9 / 16;
}
.gallery_wrap .mov iframe{
  position: absolute;
  top: 50%;
  left: 50%;
	width: 100%;
  height: 100%;
  transform: translate(-50%, -50%);
}

.remodal.movie .remodal-close {
	position: absolute;
	top: 0;
	right: 0;
	left: auto;
  font: inherit;
  display: inline-block;
  overflow: visible;
  min-width: auto;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  cursor: pointer;
  -webkit-transition: color 0.2s;
  transition: color 0.2s;
  text-align: center;
  vertical-align: middle;
  color: #fff;
  text-decoration: none;
  border: 0;
  outline: 0;
	z-index: 10;
}
.remodal.movie .remodal-close::before {
	display: none;
}
.remodal.movie .remodal-close:hover,
.remodal.movie .remodal-close:focus {
  background: transparent;
  color: #fff;
	opacity: .5;
}
.remodal.movie .remodal-close::-moz-focus-inner {
  padding: 0;
  border: 0;
}
.remodal-overlay {
  background: rgba(0, 0, 0, 0.8);
}
@media all and (max-width: 750px) {
	.remodal.movie{
		width: 94.667%;
	}
	.remodal.movie.short{
		height: 65vh;
	}
	.remodal.movie .remodal-close {
		margin-top: -8.5vw;
		font-size: 8vw;
	}
}
@media all and (min-width: 751px) {
	body{
		padding-right: 0!important;
	}
	.remodal.movie{
		max-width: 800px;
	}
	.remodal.movie.short{
		min-height: 662px;
	}
	.remodal.movie .remodal-close {
		margin-top: -42px;
		font-size: 38px;
		transition: opacity .4s;
	}
}
/* Media queries
   ========================================================================== */
@media only screen and (min-width: 641px) {
  .remodal {
    max-width: 700px;
  }
}
/* IE8
   ========================================================================== */
.lt-ie9 .remodal-overlay {
  background: rgba(255, 255, 255, 1);
}
.lt-ie9 .remodal {
  width: 800px;
}


.js-slide{
	position: relative;
	overflow: hidden;
}
.js-slide::before {
	content: "";
	position: absolute;
	left: 0;
	width: 100%;
	height: 101%;
	background-color: #000;
	z-index: 1;
	transform-origin: left top;
	transform: scale(0,1);
}
.js-slide.is-active::before {
	-webkit-animation: slide 1.2s ease 0s forwards;
	animation: slide 1.2s ease 0s forwards;
	animation-delay: 0s;
}
@keyframes slide {
	0% {
		transform-origin: left top;
		transform: scale(0,1);
	}
	49% {
		transform-origin: left top;
		transform: scale(1,1);
	}
	50% {
		transform-origin: right top;
		transform: scale(1,1);
	}
	100% {
		transform-origin: right top;
		transform: scale(0,1);
	}
}
.js-swip{
	overflow: hidden;
}
.js-swip::before {
	content: "";
	position: absolute;
	left: 0;
	width: 100%;
	height: 101%;
	background-color: #fff;
	z-index: 1;
	transform-origin: right top;
	transform: scale(1,1);
	transition-delay: .3s
}
.js-swip.is-active::before {
	-webkit-animation: swip .6s ease 0s forwards;
	animation: swip .6s ease 0s forwards;
	animation-delay: 0s
}
@keyframes swip {
	0% {
		transform-origin: right top;
		transform: scale(1,1)
	}
	100% {
		transform-origin: right top;
		transform: scale(0,1)
	}
}
.js-slide::after {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	right: 0;
	top: 0;
	background-color: #fff;
	transform-origin: right top;
	transform: scale(1,1);
	transition: transform .1s ease;
	transition-delay: .6s
}
.js-slide.is-active::after {
	transform: scale(0,1)
}

@keyframes movY1 {
	0% { transform: translateY(0) }
	50% { transform: translateY(10px) }
	to { transform: translateY(0) }
}
@keyframes movY2 {
	0% { transform: translateY(0) }
	50% { transform: translateY(15px) }
	to { transform: translateY(0) }
}
@keyframes movY3 {
	0% { transform: translateY(0) }
	50% { transform: translateY(18px) }
	to { transform: translateY(0) }
}
@keyframes movY1_sp {
	0% { transform: translateY(0) }
	50% { transform: translateY(6px) }
	to { transform: translateY(0) }
}

@keyframes movY2_sp {
	0% { transform: translateY(0) }
	50% { transform: translateY(10px) }
	to { transform: translateY(0) }
}

@keyframes movY3_sp {
	0% { transform: translateY(0) }
	50% { transform: translateY(14px) }
	to { transform: translateY(0) }
}