@charset "utf-8";
/*-----------------------------------------------
 * common.css
 * レスポンシブは基本スタイルを引き継ぐ（PCファースト）
-------------------------------------------------*/
/*-----------------------------------------------
 * Reset, root
 * Bace
 * Modal
 * Header
 * Footer
 * Parts
 * Sub page
-------------------------------------------------*/
/*-----------------------------------------------
 * Reset, root
-------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,p,h1,h2,h3,h4,h5,h6,th,td,pre,code,blockquote,form,fieldset,legend,input,textarea,figcaption,figure{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#FFF}hr{display:none}img{vertical-align:bottom}select,input,button,textarea{font-size:99%}table{font-size:inherit;font:100%;border-collapse:collapse;border-spacing:0}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%}.hd{display:block;width:0;height:0;overflow:hidden}.cf:before,.cf:after{content:"";display:table}.cf:after{clear:both}.cf{*zoom:1}article,aside,details,figcaption,figure,footer,header,hgroup,hr,menu,nav,section,main{display:block}*{margin:0;padding:0;box-sizing:border-box;max-height:999999px;outline:none;}*:focus{outline: none;}button{background-color:transparent;border:none;cursor:pointer;outline:none;padding:0;}

:root {
	--common-min-width: 1200px;
	--common-min-height: 640px;

	/* メインで使用するサイズやカラー */
	--main-font-size: 16px;
	--main-font-family: 'Noto Serif JP', "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;

    /* 共通横幅 */
    --common-in-width: 1040px;

	/* header高さ */
	--common-header-height: 96px;

	/* カラー */
	--color-red: 211,47,47; /* #d32f2f（レッド） */
	--color-gold: 197,172,104; /* #c5ac68（ゴールド） */
}
@media screen and (max-width:767px){
	:root {
		--common-min-width: 100%;
		--common-min-height: auto;
		--main-font-size: 12px;

		/* 共通横幅 */
		--common-in-width: calc(100% - 48px);

		/* ヘッダーの高さ */
		--common-header-height: 60px;
	}
}

/*-----------------------------------------------
 * Bace
-------------------------------------------------*/
body{
	-webkit-text-size-adjust: 100%;
	background: #000;
	color: #fff;
	font-family: var(--main-font-family);
	font-size: var(--main-font-size);
	font-weight: normal;
	letter-spacing: 0.07em;
	line-height: 1.8;
	word-wrap: break-word;
}
a{ color: rgb(var(--color-red)); }
a:hover{ text-decoration: none; }
.ah { transition: opacity .3s ease; }
.ah:hover { opacity: .7; }
::selection{
	background: rgb(var(--color-red));
	color: #fff;
}
::-moz-selection{
	background: rgb(var(--color-red));
	color:#fff;
}
.sp{ display: none; }
.pc{ display: block; }
@media screen and (max-width:767px){
	.sp{ display: block; }
	.pc{ display: none; }
	.ah:hover { opacity: 1; }
}

/** SCROLLBAR **/
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}
::-webkit-scrollbar-track {
  border-radius: 4px;
  background: #000;
}
::-webkit-scrollbar-thumb {
	background: #d32f2f;
	border-radius: 4px;
	margin: 2px;
	box-shadow: none;
}
html{
	scrollbar-color: #d32f2f #000;
	scrollbar-width: thin;
}

/**
 * font
 */
.font-cinzel {
	font-family: "Cinzel", serif;
}
.font-alex {
	font-family: 'Alex Brush', cursive;
}

/**
 * Wrap
 * 大枠のwrap指定
 */
/* fullWrap */
#fullWrap {
	background: url(../img/common/bg/bg.jpg) no-repeat fixed center center / cover;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	position: relative;
	z-index: 1;
}
@media screen and (max-width:767px){
	#fullWrap {
		background: url(../img/common/bg/bg_sp.jpg) repeat-y center center / 100% auto;
	}
}


/*-----------------------------------------------
 * Modal
-------------------------------------------------*/

/**
 * modalBox
 * 基盤のモーダル
 */
.modalBox{
	-webkit-overflow-scrolling: touch;
	background: rgba(0,0,0,.90);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	display: none;
	width: 100%;
	height: 100%;
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
}
.oneModal{
	display: none;
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 1;
}

/* oneModalIn */
.oneModalIn{
	display: flex;
	justify-content: center;
	align-items: center;
	height: auto;
	width: 100%;
	min-height: 100%;
	margin: 0 auto;
	position: relative;
}
.oneModalIn__cont{
	padding: 50px 0;
}
@media screen and (max-width:767px){
	.oneModalIn{
		min-width: 100%;
	}
	.oneModalIn__cont{
		width: 100%;
		padding: 19.2% 0;
	}
}

/**
 * closeBtn
 */
.closeBtn{
	width: 80px;
	height: 80px;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2;
}
@media screen and (max-width:767px){
	.closeBtn{
		width: 12.8vw;
		height: 12.8vw;
	}
}
.closeBtn a{
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
}
.closeBtn_line{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	padding-top: 48px;
}
.closeBtn_line span{
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	margin: auto;
	background-color: #d32f2f;
}
.closeBtn_line span:nth-child(1){
	transform: rotate(30deg);
}
.closeBtn_line span:nth-child(2){
	transform: rotate(-30deg);
}
.closeBtn_txt{
	text-align: center;
	position: absolute;
	right: 0;
	left: 0;
	bottom: 0;
	font-size: 14px;
}

@media screen and (max-width: 767px){
	.closeBtn_line{
		padding-top: 58.3334%;
	}
	.closeBtn_txt{
		font-size: min(2.6667vw, 20px);
	}
}


