@charset "utf-8";
/*---------------------------------
* fvArea
----------------------------------*/
.fvArea{
    position: relative;
}
/*-------
* VISUAL
-------*/
.visualImg img{
    width: 100%;
    height: auto;
}
.visual_logo{
    position: absolute;
    margin: auto;
    top: calc(1431 / var(--vw-min) * 100vw);
    left: 0;
    right: 0;
    width: calc(1028 / var(--vw-min) * 100vw);
    height: calc(307 / var(--vw-min) * 100vw);
    background: url(../img/top/visual/vis_logo.png) no-repeat center center/contain;
}
.visual_catch{
    position: absolute;
    margin: auto;
    top: calc(110 / var(--vw-min) * 100vw);
    left: 0;
    right: 0;
    width: calc(77 / var(--vw-min) * 100vw);
    height: calc(396 / var(--vw-min) * 100vw);
    background: url(../img/top/visual/vis_catch.png) no-repeat right calc(5 / var(--vw-min) * 100vw) center/contain;
    opacity: 0;
    filter: blur(10px);
    transition: all .6s ease;
}
.visual_catch.is-ani{
    opacity: 1;
    filter: blur(0);
}
.visual_start{
    position: absolute;
    margin: auto;
    bottom: calc(15 / var(--vw-min) * 100vw);
    left: 0;
    right: 0;
    width: calc(650 / var(--vw-min) * 100vw);
    height: calc(109 / var(--vw-min) * 100vw);
    background: url(../img/top/visual/vis_start.png) no-repeat center center/contain;
}
@media screen and (max-width:768px) {
    .visual_logo{
    top: calc(780 / var(--vw-min) * 100vw);
    width: calc(678 / var(--vw-min) * 100vw);
    height: calc(203 / var(--vw-min) * 100vw);
    }
    .visual_catch{
        top: calc(100 / var(--vw-min) * 100vw);
        width: calc(50 / var(--vw-min) * 100vw);
        height: calc(254 / var(--vw-min) * 100vw);
    }
    .visual_start{
        bottom: calc(15 / var(--vw-min) * 100vw);
        width: calc(425 / var(--vw-min) * 100vw);
        height: calc(72 / var(--vw-min) * 100vw);
    }
}
/*---------------------------------
* COMMON
----------------------------------*/
/*ttl*/
.areaTtlWrap{
    display: flex;
    align-items: flex-start;
    height: calc(145 / var(--vw-min) * 100vw);
    max-height: 145px;
}
.areaTtlWrap.-newsTtl{
    position: absolute;
    right: 0;
    margin: auto;
    top: 0;
    bottom: 0;
}
.areaTtlWrap.-movieTtl{
    position: relative;
    justify-content: center;
    z-index: 5;
}
@media screen and (max-width:768px) {
    .areaTtlWrap{
        display: flex;
        align-items: flex-start;
        height: calc(145 / var(--vw-min) * 100vw);
        max-height: 145px;
    }
    .areaTtlWrap.-newsTtl{
        position: relative;
        right: unset;
        margin: unset;
        top: unset;
        bottom: unset;
    }
}
.areaTtl-text{
    color: var(--color-red);
    font-size: 145px;
    font-family: var(--font-en);
    line-height: 0.7em;
    margin-right: min(calc(30 / var(--vw-min) * 100vw),30px);
}
@media screen and (max-width:768px) {
    .areaTtl-text{
        font-size: calc(145 / var(--vw-min) * 100vw);
        margin-right: min(calc(30 / var(--vw-min) * 100vw),30px);
    }
}
/*moreLink*/
.moreLink{
    display: flex;
    width: 63px;
    justify-content: space-between;
    pointer-events: all;
    align-items: center;
}
@media screen and (max-width:768px) {
    .moreLink{
        width:calc(63 / var(--vw-min) * 100vw);
    }
}
.moreLink-text{
    color: var(--color-red);
    font-family: var(--font-en);
    font-size: 24px;
    writing-mode: vertical-rl;
    transition: all .4s ease;
}
@media screen and (max-width:768px) {
    .moreLink-text{
        font-size:calc(24 / var(--vw-min) * 100vw);
    }
}
.moreLink-arrow{
    position: relative;
    width: min(calc(28 / var(--vw-min) * 100vw),28px);
}
.moreLink-arrow::before{
    content: "";
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: var(--color-red);
}
.moreLink-arrow::after{
    content: "";
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 0;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: var(--color-red);
    transition: all .4s ease;
}
@media screen and (max-width:768px) {
    .moreLink-arrow::after{
        width: calc(5 / var(--vw-min) * 100vw);
        height: calc(5 / var(--vw-min) * 100vw);
    }
}
/*hover*/
.moreLink:hover .moreLink-text{
    transform: translateX(calc(5 / var(--vw-min) * 100vw));
}
.moreLink:hover .moreLink-arrow::after{
    right: 100%;
}
/*moreLinkWrap*/
.moreLinkWrap{
    display: flex;
    align-items: flex-start;
}
.moreLinkWrap:hover .moreLink-text{
    transform: translateX(calc(5 / var(--vw-min) * 100vw));
}
.moreLinkWrap:hover .moreLink-arrow::after{
    right: 100%;
}
/*movie*/
.movieArea:hover .moreLink-text{
    transform: translateX(calc(5 / var(--vw-min) * 100vw));
}
.movieArea:hover .moreLink-arrow::after{
    right: 100%;
}
/*---------------------------------
* newsArea
----------------------------------*/
.newsArea{
    width: 100%;
    position: relative;
}
/* bg line */
.newsArea_deco{
	width: 100%;
	height: calc(100% - min(calc(60 / var(--vw-min) * 100vw),60px));
	position: absolute;
	top: 0;
	right: 0;
	z-index: 0;
}
.newsArea_deco::after{
    content: "";
    display: block;
    background-color: var(--color-red);
    height: 100%;
    width: 1px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    transform: translateX(calc(-5 / var(--vw-min) * 100vw));

}   
.newsArea_deco::before{
    content: "";
    position: absolute;
    margin: auto;
    bottom: 0;
    left: 0;
    right: 0;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: var(--color-red);
    transition: all .4s ease;
    transform: translateX(calc(-5 / var(--vw-min) * 100vw));
} 
@media screen and (max-width:768px) {
    .newsArea_deco::before{
        width: calc(5 / var(--vw-min) * 100vw);
        height: calc(5 / var(--vw-min) * 100vw);
    }
}

