@charset "UTF-8";

section {
	width: 100%;
	height: auto;
	margin: auto;
	padding: 2vh 0 2vh;
	background-position: center top;
	background-size: 100%;
	background-repeat: no-repeat;
}
section.bg_left {
	padding-top: 5vw;
	background-image: url("../images/bg_left.jpg");
}
section.bg_right {
	padding-top: 5vw;
	background-image: url("../images/bg_right.jpg");
}
section.bg_center {
	padding-top: 3vw;
	background-image: url("../images/bg_center.jpg");
}
section h2 {
	font-family: "Libre Caslon Display", serif;
	font-size: clamp(2rem, 0.95rem + 3.5vw, 3.75rem);
	font-weight: 400;
	letter-spacing: .05em;
	text-align: center;
	margin: 0vw auto 5vw auto;
}
.bg_left h2 {
	text-align: right;
}
.bg_right h2 {
	text-align: left;
}
.bg_center h2 {
	font-size: clamp(1.5rem, 1.05rem + 1.5vw, 2.25rem);
	text-align: center;
}
section h3 {
	font-family: "Libre Caslon Display", serif;
	color:#333;
	font-size: clamp(1.25rem, 0.8rem + 1.5vw, 2rem);
	text-align: center;
	margin: 2vw auto 2vw auto;
}
section h4 {
	color:#333;
	font-size: clamp(1.125rem, 0.75rem + 1.25vw, 1.75rem);
	text-align: center;
	margin: 2vw auto 1vw auto;
}

img {
	width:100%;
}
article {
	padding: 0em 0 5vh;
}
ul {
	list-style: none;
}
.contentsBody {
	max-width: 1280px;
	min-width: 320px;
	margin: 0px auto 0px auto;
}

.flex {
	display: flex;
	justify-content: space-between;
}
.flex_c {
	display: flex;
	justify-content: center;
	gap: 5%;
}
.wrap {
	flex-wrap: wrap;
}
.tax {
	font-size: 80%;
}
.note {
	font-size: 80%;
}

/*
#mainArea
*/
#mainArea {
	width: 100%;
	height: auto;
	padding:0!important;
	position: relative;
	overflow: hidden;
	z-index: 10;
}
#mainArea #main {
	color: #fff;
	width: 100%;
	height: calc(100vw*.5625);
	display: flex;
	justify-content: center;
	align-items: center;
}

#main #titleArea {
	width: 50%;
	text-align: center;
}
#main h1 {
	width:50%;
	max-width: 420px;
	height: auto;
	margin: auto;
}
#main h1 img {
	width:100%;
	height: auto;
}
#main h1 #logo {
	margin: 10vh 0;
}
#main #photoArea {
	width: 50%;
	text-align: center;
}
#main #photoArea img {
	width: 75%;
	max-width: 960px;
}
#mainArea #star {
	width: 50vw;
	height: 50vw;
	position: absolute;
	top: -25vw;
	left: -25vw;
	opacity: 0.3;
	z-index: 12;
}


/*
#newsArea
*/
#newsArea {
	margin-top: -15vh;
}
#newsArea .contentsBody {
	margin-top: 15vw;
	display: flex;
	justify-content: flex-start;
}
#news {
	flex-grow: 1;
	max-width: 1080px;
	padding-left: 4vh;
	margin: 0 4vh 4vh 4vh;
}
#news .heading {
	width: 20%;
}
#newsList {
	width: 100%;
	margin: 0px auto 0px auto;
	padding: .1em;
}
#news ul {
	color:#333;
	width: 100%;
	text-align: left;
	list-style: none;
}
#news ul li {
	font-size: 16px;
	line-height: 1.2;
}
#news ul li a {
	color:#333;
	text-decoration: none;
	padding: .5em 0;
	display: flex;
	justify-content: flex-start;
	transition: .2s ease-out;
}

#news ul li a:hover {
	color:#2f54a6;
	background: rgba(255,255,255,0.5);
}
#news ul li span.date {
	font-family: "Libre Caslon Text", serif;
	text-align: right;
	font-weight: 300;
	flex-shrink: 0;
	padding: .5em 1em .5em 0em;
	width: 8em;
}
#news ul li span.text {
	flex-grow: 1;
	padding: .5em 0em .5em 1em;
	border-left: 1px solid #999;
}
#news .arrow_link {
	float: right;
}

