@charset "UTF-8";
/* CSS Document */
@import url("https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700&family=Roboto:wght@300;400;500;700;900&display=swap');


body {margin:0;padding:0;font-family: 'Noto Sans JP', sans-serif;overflow-x: hidden;-webkit-text-size-adjust: 100%;word-wrap: break-word;}
ol,ul,li {list-style:none;margin:0;padding:0;}
dl,dt,dd {margin:0;padding:0;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;margin:0;padding:0;}
p {margin:0;padding:0;}
a , a img { overflow: hidden; color:#fff;text-decoration:none;border:none;-webkit-transition: all 0.2s;-moz-transition: all 0.2s;-ms-transition: all 0.2s;-o-transition: all 0.2s;transition: all 0.2s;}
a:hover,a:active {opacity:.7;border:none;outline:none;}
a:hover img , a:active img {opacity:1;border:none;outline:none;}

h1 {font-weight:normal;}
h2 {font-weight:normal;}
h3 {font-weight:bold;}
img {max-width: 100%;width:auto;height: auto;display:block;pointer-events: none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-touch-callout:none;-moz-user-select:none;touch-callout:none;user-select:none;}
* {box-sizing:border-box;outline:none;}
main:after,
article:after,
section:after,
div:after,
ul:after,
li:after,
dl:after {
  content: "";
  display: block;
  clear: both;
}

.pc {display:none;}

body {font-size:3.7vw;line-height:1.6;color:#222;display: block;}

.header {position:relative;}
.header .logo {width:40%;position:absolute;top:8%;left:0;right:0;margin:auto;}
.header .catch {width: 65%;position: absolute;bottom: 4%;right: 5%;margin:auto;text-align:center;font-weight:700;font-size:.9em;letter-spacing:.2em;text-indent:.2em;}
.mainimg span {display:block;background-repeat:no-repeat;background-position:center 0;background-size:cover;padding-top:100%;}

.main {position:relative;z-index:1;}
/*.contents_head {margin-top: 2em;width: 85%;margin-right:auto;margin-left:auto;}*/
.contents_head {text-align:center;font-size:1.3em;margin:3em 0;font-weight:700;font-family: 'Roboto', sans-serif;}
.contents_head h2 {font-weight: 700;font-size: 2.2em;line-height: 1;margin: 0.3em 0;letter-spacing: .05em;text-indent: 0.05em;color: #9B72B0;}
.contents_head h2 i {font-style:normal;}
.contents_head h2 i:after {content:"／";margin:0;font-size:.8em;}
.contents_head h2 i:last-child:after {display:none;}
.contents_head .release_day {font-weight: 500;font-size: 1.2em;letter-spacing: .05em;text-indent: 0.05em;}
.contents_head p:first-child {border:1px solid #9B72B0;color:#9B72B0;width:12em;margin:0 auto;border-radius:30px;margin-bottom:.4em;font-weight: 500;font-size:.9em;}

.contents_head h2.title_logo {padding:.5em 4%;font-size: 1em;}

.contents {padding:0;}

.tracklist {margin:1em 0;}

.release {margin-top:0;background: #f6f6f6;padding: 0 5%;}
.release .box {padding:3em 0;border-bottom:1px dotted #ccc;}
.release .box:last-child {border-bottom:0;}
.release_info .btn {margin-top:2em;}
.release_info .btn a {box-shadow: 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(0,0,0,.0);transition: .3s;}
.release_info .btn a {display: block;color: #fff;font-weight: 600;letter-spacing: .2em;padding: 0 1em;text-align: center;line-height: 3.5;background: -webkit-linear-gradient(left, #9B72B0 0%, #ebc5ff 100%);
    background: linear-gradient(to left, #9B72B0 0%, #ebc5ff 100%);border-radius: 30px;position: relative;}
.release_info .btn a:before {-webkit-animation: is-reflection 4s ease-in-out infinite;-webkit-transform: rotate(45deg);animation: is-reflection 4s ease-in-out infinite;background-color: rgba(255,255,255,.4);content: " ";height: 100%;left: 0;opacity: 0;position: absolute;top: -180px;transform: rotate(45deg);width: 30px;}
.release_info .btn a:after {content: "\f3d3";font-family: "ionicons";position: absolute;right: 1em;top: 50%;-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);}
.release_info .btn a span {display: block;width: 1.2em;position: absolute;left: 1.5em;top: 50%;-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);padding-top: .5em;}
.release_info .btn a span svg {fill: #fff;}
@keyframes is-reflection {
  0% { -webkit-transform: scale(0) rotate(45deg); transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -webkit-transform: scale(0) rotate(45deg); transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -webkit-transform: scale(4) rotate(45deg); transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -webkit-transform: scale(50) rotate(45deg); transform: scale(50) rotate(45deg); opacity: 0; }
}

.release_info h3 {font-size: 1.2em;text-align: center;font-weight: 600;letter-spacing: .05em;text-indent: 0.05em;}
.release_info .data {text-align: center;margin: 0 0 1em;}
.release_info p {margin-bottom:1em;}
.release_info h4 {font-weight: 600;background: #ddd;padding: 0.3em 0.5em 0.4em;margin-top: 2em;}
.release_info h4 + * {margin-top:1em;}
.release_info .notes li {position:relative;padding-left:1em;font-size:.9em;}
.release_info .notes li:before {content:"※";position:absolute;top:0;left:0;}
.type_list {margin:1.5em 0;}
.type_list li {position:relative;padding-left:1em;}
.type_list li:before {content:"■";position:absolute;top:0;left:0;}

.jacket span {display:block;background-repeat:no-repeat;background-position:center;background-size:cover;padding-top:100%;display:block;margin-bottom:1em;}

.subpage {padding:2em 4%;}
.linkbtn li {margin:1em 0;}
.linkbtn li a {display:block;border:1px solid #9B72B0;padding:3px;background:#fff;}
.linkbtn li span {display:block;text-align:center;background:#9B72B0;line-height: 3.4;position: relative;}
.linkbtn li span:after {content: "\f3d3";font-family: "ionicons";position: absolute;right: 1em;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);}

.share_btn {text-align:center;margin:0 0 4em;}
.share_btn h3 {font-size:1.1em;margin-bottom:2em;font-weight:400;letter-spacing:.2em;text-indent:.2em;}
.share_btn li {display:inline-block;vertical-align:top;margin:0 1em;}
.share_btn li a {display:block;width:2.1em;overflow:unset;}
.share_btn li.tw a svg {fill:#1DA1F2;}
.share_btn li.fb a svg {fill:#1877f2;}
.share_btn li.line a svg {fill:#00b900;}

.inview {opacity: 0;transform: translate(0, 20px) ;transition : all 800ms ease-out;}
.inview.in {opacity: 1;transform: translate(0, 0) ;}

.slidein_left {opacity: 0;transform: translate(100px, 0) ;transition : all 800ms cubic-bezier(0.175, 0.885, 0.320, 1.275) .5s;}
.slidein_left.in {opacity: 1;transform: translate(0, 0) ;}
 
.slidein_right {opacity: 0;transform: translate(-100px, 0) ;transition : all 800ms cubic-bezier(0.175, 0.885, 0.320, 1.275) .5s;}
.slidein_right.in {opacity: 1;transform: translate(0, 0) ;}
 
.fade {opacity: 0;transition : all 800ms ease-in;}
.fade.in {opacity: 1;}

.footer {padding:3em 4%;text-align:center;}
.footer .copyright {font-size:.8em;color:#aaa;}


.officiallink {text-align:center;width:18em;margin:0 auto 4em;}
.officiallink a {font-family: 'Roboto', sans-serif;font-weight:400;font-size:1em;text-indent:.5em;color:#bbb;line-height:3;display:block;position:relative;border:1px solid #bbb;border-radius:30px;transition: all .2s;overflow: unset;background:#fff;}
.officiallink span:after {content:"\f3d3";font-family:"ionicons";position: absolute;right:1em;top: 50%;-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);}
.officiallink a:hover {background:#bbb;color:#fff;}

.movie_area {max-width:960px;margin:2em auto;padding: 0 4%;}
.movie_yt {position: relative;padding-bottom: 56.25%;padding-top: 30px;height: 0;overflow: hidden;}
.movie_yt iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}


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

@media screen and (min-width:568px) {
body {font-size:2.2vw;}
}

@media screen and (min-width:768px) {
.pc {display:block;}
.sp {display:none;}

body {font-size:15px;}

.header .logo {width: 35%;top: 7%;}

.mainimg span {background-position:center;}
.header .catch {width: 50%;font-size: 1em;}

.contents_head {margin: 60px 0;font-size: 1.5em;}
.contents_head h2 {font-size: 3em;}
.contents_head .release_day {font-size: 1.4em;}
.contents {padding: 0 2%;}

.contents_head h2.title_logo {padding:.8em 0;max-width: 600px;margin: 0 auto;}


.release .box {display:flex;}
.release .box:nth-child(even) {flex-direction: row-reverse;}
.release .box .jacket {width:40%;}
.release .box .release_info {width:60%;padding-left:5%;margin-bottom: 1em;}
.release .box:nth-child(even) .release_info {padding-right:5%;padding-left:0;}


.release_info h3 {font-size: 1.3em;}
.release_info p {font-size: 1em;}
.release_info .data {margin: 0 0 1em;}
.release_info .btn {max-width: 24em;margin: 2em auto 0;}
.type_list li {width: 14em;display: inline-block;vertical-align:top;}
}


@media screen and (min-width:1024px) {
.header .logo {width: 20%;top: 2%;}
.mainimg span {background-position: center;}

.release .box {max-width: 1040px;margin: 0 auto;padding: 4em 0;}

}
@media screen and (min-width:1120px) {
body {font-size:16px;}

.header {display: flex;flex-wrap: wrap;align-items: center;padding: 30px;}
.mainimg {margin: 0 auto;padding-top: 0;width: 50%;}
.contents_head {width: 50%;font-size: 1.5vw;}

.mainimg {margin:0 auto;padding-top: 0;}
.mainimg span {background-position: center;}
.main {padding: 0 30px;}
.contents {padding: 0;max-width: none;margin: 0 auto;}

.release {padding-bottom: 60px;}
.release_info h3 {font-size: 1.5em;}

.contents_head h2 {font-size: 3.5em;}
.contents_head h2.title_logo {max-width: 700px;}

.subpage {padding-top:60px;}
.subpage .linkbtn {max-width: 640px;margin: 0 auto;}
}
@media screen and (min-width:1600px) {
.contents_head {font-size: 1.4vw;}


}
@media screen and (max-height:900px) and (min-width:1024px) {
}

@media only screen
    and (min-device-width:320px)
    and (max-device-width:767px) {
}

@media only screen
    and (min-device-width:768px)
    and (max-device-width:1334px) {
}