/* inner */
.newsArea__inner{
    position: relative;
    max-width:1290px;
    margin: 0 auto;
    padding: calc(100 / var(--vw-min) * 100vw) calc(50 / var(--vw-min) * 100vw) calc(150 / var(--vw-min) * 100vw) ;
}
.newsList__item{
    display: flex;
}
.newsList__item-link{
    display: flex;
    width: calc(700 / var(--vw-min) * 100vw);
    max-width: 700px;
    align-items: center;
}
@media screen and (max-width:768px) {
    .newsList__item{
        margin-bottom: calc(80 / var(--vw-min) * 100vw);
    }
    .newsList__item:nth-child(even) .newsList__item-link .newsList__item-img{
        order: 2;
        margin-left: calc(30 / var(--vw-min) * 100vw);
        margin-right: unset;
    }
    .newsList__item-link{
        width: 100%;
    }
}
/*PC*/
@media screen and (min-width: 769px) {
    .newsList__item:first-child{
        justify-content: center;
        margin-bottom: 30px;
    }
    .newsList__item:nth-child(2){
        width: calc(380 / var(--vw-min) * 100vw);
    }
    .newsList__item:nth-child(3){
        justify-content: flex-end;
        margin-top: -30px;
    }
    .newsList__item:nth-child(3) .newsList__item-link .newsList__item-img{
        order: 2;
    }
    /* 2 */
    .newsList__item:nth-child(2) .newsList__item-link{
        flex-direction: column;
        align-items: unset;
    }
    .newsList__item:nth-child(2) .newsList__item-link .newsList__item-img{
        order: 1;
    }
}