/*
#Release
*/
#releaseArea {
}
#releaseArea h3 {
	color: #666;
	text-align: center;
	margin-bottom: 1em 0;
}
#releaseArea .flex {
}
#releaseArea .dataArea {
	font-size: clamp(1.375rem, 1rem + 1.25vw, 2rem);
	width: 45%;
}
#releaseArea .dataArea .sub {
	font-size: 60%;
	line-height: 1.5;
	font-weight: 1000;
	display: inline-block;
	margin: 0em auto 0em;
	padding: .2em 0;
}
#releaseArea .dataArea .title {
	font-size: 150%;
	line-height: 1.5;
	margin: .5em auto .5em;
}
#releaseArea .dataArea .title span {
	font-size: 80%;
}
#releaseArea .dataArea .release {
	font-size: 100%;
	line-height: 1.5;
	margin: 1em auto 1em;
}
#releaseArea .dataArea .lead {
	font-size: 50%;
	line-height: 1.8;
	margin: 1em auto 2em;
}
#releaseArea .dataArea .format {
	margin-top: 6vw;
}
#releaseArea .dataArea .data {
	font-size: 16px;
	margin-bottom: 4vw;
}
#releaseArea .dataArea .data dl {
	margin-bottom:2em;
}
#releaseArea .dataArea .data dt {
	font-weight: 1000;
	margin-bottom: .5em;
}
#releaseArea .dataArea .data .orderBtn {
	margin-top: .5em;
}
#releaseArea .artwork {
	width: 50%;
	margin-top: -5vw;
}
#releaseArea figure {
	font-size: 16px;
	margin-bottom: 2vw;
}

#releaseArea #summary {
	font-size: clamp(1rem, 0.925rem + 0.25vw, 1.125rem);
	width: 80%;
	margin: 8vw auto;
	padding: 2em;
	background-color: rgba(255,255,255,.8);
	border-radius: 1em;
}
#releaseArea #summary p {
	line-height: 1.8;
}
#releaseArea #summary p.sign {
	float: right;
}
#releaseArea #summary p.sign img {
	height: 40px;
}
#releaseArea .bg_center {
	width: 100%;
	padding-top: 5vh;
	background-image: url("../images/bg_center.jpg");
	background-position: center top;
	background-size: 100%;
	background-repeat: no-repeat;
}

#releaseArea #track {
	font-size: 18px;
	column-count: 1;
	margin: 0 4vw 0;
}
#releaseArea #track h3 {
	text-align: center;
	margin: 4vw auto;
}
#releaseArea #track h3 span {
	font-size: 75%;
	font-weight: bold!important;
}
#releaseArea .tracklist {
	max-width: 1080px;
	margin: 0 auto 6vw;
}
#releaseArea .tracklist li {
	line-height: 1.5;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin: 0px auto .5em auto;
	padding-bottom: .5em;
	border-bottom: 1px solid #ccc;
}
#releaseArea .tracklist .trackNum {
	color:#333;
	font-size: 120%;
	font-weight: 1000;
	text-align: center;
	box-sizing: border-box;
}
#releaseArea .tracklist .trackNum span {
	font-size: 50%;
}
#releaseArea .tracklist .track {
	font-size: 130%;
	font-weight: 1000;
	text-align: left;
	margin-left: 1em;
	flex-grow: 1;
}
#releaseArea .tracklist .credit {
	font-size: 65%;
	font-weight: 400;
	display: block;
}
#releaseArea .tracklist .select {
	font-size: 75%;
	font-weight: 1000;
	display: inline-block;
	margin-left: 1em;
}
#releaseArea .tracklist .link i {
	margin: auto .2em;
}
#releaseArea .tracklist .link a {
	color:#fff !important;
	font-size:16px;
	line-height:1.2;
	text-decoration: none;
	text-align: center;
	transition: .2s ease-out;
	cursor: pointer;
	background: #d798cc;
	border: 1px solid #d798cc;
	padding: .2em .5em;
	display:block;
	border-radius: 1em;
}
#releaseArea .tracklist .link a:hover {
	color: #d798cc !important;
	background-color: #fff !important;
}

