@charset "utf-8";


@font-face {
    font-family: "YakuHanJP";
    font-style: normal;
    font-weight: 300;
    src: url("../fonts/YakuHanJP/YakuHanJP-Light.woff2") format("woff2"),
    url("../fonts/YakuHanJP/YakuHanJP-Light.woff") format("woff");
}

@font-face {
    font-family: "YakuHanJP";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/YakuHanJP/YakuHanJP-Regular.woff2") format("woff2"),
    url("../fonts/YakuHanJP/YakuHanJP-Regular.woff") format("woff");
}

@font-face {
    font-family: "YakuHanJP";
    font-style: normal;
    font-weight: 500;
    src: url("../fonts/YakuHanJP/YakuHanJP-Medium.woff2") format("woff2"),
    url("../fonts/YakuHanJP/YakuHanJP-Medium.woff") format("woff");
}

@font-face {
    font-family: "YakuHanJP";
    font-style: normal;
    font-weight: 700;
    src: url("../fonts/YakuHanJP/YakuHanJP-bold.woff2") format("woff2"),
    url("../fonts/YakuHanJP/YakuHanJP-bold.woff") format("woff");
}

@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W0);
  font-weight: 100;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W1);
  font-weight: 200;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W2);
  font-weight: 300;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W3);
  font-weight: 400;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W4);
  font-weight: 500;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W5);
  font-weight: 600;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W6);
  font-weight: 700;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W7);
  font-weight: 800;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W8);
  font-weight: 900;
}
@font-face {
  font-family: "Hiragino Sans W9";
  src: local(HiraginoSans-W9);
  font-weight: 900;
}


* {
	margin: 0;
	padding: 0;
	/*-webkit-backface-visibility: hidden;*/
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: none;
	height: 100%;
}

body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	font-weight: 500;
	font-size: 15px;
	font-family: YakuHanJP, "IBM Plex Sans JP", "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', 'Noto Sans JP', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-feature-settings: 'palt' 1;
	text-align: center;
	line-height: 2;
	-webkit-font-smoothing: antialiased;
	letter-spacing: 0.08em;
	color: #c7c6cb;
	background: #000;
}

body.is-scrollLock {
	position: fixed;
	left: 0;
	width: 100%;
	overflow-y: scroll;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	padding: 0;
	margin: 0;
	font-weight: 500;
}

ul,
ol {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

p {
	padding: 0;
	margin: 0;
}

img {
	width: 100%;
	-webkit-touch-callout: none;
	-ms-interpolation-mode: bicubic;
	vertical-align: bottom;
}

a {
	word-break: break-all;
	text-decoration: underline;
	color: #c7c6cb;
	outline: none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	-webkit-transition: 0.4s cubic-bezier(.57,0,.26,1);
	transition: 0.4s cubic-bezier(.57,0,.26,1);
}

button {
	outline: none;
	border: none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}

a:active,
a:hover,
a:focus {
	outline: none;
}

@media (any-hover: hover) {
	a:hover {
		opacity: .4;
	}
}

table {
	border-collapse: collapse;
}

.wrapper ::before,
.wrapper ::after {
	font-family: "IBM Plex Sans JP", "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', 'Noto Sans JP', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-feature-settings: normal;
}


@-webkit-keyframes fadeIn {
	0% { opacity: 0;}
	100% { opacity: 1;}
}

@keyframes fadeIn {
	0% { opacity: 0;}
	100% { opacity: 1;}
}

/*--------------------------------------
loading
--------------------------------------*/


.loading {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: url(../images/common/noise.png) center center rgba(34, 35,38, 1);
	z-index: 5000;
}

.loading p {
	margin: -20px 0 0 -20px;
	padding-top: 40px;
	overflow: hidden;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 42px;
	height: 0;
	border: 1px solid #c7c6cb;
	border-radius: 50%;
	border-top-color: transparent;
	animation: spin 0.75s infinite linear;
	z-index: 5002;
}

@keyframes spin {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}


.loading::before {
	content: "";
	margin: -20px 0 0 -20px;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 40px;
	height: 40px;
	border: 1px solid rgba(199, 199, 204, .2);
	border-radius: 50%;
	z-index: 5001;
}

/*--------------------------------------
コンテンツ
--------------------------------------*/
.wrapper {
	padding-top: 100vh;
	position: relative;
	overflow: hidden;
	width: 100%;
	height: auto !important;
	height: 100%;
	min-height: 100%;
}


.container {
	position: relative; /*toTop用*/
	text-align: left;
	width: 100%;
	height: auto;
	z-index: 3000;
}

/*
.container::after {
  animation: noise 8s steps(10) infinite;
  background: url(../images/common/noise.png);
  content: "";
  display: block;
  height: 300%;
  left: -100%;
  position: absolute;
  top: -100%;
  width: 300%;
  z-index: 2;
}

@keyframes noise {
  to {
    background-position: 0 0;
  }
  10% {
    background-position: -5% -10%;
  }
  20% {
    background-position: -15% 5%;
  }
  30% {
    background-position: 7% -25%;
  }
  40% {
    background-position: 20% 25%;
  }
  50% {
    background-position: -25% 10%;
  }
  60% {
    background-position: 15% 5%;
  }
  70% {
    background-position: 0 15%;
  }
  80% {
    background-position: 25% 35%;
  }
  90% {
    background-position: -10% 10%;
  }
}
*/

/*--------------------------------------
header
--------------------------------------*/
#top {
	position: fixed;
	display: block;
	overflow: hidden;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: url(../images/common/header/bg.png) center center #000;
	background-size: 4px 4px;
}

#top::after {
	content: "";
	position: fixed;
	display: block;
	overflow: hidden;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: url(../images/common/header/bg.png) center center;
	background-size: 4px 4px;
	z-index: 2;
}

#musicvideo {
	position: relative;
	visibility: visible;
	display: block;
	background: #000;
	inset: 0;
	z-index: 1;
}

#musicvideo.hidden {
	visibility: hidden;
	display: none;
/*
	transform: translateZ(0);
	will-change: transform;
	backface-visibility: hidden;
*/
}

#musicvideo video {
	display: block;
	position: fixed;
	top: 0;
	left: 0;
object-fit: cover;
	width: 100%;
	height: 100%;
}

/*
#top .visual {
	display: flex;
	height: 100vh;
}

#top .visual li {
	position: relative;
}

#top .visual li.kamoshika {
	width: 50%;
	background: url(../images/common/header/back_kamoshika.webp) center center;
	background-size: cover;
}


#top .visual li.okami {
	margin-left: -1px;
	width: calc(50% + 1px);
	background: url(../images/common/header/back_okami.webp) center center;
	background-size: cover;
}

#top .visual li.okami::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: url(../images/common/header/stone.webp) center center;
	background-size: cover;
	z-index: 10;
}

#top .visual li p {
	position: absolute;
	top: 50%;
	left: 50%;
	overflow: hidden;
	display: block;
	height: 0;
	opacity: 0;
	transition: opacity 2s cubic-bezier(.57,0,.26,1) 1.5s;
	z-index: 8;
}

#top.active .visual li p {
	opacity: 1;
}

#top .visual li.kamoshika p {
	padding-top: calc(179% * 0.51);
	width: calc(100% * 0.51);
	background: url(../images/common/header/ks_kamoshika.webp) no-repeat center center;
	background-size: 100% auto;
	transform: translate(-40%, -36%);
}

#top .visual li.okami p {
	padding-top: calc(187% * 0.58);
	width: calc(100% * 0.58);
	background: url(../images/common/header/ks_okami.webp) no-repeat center center;
	background-size: 100% auto;
	transform: translate(-42.5%, -38%);
}
*/

.siteTitle {
	padding-top: 50px;
	display: block;
	position: absolute;
	top: 18px;
left: 105px;
	overflow: hidden;
	width: 800px;
	height: 0;
	opacity: 0;
	background: url(../images/common/header/title.svg) no-repeat center center;
	background-size: 100% auto;
	transition: opacity 1s cubic-bezier(.57,0,.26,1) 1s;
	z-index: 6;
}

@media only screen and (max-width: 1080px) {

	.siteTitle {
		padding-top: 50px;
	left: 95px;
		width: 690px;
	}
}

#top.active .siteTitle {
	opacity: 1;
}

nav {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	opacity: 0;
	transition: opacity 1s cubic-bezier(.57,0,.26,1) 1s;
	z-index: 100;
}

#top.active nav {
	opacity: 1;
}

.globalNav {
	margin-left: -50%;
	position: absolute;
	bottom: 6em;
	left: 50%;
	width: 100%;
	display: flex;
	justify-content: center;
	z-index: 18;
	font-size: 1vw;
	background: linear-gradient(90deg, rgba(73, 73, 73, 0) 0%, rgba(73, 73, 73, .6) 50%, rgba(73, 73, 73, 0) 100%);
	background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .8) 50%, rgba(0, 0, 0, 0) 100%);
}

@media only screen and (max-width: 1080px) {
	#top .globalNav {
	}
}

.globalNav li {
	position: relative;
	display: flex;
	align-items: center;
	font-size: 1.4vw;
}

.globalNav li:not(:first-child)::before {
	content: "";
	display: block;
	width: 1px;
	height: 1.2em;
	opacity: 0.7;
	background: #fff;
}

.globalNav li:first-child {
}

.globalNav::after {
	left: auto;
	right: 0;
}

.globalNav a {
	padding: 0 1em;
	position: relative;
	display: block;
	white-space: nowrap;
	font-family: 'Work Sans', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-weight: 700;
	font-size: 1.4vw;
	color: #c7c6cb;
	line-height: 3;
	letter-spacing: 0;
	text-decoration: none;
	-ms-user-select: none;
	-webkit-user-select: none;
	user-select: none;
	transform: scaleY(1.1);
}

