/*---------------------------------------------
  HEADER
---------------------------------------------*/

header.top_header {
	box-shadow: 0 3px 6px rgba(0,0,0,0);
}





/*---------------------------------------------
  MAIN
---------------------------------------------*/
.top-key-visual {
margin-top:65px;
width:100%;
height:100%;
position:relative;
overflow:hidden;
}

.top-key-visual .swiper-wrapper {
  width: calc(100% - 20px);
overflow:hidden;
position: relative;
aspect-ratio: 1346 / 683;
margin:10px;
border-radius:40px;
}

.top-key-visual .swiper-wrapper .swiper-slide {
}

.top-key-visual picture,
.top-key-visual img {
margin-top:0;
object-position:center;
height:auto;
  width: calc(100% - 20px);
}


@media screen and (max-width: 991px) {
.top-key-visual {
margin-top:50px;
}
}

@media screen and (max-width: 768px) {
.top-key-visual .swiper-wrapper {
aspect-ratio: 355 / 597;
border-radius:20px;
}
}

/* ボタン */
a.top-join {
position:absolute;
z-index:10;
bottom:88px;
right:30px;
box-sizing:border-box;
text-decoration:none;
display:block;
width:150px;
height:150px;
background: #D31027;
background: linear-gradient(to bottom, #EA384D, #D31027);
color:#fff;
text-align:center;
font-family:"Noto Sans JP",sans-serif;
font-weight:700;
font-size:46px;
line-height:1.2;
padding-top:22px;
box-shadow: 0 0 0 0 rgba(233,30,99 ,0.5);
animation: anime08_pulse 1.5s infinite;
transform: rotate(45deg);
transition:scale .3s ease;
}

@media (any-hover: hover){
a.top-join:hover {
scale:110%;
}
}

a.top-join .inner {
transform: rotate(-45deg);
}

a.top-join span {
font-weight:400;
font-size:20px;
width:105px;
display:inline-block;
}

@media screen and (max-width: 576px) {
a.top-join {
bottom:88px;
right:0;
width:100px;
height:100px;
font-size:30px;
line-height:1.2;
padding-top:16px;
}

a.top-join span {
font-size:14px;
width:100px;
}


}

@keyframes anime08_pulse {
	70%  {
				 -webkit-box-shadow: 0 0 0 50px rgba(233,30,99, 0);
					       box-shadow: 0 0 0 50px rgba(233,30,99, 0); }
	100% {
				 -webkit-box-shadow: 0 0 0 0 rgba(233,30,99, 0);
					       box-shadow: 0 0 0 0 rgba(233,30,99, 0); }
}

/*---------------------------------------------
  TOP
---------------------------------------------*/

.top-main-contents {
	overflow:hidden;
	clear:both;
}




/*---------------------------------------------
  TOP CONTENTS
---------------------------------------------*/

.container h2 {
font-size:50px;
}

@media screen and (max-width: 767px) {
.container h2 {
font-size:40px;
}
}

.top-main-contents .container {
	padding:10px 15px 64px 15px;
}

.top-main-contents a.more {
color:#000;
font-size:18px;
}

.top-main-contents a.more:after {
font-family: FontAwesome;
content:"\f105";
margin-left:1rem;
margin-right:0rem;
font-size:1.3rem;
transition:margin .3s ease;
}

@media (any-hover: hover){
.top-main-contents a.more:hover:after {
margin-left:0.5rem;
margin-right:0.5rem;
}
}




/*-----------------------------
  bnr
-----------------------------*/
#bnr {
max-width: 1130px;
width:100%;
}

@media (any-hover: hover){
#bnr a:hover {
opacity:0.6;
}
}

#bnr .container {
overflow-x: hidden;
}

#bnr .bnr {
	width:100%;
	position:relative;
width:320px;
margin-right:20px;
}

#bnr .bnr .post-eyecatch {
overflow: hidden;
width:320px;
aspect-ratio: 4 / 3;
z-index:-1;
}


#bnr .bnr .post-eyecatch img {
    object-fit: cover;
object-position: center;
}


#bnr .swiper-pagination{
	position: relative!important;
}

