@charset "UTF-8";

/* 全体調整 */
* {
	box-sizing: border-box;
}

body {
	padding: 0;
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	box-sizing: border-box;
}

.sp-only { display: inline; }
.pc-only { display: none; }

/* ヘッダー構成 */
/*==============================================*/
.Header {/* border: 1px solid red; */
	width:100%;
	height:60px;
}

.title {/* border: 2px solid orange; */
	width: 100%;
	height: 60px;
	overflow: hidden;
}

/* ロゴ */
.logo {
	height: 70px;
	float: none;
	background-size: 200px auto;
	background-position: 0 0;
}

.logo img {/* border: 1px solid red; */
	width: 270px;
	height: auto;
	margin: 13px 0px 0px 8px;
}

/* ハンバーガーボタン */
/*==============================================*/
.hamburger {
	display: block;
	position: fixed;
	top: 12px;
	right: 12px;
	width: 36px;
	height: 36px;
	padding: 0 5px 0 5px;
	background: #fff;
	cursor: pointer;
	z-index: 10001;
}

.hamburger span {
	display: block;
	height: 4px;
	background: #333;
	margin: 6px 0;
}

/* ハンバーガーメニュー本体 */
#hamburger-menu {
	position: fixed;
	top: 0;
	right: -80%;
	width: 80%;
	height: 100%;
	background: #fff;
	z-index: 9999;
	transition: right 0.3s ease;
	box-shadow: -2px 0 5px rgba(0,0,0,0.2);
	overflow-y: auto;
}

#hamburger-menu.open {
	right: 0;
}

/* ハンバーガー開閉時のアニメーション */
.hamburger.open span:nth-child(1) {
	transform: rotate(45deg) translate(7px, 7px);
}

.hamburger.open span:nth-child(2) {
	opacity: 0;
}

.hamburger.open span:nth-child(3) {
	transform: rotate(-45deg) translate(7px, -7px);
}

.hamburger span {
	transition: all 0.3s ease;
}

/* メニュー内部 */
.menu-inner {
	padding: 20px;
	min-height: 100%;
	height: auto;
	background: #212B5B;
}

.menu-text {/* border: solid 1px #ccc; */
	width: 80%;
	margin-bottom: 14px;
	font-size: 14px;
	color: #fff;
	line-height: 1.6;
}

.menu-nav,
.menu-submenu {
	list-style: none;
	padding: 0;
	margin: 0 0 20px 0;
}

.menu-nav li,
.menu-submenu li {
	width: 100%
	margin: 0;
	padding: 8px 8px 8px 8px;
	font-size: 16px;
	color: #fff;
	border-bottom: solid 1px #fff;
}

.menu-nav a,
.menu-submenu a {
	display: block;
	font-size: 16px;
	text-decoration: none;
	color: #fff;
}

/* サブメニュー折りたたみ */
.has-sub .submenu-list {
	list-style: none;
	padding-left: 0;
	margin: 0;
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition: max-height 0.4s ease, opacity 0.4s ease;
}

.has-sub.open .submenu-list {/* border: solid 1px #ccc; */
	display: block;
	margin: 0 0 6px 0;
	padding-left: 0;
	list-style: none;
	max-height: 500px;
	opacity: 1;
}

.has-sub .submenu-list li a {/* border: solid 1px #ccc; */
	color: #999;
}

.has-sub.open .submenu-list li a {/* border: solid 1px #ccc; */
	color: #999;
}

.has-sub .submenu-list li {/* border: solid 1px #ccc; */
	display: block;
	margin: 8px 0 0 0;
	padding: 3px 8px 8px 12px;
	list-style: none;
	color: #999;
	border-left: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
	border-radius: 0 0 0 8px;
}

.has-sub.open .submenu-list li {/* border: solid 1px #ccc; */
	display: block;
	margin: 8px 0 0 0;
	padding: 3px 8px 8px 12px;
	list-style: none;
	color: #999;
	border-left: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
	border-radius: 0 0 0 8px;
}

.toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	color: #fff;
}

.toggle-icon {
	width: 18px;
	height: 18px;
	margin-left: 0;
	transition: transform 0.4s ease;
}