.globalNav a br {
	display: none;
}

.globalNav a span {
	font-family: YakuHanJP, "IBM Plex Sans JP", "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', 'Noto Sans JP', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-weight: 700;
	font-size: 1.2vw;
}

.globalNav a:hover {
	opacity: 1;
	color: #555457;
}

.subscription {
	position: absolute;
	bottom: 1.6em;
	left: 50%;
	display: flex;
	justify-content: center;
	align-items: start;
	width: 50%;
	font-size: 1vw;
	transform: translateX(-50%);
	z-index: 17;
}

@media only screen and (max-width: 1080px) {
	#top .subscription {
	}
}

.subscription li {
	padding: 0 1.4%;
	overflow: hidden;
}

.subscription li:nth-of-type(1) {
	width: 16%;
}

.subscription li:nth-of-type(2) {
	width: 17%;
}

.subscription li:nth-of-type(3) {
	width: 22%;
}

.subscription li:nth-of-type(4) {
	width: 22%;
}

.subscription li:nth-of-type(5) {
	width: 23%;
}

.subscription li::after {
	content: "";
	padding: 0;
	overflow: hidden;
	display: block;
	width: 0;
	height: 0;
}

.subscription li:nth-of-type(1)::after {
	background: url(../images/common/nav/subscription/apple_hover.webp) no-repeat center top;
}

.subscription li:nth-of-type(2)::after {
	background: url(../images/common/nav/subscription/amazon_hover.webp) no-repeat center top;
}

.subscription li:nth-of-type(3)::after {
	background: url(../images/common/nav/subscription/spotify_hover.webp) no-repeat center top;
}

.subscription li:nth-of-type(4)::after {
	background: url(../images/common/nav/subscription/youtube_hover.webp) no-repeat center top;
}

.subscription li:nth-of-type(5)::after {
	background: url(../images/common/nav/subscription/line_hover.webp) no-repeat center top;
}

.subscription li a {
	padding-top: 40%;
	display: block;
	width: 100%;
	height: 0;
	overflow: hidden;
}

.subscription li:nth-of-type(1) a {
	padding-top: 47%;
	background: url(../images/common/nav/subscription/apple.webp) no-repeat center top;
	background-size: 100% auto;
}

.subscription li:nth-of-type(2) a {
	padding-top: 42%;
	background: url(../images/common/nav/subscription/spotify.webp) no-repeat center top;
	background-size: 100% auto;
}

.subscription li:nth-of-type(3) a {
	padding-top: 29%;
	background: url(../images/common/nav/subscription/line.webp) no-repeat center top;
	background-size: 100% auto;
}

.subscription li:nth-of-type(4) a {
	padding-top: 29%;
	background: url(../images/common/nav/subscription/youtube.webp) no-repeat center top;
	background-size: 100% auto;
}

.subscription li:nth-of-type(5) a {
	padding-top: 27%;
	background: url(../images/common/nav/subscription/amazon.webp) no-repeat center top;
	background-size: 100% auto;
}

.subscription li:nth-of-type(1) a:hover {
	opacity: 1;
	background: url(../images/common/nav/subscription/apple_hover.webp) no-repeat center top;
	background-size: 100% auto;
}

.subscription li:nth-of-type(2) a:hover {
	opacity: 1;
	background: url(../images/common/nav/subscription/spotify_hover.webp) no-repeat center top;
	background-size: 100% auto;
}

.subscription li:nth-of-type(3) a:hover {
	opacity: 1;
	padding-top: 29%;
	background: url(../images/common/nav/subscription/line_hover.webp) no-repeat center top;
	background-size: 100% auto;
}

.subscription li:nth-of-type(4) a:hover {
	opacity: 1;
	background: url(../images/common/nav/subscription/youtube_hover.webp) no-repeat center top;
	background-size: 100% auto;
}

.subscription li:nth-of-type(5) a:hover {
	opacity: 1;
	background: url(../images/common/nav/subscription/amazon_hover.webp) no-repeat center top;
	background-size: 100% auto;
}

.sns-link {
	position: absolute;
	top: 21px;
	right: 12px;
	display:flex;
	width: 80px;
	z-index: 18;
}

@media only screen and (max-width: 1080px) {
	.sns-link {
	}
}

.sns-link li {
	width: 50%;
}

.sns-link .x a,
.sns-link .line a {
	padding: 100% 0 0;
	position: relative;
	overflow: hidden;
	display: block;
	width: 100%;
	height: 0;
}

.sns-link .x a {
	background: url(../images/common/nav/sns/x.svg) no-repeat center center;
	background-size: 100% auto;
}

.sns-link .line a {
	background: url(../images/common/nav/sns/line.svg) no-repeat center center;
	background-size: 100% auto;
}



#top .scroll {
	padding: 0 0 0;
	overflow: hidden;
	position: absolute;
	bottom: calc(7em + 0px);
	right: 0;
	width: 60px;
	height: 16vh;
	font-size: 1.1vw;
	opacity: 0;
	transition: opacity 1s cubic-bezier(.57,0,.26,1) 1s;
	z-index: 122;
}

#top.active .scroll {
	opacity: 1;
}

.h2 #top .scroll,
.h #top .scroll {
	font-size: 1.4vw;
}


.scroll::before,
.scroll::after {
	content: "";
	margin: 0 auto;
	display: block;
	width: 1px;
	height: 100%;
	background: rgba(199, 199, 204, .2);
}

.scroll::after {
	background: rgba(199, 199, 204, 1);
	-webkit-animation: scrollDown 3s cubic-bezier(.17,.67,.07,.99) 0s infinite forwards;
	animation: scrollDown 3s cubic-bezier(.17,.67,.07,.99) 0s infinite forwards;
}

/* scrollDown */
@-webkit-keyframes scrollDown {
	0% { transform: translate3d(0, -28vh, 0);}
	100% { transform: translate3d(0, 0px, 0);}
}

@keyframes scrollDown {
	0% { transform: translate3d(0, -28vh, 0);}
	100% { transform: translate3d(0, 0px, 0);}
}

.scroll p {
	display: none;
}

#top::before {
	content: "SCROLL";
	display: flex;
	align-items: center;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 60px;
	height: 6em;
	overflow: hidden;
	writing-mode: vertical-rl;
	font-size: 1.1vw;
	font-family: 'Work Sans', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-weight: 700;
	line-height: 1.2;
	color: #c7c6cb;
	opacity: 0;
	-ms-user-select: none;
	-webkit-user-select: none;
	user-select: none;
	transition: opacity 1s cubic-bezier(.57,0,.26,1) 1s;
	z-index: 15;
}

#top.active::before {
	opacity: 1;
}

.h2 #top::before,
.h #top::before {
	font-size: 1.4vw;
}


.menu .globalNav {
	margin: 0;
	position: static;
	display: block;
	background: none;
	width: auto;
	z-index: 304;
}

.menu .globalNav li {
	justify-content: center;
}

.menu .globalNav li::before {
	display: none;
}

.menu .subscription {
	margin: 0 auto;
	padding-top: 2em;
	position: static;
	justify-content: center;
	align-items: center;
	width: 50%;
	transform: none;
	z-index: 304;
}

.menu .subscription li {
}

.menu .subscription li:nth-of-type(1) {
}

.menu .subscription li:nth-of-type(2) {
}

.menu .subscription li:nth-of-type(3) {
}

.menu .subscription li:nth-of-type(4) {
}

.menu .subscription li:nth-of-type(5) {
}

.menu .sns-link {
	top: 1.5% ;
	right: 1%;
	width: 16vw;
}

#menu-btn {
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	height: 79px;
	width: 79px;
	outline: none;
	border: none;
	background: none;
	cursor: pointer;
	opacity: 0;
	z-index: 1000;
	-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
	-webkit-transition: 0.5s ease-in-out;
	transition: opacity 1s cubic-bezier(.57,0,.26,1) 0s;
	z-index: 3002;
	}

body.active #menu-btn {
	opacity: 1;
}

#menu-btn.open {
	z-index: 3000;
	}

#menu-btn::before,
#menu-btn::after,
#menu-btn span {
	content: "";
	margin-left: -21px;
	padding-top: 1px;
	position: absolute;
	top: 0;
	left: 50%;
	overflow: hidden;
	display: block;
	width: 43px;
	height: 0;
	opacity: 1;
	background: #c7c6cb;
}



#menu-btn.open::before,
#menu-btn.open::after,
#menu-btn.open span {
	opacity: 0;
}


.b #menu-btn {
}


.b #menu-btn::before,
.b #menu-btn::after,
.b #menu-btn span {
	background: #c7c6cb;
}

#menu-btn::before {
	top: 29px;
	animation: btnTr 0.8s cubic-bezier(.17,.67,.07,.99) 0s forwards;
	transition: 0.4s ease-in-out;
}

#menu-btn span {
	top: 39px;
	transition: 0.4s ease-in-out;
}

#menu-btn::after {
	top: 49px;
	animation: btnBr 0.8s cubic-bezier(.17,.67,.07,.99) 0s forwards;
	transition: 0.4s ease-in-out;
}

#menu-btn.b.active::before,
	#menu-btn.active::before {
	background: #c7c6cb;
	animation: btnT 0.8s cubic-bezier(.17,.67,.07,.99) 0s forwards;
}

#menu-btn.b.active span,
	#menu-btn.active span {
	background: #c7c6cb;
	opacity: 0;
}

#menu-btn.b.active::after,
	#menu-btn.active::after {
	background: #c7c6cb;
	animation: btnB 0.8s cubic-bezier(.17,.67,.07,.99) 0s forwards;
	}