/**
 * iframe
 */
/* common */
.commonIframe{
  width: 100%;
  height: 100%;
  display: block;
}

/* youtube */
.youtubeIframeWrap {
	width: 70%;
	max-width: 159.993vh;
	position: relative;
}
@media screen and (max-width:767px){
	.youtubeIframeWrap {
		width: 100%;
		max-width: 100%;
	}
}
.youtubeIframeWrap:before{
	content: "";
	display: block;
	padding-top: 56.25%;
	z-index: 0;
}
.youtubeIframe{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	display: block;
}

/* goods */
.goodsIframeWrap{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
@media screen and (max-width:767px){
    .goodsIframeWrap{
        width: 100%;
        height: 100%;
    }
}


/*-----------------------------------------------
 * Header
-------------------------------------------------*/
.header {
    width: 100%;
	height: var(--common-header-height);
	min-width: 1200px;
    position: absolute;
    top: 0;
    z-index: 999;
	transition: transform .4s ease-in-out;
}
.header.is-fixed {
	position: fixed;
}
.header:before {
	content: "";
	background-color: rgba(0,0,0,.8);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}
.header:after {
	background-image: url(../img/common/deco/deco_header_right.svg), url(../img/common/deco/deco_header_left.svg);
	background-repeat: no-repeat;
	background-position: center right, center left;
	background-size: auto;
	content: "";
	width: calc(100% - 8px);
	height: calc(100% - 8px);
	margin: auto;
	opacity: .2;
	pointer-events: none;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
}

@media screen and (max-width:1199px){
    .header {
        height: 0;
		min-width: 100%;
		position: fixed;
		top: auto !important;
		bottom: 0;
    }
	.header:before {
		background: url(../img/common/bg/header_bg.jpg) no-repeat center / cover;
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: 0;
		transform: translateX(100%);
        transition: transform .5s cubic-bezier(0.25, 1, 0.5, 1);
	}
	.header.is-active:before {
        transform: translateX(0);
    }
}

/* inner */
.header__inner {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
}
@media screen and (max-width:1199px){
    .header__inner {
        -webkit-overflow-scrolling: touch;
        width: 100%;
        height: 100%;
        overflow-x: hidden;
		overflow-y: auto;
        overscroll-behavior: contain;
        position: fixed;
        top: 0;
        left: 0;
        padding: 30px 0 60px;
        z-index: 1;
		transform: translateX(100%);
        transition: transform .5s cubic-bezier(0.25, 1, 0.5, 1);
    }
    .header.is-active .header__inner {
        transform: translateX(0);
    }
}

/**
 * headerNav
 */
.headerNav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
@media screen and (max-width:1199px){
    .headerNav {
		display: block;
		height: auto;
        position: relative;
        z-index: 1;
    }
}

/**
 * headerNavLists
 */
.headerNavLists {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: flex-end;
	width: 1000px;
	height: 100%;
	margin-left: auto;
	padding: 18px 40px 16px 0;
}
@media screen and (max-width:1199px){
	.headerNavLists {
		flex-wrap: wrap;
		justify-content: center;
		width: 100%;
		height: auto;
		margin-left: 0;
		padding: 0;
	}
}

/* item */
.headerNavLists__item {
	position: relative;
}
.headerNavLists__item:not(:first-child) {
	margin-left: 40px;
}
@media screen and (max-width:1199px){
	.headerNavLists__item {
		width: 100%;
		height: auto;
		min-width: auto;
	}
	.headerNavLists__item:not(:first-child) {
		margin-left: 0;
	}
}

/* a */
.headerNavLists__link {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	text-decoration: none;
	position: relative;
}
@media screen and (max-width:1199px){
	.headerNavLists__link {
		height: auto;
		padding: 24px 0;
	}
}

/* headerNavLists__textWrap */
.headerNavLists__textWrap {
	display: block;
	position: relative;
}

/* headerNavLists__text */
.headerNavLists__text {
	color: #fff;
	display: block;
	font-size: 16px;
	letter-spacing: 0.01em;
	line-height: 1;
	position: relative;
	z-index: 1;
	transition: color .3s ease;
	text-align: center;
}
.headerNavLists__link:hover .headerNavLists__text,
.headerNavLists__link.is-active .headerNavLists__text {
	color: rgb(var(--color-red));
}
@media screen and (max-width:1199px){
	.headerNavLists__text {
		font-size: 16px;
	}
}

/* twitter */
.headerNavLists__text.is-twitter {
	display: flex;
}
.headerNavLists__text.is-twitter:after {
	content: '';
	display: block;
	width: 20px;
	height: 18px;
	background-color: #FFF;
	margin-left: 12px;
	-webkit-mask-size: 100%;
	mask-size: 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-image: url(../../assets/img/common/icon/icon-tw.svg);
	mask-image: url(../../assets/img/common/icon/icon-tw.svg);
	transition: background-color .3s ease;
	transform: translateY(-3px);
}
.headerNavLists__link:hover .headerNavLists__text.is-twitter:after {
	background-color: rgb(var(--color-red));
}

/* blank */
.headerNavLists__text.is-blank {
	display: flex;
}
.headerNavLists__text.is-blank:after {
	content: '';
	display: block;
	width: 16px;
	height: 12px;
	background-color: #FFF;
	margin-left: 12px;
	-webkit-mask-size: 100%;
	mask-size: 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-image: url(../../assets/img/common/icon/icon_blank.svg);
	mask-image: url(../../assets/img/common/icon/icon_blank.svg);
	transition: background-color .3s ease;
	transform: translateY(2px);
}
.headerNavLists__link:hover .headerNavLists__text.is-blank:after {
	background-color: rgb(var(--color-red));
}

/* img netflix */
.headerNavLists__netflix {
	width: 60px;
}
@media screen and (max-width:1199px){
	.headerNavLists__netflix {
		width: 80px;
	}
}

/**
 * header__navLogo
 */
.header__navLogoWrap {
	margin-right: 10px;
	margin-left: 40px;
}
.header__navLogo {
	background-color: #fff;
	display: block;
	-webkit-mask: url(../img/common/logo/logo.svg) no-repeat 0 0 / 100%;
	mask: url(../img/common/logo/logo.svg) no-repeat 0 0 / 100%;
	width: 120px;
	height: 54px;
}
@media screen and (max-width:1199px){
	.header__navLogoWrap {
		display: flex;
		justify-content: center;
		margin-right: 0;
		margin-left: 0;
		margin-bottom: 8vw;
	}
	.header__navLogo {
		width: 32.13333vw;
		height: 14.4vw;
	}
}

/**
 * navBtn
 */
@media screen and (max-width:1199px){
    .header__navBtnWrap {
        width: 54px;
        height: 54px;
        position: absolute;
        bottom: 0;
        right: 0;
        z-index: 2;
    }
    .header__navBtn {
		background-color: rgb(var(--color-red));
        display: flex;
        align-items: center;
		flex-direction: column;
        justify-content: center;
        width: 100%;
        height: 100%;
        position: relative;
		text-decoration: none;
		transition: background-color .3s ease;
    }
	.header__navBtn.is-active {
		background-color: #fff;
	}
	.header__navBtn:before {
		content: "";
		background-color: rgba(255,255,255,.4);
		-webkit-mask: url(../img/common/deco/deco_menu.svg) no-repeat 0 0 / 100%;
		mask: url(../img/common/deco/deco_menu.svg) no-repeat 0 0 / 100%;
		width: 50px;
		height: 50px;
		margin: auto;
		pointer-events: none;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		transition: background-color .3s ease;
	}
	.header__navBtn.is-active:before {
		background-color: rgba(var(--color-red), .4);
	}
    .header__navBtn__lineWrap {
        width: 30px;
        height: 10px;
		margin-top: 4px;
        position: relative;
		z-index: 1;
    }
    .header__navBtn--line {
        background-color: #fff;
        display: block;
        width: 100%;
        height: 1px;
        margin: auto;
        position: absolute;
		transition: all .3s ease-in-out;
    }
	.header__navBtn.is-active .header__navBtn--line {
		background-color: rgb(var(--color-red));
	}
    .header__navBtn--line:nth-child(1) {
        top: 0;
    }
    .header__navBtn--line:nth-child(2) {
        bottom: 0;
    }

	.header__navBtn.is-active .header__navBtn--line:nth-child(1) {
		top: 5px;
		transform: rotate(30deg);
	}
	.header__navBtn.is-active .header__navBtn--line:nth-child(2) {
		bottom: 4px;
		transform: rotate(-30deg);
	}

	.header__navBtn:after {
		content: "MENU";
		color: #fff;
		font-size: 10px;
		letter-spacing: 0.01em;
		line-height: 1;
		margin-top: 8px;
		transition: all .3s ease-in-out;
		/* transform: scale(.9); */
	}
	.header__navBtn.is-active:after {
		content: "CLOSE";
		color: rgb(var(--color-red));
	}
}

/**
 * shareLists
 */
.header__shareWrap {
	display: none;
}
@media screen and (max-width:1199px){
	.header__shareWrap {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		margin-top: 50px;
	}
	/* dt */
	.header__share__dt {
		color: #fff;
		font-size: 14px;
		letter-spacing: 0.01em;
		margin-bottom: 10px;
	}

	.header__share__dd .shareLists {
		display: flex;
		gap: 10px;
	}
}


/*-----------------------------------------------
 * Footer
-------------------------------------------------*/
.footer {
	margin-top: auto;
	padding-top: 140px;
	padding-bottom: 80px;
	position: relative;
	z-index: 101;
}
@media screen and (max-width:767px){
	.footer {
		padding-top: 21.33333vw;
		padding-bottom: 74px;
	}
}

/* inner */
.footer__inner {
	margin: 0 auto;
	padding: 0 80px;
	position: relative;
}
@media screen and (max-width:767px){
	.footer__inner {
		padding: 0 3.2vw;
	}
}

/**
 * footerBnrLists
 */
.footerBnrListsWrap {
	max-width: 900px;
	margin: 0 auto 80px;
}
.footerBnrLists {
	display: flex;
	flex-wrap: wrap;
	gap: 1.66667vw 3.33333vw;
	justify-content: center;
}
@media screen and (max-width:767px){
	.footerBnrListsWrap {
		max-width: 100%;
		margin: 0 auto 10.66666vw;
	}
	.footerBnrLists {
		gap: 3.2vw;
	}
}

/* item */
.footerBnrLists__item {
    width: 240px;
}
.footerBnrLists__item img {
	width: 100%;
}
@media screen and (max-width:767px){
	.footerBnrLists__item {
		width: calc(50% - 3.2vw);
	}
}

/**
 * footerBilling
 */
.footerBilling {
	background: url(../img/common/footer/billing.png) no-repeat 0 0 / 100%;
	width: 73.33333vw;
	height: 9.33333vw;
	max-width: 880px;
	max-height: 112px;
	margin: 0 auto 100px;
}
@media screen and (max-width:767px){
	.footerBilling {
		width: 88.33333vw;
		height: 11.33333vw;
		max-width: 100%;
		max-height: inherit;
		margin: 0 auto 10.66666vw;
	}
}

/**
 * footerBottomArea
 */
@media screen and (max-width:767px){
	.footerBottomArea {
		display: flex;
	}
}

/**
 * footerShareLists
 */
.footerShareLists {
	width: 64px;
	position: absolute;
	top: 140px;
	left: 36px;
}
@media screen and (max-width:767px){
	.footerShareLists {
		width: 70%;
		position: relative;
		top: auto;
		left: auto;
	}
	.footerShareLists__item {
		display: flex;
	}
}

/* dt,dd */
.footerShareLists__dt {
	height: 62px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	letter-spacing: .05em;
}
.footerShareLists__dd {
    height: 62px;
}
@media screen and (max-width:767px){
	.footerShareLists__dt {
		font-size: 12px;
		height: auto;
		margin-right: 10px;
		padding-left: 10px;
	}
	.footerShareLists__dd {
		height:auto;
	}
	.footerShareLists__dd .shareLists {
		display: flex;
	}
}

/**
 * footerTopLinkWrap
 */
.footerTopLinkWrap {
	width: 80px;
	height: 80px;
	position: absolute;
	bottom: 0;
	right: 30px;
}
@media screen and (max-width:767px){
	.footerTopLinkWrap {
		width: 48px;
		height: 48px;
		margin-left: auto;
		position: relative;
		bottom: auto;
		right: auto;
	}
}

/* link */
.footerTopLink {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	text-decoration: none;
}
.footerTopLink:before {
	content: '';
	background-color: #fff;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	-webkit-mask: url(../img/common/footer/icon_toTop.svg)no-repeat center / contain;
	mask: url(../img/common/footer/icon_toTop.svg)no-repeat center / contain;
	transition: background-color .3s ease,
				transform .3s ease;
}
.footerTopLink:hover:before{
	background-color: rgb(var(--color-red));
	transform: rotateY(180deg);
}

/* text */
.footerTopLink__text {
	font-size: 14px;
	line-height: 1.6;
	letter-spacing: 0;
	margin-top: 10px;
	position: relative;
	text-align: center;
	z-index: 2;
}
.footerTopLink:hover .footerTopLink__text__in {
	background: linear-gradient(to bottom, rgba(var(--color-red),0) 0%,rgba(var(--color-red),0) 20%,rgba(var(--color-red),1) 20%,rgba(var(--color-red),1) 86%,rgba(var(--color-red),0) 86%,rgba(var(--color-red),0) 100%);
}
@media screen and (max-width:767px){
	.footerTopLink__text {
		font-size: 10px;
	}
}

/**
 * footerCopyright
 */
.footerCopyright {
	color: rgba(255,255,255,.4);
	display: block;
	font-size: 12px;
	letter-spacing: .025em;
	text-align: center;
}
@media screen and (max-width:767px){
	.footerCopyright {
		font-size: 10px;
		margin-top: 8vw;
	}
}


/*-----------------------------------------------
 * Parts
-------------------------------------------------*/
/**
 * text bg
 */
 .text-bg-black {
	background-position: bottom;
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 20%,rgba(0,0,0,1) 20%,rgba(0,0,0,1) 86%,rgba(0,0,0,0) 86%,rgba(0,0,0,0) 100%);
	color: #fff;
}
.text-bg-black.is-text-gold {
	color: rgb(var(--color-gold));
}
.text-bg-gold {
	background-position: bottom;
	background: linear-gradient(to bottom, rgba(var(--color-gold),0) 0%,rgba(var(--color-gold),0) 20%,rgba(var(--color-gold),1) 20%,rgba(var(--color-gold),1) 86%,rgba(var(--color-gold),0) 86%,rgba(var(--color-gold),0) 100%);
	color: #000;
}

