﻿@charset "UTF-8";

/* サイト全体に box-sizing を適用 */
*, *::before, *::after {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

/* 全体レイアウト調整 */
html, body {
	width: 100%;
	margin: 0;
	padding: 0;
}

body {
	min-width: auto;
	font-size: 15px;
}


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


/*ヘッダー　　　border: solid 1px #cccccc;　　　*/
/*===============================================================*/
/* PC用ヘッダーは非表示 */
.Header {
	display: none !important;
}

/* スマホ用ヘッダー */
.spHeader {/* border: solid 2px green; */
	position: relative;
	width: 100%;
	background: #fff;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 0px;
	z-index: 10;
}

/* 上段：英ロゴ＋電話・メール */
.spHeader .header-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

/* 英ロゴ */
.spHeader .logo-e {/* border: solid 1px blue; */
	float: none;
	display: block;
	height: 43px;
	margin: 10px 0 0 10px;
}

/* 電話・メールアイコン */
.spHeader .header-icons {/* border: solid 1px blue; */
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 9px 64px 0 0;

}

/* 電話・メールアイコン */
.spHeader .icon {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: #a61955;	/* アイコン背景色 */
	display: flex;
	align-items: center;
	justify-content: center;

}

.spHeader .icon img {
	width: 26px;
	height: 26px;
}

/* header下の追加テキスト */
.header-bottom {/* border: solid 1px red; */
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 7px;
	width: 100%;
	line-height: 1.1;
	margin: 8px 0 0 0;
	padding: 6px 2px;
	background: -moz-linear-gradient(left, #eeeeee, #fff);
	background: -webkit-linear-gradient(left, #eeeeee, #fff);
	background: linear-gradient(to right, #eeeeee, #fff);
	box-shadow: 0 4px 7px -3px rgba(0,0,0,0.3);
}

.header-bottom span {
	font-size: 12px;
	font-weight: bold;
	color: #333;
	letter-spacing: -0.4px;
	line-height: 1.2;
}

.header-bottom img {
	height: 24px;
	vertical-align: middle;
	display: inline-block;
}

/* ハンバーガー（ヘッダー外・右上固定） */
.hamburger {
	position: fixed;
	top: 11px;
	right: 12px;
	width: 40px;
	height: 40px;
	border-radius: 10px;	/* 角丸四角 */
	background: #00712c;	/* 緑の背景 */
	cursor: pointer;
	z-index: 999;		/* ヘッダーより前面に */
	gap: 4px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

/* ハンバーガー線 */
.hamburger span {
	display: block;
	width: 24px;
	height: 3px;
	background: #fff;	/* 白抜きライン */
	margin: 0px;
	border-radius: 2px;
	transition: all 0.4s ease;
}

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

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

.hamburger.active span:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

/* ナビ 囲み */
/* 初期状態：画面右外に隠す */
#global-nav {
	position: fixed;
	top: 0;
	right: -60vw;		/* 幅分右に隠す */
	width: 60vw;		/* ナビ幅 */
	height: 100%;
	background: #00cc00;	/* ナビ背景 */
	box-shadow: -2px 0 8px rgba(0,0,0,0.2);
	transition: right 0.3s ease;
	z-index: 998;		/* ハンバーガー(999)より下 */
	overflow-y: auto;
	padding-top: 60px;	/* ハンバーガー固定分の余白 */
	box-sizing: border-box;
	overflow-x: hidden;
	border-bottom: none;
}

/* 開いた状態 */
#global-nav.open {
	right: 0;		/* 右端にスライド */
}

/* メニューリスト */
#global-nav ul.dropmenu {
	list-style: none;
	padding: 0;
	margin: 0;
}

/* 各項目 li */
#global-nav ul.dropmenu li {
	width: 100%;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid #00a300;
}

/* リンク a */
#global-nav ul.dropmenu li a {
	display: flex;		/* アイコン＋文字を横並び */
	align-items: center;
	padding: 30px 20px;	/* 縦16px, 横20px */
	color: #fff;		/* 白文字 */
	font-size: 18px;
	text-decoration: none;
	background: #00cc00;
	line-height: 1.4;
	border: none;
}

