@charset "UTF-8";
* {
    box-sizing: border-box;
}
a:hover {
filter: alpha(opacity=50);
opacity: 0.5;
    transition:  0.5s;
}
a {
    text-decoration: none;
}

#wrap {
width: 100%;
background: url("../img/base_bg.png");
}
section {
width: 100%;
margin: 1em auto 2em;
}

header h1, #introWrap h3, .appearanceWrap #appearance figure#appearanceImg, ul.appearanceInne li span, ul.appearanceInner02 li {
text-indent:100%;
white-space:nowrap;
overflow:hidden;
line-height: 0;
}

/************************************
デザインA（PC）
**********************/
body {
font-size: clamp(14px, 1.40625vw, 18px);
line-height: 1.8em;
    font-family: "M PLUS Rounded 1c", sans-serif;
    font-weight: 700;
    color: #000;
background: #fff;
    }
.sp {
    display: none !important;
}
.pc {
    display: block !important;
}
main, section {
    width: 100%;
}

/* デザインC（スマホ） *************/
@media screen and (max-width : 768px) {
/* スマホ用レイアウト に収めるデザインはこの中に記述 */
    body {

    }

.sp {
    display: block !important;
}

.pc {
    display: none !important;
}

}
/* ------------------------------------
	PC Header
------------------------------------ */
header {
    width: 100%;
}
header #mv {
    background: url("../img/mv_pc.jpg");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
padding-top: 50%;
}
header #releaseWrap {
	width: 100%;
	min-height: 80px;
	max-height: 100px;
	background: #e9543e;
	border-top: solid 10px #ffcc33; 
	display: flex;
	justify-content: center;
	align-items: center;
	padding-top:8px;
}
header #releaseWrap #release {
	width: 90%;
	max-width: 1200px;
	margin: 0.35em auto;
/*	border: 1px solid #000;*/
}

/* ------------------------------------
	SP Header
------------------------------------ */
/* デザインC（スマホ） *************/
@media screen and (max-width : 768px) {
    header #mv {
        background: url("../img/mv_sp.jpg");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
padding-top: 162.5%;
    }
	
	header #releaseWrap {
		display: none;
	}
}

/* -------------------------------------------------------------------------- */
/* SNS */
/* -------------------------------------------------------------------------- */
.snsWrap {
    width: 90%;
    max-width: 800px;
    margin:1.5em auto;
    display: flex;
    justify-content: center;
    align-items: center;
	background: #fff;
	border-radius: 100px;
	padding: 0.5em;

}
.snsInner {
    width: 86%;
		max-width: 540px;
    margin:auto;
    display: flex;
	justify-content: space-between;
}
.snsArea-A {
    width: 65%;
        height: 50px;
    display: flex;
 justify-content: space-between; /* 均等配置 */
  align-items: center;
/*	border: 1px solid #c00;*/
}
.snsArea-A figure {
    width: 50px;
    height: 50px;
    display: flex;
 justify-content: space-around;

}
.snsArea-A figure img {
    width: 100%;
    vertical-align: middle;

}
.snsArea-A img:hover {
    transform: rotateZ( 25deg ) ;
    filter: alpha(opacity=50);
opacity: 0.5;
    transition:  0.5s;
}

.snsArea-B {
    width: 30%;
    height: 50px;
    display: flex;
      justify-content: center;
  align-items: center;
    position: relative;
}
.snsArea-B div {
        height: 20px;
    margin: 0.5em;
}
/* デザインC（スマホ） *************/
@media screen and (max-width : 768px) {
.snsWrap {
    width: 100%;
    margin:auto;
	border-radius: 0;
    display: inherit;
}
.snsInner {
    width: 80%;
max-width: 360px;
    margin:auto;
    display: block;
}
.snsArea-A {
    width: 100%;
        height: 50px;
    display: flex;
    margin-top: 0.25em;
    padding: 0.75em;
}
    .snsArea-B {
    width: 100%;
    height: 40px;
        margin-top: 0.5em;
    display: flex;
      justify-content: center;
  align-items: center;
    position: relative;
}
}
/* ------------------------------------
	コンテンツ
------------------------------------ */
.boxA {
    width: 90%;
    margin: auto;
    max-width: 1100px;
}
.boxB {
    width: 90%;
    margin: auto;
    max-width: 1154px;
}

/**イントロダクション**********************/
#introWrap {
	padding: 1.5em 2em;
    background: rgba(255,255,255,0.6);
	border: 6px solid #3399cc;
	border-radius: 30px;
    text-align: center;
}