/* img */
.newsList__item-img{
    width: calc(380 / var(--vw-min) * 100vw);
    height: calc(214 / var(--vw-min) * 100vw);
    max-width: 380px;
    max-height: 214px;
    margin-right:calc(30 / var(--vw-min) * 100vw);
    overflow: hidden;
}
.newsList__item-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all .4s ease;
}
/*PC*/
@media screen and (min-width: 769px) {
    .newsList__item:nth-child(3) .newsList__item-img{
        margin-left:calc(30 / var(--vw-min) * 100vw);
        margin-right: 0;
    }
}

/* text */
.newsList__item-text{
    width: calc(280 / var(--vw-min) * 100vw);
    max-width: 280px;
    color: #FFF;
    line-height: 1.6;
    font-size:min(calc(16 / var(--vw-min) * 100vw),16px);
}
.news-date{
    position: relative;
    display: inline-block;
    color: var(--color-red);
    font-size:min(calc(40 / var(--vw-min) * 100vw),40px);
    font-family: var(--font-en);
}
.news-date::after{
    content: "";
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px;
    background-color: var(--color-red);
    transition: all .4s ease;
}
.newsList__item-link:hover .news-date::after{
    width: 100%;
}
.newsList__item-link:hover .newsList__item-img img{
    transform: scale(1.03);
}
.newsList__item:nth-child(2) .newsList__item-text{
   margin-bottom: calc(20 / var(--vw-min) * 100vw);
}
.news-text{
    display: flex;
}

/*---------------------------------
* movie
----------------------------------*/
.mvBlockWrap{
    width: 100%;
    height: calc(300 / var(--vw-min) * 100vw);
    max-height: 300px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -60px;
    position: relative;
}
.mvBlock{
    position: relative;
    width: 100%;
    height: calc(640 / var(--vw-min) * 100vw);

}
/* btn */
.btn_moviePlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    z-index: 2;
    background-color: rgba(0, 0, 0, .6);
    transition: .4s ease;
}
.movieArea:hover .btn_moviePlay,
.btn_moviePlay:hover {
    opacity: 0;
}
.moviebg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    pointer-events: none;
}
.bg_ytplayer {
    margin: auto;
    position: absolute;
    top: -50%;
    left: 0;
    width: 100%;
    height: 200%;
}

/*------------------------------------
* loading
-------------------------------------*/
#loading {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1002;
    background-color: #000;
}

.loading__logo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    filter: blur(0px);
    transition: 1s ease;
}

.loading_logoIn {
    width: min(calc(450 / var(--vw-min) * 100vw), 450px);
    animation: ld_logozoom 3s ease forwards;
}

.loading_logoIn {
    width: min(calc(450 / var(--vw-min) * 100vw), 450px);
    animation: ld_logozoom 3s ease forwards;
}
@keyframes ld_logozoom {
	0%{
		transform: scale(100%);
	}
	100%{
		transform: scale(110%);
	}
}

/* -a1 */
#loading .loading__logo {
    transition: all 2s ease;
}
#loading.-a1 .loading__logo {
	opacity: 0;
    filter: blur(10px);
}
#loading.-a1 .loading_logoIn{
	animation-play-state: paused;
}
.visualImg{
        filter: blur(10px);
         transition: all .6s ease;

}
.visualImg.fadein{
        filter: blur(0px);
}
/* line */
.loading__line{
  position: fixed;
  top: 50%;
  left: 50%;
  width: 1px;
  height: 0;
  background-color: var(--color-red);
  transform: translate(-50%, -50%);
  animation: lineGrow 1s ease-out forwards;
  transition: all .3s ease;
}
@keyframes lineGrow {
  from {
    height: 0;
  }
  to {
    height: 100vh; 
  }
}