/* アイコン画像 */
#global-nav ul.dropmenu li a img {
	width: 30px;
	height: 30px;
	margin-right: 10px;	/* 文字との間隔 */
				/* 緑背景でも白で見える */
	filter: brightness(0) invert(1);	
}

/* ホバー時 */
#global-nav ul.dropmenu li a:hover {
	background: #00bf00;
}

#nav-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(0,0,0,0.5);	/* 半透明黒 */
	display: none;			/* 初期は非表示 */
	z-index: 997;			/* ナビより下、ハンバーガーより下 */
}
#nav-overlay.active {
	display: block;			/* ナビ開いたとき表示 */
}

/*===============================================================*/
/*ヘッダー*/

/*ボディー　　　border: solid 1px #cccccc;　　　*/
/*===============================================================*/
.Contents {
	background: none;
}


/* スライダー全体の幅をスマホに合わせる */
.topimg {/* border: solid 5px blue; */
	width: 100%;
	height: auto;
}

.slider {
	width: 100%;
	/*overflow: hidden; ドット */
}

/* slickの内部構造を制限 */
.slick-track {
	display: flex;
	max-width: 100% ;
}

/* スライド画像のサイズ調整 */
.slick-slide img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
}

/* スライド矢印の位置調整 */
.slick-prev {
	left: 10px;	/* 左側の位置 */
}

.slick-next {
	right: 10px; /* 右側の位置 */
}

/* 外部css 読み込み */
.slick-slide {
	flex-shrink: 0;	/* 要指定 */
}

/* 外部css 読み込み */
.mypattern .slick-slide {/* border: solid 2px green;*/
	margin: 0;	/* 要指定 */
	padding: 0;	/* 要指定 */
}

/* 各ページ 大囲み */
/* ================================================== */
.PageContents {
	background: none;
}

/* 本文 囲み */
/* ================================================== */
.inner_center {/* border: solid 2px red; */
	width: calc(100% - 10px);
	margin: 0 5px 30px 5px;
	padding: 0;
	box-sizing: border-box;
}

/* ページタイトル */
/* ================================================== */
.pagetopimg {
	width:100%;
	height: 80px;
	overflow : hidden;
	margin: 0 auto 10px;
}

.pagetopimg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 80% center;
}

/* ページタイトル 文字 */
.info-title {
	left: 10px;
	top: 48%;
}

.info-title .jp {
	margin: 0 0 1px 3px;
	font-size: 22px;
	line-height:1.3;
}

