@charset "UTF-8";
/* CSS Document */

@media screen and (max-width: 1200px) {
  .key-btm p.btm-text{
    width: calc(100% - 550px);
  }
  .head-nav li + li{
    margin-left: 30px;
  }
}
@media screen and (max-width: 1040px) {
  
  .head-nav li + li{
    margin-left: 20px;
  }
  .news-slider-wrap{
    width: calc(50% - 50px);
    transform: translateY(-60%);
  }

}
@media screen and (max-width: 1000px) {
  .header_inner nav
  ,.foot-page-nav{
    display: none;
  }
  .mypage-page-link li a{
    padding: 20px 30px;
  }
  .mypage-top-box .mypage-data{
    padding-left: 50px;
    padding-top: 20px;
  }
  .mypage-top-box{
    margin-top: -10px;
    -ms-align-items: flex-end;
    align-items: flex-end;
  }
}
@media screen and (max-width: 840px) {

   .key-btm p.btm-text{
   font-size: 1.4em; 
  }
}
/*tablet*/
@media screen and (max-width: 768px) {
  
  
/*header/nav  
===============================================================*/
 
  .l-nav__inner{
    padding-left: 30px;
    padding-right: 30px;
  }
  ul.l-nav__link li a, .l-nav__apply span{
    font-size: 1.25em;
  }
  #key.home{
  }
  #key.home::before{
    padding-top: 120%;
  }
  
  #key.home .key-inner{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -ms-align-items: center;
    align-items: center;
    /*justify-content: flex-end;*/
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    height: 110vw;
  }
  #key.home .key-inner p.key-title{
    width: calc(100% + 40px);
    transform: none;
  }
  #key.home .key-inner p.key-text{
    width: 70%;
    margin-top: 0;
    margin-left: auto;
    opacity: 0;
    -webkit-transition: opacity .3s;
    -o-transition: opacity .3s;
    transition: opacity .3s;
  }
  .key-btm p.btm-text{
    max-width: 100%;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 1.333em;
  }


  /*.key-slide-area{
    grid-template-rows: 50% 1fr;
    grid-template-columns: 50% 1fr;
  }
  .key-slide_top{
    grid-row: 1/2;
     grid-column: 1 / 3;
  }
  .key-slide_btm{
    grid-row: 1 / 2;
    grid-column: 2 / 3;
  }
  .key-slide_main{
     grid-row: 2/2;
     grid-column: 1 / 3;
  }*/

  .key-slide-area{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
  }
  .key-side{
    width: 100%;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    height: calc(100% / 2.5);
  }
  .key-side > *{
    height: 100%;
  }
  .key-main{
    width: 100%;
    height: calc(100% - (100% / 2.5));
  }

  .key-btm{
    padding-bottom: 50px;
    transition: .3s;
  }
  .key-btm p.btm-text{
   width: 100%;
    opacity: 0;
  }
  .news-slider-wrap{
    width: calc(100% - 100px);
    max-width: none;
    transform: translateY(-1em);
    top: 0;
    right: 10px;
  }
  .slider-item-inner .thumb{
    width: 35%;
  }
  .slider-item-inner .slide-cmnt{
    width: calc(65% - 20px);
  }
  .slider-item-inner .slide-cmnt p.in-title{

  }

   /*Index contents
  ==========================*/
  .bg-fixed{
    background-size: cover;
    background-position: center;
    background-attachment: scroll;
  }

  /*応募*/
  .sec-apply-blc{
    padding-top: 70px;
  }
  .sec-apply-box{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    padding-left: 20px;
    padding-right: 20px;
  }
  .sec-apply-box .apply-thumb{
    width: 100%;
    overflow: hidden;
  }
  .sec-apply-box .apply-thumb::before{
    content: "";
    display: block;
    padding-top: 56.25%;
  }
  .sec-apply-box .apply-thumb span{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -ms-align-items: center;
    align-items: center; justify-content: center;
  }
  .sec-apply-box .apply-cmnt{
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
  /*news*/
  .news-acv-list{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
  }
  .news-acv-list article{
    width: 100%;
  }
  .news-acv-list article + article,
  .news-acv-list article + article:nth-child(n+3){
    margin-top: 20px;
  }
  /*topic*/
  .sec-topic-slider{
    width: 100%;
    padding-left: 40px;
    padding-right: 40px;
  }
  
  /*footer
  ====================*/
  .foot-inner{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -ms-align-items: flex-start;
    align-items: flex-start;
  }
  .flex_clm{
    margin-left: auto;
  }
  .foot-other-nav{
    padding-bottom: 20px;
  }
  
/*UNDER
==========================*/
  
  
/*Under contents
==========================*/
  .content-header .js-head_wall{
    height: 80%;
  }
  
  .content-header.full{
    padding-bottom: 30vw;
  }
  
  
/*ARCHIVE
==============================*/
  
/*topic / spmovie
==================*/
  .topic-acv-list article.topic
  ,.spmovie-acv-list article.movie{
    width: calc((100% - 40px)/2);
    margin-left: calc(40px / 4);
    margin-right: calc(40px /4);
  }
  .spmovie-acv-list article + article:nth-child(n + 3)
  ,.spmovie-acv-list article + article:nth-child(n + 4)
  ,.topic-acv-list article + article:nth-child(n + 3)
  ,.topic-acv-list article + article:nth-child(n + 4){
    margin-top: 8vw;
  }
/*DETAIL
==============================*/
.detail-post-header h3.post-title{
  font-size: 1.5em;
}
.detail-post-header .date{
  padding-top: 10px;
  margin-left: auto;
}

/*news detail
===================*/
  .detail-news-box{
    width: 100%;
  }
  .d-news_thumb{
    transform: translateX(-20px) translateY(-85px);
  }
  .news-detail-body figure{
    transform: translateX(-20px);
  }
  .news-detail-header{
    width: calc(100% - 20px);
    padding-left: 20px;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -ms-align-items: flex-start;
    align-items: flex-start;
    padding-bottom: 20px;
  }
  .news-detail-body p{
    padding-left: 20px;
    padding-right: 20px;
  }
  
/*apply
============================================*/
  #content.clr-box-wrap.page-apply-blc{
    padding-left: 20px;
    padding-right: 20px;
  }
  .page-apply-cat .line-list li{
    padding: 25px 20px;
  }
  .page-apply-cat .line-list li .title{
    width: 12em;
    line-height: 1.4;
  }
  .apply-btn-wrap a{
    width: calc((100% - 20px)/3);
    font-size: .8em;
  }
  
