@charset "UTF-8";
@media screen and (max-width: 768px) {

/*--------------------------------------------------------------
    Compo Module
---------------------------------------------------------------*/

/* media */
.media.pc { display:none; }
.media.sp { display:block; }
	
/* column */
.inner_width.w1100,
.inner_width.w960,
.inner_width.w860 { width:auto; }

/* width */
.wrap_column > .col_left,
.wrap_column > .col_right { float:none; }
.wrap_column.img_colmun > .col_sent { width:auto; }
.wrap_column.img_colmun > .col_img { width:auto; max-width:200px; margin-bottom:20px; }
	
/* wrap [wire]  */
.wrap_wire { padding:20px 15px; }

/* wrap [wire]  */
.wrap_bg_gray { padding:20px 15px; }
	
/* image [vertical] */
.box_img.vtc_img { width:auto; max-width:420px; }
/* image [large] */
.box_img.large_img { max-width:630px; width:auto; margin:30px auto 0; }
/* image [float] */
.box_img.float_img > .img { width:auto; margin:0 auto 30px; }
.box_img.float_img > .img.vtc { width:80%; }
.box_img.float_img > .img.left { float:none; margin-right:auto; }
.box_img.float_img > .img.right { float:none; margin-left:auto; }
	
.announceRead { text-align:left; padding: 16px; }
.announceRead p { text-align:center; }
	
/*--------------------------------------------------------------
    Container | wrapper
---------------------------------------------------------------*/
#container {}
#contents { font-size:80%; }

/*--------------------------------------------------------------
    Js Controler
---------------------------------------------------------------*/

/*--------------------------------------------------------------
    Css fixFooter 
---------------------------------------------------------------*/
.fixFooter #footer { position:static; }
	
/*--------------------------------------------------------------
    Common: Global navigation
---------------------------------------------------------------*/
	
/*--------------------------------------------------------------
    Common: Header
---------------------------------------------------------------*/
#header > .inner { padding:6vw 3vw; }
#header #compo_title { width:70vw; }
	
/*--------------------------------------------------------------
    Common: Footer
---------------------------------------------------------------*/

#footer { padding:40px 0px 80px; }
#footer > .inner { overflow:hidden; }

#footer .footer_box_a { display:block; float:none; text-align:center; }
#footer_copyright { float:none; margin-top:30px; text-align:center; }
	
/*--------------------------------------------------------------
    Common: Lower page
---------------------------------------------------------------*/
	
.page_low #contents > .inner { padding:0 3vw 16vw; }
	
.page_low .page_title > .ttl { font-size:150%; }
	
.page_low .wrap_article > .inner { border-radius:5px; padding:8vw 3vw 12vw; }
	
.page_low .section .sec_title { margin-bottom:30px; font-size:115%; text-align:left; }
.page_low .section + .sec_break  { padding-top:50px; margin-top:50px; }

/*--------------------------------------------------------------
    Main visual
---------------------------------------------------------------*/
#main_visual { padding:0 0 3vw; border-top:solid 5px #FFF; }
#main_visual > .inner { text-align:right; padding-top:50vw; }

#main_visual .visual { width:74vw; top:3vw; left:3vw; }

#main_visual .detail { display:inline-block; position:relative; width:82vw; padding:4vw 5vw; margin-right:3vw; text-align:left; }
#main_visual .detail h1 { width:42vw; }
#main_visual .detail .list_schedule { margin:20px auto 15px; font-size:2vw; font-weight:bold; }
#main_visual .detail .list_schedule li + li { margin-top:15px; }
#main_visual .detail .list_schedule li dl { display:inline-block; overflow:hidden; }
#main_visual .detail .list_schedule li dl dt { float:left; line-height:1.4em; }
#main_visual .detail .list_schedule li dl dd { padding-top:.2em; margin-left:7.5em; font-size:105%; line-height:1.3em; }
	
#main_visual .place { width:80%; }

#main_visual .title_en { position:absolute; top:0; left:0; width:12.8vw; }
#main_visual .name_en { position:absolute; top:0; bottom:auto; left:15vw; text-align:left; }
#main_visual .name_en img { width:52vw; }
#main_visual .inner .name_en .announce { width:58vw; padding:1vw 2vw; margin-top:3vw; font-size:3.2vw; line-height:1.4em; }
	
/*--------------------------------------------------------------
    Page: front
---------------------------------------------------------------*/
.page_front #contents .col_3 > .col { width:100%; }
.page_front #contents .col_3 > .col + .col { margin-left:0%; }
  
.page_front #contents { padding:6vw 3vw; }
.page_front #contents .col_href { width:45vw; }

.page_front #contents .wrap_essay > .ttl { width:100%; }
.page_front #contents .wrap_essay .list_essay { display:inline-block; }

.page_front #contents .wrap_sns .list_sns li + li { margin-top:20px; }
.page_front #contents .wrap_sns .list_sns .col_href { width:auto; }
.page_front #contents .wrap_sns  .list_sns li iframe { display:inline-block; }
	
.page_front #contents .wrap_sponsor { margin-top:60px; }
.page_front #contents .wrap_sponsor p { font-size:90%; line-height:1.4em; color:#555; }
	
/*--------------------------------------------------------------
    Page: Ticket
---------------------------------------------------------------*/
.page_ticket {}
.page_ticket .sec_ticket_date ul li { margin-bottom:10px; }
.page_ticket .sec_ticket_date ul li dl dt { float:none; }
.page_ticket .sec_ticket_date ul li dl dd { margin-left:auto; font-size:135%; }
.page_ticket .sec_ticket_date ul li dl dd::before { display:none; content:""; }

/*--------------------------------------------------------------
    Page: Schedule
---------------------------------------------------------------*/
.page_schedule #contents > .inner { padding-top:40px; }
	
.page_schedule .wrap_detail.wrap_column > .col_left,
.page_schedule .wrap_detail.wrap_column > .col_right { width:auto; }

.page_schedule .wrap_img_performer { max-width:360px; margin-bottom:40px; text-align:left; }
.page_schedule .wrap_img_performer .img_large { }
.page_schedule .wrap_img_performer .img_small { float:left; width:170px; margin-top:20px; }
	
.page_schedule .wrap_ticket .price { font-size:135%; }
	
.page_schedule .wrap_finalist .wrap_prof .name { padding-bottom:5px; margin-bottom:15px; font-size:130%; }
.page_schedule .wrap_finalist .wrap_prof .name > * { display:block; }
.page_schedule .wrap_finalist .wrap_prof .name .en { padding-left:0; font-size:80%; }
.page_schedule .wrap_finalist .wrap_prof .title { line-height:1.4em; }

}

