/*
======== table of content. ===============
summary:トップページ用
==========================================
*/

.link_2020online { margin-bottom: 3em; padding-bottom: 3em; border-bottom: 1px solid #ccc; }
.link_2020online.link_noborder { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }

.link_2020online a { display: block; padding: 1em; background: #e91e63; color:#fff; font-size: 2rem; font-weight: 700; text-align: center; }
.link_2020online small { font-size: 80%; }

.link_2020online a span { text-decoration: underline; }
@media screen and (max-width: 767px) {
.link_2020online a { font-size: 1.6rem; }
}

.sec_content.sec_margin { padding-bottom: 16vw; }
@media screen and (max-width: 767px) {
.sec_content.sec_margin { padding-bottom: 30vw; }
}

.ttl_end { padding-bottom: 5vw; }
@media screen and (max-width: 767px) {
#mv h1.ttl_end { padding-bottom: 10vw; }
}

/* オンライン募集 */
.online_application .sec_sns { display: none; }
.online_app #mv { margin-bottom: 5em; }
.sec_online_teaser { padding-top: 3%; padding-bottom: 6%; }
.content_online { max-width: 1224px; padding: 3%; background: #fff; }

.content_online .ttl_online_teaser { display: flex; align-items: flex-end; margin-bottom: 1em; }
.content_online .ttl_online_teaser h2 { margin-right: .5em; padding: .2em .5em; background: #131313; color:#fff; font-size: 2.4rem; }
.content_online .ttl_online_teaser p { color: #131313; }

.content_online a { font-weight: 700; }
.ie .content_online a i { padding-left: .3em; }

.mov_explain { margin: 0 15% 5em; }
@media screen and (max-width: 767px) {
.mov_explain { margin: 0 5.33% 4em; }
}
.sec_g { background: #f1f1f1; }

/*出展募集ページ*/
.ttl_movie {
    margin-bottom: 1em;
    position: relative;
    padding: 1.5rem 2rem;
    font-size: 1.8rem;
    border:3px solid #000;
    text-align: center;
}

.ttl_movie::before {
    position: absolute;
    bottom: -14px;
    left: 48%;
    width: 0;
    height: 0;
    content: '';
    border-width: 14px 12px 0;
    border-style: solid;
    border-color:#000 transparent transparent
}

.ttl_movie::after {
    position: absolute;
    bottom: -10px;
    left: 48%;
    width: 0;
    height: 0;
    content: '';
    border-width: 14px 12px 0;
    border-style: solid;
    border-color:#fff transparent transparent
}
.yt_movie {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.yt_movie iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.sec_content.sec_shutten_content { padding-left: 2%; padding-right: 2%; }
.ttl_sub.ttl_sub_shutten { margin-bottom: .5em; }
.shutten_link.btn_anchor { margin-top: 1em; }
.sec_briefing h4 { text-align: center; }
.sec_appli { display: flex; justify-content: space-between; flex-wrap: wrap; padding: 4%; }

.txt_option_notice { margin-top: .3em; color:#fff; font-size: 1.4rem; }
.sec_briefing .txt_option_notice { text-align: center; }
.txt_option_notice a { color:#fff; text-decoration: underline; }

.bt_rounded_blue a { background: #09b7ad; border-radius: 5px; }

.bt_rounded_red { width:48%; margin-bottom: 4%; }
.bt_rounded_red a { display: block; padding: .5em; background: #e91f63; color:#fff; border-radius: 5px; font-size: 2.4rem; font-weight: 700; text-align: center; ;}

/* SP */
@media screen and (max-width: 767px) {
/* オンライン募集 */
.sec_online_teaser { padding-left: 2.66%; padding-right: 2.66%; }
.content_online { max-width:none; padding: 3%; background: #fff; }
.content_online .ttl_online_teaser { flex-direction: column; align-items: center; }
.content_online .ttl_online_teaser h2 { margin-right: 0; font-size: 2rem; }

/*出展募集ページ*/
.sec_shutten_content { margin-left: 2.66%; margin-right: 2.66%; }
.sec_bosyu_img { width: 100%; }
.ttl_movie { padding: 1rem; font-size: 1.6rem; }
.shutten_link.btn_anchor { margin-bottom: 1em; font-size: 1.4rem; }
.shutten_link.btn_anchor a:after { top:10px; }

.txt_option_notice,.sec_briefing .txt_option_notice { text-align: left; }

.sec_appli { flex-direction: column; }
.bt_rounded_red { width:100%; }
.bt_rounded_red:first-child { margin-bottom: 4vmin; }
.bt_rounded_red a { font-size: 1.6rem; }
}

/* 中止 */
.sec_discontinuation { padding: 1em; background: #131313; display: flex; justify-content: center; color:#fff; }

.btn_discontinuation_sp.btn_event_online a,
.btn_discontinuation.btn_event_online a,
.sec_discontinuation.sec_event_online { /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#31abe0+0,0168b7+100 */
background: #31abe0; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #31abe0 0%, #0168b7 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #31abe0 0%,#0168b7 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #31abe0 0%,#0168b7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#31abe0', endColorstr='#0168b7',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
border-radius:3px; }

.sec_discontinuation_inner {  }
.sec_discontinuation_inner h3 { margin-bottom: .7em; font-size: 140%; }
.sec_discontinuation_jp { margin-bottom: 1em; padding-bottom: 1em; border-bottom: 1px solid #fff; }


 
/* 緊急事態宣言 */
.sec_corona { padding: 1em; border:4px solid #0070c0; display: flex; justify-content: center; }
.sec_corona a { text-decoration: underline; }

.sec_corona_inner { text-align: center; }

.sec_corona_inner p { text-align: left; }
.sec_corona_inner .justify_narrow { letter-spacing: -0.002em; }
.sec_corona_inner .justify { letter-spacing: 0.027em; }

.ie11 .sec_corona_inner .justify,
.edge .sec_corona_inner .justify { letter-spacing: 0.03em; }

/* header */
.home #mfair_header { position: absolute; top:47vw; }

@media screen and (min-width: 1440px) {
.home #mfair_header { position: absolute; top:688px; }
}

.home #mfair_header.is-fixed { position: fixed; top:0; }
@media screen and (min-width: 1440px) {
.home #mfair_header.is-fixed { top:0; }
}

/* mv */
#mv { position: relative; /*margin-bottom: 2%; padding-bottom: 5.2%;*/ background: #ffeb3b; /*background: url("/2020/global/images/bg_mv.jpg") repeat-x;*/ }

.sec_btn_appli { position: relative;  max-width: 1440px; margin: auto; }
.btn_appli,.btn_discontinuation { position:absolute; right:2%; top:33px; }
.btn_appli a { position: relative; display: block; padding: 0.5em 2em 0.5em 0.5em; background: #00a1e6; color:#fff; font-size: 1.8vw; font-weight: 700; border-radius: 5px; text-align: center; }


#mv h1 a { display: block; position: relative; overflow: hidden; background: #000; }
#mv h1 a:hover { opacity: .9; }
#mv h1 img { 
transition: opacity .7s cubic-bezier(0.230, 1.000, 0.320, 1.000),
transform .7s cubic-bezier(0.230, 1.000, 0.320, 1.000),
background .7s cubic-bezier(0.230, 1.000, 0.320, 1.000),
color .7s cubic-bezier(0.230, 1.000, 0.320, 1.000);
}

@media screen and (min-width: 767px) {
#mv h1 a:hover img { transform: scale(1.02); }
}

#mv .btn_anchor a { padding-left: 0; }
#mv .btn_anchor a::after { display: none; }

/* 中止 */
.btn_discontinuation a { position: relative; display: block; padding: 0.5em 2em 0.5em 0.5em; background: #e60012; color:#fff; font-size: 1.8vw; font-weight: 700; border-radius: 5px; text-align: center; }
.btn_discontinuation a::after { position: absolute; left: 94%; top:23%; content: "\f107"; font-family: "Font Awesome 5 Free"; font-size: 2rem; font-weight: 900; border-top:none; }

.btn_discontinuation a::after,.btn_discontinuation a:hover::after { border-top:none; }



.btn_appli a::after { position: absolute; left: 95%; top:25%; content: "\f054"; font-family: "Font Awesome 5 Free"; font-size: 2rem; font-weight: 900; }

.btn_appli a .txt_appli_en { display: inline-block; border-bottom:1px solid #fff; font-size: 1.6vw; }
.btn_appli a:hover { opacity: .7; }


.sns_top { position: absolute; right:0; top:30%; }

.sns_top_icon,
.list_sns_top { width:43px; }

.sns_top_icon { margin-bottom: 1px; }

.sns_top_icon a,
.list_sns_top a { display: flex; justify-content: center; align-items: center; height: 40px; }

.sns_top_icon a:hover,
.list_sns_top a:hover { opacity: .7; }


.sns_top_icon a img { transition:transform .7s cubic-bezier(0.230, 1.000, 0.320, 1.000); }

.sns_top_icon a.close img { transform:rotate(-180deg); }

.sns_top_icon a { background: #018ea0; border-top-left-radius: 10px; }
.list_sns_top a { background: #4dd0e1; }
.list_sns_top li:not(:last-child) { margin-bottom: 1px; }
.list_sns_top li:last-child a { border-bottom-left-radius: 10px; }

.btn_appli_sp,.btn_discontinuation_sp { display: none; }

#mv h1 { max-width:1440px; width:auto; margin: auto; }
#mv h1 img { width:100%; height: auto; }

/*メニューなどフル装備*/
.full #mv { margin-bottom: 0; }
.full #contents { border-top:64px solid #ffeb3b; }

/*NEWS & TOPICS*/
.list_info { display: flex; justify-content: space-between; flex-wrap: wrap; }
.list_info img { width:100%; height: auto; }
.list_info li { width:23.07%; margin-bottom: 2rem; }
.list_info li a { display: block; }
.list_info li a:hover { opacity: .7; }
.list_info li figure { margin-bottom: .5em; }
.list_info li figure img { border:1px solid #e5e6e6; box-sizing: border-box; }
.list_info li p { font-size: 1.4rem; }

.list_info li .tag_info { margin-bottom: .5em; }

.list_info li .tag { display: inline-block; padding: .2em .4em; color:#fff; }
.list_info li .tag:not(:first-child) { margin-left: .3em; }

/*NEW*/
.list_info li .tag_new { background-color:#ef0888; }
/*DATE*/
.list_info li .tag_date { background-color:#000; }

.bt_info_more { margin: 0 35% 4rem; font-size: 2.4rem; }
.bt_info_more a { color:#fff; }

/*SPECIAL CONTENTS*/
.sec_specialcontents { }

.sec_specialcontents img { width:100%; height: auto; }
.sec_specialcontents li { margin-bottom: 8px; }
.sec_specialcontents li,
.sec_specialcontents li a { display: flex; background: #000; }
.sec_specialcontents li.reverse { flex-direction:row-reverse; }
.sec_specialcontents li figure { width:60.9%; }
.sec_specialcontents li .sec_special_desc { display: flex; flex-direction: column; justify-content: center; align-items: center; width:39.1%; padding: 2rem; color:#fff; }
.ie .sec_specialcontents li .sec_special_desc { display: block; }

.sec_special_desc h3 { margin-bottom: .7em; font-size: 2.4rem; text-align: center; }
.txt_special_desc { margin-bottom: .5em; font-size: 1.4rem; }


/*ABOUT 2020 MUSIC FAIR */
.sec_about { position: relative; display: flex; justify-content: space-between; margin-bottom: 2.1%; }
.about .sec_inner img  { width:100%; height: auto; }
.sec_about_desc { width:47.4%; }

.sec_about_desc h3 { margin: 0 5% 6%; }
.sec_about_desc p { font-weight: 500; }

.sec_about figure { width:48%; }

.sec_about_map_outer { position: relative; }
.sec_about_map { padding-top:30.13%; height: 0; }
.sec_about_map iframe { position: absolute; left: 0; top:0; width:100%; height: 100%; }

.txt_about_map { position: absolute; width:30%; right:5%; top:100px; z-index: 50; }

.sec_about_map img { transition: opacity .7s cubic-bezier(0.230, 1.000, 0.320, 1.000); }


/* SP */
@media screen and (max-width: 767px) {

.sec_corona_inner { text-align: left; }

/* header */
.home #mfair_header { position: fixed; top:0; }

.sec_btn_appli,
.sns_top { display: none; }

.btn_appli_sp,
.btn_discontinuation_sp { display: block; text-align: center; }

.btn_appli_sp { margin-bottom: 3%; /*margin-bottom: 10%;*/ }

.btn_appli_sp a { position: relative; display: block; padding: .7em; background: #00a1e6; color:#fff; font-size: 1.8rem; font-weight: 700; box-sizing: border-box; }
.btn_appli_sp a::after { position: absolute; left: 95%; top:25%; content: "\f054"; font-family: "Font Awesome 5 Free"; font-size: 2rem; font-weight: 900; }
.btn_appli_sp a .txt_appli_en { display: inline-block; margin-bottom: .4em; border-bottom:1px solid #fff; font-size: 1.6rem; }

/*中止*/
.btn_discontinuation_sp a { position: relative; display: block; padding: .7em; background: #595959; color:#fff; font-size: 1.8rem; font-weight: 700; box-sizing: border-box; }
.btn_discontinuation_sp a::after { position: absolute; left: 93%; top:22%; content: "\f107"; font-family: "Font Awesome 5 Free"; font-size: 2rem; font-weight: 900; }

.btn_discontinuation_sp a::after,.btn_discontinuation_sp a:hover::after { border-top: none; }

/* mv */
#mv { /*margin-bottom: 5%;*/ padding-bottom: 0; }
#mv h1 { max-width:inherit; padding: 0; }

/*NEWS & TOPICS*/
.list_info { flex-direction: column; }
.list_info li { width: auto; margin-bottom:1rem; }

.list_info li a { display: flex; justify-content: space-between; }

.list_info li figure { width:50%; }
.sec_info_txt { width:48%; }
.list_info li p { font-size: 1.2rem; }
.list_info li .tag_info { margin-bottom: .4em; }


.bt_info_more { margin: 0 20% 4rem; font-size: 1.6rem; }


/*SPECIAL CONTENTS*/
.sec_specialcontents li,
.sec_specialcontents li a,
.sec_specialcontents li.reverse { flex-direction: column; }

.sec_specialcontents li figure,
.sec_specialcontents li .sec_special_desc { width:auto; }

.sec_special_desc h3 { font-size: 1.6rem; }
.txt_special_desc { font-size: 1.2rem; }


/*ABOUT 2020 MUSIC FAIR */
.sec_about { flex-direction: column; }

.sec_about_desc,
.sec_about figure { width:auto; margin-bottom: 5.3%; }
.sec_about_desc h3 { margin: 0 10% 4%; }

.sec_about_map { padding-top:76.56%; }
.txt_about_map { position: relative; width:100%; right:0; top:0; }

}