/* 開いたときはアイコンを回転させて ▲ に見せる */
.has-sub.open .toggle-icon {
	transform: rotate(180deg);
}



/* スマホでは非表示 */
.Header .submenu ,.Header .text {
	display: none;
}

#global-nav {
	display: none;
}

#hamburger-menu {
	display: block;
}

.hamburger {
	display: block;
}

/*===============================================================*/
/* ヘッダー ここまで*/


/* ボディー　　　border: solid 1px #cccccc;　　　*/
/*===============================================================*/
.Contents {/* border: 1px solid red; */
	overflow: auto;
	width: 100%;
	margin: 0;
	padding: 0;
}

/* ======================================
　　スライダー画像
 ======================================= */
.mainimage {/* border: 2px solid blue; */
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9; /* 高さを比率で自動計算 */
	position: relative;
	overflow: hidden;
}

.slidebox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	animation: slideshow 24s linear infinite;
}

.slidebox img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	object-position: 75% 100%;
}

/* キャプション */
.overlaytxt {
	position: absolute;
	display: flex;
	flex-wrap: wrap;
	gap: 2px;
	z-index: 10;
	white-space: nowrap;
}

.nikoniko {
	display: inline-block;
	width: 20px;	/* 横幅 */
	height: 20px;	/* 高さ */
	filter: drop-shadow(1px 1px 3px rgba(0,0,0,1)); /* 影 */
	filter: drop-shadow(1px 1px 3px rgba(0,0,0,1)); /* 影 */
}

.overlaytxt span {
	width: 28px;
	height: 28px;
	margin: 0;
	padding: 0 0 0 0;
	font-size: 20px;
	line-height: 1.0;
	border: 1px solid #fff;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.6);
	box-shadow: 
		1px 1px 4px rgba(0,0,0,0.5),
		inset 1px 1px 4px rgba(0,0,0,0.5);
}

/* キャプション位置 */
.left-top { top: 10px; left: 10px; }
.left-bottom { bottom: 10px; left: 10px; }
.right-bottom { bottom: 10px; right: 10px; }
.left-bottomup { bottom: 44px; left: 10px; }

/* ======================================
　　各ページ タイトル
 ======================================= */
/* キャプション 囲み */
.pagetitle {
	position: absolute;
	display: flex;
	flex-wrap: wrap;
	gap: 2px;
	z-index: 10;
	white-space: nowrap;
}

/* キャプション 文字 */
.pagetitle span {
	width: 28px;
	height: 28px;
	margin: 0;
	padding: 0 0 0 0;
	font-size: 20px;
	line-height: 1.0;
	border: 1px solid #fff;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.6);
	box-shadow: 
		1px 1px 4px rgba(0,0,0,0.5),
		inset 1px 1px 4px rgba(0,0,0,0.5);
}

/* キャプション 位置指定 */
.pt_left-top { top: 10px; left: 10px; }
.pt_left-bottom { bottom: 18px; left: 10px; }
.pt_right-top { top: 10px; right: 10px; }
.pt_right-bottom { bottom: 18px; right: 10px; }

/* ======================================
　　左ブロック   border: 1px solid red;
 ======================================= */
.inner_left {
	float: none;
	width: 100%;
	margin: 10px 0 30px 0;
	padding: 0;
	border: none;
	box-shadow: none;
	clear: both;
}

/* ======================================
　　各ページ 囲み
 ======================================= */
.pagemain {/* border: 1px solid red; */
	margin: 0 5px;
}
.pagemain h1 {
	margin: 0;
	padding: 0 0 3px 6px;
	font-size:22px;
	font-weight:bold;
	color: #44A5FF;
	border-bottom:5px solid #44A5FF;
}

.paimg img {
	width: 100%;
	height: 25vw;
	object-fit: cover;
	object-position: center;
}

/* ======================================
　　トップ 最新情報
 ======================================= */
.newinfo {

}

h1 {
	font-size: 24px;
}

.newinfo ul {
	margin: 0px;
	padding: 0px;
}

.newinfo {/* border: 1px solid red; */
	margin: 0 5px;
}