/* indent */
.indent-1 {
	display: block;
	padding-left:1em;
	text-indent:-1em;
}
.indent-2 {
	display: block;
	padding-left:2em;
	text-indent:-2em;
}
.indent-3 {
	display: block;
	padding-left:3em;
	text-indent:-3em;
}
.indent-4 {
	display: block;
	padding-left:4em;
	text-indent:-4em;
}
.indent-5h {
	display: block;
	padding-left:5.2em;
	text-indent:-5.2em;
}

/**
 * shareLists
 */
.shareLists__item {
	width: 60px;
	height: 60px;
}
@media screen and (max-width: 767px) {
	.shareLists__item {
		width: 40px;
		height: 40px;
	}
}

/* link */
.shareLists__link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	position: relative;
	text-decoration: none;
}
.shareLists__link:before {
	content: "";
	background-color: #fff;
	display: block;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 100%;
	mask-size: 100%;
	transition: background-color .4s ease;
}
.shareLists__link:hover:before {
	background-color: rgb(var(--color-red));
}

/* 各SNSパーツ */
.shareLists__item.is-twitter .shareLists__link:before {
	width: 20px;
	height: 20px;
	-webkit-mask-image: url(../img/common/icon/icon-tw.svg);
	mask-image: url(../img/common/icon/icon-tw.svg);
}
.shareLists__item.is-facebook .shareLists__link:before {
	width: 20px;
	height: 20px;
	-webkit-mask-image: url(../img/common/icon/icon-fb.svg);
	mask-image: url(../img/common/icon/icon-fb.svg);
}
.shareLists__item.is-line .shareLists__link:before {
	width: 20px;
	height: 20px;
	-webkit-mask-image: url(../img/common/icon/icon-line.svg);
	mask-image: url(../img/common/icon/icon-line.svg);
}