.modal button {
	display: block;
	position: fixed;
	top: 0;
	right: 16px;
	height: 79px;
	width: 79px;
	outline: none;
	border: none;
	background: none;
	cursor: pointer;
	opacity: 1;
	-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
	-webkit-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
	z-index: 3002;
	}

.modal.open button {
	z-index: 3000;
	}

.modal button::before,
.modal button::after {
	content: "";
	margin-left: -21px;
	padding-top: 1px;
	position: absolute;
	top: 0;
	left: 50%;
	overflow: hidden;
	display: block;
	width: 43px;
	height: 0;
	opacity: 1;
	background: #c7c6cb;
}

.modal button::before {
	top: 29px;
	animation: btnTr2 0.8s cubic-bezier(.17,.67,.07,.99) 0s forwards;
	transition: 0.4s ease-in-out;
}

.modal button::after {
	top: 49px;
	animation: btnBr2 0.8s cubic-bezier(.17,.67,.07,.99) 0s forwards;
	transition: 0.4s ease-in-out;
}

.modal.open button::before {
	animation: btnT 0.8s cubic-bezier(.17,.67,.07,.99) 0s forwards;
}

.modal.open button::after {
	animation: btnB 0.8s cubic-bezier(.17,.67,.07,.99) 0s forwards;
	}

/* btnT */
@keyframes btnT {
	0% { transform: translateY(0px); width: 43px;}
	20% { transform: translateY(10px) translateX(0px) rotate(0deg); width: 43px;}
	100% { transform: translateY(10px) translateX(-5px) rotate(-45deg); width: 53px;}
}

/* btnTr */
@keyframes btnTr {
	0% { transform: translateY(10px) translateX(-5px) rotate(-45deg); width: 53px;}
	30% { transform: translateY(10px) translateX(0px) rotate(0deg); width: 43px;}
	100% { transform: translateY(0px) translateX(0px); width: 43px;}
}

/* btnB */
@keyframes btnB {
	0% { transform: translateY(0px) translateX(0px); width: 43px;}
	20% { transform: translateY(-10px) translateX(0px) rotate(0deg); width: 43px;}
	100% { transform: translateY(-10px) translateX(-5px) rotate(45deg); width: 53px;}
}

/* btnBr */
@keyframes btnBr {
	0% { transform: translateY(-10px) translateX(-5px) rotate(45deg); width: 53px;}
	30% { transform: translateY(-10px) translateX(0px) rotate(0deg); width: 43px;}
	100% { transform: translateY(0px) translateX(0px); width: 43px;}
}

/* btnTr2 */
@keyframes btnTr2 {
	0% { transform: translateY(10px) translateX(-5px) rotate(-45deg); width: 53px;}
	30% { transform: translateY(10px) translateX(0px) rotate(0deg); width: 43px;}
	100% { transform: translateY(10px) translateX(0px) rotate(0deg); width: 43px;}
}

/* btnBr2 */
@keyframes btnBr2 {
	0% { transform: translateY(-10px) translateX(-5px) rotate(45deg); width: 53px;}
	30% { transform: translateY(-10px) translateX(0px) rotate(0deg); width: 43px;}
	100% { transform: translateY(-10px) translateX(0px) rotate(0deg); width: 43px;}
}

#menu-btn.b::before,
#menu-btn.b::after,
#menu-btn.b span {
	background: #777;
}

.menu {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	text-align: right;
	z-index: 3001;
}

	.menu button {
	content: "";
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	outline: none;
	cursor: default;
	background: url(../images/common/noise.png) center center rgba(34, 35,38, 0.97);
	border: none;
	z-index: 302;
}

.menu div {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 100%;
	height: 100vh;
	z-index: 303;
}

.menu .globalNav li {
	text-align: center;
}

.menu .globalNav a {
	display: inline-block;
	line-height: 2.2;
	font-size: 3vw;
	text-align: center;
}


.menu .globalNav a br {
	display: block;
}


.menu .globalNav li:nth-of-type(2) a {
	padding: 0.4em 1em 0.8em;
	font-size: 1.8vw;
	line-height: 1.2;
}

.menu .globalNav li:nth-of-type(2) a span,
.menu .globalNav li:nth-of-type(3) a span {
	display: block;
	font-size: 2.5vw;
}

.menu .globalNav a::after {
	bottom: 0.4em;
	height: 0.1em;
}


/*--------------------------------------
 * コンテンツ
 * ---------------------------------------*/

.primary {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	background: url(../images/common/noise.png) center center rgba(34, 35,38, 1);
}

.notice li:not(:last-child) {
	padding-bottom: 4px;
}

.notice p {
	display: flex;
	font-size: 13px;
	line-height: 1.6;
}

.notice p::before {
	content: "※";
}

section {
}

.primary section h2 {
	padding-bottom: 16px;
	mix-blend-mode: multiply;
	font-family: 'Work Sans', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-weight: 700;
	font-size: 82px;
	color: #b1b6bd;
	line-height: 1.2;
	letter-spacing: 0;
	text-align: center;
	-ms-user-select: none;
	-webkit-user-select: none;
	user-select: none;
	transform: scaleX(0.9);
}

.primary section .contents {
	margin: 0 auto;
	padding: 0 64px 0;
	position: relative;
	max-width: 1240px;
	width: 100%;
}

.item {
	opacity: 0;
	transform: translateY(3vh);
	transition: opacity 1.5s cubic-bezier(.57,0,.26,1) 0s, transform 1s cubic-bezier(.57,0,.26,1) 0s;
}

.item.active {
	opacity: 1;
	transform: translateY(0);
}


/*--------------------------------------
news
---------------------------------------*/


#news {
	padding: 80px 0 140px;
	position: relative;
	width: 100%;
}

#news h2 {
}


#news .feed {
	margin: 0 auto;
	padding: 0 64px;
	position: relative;
	max-width: 1240px;
	width: 100%;
	z-index: 4;
}

#news .entryList {
}

#news .entryList li {
	border-bottom: solid 1px rgba(199, 198, 203, 0.2);
}

#news .entryList li:first-child {
	border-top: solid 1px rgba(199, 198, 203, 0.2);
}

#news .entryList li:nth-of-type(n+4) {
	display: none;
}

#news .entry a {
	padding: 24px 48px 24px 0;
	position: relative;
	display: block;
	overflow: hidden;
	color: #c7c6cb;
	line-height: 1.8;
	font-size: 15px;
	text-decoration: none;
}

#news .entryList + ul a::after,
#news .entry a::after {
	content: "";
	margin-top: -4px;
	padding-top: 8px;
	position: absolute;
	top: 50%;
	right: 16px;
	display: block;
	width: 8px;
	height: 0;
	transform: rotate(-45deg);
	border: solid 1px;
	border-top: none;
	border-left: none;
	transition: 0.4s ease-in-out;
}

#news .entryList + ul a:hover::after,
#news .entry a:hover::after {
	right: 8px;
}

#news .entry a:hover {
}

#news .entry time {
	display: table-cell;
	vertical-align: top;
	width: 108px;
	text-align: left;
}

#news .entry p {
	padding: 0;
	display: table-cell;
	vertical-align: top;
text-align: left;
}

@media only screen and (max-width: 1240px) {

	#news .entry time {
		font-size: 12px;
		display: block;
	}

	#news .entry p {
		display: block;
	}
}

#news .entryList + ul {
	display: flex;
	justify-content: space-between;
}

#news .entryList + ul li {
	padding-top: 24px;
}

#news .entryList + ul li:nth-of-type(1) {
}

#news .entryList + ul a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 8em;
	height: 3.8em;
	text-align: center;
	letter-spacing: 0;
	font-size: 16px;
	font-family: 'Work Sans', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-weight: 600;
	line-height: 1.2;
	color: #c7c6cb;
	text-decoration: none;
	border: solid 1px;
	user-select: none;
	gap: 0.4em;
}

#news .entryList + ul li:nth-of-type(2) a {
	width: 29em;
	font-family: YakuHanJP, "IBM Plex Sans JP", "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', 'Noto Sans JP', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-weight: 500;
}

#news .entryList + ul li:nth-of-type(2) a::before {
	content: "";
	display: block;
	width: 1.5em;
	height: 1em;
	background: url(../images/contents/news/mail.svg) no-repeat center center;
	background-size: 100% auto;
}

#news .entryList + ul a:hover {
}


/*--------------------------------------
release
---------------------------------------*/

#release {
	padding: 0 0;
	width: 100%;
background: url(../images/common/noise.png) center center rgba(47, 49, 52, 1);
}

#release h2 {
	padding: 0;
	height: 0;
	overflow: hidden;
}

#release .contents > ul::before {
	content: "RELEASE INFO";
	padding: 80px 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	font-family: 'Work Sans', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-weight: 700;
	font-size: 82px;
	color: #65707d;
	line-height: 1.2;
	letter-spacing: 0;
	text-align: center;
	mix-blend-mode: multiply;
	transform: scaleX(0.9);
}

.primary section#release .contents {
	margin: 0 auto;
	padding: 0 0 0;
	position: relative;
	max-width: none;
	width: 100%;
}


#release h3 {
	text-align: center;
	color: #c7c6cb;
}

#release #double-setlist h3 {
/*
	padding-bottom: 0.2em;
	position: relative;
	font-size: 40px;
	font-family: 'Work Sans', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0;
*/
	position: relative;
	margin: 0 auto;
	padding-top: calc(6% * 0.8 + 4.4vw);
	width: calc(100% * 0.8);
	height: 0;
	overflow: hidden;
	background: url(../images/contents/release/VIZL-3100/logo.svg) no-repeat bottom center;
	background-size: 100% auto;
	z-index: 10;
}

