@charset "utf-8";
/* ----------------------------

File Name:  global_navi.css
Last Update:2018-06-22
グローバルメニュー用

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

/* グローバルnavi*/
nav{}

#global_menu_l{
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
	z-index: 10;
}

/* グローバルナビ大枠 */
.global_navi{
	width: 100%;
	min-width: 768px;
	height: 90px;
	box-sizing: border-box;
	background:#FFF;
	border-bottom: 5px solid #d5d5d5;
	color: #474747;
	padding: 0;
}

.global_navi ul.grand_menu {
   /*  position: relative; border: solid 1px #000;*/
	flex-direction: row;
	justify-content: center;
	width: 100%;
	max-width: 1280px;
	min-width: 768px;
    margin: 0 auto;
	padding: 0 30px;
	box-sizing: border-box;
}

.grand_menu > li {
    float: left;
    width: 8%; /* グローバルナビ10つの場合 */
	height: 90px;
	list-style: none;
	font-size: 11px;
	line-height: 0;
	text-align: center;
	padding: 0;
	background: url(https://www.hbc.co.jp/image/gmenu_li_back.png) right center no-repeat;
	box-sizing: border-box;
}
	
@media (max-width: 980px) {/* ナビ文字縮小 */
	.grand_menu > li > a {font-size: 8px;}
}


.grand_menu a:link,.grand_menu a
	{ color: #474747; text-decoration: none; }
.grand_menu a:visited
	{ color: #474747; text-decoration: none;}
.grand_menu a:hover
	{ color: #c70404; text-decoration: none; }
.grand_menu a:active
	{ color: #474747; text-decoration: underline;}
	
.grand_menu > li > a {
    display: block;
	padding: 50px 0 15px 0;
	line-height: 20px;
	font-weight: 900;
	font-family: '游ゴシック体', 'Yu Gothic', YuGothic, sans-serif;
}

.grand_menu > li a:hover {
	border-bottom: 5px solid #c70404;
}

/* HBCロゴ部分 */
.grand_menu > li:first-child {
    width: 28%; 
}	
.grand_menu > li:first-child > a {
	width: 170px;
	margin: 20px 0;
	padding: 25px 0;
}
.grand_menu > li:first-child > a:hover {
	border-bottom: none;
}

@media (max-width: 1280px) {
.grand_menu > li:first-child > a {
	width: 170px;
	margin: 20px 0;
	padding: 25px 0;
}
}

@media (max-width: 1024px) {/* ナビ文字縮小 */
.global_navi ul.grand_menu {padding: 0;}

.grand_menu > li {
    float: left;
    width: 9%; /* グローバルナビ10つの場合 */}
		
.grand_menu > li:first-child {
    width: 19%; }	

.grand_menu > li:first-child > a {
	width: 80%;
	margin: 20px 0 20px 20px;
	padding: 25px 0;
}
}
	
/*アイコン指定*/
.gmenu_hbctop{/*HBCロゴ部分*/
	background:url(https://www.hbc.co.jp/image/g_menu_hbc_logo.svg) no-repeat center left ;
	background-size:100%;}
.gmenu_hbctop span {display: none;}
#global_menu h1 { /*HBCロゴのレイアウト崩れ防止 */
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}

/*grand menuボタン基本*/
.gmenu_tv ,
.gmenu_radio ,
.gmenu_ana ,
.gmenu_news ,
.gmenu_weather ,
.gmenu_movie ,
.gmenu_event ,
.gmenu_shop ,
.gmenu_fromHBC {
	background-repeat: no-repeat;
	background-position: center top 25px;
	background-size: 24px;}
	
@media (max-width: 960px) {/* ナビ文字縮小 */
.gmenu_tv ,
.gmenu_radio ,
.gmenu_ana ,
.gmenu_news ,
.gmenu_weather ,
.gmenu_movie ,
.gmenu_event ,
.gmenu_shop ,
.gmenu_fromHBC {
	background-repeat: no-repeat;
	background-position: center top 20px;
	background-size: 28px 28px;}
}

.gmenu_tv{background-image:url(https://www.hbc.co.jp/image/g_menu_tv.svg);}
.gmenu_tv:hover{background-image:url(https://www.hbc.co.jp/image/g_menu_tv_h.svg);}

.gmenu_radio{background-image:url(https://www.hbc.co.jp/image/g_menu_radio.svg);}
.gmenu_radio:hover{background-image:url(https://www.hbc.co.jp/image/g_menu_radio_h.svg);}
	
.gmenu_ana{background-image:url(https://www.hbc.co.jp/image/g_menu_ana.svg);}
.gmenu_ana:hover{background-image:url(https://www.hbc.co.jp/image/g_menu_ana_h.svg);}
	
.gmenu_news{background-image:url(https://www.hbc.co.jp/image/g_menu_news.svg);}
.gmenu_news:hover{background-image:url(https://www.hbc.co.jp/image/g_menu_news_h.svg);}
	
.gmenu_weather{background-image:url(https://www.hbc.co.jp/image/g_menu_weather.svg);}
.gmenu_weather:hover{background-image:url(https://www.hbc.co.jp/image/g_menu_weather_h.svg);}
	
.gmenu_movie{background-image:url(https://www.hbc.co.jp/image/g_menu_movie.svg);}
.gmenu_movie:hover{background-image:url(https://www.hbc.co.jp/image/g_menu_movie_h.svg);}

.gmenu_event{background-image:url(https://www.hbc.co.jp/image/g_menu_event.svg);}
.gmenu_event:hover{background-image:url(https://www.hbc.co.jp/image/g_menu_event_h.svg);}
	
.gmenu_shop{background-image:url(https://www.hbc.co.jp/image/g_menu_shop.svg);}
.gmenu_shop:hover{background-image:url(https://www.hbc.co.jp/image/g_menu_shop_h.svg);}
	
.gmenu_fromHBC{background-image:url(https://www.hbc.co.jp/image/g_menu_fromHBC.svg);}
.gmenu_fromHBC:hover{background-image:url(https://www.hbc.co.jp/image/g_menu_fromHBC_h.svg);}


/*メガメニュー下敷き*/

li.grand_menu__mega ul.grand_menu_popup {
	display: flex;
	flex-direction: row;
	justify-content: center;
    position: absolute;
    top: 90px;
    left: 0;
    width: 100%;
	min-width: 768px;
    padding: 0 2%;
    background: #dedede;
	list-style: none;
	box-sizing: border-box;
}

ul.grand_menu_popup {
    visibility: hidden;
    opacity: 0;
    z-index: 10;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}

.grand_menu_popup li {/*border: 1px solid #c70404;*/
	margin: 0;
    padding: 0;
	line-height: 1.6;
	font-size: 12px;
}

.grand_menu_popup li a:hover {
	border: none;
}
	
li.grand_menu__mega:hover ul.grand_menu_popup {
    top: 90px;
    visibility: visible;
    opacity: 1;
	text-align: left;
}

/*メニューボックス（4列）*/
li.grand_menu__mega ul.grand_menu_popup > li {
    width: 25%;
	max-width: 305px;
	margin: 20px 0;
	padding: 10px;
	box-sizing: border-box;
    border-right: 1px solid #d1d1d1;
}

/*メニューボックス連結用*/

/*連結開始*/
li.grand_menu__mega ul.grand_menu_popup > li.joint_box1 {
	padding-right: 0px;
    border-right: none;
}
/*連結途中*/
li.grand_menu__mega ul.grand_menu_popup > li.joint_box2 {
	padding-left:0px;
	padding-right: 0px;
	border-right: none;
}
/*連結終了*/
li.grand_menu__mega ul.grand_menu_popup > li.joint_box3 {
	padding-left:0px;
}

li.grand_menu__mega ul.grand_menu_popup > li:first-child {
    border-left:1px solid #d1d1d1;
}
	
/*番組項目*/
.grand_menu__list{
	margin: 0px;
	}

ul .grand_menu__list {
	box-sizing: border-box;
	height: 100%;
	margin: 0;
	padding: 0;
	}

.grand_menu__list li {
	list-style: none;
	margin: 10px 0;
	padding: 0;
	}
	
.grand_menu__list li > a{
	position: relative;
	display: block;
	padding: 0 0 0 15px;
	}
	
.grand_menu__list li > a:before{
	position: absolute;
    content: "・";
	left: 0;
	}
	
.grand_menu__list_t {/*曜日項目*/
	border-bottom: 2px solid #6c6c6c;
	font-weight: bold;
	}
	
/* 連結用・スタイル打消し */		

.grand_menu:before,
.grand_menu:after {
    content: " ";
    display: table;
}

.grand_menu:after {
    clear: both;
}

.grand_menu {
    *zoom: 1;
}