/**
 * linkA
 */
.linkA {
	border-top: 1px solid rgba(255, 255, 255, 0.25);
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	position: relative;
	text-align: center;
	text-decoration: none;
	transition: background-color .3s ease;
}
.linkA:hover {
	background-color: rgb(var(--color-red));
}
@media screen and (max-width: 767px){
	.linkA:hover {
		background-color: none;
	}
}

/* deco */
.linkA:before,
.linkA:after {
	content: "";
	background-color: #fff;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 100%;
	mask-size: 100%;
	width: 22px;
	height: 42px;
	margin:  auto;
	position: absolute;
	top: 0;
	bottom: 0;
	transition: transform .3s ease;
}
@media screen and (max-width: 767px){
	.linkA:before,
	.linkA:after {
		width: 16px;
		height: 28px;
	}
}
.linkA:before {
	-webkit-mask-image: url(../img/common/deco/deco_side_left.svg);
	mask-image: url(../img/common/deco/deco_side_left.svg);
	left: -22px;
}
.linkA:after {
	-webkit-mask-image: url(../img/common/deco/deco_side_right.svg);
	mask-image: url(../img/common/deco/deco_side_right.svg);
	right: -22px;
}
.linkA:hover:before {
	transform: translateX(8px);
}
.linkA:hover:after {
	transform: translateX(-8px);
}
@media screen and (max-width: 767px){
	.linkA:before {
		left: -16px;
	}
	.linkA:after {
		right: -16px;
	}
	.linkA:hover:before {
		transform: translateX(0);
	}
	.linkA:hover:after {
		transform: translateX(0);
	}
}

