@charset "utf-8";

/* main */
.section_ttl {
    text-align: center;
    color: #fff;
}
.section_ttl_en {
    display: block;
    font-style: italic;
}
.section_ttl_jp {
    display: block;
}
.section_ttl .sub_ttl{font-size: 19px;color: #000;text-align: center;margin-bottom:11px;font-weight: bold;}
@media (min-width: 768px) {
    .section_ttl_en {
        font-weight: 400;
    }
    .section_ttl_jp {
        font-size: 0.37rem;
        font-weight: 500;text-align: center;
        margin: 50px auto;
        display: table;
        padding: 20px;
        /*box-shadow: 1px 1px 0px 0px #bc0c0c;*/
        text-shadow: 1px 1px 2px #0b0c11;
    }
}
@media (max-width: 767px) {
    .section_ttl_en {font-weight: 400;}
    .section_ttl_jp {font-size: 2.3rem;font-weight: 600;text-align: center;margin: 30px auto;}
    .section_ttl .sub_ttl{font-size: 1.41rem;text-shadow: 1px 1px 3px #fff;}
}

/* mv */
#mv img{width:100%;min-height: 190px;}
.mv {
    position: relative;
    background: #000;
    overflow: hidden;
}
.mv_inner {display: flex; flex-wrap: wrap; justify-content: center;}
.mv_step_1 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #e5007f;
    display: flex;
    justify-content: center;
    align-items: center;
}
.mv_step_2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.mv_step_2_bg_cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/*.mv_step_2_bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../images/kv_step2_pc.jpg) no-repeat 50% 50% / cover;
}
*/
.mv_step_2_ttl_wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.mv_step_2_ttl {
    color: #333;
    text-align: center;
}
.mv_step_2_copy {
    color: #fff;
    text-align: right;
    position: absolute;
    left: 0;
    width: 100%;
}

@media (min-width: 768px) {
    .pc{display:block;}
    .sp{display:none;}
    .mv_step_1_svg { width: 4.92rem; }
    .mv_step_2_ttl { font-size: 3.33vw; font-weight: 700; line-height: 1.417; }
    .mv_step_2_bg { background: url(../images/kv.jpg) no-repeat 50% 50% / cover; }
    .mv_step_2_copy { font-size: 0.14rem; font-weight: bold; line-height: 1; text-shadow: 0px 0px 5px rgb(0 0 0), 0px 0px 5px rgb(0 0 0); bottom: 0.1rem; padding-right: 0.26rem; }
}
@media (max-width: 767px) {
    .pc{display:none;}
    .sp{display:block;}
    .kv1,.kv2{width:100%;}
    .mv {height: 31.5rem;}

}



/* message */
.message {background:#000; overflow: hidden;}
.message_copy_wrap {
    text-align: right;
    color: #fff;
}
.message_link{color: #fff;text-align: center;margin-bottom: 0.9rem;font-size: 0.3rem;}
.message_link a{color: #16a6c6;}
@media (min-width: 768px) {
    .message_box_ttl {
        width: 5.33rem;
    }
    .message_ttl {margin-top: 0.1rem;}
    .message_ttl .section_ttl_en { font-size: 1.98rem;}
    .message_ttl .section_ttl_jp {
        margin-top: -0.55rem;
    }
    .message_box {
        display: flex;
        justify-content: center;
        margin: 0.62rem auto 0.8rem;
        width: 10.74rem;
    }
    .message_box_txt {font-size: 0.23rem;letter-spacing: 0.2em;line-height: 2.2; color: #fff;}
    .message_copy_wrap {
        margin-top: 0.25rem;
        margin-bottom: 0.18rem;
    }
    .message_copy {
        font-size: 0.14rem;
        margin-right: 0.2rem;
    }
}
@media (max-width: 767px) {
    .message_box_ttl {
        width: 26.2rem;
    }
    .message_ttl {
        margin-top: 2.2rem;
    }
    .message_ttl .section_ttl_en {
        font-size: 9.8rem;
    }
    .message_ttl .section_ttl_jp {
        margin-top: -1.85rem;
    }
    .message_box {margin: 3.2rem auto 2.1rem;}
    .message_box_txt {
        margin-top: 2rem;
        font-size: 1.5rem;
        font-weight: 700;
        letter-spacing: 0.2em;
        line-height: 1.9;
        color: #fff;
        padding: 1.25rem;
    }
    .message_copy_wrap {
        margin-top: 2.2rem;
        margin-bottom: 1.4rem;
    }
    .message_copy {text-align: center;margin-bottom: 2.2rem;}
    .message_link{margin: 1.5rem;font-size: 1.4rem;}

}

/* decoration_wrap */
.decoration_wrap {
    position: relative;
    overflow: hidden;
}
.decoration_1_wrap {
    position: absolute;
}
.decoration_2_wrap {
    position: absolute;
}
.decoration_3_wrap {
    position: absolute;
}
@media (min-width: 768px) {
    .decoration_1_wrap {
        top: 3.2rem;
        left: 56%;
        margin-left: 4.2rem;
        width: 2.5rem;
    }
    .decoration_2_wrap {
        top: 9.3rem;
        left: 50%;
        margin-left: -8.28rem;
        width: 2.5rem;
    }
    .decoration_3_wrap {
        top: 11.2rem;
        left: 50%;
        margin-left: 4.3rem;
        width: 4.3rem;
    }
}
@media (max-width: 767px) {
    .decoration_1_wrap {
        top: -3.3rem;
        right: -6.4rem;
        width: 16.8rem;
    }
    .decoration_2_wrap {
        top: 47.8rem;
        left: -4.3rem;
        width: 12.1rem;
    }
    .decoration_3_wrap {
        top: 136.3rem;
        right: -4rem;
        width: 10.5rem;
    }
}

/* web_cm */
.web_cm {overflow: hidden;padding-bottom: 60px;}
.web_cm_ttl {
    color: #000;
}
.web_cm_txt {
  /*  text-align: center;*/
}
.web_cm_box {
    position: relative;
    border: 1px solid #b3b3b3;
    background: #fff;
    overflow: hidden;
}
.web_cm_box_thumb {
/*    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(https://ncf2024.andf.jp/images/ncf_header.jpg) no-repeat 50% 50% / contain;*/
}
.web_cm_box_play {
    position: absolute;
    background: url(../images/icon_movie_play.png) no-repeat 50% 50% / contain;
}
.web_cm_box_ttl {
    text-align: center;
}
.ncf_wrap{display:flex;width: 12.74rem;gap: 0.6rem;margin: 0 auto;margin-top: 1.25rem;}
img.ncf{max-width: 450px;}
@media (min-width: 768px) {
    .web_cm_txt {
        /*margin: 0.3rem 0;*/
        font-size: 0.2rem;
        letter-spacing: 0.08em;
    }
/*    .web_cm_box {
        width: 10.8rem;
        height: 6.07rem;
        margin: 0.44rem auto 0;
    }
    */
    .web_cm_box {width: 500px; margin:0 10px 30px;}
    .web_cm_box .web_cm_box_thumb {
        transition: transform 0.4s;
    }
    .web_cm_box:hover .web_cm_box_thumb {
        transform: scale(1.05);
    }
    .web_cm_box::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.4);
        opacity: 0;
        transition: opacity 0.4s;
    }
    .web_cm_box:hover::after {
        opacity: 1;
    }
    .web_cm_box_play {
        top: 50%;
        left: 50%;
        width: 1rem;
        height: 1rem;
        margin-left: -0.5rem;
        margin-top: -0.5rem;
        z-index: 2;
    }
    .web_cm_box_ttl {
        font-size: 0.16rem;
        margin-top: 0.2rem;
    }
}
@media (max-width: 767px) {
    .web_cm_txt {
        margin: 1.7rem 0 0;
        font-size: 1.4rem;
        line-height: 1.7;
        letter-spacing: 0.25rem;
    }
    .web_cm_box {
        margin: 2.6rem auto 0;
    }
    .web_cm_box_play {
        top: 50%;
        left: 50%;
        width: 5rem;
        height: 5rem;
        margin-left: -2.5rem;
        margin-top: -2.5rem;
    }
    .web_cm_box_ttl {
        font-size: 1.2rem;
        margin-top: 0.8rem;
    }
    .ncf_wrap {display: block;width: 90%;margin-top: 6.25rem;}
    img.ncf {max-width:100%;}
    .cinema_face .link{font-size: 1.7rem; text-decoration: none; text-align: center; margin: 10px auto;}
}

/* event */
.event {overflow: hidden;background: #d90920;color: #fff; margin: 60px auto;padding: 0px 10px 70px;}
.event_ttl {color: #000;}
.eventSwiper {
    position: relative;
}
.event_set,.topics_set {
    display: block;
    color: inherit;
    text-decoration: none;
    margin: 0 auto;
}
.event_thumb_wrap {
    overflow: hidden;
    position: relative;
}
.event_thumb_wrap {
    display: block;
}
.event_ctrl_wrap {
    position: relative;
}
.event_ctrl {
    position: absolute;
    display: flex;
    justify-content: space-between;
}
.event_ctrl_btn {
    border: 1px solid #000;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.event_ctrl_btn::after {
    content: '';
}
.event_next::after {
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    transform: translateX(-25%) rotate(45deg);
}
.event_prev::after {
    border-left: 1px solid #000;
    border-bottom: 1px solid #000;
    transform: translateX(25%) rotate(45deg);
}
.swiper-button-disabled {
    opacity: 0.2;
    cursor: default;
}
.swiper-slide {
    overflow: hidden;
}
.event_date {
    display: block;
}
.event_movie_txt {
    display: block;
}
.event_name {
    display: block;
}
.event_btn_wrap {
    text-align: center;
}
.event_btn {
    display: inline-block;
    position: relative;
    background: #000;
    color: #fff;
    text-decoration: none;
}
.event_btn::after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
}
.topics_list .event_set{width:100%;}
@media (min-width: 768px) {
    /* topics */
    .topics_wrap {display:flex;flex-wrap:wrap;gap:1%;justify-content: center;width: 1200px;margin: 0 auto;}
    .topics_list {width: 30%;  margin: 20px auto;}
    /*event*/
    .event_ttl {margin-top: 1.07rem; }
    .event_ttl .section_ttl_en { font-size: 1.2rem; }
    .event_ttl .section_ttl_jp { margin-top: -0.42rem;}
    .eventSwiper { margin: 0.4rem auto 0; width: 14.4rem;}
    .event_thumb_wrap { width: 5.2rem; height: 2.93rem; }
    .event_ctrl {
        top: -0.86rem;
        left: 50%;
        width: 1.78rem;
        height: 0.8rem;
        margin-left: 3.64rem;
    }
    .event_ctrl_btn {
        width: 0.8rem;
        height: 0.8rem;
    }
    .event_ctrl_btn::after {
        width: 0.12rem;
        height: 0.12rem;
    }
    .event_set {width: 87%;}
    .event_set .event_thumb_x {
        transition: transform 0.4s;
    }
    .event_set:hover .event_thumb_x {
        transform: scale(1.1);
        opacity: 1;
    }
    .event_set .event_date,
    .event_set .event_game,
    .event_set .event_name {
        transition: opacity 0.4s;
    }
    .event_set:hover .event_date,
    .event_set:hover .event_game,
    .event_set:hover .event_name {
        opacity: 0.5;
    }
    .event_date {
        margin-top: 0.2rem;
        font-size: 0.16rem;
    }
    .event_movie_txt {
        padding: 0.1rem;
        font-size: 0.18rem;
        font-weight: 700;
        color: #333;
        text-align: center;
    }
    .event_name {
        margin-top: 0.1rem;
        font-size: 0.2rem;
        font-weight: 700;
    }
    .event_btn_wrap {
        margin-top: 0.7rem;
    }
    .event_btn {
        width: 3.6rem;
    }
    a.event_btn {
        transition: 0.4s;
    }
    a.event_btn:hover {
        background: #d10020;
    }
    .event_btn_inner {
        font-size: 0.16rem;
        line-height: 4;
    }
    .event_btn::after {
        margin-top: -0.07rem;
        right: 0.26rem;
        width: 0.14rem;
        height: 0.14rem;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
    }
}
@media (max-width: 767px) {
    .event_ttl {
        margin-top: 5.2rem;
    }
    .event_ttl .section_ttl_en {
        font-size: 6.2rem;
    }
    .event_ttl .section_ttl_jp {
        margin-top: -2.22rem;
    }
    .eventSwiper {
        margin-top: 2.7rem;
        width: 37.5rem;
    }
    .event_thumb_wrap {
        width: 26.1rem;
        height: 14.73rem;
    }
    .event_ctrl {
        top: -4.46rem;
        left: 50%;
        width: 8.7rem;
        height: 3.9rem;
        margin-left: 7.94rem;
    }
    .event_ctrl_btn {
        width: 4rem;
        height: 4rem;
    }
    .event_ctrl_btn::after {
        width: 0.6rem;
        height: 0.6rem;
    }
    .swiper-slide {
        width: 26.1rem;
    }
/*    .event_set {
        width: 26.1rem;
    }*/
    .event_date {
        margin-top: 0.9rem;
        font-size: 1.2rem;
    }
    .event_movie_txt {
        margin: 1rem;
        font-size: 1.2rem;
        font-weight: 700;
        color: #333;
    }
    .event_name {
        margin-top: 0.2rem;
        font-size: 1.4rem;
        font-weight: 700;
    }
    .event_btn_wrap {
        margin-top: 4.5rem;
    }
    .event_btn {
        width: 24rem;
    }
    .event_btn_inner {
        font-size: 1.2rem;
        line-height: 4;
    }
    .event_btn::after {
        margin-top: -0.3rem;
        right: 2.06rem;
        width: 0.6rem;
        height: 0.6rem;
        border-top: 1px solid #fff;
        border-right: 1px solid #fff;
    }
}
/* campaign*/
.cp_img{display: flex;flex-wrap: wrap;margin-bottom:80px;gap: 2%;justify-content: center;}
.cp_img img{box-shadow: 0px 0px 8px #8324cd;max-width:340px;}
.cp_table {border-radius: 4px;overflow: hidden;width: 100%;margin-bottom: 0.6rem;}
.cp_table table{margin: 0 auto;font-size: 1.34em;}
.cp_table img{max-width: 100%;}
.cp_table th {color: #fff;}
.cp_table th, .cp_table td{padding: 14px;vertical-align: middle;}
.cp_table td:first-child { border-left: 1px solid #858585;}
.cp_table td { background: #fff; border-right: 1px solid #858585; border-bottom: 1px solid #858585;}
.cp_table a.button { font-weight: 700; line-height: 20px;color: #fff;background-color: #333;padding: 10px 52px; height: 45px; border-radius: 45px; position: relative; overflow: hidden; text-decoration: none; transition: all .2s; min-width: 211px; display: inline-flex; align-items: center; justify-content: center;}

@media screen and (max-width: 767px) {
.cp_table{font-size: 1.2rem;padding: 10px;}
.cp_table th, .cp_table td {white-space: pre-wrap; min-width: calc(50vw - 30.5px); }

}


/* pick_up */
.pick_up { overflow: hidden;}
.pick_up_ttl { color: #000;}
.pick_up_list { display: flex; justify-content: center;}
.pick_up_list > li a { position: relative; display: block;}
.pick_up_list > li img { display: block;}
.pick_up_list > li a::after { content: ''; display: block; position: absolute; bottom: 0; right: 0;}
.pick_up_link_wrap { text-align: center;}
@media (min-width: 768px) {
    .pick_up_ttl { margin-top:0.48rem;}
    .pick_up_ttl .section_ttl_en { font-size: 1.2rem; }
    .pick_up_ttl .section_ttl_jp { margin-top: -0.36rem; }
    .pick_up_list { margin-top: 0.42rem; }
    .pick_up_list > li { width: 3rem; }
    .pick_up_link_wrap { margin-top: 0.4rem; }
    .pick_up_list > li a::after { width: 0.4rem; height: 0.4rem; background: #d90920 url(../images/common/icon_link_white.svg) no-repeat 50% 50% / 0.15rem 0.15rem; }
    .pick_up_link { text-decoration: none; font-size: 0.16rem; color: inherit; }
    .pick_up_link::after { content: ''; width: 0.15rem; height: 0.15rem; background: url(../images/common/icon_link.svg) no-repeat 50% 50% / contain; display: inline-block; margin-left: 0.14rem; }
}
@media (max-width: 767px) {
    .pick_up_ttl { margin-top:2.42rem; }
    .pick_up_ttl .section_ttl_en { font-size: 6.2rem; }
    .pick_up_ttl .section_ttl_jp { margin-top: -2.16rem; }
    .pick_up_list { margin-top: 2.82rem; flex-direction: column; }
    .pick_up_list > li { height: 14rem; }
    .pick_up_list > li:first-of-type { height: 18rem; }
    .pick_up_link_wrap { margin-top: 1.9rem; }
    .pick_up_list > li a { position: relative; display: block; width: 100%; height: 100%; }
    .pick_up_list > li a::after { width: 2.4rem; height: 2.4rem; background: #d10020 url(../images/common/icon_link_white.svg) no-repeat 50% 50% / 1rem 1rem; }
    .pick_up_link { text-decoration: none; font-size: 1rem; color: inherit;}
    .pick_up_link::after { content: ''; width: 1rem; height: 1rem; background: url(../images/common/icon_link.svg) no-repeat 50% 50% / contain; display: inline-block; margin-left: 0.5rem; }
}

/* full_screen */
.full_screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 50;
    background: #000;
    background: rgba(0, 0, 0, 0.9);
    transform: translateX(-100%);
    opacity: 0;
    transition: transform 0s 0.4s, opacity 0.4s 0s;
}
.is_play .full_screen {
    transform: translateX(0%);
    opacity: 1;
    transition: transform 0s 0s, opacity 0.4s 0s;
}
.full_screen iframe {
    width: 100%;
    height: 100%;
    border: none;
}
.full_screen .close_btn {
    display: block;
    position: absolute;
    cursor: pointer;
    z-index: 100;
    top: 0;
    right: 0;
    z-index: 100;
}
.movie_close {
    height: auto;
    display: block;
    background: transparent;
}
@media screen and (min-width: 768px) {
    .full_screen {
        background: #000;
    }
    .iframe_player_api_wrap {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        box-sizing: border-box;
        padding: 0.7rem 0;
    }
    .iframe_player_api_cover {
        position: relative;
        width: 100%;
        height: 100%;
    }
    .movie_close {
        width: 0.7rem;
        padding: 0.2rem;
    }
}
@media screen and (max-width: 767px) {
    .iframe_player_api_wrap {
        position: absolute;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .iframe_player_api_cover {
        position: relative;
        width: 100%;
        padding-top: 55.6%;
    }
    .full_screen iframe {
        position: absolute;
        top: 0;
        left: 0;
    }
    .movie_close {
        width: 1.6rem;
        padding: 1.6rem;
        box-sizing: content-box;
    }
}

/* common_animation */
.is_animation_ready .inner_cover {
    opacity: 0;
    transform: scale(1.2);
    transition: 0.6s;
}
.is_animation_load .is_animated .inner_cover {
    opacity: 1;
    transform: scale(1);
}
.is_animation_ready .inner {
    filter: blur(10px);
    transition: filter 1.2s;
}
.is_animation_load .is_animated .inner {
    filter: blur(0px);
}