#bnr .swiper-pagination-bullet {
	width: 35px;
	height: 4px;
	border-radius: 0%;
    background-color: #000;
    box-shadow: 1px 3px 3px rgb(0 0 0 / 10%); 
}
#bnr .swiper-pagination-bullet-active {
	width: 35px;
	height: 4px;
	border-radius: 0%;
    background-color: #000;
}

.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction{
	bottom: 0!important;
}

.swiper-button-next,
 .swiper-rtl .swiper-button-prev {
	right: 0!important;
	left: auto;
top:36%!important;
width:30px!important;
height:30px!important;
}
.swiper-button-prev,
 .swiper-rtl .swiper-button-next {
	left: 0!important;
	right: auto;
top:36%!important;
width:30px!important;
height:30px!important;
}

#bnr .swiper-button-prev:after,
#bnr .swiper-button-next:after {
color:#919191;
    display: block;
    width: 30px;
    height: 30px;
    cursor: pointer;
}


#bnr .swiper-button-prev:after {
    content: '<';
font-size:22px;
border:solid 1px;
border-radius:999px;
padding:3px 8px;
}

#bnr .swiper-button-next:after {
    content: '>';
font-size:22px;
border:solid 1px;
border-radius:999px;
padding:3px 10px;
}


@media screen and (max-width:1199px){
#bnr {
width:100%;
max-width: inherit;
}

#bnr .container {
overflow-x: visible;
}

.swiper-button-next, .swiper-rtl .swiper-button-prev,
.swiper-button-prev, .swiper-rtl .swiper-button-next {
    display: none!important;
}

#bnr .container{
     padding: 0;   
}

#bnr .bnr .post-eyecatch{
    width: auto!important;
}

}


/* 1枚のみswiper無効 */
.swiper-container:not(.swiper-initialized) .swiper-button-prev,
.swiper-container:not(.swiper-initialized) .swiper-button-next {
display: none;
}
.swiper-container:not(.swiper-initialized) .swiper-wrapper {
justify-content:center;
}
.swiper-container:not(.swiper-initialized) .bnr {
margin-right: 0!important;
}


/*-----------------------------
  NEWS
-----------------------------*/

#top-main-contents #news .post-item-type_a1 a {
	color:#5F6368;
}




/*-----------------------------
  FANCLUB
-----------------------------*/
#join {
min-height:110lvh;
}

#join::before {
content: "";
display: block;
position: fixed;
background-color:#EBF2FC;
top: 0;
left: 0;
width: 100%;
height: 100vh;
    background-image: url("../images/top/join_bg.jpg");
    background-repeat: no-repeat;
background-size:646px;
background-position:left 10% center;
z-index:-1;
}

@media screen and (max-width: 767px) {
#join::before {
background-size: 90%;
background-position: center top 20%;
}
}


#join a {
background: #D31027;
background-image: linear-gradient(128deg, rgba(211, 16, 39, 1) 25%, rgba(234, 56, 77, 1) 85%);
display: block;
max-width: 300px;
width: 80%;
color: #fff;
font-family: "Noto Sans JP", serif;
font-weight: 500;
font-size: 24px;
margin: 46px auto 0;
aspect-ratio: 5/1;
padding: 8px 0 9px;
transition:scale 0.5s ease;
}

@media (any-hover: hover){
#join a:hover {
scale:110%;
}
}


/*-----------------------------
  CONTENTS
-----------------------------*/

#contents .contents-inner {
border-bottom:2px solid #707070;
background-color:#fff;
transition:background-color .3s ease;
}

@media (any-hover: hover){
#contents .contents-inner:hover {
background-color:#f3f3f3;
}
}

#contents .contents-inner a {
color:#000;
}

#contents .contents-inner a:hover {
color:#000;
/*opacity:0.6;*/
}

#contents .contents-inner .post-eyecatch {
overflow:hidden;
    position: relative;
    aspect-ratio:16/9;
    width: 100%;
border:1px solid #707070;
}

#contents .contents-inner img{
    display: block;
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    object-fit: cover;
    object-position: top;
    max-width: none;
    max-height: none;
    min-width: 100%;
    min-height: 100%;
}

#contents .contents-main-wrap p{
    text-align: center;
    font-size: 34px;
    padding: 2% 1rem 0;
}

#contents .contents-main-wrap p.contents-ttl{
    font-size: 18px;
    padding: 0 1rem 4%;
}