/**
 * linkB
 */
.linkB {
	background-color: #fff;
	color: #000;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	font-size: min(1.33333vw,16px);
	padding: 0 40px;
	position: relative;
	text-decoration: none;
	transition: background-color .3s ease,
				color .3s ease;
}
.linkB:hover,
.linkB.is-active {
	background-color: #000;
	color: rgb(var(--color-red));
}
@media screen and (max-width:767px){
	.linkB {
		font-size: min(3.2vw,24px);
		padding: 0 3.66666vw;
	}
}

/* deco */
.linkB:before {
	content: "";
	border: 1px solid #000;
	clip-path: polygon(10px 0%, calc(100% - 10px) 0%, 100% 10px, 100% calc(100% - 10px), calc(100% - 10px) 100%, 10px 100%, 0% calc(100% - 10px), 0% 10px);
	display: block;
	width: calc(100% - 6px);
	height: calc(100% - 6px);
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 0;
	transition: background-color .3s ease,
				opacity .3s ease;
}
@media screen and (max-width:767px){
	.linkB:before {
		clip-path: polygon(6px 0%, calc(100% - 6px) 0%, 100% 6px, 100% calc(100% - 6px), calc(100% - 6px) 100%, 6px 100%, 0% calc(100% - 6px), 0% 6px);
	}
}
.linkB:after {
	content: "";
	background-color: #000;
	-webkit-mask-image: url(../img/common/deco/frame_deco_tl.svg),url(../img/common/deco/frame_deco_tr.svg),url(../img/common/deco/frame_deco_bl.svg),url(../img/common/deco/frame_deco_br.svg);
	mask-image: url(../img/common/deco/frame_deco_tl.svg),url(../img/common/deco/frame_deco_tr.svg),url(../img/common/deco/frame_deco_bl.svg),url(../img/common/deco/frame_deco_br.svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: top left, top right, bottom left, bottom right;
	mask-position: top left, top right, bottom left, bottom right;
	-webkit-mask-size: 9px;
	mask-size: 9px;
	display: block;
	width: calc(100% - 6px);
	height: calc(100% - 6px);
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	transition: background-color .3s ease,
				opacity .3s ease;
}
@media screen and (max-width:767px){
	.linkB:after{
		-webkit-mask-size: 5px;
		mask-size: 5px;
	}
}
.linkB:hover:before,
.linkB.is-active:before {
	border-color: #fff;
	opacity: .4;
}
.linkB:hover:after,
.linkB.is-active:after {
	background-color: #fff;
	opacity: .4;
}

/* in */
.linkB__in {
	display: inline-flex;
	align-items: center;
	position: relative;
	z-index: 3;
}
.linkB__in.is-blank:after {
	content: '';
	display: block;
	width: 16px;
	height: 12px;
	background-color: #000;
	margin-left: 10px;
	-webkit-mask-size: 100%;
	mask-size: 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-image: url(../../assets/img/common/icon/icon_blank.svg);
	mask-image: url(../../assets/img/common/icon/icon_blank.svg);
	transition: background-color .3s ease;
	transform: translateY(2px);
}
.linkB:hover .linkB__in.is-blank:after {
	background-color: rgb(var(--color-red));
}
@media screen and (max-width:767px){
	.linkB__in.is-blank:after {
		width: 14px;
		height: 10px;
	}
}


/* 3点リーダー */
.u-ellipsis {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* 横に120%  */
.txt-scale {
	display: block;
	-webkit-transform: scaleX(1.2);
					transform: scaleX(1.2);
}

/**
 * コンテンツタイトル
 */
.contTitle {
	margin-bottom: 80px;
	position: relative;
}
@media screen and (max-width: 767px){
	.contTitle {
		margin-bottom: min(7.6667vw, 50px);
	}
}

/* deco */
.contTitle:after {
	content: "";
	background: url(../img/common/deco/deco_clover_line.svg) no-repeat center center/contain;
	display: block;
	width: 100%;
	height: 21px;
	position: relative;
    z-index: 10;
}
@media screen and (max-width: 767px){
	.contTitle:after {
		height: min(1.73334vw, 13px);
	}
}

/* in */
.contTitle__in {
	display: flex;
	width: 100%;
	margin-bottom: 80px;
	position: relative;
}
.contTitle__in:before {
	content: "";
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	display: block;
	width: 100%;
	height: 80px;
	mix-blend-mode: difference;
	z-index: 99;
}
/* is-hedo */
.contTitle.is-hedo .contTitle__in:before {
	height: 160px;
}
@media screen and (max-width: 767px){
	.contTitle__in {
		margin-bottom: min(7.6667vw, 50px);
	}
	.contTitle__in:before {
		height: min(6.4vw, 48px);
	}
	.contTitle.is-hedo .contTitle__in:before {
		height: min(12.8vw, 96px);
	}
}

/* is-update */
.contTitle.is-update .contTitle__in:before {
	background-image: url(../img/common/title/ttl_update.svg);
}
/* is-intro */
.contTitle.is-intro .contTitle__in:before {
	background-image: url(../img/common/title/ttl_intro.svg);
}
/* is-character */
.contTitle.is-character .contTitle__in:before {
	background-image: url(../img/common/title/ttl_character.svg);
}
/* is-news */
.contTitle.is-news .contTitle__in:before {
	background-image: url(../img/common/title/ttl_news.svg);
}
/* is-staffmusic */
.contTitle.is-staffmusic .contTitle__in:before {
	background-image: url(../img/common/title/ttl_staff_music.svg);
}
/* is-world */
.contTitle.is-world .contTitle__in:before {
	background-image: url(../img/common/title/ttl_world.svg);
}
/* is-movie */
.contTitle.is-movie .contTitle__in:before {
	background-image: url(../img/common/title/ttl_movie.svg);
}
/* is-goods */
.contTitle.is-goods .contTitle__in:before {
	background-image: url(../img/common/title/ttl_goods.svg);
}
/* is-special */
.contTitle.is-special .contTitle__in:before {
	background-image: url(../img/common/title/ttl_special.svg);
}
/* is-theater */
.contTitle.is-theater .contTitle__in:before {
	background-image: url(../img/common/title/ttl_ticket_theater.svg);
}
/* is-theater */
.contTitle.is-bddvd .contTitle__in:before {
	background-image: url(../img/common/title/ttl_bddvd.svg);
}

/* text */
.contTitle__textWrap {
	display: inline-block;
	font-size: 20px;
	font-weight: 900;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 100;
}
.contTitle__text {
	padding: 0 40px;
}
@media screen and (max-width: 767px){
	.contTitle__textWrap {
		font-size: 3.73333vw;
		line-height: 1.6;
		margin-top: min(4vw, 40px);
		white-space: nowrap;
	}
	.contTitle.is-hedo .contTitle__textWrap {
		margin-top: min(6vw, 50px);
	}
	.contTitle__text {
		padding: 0 min(4vw, 40px);
	}
}

/**
 * subTitle
 */
/* en */
.subTitle__en {
	background: url(../img/common/bg/bg.jpg) no-repeat fixed center center / cover;
	display: block;
	position: relative;
}
.subTitle__en:before {
	content: "";
	display: block;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100%;
	display: block;
	margin: 0 auto;
	mix-blend-mode: soft-light;
	z-index: 1;
}

/* is-story */
.subTitle__en.is-story:before {
	background-image: url(../img/common/title/ttl_story.svg);
	width: 486px;
	height: 80px;
}
@media screen and (max-width: 767px){
	.subTitle__en.is-story:before {
		width: 39.06666vw;
		height: 6.4vw;
	}
}

/* is-music */
.subTitle__en.is-music:before {
	background-image: url(../img/common/title/ttl_music.svg);
	width: 467px;
	height: 80px;
}
@media screen and (max-width: 767px){
	.subTitle__en.is-music:before {
		width: 39.06666vw;
		height: 6.4vw;
	}
}

/* deco */
.subTitle__en:after {
	content: "";
	display: block;
	width: 78px;
	height: 24px;
	background-color: rgb(var(--color-gold));
	-webkit-mask-size: 100%;
	mask-size: 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-image: url(../../assets/img/common/deco/deco_title.svg);
	mask-image: url(../../assets/img/common/deco/deco_title.svg);
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 0;
}
@media screen and (max-width: 767px){
	.subTitle__en:after {
		width: 10.66666vw;
		height: 3.2vw;
	}
}

/* ja */
.subTitle__ja {
	color: rgb(var(--color-gold));
	display: block;
	font-size: 20px;
	font-weight: 900;
	text-align: center;
}
@media screen and (max-width: 767px){
	.subTitle__ja {
		font-size: 3.73333vw;
	}
}

/**
 * fontsize
 * 親のスタイルに依存
 */
/* 80% */
.fontsize-80per {
	font-size: 80%;
}
/* 60% */
.fontsize-60per {
	font-size: 60%;
}


/*-----------------------------------------------
 * Sub page
-------------------------------------------------*/
/**
 * loading
 */
#subLoading {
	position: fixed;
	z-index:10000;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background:#000;
}
#subLoading__clover {
	width:80px;
	height:81px;
	text-align: center;
	position: absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
}
#subLoading__clover .st0 {
	animation: loadings 1.5s linear infinite;
	stroke-dasharray: 600;
	stroke-dashoffset: 0;
	stroke-width:1;
}
@keyframes loadings {
	0% {
 stroke-dashoffset: 600;
}
50% {
	stroke-dashoffset:0;
}
100% {
	stroke-dashoffset:-600;
}
}
#subLoading.on #subLoading__clover .st0 {
	fill:#fff;
	transition:all 0.75s ease;
	stroke-width:0;
}