.newinfo ul li a{
	display: block;
	padding: 5px 5px 5px 5px;
	color: #333;
	text-decoration: none;
	transition:all 0.5s ease;
}

/* ======================================
　　入会案内
 ======================================= */
/* 左 ボックス マージン */
.inner_left .box.ft-l {
	float:none;
	margin: 20px 20px 20px 20px;
}

/* 右 ボックス マージン */
.inner_left .box.ft-r {
	float:none;
	margin: 0px 20px 30px 20px;
}

/* ボックス */
.inner_left .box {
	width: calc(100% - 40px);
}

/* 見出し */
.inner_left .box h3 {
	width: 100%;
	padding: 4px 0;
}

.inner_left .box .inner {/* border: 1px solid blue; */
	padding: 3px 8px 8px 8px;
}

/* ======================================
　　TGRAとは
 ======================================= */
/* 理事長挨拶 */
.message {/* border: 1px solid #999; */
	margin: 5px 0 20px 0;
	padding: 0 5px 0 5px;
}

/* 理事長画像 */
.message img {
	width: 140px;
	margin: 0 0 5px 10px;
}

/* table共通 */
.history, .yakuinlist, .overview {/* border: 1px solid #CCC; */
	margin: 5px 0 20px 0px;
	padding: 0 5px 0 5px;
}

/* 沿革 */
.history table {
	width: 100%
	border-collapse:collapse;
	border: 1px solid #CCC;
}

.history table th {
	padding: 4px 10px 5px 10px;
}

.history table td {
	padding: 4px 10px 5px 10px;
}

.history table td.yy {
	width: 26%;
}

.history table td.mm {
	width: 20%;
	white-space: nowrap;
}

/* 役員 */
.yakuinlist {
	width: 100%;
}

.yakuinlist .twrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.yakuinlist table {
	width: auto;
	min-width: 400px;
}

.yakuinlist table th {
	padding: 4px 10px 5px 10px;
}

.yakuinlist table td {
	padding: 4px 10px 5px 10px;
	white-space: nowrap;
}

/* 組織概要 */
.overview table td.tit {
	width: 21%;
	white-space: nowrap;
}

.overview table td {
	padding: 4px 10px 5px 10px;
}

.overview table td ol {
	line-height: 1.4;
}

.overview table td ol li {/* border: 1px solid #CCC; */
	margin-bottom: 5px;
	padding-left: 0.3em;
}

/* ======================================
　　インフォ
 ======================================= */
/* 囲み */
.pagemain .info {
	margin: 5px 0 20px 0;
	padding: 0 5px 0 5px;
}

/* h1 見出し */
h1.infotitle {
	margin-top: -5px;
	padding: 0 5px 0 5px;
	line-height:1.4;
}

/* 小見出し */
.pagemain .info .ft-b.f20 {
	margin: 0 0 10px 0;
	font-size: 18px
}

/* 共通スタイル */
.img-fr,
.img-fl {/* border: 1px solid red; */
	width: 100%;
	float: none;
	margin: 0 0 0.5em 0;
}

.img-fr img,
.img-fl img {
	width: 100%;
}

/* 幅指定バリエーション */
.img-fr.img-250 {
	float: right;
	width: 130px;
	margin: 0 0 0.3em 0.8em;
}

.img-250 img { width: 100%; }

[class^="img-flex-"] {
	margin-bottom: 5px;
	gap: 5px;
}

/* テーブル 日程表 */
.info .gaiyo {/* border: solid 1px red; */
	width:100%;
}

.info .komoku {
	width: 20%;
	padding: 0 20px 0px 0;
}

.info .naiyo {
	padding: 0px 0px 10px 0px;
	width: 80%;
	font-weight:bold;
	vertical-align:top;
}

/* テーブル 比較表 */
.info .hikaku-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.info .hikaku {
	min-width: 600px;
}

.info .hikaku td {
	padding: 5px 8px;
}

/* ======================================
　　行事日程
 ======================================= */
/* 囲み */
.pagemain .schedule {
	margin: 5px 0 20px 0;
	padding: 0 5px 0 5px;
}

.schedule {
	width: 100%;
}