@media only screen and (max-width: 1240px) {
	#release #double-setlist h3 {
		padding-top: calc(6% * 1 + 4.4vw);
		width: calc(100% * 1 - 64px * 2);
	}
}

#release .contents h3 span.media {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	font-family: 'Oswald', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	color: #c7c6cb;
	letter-spacing: -0.01em;
	font-size: 2.4vw;
}

@media only screen and (max-width: 1240px) {
	#release .contents h3 span.media {
		font-size: 2.2vw;
	}
}

#release #double-setlist h3 span.media {
}

#release #double-setlist h4 {
	margin: 0 auto;
	padding-top: calc(35% * 0.9);
	width: calc(100% * 0.9);
	height: 0;
	overflow: hidden;
	background: url(../images/contents/release/VIZL-3100/title.webp) no-repeat top center;
	background-size: 100% auto;
}


#release #double-setlist #VIZL-3111 h4 {
	background: url(../images/contents/release/VIZL-3111/title.webp) no-repeat top center;
	background-size: 100% auto;
}

@media only screen and (max-width: 1240px) {
	#release #double-setlist h4 {
		padding-top: calc(35% * 1);
		width: calc(100% * 1);
	}
}

#release #double-setlist h4 span {
	padding-top: 0.2em;
	display: block;
	font-size: 24px;
	font-family: 'Work Sans', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-weight: 600;
	}

#release #double-setlist {
	padding: 240px 0 140px;
	position: relative;
}

#release #double-setlist::before,
#release #double-setlist::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 50%;
	height: 100%;
	opacity: .15;
	background: url(../images/contents/release/VIZL-3100/bg.webp) no-repeat center center;
	background-size: cover;
	z-index: 1;
}

#release #double-setlist::after {
	left: auto;
	right: 0;
	background: url(../images/contents/release/VIZL-3111/bg.webp) no-repeat center center;
	background-size: cover;
}



#release #double-setlist .detail {
	display: block;
}


#release #double-setlist .detail .list {

}


#release #double-setlist .detail .list > ul {
	display: flex;
	align-items: start;
	gap: calc(64px * 2);
}

#release #double-setlist .detail .list > ul > li {
	width: calc((100% - 40px) / 2);
}


#release #double-setlist .detail .list > ul > li > ul {
	padding-top: 8vw;
	position: relative;
}

@media only screen and (max-width: 1240px) {
}


#release .contents .date {
}

#release #double-setlist .list > ul > li:not(#VIZL-3111) .date {
	padding-top: 1vw;
	position: absolute;
	top: 0;
	left: 0;
	width: calc(200% + 88px);
}

#release #double-setlist .list > ul > li#VIZL-3111 .date {
	padding: 0;
	overflow: hidden;
	height: 0;
}

#release .contents .date p {
	text-align: center;
	font-size: 4vw;
	letter-spacing: 0;
	font-family: 'Oswald', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-weight: 600;
	color: #c7c6cb;
	line-height: 1.2;
	letter-spacing: -0.01em;
}

@media only screen and (max-width: 1240px) {
	#release .contents .date p {
		font-size: 4vw;
	}
}


#release .contents .detail {
	padding: 1% 64px 0;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	position: relative;
	z-index: 10;
}

#release .contents .jacket {
	width: 100%;
}

#release #double-setlist .jacket {
	margin: 0 auto;
	width: 70%;
	position: relative; 
	max-width: 680px;
}

@media only screen and (max-width: 1240px) {

	#release #double-setlist .jacket {
		width: 100%;
	}

}


#release .contents .jacket figure {
	margin: 0 auto;
	padding-top: 100%;
	overflow: hidden;
	width: 100%;
	height: 0;
	cursor: pointer;
	box-shadow: 0 0 0 0px rgba(0,0,0,.15), 0 0 5px rgba(0,0,0,.1);
	transition: box-shadow 0.5s cubic-bezier(.57,0,.26,1),  transform 0.5s cubic-bezier(.57,0,.26,1);
}

#release *:has(#VIZL-3111 .info button:hover) #VIZL-3111 .jacket figure,
#release *:has(#VIZL-3100 .info button:hover) #VIZL-3100 .jacket figure,
#release .contents .jacket figure:hover {
	box-shadow: 0 15px 30px -5px rgba(0,0,0,.3), 0 0 5px rgba(0,0,0,.1);
	transform: scale(1.01);
}

#release #VE3WT-12218 .jacket figure:hover,
#release #VE3WT-12218 .jacket figure {
	cursor: default;
	box-shadow: none;
	transition: none;
	transform: none;
}

#release #VIZL-3100 .jacket figure {
	padding-top: 140%;
	background: url(../images/contents/release/VIZL-3100/VIXL-1900.webp) no-repeat center top;
	background-size: 100% auto;
}

#release #VIZL-3111 .jacket figure {
	padding-top: 140%;
	background: url(../images/contents/release/VIZL-3111/VIXL-1911.webp) no-repeat center top;
	background-size: 100% auto;
}

@media only screen and (max-width: 1040px) {

}

#release #VIZL-3100 .jacket::before,
#release #VIZL-3111 .jacket::before,
#release #VIZL-3100 .jacket::after,
#release #VIZL-3111 .jacket::after {
	content: "";
	padding-top: 36%;
	position: absolute;
	bottom: -12%;
	left: -18%;
	display: block;
	width: 36%;
	height: 0;
	background: url(../images/contents/release/VIZL-3100/logo_circle.svg) no-repeat center top;
	background-size: 100% auto;
	animation: spin 12s infinite linear;
	z-index: 100;
}

#release #VIZL-3100 .jacket::after {
	background: url(../images/contents/release/VIZL-3100/logo_main.svg) no-repeat center top;
	background-size: 100% auto;
	animation: none;
}

#release #VIZL-3111 .jacket::after {
	background: url(../images/contents/release/VIZL-3111/logo_main.svg) no-repeat center top;
	background-size: 100% auto;
	animation: none;
}

@media only screen and (max-width: 1240px) {
	#release #VIZL-3100 .jacket::before,
	#release #VIZL-3111 .jacket::before,
	#release #VIZL-3100 .jacket::after,
	#release #VIZL-3111 .jacket::after {
		padding-top: 30%;
		bottom: -19%;
		left: -8%;
		width: 30%;
	}
}

#release #VIZL-3100 .info,
#release #VIZL-3111 .info {
	position: relative;
	display: flex;
	align-items: center;
}

#release .info button,
#release .data a {
	margin: 2em auto 0;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 12em;
	outline: none;
	border: none;
	text-align: center;
	color: #c7c6cb;
	cursor: pointer;
	font-size: 18px;
	font-weight: 500;
	line-height: 4;
	text-decoration: none;
	-ms-user-select: none;
	-webkit-user-select: none;
	user-select: none;
	border: solid 1px;
	background: none;
	transition: background 0.4s cubic-bezier(.57,0,.26,1), color 0.4s cubic-bezier(.57,0,.26,1);
	z-index: 1;
}

#release #VIZL-3100 .jacket:hover + .info button,
#release #VIZL-3111 .jacket:hover + .info button,
#release .info button:hover,
#release .data a:hover {
	opacity: 1;
	color: #222326;
	background: #c7c6cb;
}


/*
#release .info button::after,
#release .data a::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #c7c6cb;
	clip-path: inset(0 100% 0 0);
	transition: clip-path 0.4s cubic-bezier(.57,0,.26,1);
	z-index: -1;
}

#release .info button:hover::after,
#release .data a:hover::after {
	clip-path: inset(0 0 0 0);
}
*/

#release .ec a {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 10em;
	outline: none;
	border: none;
	text-align: center;
	color: #c7c6cb;
	cursor: pointer;
	font-size: 15px;
	font-weight: 600;
	line-height: 3;
	text-decoration: none;
	-ms-user-select: none;
	-webkit-user-select: none;
	user-select: none;
	z-index: 1;
}

#release .modal {
	position: fixed;
	top: 0;
	left: 0;
	display: none;
	overflow-y: scroll;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	width: 100%;
	height: 100vh;
	z-index: 1000;
}

#release .modal.open {
}

#release .modal > div {
	padding: 80px 0 120px;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 40px;
	width: 100%;
	height: auto;
	background: #f3f2f2;
	background: url(../images/common/noise.png) center center rgba(34, 35,38, 1);
	z-index: 1105;
}

#release #modal_VIZL-3100 > div::before,
#release #modal_VIZL-3111 > div::before,
#release #modal_VIZL-3100 > div::after,
#release #modal_VIZL-3111 > div::after {
	content: "";
	padding-top: 800px;
	position: fixed;
	top: 16px;
	left: 16px;
	display: block;
	width: 800px;
	height: 0;
	opacity: .15;
	background: url(../images/contents/release/VIZL-3100/logo_circle.svg) no-repeat center top;
	background-size: 100% auto;
	animation: spin 20s infinite linear;
	z-index: 1;
}

#release #modal_VIZL-3100 > div::after {
	background: url(../images/contents/release/VIZL-3100/logo_main.svg) no-repeat center top;
	background-size: 100% auto;
	animation: none;
}

#release #modal_VIZL-3111 > div::after {
	background: url(../images/contents/release/VIZL-3111/logo_main.svg) no-repeat center top;
	background-size: 100% auto;
	animation: none;
}

@media only screen and (max-width: 2100px) {
	#release #modal_VIZL-3100 > div::before,
	#release #modal_VIZL-3111 > div::before,
	#release #modal_VIZL-3100 > div::after,
	#release #modal_VIZL-3111 > div::after {
		padding-top: calc((100vw - 1240px) / 2 * 2);
		width: calc((100vw - 1240px) / 2 * 2);
	}
}