@media screen and (max-width: 460px) {

/*--------------------------------------------------------------
    Compo Module
---------------------------------------------------------------*/

/* title side line */
.ttl_side_line { padding-left:10px; padding-bottom:3px; }
	
.btn_ticket { width:auto; }
	
/*--------------------------------------------------------------
    Global navigation
---------------------------------------------------------------*/
/* 
 *   Global navigation -> Navigation Menu
 */
#global_navigation .hamburger-btn { right:25px; }
#global_navigation .hamburger-btn::after{ right:10px; }
	
#navi_menu { position:fixed; top:0; right:-80vw; width:80vw; transition:all 0.3s; z-index:9999; font-size:80%; }
#navi_menu .inner { padding:80px 20px 20px; transition:.3s; }
#navi_menu #menu .item_wrap > .ttl { padding:10px 20px; margin-bottom:30px; font-weight:bold; background-color:#FFF; }
#navi_menu #menu .item_wrap > ul { padding-left:20px; }
#navi_menu #menu .item_wrap > ul > li { margin-bottom:30px; font-weight:bold; line-height:1.6em; }
#navi_menu #menu .item_wrap > ul > li a { position:relative; color:#FFF; }
#navi_menu #menu .item_wrap > ul > li a::after { content:''; width:0; height:1px; position:absolute; bottom:-5px; left:0; transition:width 0.3s; }
#navi_menu #menu .item_wrap.sche_wrap > ul > li .date { display:block; }
#navi_menu #menu .item_wrap.sche_wrap > ul > li .date .l { font-size:140%; }
#navi_menu #menu .item_wrap.essay_wrap > ul > li { font-weight:normal; }
#navi_menu #menu .item_wrap.essay_wrap > ul > li .ttl { display:block; font-size:105%; font-weight:bold; }

#navi_menu #menu ul > li a:hover::after { width:100%; color:#FFF; }
#navi_menu.current { overflow-y:scroll; right:0; height:100%; z-index:9998; }
	
/*--------------------------------------------------------------
    Main visual
---------------------------------------------------------------*/
#main_visual > .inner { padding-top:62vw; }

#main_visual .visual { top:0; left:0; width:auto; }
#main_visual .visual .copy { top:auto; bottom:8vw; right:-5vw; font-size:2vw; }

#main_visual .detail { width:82vw; padding:4vw 5vw; margin-right:3vw; }
#main_visual .detail h1 { width:56vw; }
#main_visual .detail .list_schedule { margin:15px auto; font-size:3vw; }
#main_visual .detail .list_schedule li + li { margin-top:10px; }
#main_visual .detail .list_schedule li dl { padding-left:5px; border-left:solid 2px #FFF; }
#main_visual .detail .list_schedule li dl dt { float:none; margin-bottom:.5vw; line-height:1.6em; }
#main_visual .detail .list_schedule li dl dd { margin-left:auto; }
#main_visual .detail a { display:inline-block; position:relative; color:#FFF; text-decoration:none; }
#main_visual .detail a::after { display:block; content:""; position:absolute; bottom:0; width:0; height:1px; background-color:#fff; }
#main_visual .detail a:hover::after { width:100%; }
	
#main_visual .place { width:100%; }

#main_visual .title_en { position:absolute; top:0; left:0; width:12.8vw; }
#main_visual .name_en { position:absolute; top:0; left:15vw; width:52vw; }
	
/*--------------------------------------------------------------
    Page: front
---------------------------------------------------------------*/
.page_front #contents { padding:6vw 3vw; }
.page_front #contents .col_href { width:auto; }

.page_front #contents .wrap_essay { display:block; }
.page_front #contents .wrap_essay .list_essay { display:block; }
.page_front #contents .wrap_essay .list_essay li { float:none; margin-left:auto; }

.page_front #contents .wrap_sns  .list_sns li iframe { display:block; }
.page_front #contents .wrap_sns  .list_sns .fb-page { display:block !important; width:100% !important; }
	
.page_front #contents .wrap_sponsor { margin-top:60px; }
.page_front #contents .wrap_sponsor p { font-size:90%; line-height:1.4em; color:#555; }
	
/*--------------------------------------------------------------
    Page: Ticket
---------------------------------------------------------------*/
.page_ticket .sec_tel { padding:15px 30px; }
.page_ticket .sec_tel .place { font-size:135%; line-height:1.4em; }
.page_ticket .sec_tel .tel { line-height:1.8em; }
	
.page_ticket .wrap_refund_info .large { line-height:1.6em; }
.page_ticket .wrap_refund_info p { line-height:1.8em; }
	
/*--------------------------------------------------------------
    Page: Schedule
---------------------------------------------------------------*/
.page_schedule .wrap_img_performer { max-width:none; }
.page_schedule .wrap_img_performer .img_large { width:auto; }
.page_schedule .wrap_img_performer .img_small { width:49%; margin-top:2%; }
.page_schedule .wrap_img_performer .img_small:nth-child(even) { margin-left:2%; }


}