@charset "utf-8";
.section_area{
	width: 100%;
	position: relative;
	opacity: 0;
	transition: opacity 1s ease;
	transition-delay: .8s;
}
.section_area.is-ani{
	opacity: 1;
}
.ani-fade.js-scrani,
.section_area.js-scrani{
	opacity: 0;
	filter: blur(15px);

	transition: all .8s ease;
	transition-delay: .2s;
}
.ani-fade.is-ani,
.section_area.is-ani{
	opacity: 1;
	filter: blur(0);
}
.news__listsBlock.ani-fade{
	transition-delay: .6s;
}


/*-----------------------------------------------
 * Music
-------------------------------------------------*/
.musicArea{
	position: relative;
	padding-bottom: min(calc(160 / var(--vw-min) * 100vw),160px);
	position: relative;
	z-index: 10;
}
.musicArea .area__inner{
	margin: 0 auto;
}
.musicCont{
	width: min(calc(1000 / var(--vw-min) * 100vw),1000px);
	margin: min(calc(80 / var(--vw-min) * 100vw),80px) auto 0;
}
@media screen and (max-width:767px){ 
	.musicArea .area__inner{
		width: 100%;
		padding: calc(224 / var(--vw-min) * 100vw) 0 0;
	}
	.musicCont{
		width: 100%;
	}
}

/* ttl */
.sub .music__ttl{
	position: relative;
	margin-bottom:min(calc(34 / var(--vw-min) * 100vw),34px);
}
.music__ttl_en{
	display: block;
	background: url(../img/music/music.png)no-repeat center center / contain;
	width: min(calc(194 / var(--vw-min) * 100vw),194px);
	height: min(calc(93/ var(--vw-min) * 100vw),93px);
	margin-bottom:min(calc(20 / var(--vw-min) * 100vw),20px);
}
.section__ttl_jp{
	font-size:min(calc(16 / var(--vw-min) * 100vw),16px);
}
@media screen and (max-width:767px){ 
	.sub .music__ttl{
		padding: 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: calc(88 / var(--vw-min)* 100vw);
	}
	.music__ttl_en{
		width: calc(272 / var(--vw-min) * 100vw);
		height: calc(122 / var(--vw-min) * 100vw);
	}
}
.pageTtl__deco{
	display: block;
	width: 100%;
	height: min(calc(10 / var(--vw-min) * 100vw),10px);
	background: url(../img/common/deco/section_ttl_deco.png) no-repeat center bottom;
    background-size: min(calc(34 / var(--vw-min) * 100vw), 34px) auto;
	position: relative;
}
.pageTtl__deco:before,
.pageTtl__deco::after{
	z-index: 1;
	position: absolute;
	bottom: min(calc(5 / var(--vw-min) * 100vw), 5px);
	left: 0;
	content: "";
	height: 1px;
	width: calc(50% - min(calc(30 / var(--vw-min) * 100vw), 30px));
	background-color:#B79487;
}
.pageTtl__deco:before{
		left: unset;
		right: 0;
}
@media screen and (max-width: 767px) {
	.pageTtl__deco{
		height:calc(18 / var(--vw-min) * 100vw);
		background-size:calc(60 / var(--vw-min) * 100vw) auto;
	}
	.pageTtl__deco:before,
	.pageTtl__deco::after{
		bottom: calc(8 / var(--vw-min) * 100vw);
		width: calc(50% - calc(60 / var(--vw-min) * 100vw));
	}
}

/* pageNav */
.pageNav{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: min(calc(20 / var(--vw-min) * 100vw), 20px);
  margin-bottom: min(calc(36 / var(--vw-min) * 100vw), 36px);
  width: 100%;
  max-width: min(calc(1000 / var(--vw-min) * 100vw), 1000px);
  margin-left: auto;
  margin-right: auto;
}
.pageNav__item{
  width: fit-content;
  font-family: var(--font-en);
  position: relative;
  padding-bottom: min(calc(6 / var(--vw-min) * 100vw), 6px);
  display: flex;
  justify-content: center;
}