@media only screen and (max-width: 1780px) {
	#release #modal_VIZL-3100 > div::before,
	#release #modal_VIZL-3111 > div::before,
	#release #modal_VIZL-3100 > div::after,
	#release #modal_VIZL-3111 > div::after {
		padding-top: 560px;
		width: 560px;
	}
}

@media only screen and (max-width: 1080px) {
	#release #modal_VIZL-3100 > div::before,
	#release #modal_VIZL-3111 > div::before,
	#release #modal_VIZL-3100 > div::after,
	#release #modal_VIZL-3111 > div::after {
		padding-top: 50%;
		width: 50%;
	}
}

#release .modal > div > div {
	margin: 0 auto;
	padding: 0 64px 0;
	position: relative;
	max-width: 1240px;
	width: 100%;
	z-index: 10;
}

#release #modal_VIZL-3100 h3,
#release #modal_VIZL-3111 h3 {
	font-size: 38px;
	font-weight: 700;
	font-family: 'Work Sans', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	line-height: 1.2;
	letter-spacing: 0;
}

#release .modal h3 br {
	display: none;
}

#release #modal_VIZL-3100 h3 span,
#release #modal_VIZL-3111 h3 span {
	padding: 0.2em 0;
	display: block;
	font-size: 50px;
	font-weight: 700;
	font-family: YakuHanJP, "IBM Plex Sans JP", "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', 'Noto Sans JP', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
}

#release #modal_VIZL-3100 h3 span.media,
#release #modal_VIZL-3111 h3 span.media {
	padding-bottom: 0.5em;
	font-family: 'Work Sans', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-size: 24px;
}

@media only screen and (max-width: 1240px) {
	#release #modal_VIZL-3100 h3,
	#release #modal_VIZL-3111 h3 {
		font-size: 3vw;
	}

	#release #modal_VIZL-3100 h3 span,
	#release #modal_VIZL-3111 h3 span {
		font-size: 4vw;
	}

	#release #modal_VIZL-3100 h3 span.media,
	#release #modal_VIZL-3111 h3 span.media {
		padding-bottom: 0.6em;
		font-size: 2.2vw;
	}
}

@media only screen and (max-width: 1080px) {
	#release #modal_VIZL-3100 h3,
	#release #modal_VIZL-3111 h3 {
		font-size: 2.8vw;
	}

	#release #modal_VIZL-3100 h3 span,
	#release #modal_VIZL-3111 h3 span {
		font-size: 4vw;
	}

	#release #modal_VIZL-3100 h3 span.media,
	#release #modal_VIZL-3111 h3 span.media {
		padding-bottom: 0.6em;
		font-size: 2.2vw;
	}
}

#release .modal .detail {
	padding: 0 0 0;
}

#release .modal .date p {
	padding: 0.2em 0 0;
	line-height: 1.2;
	font-family: 'Work Sans', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	font-size: 44px;
	font-weight: 700;
	letter-spacing: 0;
	text-align: center;
}

@media only screen and (max-width: 1240px) {

	#release .modal .date p {
		font-size: 3.4vw;
	}
}

#release .modal .lead {
	padding: 1em 0 2em;
}

#release .modal .lead p {
	font-size: 18px;
}

#release .modal .data > dl > dt {
	font-weight: 700;
	line-height: 3;
	font-size: 18px;
	text-align: center;
	border: solid 1px;
}

#release .modal .data > dl > dd {
	padding: 32px 0;
}

#release .modal .data > dl > dd::before {
	content: "";
	margin: 0 40px 40px 0;
	display: block;
	float: left;
	width: calc(100% * 0.55);
	height: 0;
}

#release #modal_VIZL-3100 .data > dl.blu-ray > dd::before {
	padding-top: calc(141% * 0.55);
	background: url(../images/contents/release/VIZL-3100/VIXL-1900.webp) no-repeat center top;
	background-size: 100% auto;
}

#release #modal_VIZL-3100 .data > dl.cd > dd::before {
	padding-top: calc(100% * 0.55);
	background: url(../images/contents/release/VIZL-3100/VICL-66300.webp) no-repeat center top;
	background-size: 100% auto;
}

#release #modal_VIZL-3111 .data > dl.blu-ray > dd::before {
	padding-top: calc(141% * 0.55);
	background: url(../images/contents/release/VIZL-3111/VIXL-1911.webp) no-repeat center top;
	background-size: 100% auto;
}

#release #modal_VIZL-3111 .data > dl.cd > dd::before {
	padding-top: calc(100% * 0.55);
	background: url(../images/contents/release/VIZL-3111/VICL-66311.webp) no-repeat center top;
	background-size: 100% auto;
}

#release .modal .data > dl > dd > dl {
	margin-left: calc(55% + 40px);
	padding: 0 0 32px;
}

#release .modal .data > dl > dd > dl.complete-a,
#release .modal .data > dl > dd > dl.complete-b,
#release .modal .data > dl > dd > dl.complete-c,
#release .modal .data > dl > dd > dl.complete-d,
#release .modal .data > dl > dd > dl.vos {
	margin-left: 0;
	clear: both;
}

#release .modal .data > dl > dd > dl > dt {
	padding-left: 1em;
	position: relative;
	font-size: 16px;
	line-height: 1.7;
}

#release .modal .data > dl > dd > dl > dt::before {
	content: "";
	position: absolute;
	top: 0.5em;
	left: 0;
	display: block;
	flex-shrink: 0;
	width: 0.5em;
	height: 0.5em;
	background: #c7c6cb;
}

#release .modal .data > dl > dd > dl > dt span {
	padding: 0.3em 0 0 0;
	display: block;
	width: 100%;
}

#release .modal .data > dl > dd > dl > dt span::before {
	content: "＜";
}

#release .modal .data > dl > dd > dl > dt span::after {
	content: "＞";
}

#release .modal .data > dl > dd > dl > dd {
	padding: 0.2em 0 0 1em;
	overflow: hidden;
}

#release #modal_VIZL-3111 .data > dl.blu-ray > dd > dl.vos > dd.shoulder,
#release #modal_VIZL-3111 .data > dl.blu-ray > dd > dl.vos > dd.boston {
	overflow: hidden;
	clear: both
}

#release .modal .data > dl.cd > dd > dl.vos > dd.smart-phone-shoulder:before,
#release .modal .data > dl.cd > dd > dl.vos > dd.t-shirts:before,
#release .modal .data > dl.blu-ray > dd > dl.vos > dd.shoulder:before,
#release .modal .data > dl.blu-ray > dd > dl.vos > dd.boston:before {
	content: "";
	margin: 0 0 2em 8px;
	padding-top: calc(55.34% * 0.4 + 0.4em);
	float: right;
	display: block;
font-size: 13px;
	text-align: center;
	line-height: 1.7;
	width: calc(100% * 0.4);
	height: 0;
}

#release .modal .data > dl.blu-ray > dd > dl.vos > dd.boston:before {
	content: "＜ボストンバッグ＞";
	background: url(../images/contents/release/VIZL-3100/boston.webp) no-repeat;
	background-size: 100% auto;
}

#release .modal .data > dl.blu-ray > dd > dl.vos > dd.shoulder:before {
	content: "＜ムーンショルダー＞";
	background: url(../images/contents/release/VIZL-3100/shoulder.webp) no-repeat;
	background-size: 100% auto;
}

#release .modal .data > dl.cd > dd > dl.vos > dd.smart-phone-shoulder:before {
		content: "＜携帯＆メガネケース＞";
background: url(../images/contents/release/VIZL-3100/case.webp) no-repeat;
	background-size: 100% auto;
}

#release .modal .data > dl.blu-ray > dd > dl.vos > dd.t-shirts:before {
		content: "＜Tシャツ＞";
	background: url(../images/contents/release/VIZL-3100/t-shirts.webp) no-repeat;
	background-size: 100% auto;
}

#release .modal .data > dl.cd > dd > dl.vos > dd.t-shirts:before {
		content: "＜Tシャツ＞";
	background: url(../images/contents/release/VIZL-3100/t-shirts.webp) no-repeat;
	background-size: 100% auto;
}



#release #modal_VIZL-3100 .data > dl.blu-ray > dd > dl.limited > dd::after,
#release #modal_VIZL-3111 .data > dl.blu-ray > dd > dl.limited > dd::after {
	content: "＜写真集＞";
	margin: 1em 0 2em 1em;
	padding-top: calc(47.58% + 0.4em);
	display: block;
	width: 100%;
	height: 0;
font-size: 13px;
	text-align: center;
	line-height: 1.7;
	background: url(../images/contents/release/VIZL-3100/photobook.webp) no-repeat;
	background-size: 100% auto;
}

#release #modal_VIZL-3111 .data > dl.blu-ray > dd > dl.limited > dd::after {
	background: url(../images/contents/release/VIZL-3111/photobook.webp) no-repeat;
	background-size: 100% auto;
}

#release #modal_VIZL-3100 .data > dl.cd > dd > dl.limited > dd::after,
#release #modal_VIZL-3111 .data > dl.cd > dd > dl.limited > dd::after {
	content: "＜ピンバッジ5種セット＞";
	margin: 1em 0 2em 1em;
	padding-top: calc(47.58% + 0.4em);
	display: block;
	width: 100%;
	height: 0;
font-size: 13px;
	text-align: center;
	line-height: 1.7;
	background: url(../images/contents/release/VIZL-3100/badge.webp) no-repeat;
	background-size: 100% auto;
}

#release #modal_VIZL-3111 .data > dl.cd > dd > dl.limited > dd::after {
	background: url(../images/contents/release/VIZL-3111/badge.webp) no-repeat;
	background-size: 100% auto;
}

#release .modal .data > dl > dd > dl > dd:nth-of-type(2) {
	padding: 1em 0 0 1em;
}