#feat article {
	border-bottom: 1px solid #ccc;
}
#feat h3 {
	margin: 2em auto;
}
#feat h3 .note {
	font-size: 16px;
	display: block;
}
#feat h4 {
	margin: 2em auto 1em;
}
#feat .arrow_link {
	font-size: 120%;
	margin-top: 1em;
}
#feat .cnt {
	flex-grow: 1;
}
#feat #feat {
	padding-top: 5vw;
}
#feat #vos .flex {
	align-items: center;
}
#feat #special_live .entry {
	font-size: 120%;
	text-align: center;
	margin-bottom: 2em;
}
#feat #special_live .entry span {
	padding: .5em 1em;
	border: 1px solid #666;
	border-radius: .2em;
}
#feat #special_live .sp_live {
	font-size: 150%;
	font-weight: bold;
	text-align: center;	
}
#feat #special_live dl {
	font-size: 100%;
	text-align: center;
	margin: 2em auto;
}
#feat #special_live dt {
	font-weight: bold;
	margin-bottom: 1em;
}
#feat #special_live dt span {
	padding-bottom: .3em;
	border-bottom: 1px solid #666;
}
#feat #special_live dd {
	line-height: 1.8;
	margin-bottom: 1em;
}
#feat #bonus p.lead {
	font-size: 120%;
	font-weight: bold;
	text-align: center;	
}
#feat #bonus h4 {
	font-size: 100%;
	margin: 2em auto 1em;
}
#feat #bonus ul.shop {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin-bottom: 4vh;
	gap: 2em;
}
#feat #bonus ul.shop li {
	text-align: center;
	width: 22%;
	border: 1px solid #666;
}
#feat #bonus ul.shop li .shop {
	font-weight: bold;
	padding: .5em;
	border-bottom: 1px solid #666;
}
#feat #bonus ul.shop li .item {
	padding: .5em;
}
#feat #bonus ul.shop2 {
	display: flex;
	justify-content: center;
	align-content: center;
	flex-wrap: wrap;
	gap: 2em;
	margin-bottom: 4vh;
}
#feat #bonus ul.shop2 li {
	text-align: center;
	width: 20%;
	border: 1px solid #666;
}
#feat #bonus ul.shop2 li .shop {
	font-weight: bold;
	display: flex;
	justify-content: center;
	align-items: center;
}

/*
movie
*/
#movieArea {
}
#movie {
	text-align: center;
	width: 80%;
	max-width: 960px;
	margin: 0px auto 2em auto;
}
.movie {
	height: auto;
	vertical-align: top;
	padding-bottom: 2em;
}
.movie1 {
	width: 100%;
}
.movie2 {
	width: 48%;
}
.movie3 {
	width: 32%;
}
.movie .yt {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.movie .yt iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}
#movie .linkBtn {
	display: block;
	margin: 20px auto;
}

/*
#linkArea
*/
#linkArea {
	text-align: center;
}
#linkArea ul {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 4em;
}
#linkArea ul li {
	margin-bottom: 4em;
}
#linkArea ul li img {
	width: auto;
	height: auto;
	max-height: 50px;
}
#linkArea ul#site li img {
	width: auto;
	height: auto;
	max-height: 80px;
}
#linkArea ul#sns li img {
	width: 100%;
	max-height: 50px;
}
#linkArea ul#stream li img {
	width: auto;
	height: auto;
	max-height: 60px;
}



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

section {
	width: 100%;
	height: auto;
	margin: auto;
	padding: 0vh 0 5vh;
}
bg_left {
	padding-top: 0vw;
}
.bg_right {
	padding-top: 0vw;
}
.bg_center {
	padding-top: 0vw;
}
article {
	padding: 0em 0 5vh;
}
.contentsBody {
	max-width: 1280px;
	min-width: 320px;
	margin: 0px 4vw 0px 4vw;
}
section h2 {
	text-align: center;
	margin: 0vw auto 10vw auto;
}

/*
#mainArea
*/
#mainArea {
	width: 100%;
}
#mainArea #main {
	color: #fff;
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
#main #titleArea {
	width: 100%;
	text-align: center;
	margin: 8vh 0 3vh;
}
#main h1 {
	width:50%;
	height: auto;
	margin: auto;
}
#main h1 #logo {
	margin: 2vh 0;
}
#main #photoArea {
	width: 100%;
}
#main #photoArea img {
	width: 100%;
}
#mainArea #star {
	width: 100vw;
	height: 100vw;
	position: absolute;
	top: -50vw;
	left: -50vw;
	opacity: 0.3;
	z-index: 11;
}


/*
#newsArea
*/
#newsArea {
	margin-top: 10vh;
}
#newsArea .contentsBody {
	display: block;
	margin-top: 0;
	padding-top: 0;
}
#news {
	padding-left: 0vh;
	margin: 0 5vw;
}
#news .heading {
	width: 20%;
}
#news ul li {
	font-size: 16px;
	line-height: 1.2;
}
#news ul li a {
	padding: .5em 0;
	display: flex;
	flex-direction: column;
}

#news ul li a:hover {
	color:#2f54a6;
	background: rgba(255,255,255,0.5);
}
#news ul li span.date {
	text-align: left;
	padding: .5em 1em .5em 0em;
}
#news ul li span.text {
	flex-grow: 1;
	padding: .2em 0em .2em 1em;
}

