@charset "utf-8";

/*======================================================================

　シネマアワー
　
	[01] 基本・レイアウト
	[02] メインビジュアル
	[03] 放送スケジュール
	[04] アーカイブ
	[99] メディアクエリ

======================================================================*/


/*------------------------------------------------

	[01] 基本・レイアウト

------------------------------------------------*/

@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);
/*@import url(//fonts.googleapis.com/earlyaccess/sawarabimincho.css);*/

html{/*font-size:62.5%;*/ /*10px scroll-behavior: smooth;*/ }
.sitemap_box{/*font-size: 160%;*/}
#wrapper { font-family: 'Lato', 'Noto Sans JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; width: 100%; padding: 0; background: #232323; font-size: 1.8rem; line-height: 1.8; /*background: repeating-linear-gradient(135deg, #e9dbbb, #e9dbbb 3px, #f2e3c2 3px, #f2e3c2 8px);*/ }
.container { border: 1px solid #222; }
.wrapper { display: flex; width: 100%; margin: 0 auto; justify-content: space-between; }

.box_cnt { width: 92%; max-width: 1280px; margin: 0 auto; }

/*#wrapper{font-family: 'Lucida Grande', Meiryo, sans-serif; width: 100%; min-width: 1000px; padding: 0 0 60px; background: #fff;}
#wrapper .mark_mys{}

.cnt_box { width: 100%; max-width: 1000px; margin: 60px auto; padding: 0 0 100px; border: 6px solid #000; background: #fff; }
.vpc{display: inherit;}
.vsp{display: none;}
p{color: #000;}
p.article{font-size: 1.6rem; line-height: 2;}
.link-off{pointer-events: none;}

.cp {text-align: center}
.cp p {color: #000; font-size: 1.2rem; font-weight: 600;}*/

/* Flex Box
---------------------------------*/
.flb { /*display: flex; flex-wrap: wrap; justify-content: left; width: 100%;*/ /*max-width: 1000px; margin: 0 auto; align-items: center;*/ }
.flb { display: flex; align-items: center; /*gap: 12px;*/ }

a.no_link {color: #fff; text-decoration: none; background: rgba(184,184,184,0.9) !important; pointer-events: none; border-radius: 4px;}

.nav a.no_link {text-decoration: none; background: none !important; pointer-events: none; opacity: 0.5;}
.footNav a.no_link {text-decoration: none; background: none !important; pointer-events: none; opacity: 0.5;}



/* フェード
---------------------------------*/
.scrollin { opacity: 0; transition: all .4s ease; }
.scrollin.show { opacity: 1; transform: none; }
.scr_lr { transform: translate(-1rem, 0); }
.scr_rl { transform: translate(1rem, 0); }
.scr_fadein { transform: translate(0, 0px); }
.scr_up1 { transform: translate(0, 1rem); transition: 0.8s 0s ease; }
.scr_up2 { transform: translate(0, 1rem); transition: 0.8s 0.2s ease; }
.scr_up3 { transform: translate(0, 1rem); transition: 0.8s 0.4s ease; }
.scr_up4 { transform: translate(0, 1rem); transition: 0.8s 0.6s ease; }
.scr_up5 { transform: translate(0, 1rem); transition: 0.8s 0.8s ease; }
.scr_up6 { transform: translate(0, 1rem); transition: 0.8s 1.0s ease; }
.scr_down { transform: translate(0, -1rem); }
.scr_scaleUp { transform: scale(.5); }
.scr_scaleDown { transform: scale(1.5); }
.scr_rotateL { transform: rotate(1rem); }
.scr_rotateR { transform: rotate(1rem); }





/* フッタ
---------------------------------*/
#foot_area_nav { width: 90%; margin: 0 auto; }
#foot_area_nav .area_nav { background: rgba(255,255,255,1); }
footer#common_foot { margin: 0; }


/* リンク
---------------------------------*/
a { color: #3db133; -webkit-transition: 0.5s ease-in-out; transition: 0.5s ease-in-out; }
a:link		{ }
a:visited	{ }
a:hover		{ text-decoration: none; opacity:0.7; }
a:active	{ text-decoration: none; }




/* 見出し
---------------------------------*/
.cinema h2 { display: flex; width: 32%; margin: 0 2% 0 0; align-items: center; justify-content: end; }
.cinema h2 a { text-align: right; }
.cinema h2 img { width: 80%; max-width: 280px; }
.cmn .cinema h2 img { width: 80%; margin: 0.5em; }
.cinema h3 { display: inline-block; width: 160px; margin: 50px 20px 30px; padding: 12px 20px; line-height: 1.0; background: #e62d2b; border-radius: 4px; }
.cinema .sub h3 { background: #2a71d3; }
.cinema h3 img { width: 100%; max-width: 84px; }
/*.cinema #box_mci h3 { border-bottom: none; }*/
.cinema #box_comment h3 { border-bottom: none; }

.cinema h4 {width: 100%; margin: 0 0 3rem; padding: 0.8rem 0; font-size: 2.4rem; font-weight: 600; letter-spacing: 0.09em; line-height: 1.8; color: #3f3f3f; background-image: linear-gradient(90deg, #e70012 0 10%, #787878 10%); background-repeat: no-repeat; background-size: 100% 4%; background-position: bottom;}

.cinema h5 { margin: 0 0 10px; padding: 0 0 8px; font-size: 1.0rem; font-weight: 600; letter-spacing: 0.09em; line-height: 1.0; color: #fff; border-bottom: 3px solid #fff; }
.cinema #box_event h5 { margin: 0; font-size: 1.8rem; font-weight: 300; }


/* 脚注
---------------------------------*/

/* 共通
---------------------------------*/



/*------------------------------------------------

	[02] メインビジュアル

------------------------------------------------*/
/*.main { display: flex; width: 100%; }
.inr_main { width: 100%; }
.main img { width: 100%; }*/
.main { position: relative; }
.main .glitch { background: url(/cinema/images/bg_main.png) 30% 70% no-repeat #232323; border-bottom: 6px solid #501616; }
.sub { position: relative; }
.sub .glitch { background: url(/cinema/images/bg_sub.png) 30% 70% no-repeat #232323; border-bottom: 6px solid #162150; }
/*.cmn .main .glitch { border-bottom: 2px solid #240803; }
.cmn .sub .glitch { border-bottom: 2px solid #162150; }*/
.inr_main { display: flex; flex-wrap: wrap;/*align-items: flex-end;*/ position: relative; width: 100%; max-width: 1000px; height: 100%; margin: 0 auto; z-index: 2; }
.inr_sub { display: flex; flex-wrap: wrap;/*align-items: flex-end;*/ position: relative; width: 100%; max-width: 1000px; height: 100%; margin: 0 auto; z-index: 2; }

.loop_wrap { display: flex; flex-direction: column; width: 100%; height: calc(100vw * .7); /* ループエリアの高さを調整 */ overflow: hidden; position: absolute; top: 0; left: 0; z-index: 1; }
.cmn .loop_wrap { height: calc(100vw* .3); max-height: 240px; }
.loop_wrap img { width: 100%; height: auto; min-height: 100vh; /* 画像がエリアを縦方向に埋める */ }
.cmn .glitch { height: 24vh; }

.img_oa { width: calc(60% - 20px); margin: 20px 10px; }

.bnr_request { width: 100%; max-width: 960px; margin: 1em auto; }
.bnr_request img { width: 100%; height: auto; }



/*------------------------------------------------

	[03] 放送スケジュール

------------------------------------------------*/

.box_list { width: 100%; max-width: 1000px; margin: 0 auto; padding: 0 0 2em; }
.box_list:nth-child(1) { border-bottom: 6px solid #444; }
ul.list_movie { justify-content: left; align-items: baseline; flex-wrap: wrap; }
ul.list_movie li { width: 46%; margin: .15em 2% 2em; }
ul.list_movie li a { text-decoration: none; }
ul.list_movie li p.date { font-family: 'Oswald', sans-serif; width: calc(14% - 2px); margin: 0 3% 0 4%; padding: 0 2% 0 0; /*width: 100%; margin: 0 16px 0 12px; padding: 0 16px 0 0;*/ font-size: 0.875rem; color: #fff; border-right: 2px solid #fff; }
ul.list_movie li p.title { width: 73%; margin: 12px 4% 12px 0; padding: 0 0 0; font-size: 1.075rem/*1.125rem*/; line-height: 1.4; color: #fff; }
ul.list_movie li p.title span { display: block; font-size: .75rem; line-height: 1.4; color: #f8f002; }
.box_list .img_movie { position: relative; margin: 0 0 0.5em; text-align: center; }
.img_movie span { position: absolute; top: 0; left: 0; padding: 6px 20px; font-size: 0.875rem; font-weight: 600; color: #fff; background: #102d64; border-radius: 4px 0 4px 0; z-index: 9; }
.img_movie img { width: 100%; max-width: 750px; height: auto; border-radius: 4px; }

.img_movie span.swiper-notification { display: none; }

.txt_movie { background: #343434; border-radius: 4px; }

.no_oa { margin: 0px 20px 0px; padding: 0px 0px 30px; font-size: 0.875rem; color: #fff; }

/* 年末年始2025-2026 */
.tit_2025-26, .tit_2025, .tit_2026 { width: 100%; max-width: 1000px; margin: 3em auto 2em; }
.tit_2025-26 img { width: 100%; }
.tit_2025 img, .tit_2026 img  { width: 100%; opacity: 0.75; }

ul.list_movie li { position: relative; }
.badge-first { position: absolute; width: 60px; height: 60px; border-radius: 50%; background: #f8f004; display: flex; align-items: center; justify-content: center; }
.badge-first span { color: #232323; font-weight: bold; font-size: 14px; line-height: 1.2; padding: 6px 8px 2px; border-radius: 6px; text-align: center; }



/*------------------------------------------------

	[04] アーカイブ

------------------------------------------------*/
.box_archive { width: 100%; max-width: 960px; margin: 0 auto; padding: 0 0 2em; }
ul.list_archive { justify-content: left; align-items: center; }
ul.list_archive li { width: 96%; margin: 10px 2%; }
ul.list_archive li a { text-decoration: none; }
ul.list_archive li p.date { font-family: 'Oswald', sans-serif; width: calc(14% - 2px); margin: 0 3% 0 4%; padding: 0 2% 0 0; /*width: 100%; margin: 0 16px 0 12px; padding: 0 16px 0 0;*/ font-size: 1.575rem; line-height: 1.2; color: #fff; text-align: center; border-right: 2px solid #fff; }
ul.list_archive li p.date span { display: block; font-size: 0.875rem; }
ul.list_archive li p.title { width: calc(77% - 12px); margin: 12px 0; padding: 0 12px 3px 0; font-size: 1.625rem; line-height: 1.4; color: #fff; }
ul.list_archive li p.title span { display: block; font-size: .75rem; line-height: 1.4; color: #f8f002; }
ul.list_archive li p.txt { margin: 1em 2% .5em; font-size: 0.875rem; text-align: justify; color: #fff; }
.box_archive .img_movie { position: relative; margin: 2em 0; text-align: center; }

/*.img_movie { position: relative; margin: 0 0 20px; }
.img_movie span { position: absolute; top: 0; left: 0; padding: 6px 20px; font-size: 0.875rem; font-weight: 600; color: #fff; background: #102d64; border-radius: 4px 0 4px 0; z-index: 9; }
.img_movie img { width: 100%; max-width: 750px; height: auto; border-radius: 4px; }

.img_movie span.swiper-notification { display: none; }

.txt_movie { background: #343434; border-radius: 4px; }*/

p.intro { margin: 2em 1em 1em; color: #fff; font-size: 1.125rem; font-weight: 600; text-align: justify; }



/*.tb_res, .tb_res td, .tb_res th { border-collapse: collapse; }*/
.tb_res tr:last-child td, .tb_res tr:last-child th { border-bottom: none; }
.tb_res { width: 100%; margin: 10px auto 1em; font-size: 0.875rem; line-height: 1.8; color: #fff; }
.tb_res th { /*width: 8%; min-width: 80px; padding: 8px 0 8px 2%; text-align: left; vertical-align: top;*/ font-weight: 600; }
.tb_res th span { display: block; /*white-space: nowrap;*/ padding: 2px 12px; background: #555; border-radius: 4px; }
.tb_res td { /*width: 88%; padding: 8px 2% 8px 0;*/ text-align: left; }
.tb_res td span { vertical-align: baseline; }
.tb_res th img { margin: 5px 10px; }

.tb_res { width: 100%; border-collapse: collapse; table-layout: auto; }
.tb_res th { width: 1%; white-space: nowrap; padding: 8px 0; text-align: left; vertical-align: top; }
.tb_res td { width: auto; padding: 8px 2%; }

.back { width: 100%; padding: 8px 0; text-align: center; }
.back p { width: 80%; max-width: 500px; margin: 10px auto; padding: 8px 0; font-size: 1.4rem; letter-spacing: 0.03em;text-align: center; line-height: 1; border-radius: 6px; background: #e62d2b; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
.back p a { display: block; width: 96%; padding: 4px 2%; color: #232323; font-weight: 600; text-decoration: none; }
.back p:hover { opacity: 0.7; }

.sub .back p { background: #2a71d3; }


/*------------------------------------------------

	[05] 特集

------------------------------------------------*/
p.catch { padding: 0.5em; font-size: 1.5rem; font-weight: 600; line-height: 1.4; color: #fcf60e; text-align: center; background: #343434; }
p.catch span.new { display: inline-block; color: #343434; font-size: 1rem; background: #fcf60e; padding: 0.1em .3em; border-radius: 3px; }
p.catch span.csub { display: inline-block; color: #fff; font-size: 1.25rem; }

/* SW プレゼント 2026.05.01-06 */
.present_list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; width: 96%; margin: 0 auto 1em; }
.img_present { position: relative; max-width: 380px; padding: 0; }
.img_present img { display: block; width: 100%; height: auto; margin: auto; padding: 0; border-radius: 6px; }

.entry { width: 100%; margin: 0 auto; padding: 8px 0; text-align: center; }
.entry p.p_txt { width: 80%; margin: 10px auto; padding: 8px 0; font-size: 1.4rem; color: #fcf60e; letter-spacing: 0.03em; text-align: center; line-height: 1; }
.entry p.btn_entry { width: 80%; max-width: 500px; margin: 10px auto; padding: 8px 0; font-size: 1.4rem; letter-spacing: 0.03em; text-align: center; line-height: 1; border-radius: 6px; background: #fcf60e; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
.entry p.btn_entry a { display: block; width: 96%; padding: 4px 2%; color: #232323; font-weight: 600; text-decoration: none; }
.entry p.btn_entry:hover { opacity: 0.7; }


/*------------------------------------------------

	[99] メディアクエリ

------------------------------------------------*/
@media screen and (min-width: 769px) {

/* [01] 基本・レイアウト
----------------------------*/




/* [02] メインビジュアル
---------------------------------*/
.header { display: flex; width: 96%; max-width: 960px; height: 50px; margin: 0 auto; }
.cinema { position: relative; /*padding-bottom: 30px;*/ }



/* [03] 放送スケジュール
---------------------------------*/
.badge-first { left: 18px; bottom: 50px; }




/* [04] アーカイブ
---------------------------------*/


}


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

/* [01] 基本・レイアウト
---------------------------------*/
#wrapper { /*min-width:200px; padding: 8px 0 0;*/ }

.vpc{display: none;}
.vsp{display: inherit;}


/* 見出し */

.cinema h2 { display: flex; width: 100%; margin: 0; align-items: center; justify-content: center; }
.cinema h2 img { width: 100%; max-width: 330px; margin: 70px 0 -30px; }
.cinema h3 { width: calc(96% - 40px); margin: 0 2% .5em; }
.cinema #box_event h5 { border-bottom: none; }

.header { display: flex; width: 96%; height: 50px; margin: 0 auto; justify-content: right; }
.cinema { position: relative; }

.flb { align-items: flex-start; }
.list_archive .flb { flex-direction: column; }

/* [02] メインビジュアル
---------------------------------*/
.main .glitch { margin: 0 0 .5em; background: url(/cinema/images/bg_main.png) 70% 70% no-repeat #232323; border-bottom: 6px solid #501616; }
.sub .glitch { margin: 0 0 .5em; background: url(/cinema/images/bg_sub.png) 70% 70% no-repeat #232323; border-bottom: 6px solid #162150; }
/*.loop_wrap { height: calc(100vw * 1.7); }
.glitch { height: 50vh; }
.cmn .glitch { height: 20vh; }*/
.img_oa { width: 100%; margin: 20px 0; text-align: center; }
.img_oa img { width: 96%; max-width: 358px; }


/* [03] 放送スケジュール
---------------------------------*/
.list_movie .txt_movie { flex-wrap: wrap; }
ul.list_movie li { width: 46%; margin: .15em 2% 1em; }
ul.list_movie li p.date { width: 96%; margin: 0 2%; padding: 0; font-size: 0.875rem; color: #fff; border-right: none; border-bottom: 2px solid #fff; }
ul.list_movie li p.title { width: 96%; margin: .3em 2%; padding: 0; font-size: 1.125rem; line-height: 1.4; color: #fff; }
.badge-first { right: -5px; top: -16px; }


/* [04] アーカイブ
---------------------------------*/
/*ul.list_archive li p.date { min-width: 70px; font-size: 1.25rem; }
ul.list_archive li p.title { width: auto; font-size: 1.375rem; }*/

ul.list_archive li p.date { width: 94%; margin: 0 3%; padding: .5em 0; font-size: 1.325rem; border-right: none; border-bottom: 2px solid #fff; text-align: left; }
ul.list_archive li p.date span { display: inline; padding: 0 .5em; }
ul.list_archive li p.title { width: 94%; margin: .25em auto .5em; padding: 0 3% 2px; font-size: 1.5rem; }

p.intro { margin: 1em 2% .5em; color: #fff; font-size: 1.0rem; line-height: 1.4; }
.box_archive .img_movie { margin: .5em 0; }
.back p { font-size: 1.0rem; }

.tb_res th { display: block; width: 96%; margin: 0 auto; padding: 8px 0 0; }
.tb_res td { display: list-item; width: 96%; margin: 0 auto; padding: 8px 0; }



/* [05] 特集
---------------------------------*/
p.catch { font-size: 1.25rem; }
p.catch span.new { margin: 0 auto 0.25em; }
p.catch span.csub { font-size: 1rem; }

/* SW プレゼント 2026.05.01-06 */
.present_list { grid-template-columns: repeat(2, 1fr); gap: 14px; margin: 0; }


}


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

/* [01] 基本・レイアウト
---------------------------------*/

/* [02] メインビジュアル
---------------------------------*/

/* [03] 放送スケジュール
---------------------------------*/

/* [04] アーカイブ
---------------------------------*/

/* [05] 特集
---------------------------------*/
/* SW プレゼント 2026.05.01-06 */
.present_list { grid-template-columns: repeat(2, 1fr); gap: 10px; }
.img_present img { display: block; width: 100%; max-width: 274px; margin: auto; }


}