#release .modal .data > dl > dd > dl > dd > ul > li:not(:last-child) {
	padding-bottom: 1em;
}

#release .modal .data > dl > dd > dl > dd > ul:not(.option) > li > p {
	margin-left: 1em;
	padding-bottom: 0.5em;
	line-height: 1.7;
	text-indent: -1em;
}

#release .modal .data > dl > dd > dl > dd > ul:not(.option) > li > p span {
	
}

#release .modal .data > dl > dd > dl > dd > ul:not(.option) > li > p span::before {
	content: "\0020:\0020";
	white-space: pre;
}

#release .modal .data > dl > dd > dl > dd > ul.option > li > p {
	line-height: 1.7;
}

#release .modal .data > dl > dd > dl > dd > ul:not(.option) > li > p::before {
	content: "・";
}

#release .modal .data > dl > dd > dl > dd > ul.option > li > p::before {
	content: "＜";
}

#release .modal .data > dl > dd > dl > dd > ul.option > li > p::after {
	content: "＞";
}

#release .modal .data a {
	margin: 0 0 0 1em;
	width: 7em;
	font-size: 14px;
	line-height: 2.6;
	color: #222326;
	background: #c7c6cb;
	border: none;
	transition: background 0.4s cubic-bezier(.57,0,.26,1), color 0.4s cubic-bezier(.57,0,.26,1);
	z-index: 1;
}

#release .modal .data a:hover {
	opacity: 1;
	color: #c7c6cb;
	background: #424242;
}

#release .track-list dl {
	display: flex;
	align-items: start;
	gap: 16px;
}

#release .track-list > dl > dt {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 8em;
	height: 2.8em;
	border: solid 1px;
}

#release .track-list > dl > dd {
	flex: 1;
}

#release .track-list ol {
	padding-bottom: 24px;
	column-count: 2;
	column-gap: 4em;
	counter-reset: listcount;
}

#release .track-list ol > li {
	padding: 0 0 8px 0;
	position: relative;
	display: flex;
	align-items: start;
}

#release #modal_VIZL-3100 .track-list li:nth-of-type(19),
#release #modal_VIZL-3111 .track-list li:nth-of-type(19) {
	padding-bottom: 54px;
}

#release #modal_VIZL-3100 .track-list li:nth-of-type(19)::after,
#release #modal_VIZL-3111 .track-list li:nth-of-type(19)::after {
	content: "[ ENCORE ]";
	position: absolute;
	bottom: 0;
	left: 0;
	display: block;
	font-size: 16px;
	width: 100%;
}

#release .track-list ol > li::before {
	counter-increment: listcount;
	content: counter(listcount, decimal-leading-zero) ".";
	padding-right: 4px;
	font-size: 18px;
	text-align: left;
	z-index: 1;
}

#release .track-list ol p {
	font-size: 18px;
}

#release .track-list dl.bonus-track {
	padding: 4px 0 0 1em;
	flex-direction: column;
	gap: 4px;
}

#release .track-list dl.bonus-track dt {
	line-height: 1.6;
}

#release .track-list dl.bonus-track dt::before {
	content: "＜";
}

#release .track-list dl.bonus-track dt::after {
	content: "＞";
}

#release .track-list dl.bonus-track li p {
	font-size: 15px;
}

#release .track-list dl.bonus-track li p::before {
	content: "・";
}

#release .modal .campaign dl {
	margin-top: 48px;
	padding: 32px 48px 16px;
	border: solid 1px;
}

#release .modal .campaign dt {
	padding-bottom: 32px;
	line-height: 1.2;
	font-size: 20px;
	font-weight: 700;
	text-align: center;
	border-bottom: solid 1px;
}

#release .modal .campaign dt br {
	display: none;
}

#release .modal .campaign dd {
	padding: 32px 0;
	overflow: hidden;
}

#release .modal .campaign dd.campaign-detail::before {
	content: "";
	margin: 0 24px 0 0;
	padding-top: calc(65% * 0.4);
	display: block;
	float: left;
	width: calc(100% * 0.4);
	height: 0;
	background: url(../images/contents/release/VIZL-3100/poster.webp) no-repeat;
	background-size: 100% auto;
}

#release .modal .campaign .lead {
	padding: 0 0 0.5em;
}

#release .modal .campaign .lead + .notice {
	padding: 0 0 1em;
}

#release .modal .campaign dd.link {
	padding: 32px 0 24px;
	border-top: solid 1px;
}

#release .modal .campaign dd.link ul {
	display: flex;
	justify-content: center;
}

#release .modal .campaign ul.link {
	padding-top: 40px;
	display: flex;
	justify-content: center;
	gap: 32px;
}

#release .modal .campaign .link a {
	display: flex;
	text-decoration: none;
	line-height: 1.7;
	font-size: 18px;
	gap: 8px;
}

#release .modal .campaign .link a::before {
	content: "";
	margin-top: 0.6em;
	display: block;
	width: 8px;
	height: 8px;
	border-top: solid 1px;
	border-right: solid 1px;
	transform: rotate(45deg);
}


#release #VE3WT-12218 {
	padding: 120px 0 140px;
	position: relative;
}

#release #VE3WT-12218::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	opacity: .14;
	background: url(../images/contents/release/VE3WT-12218/bg.webp) no-repeat center center;
	background-size: cover;
	z-index: 1;
}

#release #VE3WT-12218 h3 {
	position: relative;
	margin: 0 auto;
	padding-top: calc(33% * 0.2 + 4.4vw);
	width: calc(100% * 0.2);
	height: 0;
	overflow: hidden;
	background: url(../images/contents/release/VE3WT-12218/title.svg) no-repeat bottom center;
	background-size: 100% auto;
	z-index: 10;
}

#release #VE3WT-12218 .detail {
	flex-direction: column;
}

#release #VE3WT-12218 .date {
	padding: 0.4vw 0 2vw;
}

#release #VE3WT-12218 .date p {
	font-size: 2.8vw;
}

#release #VE3WT-12218 .jacket {
	margin: 0 auto;
	width: 70%;
	max-width: 680px;
}

@media only screen and (max-width: 1940px) {
	#release #VE3WT-12218 .jacket {
		max-width: none;
		width: 33%;
	}
}

	@media only screen and (max-width: 1240px) {
	#release #VE3WT-12218 .jacket {
		width: 45%;
	}
}

#release #VE3WT-12218 .jacket figure {
	padding-top: 100%;
	background: url(../images/contents/release/VE3WT-12218/VE3WT-12218.webp) no-repeat center top;
	background-size: 100% auto;
}

.modal button.js-modal-switch {
	margin: auto;
	position: relative;
	top: auto;
	left: auto;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 16em;
	height: auto;
	outline: none;
	border: none;
	text-align: center;
	color: #222326;
	background: #c7c6cb;
	cursor: pointer;
	font-size: 18px;
	font-weight: 500;
	line-height: 4;
	text-decoration: none;
	-ms-user-select: none;
	-webkit-user-select: none;
	user-select: none;
	transition: background 0.4s cubic-bezier(.57, 0, .26, 1), color 0.4s cubic-bezier(.57, 0, .26, 1);
	z-index: 1;
}

.modal button.js-modal-switch:hover {
	opacity: 1;
	color: #c7c6cb;
	background: #424242;
}

.modal.open button.js-modal-switch::before,
.modal.open button.js-modal-switch::after,
.modal button.js-modal-switch::before,
.modal button.js-modal-switch::after {
	display: none !important;
	height: auto;
	animation: none;
}

/*--------------------------------------
youtube
---------------------------------------*/

#youtube {
	padding: 130px 0 0px;
	position: relative;
	width: 100%;
}

#youtube h2 {
}

.primary section#youtube .contents {
	padding: 0 0 0;
}

#youtube figure {
	position: relative;
	padding: 30px 0 56.25%;
	height: 100%;
}

#youtube figure iframe,
#youtube figure object,
#youtube figure embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 3;
}

/*--------------------------------------
playlist
---------------------------------------*/

#playlist {
	padding: 130px 0 150px;
	width: 100%;
}

#playlist .contents > ul {
	padding-top: 8px;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
}

#playlist .contents > ul > li {
	padding: 0 8px 0 0;
	width: 50%;
}

#playlist .contents > ul > li:last-child {
	padding: 0 0 0 8px;
}

#playlist .contents > ul > li iframe {
	width: 100%;
	height: 450px;
}

/*--------------------------------------
link
---------------------------------------*/
#link {
	padding: 90px 0 0;
	width: 100%;
	background: url(../images/common/noise.png) center center #161617;
}

#link h2 {
	display: none;
}


#link .contents {
	margin: 0 auto;
	padding: 40px 40px 80px;
	display: flex;
	justify-content: center;
	max-width: 1144px;
	width: 100%;
}

#link ul {
	display: flex;
	justify-content: center;
}

#link a {
	padding: 24px 2em 16px;
	position: relative;
	display: table-cell;
	text-decoration: none;
	font-size: 30px;
	font-weight: 700;
	color: #c7c6cb;
}


#link a::before {
	content: "";
	margin-left: -10px;
	position: absolute;
	top: 8px;
	left: 50%;
	display: block;
border-style: solid;
border-width: 15px 10px 0 10px;
border-color: #c7c6cb transparent transparent transparent;
}



/*--------------------------------------
上部へボタン
---------------------------------------*/

ul.toTop {
	overflow: hidden;
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: 300;
}

ul.toTop li {
	float: right;
}

ul.toTop a {
	padding-top: 56px;
	position: relative;
	display: block;
	overflow: hidden;
	width: 56px;
	height: 0;
	background: #0181c0;
}

