/* CSS Document */

h1,h2,h3,h4,h5,h6,p,ul,ol,dl{
	margin:0;
	padding:0;
}

h1{
	margin-top:1em;
	margin-bottom:0.5em;
	font-size:1.3em;
	font-weight:bold;
	letter-spacing:0.08em;
	color:#1b2e78;
}

*:link,*:visited{
	text-decoration:none;
	color:darkblue;
}

img{
	border:0;
}

html{
	font-size:16px;
	line-height:1.2em;
}

body{
	width:100%;
	text-align:center;
	margin:0;
	padding:0;
	color:#333333;
	font-family:"Kosugi Maru",sans-serif;
	background-image:url("../img/ball.png");
	background-repeat:no-repeat;
	background-position:top 30px left 10px;
	background-size:800px;
	background-color:rgba(255,255,255,0.9);
	background-blend-mode:lighten;
	background-attachment:fixed;
}

p{
	display:table;
	margin-left:auto;
	margin-right:auto;
	max-width:95%;
}

table{
	border-collapse:collapse;
	margin-left:auto;
	margin-right:auto;
	max-width:95%;
	margin-bottom:10px;
}

th{
	background-color:#EEEEEE;
}

th,td{
	border:1px solid;
	border-color:#CCCCCC;
	padding:0.2em;
	overflow-wrap:anywhere;
}

span{
	vertical-align:middle;
}

select {
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-color:#999999;
    cursor:pointer;
}

select:invalid,select option:first-child{
	color: #CCCCCC;
}

select option{
	color:black;
}

.nobreak{
	overflow-wrap:normal;
}

#wrapper{
	display:inline-block;
	width:100%;
}

#footer{
	padding:10px;
	font-size:0.9em;
	border-top:1px solid;
	border-color:#CCCCCC;
}

input[type="submit"]{
	font-size:0.8em;
	min-width:80px;
	font-weight:bold;
	background-color:steelblue;
	color:#ffffff;
	padding-left:10px;
	padding-right:10px;
	border:1px solid steelblue;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
    cursor:pointer;
}

input:hover[type="submit"]{
	filter:brightness(1.20);
}

.linkbutton{
	text-align:center;
	font-weight:bold;
	margin-left:10px;
	display:inline-block; /* テキストに応じて幅を可変させるため */
	padding:2px 12px 2px 12px; /* 塗りの余白 */
	background-color:#09c; /* 背景色 */
	color:#FFF; /* テキストカラー */
	cursor:pointer; /* カーソルを指マークに */
	border-radius:3px; /* 角の丸み */
	border:0; /* 枠線を消す */
	transition:0.3s; /* ホバーの変化を滑らかに */
}

.linkbutton:hover{
	background-color:#009efb; /* 背景色 */
}

.logoimg{
	width:100%;
	max-width:600px;
}

#errormsg{
	width:90%;
	max-width:300px;
	margin-top:20px;
	padding:10px 10px 10px 10px;
	border:1px solid;
	border-color:#CCCCCC;
	background-color:#EEEEEE;
	margin-left:auto;
	margin-right:auto;
}

.tangae{
	text-decoration:line-through;
	font-size:0.8em;
}

.icon-green,.icon-red,.icon-blue,.icon-navy,.icon-orange,.icon-gray{
	color:#ffffff;
	font-size:0.8em;
	letter-spacing:0;
	white-space:nowrap;
	padding:2px;
	margin-left:2px;
	margin-right:2px;
	border-radius:5px 5px 5px 5px;
	vertical-align:middle;
}
.icon-green{
	background-color:forestgreen;
}
.icon-red{
	background-color:coral;
}
.icon-blue{
	background-color:royalblue;
}
.icon-navy{
	background-color:navy;
}
.icon-orange{
	background-color:orange;
}
.icon-gray{
	background-color:lightslategray;
}

#sizeset {
	margin-bottom:5px;
}
#sizeset a{
	color:#333333;
	border:1px solid;
	border-color:#CCCCCC;
	margin-left:3px;
	margin-right:3px;
	padding:2px;
}
.sizesel{
	font-weight:bold;
	color:white !important;
	background-color:mediumaquamarine;
	pointer-events:none;
}

/* ################ */
/* 各ページ個別設定 */
/* ################ */