@media screen and (max-width:767px){
#contents .contents-main-wrap{
}
#contents .contents-main-wrap p{
    font-size: 30px;
}
#contents .contents-main-wrap p.contents-ttl{
    font-size: 14px;
}
}



/*-----------------------------
  ARTiST
-----------------------------*/

#artist .row {
margin-left: 0;
margin-right: 0;
}
#artist .col-4 {
solid 1px #dfdfdf;
padding-left: 0;
padding-right: 0;
aspect-ratio:1/1;
}

#artist .col-4 a {
height:100%;
display:flex;
justify-content:center;
align-items:center;
}

#artist li img {
width:80%;
display:block;
margin:auto;
}

#artist li a::before {
    transition: border 0.25s cubic-bezier(0.47, 0, 0.745, 0.715);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    border: 0 solid #5d5d5d;
    display: block;
    width: 100%;
    height: 100%;
}

@media (any-hover: hover) {
#artist li a:hover::before {
border: 9px solid #5d5d5d;
}
#artist li a:focus::before {
border: 0 solid #5d5d5d;
}
}


/*-----------------------------
  ViDEO
-----------------------------*/
#video {
padding-bottom:60px;
max-width: 1130px;
width:100%;
}

#video .swiper-container {
overflow: hidden;
}


#video .bnr .post-eyecatch {
overflow:hidden;
    position: relative;
    aspect-ratio:16/9;
    width: 100%;
}

#video .bnr .post-eyecatch img {
    object-fit: cover;
object-position: center;
    aspect-ratio: 16/9;
}

#video a {
color:#000000;
font-weight: 400;
}

@media (any-hover: hover){
#video a:hover {
opacity:0.6;
}
}

@media screen and (max-width: 767px) {
#video {
padding-bottom:120px;
}
}

#video .swiper-pagination {
	position: relative!important;
}

#video .swiper-pagination-bullet {
	width: 35px;
	height: 4px;
	border-radius: 0%;
    background-color: #000;
    box-shadow: 1px 3px 3px rgb(0 0 0 / 10%); 
}
#video .swiper-pagination-bullet-active {
	width: 35px;
	height: 4px;
	border-radius: 0%;
    background-color: #000;
}

.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction{
	bottom: 0!important;
}

#video .swiper-button-next,
#video .swiper-rtl .swiper-button-prev,
#video  .swiper-button-prev,
#video  .swiper-rtl .swiper-button-next {
top:45%!important;
}

#video .swiper-button-prev:after,
#video .swiper-button-next:after {
color:#919191;
    display: block;
    width: 30px;
    height: 30px;
    cursor: pointer;
}


#video .swiper-button-prev:after {
    content: '<';
font-size:22px;
border:solid 1px;
border-radius:999px;
padding:3px 8px;
}

#video .swiper-button-next:after {
    content: '>';
font-size:22px;
border:solid 1px;
border-radius:999px;
padding:3px 10px;
}


@media screen and (max-width:1199px){
#video {
width:100%;
max-width: inherit;
}

#video .swiper-container {
overflow: visible;
}

#video .container{
     padding: 0;   
}

#video .bnr .post-eyecatch{
    width: auto!important;
}

}

/*-----------------------------
  SNS
-----------------------------*/
.top-main-contents #sns{
	padding-top: 0;
padding-bottom:100px;
}

.top-main-contents #sns ul {
display: flex;
justify-content: center;
flex-wrap: nowrap;
}

.top-main-contents #sns li {
/*width: 50px;*/
max-height:30px;
margin: 30px 20px;
}
.top-main-contents #sns li img {
height:32px;
width:auto;
}

.top-main-contents #sns li a {
display:block;
}

.top-main-contents #sns li a:hover {
opacity: 0.7;
}

@media screen and (max-width: 576px) {
.top-main-contents #sns ul{
	flex-wrap: wrap;
}

.top-main-contents #sns li {
width: 15%;
max-width:32px;
min-height:32px;
padding:0;
margin: 20px 5%;
}
.top-main-contents #sns li img {
width:45px;
max-height:45px;
height:auto;
}
}

/*-----------------------------
  fadein
-----------------------------*/
.fadein {
  opacity: 0;
  visibility: hidden;
  transform: translateY(40px);
  transition: all 1s;
}
.fadein.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}