ul.toTop a::before {
	content: "";
	margin: -5px 0 0 -10px;
	position: absolute;
	top: 50%;
	left: 50%;
	display: block;
	width: 18px;
	height: 18px;
	transform: rotate(45deg);
	border: solid 1px #fff;
	border-right: none;
	border-bottom: none;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-ms-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}

ul.toTop a:hover {
	opacity: 1;
	background: #00b7ff;
}

ul.toTop a:hover::before {
}

#controlBar_player {
	display: none;
}
/*--------------------------------------
フッター
---------------------------------------*/

footer {
	margin-top: -1px;
	position: relative;
	overflow: hidden;
	width: 100%;
	text-align: center;
	color: #c7c6cb;
	background: url(../images/common/noise.png) center center #161617;
	z-index: 3000;
}

footer .copyright::before {
	content: "";
	margin: 0 auto;
	padding-top: 134px;
	display: block;
	width: 300px;
	height: 0;
	background: url(../images/common/footer/logo.svg) no-repeat center top;
	background-size: 100% auto;
}

footer .copyright {
	padding-bottom: 160px;
}

footer .copyright p {
	font-family: 'Work Sans', "Hiragino Sans", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Osaka", verdana, sans-serif;
	letter-spacing: 0;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	transform: scaleY(1.1);
}

footer .copyright br {
	display: none;
}

footer .copyright a {
	color: #c7c6cb;
	text-decoration: underline;
}

.copyright a {
	color: #c7c6cb;
	text-decoration: underline;
}

/*--------------------------------------------------------------------------------------------------*/

@media only screen and (max-width: 980px) {

	body {
		font-size: 14px;
	}

	.primary section h2 {
		padding-bottom: 16px;
		font-size: 68px;
	}

	/*--------------------------------------
	news
	---------------------------------------*/
	#news {
		padding: 80px 0 100px;
		width: 100%;
	}

	#news .feed {
		padding: 0 48px 0 48px;
	}

	#news .entry p,
	#news .entry time {
		font-size: 15px;
		display: table-cell;
	}

	#news .entryList + ul {
		text-align: right;
	}

	/*--------------------------------------
	release
	---------------------------------------*/
	#release .contents > ul::before {
		font-size: 68px;
	}

	#release #double-setlist {
		padding: 194px 0 80px;
	}

	#release #VE3WT-12218 {
		padding: 80px 0 100px;
	}

	#release .contents .detail,
	#release .modal > div > div {
		padding: 0 48px 0;
	}

	#release #double-setlist h3 {
		padding-top: calc(6% * 1 + 4.4vw);
		width: calc(100% * 1 - 48px * 2);
	}

	#release #double-setlist .detail .list > ul {
		gap: calc(48px * 2);
	}

	#release #modal_VIZL-3100 > div::before,
	#release #modal_VIZL-3111 > div::before,
	#release #modal_VIZL-3100 > div::after,
	#release #modal_VIZL-3111 > div::after {
		padding-top: 40%;
		width: 40%;
	}

	#release .modal .lead p {
		font-size: 16px;
	}

	#release .modal .data > dl > dd::before {
		margin: 0 24px 24px 0;
		width: calc(100% * 0.4);
	}

	#release #modal_VIZL-3100 .data > dl.blu-ray > dd::before {
		padding-top: calc(141% * 0.4);
	}

	#release #modal_VIZL-3100 .data > dl.cd > dd::before {
		padding-top: calc(100% * 0.4);
	}

	#release #modal_VIZL-3111 .data > dl.blu-ray > dd::before {
		padding-top: calc(141% * 0.4);
	}

	#release #modal_VIZL-3111 .data > dl.cd > dd::before {
		padding-top: calc(100% * 0.4);
	}

	#release .modal .data > dl > dd > dl {
		margin-left: calc(40% + 24px);
		padding: 0 0 24px;
	}

	#release .track-list ol > li::before,
		#release .track-list ol p {
		font-size: 16px;
	}

	#release .modal .campaign dl {
		padding: 32px 24px 16px;
	}

	#youtube {
		padding: 80px 0 0px;
}

	#playlist {
		padding: 80px 0 120px;
	}

	#playlist .contents > ul > li {
		padding: 0 0 24px 0;
		width: 100%;
	}

	#playlist .contents > ul > li:last-child {
		padding: 0 0 0 0;
		width: 100%;
	}

	#link {
		padding: 80px 0 0;
	}

	footer .copyright p {
		font-size: 13px;
	}
}

/*--------------------------------------------------------------------------------------------------*/


@media only screen and (max-width: 880px) {

	#release .modal .campaign .lead + .notice + p {
		padding-top: 1em;
		clear: both
	}
}

/*--------------------------------------------------------------------------------------------------*/

@media only screen and (max-width: 680px) {

	body {
		font-size: 13px;
		line-height: 1.8;
	}

	.siteTitle {
		padding-top: calc(36% * 0.8);
		top: 50%;
		left: 50%;
		width: calc(100% * 0.8);
		background: url(../images/common/header/title_sp.svg) no-repeat center center;
		background-size: 100% auto;
		transform: translate(-50%, -50%);
	}

	#top .globalNav,
	#top .subscription {
		display: none;
	}

	.globalNav li {
		padding: 0.5em 0;
	}

	.menu .globalNav a {
		line-height: 2;
		font-size: 8vw;
	}

	.menu .globalNav li:nth-of-type(2) a {
		padding: 0.4em 1em 0.8em;
		font-size: 4.6vw;
	}

	.menu .globalNav li:nth-of-type(2) a span,
	.menu .globalNav li:nth-of-type(3) a span {
		font-size: 7vw;
	}

	.menu .subscription {
		padding-top: 6em;
		flex-wrap: wrap;
		width: 90%;
	}

.subscription li:nth-of-type(1) {
	width: calc(16% * 2);
}

.subscription li:nth-of-type(2) {
	width: calc(17% * 2);
}

.subscription li:nth-of-type(3) {
	width: calc(22% * 2);
}

.subscription li:nth-of-type(4) {
	width: calc(22% * 2);
}

.subscription li:nth-of-type(5) {
	width: calc(23% * 2);
}

	.sns-link {
		top: 17px;
	}

	#top .scroll {
		bottom: calc(6em + 12px);
		width: 40px;
		height: 12vh;
		font-size: 4vw;
	}

	#top::before {
		width: 40px;
		height: 6em;
		font-size: 4vw;
	}

#musicvideo {
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
}

#musicvideo video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

	/*--------------------------------------
	* コンテンツ
	* ---------------------------------------*/

	.primary section h2 {
		padding-bottom: 16px;
		font-size: 44px;
	}

	.primary section .contents {
		padding: 0 16px 0;
	}

	/*--------------------------------------
	news
	---------------------------------------*/
	#news {
		padding: 56px 0 80px;
	}

	#news .feed {
		padding: 0 16px;
	}

	#news .entry a {
		padding: 16px 32px 16px 0;
	}

	#news .entry time {
		font-size: 12px;
		display: block;
	}

	#news .entry p {
		display: block;
		font-size: 13px;
	}

	#news .entryList + ul {
		flex-direction: column;
		align-items: end;
	}

	#news .entryList + ul li:nth-of-type(2) {
		width: 100%;
	}

	#news .entryList + ul li:nth-of-type(1) a {
		height: auto;
		line-height: 2.6;
		border: none;
	}

	#news .entryList + ul li:nth-of-type(2) a {
		font-size: 13px;
	width: 100%;
	}

	#news .entryList + ul li:nth-of-type(2) a::after {
		display: none;
	}

	/*--------------------------------------
	release
	---------------------------------------*/
	#release {
	}

	#release .contents > ul::before {
		padding-top: 56px;
		font-size: 44px;
	}

	#release #double-setlist {
		padding: 136px 0 56px;
	}

	#release #double-setlist h3 {
		padding-top: calc(6% * 1 + 32px);
		width: calc(100% * 1 - 16px * 2);
	}

	#release .contents h3 span.media {
		font-size: 17px;
	}

	#release .contents .detail {
		padding: 0 16px;
	}

#release #double-setlist .detail {
		padding: 0 0;
}

	#release #double-setlist .detail .list > ul {
		gap: calc(16px * 2);
		gap: 0;
	}

	#release #double-setlist .detail .list > ul > li {
	padding: 0 16px 0;
		width: 50%;
	}

	#release #double-setlist .detail .list > ul > li > ul {
		padding-top: 1.5em;
		font-size: 30px;
	}

	#release #double-setlist h4 {
		margin: 16px 0 8px;
		padding-top: calc(48% * 1);
		width: calc(100% * 1);
		background: url(../images/contents/release/VIZL-3100/title_sp.webp) no-repeat top center;
		background-size: 100% auto;
	}

	#release #double-setlist #VIZL-3111 h4 {
		background: url(../images/contents/release/VIZL-3111/title_sp.webp) no-repeat top center;
		background-size: 100% auto;
	}

	#release #double-setlist .list > ul > li:not(#VIZL-3111) .date {
		padding-top: 0;
		width: calc(200% + 32px);
	}

	.modal button {
		top: 0;
		right: 0;
		height: 79px;
		width: 79px;
}

	#release .contents .date p {
		font-size: 26px;
	}

	#release .modal > div > div {
		padding: 0 16px 0;
	}

	#release .modal .lead p {
		font-size: 14px;
	}

	#release .modal .data > dl > dt {
		line-height: 2.4;
		font-size: 15px;
	}

	#release .modal .data > dl > dd {
		padding: 24px 0;
	}

		#release .modal .data > dl > dd::before {
		margin: 0 auto 8px;
		width: calc(100% * 1);
		float: none;
		}