/**
 * main
 */
.subMain{
	display:block;
	position:relative;
	padding-top: 160px;
	padding-bottom:80px;
}
.subMain__title{
	align-items:center;
	display:flex;
	height:81px;
	justify-content:center;
	margin-bottom:180px;
	position:relative;
}
.subMain__title:before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	mix-blend-mode:difference;
}
/* news */
.subMain__title.is-news:before {
	background-image:url(../img/news/ttl_news.svg);
}

.subMain__title:after{
	background:url(../img/common/deco/deco_clover_line.svg) no-repeat center top / contain;
	bottom:-100px;
	content:'';
	height:20px;
	left:50%;
	margin-left:-87px;
	position:absolute;
	width:175px;
}
.subMain__title-ja{
	background:#000;
	display:table;
	height:20px;
	margin:0 auto;
	overflow:hidden;
	padding:0 48px;
	position:relative;
	z-index:50;
	letter-spacing:0.05em;
}
.subMain__title-ja--wide{
	color:#FFF;
	display:table;
	font-size:20px;
	font-weight:700;
	height:20px;
	line-height:1;
	transform:scale(1.2,1);
	white-space:nowrap;
}
@media screen and (max-width:768px){
	.subMain{
		padding-top: 16vw;
		padding-bottom:0;
	}
	.subMain__title{
		height:6.6666vw;
		margin-bottom:25.0666vw
	}
	.subMain__title:after{
		bottom:-14.4666vw;
		height:3.2vw;
		margin-left:-14vw;
		width:28vw
	}
	.subMain__title-ja{
		height:3.7333vw;
		padding:0 8vw;
		transform:translateY(3.8vw)
	}
	.subMain__title-ja--wide{
		font-size:3.4vw;
		height:3.7333vw
	}

	/* subMain__logoLinkWrap */
	.subMain__logoLinkWrap {
		height: 9.4666vw;
		width: 21.3333vw;
		position: absolute;
		top: 3.2vw;
		left: 3.2vw;
	}
	.subMain__logoLink {
		background-color: #fff;
		display: block;
		width: 100%;
		height: 100%;
		-webkit-mask: url(../img/common/logo/logo.svg) no-repeat center center / contain;
		mask: url(../img/common/logo/logo.svg) no-repeat center center / contain;
	}
}