.info-title .line {
	height: 1px;
	width: 160px;
	background: linear-gradient(to right, #ccc 0px, #ccc 60px, rgba(153,153,153,0) 160px);
}

.info-title .en {
	margin: 2px 0 0 3px;
	font-size: 18px;
	line-height:1.2;
}

/* 各ページ 囲み */
/* ================================================== */
.pagemain {
	width: 100%;
	margin: 0;
	padding: 0;
}

/* 各ページ 見出し */
.pagemain h1 {
	margin: 0;
	padding: 0 0 4px 6px;
	font-size: 24px;
	border-bottom: 3px solid #00a300;
}

/* トップページ */
/* ================================================== */
/* 最新情報 */
.newinfo {
	width: 100%;
	margin: 0 0 30px 0;
	padding: 0;
	background:rgba(255,255,255,0.7);
	box-sizing: border-box;
}

.newinfo ul li a{/* border: solid 2px red; */
	display: block;
	padding: 6px 7px 7px 8px;
	line-height: 1.3;
	color: #333333;
	text-decoration: none;
	transition:all 0.5s ease;
}

.newinfo h1 {
	margin: 0;
	padding: 0 0 2px 6px;
	font-size: 28px;
	border-bottom: 4px solid #00a300;
}

/* ボックス 小 2列（4列） 枠 */
.inner_center .flexContentsC {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 10px;
}

.inner_center .flexBox {
	flex: none;
	width: 100%;
	height: auto;
	padding: 6px 6px 0 6px;
}

.inner_center .flexBox img {
	width: 100%;
	height: auto;
	object-fit: cover;
}

/* 名取GGの紹介 */
/* ================================================== */
.inner_W100 {
	width: calc(100% - 10px);
	margin: 0 5px 30px 5px;
}

.inner_W100 h1 {
	font-size: 22px;
	margin: 15px auto;
}

.inner_W100 h3 {
	font-size: 16px;
}

.inner_W100 .text {
	width: 100%;
	margin: 0 0 15px 0;
	padding: 0 5px 0 5px;
}

.inner_W100 .imgcap img {
	width: 100%;
}

/* ボックス大 3列 */
/* ================================================== */
.inner_center .flexContents {
	display: block;
}

.inner_center .box {
	width: calc(100% - 20px);
	margin: 0 10px 30px 10px;
}

.inner_center .box img {
	width: calc(100% - 14px);
	height: auto;
	margin: 7px;
}

/* 画像共通 */
/* ================================================== */

/*写真横並び枚数指定*/
[class^="img-flex-"] {/* border: 1px solid green; */
	display: flex;
	justify-content: space-between;
	gap: 5px;
}

.img-flex-2 > div {
	width: calc((100% - (5px * 1)) / 2);
	margin: 0 0 3px 0;
}

.img-flex-3 > div {
	width: calc((100% - (5px * 2)) / 3);
	margin: 0 0 3px 0;
}

.img-flex-4 > div {
	width: calc((100% - (5px * 3)) / 4);
	margin: 0 0 3px 0;
}

/* 見出し 共通 */
/* ================================================== */
h2.tit {
	margin: 0 0 5px 0;
	font-size: 22px;
	line-height: 1.4;
}

h3.tit {
	margin: 0 0 10px 0;
	font-size: 17px;
	line-height: 1.4;
}

/* SPのみ 共通 */
/* ================================================== */
.db {
	display: block;
	width: 100%;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	text-align: right;
}


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

.info p {
	margin: 10px 0 10px 0;
}

/* 上マージン短縮 */
.info p span.mg-15 {
	display: block;
	margin: -15px 0 0 0;
}

/* イベント テーブル */
.info table.event {
	width: 100%;
}

.info table.event th {
	width: 25%;
	padding: 3px 5px 3px 6px;
}

.info table.event td {
	width: 75%;
	padding: 3px 5px 3px 6px;
}

/* 年末年始営業 テーブル */
.info table.nenmatu {
	width: 100%;
}

.info table.nenmatu td {
	padding: 8px;
	text-align:center;
	border: 1px solid #CCC;
}

.info table.nenmatu td:nth-of-type(1) {
	width: 40%;
}

.info table.nenmatu td:nth-of-type(2) {
	width: 60%;
}

.f18 {
	font-size: 17px;
}

.f28 {
	font-size: 22px;
}

.info h3 span {
	font-size: 24px;
}

/* 本文前のダウンロード案内文 */
.imgdl {/* border: 1px solid red; */
	font-size: 14px;
}

/* 文中の小見出し */
.info .ft-b.f18 {
	margin: 10px 0 10px 0;

}

/* お盆休み 文字強調 */
.info h2.f50 {
	font-size: 30px;
}

.info span.f40 {
	font-size: 26px;

}

.info h2.f30 {
	font-size: 18px;
}

.info p.kyocho {
	width: 100%;
	padding: 3px;
	font-size: 16px;
}

/* 画像ボックス */
/* ━━━━━━━━━━━━━━━━━━━━━━ */
/* 135px 左 */
div.img135l {
	width: 136px;
	margin: 0 0.4em 0.4em 0;
}

/* 画像 100% */
div.img220l,
div.img220r,
div.img250r,
div.img250l,
div.img300l,
div.img300r,
div.img350l,
div.img350r,
div.img400l,
div.img400r {
	float: none;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}

.cap {
	font-size: 10px;
	margin: 3px 0 0 0;
}


/* ━━━━━━━━━━━━━━━━━━━━━━ */

.kage_red {
	font-size: 120%;
}

.kage_blue {
	font-size: 120%;
}

h3.f22 { font-size: 20px; }

/* 川柳大会結果 */
.info table.senryu {
	width: 100%;
	margin: 0 0 0 0;
	border: none;/* border: 1px solid blue; */
}
.info table.senryu tr {
	display: block;
	margin-bottom: 0.5em;
}

.info table.senryu td {
	display: block;
	width: 100%;
	border: none;
	padding: 0px;
	line-height: 1.5;
}

.info table.senryu td:nth-child(2) {
	width: 100%;
	padding: 3px 0 4px 4px;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	box-sizing: border-box;

}

.info table.senryu td span {
	display: inline-block;
	margin: 0 0.5em 0 0;
}

.info table.senryu td span.haiku {
	width: 100%;
}

.info table.senryu td span.name {
	width: 100%;
	margin: 0 0 10px 0;
}

.info table.senryu td div {
	display: inline-block;
	width: auto;
	margin-bottom: 6px;
}

/* イベントカレンダー */
.info table.eventcal {
	width: 100%;
	margin: 10px 0 0 0;
}

.info table.eventcal td {border-top: 1px solid #CCC;
	width:14.2%;
	border-collapse:collapse;
	margin-left: -10px;
	vertical-align:top;
	text-align:left;
	padding: 3px 0px 12px 10px;
	line-height: 1.4;
}

.info table.eventcal td.month {
	padding: 0 0 6px 0;
}

.info table.eventcal td.yobi {
	padding: 3px 0px 3px 0;
}

.info table.eventcal td div.d01 {
	width:30px;
	margin-top: 4px;
	border-radius: 6px;
	padding: 5px 2px 7px 2px;
}

.info table.eventcal td div.d02 {
	width:30px;
	margin-top: 4px;
	border-radius: 6px;
	padding: 5px 2px 7px 2px;
}

.info table.eventcal td div.d03 {
	width:30px;
	margin-top: 4px;
	border-radius: 6px;
	padding: 5px 2px 7px 2px;
}

.info table.eventcal td .sp-only div.d01,
.info table.eventcal td .sp-only div.d02,
.info table.eventcal td .sp-only div.d03 {
	display: inline-block;
	width: 20px;
	height: 20px;
	margin: 8px 2px 0 6px;
	padding: 2px 6px 6px 3px;
	font-size: 14px;
	line-height: 1.1;
}

.info table.tablecol3 {
	width: 100%;
}

.info table.tablecol3 td.tt {
	white-space: nowrap;
}

/* 施設案内 */
/* ================================================== */
.facility {
	margin: 5px auto 50px;
	padding: 0 5px 5px 5px;
}

.facility table td {
	padding: 2px 7px 4px 7px;
}

.facility table td.tit {
	white-space: nowrap;
}

.bg-r2 {	
	padding: 2px 4px 3px 4px;
	font-size: 14px;
}

/* 弾道測定器 タイトル */
.facility h2.sc4tt {
	width: 100%;
	margin: 0px 0 10px 0;
	padding: 10px 0 12px 0;
	font-size: 30px;
	line-height:1.2;
	text-align: center;
	color: #fff;
	background: #333;
}

.facility h2.sc4tt span {
	font-size: 40px;
}

.facility h3.sc4st {
	margin: 0px 0 12px 0;
	padding: 0;
	font-size: 22px;
	line-height:1.4;
	text-align: center;
}

.facility h4.sc4 {
	margin: 15px 0 5px 0;
	font-size: 20px;
	line-height:1.4;
}

h2.sida {	
	margin: 0px 0 10px 0;
	padding: 3px 7px 5px 7px;
	font-size: 22px;
}

h3.sida {	
	margin: 0px 0 10px 0;
	font-size: 20px;
}

/* 営業案内 */
.eigyo {
	margin: 5px auto 50px;
	padding: 0 5px 5px 5px;
}

.eigyo .hg-1.mg1 {

}

/* がんばれジュニア */
.jr_W100 section {
	width: 100%;
	margin: 10px auto 10px;
	padding: 0;
}

.jr_W100 article {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0 30px 0 30px;
}

.jr_W100 .img-wrap img {
	width: 100%;
	height: auto;
}

.jr_W100 h1 {
	margin: 0 0 5px 0;
	font-size: 22px;
}

.jr_W100 h2 {
	font-size: 18px;
	margin: 10px 0 5px 0;
}

.jr_W100 .tt {
	display: block;
	margin: 0 0 0 0;
	padding: 2px 0px 2px 6px;
	line-height: 1.3;
}

.jr_W100 .hb {
	display: inline-block;
	margin: 0 0 10px 8px;
	padding: 4px 0px 4px 8px;
	font-weight: bold;
	line-height: 1.4;
	vertical-align: top;
}

/* ご利用料金 */
/* ================================================== */
.fee {
	margin: 5px auto 50px;
	padding: 0 5px 5px 5px;
}

.fee .titleimg {/* border: 1px solid blue; */
	margin: 10px 0 0 0;
}

.fee .titleimg img {
	width: 100%;
	height: auto;
	margin: 0;
}

.feetable {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin: 5px auto 50px;
	padding: 0 5px 5px 5px;
}

.feetable table {
	width: 100%;
	min-width: 600px;
}

.feetable table td {
	padding: 6px;
}

.feetable table td .f20.ft-b {
	font-size: 24px;
}

.feetable table td .f16.ft-b {
	font-size: 16px;
}

.feetable table td div span.kyu {
	font-size: 24px;
}

.fee ul {
	padding: 0 0 0 1.2em;
	margin:0;
}

/* ショップ */
/* ================================================== */
.shoptop {
	margin: 5px auto 50px;
	padding: 0 5px 5px 5px;
}

.kagopre {
	width: 100%;
	margin: 10px 0 10px 0;
	padding: 3px 0 4px 0;
}

.shoptop table {
	float: none;
	width: 100%;
	margin: 10px 0 10px 0;
}

/* ショップカード 画像 */
.shoptop .shopcard {
	float: none;
	width: 100%;
	height: auto;
	margin: 0;
}

div.shoptopimg {
	width: 100%;
	height: auto;
}

div.shoptopimg img {
	width: 100%;
	height: auto;
}

.shop10 {
	margin: 5px auto 50px;
	padding: 0 5px 5px 5px;
}

.shop10 table {
	width: 100%;
}

.shop10 table td.tt {
	white-space: nowrap;
}

.shop10 table td {
	width: auto;
	padding: 2px 7px 4px 7px;
}

/* テーブル内テーブル 川柳大会 */
.shop10 table td table {
	width: 100%;
	margin: 5px 0 5px 0;
}

.shop10 table td table td {
	padding: 3px 0px 5px 3px;
	line-height:1.4;
}

.shop10 table td table td .f14.hg-1 {
	padding: 0;
	width: 96%;
}

.shop10 table td table td .hg.mg1 {
	margin: 0;
	padding: 0;
	width: 100%;
}

.shop10 table td table td:nth-child(1) {
	display: block;
	width: 100%;
}

.shop10 table td table td:nth-child(2) {
	display: block;
	width: 100%;
}

.shop10 table td table td.ss span {/* border: 1px solid red; */
	margin: 0 0 3px 8px;
	width: 6em;
}

.shop10 table td table td.ss span.lb5,
.shop10 table td table td.ss span.lb8 {
	margin: 0 0 3px 8px;
	width: 8em;
}

.shop10 table td table td ul {
	margin: 0.5em 0 0.5em 0.5em;
}

.shop10 table td table td ul li {
	margin: 0 0 0.3em 0;
	padding: 0 0.3em 0.2em 0.3em;
}

/* スクール */
/* ================================================== */
.pagemain .schooltop,
.pagemain .schoolfee,
.pagemain .schooltaiken {
	margin: 5px auto 50px;
	padding: 0 5px 5px 5px;
	box-sizing: border-box;
}

.pagemain .schooltable {
	margin: 5px auto 0;
	padding: 0 5px 5px 5px;
	box-sizing: border-box;
}

/* 受講料 テーブル */
.schoolfee table {
	margin: 0 0 0 0;
	box-sizing: border-box;
}

.schoolfee table td {
	padding: 4px 7px 5px 7px;
}

.schoolfee table td.tt {
	width: 23%;
	padding: 4px 7px 5px 7px;
}

.schoolfee .col1 {
	width:4em;
	float:left;
}

.schoolfee .col2 {
	width: 9em;
	float:left;
	text-align:right;
}

.schoolfee .col3,
.schooltaiken .col3 {
	width:120px;
	margin: 3px 0.5em 0 0;
}

.schoolfee .col0 {
	float: left;
	width: auto;
	margin: 0 0 5px 0;
}

/* 体験版 テーブル */
.schooltaiken table td {
	padding: 4px 7px 5px 7px;
}

.schooltaiken table td.tt {
	width: 23%;
	padding: 4px 7px 5px 7px;
}
/* スクール時間割 */
.schooltable .ft-b.ta-r {
	font-size: 13px;
}

.schooltable table td.tt {
	font-size: 14px;
	white-space: nowrap;
}

/* お問合せ */
/* ================================================== */
.contact {
	margin: 5px auto 50px;
	padding: 0 5px 5px 5px;
}

.contact table tr th,
.contact table tr td {
	padding: 8px 0 8px;
}

.contact table tr th,
.contact table tr td {
	display: block;
	width: 100%;
}
.contact table input.mf,
.contact table textarea.mf {
	width: 100%;
	padding: 6px;
	border-radius: 4px;
}

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

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

#page-top a img {
	width: 85%;
	height: auto;
}

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