.pageNav__item:last-child{
	margin-right:0;
}
.pageNav__item::after {
	position: absolute;
	content: "";
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: min(calc(12 / var(--vw-min) * 100vw), 12px);
	height: min(calc(4 / var(--vw-min) * 100vw), 4px);
	background: url(../img/common/deco/pagenav_arrow.svg) no-repeat center bottom / contain;
}
@media screen and (max-width: 767px) {
	.pageNav__item::after {
		width:calc(16 / var(--vw-min) * 100vw);
		height: calc(6 / var(--vw-min) * 100vw);
	}
}
.pageNav__item--link {
  text-decoration: none;
  color: var(--color-brown);
  padding: 0 min(calc(20 / var(--vw-min) * 100vw), 20px);
  background-image: url(../img/common/deco/pagenav_left.svg),
                    url(../img/common/deco/pagenav_right.svg);
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: left center, right center;
  transition: color .4s ease;
  min-width: min(calc(227 / var(--vw-min) * 100vw), 227px);
  font-size: min(calc(15 / var(--vw-min) * 100vw), 15px);
}
.link__inner{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 min(calc(20 / var(--vw-min) * 100vw), 20px);
  background-image: url(../img/common/deco/pagenav_center.svg);
  background-repeat: repeat-x;
  background-size: auto 100%;
  background-position: 0 0;
  height: min(calc(50 / var(--vw-min) * 100vw), 50px);
}
@media screen and (max-width: 1024px) {
	.link__inner{
		height: min(calc(52 / var(--vw-min) * 100vw), 50px);
	}
}
@media screen and (max-width: 767px) {
	.link__inner{
		padding:0 calc(22 / var(--vw-min) * 100vw);
    background-repeat: round;
    background-size: auto 100%;
    background-position: left top;
		height: calc(71 / var(--vw-min) * 100vw);
    background-image: url(../img/common/deco/pagenav_center_custom.svg);

	}
}
@media screen and (max-width: 430px) {
  .link__inner{
    height: calc(77 / var(--vw-min) * 100vw);
    background-image: url(../img/common/deco/pagenav_center_custom.svg);
  }
}
@media screen and (max-width: 428px) {
	.link__inner{
		height: calc(77 / var(--vw-min) * 100vw);
    background-image: url(../img/common/deco/pagenav_center_custom.svg);
	}
}
@media screen and (max-width: 420px) {
	.link__inner{
	  height: calc(78 / var(--vw-min) * 100vw);
    background-image: url(../img/common/deco/pagenav_center_custom.svg);
	}
}
@media screen and (max-width: 414px) {
	.link__inner{
		height: calc(71 / var(--vw-min) * 100vw);
    background-image: url(../img/common/deco/pagenav_center_custom.svg);
	}
}
@media screen and (max-width: 390px) {
	.link__inner{
		height: calc(72 / var(--vw-min) * 100vw);
    background-image: url(../img/common/deco/pagenav_center_custom.svg);
	}
}

@media screen and (max-width: 375px) {
	.link__inner{
		height: calc(73 / var(--vw-min) * 100vw);
    background-image: url(../img/common/deco/pagenav_center_custom.svg);
	}
}
@media screen and (hover:hover) and (pointer: fine) and (min-width:768px){
	.pageNav__item:hover .pageNav__item--link{
		background-image: url(../img/common/deco/pagenav_left_on.svg),url(../img/common/deco/pagenav_right_on.svg);
		color: #FFF;
	}
	.pageNav__item:hover .link__inner{
		background-image: url(../img/common/deco/pagenav_center_on.svg);
	}
}

@media screen and (max-width: 767px) {
	.pageNav {
    margin-bottom: calc(48 / var(--vw-min) * 100vw);
    padding: 0 calc(24 / var(--vw-min) * 100vw);
  }

  .pageNav__item {
    min-width: calc(227 / var(--vw-min) * 100vw);
    width: fit-content;
    padding-bottom: calc(8 / var(--vw-min) * 100vw);
  }

  .pageNav__item--link {
    padding: 0 calc(28 / var(--vw-min) * 100vw);
  }
}

/* lists */
.musicContBox:not(:last-child){
  margin-bottom: 100px;
}