@media screen and (max-width : 768px) {
#introWrap {
	padding: 1em 0.75em;
	border: 3px solid #3399cc;
	border-radius: 15px;
}
}

/*YouTube**********************/
.movieWrap {
    width: 100%;
    max-width: 720px;
    margin: 1.5em auto 1em;

}
.movieWrap img {
    vertical-align: bottom;
/*      margin-top:  -56.25%;*/
}
.movieWrap .youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.movieWrap .youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

/*出演**********************/
.appearanceWrap {
	width: 100%;
    text-align: center;
    font-size: clamp(16px, 1.875vw, 24px);
    line-height: 1.8em;
    font-weight: 800;
    background-image: url("../img/appearanceWrap_bg.png");
    background-position: center top;
}
.appearanceWrap_border {
	background-image: url("../img/appearanceWrap_border.png");
    background-position: center top;
	width: 100%;
	height: 18px;
}
.appearanceWrap #appearance {
    width: 64%;
    max-width: 468px;
    margin: 0 auto;
	line-height: 0;
	padding-top: 0;
}
.appearanceWrap #appearance figure#appearanceImg {
   background-image: url("../img/appearance-h2.png");
	padding-top: 27.8%;
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
	margin: 0;
}
#appearanceBtmImg {
	width: 100%;
	background-image: url("../img/appearanceBtmImg.png");
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: 100% auto;
	padding-bottom: 2em;
	margin-bottom: 2em;
/*	padding-bottom: 33.5%;*/
}

ul.appearanceInner {
    width: 100%;
    margin: 2.5% auto 0;
    font-size: 0;
    text-align: center;
}
ul.appearanceInner li {
    display: inline-block;
    width: 22.5%;
    margin: 0 1.25%;
    vertical-align: top;
}
ul.appearanceInner02 {
    width: 64%;
    margin: 0 auto 1.8em;
}
ul.appearanceInner02 li {
	display: inline-block;
    width: 100%;
    vertical-align: top;
}
#appearancePh01 {
    background: url("../img/appearancePh01.png");
    padding-top: 117.7%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
#appearancePh02 {
    background: url("../img/appearancePh02.png");
    padding-top: 117.7%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
#appearancePh03 {
    background: url("../img/appearancePh03.png");
    padding-top: 117.7%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
#appearancePh04 {
    background: url("../img/appearancePh04.png");
    padding-top: 117.7%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
#appearancePh05 {
    background: url("../img/appearancePh05.png?02");
    padding-top: 41.3%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
#appearancePh06 {
    background: url("../img/appearancePh06.png");
    padding-top: 117.7%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
#appearancePh07 {
    background: url("../img/appearancePh07.png");
    padding-top: 117.7%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

@media screen and (max-width : 768px) {
ul.appearanceInner {
    width: 86%;
    margin: 2.5% auto 0;
    font-size: 0;
    text-align: center;
}
ul.appearanceInner li {
    display: inline-block;
    width: 44%;
    margin: 0 3%;
    vertical-align: top;
}
	ul.appearanceInner02 {
		width: 100%;
	}
	#appearanceBtmImg {
	width: 100%;
	background-image: url("../img/appearanceBtmImg-sp.png");
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: 100% auto;
	padding-bottom: 2em;
	margin-bottom: 2em;
/*	padding-bottom: 33.5%;*/
}
.appearanceWrap_border {
	background-image: url("../img/appearanceWrap_border.png");
    background-position: center center;
	width: 100%;
	height: 10px;
}
}
/*商品情報**********************/
#productWrap {
    background-color: #fff;
	margin-top: 4.8em;
	padding-bottom: 1em;
}
#productWrap .center {
    text-align: center;
}
#productWrap h2 {
    width: 64%;
    max-width: 468px;
    margin: 0 auto 1em ;
}
#productWrap h2 img {
	margin-top: -1.8em;
}
#productWrap #productInner {
	width: 94%;
	max-width: 1024px;
	margin: auto;
}

#itemWrap {
  display: flex;
justify-content: space-between;
}
#itemWrap .jktWrap {
    width: 46.875%;
    max-width: 480px;
}

#itemWrap .jktWrap figure {
	width: 100%;
}
#jktImg {
    background: url("../img/jktImg.jpg?02");
    background-position: top left;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 141.25%;
}