/* メインメニュー */
#mainmenu{
	padding-top:10px;
	background-color:#EEEEEE;
	white-space:nowrap;
}
#mainmenu p{
	margin-bottom:10px;
}
#navibar a{
	display:inline-block;
	width:25%;
	max-width:100px;
	box-sizing:border-box;
	font-size:0.8em;
	font-weight:bold;
	color:#757575;
	margin-botom:3px;
}
#navibar img{
	margin-left:auto;
	margin-right:auto;
	display:block;
	max-width:30px;
}
#navibar a:hover{
	filter:brightness(1.50);
}
#navibar .activepage{
	border-bottom:3px solid;
	border-color:#757575;
}
#subnavibar{
	margin-top:10px;
	margin-bottom:20px;
	font-size:0.9em;
}
#subnavibar a{
	display:inline-block;
	width:30%;
	max-width:120px;
	text-align:justify;
	text-align-last:justify;
	position:relative;			/*位置（ここを基準に）*/
	padding:0 2em 0 0.5em;		/*内側余白調整（上右下左）*/
	color:#757575;				/*リンク文字色*/
}
#subnavibar a::before,#subnavibar a::after{
	content:'';				/*矢印部分作成*/
	position:absolute;		/*位置（下線と矢印を配置する）*/
	background:#757575;		/*矢印の色*/
	height:1px;				/*線の太さ*/
}
#subnavibar a::before{
	bottom:-5px;	/*下線の下からの距離*/
	left:0%;		/*左からの距離*/
	width:90%;		/*ボタンの幅*/
}
#subnavibar a::after{
	bottom:-2px;				/*矢印の下からの距離*/
	right:10%;					/*右からの距離*/
	width:10px;					/*矢印部分の幅*/
	transform:rotate(35deg);	/*角度調整*/
}
#subnavibar a:hover{
	filter:brightness(1.20);
}
#subnavibar .activepage::before,#subnavibar .activepage::after{
	height:2px;	/*線の太さ*/
}
#subnavibar .activepage{
	font-weight:bold;
}

/* ログイン */
#login{
	width:90%;
	max-width:300px;
	margin-top:20px;
	padding:10px 10px 10px 10px;
	border:1px solid;
	border-color:#CCCCCC;
	background:rgba(238,238,238,0.8);
	margin-left:auto;
	margin-right:auto;
}
#login table{
	margin-left:auto;
	margin-right:auto;
}
#login th{
	text-align:left;
	font-weight:normal;
	border:none;;
	background:rgba(238,238,238,0.8);
}
#login td{
	text-align:left;
	border:none;
}
#login input[type="number"],#login input[type="password"]{
	width:5em;
}
#login input[type="submit"]{
	font-size:1em;
	width:150px;
	height:40px;
}

/* ログイン選択画面 */
#loginsel{
	width:90%;
	max-width:300px;
	margin-top:20px;
	padding:10px 10px 10px 10px;
	border:1px solid;
	border-color:#CCCCCC;
	background-color:#EEEEEE;
	margin-left:auto;
	margin-right:auto;
}
#loginsel table{
	margin-left:auto;
	margin-right:auto;
}
#loginsel th{
	text-align:left;
	font-weight:normal;
	border:none;;
}
#loginsel td{
	text-align:left;
	border:none;
}
#loginsel input[type="submit"]{
	font-size:1em;
	height:40px;
	min-width:150px;
}
#loginsel p{
	margin-top:10px;
	margin-bottom:10px;
}

/* トップ */
#top p{
	margin-bottom:10px;
}
#top form{
	display:inline;
}
#top button{
	min-width:80px;
	font-weight:bold;
	background-color:steelblue;
	color:#ffffff;
	padding-left:10px;
	padding-right:10px;
	border:1px solid steelblue;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
    cursor:pointer;
}
#top button:hover{
	filter:brightness(1.20);
}
.MuFuriMei,.YuFuriMei{
	display:none;
}
.MuFuriMei.open,.YuFuriMei.open{
	display:block;
}
.MuFuriBtn::before,.YuFuriBtn::before{
	content:"詳細表示";
}
.MuFuriMei.open + .MuFuriBtn::before,.YuFuriMei.open + .YuFuriBtn::before{
	content:"非表示";
}
.TikMei1,.TikMei2,.TikMei3{
	display:none;
}
.TikMei1.open,.TikMei2.open,.TikMei3.open{
	display:block;
}
.TikBtn1::before,.TikBtn2::before,.TikBtn3::before{
	content:"詳細表示";
}
.TikMei1.open + .TikBtn1::before,.TikMei2.open + .TikBtn2::before,.TikMei3.open + .TikBtn3::before{
	content:"非表示";
}
input[type="submit"][value="欠席取消"],input[type="submit"][value="申請を取消する"]{
	min-width:80px;
	font-weight:bold;
	background-color:coral;
	color:#ffffff;
	padding-left:10px;
	padding-right:10px;
	border:1px solid coral;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
    cursor:pointer;
}
.entrylist{
	white-space:nowrap;
	display:block;
	font-size:0.9em;
	line-height:1.2em;
}
input[type="submit"][value="変更・取消"],input[type="submit"][value="エントリーを取消する"]{
	background-color:coral;
}
.liveimg{
	max-width:95%;
	box-sizing:border-box;
	border:1px solid;
	border-color:#CCCCCC;
	padding:5px;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	margin-right:5px;
	margin-bottom:5px;
}

/* 欠席申請 */
#kesseki p{
	margin-bottom:10px;
}
/* レッスン予約 */
#yoyaku p{
	margin-bottom:10px;
}
#yoyaku select{
	margin-bottom:5px;
	width:11em;
}

/* QRコード */
#qrcode p{
	margin-bottom:10px;
}

/* クラブエントリー */
#clubentry p{
	margin-bottom:10px;
}

/* ログ表示 */
#logget th{
	white-space:nowrap;
}
#logget td{
	text-align:left;
}
#logget img{
	float:left;
	padding-right:5px;
}
.loggetagent{
	display:block;
	overflow:hidden;
	text-overflow:ellipsis;
}