.schedule .twrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.schedule table {
	width: auto;
	min-width: 400px;
}

.schedule table th {
	padding: 4px 10px 5px 10px;
}

.schedule table td {
	padding: 4px 10px 5px 10px;
	white-space: nowrap;
}

/* ======================================
　　加盟練習場
 ======================================= */
/* 各項共通 */
.pagemain .rangemember,
.pagemain .rangejoin {/* border: 1px solid #CCC; */
	margin: 5px 0 20px 0px;
	padding: 0 5px 0 5px;
}

/* リスト テーブル */
.rangemember {
	width: 100%;
}

.rangemember .twrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.rangemember table {
	width: auto;
	min-width: 600px;
}

.rangemember table td {
	padding: 0px;
	white-space: nowrap;
}

.rangemember table span.ken {
	width: auto;
	padding: 3px 5px 5px 5px;
	font-size: 16px;
	line-height: 1.1;
	white-space: normal;
	border-radius: 3px;
}

.note {
	text-indent: -1em;
	padding-left: 1em;
}

/* ======================================
　　プロ研修会
 ======================================= */
/* 各項共通 */
.pagemain .proassemblylist, 
.pagemain .proassemblyevent, 
.pagemain .proassemblyjoin, 
.pagemain .proassemblygaiyo {/* border: 2px solid red; */
	margin: 5px 0 20px 0px;
	padding: 0 5px 0 5px;
}

/* リスト テーブル */
.proassemblylist {
	width: 100%;
}

.proassemblylist .twrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.proassemblylist table {
	table-layout: auto;
	width: auto;
}

.proassemblylist table th {
	white-space: nowrap;
	padding: 4px 10px 5px 10px;
}

.proassemblylist table td {
	white-space: nowrap;
	padding: 4px 10px 5px 10px;
}

/* 行事日程 */
/* 成績リンク */
.proassemblyevent p {
	font-size: 15px;
	float: none;
	padding: 0 8px;
	border-radius: 4px;
	color: #fff;
	display: inline-block;
	white-space: nowrap;
}

.proassemblyevent p a {
	display: inline-block;
	font-size: 16px;
	padding: 0px 10px 2px 10px;
}

.proassemblyevent .twrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

/* 行事日程 テーブル */
.proassemblyevent table {
	table-layout: auto;
	width: auto;
}

.proassemblyevent table th {
	white-space: nowrap;
	padding: 4px 10px 5px 10px;
}

.proassemblyevent table td {
	white-space: nowrap;
	padding: 4px 10px 5px 10px;
}

.proassemblyevent td a {
	padding: 4px 10px 5px 10px;
}

/* 概要 */
.proassemblygaiyo table td.col1 {
	width: auto;
	white-space: nowrap;
	padding: 4px 7px 5px 7px;
}

.proassemblygaiyo table td.col2 {
	padding: 4px 7px 5px 7px;
	width: auto;
}

.proassemblygaiyo table td table {/* border: 1px solid red; */
	width: 100%;
}

.proassemblygaiyo table td table td.icol1 {
	padding: 0px 7px 0px 0px;
	width: 50%;
}

.proassemblygaiyo table td table td.icol2 {
	width: 50%;
}

/* ======================================
　　ジュニア
 ======================================= */
.pagemain .xxxx {/* border: 1px solid #CCC; */
	margin: 5px 0 20px 0px;
	padding: 0 5px 0 5px;
}

/* ======================================
　　その他表示
 ======================================= */
.pagemain .sonota {/* border: 1px solid #CCC; */
	margin: 5px 0 20px 0px;
	padding: 0 5px 0 5px;
}

/* ======================================
　　右ブロック
 ======================================= */
.inner_right {/* border: 2px solid red; */
	float: none;
	width: 100%;
	margin: 5px 0 0 0;
	padding: 0;
	clear: both;
}

.sidebar {/* border: 1px solid blue; */
	float: none;
	width: calc(100% - 20px);
	margin: 0px 10px 0px 10px;
	padding: 0px;
}


/* 右ブロックナビ（非表示） */
.sidemenu01,
.sidemenu02,
.sidemenu03,
.pastyears,
.nav {
	display: none;
}