#itemWrap .itemSpec {
    width: 48.9%;
    max-width: 500px;
	text-align: center;
	line-height: 1.6em;
}
#itemWrap .itemSpec .itemInner {
	padding-bottom: 1em;
}
#itemWrap .itemSpec big {
	font-weight: 800;
	font-size: clamp(16px, 1.875vw, 24px);
}
.cartWrap {
	width: 80%;
	max-width: 400px;
	margin: 0.25em auto;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 1.8em;
	font-size: clamp(16px, 2.34375vw, 30px);
	font-weight: 800;
	border-radius: 100px;
}
#bd_txt, #bd_cart a {
	color: #3399ff;
}
#bd_cart {
	border: 3px solid #3399ff;
	background: rgba(51,153,255,0.3);
}
#dvd_txt, #dvd_cart a {
	color: #ff6699;
}
#dvd_cart {
	border: 3px solid #ff6699;
	background: rgba(255,102,153,0.3);
}
#cd_txt, #cd_cart a {
	color: #33cc33;
}
#cd_cart {
	border: 3px solid #33cc33;
	background: rgba(51,204,51,0.3);
}
.productionWrap {
	width: 60%;
	max-width: 280px;
	margin: 0.25em auto;
}

@media screen and (max-width : 768px) {
#itemWrap {
  display: block;
}
#itemWrap .jktWrap {
    width: 70%;
    max-width: 400px;
	margin: auto;
}
#itemWrap .itemSpec {
    width: 90%;
/*    max-width: 500px;*/
	text-align: center;
	line-height: 1.6em;
	margin: 1em auto;
}
}

/*収録曲**********************/
.musicListWrap {
	width: 100%;
}
.musicListWrap .musicListHead {
	width: 100%;
	max-height: 90px;
	line-height:1em;
	font-size: clamp(24px, 3.75vw, 48px);
	font-weight: 900;
	text-align: center;
	margin: 0.25em 0 0;
	padding: 0;
color: #3399ff;
}
.ehonWrap {
	width: 10em;
	border-radius: 50px;
	margin: 0.25em auto;
	padding: 0;
	font-weight: 800;
	font-size: clamp(16px, 1.875vw, 24px);
	line-height: 1.5em;
	color: #fff;
	background: #3399ff;
	display: flex;
	justify-content: center;
	align-items: center;
}
#musicList_cs {
	padding: 0.5em 0;
	text-align: center;
	color: #fff;
	font-size: clamp(24px, 3.75vw, 48px);
	font-weight: 900;
	text-shadow    : 
       2px  2px 1px #3399ff,
      -2px  2px 1px #3399ff,
       2px -2px 1px #3399ff,
      -2px -2px 1px #3399ff,
       2px  0px 1px #3399ff,
       0px  2px 1px #3399ff,
      -2px  0px 1px #3399ff,
       0px -2px 1px #3399ff
}
#musicList_phWrap {
	width: 100%;
	max-width: 1024px;
	margin: auto;
}
ul.musicList_phArea {
	width: 98%;
	max-width: 1000px;
	margin: auto;
	font-size: 0;
}
ul.musicList_phArea li {
	display: inline-block;
	width: 32%;
	margin: 0.66%;
	vertical-align: top;
}
#musicListPh01 {
	background: url("../img/musicListPh01.jpg");
	background-size: cover;
	background-position: left top;
	padding-top: 56.25%;
}
#musicListPh02 {
	background: url("../img/musicListPh02.jpg");
	background-size: cover;
	background-position: left top;
	padding-top: 56.25%;
}
#musicListPh03 {
	background: url("../img/musicListPh03.jpg");
	background-size: cover;
	background-position: left top;
	padding-top: 56.25%;
}
#musicListPh04 {
	background: url("../img/musicListPh04.jpg");
	background-size: cover;
	background-position: left top;
	padding-top: 56.25%;
}
#musicListPh05 {
	background: url("../img/musicListPh05.jpg");
	background-size: cover;
	background-position: left top;
	padding-top: 56.25%;
}
#musicListPh06 {
	background: url("../img/musicListPh06.jpg");
	background-size: cover;
	background-position: left top;
	padding-top: 56.25%;
}
#musicListPh07 {
	background: url("../img/musicListPh07.jpg");
	background-size: cover;
	background-position: left top;
	padding-top: 56.25%;
}
#musicListPh08 {
	background: url("../img/musicListPh08.jpg");
	background-size: cover;
	background-position: left top;
	padding-top: 56.25%;
}
#musicListPh09 {
	background: url("../img/musicListPh09.jpg");
	background-size: cover;
	background-position: left top;
	padding-top: 56.25%;
}
#musicListPh10 {
	background: url("../img/musicListPh10.jpg");
	background-size: cover;
	background-position: left top;
	padding-top: 56.25%;
}

@media screen and (max-width : 768px) {
    ul.musicListWrap {
        width: 100%;
        max-width: 480px;
        margin: auto;
    }
ul.musicList_phArea li {
	display: inline-block;
	width: 48%;
	margin: 1%;
	vertical-align: top;
}

}

