@charset "utf-8";

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

　どーする？ごはん2
　
	[01] 基本・レイアウト
	[02] メインビジュアル
    [03] 放送・配信
	[04] イントロダクション
    [05] あらすじ
    [06] 番宣
    [07] 出演者
    [08] ロケ地紹介
    [09] MBCリンク
    [10] 連携先リンク
    [11] SNS
	[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: #f1d43b;*/ font-size: 1.8rem; /*line-height: 1.8;*/ }
.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; }


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

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); }


.footNav { width: 100%; /*margin: auto;*/ text-align: center; }
.footNav li { display: inline-block; position: relative; margin-right: 30px; font-size: 1rem; font-weight: 600; color: #09296b; vertical-align: middle; }
.footNav li:last-child { margin-right: 0px; }
.footNav li a { color: #09296b; text-decoration: none; }
.footNav li a:hover { color: #09296b; }
.footNav li:after { content: ""; display: block; width: 2px; height: 18px; background: #09296b; position: absolute; top: 4px; right: -19px; /*-webkit-transform: rotate(30deg); transform: rotate(30deg);*/ }
.footNav li:last-child:after { content: unset; }


/* フッタ
---------------------------------*/
#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: #de7000; -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;}



/* 見出し
---------------------------------*/

h2 { width: 100%; max-width: 1000px; /*position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; width: 50%; max-width: 420px;*/ }
h2 img { width: 100%; }
.gohan_top h3 { margin: 0 auto 30px; padding: 0 0 14px; text-align: center; }
.gohan_top h3 span { display: inline-block; }
.gohan_top #box_location h3 span { border-bottom: none; }
.gohan_top h3 span img { width: 100%; max-width: 340px; margin: 0 0 6px; }
.gohan_top #box_location h3 span img { filter: brightness(0) invert(1); }
#box_intro h3 { margin-top: -60px; }
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;}



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

/* 共通
---------------------------------*/
.bg_gohan { width: 100%; /*background: linear-gradient(90deg,#fbd374 0%,#fbd374 50%,#9fd8f5 50%,#9fd8f5 100%);*/ }


/* 動画配信
---------------------------------*/
.btn_flex-even { display: flex; margin-bottom: 60px; justify-content: center; }
.btn_flex-even > li { /*flex-basis: 100%;*/flex-basis: 32%; }
.btn_flex-even li a { display: block; padding: 0.3em; margin: 0 0.3em; border: 1px solid #ccc; border-radius: 6px; background: #fff; }
.btn_flex-even li img { display: block; width: 100%; max-width: 224px; height: auto; text-align: center; margin: 0 auto; }



/* 相互リンク
---------------------------------*/
.bnr_gohan_ko { width: 100%; max-width: 600px; margin: 0 auto 30px; text-align: center; }
.bnr_gohan_ko img { width: 100%; border: 2px solid #fff; box-sizing: border-box; }


/* SNS
---------------------------------*/
ul.icon_sns { display: flex; flex-wrap: wrap; width: 96%; margin: 0 auto 10px; justify-content: center; }
ul.icon_sns li { width: 50px; height: 50px; margin: 0; display: inline-flex; justify-content: center; align-items: center; line-height: 25px; background: #000; border-radius: 999px; }
ul.icon_sns li a { text-decoration: none; }
ul.icon_sns li a img { width: 100%; max-width: 42px; filter: brightness(0) invert(1); }


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

	[02] メインビジュアル

------------------------------------------------*/
#main { display: flex; justify-content: center; background: url("/gohan2/images/bg_main.png") 50% 50% #08a5de; /*background: #08a7de; width: 100%; max-width: 1000px;position: relative; display: flex; justify-content: center;*/ }
/*.main_left { display: flex; justify-content: center; width: 50%; background: #000; }
.main_right { display: flex; justify-content: center; width: 50%; background: #000; }
.main_left img { width: 100%; max-width: 600px; }
.main_right img { width: 100%; max-width: 600px; }*/
.copy_kv { position: absolute; bottom: 10px; left: 50%; transform: translate(-50%, 0%); z-index: 10; width: 50%; max-width: 114px; }
.copy_kv img { width: 100%; }



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

	[03] 放送・配信

------------------------------------------------*/
#box_oa { width: 100%; padding: 0; background: #f1d43b; }
#box_oa:before { content: ""; display: block; /*height: 140px; margin-top: -140px;*/ visibility: hidden; }
#box_oa .inr_box { width: 100%; max-width: 1200px; margin: 0 auto; /*background: #f1d43b;*/ }
.img_schedule { width: 80%; max-width: 1140px; margin: 0 auto; padding: 30px 0; line-height: 1; }
.img_schedule img { width: 100%; }


#box_ondemand { width: 100%; margin: 140px auto 150px; padding: 0 0 80px; background: rgba(93,199,230,1.0); }
#box_ondemand:before { content: ""; display: block; height: 140px; margin-top: -140px; visibility: hidden; }
ul.list_oa3 { display: flex; flex-wrap: wrap; width: 100%; max-width: 750px; margin: 0 auto; justify-content: center; }
ul.list_oa3 li { width: calc(100% / 3 - 20px); margin: 0 10px 20px; padding: 4px 0; text-align: center; line-height: 1; border-radius: 6px; background: #102d64; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
ul.list_oa3 li a { display: block; width: 100%; padding: 0px 0; text-decoration: none; }
ul.list_oa3 li:hover { opacity: 0.7; }
ul.list_oa3 li img { width: 100%; max-width: 200px; vertical-align: middle; }

ul.list_oa4 { display: flex; flex-wrap: wrap; width: 100%; max-width: 750px; margin: 0 auto; justify-content: center; }
ul.list_oa4 li { width: calc(100% / 5 - 20px); margin: 0 10px 20px; padding: 4px 0; text-align: center; line-height: 1; border-radius: 6px; background: #102d64; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
ul.list_oa4 li a { display: block; width: 100%; padding: 0px 0; text-decoration: none; }
ul.list_oa4 li:hover { opacity: 0.7; }
ul.list_oa4 li img { width: 100%; max-width: 200px; vertical-align: middle; }


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

	[04] イントロダクション

------------------------------------------------*/
#box_intro { width: 100%; margin: 140px auto 0; padding: 0 0 80px; background: rgba(93,199,230,1.0); }
#box_intro:before { content: ""; display: block; height: 140px; margin-top: -140px; visibility: hidden; }
#box_intro .inr_box { width: 94%; max-width: 1000px; margin: 0 auto; }
#box_intro .inr_box p { color: #102d64; }
#box_intro .inr_box p.txt_stg { margin: 0 auto 20px; font-size: 1.45rem; font-weight: 600; text-align: center; }
#box_intro .inr_box p.txt { margin: 0 auto 20px; font-size: 1.0rem; text-align: justify; }





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

	[07] あらすじ

------------------------------------------------*/
#box_story { width: 100%; margin: 0 auto 0px; padding: 80px 0; background: rgba(93,199,230,.9); }
#box_story:before { content: ""; display: block; height: 140px; margin-top: -140px; visibility: hidden; }
#box_story .inr_box { width: 94%; max-width: 1000px; margin: 0 auto; }
ul.gallery { display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto; }
ul.gallery li { width: calc(100% / 10 - 0px); margin: 10px 0; padding: 0; text-align: center; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
#box_story .inr_box p.outline { margin: 0 auto 20px; font-size: 1.0rem; color: #102d64; text-align: justify; }

ul.list_story {  }
ul.list_story li { width: 46%; margin: 10px 2% 60px; }
ul.list_story li p.date { font-family: 'Oswald', sans-serif; width: 100%; margin: 0; font-size: 0.875rem; color: #ee7900; }
ul.list_story li p.title { margin: 0 0 10px; padding: 0 0 4px; font-size: 1.75rem; line-height: 1.4; color: #102d64; border-bottom: 3px solid; }
ul.list_story li p.txt { font-size: 0.875rem; text-align: justify; }
.img_story { position: relative; margin: 0 0 6px; }
.img_story 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_story img { width: 100%; height: auto; border-radius: 4px; }

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


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

	[06] 番宣

------------------------------------------------*/
#box_mov { width: 100%; margin: 0 auto 0px; padding: 80px 0; }
#box_mov:before { content: ""; display: block; height: 140px; margin-top: -140px; visibility: hidden; }
#box_mov .inr_box { width: 94%; max-width: 1000px; margin: 0 auto; }


#box_mov .flb { justify-content: center; }
.pkg p.article{ margin-top: 6px; text-align: center; font-size: 1.4rem; font-weight: 600; }
.pkg{width: 48%; margin: 0 1%;}/*2個入る版*/
.pkg1{width: 100%; margin: 0 0%;/*width: 70%; margin: 0 15%;*/}/*1個入る版*/
/**,::after,::before{box-sizing:border-box}*/
.close-modal,::after,::before{box-sizing:border-box}



/* youtube video */
.vdo-base { position: relative;}
.modal-open {width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 6;}
.vdo-body {max-width: 100%; height: auto; padding-bottom: 56.25%; position: relative; overflow: hidden;}
.vdo-body iframe {width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.cnt_box .vdo-txt p.txt-ttl {font-size: 1.6rem; font-weight: 600; margin-top: -.2rem; color: #d23155; text-align: center;}
.cnt_box .vdo-txt p.txt-txt {text-align: center;}
.cnt_box .vdo-txt p.txt-txt span {font-size: 1.4rem; margin-bottom: .4rem; color: #d23155; text-align: center;}




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

	[07] 出演者

------------------------------------------------*/
#box_cast { width: 100%; margin: 0 auto 0px; padding: 80px 0; background: rgba(93,199,230,1.0); }
#box_cast:before { content: ""; display: block; height: 140px; margin-top: -140px; visibility: hidden; }
#box_cast .inr_box { width: 94%; max-width: 1000px; margin: 0 auto; }
#box_cast .inr_box p { color: #09296b; }
#box_cast .inr_box p.comment { font-size: 0.875rem; line-height: 1.8; text-align: justify; }
#box_cast .inr_box p .icon_comment { display: block; }
#box_cast .inr_box p img.icon_comment  { width: 32px; }


/*出演者*/
ul.main_cast { display: flex; flex-wrap: wrap; width: 80%; margin: 0 auto 2em; }
ul.main_cast li { width: calc(80% / 1 - 0px); margin: 0 auto; }
ul.main_cast li p.cast_img { width: 100%; margin: 0 auto 12px; }
ul.main_cast li p.cast_img img { width: 100%; border-radius: 6px; }
ul.main_cast li p.cast_cap { font-size: 1.125rem; font-weight: 600; line-height: 1.2; text-align: center;}
ul.main_cast li p.cast_cap span { font-size: 0.8rem; font-weight: 300; }
ul.main_cast li p.cast_cap span.ep { margin: 0 0 6px; padding: 3px 0; border-radius: 5px; color: #fff; display: block; background: #000; }

ul.sub_cast { display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto 10px; }
ul.sub_cast li { width: calc(100% / 3 - 40px); margin: 0 auto 20px; }
ul.sub_cast li p.cast_img { width: 100%; margin: 0 auto 12px; }
ul.sub_cast li p.cast_img img { width: 100%; border-radius: 6px; }
ul.sub_cast li p.cast_cap { font-size: 1.125rem; font-weight: 600; line-height: 1.2; text-align: center;}
ul.sub_cast li p.cast_cap span { font-size: 0.8rem; font-weight: 300; }
ul.sub_cast li p.cast_cap span.ep { margin: 0 0 6px; padding: 3px 0; border-radius: 5px; color: #fff; display: block; background: #000; }
#box_cast .inr_box ul.sub_cast li p.comment { font-size: 0.875rem; }



ul.guest { display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto 10px; }
ul.guest li { width: calc(100% / 2 - 40px); margin: 0 auto; }
ul.guest li p.story { margin: 0 0 20px; padding: .5em 1em; font-size: 0.875rem; font-weight: 600; color: #fff; background: #f1d43b; border-radius: 6px; }
ul.guest li ul { display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto; }
ul.guest li ul li { width: calc(100% / 2 - 40px); margin: 0 20px 1.5em; }
ul.guest li p.cast_img { width: 100%; margin: 0 auto 12px; }
ul.guest li p.cast_img img { width: 100%; border-radius: 6px; }
ul.guest li p.cast_cap { font-size: 1.125rem; font-weight: 600; line-height: 1.2; text-align: center;}
ul.guest li p.cast_cap span { font-size: 0.8rem; font-weight: 300; }
ul.guest li p.cast_cap span.ep { margin: 0 0 6px; padding: 3px 0; border-radius: 5px; color: #fff; display: block; background: #000; }




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

	[08] ロケ地紹介

------------------------------------------------*/
#box_location { width: 100%; margin: 0 auto; padding: 80px 0; background: url(/gohan2/images/bg_lct.jpg) no-repeat 50% 0% / cover; background-color: rgba(0,0,0,0.6); background-blend-mode: darken; }
#gohan_ko #box_location { width: 100%; margin: 0 auto; padding: 80px 0; background: url(/gohan2/ko/images/bg_lct.jpg) no-repeat 50% 0% / cover; background-color: rgba(0,0,0,0.6); background-blend-mode: darken; }
#box_location:before { content: ""; display: block; height: 140px; margin-top: -140px; visibility: hidden; }
#box_location .inr_box { width: 94%; margin: 0 auto; }
#box_location .inr_box p { color: #fff }

ul.list_location { display: flex; flex-wrap: wrap; justify-content: center; width: 100%; margin: 0 auto; }
ul.list_location li { width: 130px; margin: 10px; padding: 0; text-align: center; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
ul.list_location li img { width: 100%; max-width: 420px; margin: 0 auto .2em; border-radius: 4px; box-sizing: border-box; /*border: 4px solid #fff;*/ background-clip: padding-box; border: 4px solid rgb(255, 255, 255, 0.3); }
ul.list_location li p.name { margin: 6px auto 0; font-size: 0.75rem; font-weight: 300; line-height: 1.3; }



/*モーダル表示*/
.modal_wrap input { display: none; }
.modal_overlay { display: flex; justify-content: center; overflow: auto; position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); opacity: 0; transition: opacity 0.5s, transform 0s 0.5s; transform: scale(0); }
.modal_trigger { position: absolute; width: 100%; height: 100%; }
.modal_content { align-self: center; width: calc(80% - 60px); padding: 40px 30px 15px; box-sizing: border-box; background: rgba(0, 0, 0, 0.7); line-height: 1.4em; transition: 0.5s; }
.modal_content .img_location { width: 98%; max-width: 750px; margin: 0 auto .2em; text-align: center; }
.modal_content .img_location img { border-radius: 6px; }
.modal_content .img_location.tate img { width: auto; height: 100%; max-height: 480px; }
.modal_content img { width: 100%; margin: 0 auto .2em; }
.modal_content p { padding-top: 0; }
.modal_content p.name { margin: 0 auto; font-size: 1.25rem; font-weight: 600; line-height: 1.3; color: #f8dbab; text-align: center; }
.modal_content p.txt { margin: 0; font-size: 0.875rem; line-height: 1.7; color: #9fd8f5; text-align: center; }
/*.icon_comment { width: 100%; max-width: 30px; }*/
.close_button { position: absolute; top: 0px; right: 10px; font-size: 24px; cursor: pointer; color: #9fd8f5; }
.modal_wrap input:checked ~ .modal_overlay { opacity: 1; transform: scale(1); transition: opacity 0.5s; }
.modal_wrap input:checked ~ .modal_overlay .modal_content { transform: translateY(20px); }
.open_button { cursor :pointer; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
.open_button:hover { opacity: 0.7; }
.modal_content a { text-decoration: none; }
#box_location .inr_box .modal_content a p.txt { color: #9fd8f5; }

.modal_content .img_location img {
    max-width: 100%;
    max-height: 80vh; /* 画面の80%以内に制限 */
    height: auto;
    width: auto;
    object-fit: contain; /* 画像全体を表示 */
}


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

	[09] MBCリンク

------------------------------------------------*/
#box_mbc { width: 100%; margin: 0px auto 0; padding: 30px 0; background: rgba(93,199,230,1.0); }
#box_mbc:before { content: ""; display: block; height: 140px; margin-top: -140px; visibility: hidden; }
#box_mbc .inr_box { width: 94%; max-width: 1000px; margin: 0 auto; }
ul.bnr_mbc { margin: 30px auto; justify-content: center; }
ul.bnr_mbc li { border-radius: 4px; }
ul.bnr_mbc li img { width: 100%; }


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

	[10] 連携先リンク

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

ul.list_link { margin: 30px auto; justify-content: center; }
ul.list_link li { width: 30%; margin: 0 1% 40px; background: #fff; border-radius: 4px; }
ul.list_link li img { width: 100%; max-width: 480px; }



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

	[11] SNS

------------------------------------------------*/
#box_sns { width: 100%; margin: 0px auto 0; padding: 30px 0; background: #f1d43b; }
#box_sns:before { content: ""; display: block; height: 140px; margin-top: -140px; visibility: hidden; }
#box_sns .inr_box { width: 94%; max-width: 1000px; margin: 0 auto; }
ul.list_sns { width: 40%; max-width: 300px; margin: 0px auto; padding: 30px 0; justify-content: center; }
ul.list_sns li { /*width: 40%; margin: 0 5%;*/ width: calc(100% / 3 - 20px); margin: 0 10px; }
ul.list_sns li img { width: 100%; border-radius: 4px; }

ul.list_link2 { margin: 30px auto; justify-content: center; }
ul.list_link2 li { /*width: 30%;*/ margin: 0 1% 40px; background: #fff; border-radius: 4px; }
ul.list_link2 li img { width: 100%; max-width: 480px; height: auto; }








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

	[99] メディアクエリ

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

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

/* 見出し */
h2 { height: 560px; }


/* [02] メインビジュアル
---------------------------------*/
.header { display: flex; width: 96%; max-width: 960px; height: 52px; margin: 0 auto; }
.gohan_top { position: relative; }
.gohan_top div.bg_nav { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%; }
div.box_nav { width: 100%; position: sticky; display: flex; margin:0; padding: 0; top: 0; z-index: 999; }
div.bg_nav { margin: 0 auto; padding: 20px 0; border-radius: 4px;}
#fix_nav {position: inherit;}
.main {position: relative; margin-top: 70px; }

.area_nav { display: flex; width: 100%; margin: 0 0 0 0; border-radius: 6px; background: rgba(255,255,255,0.9); }
.btn_sns { width: 50px; height: 50px; margin: 0 2% 0 0; background: rgba(255, 255, 255, 0.9); border-radius: 999px; /*display: grid; place-items: center;*/ }
.btn_sns a { display: inline-block; width: 50px; text-align: center; text-decoration: none; }
.btn_sns a img { width: 60%; max-width: 26px; vertical-align: middle; }
.btn_mp {width: 16%; max-width: 120px; margin: 0 1% 0 0; font-size: 1.4rem; font-weight: 300; line-height: 1.3; text-align: center; display: grid; place-items: center;}
.btn_mp a {color: #fff; text-decoration: none; border-radius: 4px; background: rgba(231,0,18,0.9);}





/* [03] 放送・配信
---------------------------------*/

/* [04] イントロダクション
---------------------------------*/

/* [05] あらすじ
---------------------------------*/
/*ul.list_story li:nth-child(1) {order: 2;}
ul.list_story li:nth-child(2) {order: 1;}*/


/* [06] 番宣
---------------------------------*/

/* [07] 出演者
---------------------------------*/
ul.sub_cast li p.cast_cap { min-height: 2.5em; }

/* [08] ロケ地紹介
---------------------------------*/

/* [09] MBCリンク
---------------------------------*/

/* [10] 連携先リンク
---------------------------------*/

/* [11] SNS
---------------------------------*/




}


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

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

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


/* 見出し */
h2 { /*width: 42%;*/ }
.gohan_top h3 { margin: 0 auto 10px; padding: 0; }


.header { display: flex; width: 96%; height: 50px; margin: 0 auto; justify-content: right; }
.gohan_top { position: relative; }
.gohan_top div.bg_nav {position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%;}
div.box_nav {width: 100%; position: sticky; display: flex; margin:0; padding: 0; top: 0; z-index: 999;}
div.bg_nav { margin: 0 auto; padding: 20px 0; border-radius: 4px;}
#fix_nav {position: inherit;}
.main {/*position: relative;*/}

.area_nav { display: none; }
.btn_sns { width: 50px; height: 50px; margin: 0 2% 0 0; background: rgba(255, 255, 255, 0.9); border-radius: 999px; /*display: grid; place-items: center;*/ }
/* 最新のsafari用*/
_::-webkit-full-page-media, _:future, :root .btn_sns { margin: 10px 2% 0 0; }
/* 古いsafari用*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
	::i-block-chrome, .btn_sns { margin: 10px 2% 0 0; }
}
.btn_sns a { display: inline-block; width: 50px; text-align: center; text-decoration: none; }
.btn_sns a img { width: 60%; max-width: 26px; vertical-align: middle; }


/*ナビ*/
/*div.box_nav {width: 100%; position: sticky; display: flex; padding: 0; top: 0; z-index: 999;}
div.bg_nav {width: 96%; max-width: 960px; margin: 0 2%; padding: 12px 2%; border-radius: 4px;}
#fix_nav {position: relative;}*/



/* [02] メインビジュアル
---------------------------------*/
.copy_kv img { width: 100%; filter: brightness(0) invert(1); }


/* [03] 放送・配信
---------------------------------*/
.img_schedule_sp { width: 100%; max-width: 460px; margin: 0 auto; padding: 20px 0; }
.img_schedule_sp img { width: 100%; }
ul.list_oa li a { padding: 4px 1%; }
ul.list_oa li img { max-width: 160px; }
/* 最新のsafari用*/
_::-webkit-full-page-media, _:future, :root ul.list_oa li a { padding: 4px 1% 10px; }
/* 古いsafari用*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
	::i-block-chrome, ul.list_oa li a { padding: 4px 1% 10px; }
}

ul.list_oa3 li a { padding: 4px 1%; }
ul.list_oa3 li img { max-width: 160px; }
/* 最新のsafari用*/
_::-webkit-full-page-media, _:future, :root ul.list_oa li a { padding: 4px 1% 10px; }
/* 古いsafari用*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
	::i-block-chrome, ul.list_oa3 li a { padding: 4px 1% 10px; }
}

ul.list_oa4 li a { padding: 4px 1%; }
ul.list_oa4 li img { max-width: 160px; }
/* 最新のsafari用*/
_::-webkit-full-page-media, _:future, :root ul.list_oa li a { padding: 4px 1% 10px; }
/* 古いsafari用*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
	::i-block-chrome, ul.list_oa4 li a { padding: 4px 1% 10px; }
}



/* [04] イントロダクション
---------------------------------*/
#box_intro .inr_box p.txt_stg { font-size: 1.25rem; }
#box_intro .inr_box p.txt { font-size: 0.875rem; }


/* [05] あらすじ
---------------------------------*/
#box_story .inr_box p.outline { width: 90%; font-size: 0.875rem; line-height: 1.6; }
ul.list_story li { width: 100%; margin: 10px 0 30px; }


/* [06] 番宣
---------------------------------*/

/* [07] 出演者
---------------------------------*/
/*出演者*/
ul.main_cast { width: 100%; }
ul.main_cast li { width: 94%; margin: 0 auto; }
ul.main_cast li p.cast_img img { width: 100%; margin: 0; }
#box_cast .inr_box p.comment { margin: 0; }

ul.sub_cast li { width: 94%; margin: 0 auto 1em; }
ul.sub_cast li p.cast_img { text-align: center; }
ul.sub_cast li p.cast_img img { width: 70%; }
ul.guest li { width: 100%; margin: 0 auto; }
ul.guest li ul li { width: calc(100% / 2 - 20px); margin: 0 10px .75em; }





/* [08] ロケ地紹介
---------------------------------*/
#box_location { background: url(/gohan2/images/bg_lct.jpg) no-repeat 50% 50% / cover; background-color: rgba(0,0,0,0.6); background-blend-mode: darken; }
#gohan_ko #box_location { background: url(/gohan2/ko/images/bg_lct.jpg) no-repeat 50% 50% / cover; background-color: rgba(0,0,0,0.6); background-blend-mode: darken; }


ul.list_location li { width: calc(100% / 3 - 20px); }

/*モーダル表示*/
.modal_content { align-self: center; width: 90%; margin: auto; padding: 50px 3% 15px; box-sizing: border-box; background: rgba(0, 0, 0, 0.7); line-height: 1.4em; transition: 0.5s; }
.modal_content .img_location { width: 100%; max-width: 320px; margin: 0 auto .2em; text-align: center; }
.close_button { position: absolute; top: 0px; right: 10px; font-size: 24px; cursor: pointer; color: #9fd8f5; }


/* [09] MBCリンク
---------------------------------*/
ul.bnr_mbc { width: 70%; margin: 0px auto; }


/* [10] 連携先リンク
---------------------------------*/
ul.list_link li { width: 46%; margin: 0 2% 40px; background: #fff; border-radius: 4px; }

/* [11] SNS
---------------------------------*/





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

	[99] メディアクエリ

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

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




/* [02] メインビジュアル
---------------------------------*/
.header { display: flex; width: 96%; max-width: 960px; height: 50px; margin: 0 auto; }
#kirie_top { position: relative; padding-bottom: 30px; }
#kirie_top div.bg_nav { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%; }
div.box_nav { width: 100%; position: sticky; display: flex; margin:0; padding: 0; top: 0; z-index: 999; }
div.bg_nav { margin: 0 auto; padding: 20px 0; border-radius: 4px; }
#fix_nav { position: inherit; }
.main { /*position: relative; margin-bottom: 100px;*/ }

.area_nav { display: flex; width: 100%; margin: 0; border-radius: 6px; background: rgba(0,0,0,0.8); }
.btn_sns { width: 50px; height: 50px; margin: 0 2% 0 0; background: rgba(0, 0, 0, 0.9); border-radius: 999px; /*display: grid; place-items: center;*/ }
.btn_sns a { display: inline-block; width: 50px; text-align: center; text-decoration: none; }
.btn_sns a img { width: 60%; max-width: 26px; vertical-align: middle; filter: brightness(0) invert(1); }
.btn_mp {width: 16%; max-width: 120px; margin: 0 1% 0 0; font-size: 1.4rem; font-weight: 300; line-height: 1.3; text-align: center; display: grid; place-items: center;}
.btn_mp a {color: #fff; text-decoration: none; border-radius: 4px; background: rgba(231,0,18,0.9);}


/* [03] 開催概要
---------------------------------*/

/* [04] チケット情報
---------------------------------*/

/* [05] お知らせ
---------------------------------*/

/* [06] グッズ
---------------------------------*/

/* [07] SNS
---------------------------------*/


}


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

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

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


/* 見出し */



.header { display: flex; width: 96%; height: 50px; margin: 0 auto; justify-content: right; }
#kirie_top { position: relative; }
#kirie_top div.bg_nav {position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%;}
div.box_nav {width: 100%; position: sticky; display: flex; margin:0; padding: 0; top: 0; z-index: 999;}
div.bg_nav { margin: 0 auto; padding: 20px 0; border-radius: 4px;}
#fix_nav {position: inherit;}
.main {/*position: relative;*/}

.area_nav { display: none; }
.btn_sns { width: 50px; height: 50px; margin: 0 2% 0 0; background: rgba(255, 255, 255, 0.9); border-radius: 999px; /*display: grid; place-items: center;*/ }
/* 最新のsafari用*/
_::-webkit-full-page-media, _:future, :root .btn_sns { margin: 10px 2% 0 0; }
/* 古いsafari用*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
	::i-block-chrome, .btn_sns { margin: 10px 2% 0 0; }
}
.btn_sns a { display: inline-block; width: 50px; text-align: center; text-decoration: none; }
.btn_sns a img { width: 60%; max-width: 26px; vertical-align: middle; filter: brightness(0) invert(1); }





/* [02] メインビジュアル
---------------------------------*/
#box_intro .inr_box p.txt_stg { width: 92%; font-size: 1.25rem; }
#box_intro .inr_box p.txt { width: 92%; font-size: 1.0rem; line-height: 1.7; }


/* [03] 開催概要
---------------------------------*/
/* テーブル */
.tb_res { width: 100%; margin: 0% auto; }
.tb_res { border: none; }
.tb_res th { display: block; width: 94%; margin: 3% 0 0; padding: 6px 3%; border: none; color: #000; border-radius: 4px; background: #fff; }
.tb_res td { display: list-item; width: 94%; margin: 0 3% ; padding: 6px 0; border: none !important; list-style: none; font-size: 1.0rem; line-height: 1.6; }

/* [04] チケット情報
---------------------------------*/
#box_window .flb { width: calc(96% - 0px); margin: 0 auto 30px; padding: 10px 0px 0; }
#box_window .flb > div { width: calc(100% / 2 - 20px); margin: 0 10px 20px; }

/* 相互割引 */
#box_discount .flb { width: calc(96% - 0px); margin: 0 auto; padding: 10px 0 0; }
#box_discount .flb > div { width: calc(100% / 1 - 20px); margin: 0 10px 20px; }
#box_discount p.tit_discount { font-size: 1.0rem; }


/* [05] お知らせ
---------------------------------*/
#box_news ul { width: 96%; }
#box_news li span.date { width: 100%; margin: 0; padding: 0; font-size: 1.0rem; line-height: 1.6; }
#box_news li span.title { width: 100%; margin: 0; padding: 0; font-size: 1.0rem; line-height: 1.6; }


/* [06] グッズ
---------------------------------*/

/* [07] SNS
---------------------------------*/


}


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

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

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

/* [03] 開催概要
---------------------------------*/

/* [04] チケット情報
---------------------------------*/
#box_window .flb { width: calc(96% - 20px); margin: 0 auto 30px; padding: 10px 10px 0; }
#box_window .flb > div { width: calc(100% / 1 - 20px); margin: 0 10px 30px; }

/* [05] お知らせ
---------------------------------*/

/* [06] グッズ
---------------------------------*/

/* [07] SNS
---------------------------------*/





}