/*
#Release
*/
#releaseArea {
}
#releaseArea h3 {
	color: #666;
	text-align: center;
	margin-bottom: 1em;
}
#releaseArea .flex {
	flex-direction: column;
}
#releaseArea .dataArea {
	width: 90%;
	margin: auto;
}
#releaseArea .dataArea .sub {
	margin: 0em auto 0em;
	padding: .2em 0;
}
#releaseArea .dataArea .title {
	margin: .5em auto .5em;
}
#releaseArea .dataArea .release {
	margin: 1em auto 1em;
}
#releaseArea .dataArea .lead {
	font-size: 80%;
	line-height: 1.8;
	margin: 1em auto 2em;
}
#releaseArea .dataArea .format {
	margin-top: 6vw;
}
#releaseArea .dataArea .data {
	font-size: 16px;
	margin-bottom: 4vw;
}
#releaseArea .dataArea .data dl {
	margin-bottom:2em;
}
#releaseArea .dataArea .data dt {
	font-weight: 1000;
	margin-bottom: .5em;
}
#releaseArea .dataArea .data .orderBtn {
	margin-top: .5em;
}
#releaseArea .artwork {
	width: 100%;
	margin-top: -5vw;
}
#releaseArea figure {
	width: 90%;
	margin: 0 auto 2vw;
}

#releaseArea #summary {
	width: 90%;
	margin: 8vw auto;
	padding: 2em;
	background-color: rgba(255,255,255,.8);
	border-radius: 1em;
}
#releaseArea #summary p {
	line-height: 1.8;
}
#releaseArea #summary p.sign {
	margin-top: 1em;

}
#releaseArea #summary p.sign img {
	height: 40px;
}
#releaseArea .bg_center {
	width: 100%;
	padding-top: 0vh;
}

#releaseArea #track {
}
#releaseArea #track h3 {
	margin-top: 5vh;
}
#releaseArea #track h3 span {
}
#releaseArea .tracklist {
}
#releaseArea .tracklist li {
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	margin: 0px auto .5em auto;
	padding-bottom: .5em;
}
#releaseArea .tracklist .trackNum {
	font-size: 130%;
}
#releaseArea .tracklist .trackNum span {
	font-size: 50%;
}
#releaseArea .tracklist .track {
	font-size: 120%;
	text-align: left;
	margin-left: 0em;
}
#releaseArea .tracklist .credit {
	font-size: 65%;
	margin-bottom: 5px;
}
#releaseArea .tracklist .select {
	font-size: 75%;
	display: block;
	margin-left: 0em;
	margin-bottom: 5px;
}
#releaseArea .tracklist .link i {
	margin: auto .2em;
}

#feat article {
	border-bottom: 1px solid #ccc;
}
#feat h3 {
	font-size: 150%;
	margin: 2em auto;
}
#feat h3 .note {
	font-size: 16px;
	display: block;
}
#feat h4 {
	margin: 2em auto 1em;
}
#feat .arrow_link {
	font-size: 120%;
	margin-top: 1em;
}
#feat .cnt {
	flex-grow: 1;
}
#feat #feat {
	padding-top: 5vw;
}
#feat #vos .flex {
}
#feat #special_live .entry {
}
#feat #special_live .entry span {
	display: block;
}
#feat #special_live .sp_live {
}
#feat #special_live dl {
}
#feat #special_live dt {
}
#feat #special_live dt span {
}
#feat #special_live dd {
}
#feat #bonus p.lead {
}
#feat #bonus h4 {
}
#feat #bonus ul.shop {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin-bottom: 4vh;
	gap: 2em;
}
#feat #bonus ul.shop li {
	width: 80%;
}
#feat #bonus ul.shop li .shop {
}
#feat #bonus ul.shop li .item {
}
#feat #bonus ul.shop2 {
	display: flex;
	justify-content: center;
	align-content: center;
	flex-wrap: wrap;
	gap: 2em;
	margin-bottom: 4vh;
}
#feat #bonus ul.shop2 li {
	width: 80%;
}
#feat #bonus ul.shop2 li .shop {
}


/*
movie
*/
#movieArea {
}
#movie {
	width: 100%;
	margin: 0px auto 2em auto;
}
.movie {
}
.movie1 {
	width: 100%;
}
.movie2 {
	width: 100%;
}
.movie3 {
	width: 100%;
}
.movie .yt {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.movie .yt iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}
#movie .linkBtn {
	display: block;
	margin: 20px auto;
}

/*
#linkArea
*/
#linkArea {
	text-align: center;
}
#linkArea ul {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 0em;
}
#linkArea ul li {
	margin-bottom: 2em;
}
#linkArea ul li img {
	width: auto;
	height: auto;
	max-height: 50px;
}
#linkArea ul#site li img {
	width: auto;
	height: auto;
	max-height: 80px;
}
#linkArea ul#sns li {
	padding: .5em;
}
#linkArea ul#sns li img {
	width: 100%;
	max-height: 50px;
}
#linkArea ul#stream li img {
	width: auto;
	height: auto;
	max-height: 60px;
}

}