#release #modal_VIZL-3100 .data > dl.blu-ray > dd::before {
	padding-top: calc(141% * 1);
	background: url(../images/contents/release/VIZL-3100/VIXL-1900.webp) no-repeat center top;
	background-size: 100% auto;
}

#release #modal_VIZL-3100 .data > dl.cd > dd::before {
	padding-top: calc(100% * 1);
	background: url(../images/contents/release/VIZL-3100/VICL-66300.webp) no-repeat center top;
	background-size: 100% auto;
}

#release #modal_VIZL-3111 .data > dl.blu-ray > dd::before {
	padding-top: calc(141% * 1);
	background: url(../images/contents/release/VIZL-3111/VIXL-1911.webp) no-repeat center top;
	background-size: 100% auto;
}

#release #modal_VIZL-3111 .data > dl.cd > dd::before {
	padding-top: calc(100% * 1);
	background: url(../images/contents/release/VIZL-3111/VICL-66311.webp) no-repeat center top;
	background-size: 100% auto;
}

	#release .modal .data > dl > dd > dl {
		margin-left: 0;
		padding: 0 0 32px;
	}

	#release .modal > div {
		padding: 60% 0 120px;
	}

	#release #modal_VIZL-3100 > div::before,
	#release #modal_VIZL-3111 > div::before,
	#release #modal_VIZL-3100 > div::after,
	#release #modal_VIZL-3111 > div::after {
		padding-top: 80%;
		left: 50%;
		width: 80%;
		transform: translateX(-50%);
		}

	#release #modal_VIZL-3100 > div::before,
	#release #modal_VIZL-3111 > div::before {
		margin-left: -40%;
		transform: translateX(0%);
	}

	#release #modal_VIZL-3100 h3,
	#release #modal_VIZL-3111 h3 {
		font-size: 20px;
	}

	#release #modal_VIZL-3100 h3 span.media,
	#release #modal_VIZL-3111 h3 span.media {
		font-size: 16px;
		}

	#release #modal_VIZL-3100 h3 span,
	#release #modal_VIZL-3111 h3 span {
		font-size: 30px;
	}

	#release .modal .date p {
		padding-top: 0.4em;
		font-size: 28px;
	}

	#release .modal .data > dl > dd > dl > dt::before {
		top: 0.5em;
		width: 0.6em;
		height: 0.6em;
	}

	#release .modal .data > dl > dd > dl > dd > ul.option > li > p {
		font-size: 15px;
		word-break: break-all;
	}

	#release #modal_VIZL-3100 .data > dl.blu-ray > dd > dl.limited > dd::after {
		margin-left: 1em;
		padding-top: 111%;
		background: url(../images/contents/release/VIZL-3100/photobook_sp.webp) no-repeat;
		background-size: 100% auto;
	}

	#release #modal_VIZL-3111 .data > dl.blu-ray > dd > dl.limited > dd::after {
		margin-left: 1em;
		padding-top: 111%;
		background: url(../images/contents/release/VIZL-3111/photobook_sp.webp) no-repeat;
		background-size: 100% auto;
	}

	#release #modal_VIZL-3100 .data > dl.cd > dd > dl.limited > dd::after,
	#release #modal_VIZL-3111 .data > dl.cd > dd > dl.limited > dd::after {
		margin-left: 1em;
	}

	#release .modal .data > dl.cd > dd > dl.vos > dd.smart-phone-shoulder:before,
	#release .modal .data > dl.cd > dd > dl.vos > dd.t-shirts:before,
	#release .modal .data > dl.blu-ray > dd > dl.vos > dd.shoulder:before,
	#release .modal .data > dl.blu-ray > dd > dl.vos > dd.boston:before {
		display: none;
	}



	#release .modal .data > dl.cd > dd > dl.vos > dd.smart-phone-shoulder:after,
	#release .modal .data > dl.cd > dd > dl.vos > dd.t-shirts:after,
	#release .modal .data > dl.blu-ray > dd > dl.vos > dd.shoulder:after,
	#release .modal .data > dl.blu-ray > dd > dl.vos > dd.boston:after {
		content: "";
		margin: 16px 0 2em 1em;
		padding-top: calc(55.34% * 1 + 0.4em);
		display: block;
		width: calc(100% * 1);
		height: 0;
font-size: 13px;
	text-align: center;
	line-height: 1.7;
	}

	#release .modal .data > dl.blu-ray > dd > dl.vos > dd.boston:after {
		content: "＜ボストンバッグ＞";
		background: url(../images/contents/release/VIZL-3100/boston_sp.webp) no-repeat;
		background-size: 100% auto;
	}

	#release .modal .data > dl.blu-ray > dd > dl.vos > dd.shoulder:after {
		content: "＜ムーンショルダー＞";
		background: url(../images/contents/release/VIZL-3100/shoulder_sp.webp) no-repeat;
	background-size: 100% auto;
	}

	#release .modal .data > dl.cd > dd > dl.vos > dd.smart-phone-shoulder:after {
		content: "＜携帯＆メガネケース＞";
		background: url(../images/contents/release/VIZL-3100/case_sp.webp) no-repeat;
		background-size: 100% auto;
	}

	#release .modal .data > dl.blu-ray > dd > dl.vos > dd.t-shirts:after {
		content: "＜Tシャツ＞";
		background: url(../images/contents/release/VIZL-3100/t-shirts_sp.webp) no-repeat;
		background-size: 100% auto;
	}

	#release .modal .data > dl.cd > dd > dl.vos > dd.t-shirts:after {
		content: "＜Tシャツ＞";
		background: url(../images/contents/release/VIZL-3100/t-shirts_sp.webp) no-repeat;
		background-size: 100% auto;
	}

	#release .modal .data > dl > dd > dl > dd:nth-of-type(2) {
		padding: 32px 0 0 1em;
	}

	#release .modal .data a {
		font-size: 13px;
		width: 6em;
		line-height: 2.4;
	}

	#release .track-list > dl {
		flex-wrap: wrap;
		gap: 8px 16px;
	}

	#release .track-list > dl > dt {
		width: 6em;
	}

	#release .track-list > dl > dd {
		display: contents;
	}

	#release .track-list ol {
		padding-bottom: 16px;
		column-count: 1;
		flex: 1;
	}

	#release .track-list ol > li::before, #release .track-list ol p {
		font-size: 14px;
	}

	#release #modal_VIZL-3100 .track-list .notice,
	#release #modal_VIZL-3111 .track-list .notice {
	width: 100%;
}

	#release .track-list dl.bonus-track dt,
	#release .track-list dl.bonus-track li p {
		font-size: 14px;
	}

	#release .modal .campaign dl {
		padding: 24px 16px 16px;
	}

	#release .modal .campaign dt {
		padding-bottom: 24px;
		line-height: 1.6;
		font-size: 15px;
		}

	#release .modal .campaign dd {
		padding: 24px 0 0;
	}

	#release .modal .campaign dd.link {
		padding: 24px 0 16px;
	}

	#release .modal .campaign dt br {
		display: block;
	}

	#release .modal .campaign dd.campaign-detail::before {
		display: none;
	}

	#release .modal .campaign dd.campaign-detail::after {
		content: "";
		margin: 16px 0 0;
		padding-top: calc(65% * 1);
		display: block;
		width: calc(100% * 1);
		height: 0;
		background: url(../images/contents/release/VIZL-3100/poster.webp) no-repeat;
		background-size: 100% auto;
	}

	#release .modal .campaign dd.campaign-detail p:not(:first-child) {
		padding: 0;
		clear: both;
	}

	#release .modal .campaign ul.link {
	padding-top: 24px;
		flex-direction: column;
		align-items: center;
		gap: 16px;
	}

	#release .modal .campaign .link a {
		font-size: 15px;
		gap: 8px;
	}

	.modal button.js-modal-switch {
		font-size: 15px;
	}

	#release #VIZL-3100 .jacket::before,
	#release #VIZL-3111 .jacket::before,
	#release #VIZL-3100 .jacket::after,
	#release #VIZL-3111 .jacket::after {
		display: none;
	}

	#release .info button, #release .data a {
		margin: 1.4em auto 0;
		width: 10em;
		line-height: 3;
		font-size: 14px;
}

	#release #VE3WT-12218 {
		padding: 56px 0 64px;
	}

	#release #VE3WT-12218 .jacket {
		width: 76%;
	}

	#release #VE3WT-12218 h3 {
		padding-top: calc(33% * 0.3 + 32px);
		width: calc(100% * 0.3);
	}

	#release #VE3WT-12218 .date p {
		padding: 0.2em 0;
		font-size: 24px;
	}



	/*--------------------------------------
	youtube
	---------------------------------------*/
	#youtube {
		padding: 80px 0 0;
	}

	/*--------------------------------------
	playlist
	---------------------------------------*/
	#playlist {
		padding: 80px 0 80px;
	}

	/*--------------------------------------
	link
	---------------------------------------*/
	#link {
		padding: 64px 0 0;
	}

	#link .contents {
		padding: 0px 0 24px;
	}

	#link ul {
		align-items: center;
}

#link a {
	padding: 24px 16px 16px;
		font-size: 18px;
	}


	#link a::before {
		margin-left: -6px;
		top: 9px;
	border-style: solid;
	border-width: 10px 6px 0 6px;
	border-color: #c7c6cb transparent transparent transparent;
	}


	footer .copyright::before {
		padding-top: 23%;
		width: 49%;
	}

	footer .copyright {
		padding-bottom: 80px;
	}

	footer .copyright p {
		font-size: 12px;
		line-height: 1.5;
		}

	footer .copyright br {
		display: block;
	}
}

@media only screen and (max-width: 375px) {
	#news .entryList + ul li:nth-of-type(2) a {
		font-size: 13px;
	}
}

@media screen and (orientation: landscape) {



}