@charset "Shift-JIS";

/* HTML */
html{
scroll-behavior:	smooth	;
}

/* BODY */
body{
margin-right: auto;
margin-left : auto;
margin-top : 0px;
max-width:		1240px		; /* ページの最大横幅 */
color:			#FFFFFF		; /* テキストの基本カラー */
line-height:			125%	;
-webkit-text-size-adjust:	100%	; /* スマホを横にしても文字が大きくならない */
box-sizing:		border-box	; /* padding分を気にせずwidthを指定 */
word-break:		break-all	; /* 長い文字列でも途中で改行させる */
background-color:	#000000;
background-size:	contain;
font-family:		"メイリオ",Palatino Linotype,Book Antiqua,Palatino,Klee,"游明朝体",Yu Mincho,YuMincho,"ヒラギノ明朝ProN W3",HiraMinProN-W3,"ヒラギノ明朝Pro W3",Hiragino Mincho Pro,"HG正楷書体-PRO","ＤＦ中楷書体","ＭＳ 明朝",MS Mincho,Meiryo,serif;
font-feature-settings: "palt";
font-size:		1.0em	;
}

/* 画像に適用する */
img{
border:			none	;
max-width:		100%	;
height:			auto	;
box-sizing:		border-box	; /* padding分を気にせずwidthを指定 */
padding:		0px 0px 0px 0px	;
}

/*上下左右共に中央寄せ(最大幅100%)*/
.contents-frame1 {
display:		flex	;
align-items:		center	;
justify-content:	center	;
text-align:		center;
float:			left;
}

/*上下左右共に中央寄せ(最大幅100%)*/
.contents-frame2 {
display:		flex	;
align-items:		center	;
justify-content:	center	;
max-width:		100%	; 
color:			#CCCCCC		;
margin:			1px 0px 1px 0px	;
padding:		0px 0px 8px 0px	;
}

/*上下左右共に中央寄せ(最大幅100%)*/
.contents-frame3 {
display:		flex	;
align-items:		center	;
justify-content:	center	;
text-align:		center;
float:			left;
}

div.center{margin : 0 auto;}

/*上下左右共に中央寄せ(最大幅100%、右寄せ)*/
.contents-frame4 {
float:			right;
}

/*ボディー部の右上[body-right]に適用する*/
.body-right {
max-width:		100%	; 
color:			#000055		;
margin:			0px 0px 2px 0px	;
padding:		0px 0px 8px 0px	;
float:			right ;
border:			solid 1px #CCCCFF;
}

/*一般文章に適用する*/
p{
font-weight:		normal	;
font-size:		100%		;
color:			#CCCCCC	;
margin:			0px 0px 0px 0px		;
padding:		5px 5px 5px 5px	;
}

/*PC用メニューボックス*/
#menu1:hover {color: #FFFFFF;opacity:0.4;}
#menu1 {
display:		flex	;
align-items:		center	;
justify-content:	center	;
font-size:		130%		;
width:			115px	;
height:			50px;
color:			#FFFFFF		;
background-color:	#884444;
border:			solid 1px #AA4444;
float:			right;
padding:		10px 0px 10px 0px	;
margin:			0px 0px 0px 0px		;
}

/*スマホ用メニューボックス*/
#menu:hover {color: #000000;opacity:0.4;}
#menu {
display:		flex	;
align-items:		center	;
justify-content:	center	;
width:			104px;
height:			50px;
color:			#FFFFFF		;
background:		url() center no-repeat;
background-color:	#884444;
border:			solid 1px #AA4444;
float:			left;
margin:			0px 0px 0px 0px	;
padding:		1% 0% 1% 0%	;
}

/*メニュー部[B]全体に適用する*/
div#menu-b {
position: relative;
overflow: hidden;
text-align:		center;
margin:			0px 0px 0px 0px	;
padding:		0px 0px 0px 0px	;
}
li.menu-b3 {
margin:			0px 0px 0px 0px	;
padding:		0px 0px 0px 0px	;
position: relative;
float: left;
}

/*見出しボックス*/
.midashi {
display:		flex	;
align-items:		center	;
justify-content:	center	;
width:			100%	; 
color:			#FFFFFF		;
background-color:	#552222;
margin:			10px 0px 10px 0px	;
padding:		5px 0px 5px 0px	;
border:			solid 0px #FFFFFF;
}

/*個別コンテンツボックス(テキスト)*/
#txxt {
background-color:	#FFFFFF;
border:			solid 0px #CCCCFF;
max-width:		750px	; 
float:			left;
margin:			0px 0px 0px 0px	;
padding:		1% 1% 1% 1%	;
}