@media screen and (max-width: 768px) {
	.musicContBox{
		padding: 0 calc(48 / var(--vw-min) * 100vw);
	}
	.musicContBox:not(:last-child){
    margin-bottom: calc(128 / var(--vw-min) * 100vw);
  }

}
/* subTtl */
.subTtl{
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-bottom: min(calc(40 / var(--vw-min) * 100vw), 40px);
  flex-direction: column;
}
.subTtl_en{
	display: block;
	font-size:min(calc(42 / var(--vw-min) * 100vw), 42px);
	font-weight: 400;
	font-family: var(--font-en);
	letter-spacing: 0.03em;
	position: relative;
	padding: 0 min(calc(60 / var(--vw-min) * 100vw), 60px);
}
.subTtl_jp{
	display: block;
	font-size:min(calc(15 / var(--vw-min) * 100vw), 15px);
	letter-spacing: 0.1em;
	font-family: var(--font-en);
}
@media screen and (max-width: 768px) {
	.subTtl{
		margin-bottom: calc(48 / var(--vw-min) * 100vw);
	}
	.subTtl_en{
		font-size:calc(56 / var(--vw-min) * 100vw);
		padding: 0 calc(68 / var(--vw-min) * 100vw);
	}
	.subTtl_jp{
		font-size:calc(24 / var(--vw-min) * 100vw);
	}
}
.subTtl_en::before,
.subTtl_en::after{
  content: "";
  width: min(calc(52 / var(--vw-min) * 100vw), 52px);
  height:min(calc(5 / var(--vw-min) * 100vw), 5px);
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  z-index: 0;
  background: url(../img/common/deco/subttl_deco.svg) no-repeat center center / contain;
}
@media screen and (max-width: 768px) {
	.subTtl_en::before,
	.subTtl_en::after{
	content: "";
	width:calc(68 / var(--vw-min) * 100vw);
	height:calc(6 / var(--vw-min) * 100vw);
	}
}
.subTtl_en::before{
	left: 0;
}
.subTtl_en::after{
	right: 0;
}


.musicContBox__inBox{
  margin-bottom: min(calc(56 / var(--vw-min) * 100vw),56px);
}
@media screen and (max-width: 768px) {
  .musicContBox__inBox{
    margin-bottom: 0;
  }
}

/*--------------------
circle
------------------- */
.circleBoxWrap{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	pointer-events: none;
	z-index: -1;
}
.circleBox{
	position: sticky;
	top: 0;
	bottom: 0;
	margin: auto;
	left: 0;
	width: 100%;
	height: 100vh;
	overflow-x: hidden;
	pointer-events: none;
	z-index: 3;
	display: flex;
	align-items:center;
}
.circleBox__inner{
	width: 100%;
	height: calc(501 / var(--vw-min)* 100vw);
	position: relative;
}
@media screen and (max-width:768px) {
	.circleBox{
		position: absolute;
		top: 0;
		bottom: unset;
		align-items:flex-start;
	}
	.circleBox__inner{
		width: 100%;
		height: calc(420 / var(--vw-min)* 100vw);
		position: relative;
	}
}