/*MYPAGE
============================================*/
  
  .mypage-top-box{
    margin-top: -20px;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
  }
  .mypage-top-box .thumb{
    max-width: 100%;
    width: 100%;
    margin-left: auto;
  }
  .mypage-top-box .mypage-data p.member-num{
    padding-right: 0;
  }
  .mypage-top-box .mypage-data{
    padding-top: 30px;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
    max-width: 100%;
  }
  .mypage-page-link li a{
    max-width: 100%;
    padding: 20px 30px;
  }
  
  .mypage-title_inner{
    padding-right: 2em;
    padding-left: 2em;
  }
  .mypage-title-wrap h2{
    font-size: 1.5em;
    padding-left: .8em;
  }
  
  /*acount*/
  .select-warp label::after{
    right: 10px;
  }
  .radio > div + div{
    margin-left: 10px;
  }
  
  /*other*/
  .scta-list li{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
  }
  .scta-list li p.title
  ,.scta-list li .text{
    width: 100%;
  }
  .scta-list li .text{
    padding-left: 1em;
    padding-top: 15px;
  }
}

@media screen and (max-width: 480px) {
  .l-nav__inner{
    padding-left: 20px;
    padding-right: 20px;
  }
  .l-nav__box{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    margin-top: 8vw;
  }
  .l-nav__box > *{
    width: 100%;
  }
  .l-nav__apply{
    padding: 20px 0;
  }
  ul.l-nav__link li:last-child{
    border-bottom: none;
  }
  .l-nav__reg{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    margin-top: 5vw;
  }
  .l-nav__reg .btn-wrap{
    width: 100%;
  }
  .btn-wrap a.sq-pnk{
    font-size: 1.2em;
  }
  .l-nav__reg .sns-btn-wrap{
    margin-top: 7vw;
    width: 60%;
  }
  /**/
  .key-wrap{
    width: 100%;
    overflow: hidden;
  }

  .slider-item{
    width: 120%;
  }
  .slider-item-inner .thumb {
    width: 40%
  }
  .slider-item-inner .slide-cmnt{
    width: calc(60% - 10px);
  }
  .key-btm{
    padding-bottom: 10vw;
  }
  
  /*footer*/
  .foot-other-nav{
    margin-top: 15vw;
  }
  .foot-other-nav a{
    font-size: .8em;
  }
  .foot-other-nav a + a{
    margin-left: 1em;
  }
  
/*UNDER
==========================*/
  .header_inner{
    height: 70px;
  }
  #head-hum{
    width: 70px;
    height: 70px;
  }
  #head-hum button{
    top: 35px;
  }
  #head-hum button::before{
    top: 20px;
  }
  #head-hum button::after{
    top: 40px;
  }
  #head-hum.is-open p.hum_text{
    opacity: 0;
  }
  header_inner .logo{
    right: 10px;
  }
  .under-contents main
  ,.under-page main{
    padding-bottom: 20vw;
  }
  .content-header.full .content-header_inner h2{
    font-size: 1.5em;
  }