/*特典映像**********************/
.tokuteneizoWrap {
	width: 100%;
	border-radius: 30px;
	background: #fff8e9;
	margin: 2em auto;
	padding-top: 1.5em;
		padding-bottom: 1.5em;
	text-align: center;
/*	padding: 1.5em 0 0;*/
}
.tokuteneizoArea {
	width: 96%;
	max-width: 960px;
	margin: auto;
}
.tokuteneizoInner {
	width: 94%;
	max-width: 880px;
	margin: auto;
}
.tokuteneizoArea .tokuteneizoHead {
	width: 100%;
/*	max-height: 90px;*/
	line-height:1em;
	font-size: clamp(24px, 3.75vw, 48px);
	font-weight: 900;
	text-align: center;
	margin: 0.25em 0 0;
	padding: 0;
color: #cc66cc;
}
.tokuteneizoArea .tokuteneizoSubHead {
	width: 100%;
	line-height:1.5em;
	font-size: clamp(14px, 1.40625vw, 18px);
	font-weight: 900;
	text-align: center;
	margin: 0.25em 0 0;
	padding: 0;
color: #cc66cc;
}
.tokuteneizoTxtWrap {
	width: 94%;
	max-width: 880px;
	margin: 1em auto 0;
	text-align: center;
	font-size: clamp(14px, 1.5625vw, 20px);
	line-height: 1.5em;
}
.tokuteneizoArea .tokuteneizoTit {
	width: 100%;
	margin: 0 auto;
	background: #cc66cc;
	color: #fef590;
	font-weight: 900;
	font-size: clamp(16px, 2.8125vw, 36px);
	line-height: 1.5em;
	border-radius: 50px;

}
.tokuteneizoArea .font-color01{
	color: #cc66cc;
}
.tokuteneizoArea p {
	margin: 0.5em 0;
}
.tokuteneizoArea small p {
	font-size: clamp(12px, 1.25vw, 16px);
	line-height: 1.5em;
}
.tokuteneizoPhWrap {
	width: 100%;

}
#tokuteneizoPh01 {
background: url("../img/tokuteneizoPh01.png");
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
	padding-top: 27.25%;
}
#tokuteneizoPh02 {
background: url("../img/tokuteneizoPh02.png");
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
	padding-top: 27.25%;
}



@media screen and (max-width : 768px) {
	.tokuteneizoWrap {
	border-radius: 15px;
/*	padding: 0.75em 0 0;*/
}
.tokuteneizoArea .tokuteneizoTit {
	letter-spacing: -0.075em;
}
}

/*先着購入者特典**********************/
.senchakutokutenWrap {
	width: 100%;
	margin: 2em auto;
	text-align: center;
}
.senchakutokutenHead {
	width: 70%;
	max-width: 660px;
	margin: auto;
}
.senchakutokutenSubHead {
	font-size: clamp(16px, 2.8125vw, 36px);
	line-height: 1.25em;
	font-weight: 900;
	color: #0066cc;
}
p.senchakutokutenSubHead-s {
	font-size: clamp(16px, 1.875vw, 24px);
	line-height: 1.25em;
	font-weight: 900;
	color: #0066cc;
}
.senchakutokuten-imgWrap {
	width: 80%;
	max-width: 640px;
	margin: 1em auto;
}
.senchakutokuten-img {
	background: url("../img/senchakutokuten-img.jpg");
	background-size: cover;
	background-position: top center;
	padding-top: 70.5%;
	background-repeat: no-repeat;
}
.note {
	font-size: clamp(11px, 1.09375vw, 14px);
line-height: 1.4em;
}

.copyright {
	text-align: center;
    padding: 0 0 2em;
    font-size: clamp(11px, 1.09375vw, 14px);
line-height: 1em;
    font-weight: 500;
}
/*********************************************************************************************/
/* footer */
footer {
  padding: 2em 0;
/*    margin-top: 4em;*/
  background-color: rgba(255,255,255,1); 
    background-position: center bottom;
    background-size: 100% auto;
}
  footer p {
    width: min(80%, 420px);
    margin: auto;
    text-align: center;
    line-height: 1.6em;
  background-color: rgba(255,255,255,1); 
    border: #e60012 2px solid;
    border-radius: 10px; }
    footer p a {
      display: block;
      padding: .5em 0 .6em;
      text-decoration: none;
      font-weight: bold;
      color: #e60012; }
      footer p a:hover, footer p a:focus, footer p a:visited {
        color: #e60012; }