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

/*
 * テンプレートのタブレット用デフォルト CSS
 * タブレット用にスタイルを追加したい場合は
 * TB_user.css を編集して下さい。
 */


/* 変数 */
:root {
	--headerHeight: 118px;
	--headersetGapB: 15px;
	--gnaviHeight: 3.5em;
}


/* 共通マージン下 */
.common_mb_S {
    margin-bottom: 30px;
}
.common_mb_M {
    margin-bottom: 80px;
}
.common_mb_L {
    margin-bottom: 120px;
}


/* センター寄せ */
.TB_center {
  text-align: center;
}

/* ボタンセット */
.btnSet {
	flex-direction: row;
	flex-wrap: wrap;
}

/* 簡易ボタン */
.btnSet .btnStd {
	width: auto;
}


/* ヘッダー */
#HEADRCONTENTS .title {
	position: absolute;
	top: 3px;
	font-size: 0.5em;
}
#HEAD {
	width: auto;
	padding-top: 0;
	align-items: flex-end;
}
#HDLOGO {
	height: var(--logoHeight);
	margin-bottom: var(--headersetGapB);
}
#HDBTN {
	position: absolute;
	top: 15px;
	right: 0;
	padding: 0;
	z-index: 200;
}
#HDBTN .hdbtnItem {
	height: 30px;
	display: flex;
	gap: 0.5em;
	align-items: center;
}


/* グローバルナビゲーション共通 */
#GNAVI {
  height: var(--gnaviHeight);
	display: block;
  position: relative;
  margin: 0 0 0 auto;
  z-index: 100;
	font-size: 1.1em;
}
#GNAVI :is(ul, li, li a, li img) {
  margin: 0;
  padding: 0;
}
#GNAVI ul {
  list-style: outside none none;
}
#GNAVI a {
	color: currentColor;
}
#GNAVI a:hover {
	text-decoration: none;
}
#GNAVI img {
  display: block;
}
/* .gNavi 以外非表示 */
#GNAVI .gnaviContents > li {
  display: none;
}
#GNAVI .gnaviContents > .gNavi {
	display: block;
}


/* GNAVICONTENTS01 */
#GNAVICONTENTS01 {
  text-align: right;
  margin: 0 auto;
  padding: 0;
  height: 100%;
}
#GNAVICONTENTS01 li {
  flex-grow: 1;
	position: relative;
}
/* カテゴリ */
#GNAVICONTENTS01 .gnaviContents {
  display: inline-flex;
  height: 100%;
  gap: 0;
}
#GNAVICONTENTS01 a {
	position: relative;
}
#GNAVICONTENTS01 a:hover {
	text-decoration: none;
}
#GNAVICONTENTS01 a:hover:before,
#GNAVICONTENTS01 .gNavi.sub-open > a:before { 
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: var(--naviBgColorHover);
	z-index: -1;
}
#GNAVICONTENTS01 .gNavi > a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
  padding: 0 1em;
  text-align: center;
}
#GNAVICONTENTS01 .gNavi > a:hover {
  color: var(--naviTxtColorHover);
}
/* プルダウン */
#GNAVICONTENTS01 .sub-menu {
	display: none;
	position: absolute;
	flex-direction: column;
	z-index: 0;
	font-size: 0.8em;
}
#GNAVICONTENTS01 .sub-menu li {
  width: 100%;
  padding: 0;
	background-color: #fdfdfd;
}
#GNAVICONTENTS01 .sub-menu a {
  display: block;
  width: 100%;
  padding: 1em;
  white-space: nowrap;
  color: #333;
  text-align: left;
  border-bottom: 1px solid #dfdfdf;
	z-index: 0;
}
#GNAVICONTENTS01 .sub-menu a:hover {
  color: var(--naviTxtColorHover);
}
#GNAVICONTENTS01 .sub-open > .sub-menu {
	display: flex;
}

/* プルダウン配置右基準 */
#GNAVICONTENTS01.subRefR .sub-menu {
	right: 0;
}
/* プルダウン配置中央基準 */
#GNAVICONTENTS01.subRefC .sub-menu {
	right: -50%;
	left: -50%;
}
#GNAVICONTENTS01.subRefC .sub-menu li {
  width: 100%;
}
#GNAVICONTENTS01.subRefC .sub-menu a {
	text-align: center;
	white-space: pre-wrap;
}

/* 区切り線 */
#GNAVICONTENTS01.devideLine .gnaviContents > li {
	position: relative;
}
#GNAVICONTENTS01.devideLine .gnaviContents > li:not(:last-child):after {
	position: absolute;
	display: inline;
	content: '';
	border-right: 1px solid #c1c1c1;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	z-index: 1;
}



/* ページトップへ戻る */
#backtopPosiBox .backtopBtn {
	width: 40px;
	height: 40px;
	padding: 5px;
}