/*Under contents
==========================*/
  .content-header{
    padding-top: 20vw;
  }
  .content-header .js-head_wall{
    height: 75%;
  }
  
/*ARCHIVE
==============================*/
  
/*topic / spmovie
==================*/
  .topic-acv-list article.topic
  ,.spmovie-acv-list article.movie{
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .news-acv-list article + article
  ,.news-acv-list article + article:nth-child(n+3)
  ,.spmovie-acv-list article + article
  ,.topic-acv-list article + article{
    margin-top: 8vw;
  }
  
/*DETAIL
==============================*/
  .page-back-btn{
    margin-top: 18vw;
  }
  
/*apply
===============================*/
  .apply-tite{
    font-size: 1.666em;
  }
  .page-apply-body{
    margin-top: 10vw;
  }
  .page-apply-body .band-title span{
    font-size: 1.125em;
  }
  .page-apply-cat .in-title{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -ms-align-items: flex-start;
    align-items: flex-start;
  }
  .page-apply-cat .in-title p.att{
    font-size: .8em;margin-left: auto;
    margin-top: 10px;
  }
  .page-apply-cat .in-title p.line{
    padding-left: 14px;
    font-size: 1.125em;
  }
  .page-apply-cat .line-list li{
    display: block;
    padding: 15px 10px;
  }
  .page-apply-cat .line-list li .title{
    width: 100%;
  }
  .page-apply-cat .line-list li .date{
    margin-top: 10px;
  }
  .page-apply-cat .dot-list li{
    padding-left: 10px;
  }
  .page-apply-cat + .band-title{
    margin-top: 10vw;
  }
  .page-apply-body .band-title + *{
    margin-top: 5vw;
  }
  .page-apply-cat .num-title p{
    width: 100%;
  }
  li.file-up .file-input{
    padding-left: 0;
    padding-right: 0;
  }
  li.file-up .file-input .in-title{
    line-height: 1.4;
  }
  .apply-btn-wrap{
    margin-top: 10vw;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
  }
  .apply-btn-wrap a{
    width: 100%;
    font-size: .9em;
  }
  .apply-btn-wrap a + a{
    margin-top: 10px;
  }
  #content.page-appform-blc.comp{
    padding-top: 20vw;
  }
  .select-warp select{
    font-size: .9em;
  }
  .select-warp label::after{
    border-width: 10px 6px 0 6px;
  }
  .account-form .file-set label + span{
    font-size: .8em;
  }
  ::placeholder
  ,.placeholder{
    font-size: .9em;
  }
/*LOGIN　/ REGIST
============================================*/
  #content.clr-box-wrap{
    width: calc(100% - 20px);
    padding-top: 10vw;
    padding-bottom: 15vw;
  }
/*MYPAGE
============================================*/
  .mypage-title_inner{
    padding-left: 20px;
    padding-right: 20px;
  }
  .mypage-title-wrap{
    width: calc(100% - 20px);
  }
  .mypage-title_inner{
    width: 100%;
  }
  .page-mypage-box{
    padding-top: 10vw;
  }
  .page-mypage-box.bk_wh{
    padding-top: 20vw;
    padding-bottom: 20vw;
    max-width: calc(100% - 20px);
    margin-left: auto;
    margin-right: 0;
  }
  .account-list li{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    padding: 1em .5em;
  }
  .account-list li > * + *{
    margin-top: 5vw;
  }
  .account-form .data{
    padding-left: 0;
  }
  .account-list li p.title
  ,.account-list li .data{
    width: 100%;
  }
  * + .squ-arw-btn{
    margin-top: 10vw;
  }
  
  
}