/* ======================================
　　サイトマップ
 ======================================= */
.pagemain .sitemap {/* border: 1px solid #CCC; */
	margin: 5px 0 20px 0px;
	padding: 0 5px 0 5px;
}

.pagemain .sitemap1 {
	width: 100%;
	float: none;
}

.pagemain .sitemap2 {
	margin: 20px 0 0 0;
	width: 100%;
	float: none;
}

/* ======================================
　　プライバシー
 ======================================= */
.pagemain .privacy {/* border: 1px solid #CCC; */
	margin: 5px 0 20px 0px;
	padding: 0 5px 0 5px;
}

.pagemain .privacy h2 { 
	margin: 5px 0 0 0;
}

.pagemain .privacy p { 
	margin: 5px 0 0 0;
}

/* ======================================
　　お問合せ
 ======================================= */
.pagemain .contact {/* border: 1px solid #CCC; */
	margin: 5px 0 20px 0px;
	padding: 0 5px 0 5px;
}

.pagemain .contact table th {/* border: 1px solid red; */
	display: block;
	width: 100%;
	padding: 8px 7px 3px 7px;
	border-bottom: none;
}

.pagemain .contact table td {/* border: 1px solid red; */
	display: block;
	width: 100%;
	padding: 4px 7px 8px 7px;
	border-bottom: 1px solid #CCC;
}

/* ======================================
　　ページトップ
 ======================================= */
#page-top {
	bottom: 10px;
	right: 10px;
}

#page-top a {
	width: 42px;
	height: 42px;
}

#page-top img{
	width: 30px;
	height: auto;
}

.grad-item {
	height: 248px;
}

/*===============================================================*/
/*ボディー*/

/*フッター　　　border: solid 1px #cccccc;　　　*/
/*===============================================================*/
/* 囲み */
.Footer .inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	margin: 0px 0px 0px 0px;
	padding: 16px;
	text-align: center;
}

/* マーク ロゴ */
.mark-w {
	width:150px;
	height;:auto;
	padding: 0px 0px 0px 0px;
}

.logo-jp-w {/* border: solid 1px #999; */
	width:90%;
	height;:auto;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

.Footer .blockname {
	display: inline-block;
	margin: -5px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	font-size: 15px;
}

.Footer .add {/* border: solid 1px yellow; */
	width:90%;
	margin: 0px auto 0px;
	padding: 0px 0px 0px 6px;
	font-size: 13px;
	text-align: left;
}

.Footer .add a {
	display: inline-block;
	width: 100%;
	margin: 5px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	text-align: left;
}

.add > span {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.Footer .add span {/* border: solid 1px blue; */
	font-size: 20px;
}

/* マップアイコン */
.Footer .add a img {
	top: 2px;
	width: 30px;
	height: 30px;
	margin-left: -6px;
}

/* TEL FAX */
.Footer .add p {
	display: inline-block;
	margin: 2px 0 0 24px;
}

.Footer .ft1,
.Footer .ft2,
.Footer .ft3 {
	width: 100%;
	margin: 0px 0px 20px 0px;
	padding: 0px 0px 0px 0px;
	
}

.Footer .ft2,
.Footer .ft3 {
	text-align: left;	
}

.copyright {
	width: 100%;
}

.Footer .ft2 > ul {
	display: grid;
	grid-template-columns: auto auto;
	column-gap: 2em;
}

.Footer .ft2 > ul > li:nth-of-type(1) { grid-column: 1; grid-row: 1; }
.Footer .ft2 > ul > li:nth-of-type(2) { grid-column: 1; grid-row: 2; }
.Footer .ft2 > ul > li:nth-of-type(3) { grid-column: 1; grid-row: 3; }
.Footer .ft2 > ul > li:nth-of-type(4) { grid-column: 1; grid-row: 4; }

.Footer .ft2 > ul > li:nth-of-type(5) { grid-column: 2; grid-row: 1; }
.Footer .ft2 > ul > li:nth-of-type(6) { grid-column: 2; grid-row: 2; }



/*===============================================================*/
/*フッター*/