.sub-fullWrap .sk1{
	display: block;
	position:absolute;
	top:80px;
	height:370px;
	left:0;
	right:0;
	background:#FFF;
	mix-blend-mode:overlay;
	transform:skewY(30deg);
	z-index:-1;
}
.sub-fullWrap .sk2{
	display: block;
	position:absolute;
	top:80px;
	height:370px;
	left:0;
	right:0;
	background:#d32f2f;
	transform:skewY(-30deg);
	z-index:-1;
}
.sub-fullWrap .sk1:before {
	content:'';
	position: absolute;
	right:0;
	top:0;
	width:100%;
	bottom:0;
	background:#7a7a7a;
	transition:all 0.3s ease;
	z-index:10;
}
.sub-fullWrap .sk2:before {
	content:'';
	position: absolute;
	top: 0;
	left:0;
	width: 100%;
	bottom: 0;
	background: #f00;
	transition: all 0.3s ease;
	filter: brightness(0.2) grayscale(1);
}
.sub-fullWrap.skon .sk2:before,
.sub-fullWrap.skon .sk1:before {
	width:0;
}

@media screen and (max-width:767px){
	.sub-fullWrap .sk1{
		top:13.6vw;
		height:49.3333vw;
	}
	.sub-fullWrap .sk2{
		top:13.6vw;
		height:49.3333vw;
	}
}

/**
 * subArticle__cont
 * pcは1040px
 */
.subArticle__cont {
	width: var(--common-in-width);
	margin: 0 auto;
}
@media screen and (max-width:1199px){
	.subArticle__cont {
		width: calc(100% - 48px);
	}
}

/**
 * tag
 */
.tagLists {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: min(2vw,24px);
	margin-bottom: 80px;
}
.tagLists__item {
	height: 48px;
}
@media screen and (max-width:767px){
	.tagLists {
		gap: 12px;
		margin-bottom: 40px;
	}
	.tagLists__item {
		height: 40px;
	}
}

/* a */
.tagLists__item a {
	background-color: #fff;
	color: #000;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	font-size: min(1.33333vw,16px);
	padding: 0 min(3.33333vw,40px);
	position: relative;
	text-decoration: none;
	transition: background-color .3s ease,
				color .3s ease;
}
.tagLists__item a:hover,
.tagLists__item a.is-active {
	background-color: #000;
	color: rgb(var(--color-red));
}
@media screen and (max-width:767px){
	.tagLists__item a {
		font-size: 12px;
		padding: 0 20px;
	}
}

