@charset "UTF-8";
/* 基本設定： ページ全体 */
*{
   margin: 0;
   padding: 0;
}
BODY{
   font-size : 16px;
   color : #2a2a2a;
   font-family: 'メイリオ' ,Meiryo, 'ヒラギノ角ゴ Pro W3' , 'Hiragino Kaku Gothic Pro' , 'ＭＳ Ｐゴシック' , 'Osaka' ,sans-serif;
}
IMG{
   border-style:none;
}
A IMG{
   border-style:none;
}
*, *::before, *::after{
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   -o-box-sizing: border-box;
   -ms-box-sizing: border-box;
   box-sizing: border-box;
}
/* 汎用クラス */
.hide{
   display: none;
}
/*---------------------------------
スマホ時改行 <BR class="br-sp"> 
---------------------------------*/
.br-sp{
   display:block;
}
/*---------------------------------
スマホ時改行 解除 <BR class="br-sp2">
---------------------------------*/
@media only screen and (max-width: 767px){
.br-sp2{
display: none;
}
}
/*------------------------------
文章・PC中央/スマホ左揃え <p class="align1">ああ</P>
------------------------------*/
.align1 {
text-align: center !important;
}
@media only screen and (max-width: 767px){
.align1 {
text-align: left !important;
}
}
/*===============================================
● モバイルファースト用（スマホ）
===============================================*/
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　ヘッダーメニュー　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
HEADER{
   background-color : rgba(255, 255, 255, 0.7);
   width : 100%;
   position : absolute;
   top : 0px;
   left : 0px;
   z-index: 100;
}
.head_rogo{
   line-height : 70px;
   background-color : #87bf28;
   padding-left : 20px;
   padding-right : 20px;
   display : inline-block;
   color : white;
   text-decoration : none;
   font-size : 6vw;
}
.head_menu UL{
   list-style: none;
}
.head_menu A{
   display: block;
   padding : 15px;
   color : black;
   font-size: 1em;
   text-decoration: none;
}
.head_menu A:hover{
   background-color : rgba(111, 156, 33, 0.7);
   color : white;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　トップイメージ　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.top-img{
   background-image : url(https://mugenpc.com/top/top-img2c.jpg);
   background-position: center;
   background-size: cover;
   height : 90vh;
   min-height : 450px;
   position : relative;

}
.top-img H1{
   font-size : 1.5em;
   margin-bottom : 10px;
}
.top-img H2{
   font-size : 1.3em;
   margin-bottom : 10px;
}
.top-img P{
   font-size : 1em;
}
.top-img_text{
   color : white;
   background-color : rgba(0, 0, 0, 0.2);
   position : absolute;
   top : 130px;
   padding : 12px 12px 12px 20px;
   width : 100%;
   height : auto;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　お知らせ　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.news{
   background-image : url(../top/);
   background-position: center;
   background-size: cover;
   background-color : #f6f6f6;
   height : auto;
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   -ms-flex-align: center;
   -webkit-box-align: center;
   -webkit-align-items: center;
   align-items: center;
   -ms-flex-pack: center;
   -webkit-box-pack: center;
   -webkit-justify-content: center;
   justify-content: center;
   padding-top : 25px;
   padding-bottom : 25px;
   padding-left : 15px;
   padding-right : 15px;
}
.news_text{
   text-align : center;
}
.news H2{
   font-size : 1.5em;
   margin-bottom : 10px;
}
.news H3{
   font-size: 1.22em;
   margin-bottom : 10px;
}
.insta_margin{
   padding-top : 10px;
   padding-bottom : 0px;
}
.anniversary{
   padding : 0px 0px 10px 0px;
   margin : 0px;
}
.news P{
   font-size : 1em;
   text-align : left;
   line-height: 1.5;
   margin-bottom : 10px;
}
.news H4{
   font-size : 1em;
   text-align : center;
   line-height: 1.8;
   margin-bottom : 5px;
}
/* もっと詳しく ボタン */
.news A{
   font-size : 0.938em;
   color : white;
   background-color : #7f7f7f;
   text-decoration : none;
   padding-top : 10px;
   padding-left : 40px;
   padding-right : 40px;
   margin-top : 10px;
   display : inline-block;
   padding-bottom : 10px;
   font-weight : normal;
}
.news A:hover{
   background-image: linear-gradient(
		rgba(255,255,255,0.2),
		rgba(255,255,255,0.2)
	);
}
/* 「こんな感じ」のリンクを通常に戻す為 */
.news A.link{
   color : blue;
   padding : 0px;
   margin : 0px;
   background-color : transparent;
   text-decoration : underline;
}
.news A:hover.link{
   font-weight : bold;
}
.news A.link3{
   color : blue;
   padding : 0px;
   margin : 0px;
   background-color : transparent;
   text-decoration : underline;
   font-weight : bold;
}

/* 5. 見学・ご相談 無料の「お問い合わせ」のリンクを通常に戻す為 */
.text A.link{
   color : blue;
   padding : 0px;
   margin : 0px;
   background-color : transparent;
   text-decoration : underline;
}
.text A:hover.link{
   font-weight : bold;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　TOP WP 制作実績　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.box2 .container{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-flex;
   display: flex;
   -ms-flex-wrap: wrap;
   -webkit-flex-wrap: wrap;
   flex-wrap: wrap;
   max-width: 1200px;
   margin: 30px auto;
}
.box2 ARTICLE{
   -ms-flex: 1 1 100%;
   -webkit-box-flex: 1 1 100%;
   -webkit-flex: 1 1 100%;
   flex: 1 1 100%;
   width: 100%;
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
}
.box2 A{
   -ms-flex: 1;
   -webkit-box-flex: 1;
   -webkit-flex: 1;
   flex: 1;
   margin: 10px;
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   border : 1px solid #acacac;
   text-decoration: none;
   color : #262626;
}
.box2 a:hover {
   opacity: 0.7;
   transition-duration: 0.7s;
}
.box2 .photo{
   -ms-flex: 2;
   -webkit-box-flex: 2;
   -webkit-flex: 2;
   flex: 2;
   width: 40%;
   min-height: 0;
   background-position: center;
   background-size: cover;
}
.box2 .text{
   -ms-flex: 3;
   -webkit-box-flex: 3;
   -webkit-flex: 3;
   flex: 3;
   width: 60%;
   margin: 10px;
}
.box2 H3{
   font-size: 17px;
   padding-left:7px;
}
.box2 P{
   font-size: 14px;
   padding-left:7px;
   opacity: 0.9;
}
/* --------------------------- 330px以下の場合（iPhone 5） --------------- */
@media screen and (max-width: 330px) {
.box2 H3{
   padding-left:0px;
}
.box2 P{
   padding-left:0px;
}
}
/* --------------------------- 384px以下の場合 --------------------------- */
@media (max-width: 384px) {
   .box2 .photo {
   -ms-flex: 1;
   -webkit-box-flex: 1;
   -webkit-flex: 1;
   flex: 1;
}
.box2 .text{
   padding-top : 12px;
   padding-bottom : 12px;
}
.box2 .container{
   margin: 20px auto 0px;
}
}
/* --------------------------- 768px以上（タブレット用） --------------------------- */
@media screen and (min-width:768px){
   .box2 ARTICLE{
   -ms-flex: 0 0 50%;
   -webkit-box-flex: 0 0 50%;
   -webkit-flex: 0 0 50%;
   flex: 0 0 50%;
   width: 50%;
}
}
/* ---------------------------1024px以上（PC用）--------------------------- */
@media screen and (min-width:1024px){
   .box2 ARTICLE{
   -ms-flex: 0 0 33.33%;
   -webkit-box-flex: 0 0 33.33%;
   -webkit-flex: 0 0 33.33%;
   flex: 0 0 33.33%;
   width: 33.33%;
}
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　コンテンツ1 三つの特徴　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.content1 H2{
   font-size : 1.5em;
   text-align : center;
   padding-top : 40px;
   padding-bottom : 15px;
   border-bottom-width : 1px;
   border-bottom-style : solid;
   border-bottom-color : #6f9d20;
   max-width : 1200px;
   margin-left : auto;
   margin-right : auto;
   color : #6f9d20;
}
.content1 .container{
   padding-top : 40px;
   padding-bottom: 0px;
}
.content1 .text{
   padding-left : 30px;
   padding-right : 30px;
   padding-bottom : 50px;
   text-align: center;
}
.content1 H3{
   margin-bottom: 10px;
   font-size: 1.22em;
}
.content1 P{
   font-size: 1em;
   line-height: 1.8;
   text-align : left;
}
.content1 .icon{
   display: inline-block;
   margin-bottom: 20px;
   font-size: 45px;
   width: 2em;
   line-height: 2em;
   border-radius: 50%;
   text-align: center;
   color : #6f9d20;
   border-width : 2px;
   border-style : solid;
   border-color : #6f9d20;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　コンテンツ2 選べる四つの受講スタイル　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/*---------------------------------
ポットキャスト
---------------------------------*/
.podcast{
   margin-top : 30px;
}
.content2 H2{
   font-size : 1.5em;
   text-align : center;
   padding-top : 10px;
   padding-bottom : 15px;
   border-bottom-width : 1px;
   border-bottom-style : solid;
   border-bottom-color : #6f9d20;
   max-width : 1200px;
   margin-left : auto;
   margin-right : auto;
   margin-bottom : 20px;
   color : #6f9d20;
}
.content2 .text{
   padding : 20px 15px 50px;
}
.content2 H3{
   margin-bottom : 0px;
   font-size : 1.3em;
}
.content2 H4{
   margin-bottom : 15px;
   font-size : 1em;
}
.content2 H5{
   font-size : 0.9em;
   line-height : 1.5;
   text-align : left;
   padding : 10px;
   margin-top : 10px;
   border-width : 1px;
   border-style : solid;
   border-color : #666666;
   font-weight : normal;
}
.content2 P{
   font-size: 1em;
   line-height: 1.8;
   text-align : left;
}
.content2 .photo{
   min-height: 350px;
   background-position: center;
   background-size: cover;
}
.content2 .detail{
   line-height : 1.8em;
}
.content2 .detail .large{
   font-size : 1.2em;
   font-weight : bold;
   padding-bottom : 15px;
}
.detail::after{
   content: "";
   clear: both;
   display: block;
}
.content2 .detail DT{
   float : left;
   clear : left;
   width : 95px;
}
.content2 .detail DD{
   float : left;
}
.content3 .text{
   padding : 20px 15px 50px;
}
.content3 H3{
   margin-bottom : 0px;
   font-size : 1.3em;
}
.content3 H4{
   margin-bottom : 15px;
   font-size : 1em;
}
.content3 H5{
   font-size : 0.9em;
   line-height : 1.5;
   text-align : left;
   padding-top : 10px;
   padding-left : 10px;
   padding-right : 10px;
   padding-bottom : 10px;
   margin-top : 10px;
   border-width : 1px;
   border-style : solid;
   border-color : #666666;
   font-weight : normal;
}
.content3 P{
   font-size: 1em;
   line-height: 1.8;
   text-align : left;
}
.content3 .photo{
   min-height: 350px;
   background-position: center;
   background-size: cover;
}
.content3 .detail{
   line-height : 1.8em;
}
.content3 .detail .large{
   font-size : 1.2em;
   font-weight : bold;
   padding-bottom : 15px;
}
.detail::after{
   content: "";
   clear: both;
   display: block;
}
.content3 .detail DT{
   float : left;
   clear : left;
   width : 95px;
}
.content3 .detail DD{
   float : left;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　人気の講座　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.course H2{
   font-size : 1.5em;
   text-align : center;
   padding-bottom : 15px;
   border-bottom-width : 1px;
   border-bottom-style : solid;
   border-bottom-color : #4d720d;
   max-width : 1200px;
   margin-left : auto;
   margin-right : auto;
   margin-bottom : 20px;
   color : #6f9d20;
   margin-top : 10px;
}
.course .container{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   -ms-flex-wrap: wrap;
   -webkit-flex-wrap: wrap;
   flex-wrap: wrap;
   max-width: 1200px;
   margin-bottom : 25px;
   margin-right : auto;
   margin-left : auto;
}
.course ARTICLE{
   -ms-flex: 1 1 100%;
   -webkit-box-flex: 1 1 100%;
   -webkit-flex: 1 1 100%;
   flex: 1 1 100%;
   width: 100%;
   margin-right : 5px;
   margin-left : 5px;
   margin-bottom : 30px;
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
}
.course H3{
   font-size: 1.3em;
   margin-bottom : 10px;
}
.course P{
   font-size: 1em;
   line-height: 1.8;
   text-align : justify;
}
.course .photo{
   min-height: 385px;
   background-position: center;
   background-size: cover;
   margin-bottom : 15px;
}
.course A{
   display: block;
   border : 1px solid #797979;
   color : #262626;
   text-decoration: none;
   padding : 10px 5px 5px;
   -ms-flex: 1;
   -webkit-box-flex: 1;
   -webkit-flex: 1;
   flex: 1;
}
.course a:hover {
   opacity: 0.7;
transition-duration: 0.7s;
}
.course .text{
   padding-top : 10px;
   padding-left : 10px;
   padding-right : 10px;
   padding-bottom : 0px;
}
/* もっと詳しく ボタン */
.course H5{
   font-size : 0.938em;
   color : white;
   background-color : #7f7f7f;
   text-decoration : none;
   padding-top : 10px;
   padding-left : 30px;
   padding-right : 30px;
   padding-bottom : 10px;
   margin-top : 20px;
   display : inline-block;
   margin-left : 10px;
   font-weight : normal;
   margin-bottom : 20px;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　パソコン修理と作成代行　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* もっと詳しく ボタン */
.content2 A{
   font-size : 0.938em;
   color : white;
   background-color : #bf6a7a;
   text-decoration : none;
   padding-top : 10px;
   padding-left : 30px;
   padding-right : 30px;
   padding-bottom : 10px;
   margin-top : 20px;
   display : inline-block;
}
.content2 A:hover{
   background-image: linear-gradient(
		rgba(255,255,255,0.2),
		rgba(255,255,255,0.2)
	);
}
.content3 A{
   font-size : 0.938em;
   color : white;
   background-color : #bf6a7a;
   text-decoration : none;
   padding-top : 10px;
   padding-left : 30px;
   padding-right : 30px;
   padding-bottom : 10px;
   margin-top : 20px;
   display : inline-block;
}
.content3 A:hover{
   background-image: linear-gradient(
		rgba(255,255,255,0.2),
		rgba(255,255,255,0.2)
	);
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　講師の紹介　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.introduction1 H2{
   font-size : 1.5em;
   text-align : center;
   padding-bottom : 15px;
   border-bottom-width : 1px;
   border-bottom-style : solid;
   border-bottom-color : #4d720d;
   max-width : 1200px;
   margin-left : auto;
   margin-right : auto;
   margin-bottom : 20px;
   color : #6f9d20;
   margin-top : 10px;
}
.introduction1 .text{
   padding : 20px 15px;
}
.introduction1 H3{
   margin-bottom : 0px;
   font-size : 1.3em;
}
.introduction1 H4{
   margin-bottom : 15px;
   font-size : 1em;
}
.introduction1 .photo{
   background-image : url(../top/introduction1.jpg);
   min-height: 700px;
   background-position: center;
   background-size: cover;
}
.introduction1 .detail{
   line-height : 1.8em;
}
.introduction1 .detail SPAN{
   color : red;
}
.introduction1 .detail A{
   font-weight : bold;
}
.introduction1 .detail A:hover{
   text-decoration : none;
}
.introduction1 .detail DT{
   width : 200px;
   font-weight : bold;
}
.introduction1 .detail DD{
   margin-bottom : 10px;
}
/* もっと詳しく ボタン */
.introduction1 A.linkb{
   font-size : 0.938em;
   color : white;
   background-color : #bf6a7a;
   text-decoration : none;
   padding-top : 10px;
   padding-left : 30px;
   padding-right : 30px;
   padding-bottom : 10px;
   margin-top : 10px;
   display : inline-block;
}
.introduction1 A:hover.linkb{
   background-image: linear-gradient(
		rgba(255,255,255,0.2),
		rgba(255,255,255,0.2)
	);
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　スクールの紹介　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.introduction2 H2{
   font-size : 1.5em;
   text-align : center;
   padding-bottom : 15px;
   border-bottom-width : 1px;
   border-bottom-style : solid;
   border-bottom-color : #4d720d;
   max-width : 1200px;
   margin-left : auto;
   margin-right : auto;
   margin-bottom : 20px;
   color : #6f9d20;
   margin-top : 40px;
}
.introduction2 .text{
   padding : 20px 15px;
}
.introduction2 H3{
   margin-bottom : 0px;
   font-size : 1.3em;
}
.introduction2 H4{
   margin-bottom : 15px;
   font-size : 1em;
}
.introduction2 H5{
   font-size : 0.9em;
   line-height : 1.5;
   text-align : left;
   padding-top : 10px;
   padding-left : 10px;
   padding-right : 10px;
   padding-bottom : 10px;
   margin-top : 10px;
   border-width : 1px;
   border-style : solid;
   border-color : #666666;
   font-weight : normal;
}
.introduction2 P{
   font-size: 1em;
   line-height: 1.8;
   text-align : justify;
   margin-bottom : 20px;
}
.introduction2 SPAN{
   color : red;
}
.introduction2 .photo{
   background-image : url(../top/introduction2.jpg);
   min-height: 500px;
   background-position: center;
   background-size: cover;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　アクセス　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.access{
   margin-bottom : 20px;
}
.access H2{
   font-size : 1.5em;
   text-align : center;
   padding-bottom : 15px;
   border-bottom-width : 1px;
   border-bottom-style : solid;
   border-bottom-color : #4d720d;
   max-width : 1200px;
   margin-left : auto;
   margin-right : auto;
   margin-bottom : 20px;
   color : #6f9d20;
   margin-top : 10px;
}
.access .text{
   padding : 20px 15px 50px;
}
.access H3{
   margin-bottom : 10px;
   font-size : 7.6vw;
}
.access H3 A{
   font-size : 7.6vw;
}
/* メールフォームへボタン */
.access H4 A{
   font-size : 1em;
   color : white;
   background-color : #87bf28;
   text-decoration : none;
   padding-top : 15px;
   padding-left : 25px;
   padding-right : 25px;
   padding-bottom : 15px;
   display : inline-block;
}
.access A:hover{
   background-image: linear-gradient(
		rgba(255,255,255,0.2),
		rgba(255,255,255,0.2)
	);
}
.access P{
   font-size: 1em;
   line-height: 1.8;
   text-align : left;
}
.access .map{
   height: auto;
}
.map .ggmap{
   position: relative;
   padding-bottom: 56.25%;
   padding-top: 30px;
   height: 0;
   overflow: hidden;
}
.ggmap IFRAME,
.ggmap OBJECT,
.ggmap EMBED{
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}
.access .detail{
   line-height : 1.8em;
   margin-bottom : 5px;
}
.access .detail .large{
   font-size : 1.2em;
   font-weight : bold;
   padding-bottom : 15px;
}
.detail::after{
   content: "";
   clear: both;
   display: block;
}
.access .detail DT{
   float : left;
   clear : left;
   width : 95px;
}
.access .detail DD{
   float : left;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　フッター用（全共通）　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
FOOTER{
   width: 100%;
   padding: 15px 20px;
   background: #000;
}
FOOTER .container{
   max-width : 1200px;
   margin-left : auto;
   margin-right : auto;
}
FOOTER UL{
   width: 100%;
   margin-bottom : 10px;
   list-style-type: none;
}
FOOTER LI{
   width: 50%;
   float: left;
}
@media screen and (min-width:768px) {
   FOOTER UL{
   max-width : 700px;
}
FOOTER LI{
   width: 33.33%;
}
}
FOOTER LI A{
   display: block;
   color : white;
   font-size : 0.9em;
   line-height: 45px;
   padding-left : 20px;
   text-decoration: none;
}
@media screen and (min-width:768px) {
   FOOTER LI A{
   line-height : 20px;
   padding-right : 10px;
   padding-top : 5px;
   padding-bottom : 5px;
}
}
FOOTER LI A:hover{
   background: #C30;
}
FOOTER UL::after{
   display: table;
   content: "";
   clear: both;
}
#copyright{
   text-align: right;
   color : white;
   font-size : 0.85em;
   border-top-width : 1px;
   border-top-style : solid;
   border-top-color : white;
   padding-top : 8px;
}
@media screen and (min-width:600px) {
   #copyright BR{
   display: none;
}
}
@media screen and (max-width:360px) {
   #copyright{
   font-size : 0.7em;
}
FOOTER LI A{
   font-size : 0.8em;
   padding-left: 5px;
}
}
/*===============================================
● 360px以下　iPhone 5 / Galaxy S5 用
===============================================*/
@media screen and (max-width: 359px) {
   /* 人気の講座 */
   .course .photo{
   min-height: 330px;
}
/* アクセス */
.access H4 A{
   font-size : 2.8vh;
   padding-top : 10px;
   padding-left : 10px;
   padding-right : 10px;
   padding-bottom : 10px;
}
.access H3{
   font-size : 7.8vw;
}
.access H3 A{
   font-size : 7.8vw;
}
/* お知らせ */
.news p{
   padding-left : 18px;
   padding-right : 18px;
}
}

/*===============================================
● 415px以下　iPhone 6-8 Plus / Nexus6 用
===============================================*/
@media screen and (min-width: 400px) and (max-device-width: 415px)  {
/* アクセス */
.access H3{
   font-size : 6.9vw;
}
.access H3 A{
   font-size : 6.9vw;
}
}
/*==================================================
● 画面の横幅が500px以上767px以下（Nexus7用）
==================================================*/
@media screen and (min-width: 500px) and (max-device-width: 767px) {
   /* 人気の講座 */
   .course .photo{
   min-height: 600px;
}
/* アクセス */
.access H3{
   font-size : 4.7vw;
}
.access H3 A{
   font-size : 4.7vw;
}
}
/*===============================================
● 767px以下　スマホ（トグルボタン）
===============================================*/
@media screen and (max-width: 767px) {
   header .container-small {
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   -ms-flex-align: center;
   -webkit-box-align: center;
   -webkit-align-items: center;
   align-items: center;
   -ms-flex-pack: justify;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   justify-content: space-between;
}
.toggle{
   margin-right: 25px;
   padding: 0;
   border: none;
   outline: none;
   background: none;
   font-size: 30px;
   opacity: 0.9;
   cursor: pointer;
color:#000;
}

.head_menu{
   display: none;
}
HEADER{
   background-color : rgba(255, 255, 255, 0.95);
}
}
/*===============================================
● ● 画面の横幅が768px以上: タブレットとPC用
===============================================*/
@media screen and (min-width:768px){
   .br-sp{
   display:none;
}
  a[href^="tel:"]{
    pointer-events: none;
    text-decoration: none;
    color:#2a2a2a;
  }
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　ヘッダーメニュー　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.head_rogo{
   font-size : 24px;
}
HEADER .container{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   -ms-flex-align: center;
   -webkit-box-align: center;
   -webkit-align-items: center;
   align-items: center;
   -ms-flex-pack: justify;
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
   justify-content: space-between;
}
.head_menu UL{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
}
.head_menu{
   display: block !important;
}
.toggle{
   display: none;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　トップイメージ　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.top-img H1{
   font-size : 2.1em;
}
.top-img{
   background-image : url(../top/top-img1d.jpg);
}
.top-img H2{
   font-size : 1.4em;
}
.top-img P{
   font-size : 1.4em;
   font-weight : bold;
}
.top-img_text{
   background-color : rgba(0, 0, 0, 0.3);
   position : absolute;
   top : 150px;
   padding : 20px;
   width : auto;
   height : auto;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　お知らせ　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.news H2{
   font-size : 1.8em;
}
.news P{
   text-align : left;
   line-height: 1.8;
   margin-bottom : 5px;
   max-width: 630px;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　三つの特徴　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.content1 .container{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   max-width: 1200px;
   margin-left: auto;
   margin-right: auto;
}
.content1 .text{
   -ms-flex: 1;
   -webkit-box-flex: 1;
   -webkit-flex: 1;
   flex: 1;
   width: 33.333%;
}
.content1 H2{
   font-size : 1.8em;
   padding-bottom : 25px;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　選べる三つの授業スタイル　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.content2 H2{
   font-size : 1.8em;
   padding-top : 30px;
   padding-bottom : 25px;
}
.content2 .container{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   max-width: 1200px;
   margin-left: auto;
   margin-right: auto;
}
.content2 .photo{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%;
}
.content2 .text{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%;
   padding: 50px;
}
.content3 .container{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   -ms-flex-direction: row-reverse;
   -webkit-flex-direction: row-reverse;
   flex-direction: row-reverse;
   max-width: 1200px;
   margin-left: auto;
   margin-right: auto;
}
.content3 .photo{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%
;
}
.content3 .text{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%;
   padding: 50px;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　人気の講座　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.course H2{
   font-size : 1.8em;
   margin-top : 90px;
   padding-bottom : 25px;
}
.course ARTICLE{
   -ms-flex: 1 1 31.5%;
   -webkit-box-flex: 1 1 31.5%;
   -webkit-flex: 1 1 31.5%;
   flex: 1 1 31.5%;
   width: 31.5%;
   margin-right : 10px;
   margin-left : 10px;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　講師の紹介　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.introduction1 H2{
   font-size : 1.8em;
   margin-top : 90px;
   padding-bottom : 25px;
}
.introduction1 .container{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   -ms-flex-direction: row-reverse;
   -webkit-flex-direction: row-reverse;
   flex-direction: row-reverse;
   max-width: 1200px;
   margin-left: auto;
   margin-right: auto;
}
.introduction1 .photo{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%;
}
.introduction1 .text{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%;
   padding-top : 25px;
   padding-left : 30px;
   padding-right : 30px;
   padding-bottom : 10px;
}
.introduction1 H4{
   margin-bottom : 30px;
}
.introduction1 .text DL{
   margin-right : 20px;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　スクールの紹介　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.introduction2 H2{
   font-size : 1.8em;
   margin-top : 90px;
   padding-bottom : 25px;
}
.introduction2 .container{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   max-width: 1200px;
   margin-left: auto;
   margin-right: auto;
}
.introduction2 .photo{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%;
}
.introduction2 .text{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%;
   padding-top : 25px;
   padding-left : 42px;
   padding-right : 30px;
   padding-bottom : 10px;
}
.introduction2 H4{
   margin-bottom : 30px;
}
.introduction2 .text DL{
   margin-right : 20px;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タブレットとPC　アクセス　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.access H2{
   font-size : 1.8em;
   margin-top : 90px;
   padding-bottom : 25px;
}
.access .container{
   -js-display: flex;
   display: -ms-flexbox;
   display: -webkit-box;
   display: -webkit-flex;
   display: flex;
   max-width: 1200px;
   margin-left: auto;
   margin-right: auto;
}
.access .map{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%;
}
.access .text{
   -ms-flex: 1 1 50%;
   -webkit-box-flex: 1 1 50%;
   -webkit-flex: 1 1 50%;
   flex: 1 1 50%;
   max-width: 50%;
   padding : 20px 5px 0px 40px;
}
.access H3{
   font-size : 28px;
}
.access H3 A{
   font-size : 28px;
}
}
/*==================================================
● 画面の横幅が768px以上1090px以下（タブレット専門）
==================================================*/
@media screen and (min-width: 768px) and (max-device-width: 1090px) {
   /* ヘッダーメニュー */
.head_rogo{
   font-size : 21px;
}
.head_menu A{
   padding : 15px 7px;
   font-size: 13px;
}
/* トップイメージ */
.top-img H1{
   font-size : 2.2em;
}
.top-img_text{
   position : absolute;
   top : 140px;
   width : 100%;
   height : auto;
}
/* コンテンツ1： 三つの特徴 */
.content1 H3{
   font-size: 1.1em;
}
/* 人気の講座 */
.course ARTICLE{
   -ms-flex: 0 0 47.3%;
   -webkit-box-flex: 0 0 47.3%;
   -webkit-flex: 0 0 47.3%;
   flex: 0 0 47.3%;
   width: 47.3%;
}
/* 講師の紹介 */
.introduction1 .photo{
   background-image : url(../top/introduction1b.jpg);
   min-height: 800px;
}
/* スクール紹介 */
.introduction2 .photo{
   background-image : url(../top/introduction2b.jpg);
   min-height: 700px;
}
}
/*==================================================
● 画面の横幅が1024px以上1090px以下（i-Pad pro用）
==================================================*/
@media screen and (min-width: 1024px) and (max-device-width: 1090px) {
   /* 人気の講座 */
   .course .photo{
   min-height: 480px;
}
/* 講師の紹介 */
.introduction1 .photo{
   background-image : url(../top/introduction1.jpg);
}
/* スクール紹介 */
.introduction2 .photo{
   background-image : url(../top/introduction2.jpg);
}
/* アクセス */
.access H3{
   font-size : 2.8vw;
}
.access H3 A{
   font-size : 2.8vw;
}
}