@charset "UTF-8";



/* class
----------------------------------------------- */

a.hEffect{}
a.hEffect:hover{ opacity: .8;}

.illust{ border: solid 0px #c00;}
.illust.parallax{ border: solid 0px #c00;}
.post-header{ display:block; clear: both; width: 100%; overflow: hidden; height: 0; }

.tLeft{ text-align:left;}
.tCenter{ text-align:center}
.tRight{ text-align:right;}



.whiteText, .whiteText a, .whiteText  a:link, .whiteText a:hover,  .whiteText a:active , .whiteText a:visited {
		color: #fff;
}




.posCenter{display: inline-block; position: absolute; top: 50%; left: 50%;  transform: translate(-50%,-50%);}

.btn{ display: block;



    }
.btn .text{}

.btnDesign{ display: inline-block; background: #222; color: #fff !important; padding: 1.5rem 2rem; font-size: 1.2rem; font-weight: 700; line-height: 1.2; transition: all 200ms ease-in-out;}
.btnDesign.bgRed{ background-color: var(--color-pink)}
.btnDesign.arrow:after {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(./img/parts_arrow_right.png) center center no-repeat;
    background-size: contain !important;
    position: absolute;
    top: 50%;
    right: 2em;
    transform: translate(0,-50%);
    transition: all 250ms cubic-bezier(.50, .0, .50, 1);
}
.btnDesign.sizeWide{ width: 50%;}
.btnDesign.sizeFull{ display: block; width: 100%;}

.btnDesign:hover{  filter: brightness(120%);}
.btnDesign.arrow:hover:after{transform: translate(50%,-50%);}

a.deactive{ pointer-events: none; opacity: 0.3; }



.entryMore{ display: flex; justify-content: flex-end;}
	.entryMore.leftPos{ justify-content: flex-start;}
.entryMore .btnWrap{ width: 142px;}
.entryMore .btnWrap a{ display: block; overflow: hidden;color: #fff; font-size: 1.2rem; margin-right: 0.2em; white-space: nowrap;}
.entryMore .btnWrap a:before{ content: ''; display: block; width: 100%; height: 0; padding-top: 29.6%; background: url(./img/btn_bg.svg) center center no-repeat; background-size: contain !important; }
.entryMore .btnWrap a span{ display: inline-block; position: absolute; top: 50%; left: 50%;  transform: translate(-50%,-58%);}
.entryMore{}

.btnWrap a.arrow span{ padding-right: 30px; line-height: 1;}
.btnWrap a.arrow span:after{ content: ''; display: inline-block; width: 20px; height: 20px; background: url(./img/parts_arrow_right.png) center center no-repeat; background-size: contain !important; position: absolute; top: 50%; right: 0; transform: translate(0,-40%);transition: all 250ms cubic-bezier(.50, .0, .50, 1);}
.btnWrap a.arrow:hover  span:after{ transform: translate(50%,-40%);}



.btnCenter{ width: 350px; margin: auto;}

.noimage{background: url(./img/common/no_image.svg) center center no-repeat #eee !important; background-size: contain !important; }

.frontArrowRight{ padding-left: 55px;}
.frontArrowRight:before{ content: ''; display: inline-block; width: 42px; height: 24px; position: absolute; top: 50%; left: 0; transform: translate(0,-50%); background: url(./img/common/arrow_more.svg) center center no-repeat; background-size: contain; }


.grid {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns:1fr 1fr;
	grid-template-columns: 1fr 1fr;
	grid-auto-rows: auto;
	grid-gap: 50px;
	padding: 0;
	margin: auto;
}
.grid.col_3{grid-template-columns: 1fr 1fr 1fr;}
.grid.col_2{grid-template-columns: 1fr 1fr;}
.grid.col_1{grid-template-columns: 1fr;}


.grid .center {	display: grid;	align-items: center;}
.gridItem {}

dl.grid.debugTools{ width: 600px; margin: 50px;grid-template-columns: 100px 1fr; grid-gap: 1px; font-size: 10px; display: none; position: fixed; top: 50px; left: 50px; z-index: 99999;}
dl.grid.debugTools dt{border: solid 1px #000; padding: 0.5em;}
dl.grid.debugTools dd{ border: solid 1px #000; padding: 0.5em;}


img.full{width:100%; height: auto;}


.bgBtn{ display: inline-block; height: 3em; line-height: 3em; text-align: center; margin: 2em 0; padding: 0 2em; color: #fff !important; background: #333;text-decoration: none !important; border-radius: 5px;transition: all 250ms cubic-bezier(.50, .0, .50, 1);}
.bgBtn:hover{ background: #c00; color: #fff !important;}

ul.list{ margin-bottom: 2em;}
ul.list li{ padding-left: 1.5em; margin-bottom: 0.5em;}
ul.list li:before{ content: '・'; display: inline-block; position: absolute; top: 0em; left: 0.3em;}

ul.kome li:before{ content: '※';}

ol.list{ margin-bottom: 2em; list-style: decimal;padding-left: 1.3em;}
ol.list li{padding-left: 0.2em; margin-bottom: 0.5em;}

.anim{transition: all 250ms cubic-bezier(.50, .0, .50, 1);}


.entryList{margin-bottom: 60px;}
.entryList a{ display: block; padding: 55px 30px; }

.entryList dl{grid-template-columns: auto 1fr; grid-gap: 2%; }
.entryList dl dt{white-space: nowrap;}
.entryList dl dd{ padding-right: 50px;}


.entryList a dd:after{ content: ''; display: block; width:15px; height: 15px; border-bottom: solid 1px; border-right: solid 1px; position: absolute; top: 50%; right: 0px; transform: translate(0,-50%) rotate(-45deg);transition: all 250ms cubic-bezier(.50, .0, .50, 1)}
.entryList a:hover dd:after{transform: translate(50%,-50%) rotate(-45deg);}

.entryBoxList{grid-gap: 5%;margin-bottom: 60px; text-align: center;}
.entryBoxList a{ display: block;}
.entryBoxList dl{grid-template-columns: auto 1fr; grid-gap: 2%; }
.entryBoxList dl dt{ overflow: hidden; margin-bottom: 20px;}
.entryBoxList dl dt::before{ content:""; display: block; width: 100%; padding-top: 100%;}
.entryBoxList.movie dl dt::before{ display: none;}
.entryBoxList dl dt .thumbnail{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; display: none; pointer-events: none;}

#discography .entryBoxList dl dt .thumbnail{ display: block;}

.entryBoxList dl dt .thumbnail:before{ content: ''; display: block; width: 100%; height: 0; padding-top: 100%; }
	.entryBoxList.movie dl dt .thumbnail:before{ content: ''; display: block; width: 100%; height: 0; padding-top: 56.25%; }


.entryBoxList dl dt .embed{ width: 100%;height: auto;z-index: 1;}
.entryBoxList dl dt .embed:before{ content: ''; display: block; width: 100%; height: 0; padding-top: 100%; }
	.entryBoxList.movie dl dt .embed:before{ content: ''; display: block; width: 100%; height: 0; padding-top: 56.25%; }
	.entryBoxList dl dt .embed iframe{ position: absolute; top: 0; left: 0; width: 100%;height: 100%; z-index: 100;}


.entryBoxList dl dt .embedAPI{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 3; display: none;}

.entryBoxList a.entry .thumbnail:after{}
.entryBoxList a.entry:hover .thumbnail:after{transform: translate(-50%,-50%) scale(1.2);}

.iconPlay:after{ content: ''; display: block; width:60px; height: 60px; background: url(./img/icon_play.svg) center center no-repeat; background-size: contain;  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);transition: all 250ms cubic-bezier(.50, .0, .50, 1);}

.entryBoxList dl dd{ }
.entryBoxList dl dd .type{ font-size: 0.8em; margin-bottom: 0.5em;}
.entryBoxList dl dd h3{font-size: 0.95rem;line-height: 1.5; margin: 0; }


.flex{ display: flex;justify-content: center;flex-wrap: wrap;}
.flex .flexItem{ display: block; width: 30%; margin: 0 1%;}
.flex.col_2 .flexItem{ width: 43%;}


img.size-full{ max-width: 100%; width: auto; height: auto;}
.wFull{ width: 100%; height: auto;}

.hFull{ width: auto; height: 100%;}

ul.sns{}
ul.sns li{ display: inline-block; width: 42px; height: 42px; overflow: hidden; margin-right: 25px;}
ul.sns li a{ display: block; width: 100%; height: 0; padding-top: 100%;  position: absolute; top: 0; left: 0; overflow: hidden;}
	ul.sns li.twitter a{background: url(./img/icon_x.svg) center center no-repeat; background-size: contain;  }
	ul.sns li.instagram a{background: url(./img/icon_instagram.svg) center center no-repeat; background-size: contain;  }

	ul.sns.whiteIcon li.twitter a{background: url(./img/icon_x_white.svg) center center no-repeat; background-size: contain;  }
	ul.sns.whiteIcon li.instagram a{background: url(./img/icon_instagram_white.svg) center center no-repeat; background-size: contain;  }


dl.data{grid-template-columns: auto 1fr; grid-gap:0.1rem 0.5rem ; padding: 2rem 0;}
dl.data dt{ padding-right: 1rem}
dl.data dt:after{ content: '：'; display: inline-block; position: absolute; right: 0;}
dl.data dd{}




ol.numbers{ margin-bottom: 6rem; }
ol.numbers li{ list-style: inside;list-style-type: decimal; margin-bottom: 1em;}

/* inView
----------------------------------------------- */
.inView{ opacity: 0; transition: all var(--transition); transform: translate3d(0,20px,0); transition: all var(--transition); }
	.inView.is-show{ opacity: 1;transform: translate3d(0,0%,0);}

/* image-inview
----------------------------------------------- */
.image-inview{}
.image-inview .image-inview-target{}
.image-inview .inViewLine{ display: block; position: absolute; width: 0; height: 0; transition: all var(--line-transition); background: var(--line-color);}
.image-inview .inViewLine:nth-of-type(1) { top: 0; left: 0; height: 1px;}
.image-inview .inViewLine:nth-of-type(2) { top: 0; right: 0; width: 1px;}
.image-inview .inViewLine:nth-of-type(3) { bottom: 0; right: 0; height: 1px;}
.image-inview .inViewLine:nth-of-type(4) { bottom: 0; left: 0; width: 1px;}
.image-inview .inViewLast{transition: all var(--transition); transition-delay: 500ms; opacity: 0;}

.image-inview .is-image-show .inViewLine:nth-of-type(1){ width: 100%;}
.image-inview .is-image-show .inViewLine:nth-of-type(2){ height: 100%;}
.image-inview .is-image-show .inViewLine:nth-of-type(3){ width: 100%;}
.image-inview .is-image-show .inViewLine:nth-of-type(4){ height: 100%;}
.image-inview .is-image-show .inViewLast{opacity: 1;}

.image-inview .is-image-show-hide .inViewLine{ opacity: 0 !important;}

/* list-inview
----------------------------------------------- */
.list-inview{}
.list-inview .image-inview-target{}
.list-inview .inViewLine{ display: block; position: absolute; width: 0; height: 0; transition: all var(--line-transition); transition-delay: 500ms; }
.list-inview .inViewLine{ top: 0; left: 0; border-bottom: dotted 1px var(--line-color);}
.list-inview .inViewLast{transition: all var(--transition); transition-delay: 1000ms; opacity: 0;}

.list-inview .list-inview-target:last-of-type .inViewLine:nth-of-type(2){top: auto; bottom: 0; }

.list-inview.is-show .inViewLine:nth-of-type(1),
.list-inview.is-show .inViewLine:nth-of-type(2){ width: 100%;}
.list-inview.is-show .inViewLast{opacity: 1;}


.pagenationUnit{
	text-align: center;
 font-size: 0;
	padding: 20px 0;
}
.pagenationUnit > div{ display: inline-block;}
.pagenationUnit .pageUnit,
.pagenationUnit .arrowWrap{ font-size: 1.7rem;}

body#single .pagenationUnit .pageUnit{ margin: 0 50px}

.pagenationUnit .pageUnit .pager{ display: inline-block; padding: 0.2em 0.35em; margin: 0 0.3em; line-height: 1;}
.pagenationUnit .pageUnit .pager.current{ color: #fff; background: var(--color-black);}

.pagenationUnit .arrowWrap{ display: inline-block; padding: 0.2em; }
.pagenationUnit .arrowWrap.prev{margin: 0 2em 0 0;}
.pagenationUnit .arrowWrap.next{margin: 0 0 0 2em;}

.pagenationUnit .deactive{ opacity: 0}




table {
		border-collapse:  collapse;
		margin-bottom: 2em;
}
table.info{border-collapse:  collapse;}
table.info th,table.info td {
		border: solid 1px var(--line-color);
		padding: 1em;
		vertical-align: top;
}
table.info tr{}
table.info td{}
table.info thead tr{padding: 0.5em 1em;}
table.info thead td{padding: 0.5em 1em; background: rgba(26,188,156,0.05); color: var(--color-key); font-weight: bold; font-size: 1.2em;}


.entryHeader.tabSelectWrap{ padding: 50px 20px; margin-bottom: 0px; border-bottom: 0;}
.entryHeader .tabSelect{ margin: 0;}
.entryHeader .tabSelect li{ display: inline-block; cursor: pointer;}
.entryHeader .tabSelect li:hover{ text-decoration: underline;}
.entryHeader .tabSelect li:not(:last-of-type):after{ content: ' / '; display: inline-block; margin: 0 1em;}
.entryHeader .tabSelect li a{ padding: 0.5em 0.5em; line-height: 1;}
.entryHeader .tabSelect li.active a{ background: #000; color: #fff;}



.tabUnit{ margin-bottom: 5rem;}
.tabUnit h3{ margin-bottom: 1em; font-size: 1.5em;}
.tabUnit .tabContents{}
.tabUnit .tabContents dl{line-height: 1.6;}
.tabUnit .tabContents dl dt{ position:relative;padding-left: 1.0em; }
.tabUnit .tabContents dl dt::before{ content: '・'; display: inline-block; position: absolute; top: 0; left: 0; }			

.tabUnit .tabContents dl dd{ margin-bottom: 1em;padding-left: 1.0em;}
.tabUnit .tabContents ul{line-height: 1.4;}
.tabUnit .tabContents ul li{ position:relative; margin-bottom: 1em; padding-left: 1.0em;}
.tabUnit .tabContents ul li::before{ content: '・'; display: inline-block; position: absolute; top: 0; left: 0; }			
			

/* media
----------------------------------------------- */
.onlyPC{ display:inline-block !important;}
.onlyPC_Block{ display:block !important;}
.onlySP{ display:none !important;}
.onlySP_Block{ display:none !important;}

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

}


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

	.onlyPC{ display:none !important;}
	.onlySP{ display:inline-block !important;}

.onlyPC_Block{ display:none !important;}
.onlySP_Block{ display:block !important;}

img.size-full{ max-width: 100%; width: 100%; height: auto;}

.sp_col_1{grid-template-columns: 1fr !important;}
.sp_col_2{grid-template-columns: 1fr 1fr !important;}



.flex{ grid-gap: 0; }
.flex .flexItem{ width: 100%; margin-bottom: 2em;}
.flex.col_2 .flexItem{ width: 100%;}

.entryBoxList dl dt{ margin-bottom: 0.5em;}


.tabSelect ul{ justify-content: space-between; }
.tabSelect ul li{ width: 49%; margin: 0 0 0.5em;}


}