/*フォント*/
/*===============================================================*/
/* PCサイトのフォント加減 */
.f18 {
	font-size:17px;
}

.f16 {
	font-size:15px;
}

/*index-what's new 続きを読む*/
/*===============================================================*/
.grad-wrap + .grad-wrap {
	margin-top: 0px;
}

.grad-btn {
	border-top: 4px solid #00a300;
}

.grad-item {
	height: 356px;
}

//*フッター　　　border: solid 1px #cccccc;　　　*/
/*===============================================================*/
.Footer {
	box-sizing: border-box;
}

.Footer .inner {
	width: calc(100% - 20px);
	margin: 20px 10px 0 10px;
}

.ft1 {
	text-align: center;
	width: 100%;
	float: none;
	font-size: 0.9em;
	margin: 0 0 0 0;
}

.ft2 {
	text-align: center;
	width: 96%;
	float: none;
	font-size: 0.9em;
	margin: 15px auto 0;
}

.ft3 {/* border: solid 1px #ccc; */
	width: 96%;
	float: none;
	margin: 15px auto 0;
	padding: 0 10px;
}

.Footer .add {
	margin: 0;
}

.ft4 {
	width: 100%;
	margin: 15px 0 0 0;
	padding: 7px 0;
}

.ft4 a {
	display: inline-block;
}

.copyright {
	padding: 10px 0 0 0;
	font-size: 16px;
	word-spacing: 2px;
}
