@charset "UTF-8";
/**
 * グローバルナビ NEWバッジ
 *
 * 既存のナビCSSは一切書き換えず、このファイルの追加だけで成立させている。
 *
 * ・801px以上（PC）では li が position:relative ／ 幅200px固定 ／ overflow:visible。
 *   そこへ position:absolute で重ねるので、バッジが出ても出なくても
 *   ナビのレイアウトは1pxも動かない。
 *
 * ・800px以下（スマホ）は既定の display:none のままにして表示しない。
 *   800px以下では li が position:relative になっておらず（static）、
 *   同じ方法では重ねられないため。スマホはメニューを開かないと
 *   ナビ自体が見えないので、効果も薄い。
 *
 * @since 2026-09-12
 */

/* 既定は非表示。PC幅のときだけ下で表示に切り替える */
.nav-menu li .nav-badge {
	display: none;
}

@media screen and (min-width: 801px) {

	.nav-menu li.has-new .nav-badge {
		display: block;
		position: absolute;
		top: 6px;
		left: 50%;
		margin: 0 0 0 34px;
		padding: 3px 5px;
		background: #d0342c;
		border-radius: 3px;
		color: #fff;
		font-family: inherit;
		font-size: 10px;
		font-style: normal;
		font-weight: 700;
		line-height: 1;
		letter-spacing: .04em;
		white-space: nowrap;
		text-align: center;
		text-indent: 0;
		vertical-align: baseline;

		/* リンクのクリックを邪魔しない */
		pointer-events: none;
		z-index: 2;
	}
}