@charset "utf-8";

/*---------------------------------
 ヘッダー
 2026.01.15版 展開ヘッダー
<script src="js/2026header.js" defer></script>
<header id="PT">
<div class="header-title">
<div class="logo">啓明塾<a href="index.html">啓明塾</a></div>
<div class="btn"><i class="fas fa-bars"></i></div>
</div>
<div class="header-nav">
-----------------------------------*/
header{ position:relative; margin: 0; padding: 0;}
header .header-title{ position: relative; display: flex; justify-content: space-between; align-items: center; }
header .header-title .logo, 
header .header-title .btn { font-size: calc( 24px + 0.5vw ); padding:8px ; }
header .header-title .logo{ position: relative; font-family: 'Noto Serif JP', serif; font-weight:700; line-height:130%; letter-spacing :calc( 2px + 0.1vw ); }
header .header-title .logo a{ display:block; position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; }
header .header-title .btn { color: #ffffff; user-select: none; cursor: pointer; }
header .header-nav{
	position: relative;
	font-size: 0.8em; color: #ffffffdd; border-color: #ffffffdd;
	max-height: 0; overflow: hidden; transition: max-height .3s ease;
	margin: 0 -12px; box-sizing: border-box; overflow: hidden; } /* grid-template-columns の左右幅 */
header .header-nav nav{ position: relative; padding:0.5em 10px; margin:0;}
header .header-nav nav p.caption{ line-height:1; padding:0 0.3em; margin: 0; border-left:3px solid; }
header .header-nav nav ul{ padding:0; margin:0.75em 8px; display:flex; flex-wrap:wrap; gap:10px; }
header .header-nav nav ul + ul{ margin-top: 0; }
header .header-nav nav li{
	flex-grow: 0;
	font-family: arial,sans-serif; font-size:inherit; line-height:100%; letter-spacing: 0.5px; text-align: center;
	box-sizing:border-box;  overflow:hidden; margin:0; padding:0; /* a で設定 */ }
header .header-nav nav li a{
	color:inherit; padding:0.5rem 1rem; line-height:1;  text-decoration:none; white-space:wrap; 
	display: block; overflow:hidden; border: 1px solid; border-radius: 3px; }
header .header-nav nav li a:hover{ background-color: #ffffff22; color: #fff; }

/*--------------------------*/
header .header-nav nav.box-entry{ padding: 0 4px; margin-bottom: 1.5em; }
header .header-nav nav.box-entry ul li{ flex:1; }
header .header-nav nav.box-entry ul li a{
	padding: 0; font-weight: 700; font-family:'Zen+Maru+Gothic';
	display: flex; align-items: center; border: 1x solid #ffffffdd; border-radius: 6px;
}
header .header-nav nav.box-entry ul li a img{ height:3em; height:1; margin-right:1em; border-right: 1px solid #ffffffdd; }
header .header-nav nav li.entry a{ color: #ffffff !important; background-color: #e54234 !important; }
header .header-nav nav li.entry_line a{ color: #ffffff !important; background-color: #06c755 !important; }

/*---------------------------------
/ フッター
-----------------------------------*/
footer {
	position:relative; font-size:0.9em; overflow:hidden; padding: 10vh 5% ; min-height: 15vh; margin-top: auto;
	display:flex; flex-direction: column; justify-content: center; align-items: center; gap:20px;
}
footer .logo{ flex:1; position: relative; }
footer .logo a{ display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%;  opacity: 0; overflow: hidden;}
footer address{ flex:1; font-style: normal;}
footer address ul{ list-style:none; margin: 0; padding: 0; text-align: center; }
footer address ul li{ margin-bottom: 0.75em; }
footer address ul li i{ display: block !important; margin-bottom: 0.5rem; font-size: 200%; }
footer address ul li:nth-child(1) { font-family: 'Noto Serif JP', serif; font-size: 200%; font-weight:700; line-height:130%; }
footer nav{ flex: 1 ; }
footer nav ul{
	position:relative; list-style:none; margin:0; padding: 0;  height:100%; 
	display:flex; flex-wrap:wrap; gap:12px;  justify-content:end; }
footer nav ul li{
	flex:1; min-width: fit-content; padding:8px; border: 1px solid ; border-radius: 2px; 
	position:relative;
	display:flex; flex-direction: column; justify-content:center;
	font-family:sans-serif; line-height:1; letter-spacing: 0.1em; font-weight: normal; text-align:center;
 }
footer nav ul li + li{ margin:0; }
footer nav ul li i{ display:block; font-size:24px; margin:0 0 4px; padding:0; }
footer nav ul li b{ display:block; font-size:10px; margin:0; padding:0; }
footer nav ul li a{ display:block; position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; }

/* ---------------- */
#Gotop {
	position: fixed; right: 20px; bottom: 20px; width: 48px; height: 48px;
	border-radius: 50%; border: none;
	background: #333; color: #fff; font-size: 20px; cursor: pointer;
	opacity: 0; pointer-events: none; transition: opacity 0.3s; z-index: 9999;
}
#Gotop::after {
	height: 100%; margin-top:-2px; content: '▲';
	display: flex; align-items: center; justify-content: center; }
/* 表示状態 */
#Gotop.visible { opacity: 0.8; pointer-events: auto; }
#Gotop:hover { opacity: 1; }