/*個別コンテンツボックス(中央画像)*/
#pict {
text-align:		center	;
margin:			0px 0px 0px 0px	;
padding:		1% 1% 1% 1%	;
}

/*個別コンテンツボックス(左寄せ画像)*/
#pict1 {
text-align:		left	;
margin:			0px 0px 0px 0px	;
padding:		1% 1% 1% 1%	;
float:			left;
}

/*個別コンテンツボックス(右寄せ画像)*/
#pict2 {
text-align:		right	;
margin:			0px 0px 0px 0px	;
padding:		1% 1% 1% 1%	;
float:			right;
}

/*ボックス1*/
#box1 {
display:		flex	;
align-items:		center	;
justify-content:	center	;
width:			100%	; 
line-height:			200%	;
margin:			20px 0px 0px 0px	;
padding:		0% 0% 0% 0%	;
}

/*ボックス2*/
#box2 {
display:		flex	;
align-items:		center	;
justify-content:	left	;
width:			99%	; 
float:			left;
margin:			20px 0px 0px 0px	;
padding:		0% 0% 0% 1%	;
background: linear-gradient(-135deg, #999999, #333333);
}

/*ボックス2over*/
#box2over {
display:		flex	;
align-items:		center	;
justify-content:	left	;
width:			99%	; 
float:			left;
margin:			20px 0px 0px 0px	;
padding:		0% 0% 0% 1%	;
background: linear-gradient(-135deg, #222222, #222222);
}

/*ボックス3*/
#box3 {
display:		flex	;
align-items:		center	;
justify-content:	left	;
width:			96%	; 
margin:			0px 0px 0px 0px	;
padding:		0% 0% 0% 4%	;
}

/*ボックス4*/
#box4 {
display:		flex	;
align-items:		center	;
justify-content:	left	;
margin:			0px 0px 20px 10px	;
padding:		0px 0px 0px 0px	;
}

/*ボックス5*/
#box5 {
float:			left;
text-align:		center	;
width:		130px	; 
padding:		0px 0px 0px 10px	;
}

/*　通常テキストを赤字＋太字で表示する<span class="bold">　*/
.bold{
font-weight:		bold	;
}

/*　通常テキストを拡大で表示する<span class="big2">　*/
.big2{
font-size:		+1.5em	;
}

/*　通常テキストを色付き文字で表示する<span class="big">　*/
.big{
background-color: #EEEEFF;
}

/*　通常テキストを色付き文字で表示する<span class="redtx">　*/
.redtx{
color:			#FF0000		;
}

/*　通常テキストを色付き文字で表示する<span class="yetx">　*/
.yetx{
color:			#FFFF00		;
}

/*　通常テキストを色付き背景(黄色)＋センタリングで表示する<span class="star">　*/
.star{
background-color: #FFFFCC;
}

/*　通常テキストを色付き背景(ピンク)＋センタリングで表示する<span class="pink">　*/
.pink{
background-color: #FFCCCC;
font-weight:		bold	;
}

/*ページ内ジャンプ位置微調整*/
a.anchor{
    display: block;
    padding-top: 20px;
    margin-top: -20px;
}

/*個別コンテンツボックス(講師一覧ページ用)*/
#txxtk {
background-color:	#FFFFFF;
width:			315px	; 	/*横幅315pxで固定*/
float:			left;
margin:			1px 0px 1px 1px	;
padding:		1px 0px 1px 0px	;
}

/* ul li タグの●黒丸を消す*/
ul {
list-style:		none;
padding-left:		0;
}
li {
list-style:		none;
padding-left:		200;
margin : 0 auto;
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 1024px) {
.pc { display: none !important; }
.sp { display: block !important; }
}

/*アコーディオンのCSS*/
.accbox {
    margin: 0em 0em 1em 0em ;
    padding: 0;
}
.accbox label {
    display: block;
    margin: 0px 0;
    padding : 5px 5px 5px 20px;
    color :#333333;
    font-weight: bold;
    background :#CCDDFF;
    cursor :pointer;
    transition: all 0.1s;
}
.accbox label:hover {
    background :#85baef;
}
.accbox input {
    display: none;
}
.accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.3s;
}
.cssacc:checked + .accshow {
    height: auto;
    padding: 5px;
    background: #eaeaea;
    opacity: 1;
}

/*個別コンテンツボックス(指導実績ページ用)*/
#txxts {
background-color:	#FFFFFF;
border:			solid 0px #FF0000;
float:			left;
margin:			1px 0px 1px 1px	;
padding:		1px 0px 1px 0px	;
}