/* deco */
.tagLists__item a:before {
	content: "";
	border: 1px solid #000;
	clip-path: polygon(10px 0%, calc(100% - 10px) 0%, 100% 10px, 100% calc(100% - 10px), calc(100% - 10px) 100%, 10px 100%, 0% calc(100% - 10px), 0% 10px);
	display: block;
	width: calc(100% - 6px);
	height: calc(100% - 6px);
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 0;
	transition: background-color .3s ease,
				opacity .3s ease;
}
@media screen and (max-width:767px){
	.tagLists__item a:before {
		clip-path: polygon(6px 0%, calc(100% - 6px) 0%, 100% 6px, 100% calc(100% - 6px), calc(100% - 6px) 100%, 6px 100%, 0% calc(100% - 6px), 0% 6px);
	}
}
.tagLists__item a:after {
	content: "";
	background-color: #000;
	-webkit-mask-image: url(../img/common/deco/frame_deco_tl.svg),url(../img/common/deco/frame_deco_tr.svg),url(../img/common/deco/frame_deco_bl.svg),url(../img/common/deco/frame_deco_br.svg);
	mask-image: url(../img/common/deco/frame_deco_tl.svg),url(../img/common/deco/frame_deco_tr.svg),url(../img/common/deco/frame_deco_bl.svg),url(../img/common/deco/frame_deco_br.svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: top left, top right, bottom left, bottom right;
	mask-position: top left, top right, bottom left, bottom right;
	-webkit-mask-size: 9px;
	mask-size: 9px;
	display: block;
	width: calc(100% - 6px);
	height: calc(100% - 6px);
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	transition: background-color .3s ease,
				opacity .3s ease;
}
@media screen and (max-width:767px){
	.tagLists__item a:after {
		-webkit-mask-size: 5px;
		mask-size: 5px;
	}
}
.tagLists__item a:hover:before,
.tagLists__item a.is-active:before {
	border-color: #fff;
	opacity: .4;
}
.tagLists__item a:hover:after,
.tagLists__item a.is-active:after {
	background-color: #fff;
	opacity: .4;
}

/* in */
.tagLists__item__in {
	position: relative;
	z-index: 3;
}

/**
 * paging
 */
 .paging{
	align-items:center;
	display:flex;
	justify-content:center;
	margin:0 auto;
	padding:0 140px;
	position:relative;
	font-weight:500;
	font-family:"Cinzel", serif;
}
.paging__prev{
	height:48px;
	left:0;
	margin-top:-24px;
	top:50%;
	position:absolute;
	width:96px;
}
.paging__prev-link{
	color: #fff;
	align-items:center;
	display:flex;
	height:48px;
	padding-left:36px;
	position:relative;
	transition:transform 0.3s ease;
	text-decoration: none;
}
.paging__prev-link:before{
	background:url(../img/common/deco/deco_side_left.svg) no-repeat left center / contain;
	content:'';
	height:48px;
	left:0;
	position:absolute;
	top:0;
	width:21px;
}
.paging__prev-link:hover{
	transform:translateX(-10px);
}
.paging__next{
	height:48px;
	margin-top:-24px;
	top:50%;
	position:absolute;
	right:0;
	width:96px;
}
.paging__next-link{
	color: #fff;
	align-items:center;
	display:flex;
	justify-content:flex-end;
	height:48px;
	padding-right:36px;
	position:relative;
	transition:transform 0.3s ease;
	text-decoration: none;
}
.paging__next-link:before{
	background:url(../img/common/deco/deco_side_left.svg) no-repeat left center / contain;
	content:'';
	height:48px;
	position:absolute;
	top:0;
	transform:rotate(180deg);
	right:0;
	width:21px;
}
.paging__next-link:hover{
	transform:translateX(10px);
}
.paging__numlist{
	display:flex;
	justify-content:center;
}
.paging__numlist-list{
	display:block;
	margin:0 12px;
	width:48px;
	height:48px;
}
.paging__numlist-link{
	color: #fff;
	display:flex;
	justify-content:center;
	align-items:center;
	border-top:1px solid rgba(255,255,255,.24);
	border-bottom:1px solid rgba(255,255,255,.24);
	width:48px;
	height:48px;
	transition:all 0.3s ease;
	text-decoration: none;
}
.paging__numlist-link:hover,
.paging__numlist-link--current{
	border:none;
	color:#000;
	background:#d32f2f;
}
@media screen and (max-width:767px){
	.paging{
		font-size:3.2vw;
		padding:0 0 12.8vw;
		width:87.2vw;
	}
	.paging__prev{
		bottom:0;
		height:6.4vw;
		margin-top:0;
		top:auto;
		width:24vw;
	}
	.paging__prev-link{
		height:6.4vw;
		padding-left:6.4vw;
	}
	.paging__prev-link:before{
		height:6.4vw;
		width:3.2vw;
	}
	.paging__next{
		bottom:0;
		height:6.4vw;
		margin-top:0;
		top:auto;
		width:24vw;
	}
	.paging__next-link{
		height:6.4vw;
		padding-right:6.4vw;
	}
	.paging__next-link:before{
		height:6.4vw;
		width:3.2vw;
	}
	.paging__numlist-list{
		margin:0 1.6vw;
		width:8.5333vw;
		height:8.5333vw;
	}
	.paging__numlist-link{
		width:8.5333vw;
		height:8.5333vw;
	}
}

/**
 * pageback
 */
.pageback{
	width:240px;
	margin:0 auto;
}
.pageback__link{
	color: #fff;
	align-items:center;
	display:flex;
	height:48px;
	justify-content:center;
	border-top:1px solid rgba(255,255,255,.24);
	border-bottom:1px solid rgba(255,255,255,.24);
	transition:all 0.3s ease;
	text-decoration: none;
}
.pageback__link:hover{
	border:none;
	color:#000;
	background:rgb(var(--color-red));
}
@media screen and (max-width:768px){
	.pageback{
		width:32vw;
	}
	.pageback__link{
		height:8.5333vw;
		font-size:3.2vw;
	}
}