.circle-tp{
	mask-image: url(../img/common/bg_circle.svg);
	mask-repeat: no-repeat;
	mask-size: contain;
	width: calc(120 / var(--vw-min) * 100vw);
	height: calc(120 / var(--vw-min) * 100vw);
	background: url(../img/common/deco/bg_transparent.jpg) left top;
	background-size: 12px auto;
	animation: floating 5s ease infinite alternate-reverse;
}
.circle-grad{
	mask-image: url(../img/common/deco/bg_grd.png);
	mask-repeat: no-repeat;
	mask-size: contain;
	width: calc(150 / var(--vw-min) * 100vw);
	height: calc(150 / var(--vw-min) * 100vw);
	opacity: 0.8;
	background: linear-gradient(to bottom right, #DAF5FB, #D9DFF2);
	background-size: 100% 100%;
	animation: floating 3s ease-in-out infinite alternate;
}
@keyframes floating {
	0% {
		transform: translate(-3%,3%);
	}
	100% {
	  transform: translate(4%,-3%);

	}
}

/* scrani */
.circleBox .circle-tp.js-scrani{
	opacity: 0;
	transition: opacity 1s ease;
}
.circleBox .circle-tp.js-scrani.is-ani{
	opacity: 1;
}

.circleBox .circle-grad.js-scrani{
	opacity: 0;
	transition: opacity 1s ease;
}
.circleBox .circle-grad.js-scrani.is-ani{
	opacity: .8;
}
@media screen and (max-width:768px) {
	.circleBox .circle-grad.js-scrani,
	.circleBox .circle-tp.js-scrani{
		opacity: 1!important;
	}
}
._circle1{
	position: absolute;
	right: calc(100 / var(--vw-min) * 100vw);
	bottom:calc(20 / var(--vw-min) * 100vw);
	background: linear-gradient(to bottom right, #CCEDE3, #D9DFF2);
}
._circle2{
	position: absolute;
	right: calc(80 / var(--vw-min) * 100vw);
	bottom: 0;
	animation-delay: 1s;
}
._circle3{
	width: calc(200 / var(--vw-min) * 100vw);
	height: calc(200 / var(--vw-min) * 100vw);
	position: absolute;
	right: calc(-80 / var(--vw-min) * 100vw);
	top: 0;
	animation: floating 4s ease infinite alternate-reverse;
	background: linear-gradient(to bottom right, #DAF5FB, #D9DFF2);
	background-size: 100% auto;
}
._circle4{
	width: calc(160 / var(--vw-min) * 100vw);
	height: calc(160 / var(--vw-min) * 100vw);
	position: absolute;
	left: calc(-30 / var(--vw-min) * 100vw);
	top: calc(96 / var(--vw-min) * 100vw);
}
._circle5{
	width: calc(170 / var(--vw-min) * 100vw);
	height: calc(170 / var(--vw-min) * 100vw);
	position: absolute;
	left: calc(46 / var(--vw-min) * 100vw);
	top: calc(160 / var(--vw-min) * 100vw);
	background: linear-gradient(to bottom right, #CCEDE3, #D9DFF2);
}
@media screen and (max-width:767px){
	._circle1{
		left: unset;
		right: calc(-40 / var(--vw-min) * 100vw);
		top: calc(112 / var(--vw-min) * 100vw);
		bottom: unset;
		width:calc(170 / var(--vw-min) * 100vw);
		height:calc(170 / var(--vw-min) * 100vw);
	}
	._circle2{
		display: none;
	}
	._circle3{
		display: none;
	}
	._circle4{
		width: calc(180 / var(--vw-min) * 100vw);
		height: calc(180 / var(--vw-min) * 100vw);
		right:unset;
		bottom: unset;
		left: calc(-76 / var(--vw-min) * 100vw);
		top: calc(206 / var(--vw-min) * 100vw);
	}
	._circle5{
		width: calc(180 / var(--vw-min) * 100vw);
		height: calc(180 / var(--vw-min) * 100vw);
		right:calc(10 / var(--vw-min) * 100vw);
		bottom: unset;
		top:  calc(274 / var(--vw-min) * 100vw);
	}
}

.musicOpening__inner {
  display: flex;
  gap: min(calc(80 / var(--vw-min) * 100vw), 80px);
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
}

.musicOpening__left {
  flex: 0 0 min(calc(400 / var(--vw-min) * 100vw), 400px);
}
.musicOpening__bg {
  padding: min(calc(10 / var(--vw-min) * 100vw), 10px);
  background-color: #FFFFFF;
  position: relative;
}
.musicOpening__bg::after {
	width: 99.5%;
	height: 99.5%;
	background-color: #CCEDE3;
	background: linear-gradient(140deg,rgba(204, 237, 227, 0.8) 0%, rgba(204, 237, 227, 0.8) 30%, rgba(152, 159, 207, 0.8) 80%, rgba(152, 159, 207, 0.8) 100%);
	content: "";
	position: absolute;
	right: max(calc(-8 / var(--vw-min) * 100vw),-8px);
  bottom: max(calc(-8 / var(--vw-min) * 100vw),-8px);
	z-index: -1;
	transition: all .4s ease;
}
.musicOpening__thumbnail {
  background-color: #ccc;
  width: min(calc(450 / var(--vw-min) * 100vw), 450px);
}
.musicOpening__thumbnail img {
	width:100%;
}
.musicOpening__thumbnail--comment {
  background-color: #ccc;
  width: min(calc(450 / var(--vw-min) * 100vw), 450px);
}
.musicOpening__thumbnail--comment img{
 	width:100%;
}
.musicOpening__btnWrap {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: min(calc(40 / var(--vw-min) * 100vw), 40px);
}
.musicOpening__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: min(calc(8 / var(--vw-min) * 100vw), 8px);
  padding: min(calc(10 / var(--vw-min) * 100vw), 10px) min(calc(40 / var(--vw-min) * 100vw), 40px);
  background-color: var(--color-brown);
  color: #fff;
  text-decoration: none;
  font-size: min(calc(16 / var(--vw-min) * 100vw), 16px);
  border-radius: 100px;
  transition: background-color 0.3s ease;
}

.musicOpening__btn::after {
  content: '';
  width: min(calc(12 / var(--vw-min) * 100vw), 12px);
  height: min(calc(12 / var(--vw-min) * 100vw), 12px);
  background: url('../img/common/arrow_right.png') no-repeat center;
  background-size: contain;
  display: inline-block;
}
.musicOpening__btn:hover {
  background-color: var(--color-main);
}

.musicOpening__right {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: min(calc(24 / var(--vw-min) * 100vw), 24px);
}

.musicOpening__info {
  font-family: var(--font-ja);
  color: var(--color-brown);
}
.musicOpening__artist {
  font-size: min(calc(18 / var(--vw-min) * 100vw), 18px);
}

.musicOpening__title {
  font-size: min(calc(32 / var(--vw-min) * 100vw), 32px);
  font-weight: bold;
  margin-bottom: min(calc(5 / var(--vw-min) * 100vw), 5px);
}

.musicOpening__description {
  font-size: min(calc(15 / var(--vw-min) * 100vw), 15px);
  font-weight: 600;
}

.musicOpening__detail  {
  font-size: min(calc(15 / var(--vw-min) * 100vw), 13px);
  line-height: 2.6;
}

.musicOpening__credit {
  margin-bottom: min(calc(20 / var(--vw-min) * 100vw), 20px);
}
.musicOpening__period {
  border-top: 2px solid var(--color-brown);
  border-bottom: 1px dashed var(--color-brown);
  padding: min(calc(10 / var(--vw-min) * 100vw), 10px) 0;
  margin-bottom: min(calc(10 / var(--vw-min) * 100vw), 10px);
}

.musicOpening__comment {
  padding-top: min(calc(20 / var(--vw-min) * 100vw), 20px);
  margin-bottom: min(calc(20 / var(--vw-min) * 100vw), 20px);
  font-size: min(calc(15 / var(--vw-min) * 100vw), 15px);
}

/* item */
.shareLists__item {
	width: min(calc(48 / var(--vw-min) * 100vw), 48px);
	height: min(calc(48 / var(--vw-min) * 100vw), 48px);
}
.shareLists {
  display: flex;
}
.shareLists__link{	
	background-color: var(--color-brown);
	border-radius: 50px;
}

/* 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;
	width:  min(calc(22 / var(--vw-min) * 100vw), 22px);
	height: min(calc(22 / var(--vw-min) * 100vw), 22px);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	transition: background-color .4s ease;
}
.shareLists__link:hover:before {
	background-color: var(--color-main);
}
.shareLists__item.is-home .shareLists__link:before {
	width: min(calc(20 / var(--vw-min) * 100vw), 20px);
	height: min(calc(20 / var(--vw-min) * 100vw), 20px);
	-webkit-mask-image: url(../img/common/icon_home.svg);
	mask-image: url(../img/common/icon_home.svg);
	mask-size: 100% auto;
}
.shareLists__item.is-youtobe .shareLists__link:before {
  width: min(calc(20 / var(--vw-min) * 100vw), 20px);
	height: min(calc(20 / var(--vw-min) * 100vw), 20px);
	-webkit-mask-image: url(../img/common/icon_youtube.svg);
	mask-image: url(../img/common/icon_youtube.svg);
	mask-size: 100% auto;
}
.shareLists__item.is-twitter .shareLists__link:before {
	width: min(calc(20 / var(--vw-min) * 100vw), 20px);
	height: min(calc(20 / var(--vw-min) * 100vw), 20px);
	-webkit-mask-image: url(../img/common/icon_tw.svg);
	mask-image: url(../img/common/icon_tw.svg);
	mask-size: 100% auto;
}
.shareLists__item.is-tiktok .shareLists__link:before {
  width: min(calc(20 / var(--vw-min) * 100vw), 20px);
	height: min(calc(20 / var(--vw-min) * 100vw), 20px);
	-webkit-mask-image: url(../img/common/icon_tt.svg);
	mask-image: url(../img/common/icon_tt.svg);
	mask-size: 100% auto;
}
.shareLists__item.is-instagram .shareLists__link:before {
  width: min(calc(20 / var(--vw-min) * 100vw), 20px);
	height: min(calc(20 / var(--vw-min) * 100vw), 20px);
	-webkit-mask-image: url(../img/common/icon_instagram.svg);
	mask-image: url(../img/common/icon_instagram.svg);
	mask-size: 100% auto;
}

@media screen and (max-width: 767px) {
  .pageNav__item--link {
    font-size: calc(24 / var(--vw-min) * 100vw);
  }
}

@media screen and (max-width: 767px) {
  .musicOpening__inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: calc(48 / var(--vw-min) * 100vw);
  }

  .musicOpening__inner--comment {
    border-bottom: 1px dashed var(--color-brown);
		padding-bottom: calc(60 / var(--vw-min) * 100vw);
  }

  .musicOpening__left {
    order: 1;
    flex: 0 0 auto;
    width: 100%;
  }

  .musicOpening__right {
    order: 2;
    width: 100%;
  }

  .musicOpening__bg {
    width: 100%;
  }
  .musicOpening__thumbnail {
    width: 100%;
    height: auto;
    max-width: none;
  }

  .musicOpening__thumbnail--comment {
    width: 100%;
    height: auto;
    max-width: none;
  }

  .musicOpening__btnWrap {
    margin-top: calc(40 / var(--vw-min) * 100vw);
    justify-content: center;
  }
}

@media (max-width: 767px) {
  .musicOpening__inner > .musicOpening__btnWrap {
    display: flex;
    justify-content: center;
    margin-top: calc(40 / var(--vw-min) * 100vw);
  }
}

@media (max-width: 767px) {
  .musicOpening__right > .musicOpening__btnWrap .musicOpening__btn {
    position: relative;
    display: block;
    width: 100%;
    text-align: center;
    padding: calc(20 / var(--vw-min) * 100vw) calc(40 / var(--vw-min) * 100vw);
    border-radius: calc(100 / var(--vw-min) * 100vw);
  }

  .musicOpening__right > .musicOpening__btnWrap .musicOpening__btn::after {
    position: absolute;
    right: calc(40 / var(--vw-min) * 100vw);
    top: 50%;
    transform: translateY(-50%);
    margin-left: 0;
    width: calc(24 / var(--vw-min) * 100vw);
    height: calc(24 / var(--vw-min) * 100vw);
  }
}

@media (max-width: 767px) {
  .musicOpening__artist {
    font-size: calc(26 / var(--vw-min) * 100vw);
  }
  .musicOpening__title {
    font-size: calc(44 / var(--vw-min) * 100vw);
  }
  .musicOpening__description {
    font-size: calc(25 / var(--vw-min) * 100vw);
  }
  .musicOpening__detail {
    font-size: calc(25 / var(--vw-min) * 100vw);
  }
  .musicOpening__btn {
    font-size: calc(28 / var(--vw-min) * 100vw);
  }

  .musicOpening__comment {
    font-size: calc(25 / var(--vw-min) * 100vw);
  }
}

@media (max-width: 767px) {
  .shareLists__item {
    width: calc(42 / var(--vw-min) * 100vw);
    height: calc(42 / var(--vw-min) * 100vw);
    margin: 0 calc(5 / var(--vw-min)* 100vw);
  }

  .shareLists__link:before {
    width:  calc(17.86 / var(--vw-min) * 100vw);
    height: calc(12.5 / var(--vw-min) * 100vw);
	}
}

@media (min-width: 768px) {
  .musicOpening__btn {
    position: relative;
    display: flex;
    align-items: center;      
    justify-content: center;  
    width: min(calc(232 / var(--vw-min) * 100vw), 232px);
    height: min(calc(50 / var(--vw-min) * 100vw), 50px);
    border-radius: min(calc(100 / var(--vw-min) * 100vw), 100px);
    text-decoration: none;
  }

  .musicOpening__btn::after {
    content: '';
    position: absolute;
    right: min(calc(16 / var(--vw-min) * 100vw), 16px); 
    top: 50%;
    transform: translateY(-50%);
    width: min(calc(12 / var(--vw-min) * 100vw), 12px);
    height: min(calc(12 / var(--vw-min) * 100vw), 12px);
    background: url('../img/common/arrow_right.png') no-repeat center / contain;
  }
}