/*ページトップへ戻るための右上フロートボタン*/
#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 56;
  background: #666666;
  opacity: 0.6;
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before{
  font-family: FontAwesome;
  content: '\f102';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

/*フッターメニューの実験*/
/**********************
モーダルウィンドウ
**********************/
 
.modal-window {
-webkit-transform: translate(0, 100%);
-moz-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
transform: translate(0, 100%);
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 999;
opacity: 0;
line-height: 1.3;
display: none9;
}
.modal-window:target {
-webkit-transform: translate(0, 0);
-moz-transform: translate(0, 0);
-o-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
opacity: 1;
}
.is-active.modal-window {
display: block9;
}
.modal-window:target {
display: block9;
}
.modal-window .modal-inner {
position: absolute;
top: 100px;
left: 5%;
z-index: 20;
padding:5%;
margin:0 auto;
width: 80%;
overflow-x: hidden;
border-radius: 6px;
background: #fff;
-webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
}
 
.modal-window .modal-close {
display: block;
text-indent: -100px;
overflow: hidden;
}
.modal-window .modal-close:before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10;
background: #333;
	-moz-opacity: 0.7;
	opacity: 0.7;
}
.modal-window .modal-close:after {
content: '\00d7';
position: absolute;
top: 70px;
right:15%;
z-index: 20;
margin:0 auto;
background: #fff;
border-radius: 2px;
padding: 10px 10px;
text-decoration: none;
text-indent: 0;
}
 
.modal-window {
-webkit-transition: opacity 0.4s;
-o-transition: opacity 0.4s;
transition: opacity 0.4s;
}
 
 
 
/**********************
スマホのフッターメニュー
**********************/
ul.footer_menu {
	margin: 0 auto;
	padding: 0px 0px 10px 0px;
	width: 100%;
	overflow: hidden;
	display: table;
        table-layout: fixed;
        text-align: center;
        width: 100%;
}
 
ul.footer_menu li {
	margin: 0;
	padding: 0;
	border-left:	solid 1px #BBBBBB;
	display: table-cell;
	vertical-align:middle;
	list-style-type: none;
	font-size: 13px;
       line-height: 15px;
}
 
ul.footer_menu li a i{
	font-size: 24px;
}
 
ul.footer_menu li a {
	border: none;
	display: block;
	color: #FFFFFF;
	text-align: center;
	text-decoration: none;
}
 
.footer_menu {
	position: fixed;
	bottom: 0;
	left:0;
	background: #884444;
	z-index: 9999999999;
	-moz-opacity: 0.9;
	opacity: 0.9;
}
 
 
/**********************
SNSの部分
***********************/
 
 
.modal-window .modal-inner.sns{
	margin:0 auto;
	text-align:center;
}
.modal-inner ul {
	list-style:none;
}
.modal-inner li {
	list-style:none;
	float:left;
	width:25%;
	margin:3%;
}
.modal-inner li a {
	font-size:150%;
	position:relative;
	display:block;
	padding:10px;
	color:#fff;
	border-radius:6px;
	text-align:center;
	text-decoration: none;
}
.modal-inner li a:hover {
	box-shadow:none;
}
 
 
.share li a {display : block;
    padding : 10px 5px;
    color : #fff;
    font-size : 14px;
    text-decoration : none;
    text-align : center;}
.share li a:hover {opacity :0.8;
    color : #fff;}
.share li a:visited{ color: #fff;}
 
.tweet a{background-color : #55acee;}
.facebook a{background-color : #315096;}
.googleplus a{background-color : #dd4b39;}
.hatena a{background-color : #008fde;}
.line a{background-color: #00c300;}
.pocket a{background-color :#f03e51;}
.rss a {background-color: #ff8c00;}
.feedly a {background-color: #6cc655;}
 
.share-sm {margin:0;}
.share-sm ul:after {content : "";
    display : block;
    clear : both;}

/********************** 
メニューの部分
**********************/
 
.mod li{
  float:none;
  display:block;
  width:100%;
  margin:0;}
 
.mod li a {
  text-align: left;  /* メニューを左寄せ */
  font-weight: bold;  /* メニューを太字に */
  background: #000;  /* メニューの背景色 */
  margin: 2%;
font-size: 14px;  /* メニュー文字サイズ */
}

/********************** 
リンクの色（黒背景用）
**********************/
 

a:link {
color: #99CCCC;
}
a:visited {
color: #FFCC99;
}
a:active {
color: #FFFF00;
}