@charset "utf-8";

/*全端末（PC・タブレット・スマホ）共通設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
body {
	margin: 0 auto;  /*もとはautoは書いていない*/
	padding: 0px;
    max-width: 1040px;
    color: #333;
	font-family: "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	/*フォント種類*/
	font-size: 18px;	/*文字サイズ*/
	line-height: 1.9;		/*行間*/
	background: #fff;	/*背景色*/
	-webkit-text-size-adjust: none;
}
h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form {margin: 0px;padding: 0px;font-size: 100%;font-weight: normal;}
ul {list-style-type: none;}
ol {padding-left: 40px;padding-bottom: 15px;}
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}
table {border-collapse:collapse;font-size: 90%;border-spacing: 0;}
iframe {width: 100%;}

/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
	color: #333;		/*リンクテキストの色*/
	transition: 0.2s;	/*マウスオン時の移り変わるまでの時間設定。0.2秒*/
}
a:hover {
	color: #1647a8;			/*マウスオン時の文字色*/
	text-decoration: none;	/*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
}
.modoru {
    width: 200px;
    position:relative;
    left: 5%;
    top: -10px;
    font-size: 90%;
}


/*コンテナー（ホームページを囲むブロック）
---------------------------------------------------------------------------*/
#container {
	max-width: 1040px;	/*slide.cssの「#mainimg, #subimg」と設定と合わせる*/
	margin: 0 auto 22px;
	border-top: 4px solid #e5831f;	/*一番上に入っているアクセントライン。幅、線種、色。*/
}

/*ヘッダー
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
	position: relative;
    z-index: 1;
	height: 140px;	/*ヘッダーの高さ*/
	background: #fff;	/*背景色*/
}
/*ロゴ画像*/
header #logo img {
	width: 300px;	/*画像幅*/
	position: absolute;
	left: 3%;		/*ヘッダーに対して左から3%の場所に配置*/
	top: 38px;	/*ヘッダーに対して上から38pxの場所に配置*/
}
/*フォームのみのヘッダー設定--------------------------*/
.formstyle header {
	position: relative;
    z-index: 1;
	height: 110px;
	background: #fff;	
}

/*ヘッダー内メニュー
色などの他の指定は下の方の「a.btn1」で指定。
---------------------------------------------------------------------------*/
/*メニューブロック全体*/
#headermenu {
	position: absolute;
	right: 4%;		/*headerに対して右から3%の場所に配置*/
	bottom: 15px;	/*headerに対して下から15pxの場所に配置*/
}
/*メニュー１個あたり*/
#headermenu li {
	float: left;	/*左に回り込み*/
	margin-left: 10px;	/*メニュー同士の余白*/
    font-size: 84%;
}
#headermenu li a.btn1 {
	padding: 0px 15px 0px 30px;	/*上、右、下、左へのボックス内の余白*/
}
/*トップイメージ写真の上の飾り*/
.kei {
    padding: 0px 4%;
}
.message1 {
    padding: 4px 10%;
    text-align: center;
    font-size: 90%;
}
.message2 {
    padding: 4px 10% 20px;
    text-align: center;
    font-size: 80%;
}
.topgroup {
    position: relative;
    margin: 0 auto;
    padding: 0px;
 }
.topgroup-in {
    position: absolute;
    width:15%;
    top: 12%;left: 5%;
}

/*btn1
---------------------------------------------------------------------------*/
/*btn1共通*/
a.btn1 {
	text-decoration: none;
    display: inline-block;
	background: #e5831f url(../images/arrow1.png) no-repeat 15px center;	/*古いブラウザ用*/
	background: #e5831f url(../images/arrow1.png) no-repeat 15px center / 6px;	/*背景色、背景の矢印画像の読み込み、左から15pxの場所に配置。幅を6pxに。*/
	color: #fff;
	border: 1px solid #e5831f;
	border-radius: 2px;			/*角丸のサイズ。*/
}
/*マウスオン時*/
a.btn1:hover{
	background: #ff9223 url(../images/arrow1.png) no-repeat 15px center / 6px;
}
/*contents内のbtn1*/
#contents a.btn1 {
	padding: 0px 35px 0px 50px;	/*上、右、下、左へのボックス内の余白*/
	letter-spacing: 0.2em;		/*文字間隔を広くとる設定*/
}

/*メインメニュー
---------------------------------------------------------------------------*/
/*デフォルトのメニューブロック*/

.mask {
    width: auto;
    height: 90px;
    object-fit: cover; /*写真の高さだけ切り取り*/
}

/*トップページのメニューブロック*/
body.home #menubar {
    clear: both;
    position: relative;
    z-index: 1;
	margin-left: 5%;	/*左に空けるスペース*/
    font-size: 70%;	/*70% メニューのテキストが段落ちするので、縮小する。*/
	margin-top: 40%;	/*上に空けるスペース。この部分にスライドショーが表示される。*/
}
/*コースインデックスページのメニューブロック*/
body.home2 #menubar {
    clear: both;
    position: relative;
    z-index: 1;
	margin-left: 5%;
    font-size: 70%;	
	margin-top: 8%;	
}
/*スペシャルコンテンツページのコンテンツ*/
body.home3 #contents {
    clear: both;
    position: relative;
    z-index: 1;
	margin-left: 2%;
	margin-top: 22%;	
} 
/*コースページのメニューブロック*/
body.course #menubar {
    clear: both;
    position: relative;
    z-index: 1;
	margin-left: 5%;
    font-size: 70%;	
	margin-top: 25%;
}
body.gaiyou #menubar {
    clear: both;
    position: relative;
    z-index: 1;
	margin-left: 5%;
    font-size: 70%;	
	margin-top: 9%;	
}
body.fandq #menubar {
    clear: both;
    position: relative;
    z-index: 1;
	margin-left: 5%;
    font-size: 70%;	
	margin-top: 21%;	
}
body.kounyu #menubar {
    clear: both;
    position: relative;
    z-index: 1;
	margin-left: 5%;
    font-size: 70%;	
	margin-top: 9%;	
}


/*メニュー１個あたりの設定*/
body.home #menubar li {
	float: left;	/*左に回り込み*/
	width: 15%;		/*メニュー幅*/
	margin: 2px 0.4%;	/*0.4%はメニュー同士の左右間の余白。*/
}
body.home2 #menubar li {
	float: left;	/*左に回り込み*/
	width: 15%;		/*メニュー幅*/
	margin: 10px 0.4%;	/*0.4%はメニュー同士の左右間の余白。*/
}

#menubar li {
	float: left;	/*左に回り込み*/
	width: 15%;		/*メニュー幅*/
	margin: 20px 0.4%;	/*トップページ以外のメニューバーの高さ設定*/
}
#menubar li a {
    display: block;
    text-decoration: none;
    position: relative;
    text-align: center;	/*内容をセンタリング*/
    padding: 15px 0;	/*上下、左右へのボックス内の余白*/
    background: #fff;	/*背景色（古いブラウザ用）*/
    background: rgba(255,255,255,0.85);	/*背景色。255,255,255は白の事で0.85は85%色がついた状態の事。*/
    font-size: 16px;
    border: 2px solid #f58631;
}
/*飾り文字*/
#menubar li span {
	display: block;
	font-size: 80%;	
	color: #e5831f;	
	letter-spacing: 0.2em;
}
/*飾り文字のマウスオン時、現在表示中(current)時*/
#menubar li a:hover span,
#menubar li.current a span {color: #fff;}

/*メニュー下の「▼」マーク。吹き出し風に。*/
#menubar li.current a span::after {
	content: "▼";	/*このテキストを表示。機種依存文字は化ける場合があるので使わない*/
	color: #e5831f;	
	font-size: 20px;
	position: absolute;
	bottom: -22px;	/*下側に22px下げる*/
	left: 45%;		/*左から45%の場所に配置*/
}

/*マウスオン時と、現在表示中(current)メニューの設定*/
#menubar li a:hover,
#menubar li.current a {
	background: #e5831f;
	color: #fff;
	padding: 15px 0;	/*上下、左右へのボックス内の余白*/
}
/*スマホ用メニューを表示させない*/
#menubar-s {display: none;}
/*３本バーアイコンを表示させない*/
#menubar_hdr {display: none;}
/*---３本バーブロック ここでは見えない---------------*/
#menubar_hdr {
	display: none;
	position: absolute;z-index: 2;
	top: 29px;
	right: 4%;
	border: 1px solid #fff;
}
/*------アイコン共通設定　ここでは使用しない--------*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 50px;
	height: 50px;
}
/*---三本バーアイコン　背景色、背景画像の読み込み、画像の上半分（３本マーク）を表示。幅は50px。------*/
#menubar_hdr.close {
	background: #e5831f url(../images/icon_menu.png) no-repeat center top/50px;	
}
/*---閉じるアイコン　背景色、背景画像の読み込み、画像の下半分（×マーク）を表示。幅は50px。---*/
#menubar_hdr.open {
	background: #e5831f url(../images/icon_menu.png) no-repeat center bottom/50px;
} 

/*コンテンツ。メニューの下にある白い背景色のブロック。
---------------------------------------------------------------------------*/
#contents {
	clear: both;
    overflow: hidden;
    position: relative;
	background: #fff; 
	padding: 5% 3%;		/*上下、左右へのボックス内の余白*/
	margin: 0 2% 20px;	/*上、左右、下へのボックスの外側への余白*/
}

/*mainのほうのsection同士の余白*/
#contents section + section {
	margin-top: 45px;
}

/*コンテンツの分割--------------------------*/
/*メインコンテンツ*/
#formstyle #contents .main {
    width: 94%;
    margin: auto;
}
#contents .main {
	float: left;	/*左に回り込み*/
	width: 70%;		/*コンテンツ幅*/
}
/*サブコンテンツ*/
#contents .sub {
	float: right;	/*右に回り込み*/
	width: 27%;		/*コンテンツ幅*/
}
/*サブコンテンツの設定----------------------*/
/*サブコンテンツのh2タグ*/
#contents .sub h2 {
	font-size: 92%;
    line-height: 22px;
	margin-bottom: 8px;
	text-align: left;
}
/*サブコンテンツのh2タグの１文字目への設定*/
#contents .sub h2::first-letter {
	padding-left: 15px;		/*アクセントラインとテキストとの余白*/
    border-left: 3px solid #fff;
}
/*サブコンテンツの段落タグ設定*/
#contents .sub p {
	padding: 0;
	font-size: 90%;
}
/*section同士の余白*/
#contents .sub section + section {
	margin-top: 10px;
}

/*サブコンテンツ内のbox1-------------------------------------*/
.subgrp {
    margin-bottom: 10px;
}
.subw2 {margin-bottom: 20px;}
.sub .box1 {
	padding: 10px;			/*ボックス内の余白*/
    background: rgba(245,134,49,0.60);
	border: solid 1px #dcdcdc;	/*線の線種、幅、色*/
	box-shadow: 0px 0px 1px 1px #fff inset;	/*ボックスの影。内側に白のラインを入れる。*/
}
/*box1内のメニューの設定*/
.sub .box1 ul {
    background: #fff;	/*背景色*/
	border-bottom: solid 1px #dcdcdc;	/*下の線の線種、幅、色*/
	border-top: solid 1px #dcdcdc;	/*上の線の線種、幅、色*/
    margin-bottom: 0px;	/*メニューブロックの下に空けるスペース*/
}
.sub .box1 li {
    border-bottom: solid 1px #dcdcdc;
    line-height: 140%;
    font-size: 75%; 
    padding:6px 6px;
}
.sub ul li a {
    text-decoration: none;
    display: block;
}
/*連絡先はこちらのボックス*/
.sub .box2 {
	padding: 10px;
    background: rgba(251,227,131,1.00);
	border: solid 1px #dcdcdc;
	box-shadow: 0px 0px 1px 1px #fff inset;
}
.sub .box2 ul { 
    background: #fff;
	border-bottom: solid 1px #dcdcdc;
	border-top: solid 1px #dcdcdc;
    margin-bottom: 0px;  
}
.sub .box2 li {
    border-bottom: solid 1px #dcdcdc;
    font-size: 75%;
    line-height: 160%;
    padding: 5px 6px;	
}
/*box4　青いやつ*/
.sub .box4 {
	padding: 10px;
    background: rgba(82,187,246,0.85);
	border: solid 1px #dcdcdc;
	box-shadow: 0px 0px 1px 1px #fff inset;
}
.sub .box4 ul { 
    background: #fff;
	border-bottom: solid 1px #dcdcdc;
	border-top: solid 1px #dcdcdc;
    line-height: 140%;
    margin-bottom: 0px;   
}
.sub .box4 li {
    border-bottom: solid 1px #dcdcdc;
    font-size: 75%;
    padding: 5px 6px;
}
/*box6　更新情報お知らせ*/
.sub .box6 {
	padding: 10px;
    background: rgba(248,124,30,1.00);
	border: solid 1px #dcdcdc;
	box-shadow: 0px 0px 1px 1px #fff inset;
}
.sub .box6 ul { 
    background: #FED8BB;
	border-bottom: solid 1px #dcdcdc;
	border-top: solid 1px #dcdcdc;
    line-height: 110%;
    margin-bottom: 0px;   
}
.sub .box6 li {
    border-bottom: solid 1px #dcdcdc;
    font-size: 75%;
    padding: 2px 6px;
}

/*--box3　ベスト曲の緑のボックス-----*/
.sub .box3 {
	padding: 10px;
    background: rgba(70,167,16,0.60);
	border: solid 1px #dcdcdc;
	box-shadow: 0px 0px 1px 1px #fff inset;
}
.sub .box3 ul {
	margin-bottom: 4px;
    border-top: solid 1px #dcdcdc;
    background: #fff;
}
.sub .box3 li {
	border-bottom: solid 1px #dcdcdc;
    font-size: 75%;
    line-height: 105%;
	padding: 5px 5px;
}
/*box5　バナー用*/
.sub .box5 {
	padding: 0px;			
}
.sub .banner-s{
    display: flex;
    flex-direction: column;
    margin: 0px 0;padding: 6px 6px;
    -webkit-box-shadow: 1px 1px 4px 1px rgba(173,173,173,0.5);
    box-shadow: 1px 1px 4px 1px rgba(173,173,173,0.5);
}
.backc1 {background:rgba(225,255,228,0.80);}

/*ページ内専用メニュー　------------------------------------------*/
.nav {
	text-align: center;
	margin-bottom: 40px;
	background: #eee;
	padding: 10px;
}
.nav li {
	display: inline-block;
	padding: 0 10px;
}
.nav li::before {
	content: "> ";
	color: #e5831f;
}
.pop {
  margin: 0px auto 20px;
  padding: 25px 15%;    
}
.pop img {width:auto;height:auto;}
.pop2 {
  margin: auto;
  padding: 0 2% 15px;     
}
.pop2 p {
    font-size: 92%;
    margin : 15px 0;
}
.catch2 {
    margin: 0 auto;
    padding-top: 15px;
    text-align: center;
    font-size: 100%;
    color:#4169e1;
}

/*---本文　いろいろ共通　--------------*/
.honbun {margin-bottom: 17px;}
.honbun p {
    font-size: 87%;
    line-height: 1.8;
    text-align: justify;
}
.honbun p + p {margin-top: 15px;}
.just {text-align: justify;}
.gainatesaki {
    padding: 10px 5%;
    margin: auto;
    margin-bottom: 25px;
    width: 425px;
    border: 2px solid #F58631;
    font-size: 88%;
    -webkit-box-shadow: inset 2px 2px 8px 6px #FBDAC0;
    box-shadow: inset 2px 2px 8px 6px #FBDAC0;
}
.voipa {
    margin: auto;
    padding: 10px 10px 30px;
    font-size: 88%;
}

/*------各ページの設定----------------------*/
/*----トップページ----*/
.ofh {overflow: hidden;
    margin-bottom: 30px;
    width: 100%;
}
.home #contents h2 {
	clear: both; 
	margin-bottom: 30px;
	font-size: 155%;
	text-align: center;
	line-height: 1.5;       
}
/*h2の上にまる*/
.maru p {
    text-align: center;
    font-size: 160%;
    color: #ff8c00;
}
/*h2タグ内のspanタグ（英語の飾り文字）*/
.home h2 span {
	display: block;
	font-size: 60%;
    line-height: 1.8;
	color: #e5831f;
	letter-spacing: 0.2em;
    margin-bottom: 45px;   /*写真のための調整*/
}
/*h3の頭のマーク*/
.mark1 {
    width: 46px;
    height: auto;
    margin-bottom: 6px;
    margin-right:-5px;
}
/*トップページの頭の3つのポイント-------------------------*/
#toppoint {
    margin: 0 auto;
    margin-bottom: 20px;
    padding: 0 2%;
    display: flex;
    flex-direction: row;
    justify-content:space-around;    
}
.list2 {
	width: 29%;	    
}
.list2 figure {
    width:70%;
    margin: 0 auto 15px;
}
.list2 figure a:hover {
	opacity: 0.8;	/*マウスオン時。透明度80%にする。*/
}
.pointbun {
    width: 100%;
}
.pointbun h4 {
	background: #fd7208;	/*背景色（古いブラウザ用）_元は000*/
	background: rgba(255,135,43,0.8);	/*背景色。*/
	color: #fff;
    font-size: 110%; 
    text-align: center;
    margin-bottom: 12px;
}
.pointbun p {
    font-size: 87%;
    line-height: 1.6;
    font-feature-settings: "pwid";
    text-align: justify;
}
/* 左右に文と写真を配置するとき　*/
.usiro-le {position: relative;}
.usiro-le img {
    position: absolute;
    top: 0;
    left: 0;
    width: 25%;
    height:auto;
}
.usiro-ri {position: relative;}
.usiro-ri img {
    position: absolute;
    top: 0;
    right: 0;
    width: 25%;
    height: auto;
}
/*--トップページのコース案内改訂--*/
.listwrap {
    margin: 10px auto 20px;
    flex-wrap: wrap; 
    justify-content: space-around;   
}
.ta9 {
    margin: 10px 4%;
    padding: 8px 10px;
    background-color: #fff9f4;
    -webkit-box-shadow: 2px 2px 3px rgba(114,110,110,0.75);
    box-shadow: 2px 2px 3px rgba(114,110,110,0.75);
}
.ta9 h4 {
    font-size: 110%;
    line-height: 2;
    border: 2px dotted #F16E0B;
    border-radius: 57px;
    margin-bottom: 5px;
}
.ta9 a {text-decoration: none;}
.ta9 td{font-size: 83%;padding-right: 4px;}
.imag1 {width: 70%;height: auto;}
.ta9 td .lead2 {
    font-size: 112%;
    line-height: 1.6;
    font-feature-settings: "pkna";
    text-align: justify;}
/*--トップページのバナーのスペース------*/
.topbannerarea {
    margin: auto;
    padding: 10px 4%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.topbanner {
    width: 210px;
    margin: 10px 10px 8px 0px;
}
.topbanner p {
    font-size: 70%;
    line-height: 1.5;
    font-feature-settings: "pwid";
    text-align: justify;
    margin-top: 5px;
    padding: 0 4px;
}



/*トップページのコース案内ボックス（list4）設定------------------------------------*/
.list4wrap {
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap; 
    justify-content: space-around;   
}
/*list4の要素はtable内に収めている*/
.list4 {
    width: 32%;
    height: auto;
	background: #fff9f4;
	margin: 10px 0.5% 10px 0.5%;
	border-radius: 6px;
	/*overflow: hidden;
	position: relative;*/
	-webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.2);	/*影の設定。
    右へ、下へ、ぼかし幅。rgbaは色設定で0,0,0は黒。0.2は透明度20%の事。*/
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);	/*同上*/
	padding: 12px 2% 14px;	/*ボックス内の余白*/    
}
.list4 h4 {
    font-size: 98%;
    line-height: 1.4;
    font-weight: 500;
    margin-top: 10px;
    padding: 7px 10px;
    background: #fff;
    border-radius: 10px;
    border: 1px solid #878787;
} 

.listmigi {
    margin-top: 16px;
}
.listmigi p {
    font-size: 85%;
    line-height: 1.9;
    text-align: left;
}
.listbun {
    margin: 5px 0 10px 0 ;
}
.listbun p{
    font-size: 89%;
    line-height:  1.7;
    text-align: justify;
}
   
.list4 a {text-decoration: none;}　/*リンクの、下に線を出さない*/
.list4 a:hover {background: #fcf9d7;}	/*マウスオン時の背景色*/
.list4banner {
    width: 32%;
    height: auto;
    background: #fff;
    margin: 10px 0.5%;
    overflow: hidden;
    position: relative;
    padding: 10px 2%;
    border: thin solid #909090;
    display: flex;
    flex-direction: column;
    text-align: center; 
}


.banner {
    margin-bottom: 2px;
    -webkit-box-shadow: 1px 1px 4px 1px rgba(173,173,173,0.5);
    box-shadow: 1px 1px 4px 1px rgba(173,173,173,0.5);
}
.banner p {
    font-size: 70%;
    line-height: 1.5em;
    text-align: left;
    margin: 4px 0;
}
.list4banner2 {display: none;}
.ban_1song {
    margin: 0 auto 30px;
    width: 75%;
}
/*--トップの送料の表--*/
.ta50 {
	width: 80%;
	table-layout: fixed;
	margin: 14px 0px 10px 10px ;
}
.ta50, .ta50 td, .ta50 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta50 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta50 td {
    font-size: 83%;
    line-height: 1.3;
    text-align: center;
    word-break: break-all;
}    

/*--利用ガイド内の送料の表--*/
.ta51 {
	width: 70%;
	table-layout: fixed;
	margin: auto;
}
.ta51, .ta51 td, .ta51 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta51 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta51 td {
    font-size: 83%;
    line-height: 1.3;
    text-align: center;
    word-break: break-all;
}    

/*トップページの教材一覧*/
.lineup {
    width: 100%;
    margin: 10px auto 60px;
    padding: 10px 0px;
    background: #FBFAF4;
    display: flex;
    flex-wrap: wrap;
}
.lineup a {width:20%;}
.lineup img {
    width: 85%;
    padding: 10px 0px;
}

/* トップページ中間部分の説明ボックス list50*/
.list50 {
    width: 94%;
    margin: auto;
    margin-bottom: 20px;
    padding: 16px 3% 20px;
    border: 4px dotted #3ab3f5;
    border-radius: 32px;
}

/*左右で分けるlist50ボックスの小見出し*/
.list50 h4 {
	font-size: 115%;
    letter-spacing: 0.01em;
	color: #eb7802;
}
.phtx {
    /*clear: both;*/
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
/*list50内の写真を右、文章を左*/
.migi {
    width: 33%;
    margin-top: 20px;
}
.bun_l {
    width: 60%;
	padding: 14px 5px 10px 0px;
}
.bun_l p {
    font-size: 86%;
    line-height: 1.8;
    font-feature-settings: "pwid";
    text-align: justify;
}
.bun_l a {
    font-size: 90%;
    line-height: 3.0em;
}

/*list50内の写真を左、文章を右*/
.hidari {
    width: 33%;
    margin-top: 20px;
    
}
.bun_r {
    width: 60%;
	padding: 14px 3px 15px 10px;
}
.bun_r p {
    font-size: 86%;
    line-height: 1.8;
    font-feature-settings: "pwid";
    text-align: justify;
    }
    
/*---トップページ下のほうの料金表----*/
.ta3 {
	width: 100%;
	table-layout: fixed;
	margin: auto;
    margin-bottom: 20px;   
}
.ta3, .ta3 td, .ta3 th {
	border: 1px solid #999;	/*テーブルの枠線の幅、線種、色*/
	line-height: 1.5;
    font-size: 88%;
	padding: 10px;	/*ボックス内の余白*/
	word-break: break-all;
}
/*ta3の上の見出し欄*/
.ta3 th {
	text-align: center;	/*センタリング*/
	background: #fbd8bd;	/*背景色*/
	font-weight: normal;
}
.ta3 a {
    text-decoration-line: none;
}

/*ウクレレダウンロード版-----*/
.ta-dl1 {
    width: 100%;
    margin: 20px auto;
    background-color: #fff;    
}
.ta-dl1 td{
    padding: 12px;    
}
.ta-dl1 h3{
    font-size: 100%;
    color: #D56994;
    font-weight: bolder;
    margin-bottom: 13px;
}
.ta-dl1 p {
    font-size: 85%;
}
.teika {font-size: 92%;}

/*--お客様の感想のボックス--*/
.list7 h4 {
	font-size: 140%;	/*文字サイズ*/
    letter-spacing: 0.02em;
    text-indent: 0.02em;
	color: #e5831f;	/*文字色*/
}
.list7 {
	/*overflow: hidden;*/
	border-top: 1px solid #ccc;	/*上の線の幅、線種、色*/
	padding: 20px 0px 10px 0px ;	/*ボックス内の余白*/
}
.voicearea {
    display: flex;
    flex-flow: wrap;
    justify-content: space-around;
    margin-bottom: 30px;
    }
.voice {
    width: 31%;
    height: auto;
    padding: 15px 15px 15px 15px;
    background-color: rgba(253,207,198,0.90);
    border-radius: 30px;
    margin-top: 30px;
}
.voice p {
    font-size: 70%;
    line-height: 1.6;
    font-feature-settings: "pkna";
    text-align: justify;
}
.voice img {margin-right:15px;}

/*--SPコンテンツのボックス--*/
.kuwake {
    margin: auto;
    padding : 3%;
	font-size: 125%;
    text-align: left;
    letter-spacing: 0.02em;
	color: #e5831f;
}
.detail {
    border: 1px solid #FA9D56;
    margin-bottom: 10px;
}
.voicearea2 {
    display: flex;
    flex-flow: wrap;
    justify-content: flex-start;
    margin-bottom: 24px;
    }
.voice2 {
    width: 24%;
    height: auto;
    padding: 15px 15px 15px 15px;
    background-color: rgba(210,255,245,0.90);
    margin: 10px 0 15px 6px;
    -webkit-box-shadow: 2px 2px 4px 1px #C6C0C0;
    box-shadow: 2px 2px 4px 1px #C6C0C0;
}
.voice2 p {
    font-size: 78%;
    line-height: 1.5;
    text-align: justify;
    padding-top: 10px;
}
#youtubewaku p {font-size: 90%;margin-bottom: 20px;}
.voicearea3 {
    display: flex;
    flex-flow: wrap;
    justify-content: center;
    padding: 0px;
    margin-bottom: 40px;
    font-size: 95%;
    }
.voice3 {
    width: 43%;
    height: auto;
    padding: 10px;
    background-color: rgba(210,255,245,0.90);
    margin: 6px;
    -webkit-box-shadow: 2px 2px 4px 1px #C6C0C0;
    box-shadow: 2px 2px 4px 1px #C6C0C0;
}
.voice3 p {
    line-height: 1.5;
    text-align: justify;
    padding-top: 10px;
}
.ytcontent {
    margin-top: 50px;
    margin-bottom: 30px;
    padding: 10px;
    border: 2px solid hsla(201,79%,83%,1.00);
}
.ytcontent h3{
    padding: 10px;
    text-align: center;}
.voicearea4 {
    display: flex;
    flex-flow: wrap;
    justify-content:space-around;
    padding: 0px;
    margin-bottom: 10px;
    }
.voice4 {
    width: 23%;
    height: auto;
    padding: 6px;
    background-color: rgba(210,255,245,0.90);
    margin: 6px;
    -webkit-box-shadow: 2px 2px 4px 1px #C6C0C0;
    box-shadow: 2px 2px 4px 1px #C6C0C0;
}

/*トップページ内の更新情報ブロック-----------------------------------*/
.gaiyou h4 {
    font-size: 100%;
}
#new dl {
	background: #eee;
    width: 90%;
    margin: 0 auto;
	padding: 20px;	
	border-radius: 4px;	
    font-size: 80%;
    font-feature-settings: "pwid";
    text-align: justify;
    line-height: 1.8;
}
/*日付設定*/
#new dt {
	float: left;
	width: 9em;	
	color: #e5831f;
	letter-spacing: 0.1em;
}
/*記事設定*/
#new dd {
	padding-left: 9em;
    margin-bottom: 10px;
}
/*---更新ページの更新情報-----------------------*/
.new2 {margin: auto;
    padding: 0px 2%;
}
.new2 dl {
	background: #eee;
    width: 100%;
	padding: 12px 14px;		
    font-size: 84%;
    margin-bottom: 12px;
    line-height: 1.7;
    text-align: justify; 
}
.new2 dt {
	float: left;
	width: 8em;	
	color: #e5831f;	
	letter-spacing: 0.1em;
    font-size: 84%;
}
.new2 dd {
	padding-left: 0em;
}

/*マークの設定各種　mark1は418行あたりに*/
.mark2 {width: 60px;height: auto;margin-top: -10px;margin-left:-50px;}
.mark3 {width: 30px;height: auto;margin-top: 0px;padding-right:5px;}
.mark4 {width: 35px;height: auto;margin-top: -5px;margin-right:8px;}
.mark5 {width: 33px;height: auto;margin-top: -2px;margin-right:0px;}


/*コースall紹介ページの　ボックス（list6）設定----------------------------------------*/
/*----home2はコースインデックスの---------*/
.home2 .main h2 {
	clear: both; 
	margin-bottom: 35px;
	font-size: 160%;
	text-align: center;      
}
/*　コースインデックスの中見出し*/
.bunrui {
    margin: 30px 0 20px 4px;
    border-left: 8pt solid #f98600;
    border-bottom: 2px solid #f98600;
    width: 99%;
    padding: 0 0 2px 14px;
    }
.bunrui p {font-size: 110%;}

/*--コースインデックスの改訂------*/

.gak1 {
    font-size: 110%;
}
.gak1 img {height:50px;}
.gak2 {
    font-size: 120%;
    letter-spacing: -0.025em;
    color: #DF7444;
    padding-top: 8px;
}
.gakkicourse h3 {
    margin-bottom: 10px;
    padding: 0 10px 0 0;
    display: flex;
    justify-content: space-between;
    border-bottom: 2px solid #F16E0B;
}
.gakkicourse h4 {font-size: 100%;}
.ta10 img {width:60%;}
.ta10 td {font-size: 94%;}
.ta10 {
    margin: 0 auto 20px;
    background-color: #fff9f4;
}
.ta10 a {text-decoration: none;}
/*--コース途中のリンク---*/
.k2 {margin: auto;
    padding: 0 0 20px 30px;
    font-size: 80%;
    color: #1647A8;
}
.k2 a {text-decoration: none;}

/*--コースインデックスのコースのリスト6　--------------------*/
.list6 {
	background: #fff9f4;	
	margin-bottom: 8px;	
	border-radius: 8px;
	overflow: hidden;
	position: relative;
	-webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.2);
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
	padding: 12px;
}
.list6 h4 {
    width: 100%;
    margin: 10px 0;
    text-align: center;
    font-size: 110%;
    border-radius: 14px;
    border: 1px solid #666;
    padding: 4px;
    background: #fff;
}
/*--何ヶ月マークの設定--*/
.month img {
    width: 18%;
    height: auto;
    padding-left: 10px;
    padding-bottom: 4px;
}    

/*コースインデックスlist6内の表形式　ta7とta8を切り替える*/
.ta7 {display: block;}
.ta8 {display: none;}
.ta7 img {
    width: 100%;
    height: auto;
    padding: 15px 0 0 5px;
}
.ta7bun {
    font-size: 97%;
    text-align: justify;
    line-height: 1.8;
}
/*--コース説明文の下の項目--*/
.ta7gaiyou {
    margin-top: 20px;
    font-size: 95%;
    text-align: justify;
    line-height: 1.8;
}
/*緑の頭*/
 .atama2 {
    color: #fff;
    background-color: #6fa375;
    padding: 3px 6px;
    border-radius: 6px;
    font-size: 93%;
}  
.list6 a {text-decoration: none;}　/*下に線を出さない*/
.list6 a:hover {background: #fcf9d7;}	/*マウスオン時の背景色*/

/*---コース一覧下の読みものコラム---------*/
#yomimono h4 {
    margin: 40px 0 20px 0;
    font-size: 114%;
    font-weight: 500;
    text-align: center;
    border-bottom: 2px solid #f98600;
    }
#yomimono {
    margin: 10px 0 20px 0;
    padding: 0;
}
#yomimono .midasi {
    font-size: 107%;
    margin-bottom: 10px;
    padding-left: 0px;
}
.gterabi {
    margin-bottom: 30px;
    padding: 10px 5% 5px;
    border: 1px solid #d9ae27;
    background-color: #faf9df;
}
/*--表を切り替える--*/
#hyou-a {display: block;}
#hyou-b {display: none;}
.ta6 {
	width: 100%;
	table-layout: fixed;
	margin: 10px 0px 30px;
}
.ta6, .ta6 td, .ta6 th {
	border: 1px solid #999;
	padding: 10px;
}
.ta6 th {
	text-align: center;
    line-height: 1.1;
	background: #fbd8bd;
    font-size: 100%;
	font-weight: normal;
}
.ta6 td {
    vertical-align: top;
    line-height: 1.8;
    font-size: 92%;
}
.ta6 h5 {
    text-align: justify;
    font-feature-settings: "pwid";
    font-size: 110%;}
.ta6 a {text-decoration: none;}　/*リンクの、下に線を出さない*/
.ta6 a:hover {background: #fcf9d7;}	/*マウスオン時の背景色*/
.tdbun {
    margin-top: 14px;
}
.icons {
    margin-top: 8px;
    padding: 0px 10% 0px 5%;
}

/*青い項目*/
.atama3 {
    color: #fff;
    background-color: #2688d4;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 90%;
    letter-spacing: 0.05em;
}  
.just2 {
    font-feature-settings: "wkna";
    text-align: justify;
    font-size: 92%;
}

/*ページのメニューブロック　-----------------------------------*/
.kubun {
    display: block;
    font-size: 60%;	
    color: #e5831f;	
    letter-spacing: 0em;	
}
.h2wide {
    clear: both;
    margin: 0 auto;
    width: 80%;
    height: 100px;
    border-radius: 30px;	
    border: 3px dotted #f16e0b; 
}

/*----各コースページ-----------------*/ 
.catch {
    text-align: center;
    font-size: 120%;
    color:#4169e1;
}
.cstitle {
    margin:0 auto;		
    border-radius: 40px;	
    border: 3px dotted #f16e0b;	
    padding: 12px 5%; 
}
.cstitle h2 {
    font-size: 140%;		
    text-align: center;	
    letter-spacing: 0.07em;
    line-height: 1.5;	
}
.cstitle h2 span {
	display: block;
	font-size: 64%;	
	color: #e5831f;	
	letter-spacing: 0.15em;	
    margin-bottom: 14px; 
}
.cstitle .lead {
    font-size: 85%;
    line-height: 1.7;
    text-align: justify;
}
/*---YouTubeの画面説明--*/
.gamensample p {
    font-size: 82%;
    text-align: justify;
    margin-bottom: 14px;
}
.gamen {
    margin-bottom: 5px;
    padding: 5px 50px 20px;   
}
.gamen img {
    width: 100%;
    height: auto;
    text-align: center;   
}
.gamen2 {
    margin-bottom: 5px;
    padding: 5px 15% 20px;   
}
.gamen2 img {
    width: 100%;
    height: auto;
    text-align: center;   
}

.banner-m {
    text-align: center;
    margin-top: 10px;
}
.banner-m img {
    width: 260px;
    -webkit-box-shadow: 1px 1px 4px 1px rgba(173,173,173,0.5);
    box-shadow: 1px 1px 4px 1px rgba(173,173,173,0.5);
}
/*---コース見出し頭のアイコン枠--------*/
.icon2 {
    width: 90%;
    margin: 0 auto;
    margin-bottom: 20px;
    background: #fff4cc;
    border-radius: 9px;
    text-align: center;
    -webkit-box-shadow: 2px 2px 2px 1px #B9B9B9;
    box-shadow: 1px 2px 2px 1px #B9B9B9;    
}
.gakki {
    padding: 8px 5%;
}

/*とくとく写真*/
.tokimag {
    text-align: center;
    padding: 0 30px 30px 30px;
}
.tokimag p {font-size: 80%;}

/*コースの値段の囲み*/
.nedan {
    margin-bottom: 30px;
    text-align: center;
    padding: 18px 5% 20px 5%;
    background-color: rgba(253,231,215,0.90);
}
.atama4 {
    color: #fff;
    background-color: #2688d4;
    margin-right: 5px;
    padding: 3px 20px;
    border-radius: 10px;
    font-size: 80%;
    vertical-align: 0.05em;
}  
.nedan h3 {
    font-size: 110%;
    line-height: 1.8;
    font-weight: 500;
    text-align: center;
    padding: 5px 28px;
    margin-bottom: 25px;
    background-color: #fff;
    border-radius: 16px;
    border: 1px solid #6a6a6a;
}

.nedan p {font-size: 90%;line-height: 1.8;}
.medatu {color: #098079;}
/* .naiyou {
    padding: 10px 0px 20px;
}
.naiyou p {
    font-size: 90%;
    line-height: 1.8;
    text-align: justify;
    margin-bottom: 10px;
}   */
.chuu p {
    font-size: 84%;
    color: #006400;
    padding-top: 10px;
    margin-bottom: 0px;
}

.site2 {
    background-color: #FFFFD8;
    padding: 16px 16px 8px 16px;   
}
.site2 p {font-size: 80%;}
.site2 a {text-decoration: none;}
/*案内動画まわり*/
.dlimg {padding: 10px 0px 20px; display: block;}    
.dlimg {width: 95%;height: auto;}   
.gallary {
    padding: 0px 0px 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
}
.gallary img {
    width:230px;
    height:auto;
    padding: 0px 10px 7px;
} 
#sityouken {
    background-color: #F0FCE2;
    padding: 0px 20px 20px 15px;   
}
#sityouken h5 {
    

    font-size: 85%;
    color: #0D7235;
    padding-top: 20px;
}
#sityouken p {
    font-size: 80%; padding-left: 20px; 
}
.video {text-align: center;}
.video h5 {font-size: 90%;}
.videouk {text-align: center;}
.videouk h5 {font-size: 80%;}
.videouk video{width: 500px; height: auto;}

.youtube {
    margin: 0 auto;
    width: 90%;
    height: auto; 
    padding: 10px;
}
.youtube iframe {
    max-width:500px; 
    min-height: 290px;
}
.pdfdown {margin-top: 20px;}
.pdfdown table {width: 95%;}
.pdfdown td {font-size: 95%;}
.pdfdown a :hover {background-color: rgba(113,112,112,0.20);}

/*教材の代金と申し込み　カート*/
.daikin {margin: 15px 0px 40px;}
.daikin h5 {
    margin-bottom: 14px;
    font-size: 95%;
}
.daikin p {
    font-size: 85%;
    text-align: justify;
    margin-bottom: 20px;
}
.cpkakomi {
    border: medium solid #D114BA;
    margin-bottom: 20px;
    padding: 10px 20px 3px;
    background-color: rgba(253,229,250,0.76);
}
.topkakomi {
    border: medium solid #D114BA;
    margin-bottom: 20px;
    padding: 10px 20px 3px;
    background-color: rgba(253,229,250,0.76);
}
.topkakomi p {
    font-size: 90%;
}
.syouhinimg {
    background-color: #faebd7;
    min-height : 190px;
    display: flex;
    flex-direction: row;
    justify-content:center;
    align-items: center;
    padding: 5px 10px;
}
.stcode {
    background-color: #faebd7;
    padding: 0px 10px 10px 10px;
    font-size: 80%;
}
.product1 {
    width: 170px;
    height: auto;
    padding: 2px 20px 0px 10px;
    }

.product2 {
    max-width: 180px;
    height: auto;
    padding: 2px 16px 0px 5px;
    }   
.cartgroup {
    width: 290px;
    padding-bottom: 10px;
    background-color: #fff;
    border: 2px dotted #1647a8;
    margin: 0 auto;   
}
.cartgroup h6{
    font-size: 80%;
    letter-spacing: -0.025em;
    text-align: center;
    margin: 20px 10px 15px;
}
.cart {
    text-align: center;    
}
.cart img {
    max-width: 150px;
    height: auto;
    margin-bottom: 10px;
}
.come {
    margin-top: 0px;
    margin-bottom: 15px;
    font-size: 76%;}
  
.cart a :hover{background-color: rgba(113,112,112,0.20);}

.cart2 a :hover{background-color: rgba(113,112,112,0.20);}
.cart2 {padding: 0px;}
.cart2 img {
    max-width: 100px;
    height: auto;
    }

.course h4 {
    margin: 40px 0 18px 0;
    border-left: 8pt solid #f98600;
    font-size: 110%;
    border-bottom: 2px solid #f98600;
    }
/*コースの表*/

.ta4 {
	width: 100%;
	table-layout: fixed;
	margin: 20px 0px 30px;
}
.ta4, .ta4 td, .ta4 th {
	border: 1px solid #999;	
	padding: 12px;
}
.ta4 th {
	text-align: center;
	background: #cce6f6;
	font-weight: normal;
	font-size: 90%;
    line-height: 1;
    letter-spacing: 0.3em;    
}
.ta4 td {
    font-size: 88%;
    line-height: 1.8;
    word-break: break-all;
}
.ta4 h5 {font-weight: 600;}    
.ta4 td img {
    padding: 10px 8px 0 20px;
    width: 78%;
    height: auto;
}  
/*だれ弾きの表*/
.ta44 {
	width: 100%;
	table-layout: fixed;
	margin: 20px 0px 30px;
}
.ta44, .ta44 td, .ta44 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta44 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta44 td {
    font-size: 83%;
    line-height: 1.7;
    word-break: break-all;
}    
.ta44 td img {
    width: 72%;
    height: auto;
} 
.ta44 .txt {
    width: 66%;
    height: auto;}

/*講師紹介のわく*/
.koushi{
    margin: auto;
    background-color: rgba(211,233,247,0.80);
    padding: 2px 3% 20px;
}
.koushi h5 {
    margin-bottom: 4px;
    font-size: 80%;
}
.koushi_waku{
    display: flex;
    background-color: #fff;
    padding: 8px;
}
.koushi_bun{
    width:72%;
    font-size: 78%;
    line-height: 1.7;
}
.koushi_bun2{
    font-size: 78%;
    line-height: 1.7;
}
.koushi_fa {width: 28%;
    margin: 15px 0px 10px 12px;   
}
.koushi_fa img {width: 76%;height: auto;}
.txsampl {margin-bottom: 40px;}
.txsampl p {
    margin: 20px 0;
    font-size: 90%;
}
.txsampl2 {
    margin: 30px 5% 40px;}
.chuuijikou {
    width: 96%;
    margin: 0 auto;
    background-color: #fff6d2;
    border: 2px solid #f58631;
    padding: 10px 10px 0px;
}
.chuuibun {
    padding: 10px;
}
.chuuibun p {
    font-size: 80%;
    margin-bottom: 10px;
}
.color5 {
    color: #950191;
    font-weight: 800;
}

/*-------会社概要のページ-------------------------*/
.gaiyou #contents .main {
    float: left;
    width: 100%;
    padding: 0 10%;
}    

.gaiyou h3 {
    clear: both;
    margin-bottom: 30px;
    text-align: left;
    font-size: 100%;
    padding-left: 24px;
    border-radius: 50px;	
    border: 1px solid #666;	
    background-color: #fff;
}
.orang {
	font-size: 94%;	
	color: #e5831f;	     
}
/*これが全然効いていない*/
.list6.csh3 h3 {
    font-size: 10%;      
}

.honbun2 {
    margin: -10px 1.5% 25px;
    text-align: justify;
    font-size: 80%;
}
.sengen h5 {
    font-size: 85%;
    padding-left: 10px;
}
.sengen p {
    font-size: 82%;
    text-align: justify;
    margin: 0px 1.5%  20px;
}

.guideline ul {margin-bottom: 25px;}
.guideline li{
    list-style-type: disc;
    margin: 0px 9px 10px 30px;
    text-align: justify;
    font-size: 82%;
}
/*--会社概要ページの表　ta2---*/
.ta2 {
	width: 96%;
	table-layout: fixed;
	margin: 0 2% 50px;
}
.ta2, .ta2 td, .ta2 th {
	border: 1px solid #999;	/*テーブルの枠線の幅、線種、色*/
	line-height: 1.7;
    font-size: 89%;
	padding: 12px;	/*ボックス内の余白*/
    }
.ta2 th {
	text-align: center;
	background: rgba(250,198,158,0.6);
}
.ta2 td {
    text-align: left;    
}


/*よく頂く質問ページ　利用ガイドも---------------------------*/
/*ブロック全体*/
.faq {
	padding: 0px 0px;
}
.fandq h3 {
    clear: both;
    margin: 30px 0 20px;
    text-align: center;
    font-size: 110%;
    line-height: 2.5;
    border-radius: 50px;
    border: 1px solid #666;
    padding: 0 50px;
    background-color: #fff;    
}

/*---質問の下のほうの補足ガイドの見出し*/
.fandq h4 {
    margin: 40px 0 10px 0;
    border-left: 8pt solid #f98600;
    font-size: 110%;
    border-bottom: 2px solid #f98600;
    }

/*質問の設定*/
.faq dt {
	color: #e5831f;
	padding-top: 10px;
	margin-bottom: 10px;
    font-size: 86%;
    text-align: justify;
}
/*回答の設定*/
.faq dd {
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding-bottom: 10px;
    font-size: 86%;
    text-align: justify;
}
/*「Q」と「A」のマーク共通設定*/
.faq dt::before,
.faq dd::before {
	margin-right: 5px;display: inline-block;text-align: center;
	width: 26px;
	line-height: 26px;
}
/*「Q」のマーク追加設定*/
.faq dt::before {
	content: "Q";			/*「Q」の文字を出力する設定*/
	background: #e5831f;	/*背景色*/
	color: #fff;			/*文字色*/
}
/*「A」のマーク追加設定*/
.faq dd::before {
	content: "A";		/*「A」の文字を出力する設定*/
	background: #999;	/*背景色*/
	color: #fff;		/*文字色*/
}
/*--fandqの下の補足ガイド----*/

.fandq .main h5 {
    font-size: 93%;
    margin-bottom: 12px;
}

.hosokuwaku {margin-bottom: 10px;}
.hguide {
    border-bottom: 1px solid #ccc;
    padding: 10px 0 10px 0;
    margin: auto;
}
.hassou {display: flex;justify-content: center;}
.hassou img {width: 80%;height: auto;}

.yuucho {
    display: flex;
    flex-wrap: wrap;
    margin: 15px 0;
    background-color: #f5f5dc;
    padding: 15px 1%;
}
.yuucho img {width: 50%; height: auto;}
.tejun {width: 45%;padding: 36px 0 0 0;}
.tejun ul {font-size: 78%;}

.hurigami {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.zukai3 {
    text-align: center;
    margin-bottom: 14px;
}
.zukai3 img {width: 70%;height: auto;}
.hurigami ul {
    width: 70%;
    margin: 0 20% 10px;
    font-size: 80%;
}

/*------リンクの囲み--------------------*/
.siori {
    width: 70%;
    margin: 0 auto;
    background-color: #fff6d2;
    border-radius: 10px;
    padding: 10px 5%;
}

.siori ul {overflow: hidden;}
.siori li{
    float: left;
    list-style: none;
    font-size: 70%;
    line-height: 2.2;
    padding: 0 30px 0 0;
}

.siori2 {
    width: 70%;
    margin: 0 auto;
    margin-bottom: 50px;
    background-color: #fff6d2;
    border-radius: 10px;
    padding: 10px 5%;
}

.siori2 ul {overflow: hidden;}
.siori2 li{
    float:left;
    list-style: none;
    font-size: 70%;
    line-height: 2.2;
    padding: 0 30px 0 0;
}


/*---ご利用ガイド--------------*/
/*oomidasiはfaqと共通*/
.oomidasi {
    clear: both;
    margin-bottom: 30px;	
    border-radius: 40px;
    border: 3px dotted #f16e0b;	
    padding: 15px 5% 10px;
}
.oomidasi h2 {
    font-size: 160%;
    text-align: center;
    line-height:  1.5;
}
.oomidasi h2 span {
	display: block;
	font-size: 66%;	
    line-height: 1.5;
	color: #e5831f;	
	letter-spacing: 0.2em;	
    margin-bottom: 10px; 
}
.oomidasi .lead {
    margin: 0px 0px 10px 0px;
    padding-top: 15px;
    border-top: 2px solid #5c5a5a;
}
.oomidasi .lead p {
    font-size: 88%;
    line-height: 1.7;
    text-align: justify;
}
.oomidasi2 {
    clear: both;
    width: 80%;
    margin: 0 10% 30px;	
    border-radius: 50px;
    border: 3px dotted #f16e0b;	
    padding: 10px 30px 10px 30px;
}
.oomidasi2 h2 {
    font-size: 170%;
    text-align: center;
    line-height:  1.7;
}
.oomidasi2 h2 span {
	display: block;
	font-size: 60%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	 
}

.zukai {text-align: center;margin-bottom: 30px;}
.zukai img {width: 450px;height: auto;}
.zukai2 {text-align: center;margin-bottom: 20px;}
.zukai2 img {width: 350px;height: auto;}

/*--ご利用ガイドh6-----*/
.fandq .main h6 {
    font-size: 98%;
    margin-bottom: 10px;
}
.sirase {
    padding: 15px;
    border: thin solid #456DBE;
    background-color: #D1ECFB;
    font-size: 80%;
    margin-bottom: 20px;
}

.tokuzu {
    width: 100%;
    margin: auto;
    padding: 20px 20px;
    margin-bottom: 15px;
    background-color: #f5f5dc;
    display: flex;
    flex-direction: column;
    align-items: center;    
}
.tokuzu img {
    width: 420px;height: auto;
}
.cyapu {
    width: 90%;
    text-align: left;
    margin: 18px auto;
    font-size: 90%;
    line-height: 1.7;
}
.tokuzucan {
    width: 74%;
    margin: auto;
    padding: 20px 20px;
    margin-bottom: 15px;
    background-color: #E0EDF4;
    display: flex;
    flex-direction: column;
    align-items: center;   
}
.tokuzucan img {
    width: 400px;height: auto;
}
.cyapu2 {
    width:94%;
    text-align: left;
    margin: 16px 0px;
    font-size: 90%;
    line-height: 1.7;
}
.atesaki {
    font-size: 92%;
    text-align: justify;
    margin-bottom: 20px;
    line-height: 1.9;
    padding: 0px;
}

.atama1 {
    color: #fff;
    background-color: #f47718;
    padding: 3px;
}
/*---ご利用ガイド内の表 ta1設定----*/
.ta1 {
	width: 96%;
	table-layout: fixed;
	margin: 0 2% 45px;
}
.ta1, .ta1 td, .ta1 th {
	border: 1px solid #999;
	line-height: 1.7;
    font-size: 93%;
	padding: 12px;
	word-break: break-all;
}
.ta1 th {
	text-align: center;
	background: rgba(250,198,158,0.6);
	font-weight: normal;
}

/*教材のご購入のページ------------------------------*/
.kounyu #contents .main {
    float: left;
    width: 100%;
    padding: 0;
}    
.kounyu #contents .sub {
    display: none;
}
.kounyu h3 {
    clear: both;
    margin: 30px 0px 20px;
    text-align: center;
    font-size: 110%;
    line-height: 2.2;
    border-radius: 50px;
    border: 1px solid #666;
    padding: 0 20px;
    background-color: #fff;    
}

.oomidasi3 {
    width: 60%;
    height: auto;
    margin: 0 auto;	
    margin-bottom: 22px;
    border-radius: 20px;
    border: 3px dotted #f16e0b;	
    padding: 10px;
}
.oomidasi3 h2 {
    font-size: 145%;
    text-align: center;
    line-height:  1.4;
}
.oomidasi3 h2 span {
	display: block;
	font-size: 60%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	 
}
.kounyuwrap {
    margin: 0 auto;
    padding: 0 12%;
}
.k1 p {
    font-size: 88%;
    line-height: 1.7;
}
.kounyuwrap2 {
    margin: 0 auto;
    padding: 15px 0 0;
    display: flex;
    justify-content: center;
    border-top: 2px solid #F16E0B;
    font-size: 86%;
}
.kounyuwrap2 a {text-decoration: none;}

.kounyuwrap h4 {
    position: relative;
    left: 0;
    border-left: 10pt solid #f98600;
    font-size: 120%;
    border-bottom: 2px solid #f98600;
    margin-bottom: 20px;
    padding-left: 10px;
}
.kounyu h5 {
    font-size: 100%;
    margin-top: 30px;
}
.kounyu h6 {
    font-size: 100%;
    margin: 20px 0px;
    
}
.btnlead {
    margin: 20px auto 0;
    padding: 10px;
    border: 2px solid #33AF9E;
}
.btnlead p {
    text-align: center;
    font-size: 90%;
    margin-bottom: 10px;}
.sugubtn {
    margin: 0 auto;
    padding: 0px;
    text-align: center;
}
.sugubtn img {
    padding: 0px 0px 8px;
    width: 170px;
}

.tokucho {
    width : 400px;
    margin: 0 auto 25px;
    background-color: #fff6d2;
    padding: 10px 20px 6px;
    -webkit-box-shadow: 1px 1px 3px 0 #A0A0A0;
    box-shadow: 1px 1px 3px 0 #A0A0A0;
}
.tokucho p {
    font-size: 96%;
    margin-bottom: 0px;
}
.tokucho ul {
    font-size: 90%;
    padding: 0px 0px 5px 50px;
}
.atama6 {
    color: #fff;
    background-color: #2688d4;
    padding: 8px 10px;
    border-radius: 4px;
    font-size: 98%;
}
.storehyou {
    margin: 0 0 30px;   
}
.storehyou table {margin: 20px 0px;}
.kounyuwrap table {
    width: 100%;
    font-size: 80%;
}
.kounyuwrap3 {
    margin: 30px auto;
    padding: 0px 18%    
}
.kounyuwrap3 table {
    width: 100%;
    font-size: 80%;
}
.kounyuwrap3 img {
    width: 50%;
}

.cartgroup2 {
    width : 350px;
    height: auto;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    background-color: #fff;
    border: 2px dotted #1647a8;
}
.cartgroup2 h6 {
    font-size: 88%;
    text-align: center;
    margin: 10px 0 ;
}
.cartgroup2 .cart img{
    width:48%;
    height: auto;
    margin-bottom: 20px;
}


/*おまけ・・吹き出しの説明ツールチップ*/
.tooltip2 {
    position: relative;
    cursor: pointer;
    display: inline-block;
}
.tooltip2 p {
    margin:0;
    padding:0;
}
.description2 {
    display: none;
    position: absolute;
    padding: 10px;
    font-size: 12px;
    line-height: 1.6em;
    color: #fff;
    border-radius: 5px;
    background: #000;
    width: 100px;
}
.description2:before {
    content: "";
    position: absolute;
    top: 0%;
    right: 95%;
    border: 15px solid transparent;
    border-top: 15px solid #000;
    margin-left: -15px;
    transform: rotateZ(90deg);
}
.tooltip2:hover .description2{
    display: inline-block;
    top: 0px;
    left: 80px;
}
/*storesにリンクする購入ボタンの表*/
.maeoki {margin: 30px 0px 20px; font-size: 92%;}
.stores th {font-weight: 600;background: rgba(248,175,119,0.90)}
.stores tr {
    text-align: center;
    font-size: 90%;
}

/*その他
---------------------------------------------------------------------------*/
.look {background: #ccc;padding: 5px 10px;border-radius: 4px;}
.mb15,.mb1em {margin-bottom: 15px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb50 {margin-bottom: 50px !important;}
.p0 {padding:0 !important;}
.clear {clear: both;}
ul.disc {padding: 0em 20px 40px 40px;list-style: disc;}

.color1, .color1 a {color: #e5831f !important;}
.color2 {color: #dd1a47;font-size: 110%;} /*赤く大きく*/
.color3 {color: #006400;font-weight: 800;}
.color4 {color: #dd1a47;font-size: 100%;font-weight: 700;}
.color6 {color: #dd1a47;font-size: 100%;padding: 0 1px;}

.pr {font-size: 10px;}
.wl {width: 96%;}
.ws {width: 50%;}
.c {text-align: center !important;}
.r {text-align: right !important;}
.l {text-align: left !important;}
.w50 {overflow: hidden;width: 50%;}

.fl {float: left;}
img.fl {float: left;width:30%; margin-right: 20px;margin-bottom: 20px;}
.fr {float: right;}
img.fr {float: right;width:30%;;margin-left: 20px;margin-bottom: 20px;}

.big1 {font-size: 40px;}
.mini1 {font-size: 11px;display: inline-block;line-height: 1.5;}
.sh {display: none;}





/*フッター設定
---------------------------------------------------------------------------*/
footer {
	clear: both;
	text-align: center;	
	font-size: 74%;	
	background: #e5831f;
}
/*リンクテキスト------------------------*/
footer a {color: #fff;}
footer a:hover {color: #fff;}
/*---著作部分-----------------------*/
footer .pr {display: block;}

/*フッターメニュー
---------------------------------------------------------------------------*/
/*ボックス全体*/
.gainfoot {
    padding: 10px ;
    margin: auto;
    background: #EDEDED;
}
#footermenu {
	overflow: hidden;
	padding: 14px 11%;	
}
/*１行分の設定*/
#footermenu ul {
    display: flex;
    text-align: center;
}
#footermenu li {
    display: inline-block;
    float: left;
    width: 100%;   
}
/*class="title"とつけた場合の設定*/
#footermenu ul li.title a {
	font-weight: bold;
	opacity: 1;	/*色が100%出た状態にする。この指定がないと、下の0.7が適用される。*/
}
/*リンクテキストの設定*/
#footermenu a {
	text-decoration: none;
	opacity: 0.7;	/*透明度。70%の色がついた状態。*/
}
/*リンクのマウスオン時*/
#footermenu a:hover {
	opacity: 1;		/*透明度。100%の色がついた状態。*/
}

/*コピーライト
---------------------------------------------------------------------------*/
#copyright {
	clear: both;
	text-align: center;
	background: #333;
	color: #fff;
    padding: 10px;
}
#copyright a {text-decoration: none;}


/*inputボタンにclass="btn"をつけた場合の設定
---------------------------------------------------------------------------*/
#contents input[type="submit"].btn,
#contents input[type="button"].btn,
#contents input[type="reset"].btn {
	padding: 5px 10px;
	border: 1px solid #ccc;	
	font-size: 20px;		
	border-radius: 3px;	
	background: #eee;
}
/*マウスオン時の設定*/
#contents input[type="submit"].btn:hover,
#contents input[type="button"].btn:hover,
#contents input[type="reset"].btn:hover {
	border: 1px solid #999;	
	background: #fff;		
}

/*トップページのNEWアイコン
---------------------------------------------------------------------------*/
.newicon {
	background: #f00;
	color: #fff;
	font-size: 70%;	
	line-height: 1.5;
	padding: 2px 5px;
	border-radius: 2px;
	margin: 0px 5px;
	vertical-align: text-top;
}

/*ページの上部へボタン「↑」設定
---------------------------------------------------------------------------*/
@keyframes scroll {0% {opacity: 0;}100% {opacity: 1;}}
body .nav-fix-pos-pagetop a {display: none;}
body.is-fixed-pagetop .nav-fix-pos-pagetop a {
	display: block;
	text-decoration: none;
	text-align: center;
	width: 50px;
	line-height: 50px;
	z-index: 3;
	position: fixed;
	bottom: 20px;	/*下から20pxの場所に配置*/
	right: 3%;		/*右から3%の場所に配置*/
	background: #666;	/*背景色（古いブラウザ用）*/
	background: rgba(0,0,0,0.6);	/*背景色。0,0,0は黒の事。0.6は60%色がついた状態。*/
	color: #fff;
	border: 1px solid #fff;	
	animation-name: scroll;	/*上のアニメーションで指定しているkeyframesの名前（scroll）*/
	animation-duration: 1S;	/*アニメーションの実行時間*/
	animation-fill-mode: forwards;	/*アニメーションの完了後、最後のキーフレームを維持する*/
}
/*マウスオン時*/
body.is-fixed-pagetop .nav-fix-pos-pagetop a:hover {
	background: #999;
}



/*画面幅800px以下の設定
--------------------------------------------------------------*/
@media screen and (max-width:800px){

/*ヘッダー-------------------------------------------------------*/
header #logo img {width:260px;}    
body {font-size: 17px;}	  
    
/*main,subコンテンツ-----------------------------------------------*/
#formstyle #contents .main {
    width: 90%;
    margin: auto;
}
#contents {
	clear: both;
    overflow: hidden;
    position: relative;
	background: #fff;
	padding: 5% 3%;
	margin: 0 2% 10px;
}
        
#contents .main {
	float: none;
	width: auto;
    padding: 16px;
    background: #fff;
}
/*---サブメニューは下に2ブロックで移動する800----------*/    
#contents .sub {
	float: none;
    width: auto;
    padding: 20px 2%;
    display: flex;
    flex-direction: column-reverse;    
}
.subw2 {
    margin-bottom: 20px;
    }    
.subw1 {
    display: flex;
    justify-content: center;
} 
.subgrp {
    margin: 0 4% 20px ;   
}    
.sub .box1,
.sub .box2,
.sub .box3,
.sub .box4 {
     width: 225px;   
 }
.sub .box5 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}    
.sub .banner-s {
    width: 224px;
    height: auto;
    margin: 1px 3%;
 }    
    
/*写真の上の飾り*/
.kei {
    padding: 0px 5%;
}    
.message1 {
    text-align: center;
    font-size: 90%;
}
.pop {
  margin: 0px auto 20px;
  width: 600px;
  padding: 10px;    
}
.pop img {width:500px;height:auto;}    
   
/*---マークの設定各種800-----*/
.mark2 {width: 60px;height: auto;margin-top: -10px;margin-left:-50px;}
.mark3 {width: 30px;height: auto;margin-top: 0px;padding-right:5px;}
.mark4 {width: 33px;height: auto;margin-top: -5px;margin-right:8px;}
.mark5 {width: 33px;height: auto;margin-top: -2px;margin-right:0px;}    

/*-----btn1-----------------
---------------------------------------------------------------------------*/
#contents a.btn1 {
	padding: 0px 20px;
	letter-spacing: normal;	
	background: #e5831f url(none);
}

    
/*---スマホ用メニューブロック800---------------------*/
#menubar-s {
	display: block;overflow: hidden;
	position: absolute;z-index: 2;
	top: 2px;right: 1px;padding-top: 30px;
	width: 400px;
	background: rgba(0,0,0,0.8);
	border-top: 1px solid #fff;
	animation-name: menubar;
	animation-duration: 0.5s;
	animation-fill-mode: both;
}
/*---メニュー１個あたりの設定 ---*/
#menubar-s li a {
	display: block;text-decoration: none;
	padding: 5px 30px;
	border-bottom: 1px solid #fff;
	color: #fff;
	font-size: 12px;
}

#subsub li a {
    font-size: 12px;
    color: #fff;
    padding: 5px 30px;
}
 .current-s {background-color:#e5831f;} 

.home3 #menubar_hdr {display: none;}
.kounyu #menubar_hdr {display: none;}
.gaiyou #menubar_hdr {display: none;}    
        
/*---PC用メニューを非表示にする-------*/
#menubar {display: none;}

/*３本バーアイコン設定800
---------------------------------------------------------------------------*/
/*---３本バーブロック---------------*/
#menubar_hdr {
	display: block;
	position: absolute;z-index: 2;
	top: 20px;
	right: 4%;
	border: 1px solid #fff;
}
/*------アイコン共通設定--------*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 50px;
	height: 50px;
}
/*---三本バーアイコン　背景色、背景画像の読み込み、画像の上半分（３本マーク）を表示。幅は50px。------*/
#menubar_hdr.close {
	background: #e5831f url(../images/icon_menu.png) no-repeat center top/50px;	
}
/*---閉じるアイコン　背景色、背景画像の読み込み、画像の下半分（×マーク）を表示。幅は50px。---*/
#menubar_hdr.open {
	background: #e5831f url(../images/icon_menu.png) no-repeat center bottom/50px;
} 
  
/*---- bodyで　フォントを17pxにしたのでそこは動かさず
--------------------------------------------------------------------*/    
.home #contents {margin-top: 40%;}
.course #contents {margin-top: 30%;}  
.fandq #contents {margin-top: 25%;}  
.textview #contents {margin-top: 15%;}
.gaiyou #contents {margin-top: 15%;}
.home2 #contents {margin-top: 12%;} 
.kounyu #contents {margin-top: 15%;}
    

/*----mainのほうのsection同士の余白--------*/
#contents section + section {
	margin-top: 30px;
}
  
/*---本文　800--------------*/
.honbun {margin-bottom: 20px;}
.honbun p {
    font-size: 87%;
    line-height: 1.8;
    text-align: justify;
}
.honbun p + p {margin-top: 15px;}    
 
     
/*------リンクの囲み 800--------------------*/
.siori {
    width: 66%;
    margin: 0 auto;
    background-color: #fff6d2;
    border-radius: 10px;
    padding: 10px 5%;
}

.siori ul {overflow: hidden;}
.siori li{
    float: left;
    list-style: none;
    font-size: 75%;
    line-height: 2.2;
    padding: 0 28px 0 0;
}

.siori2 {
    width: 80%;
    margin: 0 auto;
    margin-bottom: 50px;
    background-color: #fff6d2;
    border-radius: 10px;
    padding: 10px 4%;
}

.siori2 ul {overflow: hidden;}
.siori2 li{
    float:left;
    list-style: none;
    font-size: 75%;
    line-height: 2.2;
    padding: 0 28px 0 0;
}
.gainatesaki {
    padding: 10px 5%;
    margin: auto;
    margin-bottom: 30px;
    width: 400px;
    border: 2px solid #F58631;
    font-size: 88%;   
}    

    
/*---トップページ　800---------*/       
.home #contents h2 {
	clear: both; 
	margin-bottom: 35px;
	font-size: 155%;
	text-align: center;
	line-height: 1.6;       
}
/*----h2の上にまる----*/
.maru p {
    text-align: center;
    font-size: 140%;
    color: darkorange;
}
/*---h2タグ内のspanタグ（英語の飾り文字）----*/
.home h2 span {
	display: block;
	font-size: 50%;
    line-height: 1.8;
	color: #e5831f;
	letter-spacing: 0.2em;
    margin-bottom: 40px;
}
/*---h3の頭------------------*/
.mark1 {
    width: 46px;
    height: auto;
    margin-bottom: 6px;
    margin-right:-5px;
}

/*トップページの頭の3つのポイント 800-------------------------*/
#toppoint {
    margin: 0 auto;
    padding: 0 2%;
    margin-bottom: 10px;
    display: flex;
    flex-direction: row;
    justify-content:space-around;    
}
.list2 {
	width: 29%;	    
}
.list2 figure {
    width:70%;
    margin: 0 auto 15px;
}
.list2 figure a:hover {
	opacity: 0.8;	/*マウスオン時。透明度80%にする。*/
}
.pointbun {
    width: 100%;
}
.pointbun h4 {
	background: #fd7208;	/*背景色（古いブラウザ用）*/
	background: rgba(255,135,43,0.8);
	color: #fff;
    font-size: 94%; 
    text-align: center;
    margin-bottom: 10px;
}
.pointbun p {
    font-size: 84%;
    line-height: 1.6;
}
/* ---左右に文と写真を配置する 800-----*/
.usiro-le {position: relative;}
.usiro-le img {
    position: absolute;
    top: 0;
    left: 0;
    width: 25%;
}
.usiro-ri {position: relative;}
.usiro-ri img {
    position: absolute;
    top: 0;
    right: 0;
    width: 25%;
}
/*トップページのコース案内ボックス（list4）設定800------------------------------------*/
.list4wrap {
    display: flex;
    flex-wrap: wrap; 
    justify-content: flex-start;
}
/*---list4の要素はtable内に収める 800---------*/
.list4 {
    width: 32%;
    height: auto;
	background: #fff9f4;
	margin: 10px 0.5% 10px;
	border-radius: 6px;
	overflow: hidden;
	position: relative;
	-webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.2);
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
	padding: 12px 2% 14px;    
}
.list4 h4 {
    font-size: 98%;
    line-height: 1.4;
    font-weight: 500;
    margin-top: 10px;
    padding: 8px;
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #878787;
} 

.listmigi {
    margin-top: 16px;
}
.listmigi p {
    font-size: 85%;
    line-height: 1.9;
    text-align: left;
}
.listbun {
    margin: 10px 0 10px 0 ;
}
.listbun p {
    font-size: 92%;
    line-height:  1.7;
    text-align: justify;
}
   
.list4 a {text-decoration: none;}
.list4 a:hover {background: #fcf9d7;}
.list4banner {
    width: 32%;
    height: auto;
    background: #fff;
    margin: 10px 0.5%;
    overflow: hidden;
    position: relative;
    padding: 10px 2%;
    border: thin solid #909090;
    display: flex;
    flex-direction: column;
    text-align: center; 
}
.banner {
    margin-bottom: 2px;
}
.banner p {
    font-size: 70%;
    line-height: 1.5em;
    text-align: left;
    margin: 4px 0;
} 
.list4banner2 {display: none;}
.ban_1song {
    margin: 0 auto 30px;
    width: 65%;
}
.topbannerarea {
    margin: auto;
    padding: 10px 3%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.topbanner {
    width: 180px;
    margin: 10px 10px 8px 0px;
}
.topbanner p {
    font-size: 70%;
    line-height: 1.5;
    font-feature-settings: "pwid";
    text-align: justify;
    margin-top: 5px;
    padding: 0 4px;
}
/*--トップページのコース案内改訂--*/
.listwrap {
    margin: 10px auto 20px;
    flex-wrap: wrap; 
    justify-content: space-around;   
}
.ta9 {
    margin: 8px 2%;
    padding: 10px 10px;
    background-color: #fff9f4;
    -webkit-box-shadow: 2px 2px 3px rgba(114,110,110,0.75);
    box-shadow: 2px 2px 3px rgba(114,110,110,0.75);
}
.ta9 h4 {
    font-size: 110%;
    line-height: 2;
    border: 2px dotted #F16E0B;
    border-radius: 57px;
    margin-bottom: 5px;
}
.ta9 a {text-decoration: none;}
.ta9 td{font-size: 83%;padding-right: 4px;}
.imag1 {width: 74%;height: auto;}
.ta9 td .lead2 {
    font-size: 110%;
    line-height: 1.5;
 }    

/* トップページ中間部分の説明ボックス list50の設定 800*/

.list50 {
    width: 95%;
    margin: auto;
    margin-bottom: 30px;
    padding: 18px 3% 20px;
    border: 4px dotted #3ab3f5;
    border-radius: 30px;
}

.list50 h4 {
	font-size: 120%;
    letter-spacing: 0.01em;
    color: #eb7802;
    text-align: left;
    padding: 0 20px 0 20px;
}
.phtx {
    /*clear: both;*/
    display: flex;
    flex-direction: row;
    justify-content:space-between;
}
/*---写真を右、文章を左---800*/
.migi {
    width: 36%;
    margin-top: 20px;
    margin-bottom: 20px;
}
.bun_l {
    width: 60%;
	padding: 14px 8px 10px 0px;
}
.bun_l p {
    font-size: 90%;
    line-height: 1.8;
    text-align: justify;
}

/*-----写真を左、文章を右-------------------*/
.hidari {
    width: 36%;
    margin-top: 20px;
    margin-bottom: 20px;
}
.bun_r {
    width: 60%;
	padding: 14px 0px 10px 8px;
}
.bun_r p {
    font-size: 90%;
    line-height: 1.8;
    text-align: justify;
}
    
   

/*---トップページ下のほうの表800----*/
.ta3 {
	width: 96%;
	table-layout: fixed;
	margin: 0 auto;
    margin-bottom: 20px;
}
.ta3, .ta3 td, .ta3 th {
	border: 1px solid #999;	
	line-height: 1.5;
    font-size: 88%;
	padding: 9px;
	word-break: break-all;
}
/*ta3の上のボックス*/
.ta3 th {
	text-align: center;	
	background: #fbd8bd;
	font-weight: normal;
}
/*--トップの送料の表--*/
.ta50 {
	width: 70%;
	table-layout: fixed;
	margin: 16px auto 10px;
}
.ta50, .ta50 td, .ta50 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta50 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta50 td {
    font-size: 83%;
    line-height: 1.3;
    text-align: center;
    word-break: break-all;
}    
/*--利用ガイド内の送料の表--*/
.ta51 {
	width: 70%;
	table-layout: fixed;
	margin: auto;
}
.ta51, .ta51 td, .ta51 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta51 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta51 td {
    font-size: 83%;
    line-height: 1.3;
    text-align: center;
    word-break: break-all;
}  
/*ウクレレダウンロード版-----*/
.ta-dl1 {
    width: 100%;
    margin: 20px auto;
    background-color: #fff;    
}
.ta-dl1 td{
    padding: 12px;    
}
.ta-dl1 h3{
    font-size: 100%;
    color: #D56994;
    font-weight: bolder;
    margin-bottom: 13px;
}
.ta-dl1 p {
    font-size: 88%;
}
.teika {font-size: 96%;}    
    
    
/*--お客様の感想のバルーン800--*/
.list7 h4 {
	font-size: 120%;
    letter-spacing: 0.02em;
    text-indent: 0.02em;
	color: #e5831f;
}
.list7 {
	/*overflow: hidden;*/
	border-top: 1px solid #ccc;
	padding: 20px 0 10px;
}
.voicearea {
    display: flex;
    flex-flow: wrap;
    justify-content: space-around;
    margin-bottom: 0px;
    }
.voice {
    width: 47%;
    height: auto;
    padding: 15px 15px 15px 15px;
    background-color: rgba(253,207,198,0.90);
    border-radius: 20px;
    margin-top: 20px;
}
.voice p {
    font-size: 78%;
    line-height: 1.6;
}
/*--SPコンテンツのボックス--*/
.kuwake {
    margin: auto;
    padding-left: 3%;
	font-size: 125%;
    text-align: left;
    letter-spacing: 0.02em;
	color: #e5831f;
}
.detail {
    border: 1px solid #FA9D56;
    margin-bottom: 10px;
}
.voicearea2 {
    display: flex;
    flex-flow: wrap;
    justify-content:flex-start;
    margin-bottom: px;
    }
.voice2 {
    width: 32%;
    height: auto;
    padding: 15px 10px 15px 10px;
    background-color: rgba(210,255,245,0.90);
    margin: 10px 0px 0px 6px;
}
.voice2 p {
    font-size: 78%;
    line-height: 1.5;
    text-align: justify;
    padding-top: 10px;
} 
.voicearea3 {
    display: flex;
    flex-flow: wrap;
    justify-content: center;
    margin-bottom: 30px;
    font-size: 92%;
    }
.voice3 {
    width: 38%;
    height: auto;
    padding: 10px;
    background-color: rgba(210,255,245,0.90);
    margin: 6px;
    -webkit-box-shadow: 2px 2px 4px 1px #C6C0C0;
    box-shadow: 2px 2px 4px 1px #C6C0C0;
}
.voice3 p {
    line-height: 1.5;
    text-align: justify;
    padding-top: 10px;
} 
.voicearea4 {
    display: flex;
    flex-flow: wrap;
    justify-content:space-around;
    padding: 0px;
    margin-bottom: 10px;
    }
.voice4 {
    width: 30%;
    height: auto;
    padding: 6px;
    background-color: rgba(210,255,245,0.90);
    margin: 6px;
    -webkit-box-shadow: 2px 2px 4px 1px #C6C0C0;
    box-shadow: 2px 2px 4px 1px #C6C0C0;
}    

/*トップページ内　更新情報ブロック800--------------------------------*/
#new dl {
	background: #eee;
    width: 90%;
    margin: 0 auto;
	padding: 20px;
	border-radius: 4px;
    font-size: 80%;
    font-feature-settings: "pwid";
    line-height: 1.8;
}
/*----日付設定----------------*/
#new dt {
	float: left;
	width: 9em;	
	color: #e5831f;
	letter-spacing: 0.1em;
}
/*----記事設定----------*/
#new dd {
	padding-left: 9em;
    margin-bottom: 10px;
}
/*---更新ページの更新情報800----------------------*/
.new2 {margin: auto;
    padding: 0px 2%;
}
.new2 dl {
	background: #eee;
    width: 100%;
	padding: 12px 14px;		
    font-size: 84%;
    margin-bottom: 12px;
    line-height: 1.7;
    text-align: justify; 
}
.new2 dt {
	float: left;
	width: 8em;	
	color: #e5831f;	
	letter-spacing: 0.1em;
    font-size: 88%;
}
.new2 dd {
	padding-left: 0em;
}  
    
/*---ご利用ガイド 800--------------*/

.zukai {
    margin: 10px;
    padding: 10px 0px;
}
.zukai img {width: 480px;height: auto;}

.zukai2 {text-align: center;margin-bottom: 30px;}
.zukai2 img {width: 350px;height: auto;} 
    
/*--ご利用ガイドh6　▼の見出し800-----*/
.fandq .main h6 {
    font-size: 90%;
    margin-bottom: 10px;
}
   
.tokuzu {
    width: 100%;
    margin: auto;
    padding: 20px 50px;
    margin-bottom: 15px;
    background-color: #f5f5dc;
    display: flex;
    flex-direction: column;
    align-items: center;    
}
.tokuzu img {
    width: 420px;height: auto;
}
.cyapu {
    width: 90%;
    text-align: left;
    margin: 18px auto;
    font-size: 94%;
    line-height: 1.7;
}
.tokuzucan {
    width: 74%;
    margin: auto;
    padding: 20px 20px;
    margin-bottom: 15px;
    background-color: #E0EDF4;
    display: flex;
    flex-direction: column;
    align-items: center;   
}
.tokuzucan img {
    width: 370px;height: auto;
}
.cyapu2 {
    width:94%;
    text-align: left;
    margin: 16px 0px;
    font-size: 94%;
    line-height: 1.7;
}   
.atesaki {
    font-size: 90%;
    text-align: justify;
    margin-bottom: 10px;
    padding: 0px;
}

.atama1 {
    color: #fff;
    background-color: #f47718;
    padding: 3px;
}
/*---ご利用ガイド内の表 ta1設定800----*/
.ta1 {
	width: 96%;
	table-layout: fixed;
	margin: 0 2% 45px;
}
.ta1, .ta1 td, .ta1 th {
	border: 1px solid #999;
	line-height: 1.7;
    font-size: 93%;
	padding: 12px;
	word-break: break-all;
}
.ta1 th {
	text-align: center;	
	background: rgba(250,198,158,0.6);
	font-weight: normal;
} 
    
/*よく頂く質問ページ　利用ガイドも800---------------------------*/
/*ブロック全体*/
.faq {
	padding: 0px 0px;
}
.fandq h3 {
    clear: both;
    margin: 50px 0 20px;
    text-align: center;
    font-size: 110%;
    line-height: 2.5;
    border-radius: 50px;
    border: 1px solid #666;
    padding: 0 50px;
    background-color: #fff;    
}
/*---補足ガイドの見出し*/
.fandq h4 {
    margin: 40px 0 10px 0;
    border-left: 8pt solid #f98600;
    font-size: 110%;
    border-bottom: 2px solid #f98600;
}
/*質問の設定*/
.faq dt {
	color: #e5831f;
	padding-top: 10px;
	margin-bottom: 10px;
    font-size: 86%;
    text-align: justify;
}
/*回答の設定*/
.faq dd {
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding-bottom: 10px;
    font-size: 86%;
    text-align: justify;
}
/*「Q」と「A」のマーク共通設定*/
.faq dt::before,
.faq dd::before {
	margin-right: 5px;display: inline-block;text-align: center;
	width: 26px;
	line-height: 26px;
}

/*--fandqの下の補足ガイド 800----*/

.fandq .main h5 {
    font-size: 95%;
    margin-bottom: 12px;
}
.hosokuwaku {margin-bottom: 40px;}
.hguide {
    border-bottom: 1px solid #ccc;
    padding: 20px 0 10px 0;
}
.hassou {display: flex;justify-content: center;}
.hassou img {width: 70%;height: auto;}

.yuucho {
    display: flex;
    flex-wrap: wrap;
    margin: 15px 0;
    background-color: #f5f5dc;
    padding: 15px 4%;
}
.yuucho img {width: 49%;height:auto;}
.tejun {
    width:45%;
    padding: 54px 0 0 10px;
}
.tejun ul {font-size: 80%;}

.hurigami {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.zukai3 {
    text-align: center;
    margin-bottom: 10px;
}
.zukai3 img {width: 55%;}    
.hurigami ul {
    width: 60%;
    margin: 0 25% 10px;
    font-size: 80%;
}    
    
/*-------会社概要のページ　800-------------------------*/
.gaiyou #contents .main {
    float: left;
    width: 100%;
    padding: 0 7%;
}    

.gaiyou h3 {
    clear: both;
    margin-bottom: 30px;
    text-align: left;
    font-size: 100%;
    padding-left: 24px;
    border-radius: 50px;	
    border: 1px solid #666;	
    background-color: #fff;
}
.orang {
	font-size: 94%;	
	color: #e5831f;	     
}
/*これが全然効いていない*/
.list6.csh3 h3 {
    font-size: 10%;      
}

.honbun2 {
    margin: -10px 1.5% 25px;
    text-align: justify;
    font-size: 80%;
}
.sengen h5 {
    font-size: 85%;
    padding-left: 10px;
}
.sengen p {
    font-size: 82%;
    text-align: justify;
    margin: 0px 1.5%  20px;
}

.guideline ul {margin-bottom: 25px;}
.guideline li{
    list-style-type: disc;
    margin: 0px 9px 10px 30px;
    text-align: justify;
    font-size: 82%;
}
    
/*--会社概要ページの表ta2 800---*/
.ta2 {
	width: 96%;
	table-layout: fixed;
	margin: 0 2% 50px;
}
.ta2, .ta2 td, .ta2 th {
	border: 1px solid #999;	
	line-height: 1.7;
    font-size: 90%;
	padding: 12px;
    }
.ta2 th {
	text-align: center;
	background: rgba(250,198,158,0.6);
}
.ta2 td {
    text-align: left;    
}
    
    
/*----各コースページ　800-----------------*/ 
.catch {   
    text-align: center;
    font-size: 116%;
    color: royalblue;
}
.cstitle {
    width: 84%;
    margin: 0 auto;		
    border-radius: 40px;	
    border: 3px dotted #f16e0b;	
    padding: 15px 5%; 
}
.cstitle h2 {
    font-size: 140%;		
    text-align: center;		
    line-height: 1.5;	
}
.cstitle h2 span {
	display: block;
	font-size: 68%;	
	color: #e5831f;	
	letter-spacing: 0.15em;	
    margin-bottom: 10px; 
}
.cstitle .lead {
    font-size: 92%;
    line-height: 1.7;
    text-align: justify;
    margin-bottom: 0px;
}
/*---コース見出し頭のアイコン枠　800--------*/
.icon2 {
    width: 88%;
    background: #fff4cc;
    border-radius: 10px;   
}
.gakki {
    padding: 8px 11%;
}    

/*----とくとく写真800-------------*/
.tokimag {
    
    margin-bottom: 20px;
    padding: 0 50px 5px;
}

/*----コースの値段の囲み----------*/
.nedan {
    margin-bottom: 25px;
    text-align: center;
    padding: 20px 26px 20px 26px;
    background-color: rgba(253,231,215,0.90);
}
.atama4 {
    color: #fff;
    background-color: #2688d4;
    margin-right: 5px;
    padding: 3px 20px;
    border-radius: 10px;
    font-size: 80%;
    vertical-align: 0.07em;
}      
.course .nedan h3 {
    font-size: 110%;
    line-height: 1.8;
    font-weight: 500;
    padding: 5px 26px;
    margin-bottom: 20px;
    background-color: #fff;
    border-radius: 16px;
    border: 1px solid #6a6a6a;
}

.nedan p {font-size: 90%;line-height: 1.8;}
.medatu {color: #098079;}
/*.naiyou {
    padding: 10px 0 30px;    
}
.naiyou p {
    font-size: 92%;
    line-height: 1.8;
    text-align: justify;
    margin-bottom: 10px;
}   */
.chuu p {
    font-size: 84%;
    color: #006400;
    margin-bottom: 0px;
} 
.site2 {
    background-color: #FFFFD8;
    padding: 16px 16px 8px 16px;   
}
.site2 p {font-size: 80%;}
.site2 a {text-decoration: none;}    

/*-----案内動画まわり800-----------*/
.dlimg {padding: 10px 5% 20px; display: block;}    
.dlimg {width: 80%;height: auto;}      
.gallary {
    padding: 0px 0px 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
}
.gallary img {
    width:250px;
    height:auto;
    padding: 0px 10px 7px;
}    
.video {text-align: center;}
.video h5 {font-size: 90%;}
.videouk {text-align: center;}
.videouk h5 {font-size: 80%;}
.videouk video{width: 500px; height: auto;}    
.youtube {
    margin: 0 auto;
    width: 76%;
    height: auto; 
    padding: 10px;
}
.youtube iframe {
    max-width:500px; 
    min-height: 290px;
}    
.pdfdown {margin-top: 5px;}
.pdfdown table {width: 90%;}
.pdfdown td {font-size: 100%;}
.pdfdown a :hover {background-color: rgba(113,112,112,0.20);}

/*---YouTubeの画面説明--*/
.gamensample p {
    font-size: 84%;
    text-align: justify;
    margin-bottom: 14px;
}
.gamen {
    margin-bottom: 5px;
    padding: 5px 90px 20px;  
}
.gamen img {
    width: 100%;
    height: auto;
    text-align: center;   
}    
/*---教材の代金と申し込み　カート800-------*/
.daikin {margin: 15px 0px 30px;}
.daikin h5 {
    margin-bottom: 14px;
    font-size: 95%;
}
.daikin p {
    font-size: 90%;
    text-align: justify;
    margin-bottom: 25px;
}
.syouhinimg {
    background-color: #faebd7;
    min-height : 190px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 5px 10px;
}
.stcode {
    background-color: #faebd7;
    padding: 0px 10px 10px 10px;
    font-size: 80%;
}
.product1 {
    width: 170px;
    height: auto;
    padding: 2px 30px 0px 10px;
    }

.product2 {
    max-width: 200px;
    height: auto;
    padding: 2px 26px 0px 5px;
    }   
.cartgroup {
    width: 290px;
    max-height: 170px;
    background-color: #fff;
    border: 2px dotted #1647a8;
    margin: 0 auto;   
}
.cartgroup h6{
    font-size: 80%;
    letter-spacing: -0.025em;
    text-align: center;
    margin: 20px 10px 15px;
}
.cart {
    text-align: center;    
}
.cart img {
    max-width: 160px;
    height: auto;
    margin-bottom: 10px;
}
.come {
    margin-top: 0px;
    margin-bottom: 15px;
    font-size: 80%;}
  
.cart a :hover {background-color: rgba(113,112,112,0.20);}

.course h4 {
    margin: 40px 0 18px 0;
    border-left: 8pt solid #f98600;
    font-size: 110%;
    border-bottom: 2px solid #f98600;
}    
/*------コースの表800------------*/
.ta4 {
	width: 100%;
	table-layout: fixed;
	margin: 20px 0px 30px;
}
.ta4, .ta4 td, .ta4 th {
	border: 1px solid #999;	
	padding: 12px;
}
.just {text-align: justify;}
.ta4 th {
	text-align: center;
	background: #cce6f6;
	font-weight: normal;
	font-size: 88%;
    line-height: 1;
    letter-spacing: 0.3em;    
}
.ta4 td {
    font-size: 85%;
    line-height: 1.9;
    word-break: break-all;
}
.ta4 h5 {font-weight: 600;}    
.ta4 td img {
    padding: 10px 20px 0 30px;
    width: 70%;
    height: auto;
} 
/*だれ弾きの表800*/
.ta44 {
	width: 100%;
	table-layout: fixed;
	margin: 20px 0px 30px;
}
.ta44, .ta44 td, .ta44 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta44 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta44 td {
    font-size: 86%;
    line-height: 1.7;
    word-break: break-all;
}    
.ta44 td img {
    width: 72%;
    height: auto;
} 
.ta44 .txt {
    width: 66%;
    height: auto;}    

/*講師紹介のわく　800*/
.koushi{
    margin: 0 auto;
    margin-bottom: 30px ;
    background-color: rgba(211,233,247,0.80);
    padding: 2px 2% 20px;
}
.koushi h5 {
    margin-bottom: 4px;
    font-size: 85%;
}
.koushi_waku{
    display: flex;
    background-color: #fff;
    padding: 8px;
}
.koushi_bun{
    font-size: 80%;
    line-height: 1.7;
}
.koushi_bun2{
    font-size: 80%;
    line-height: 1.7;
}    
.koushi_fa {width: 28%;
    margin:4px 0px 10px 10px;   
}
.koushi_fa img {width: 78%;height: auto;}
    


/*コースall紹介ページの　ボックス（list6）設定　800
------------------------------------------------------------*/
/*----home2はコースインデックスの---------*/
.home2 .main h2 {
	clear: both; 
	margin-bottom: 0px;
	font-size: 170%;
	text-align: center;
	line-height: 1.6;      
}
/*--コースインデックスのコースのリスト6　800--------------------*/
.list6 {
	background: #fff9f4;	
	margin-bottom: 8px;	
	border-radius: 8px;
	overflow: hidden;
	position: relative;
	-webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.2);
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
	padding: 12px;
}
.list6 h4 {
    width: 100%;
    margin: 10px 0;
    text-align: center;
    font-size: 110%;
    border-radius: 14px;
    border: 1px solid #666;
    padding: 4px;
    background-color: #fff;
}
.month img {
    width: 15%;
    height: auto;
    padding-left: 10px;
    padding-bottom: 4px;
}    

/*コースインデックスlist6内の表形式　800*/
.ta7 {display: block;}
.ta8 {display: none;}    
.ta7 img {
    width: 90%;
    height: auto;
    padding: 5px 0 0 5px;
}
.ta7bun {
    font-size: 97%;
    text-align: justify;
    line-height: 1.8;
}
.ta7gaiyou {
    margin-top: 20px;
    font-size: 95%;
    text-align: justify;
    line-height: 1.8;
}
/*緑の項目*/
 .atama2 {
    color: #fff;
    background-color: #6fa375;
    padding: 3px 6px;
    border-radius: 6px;
    font-size: 93%;
}  
.list6 a {text-decoration: none;}
.list6 a:hover {background: #fcf9d7;}    
    
    
.bunrui {
    margin: 30px 0 20px 4px;
    border-left: 8pt solid #f98600;
    border-bottom: 2px solid #f98600;
    width: 99%;
    padding: 0 0 2px 12px;
}
.bunrui p {font-size: 110%;}
    
/*---おまけの読みものコラム　800---------*/    
#yomimono h4 {
    margin: 40px 0 20px 0;
    font-size: 114%;
    font-weight: 500;
    text-align: center;
    border-bottom: 2px solid #f98600;
}  
#yomimono {
    margin: 10px 0 20px 0;
    padding: 0;
}
#yomimono .midasi {
    font-size: 107%;
    margin-bottom: 10px;
    padding-left: 0px;
}
#hyou-a {display: block;}    
#hyou-b {display: none;}    
.gterabi {
    margin-bottom: 30px;
    padding: 10px 5% 8px;
    border: 1px solid #d9ae27;
    background-color: #faf9df;
}

.ta6 {
	width: 100%;
	table-layout: fixed;
	margin: 10px 0px 30px;
}
.ta6, .ta6 td, .ta6 th {
	border: 1px solid #999;
	padding: 12px;
}
.ta6 th {
	text-align: center;
    line-height: 1.1;
	background: #fbd8bd;
    font-size: 100%;
	font-weight: normal;
}
.ta6 td {
    vertical-align: top;
    line-height: 1.7;
    font-size: 97%;
}
.ta6 h5 {
    text-align: justify;
    font-size: 105%;
}
.tdbun {margin-top: 8px;}
.icons {
    margin-top: 10px;
    padding: 0px 10% 0px 10%;
}
    

/*---青い項目---*/
.atama3 {
    color: #fff;
    background-color: #2688d4;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 95%;
    letter-spacing: 0.05em
}    
.just2 {
    text-align: justify;
    font-size: 92%;
}
/*教材のご購入のページ　800-----------------*/
.kounyu #contents .main {
    float: left;
    width: 100%;
    padding: 0;
}    
.oomidasi3 {
    width: 60%;
    height: auto;
    margin: 0 auto;	
    margin-bottom: 20px;
    border-radius: 20px;
    border: 3px dotted #f16e0b;	
    padding: 10px;
}
.oomidasi3 h2 {
    font-size: 130%;
    text-align: center;
    line-height:  1.4;
}
.oomidasi3 h2 span {
	display: block;
	font-size: 60%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	 
}
.kounyuwrap {
    margin: 0 auto;
    padding: 0 8%;
}
.k1 p {
    font-size: 88%;
    line-height: 1.7;
}    
.kounyuwrap2 {
    margin: 0 auto;
    padding: 15px 0 0;
    display: flex;
    justify-content: center;
    border-top: 2px solid #F16E0B;
    font-size: 86%;
}
.kounyuwrap2 a {text-decoration: none;}

.kounyuwrap h4 {
    position: relative;
    left: 0;
    border-left: 10pt solid #f98600;
    font-size: 115%;
    border-bottom: 2px solid #f98600;
    margin-bottom: 20px;
    padding-left: 10px;
}
.kounyuwrap h5 {
    font-size: 100%;
    margin-top: 30px;
}
.btnlead {
    margin: 20px auto 0;
    padding: 10px;
    border: 2px solid #33AF9E;
}
.btnlead p {
    text-align: center;
    font-size: 88%;
    margin-bottom: 15px;}
.sugubtn {
    margin: 0 auto;
    padding: 0px;
    text-align: center;
}
.sugubtn img {
    padding: 0px 0px 8px;
    width: 150px;
}

.kounyu p {
    margin-bottom: 40px;
    text-align: justify;
}
.tokucho {
    width : 400px;
    margin: 0 auto 25px;
    background-color: #fff6d2;
    padding: 10px 20px 6px;
}
.tokucho p {
    font-size: 92%;
    margin-bottom: 0px;
}
.tokucho ul {
    font-size: 90%;
    padding: 0px 0px 5px 40px;
}
.atama6 {
    color: #fff;
    background-color: #2688d4;
    padding: 8px 10px;
    border-radius: 4px;
    font-size: 98%;
}
.storehyou {
    margin: 0 0 30px;
    display: flex;
    justify-content: center;
}    
.kounyuwrap table {
    font-size: 80%;
}    
.cartgroup2 {
    width : 300px;
    height: auto;
    margin: auto;
    margin-top: 0px;
    margin-bottom: 18px;
    background-color: #fff;
    border: 2px dotted #1647a8;
    }
.cartgroup2 h6 {
    font-size: 88%;
    text-align: center;
    margin: 10px 0 5px;
}
.cartgroup2 .cart img{
    width:48%;
    height: auto;
    margin-bottom: 18px;
}

/*その他 800----------------------------------------------------------------*/
body.s-n #sub,body.s-n #footermenu,.m-n {display: none;}
.big1 {font-size: 20px;}
.w50 {overflow: hidden;width: auto;}
.fl {float: none;}
.fr {float: none;}
.sh {display: block;}
.pc {display: none;}
    
.color1, .color1 a {color: #e5831f !important;}
.color2 {color: #dd1a47;font-size: 125%;}
.color3 {color: #006400;font-weight: 800;}
.color4 {color: #dd1a47;font-size: 100%;font-weight: 700;}  
}

/*画面幅680px以下の設定　　　
-------------------------------------------------------------------------*/
@media screen and (max-width:680px){

#formstyle #contents .main {
    width: 94%;
    margin: auto;
}    
#contents {
	clear: both;
    overflow: hidden;
    position: relative;
	background: #fff;
	padding: 5% 3%;
	margin: 0 2% 10px;	
}
#contents .main {
	float: none;
	width: auto;
    padding: 12px;
}
/*---サブメニューは下に2ブロック　680----------*/    
#contents .sub {
	float: none;
    width: auto;
    padding: 20px 2%;
    display: flex;
    flex-direction: column-reverse;    
}
.subw1 {
    display: flex;
    justify-content: center;
} 
.subgrp {
    margin: 0 2% 20px ;   
}    
.sub .box1,
.sub .box2,
.sub .box3,
.sub .box4 {width: 220px;
}
.sub .box5 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}    
.sub .banner-s {
    width: 200px;
    margin: 2px 3%;
 } 
/*----写真の上の飾り-----*/
.kei {
    padding: 0px 3%;
}    
.message1 {
    text-align: center;
    font-size: 84%;
}
 .message2 {
    padding: 4px 5% 20px;
    text-align: center;
    font-size: 75%;
}
.pop {
  margin: 0px auto 20px;
  width: 460px;
  padding: 10px;       
}
.pop img {width:400px;height:auto;} 
    
/*------マークの設定各種680--------*/
.mark2 {width: 60px;height: auto;margin-top: -10px;margin-left:-50px;}
.mark3 {width: 30px;height: auto;margin-top: 0px;padding-right:5px;}
.mark4 {width: 30px;height: auto;margin-top: -5px;margin-right:8px;}
.mark5 {width: 30px;height: auto;margin-top: -2px;margin-right:0px;}    
/*スマホ用メニューブロック680---------------------*/
#menubar-s {
	display: block;overflow: hidden;
	position: absolute;z-index: 2;
	top: 2px;right:1px;
	width: 360px;
	background: rgba(0,0,0,0.8);
	border-top: 1px solid #fff;
	animation-name: menubar;
	animation-duration: 0.5s;
	animation-fill-mode: both;
}
/*メニュー１個あたりの設定*/
#menubar-s li a {
	display: block;text-decoration: none;
	padding: 5px 30px;
	border-bottom: 1px solid #fff;
	color: #fff;
	font-size: 12px;
}
#subsub li a{
    font-size: 12px;
    padding: 5px 30px;
}
#subsub img {width:100px;        
    }    
li .current-s {background-color:#e5831f;}    

/*---PC用メニューを非表示にする680---*/
#menubar {display: none;}

/*----３本バーアイコン設定
---------------------------------------------------------------------------*/
/*----３本バーブロック-------------*/
#menubar_hdr {
	display: block;
	position: absolute;z-index: 2;
	top: 20px;
	right: 4%;
	border: 1px solid #fff;	
}
/*----アイコン共通設定680----*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 50px;
	height: 50px;
}
/*----三本バーアイコン----*/
#menubar_hdr.close {
	background: #e5831f url(../images/icon_menu.png) no-repeat center top/50px;	
}
/*----閉じるアイコン----*/
#menubar_hdr.open {
	background: #e5831f url(../images/icon_menu.png) no-repeat center bottom/50px;
}    
/*---本文　680--------------*/
.honbun {margin-bottom: 20px;}
.honbun p {
    font-size: 87%;
    line-height: 1.8;
    text-align: justify;
}
.honbun p + p {margin-top: 15px;}     

 
/*---しおり680------*/    
.siori {
    width: 80%;
    margin: 0 auto;
    background-color: #fff6d2;
    border-radius: 10px;
    padding: 10px 4%;
}

.siori ul {overflow: hidden;}
.siori li{
    float: left;
    list-style: none;
    font-size: 74%;
    line-height: 2.2;
    padding: 0 28px 0 0;
}
.siori2 {
    width: 84%;
    margin: 0 auto;
    margin-bottom: 30px;
    background-color: #fff6d2;
    border-radius: 10px;
    padding: 10px 4%;
}
.siori2 ul {overflow: hidden;}
.siori2 li{
    float:left;
    list-style: none;
    font-size: 74%;
    line-height: 2.2;
    padding: 0 20px 0  0;
} 
.gainatesaki {
    padding: 10px 7%;
    margin: auto;
    margin-bottom: 25px;
    width: 400px;
    border: 2px solid #F58631;
    font-size: 86%;   
}    
       
/*----トップページ　680----*/
.home #contents h2 {
	clear: both; 
	margin-bottom: 35px;
	font-size: 135%;
	text-align: center;
	line-height: 1.6;       
}
/*---h2の上にまる----*/
.maru p {
    text-align: center;
    font-size: 140%;
    color: #ff8c00;
}
/*----h2タグ内のspanタグ（英語の飾り文字）-------*/
.home h2 span {
	display: block;
	font-size: 70%;	
    line-height: 1.8;
	color: #e5831f;
	letter-spacing: 0.2em;
    margin-bottom: 10px; 
}
/*----h3の頭-------------*/
.mark1 {
    width: 46px;
    height: auto;
    margin-bottom: 6px;
    margin-right:-5px;
}
/*---トップページの頭の3つのポイント680-------------------------*/
#toppoint {
    margin: 0 auto 15px;
    padding: 0 2%;
    display: flex;
    flex-direction: column;
    justify-content:space-around;    
}
.list2 {
	width: 90%;
    display: flex;
    margin: 0 auto;
}
.list2 figure {
    width:40%;
    margin: 0 auto 23px;
    padding-right: 20px;
}
.list2 figure a:hover {
	opacity: 0.8;	/*マウスオン時。透明度80%にする。*/
}
.pointbun {
    width: 100%;
}
.pointbun h4 {
	background: #fd7208;	/*背景色（古いブラウザ用）_元は000*/
	background: rgba(255,135,43,0.8);
	color: #fff;
    font-size: 90%; 
    text-align: center;
    margin: 3px 0 8px;
}
.pointbun p {
    font-size: 84%;
    line-height: 1.6;
}
          
/*---トップページのコース案内ボックス（list4）設定680-------------------*/
.list4wrap {
    display: flex;
    flex-wrap: wrap; 
    justify-content: flex-start;
}
/*-------list4の要素はtable内に-------*/
.list4 {
    width: 48%;
    height: auto;
	background: #fff9f4;
    margin: 10px 1% 10px;
	border-radius: 6px;
	overflow: hidden;
	position: relative;
	-webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.2);
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
	padding: 10px 2% 14px;    
}
.list4 h4 {
    font-size: 105%;
    line-height: 1.4;
    font-weight: 500;
    margin-top: 8px;
    padding: 10px;
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #878787;
} 

.listmigi {
    margin-top: 16px;
}
.listmigi p {
    font-size: 88%;
    line-height: 1.9;
    text-align: left;
}
.listbun {
    margin: 12px 0 10px 0 ;
}
.listbun p {
    font-size: 95%;
    line-height:  1.7;
    text-align: justify;
}
.list4 a {text-decoration: none;}
.list4 a:hover {background: #fcf9d7;}
.list4banner {
    width: 48%;
    height: auto;
    background: #fff;
    margin: 10px 0.5%;
    overflow: hidden;
    position: relative;
    padding: 10px 3%;
    border: thin solid #909090;
    display: flex;
    flex-direction: column;
    text-align: center; 
}
.banner {
    margin-bottom: 2px;
}
.banner p {
    font-size: 70%;
    line-height: 1.5em;
    text-align: left;
    margin: 4px 0;
} 
.list4banner2 {display: none;}
.ban_1song {
    margin: 0 auto 30px;
    width: 68%;
}
.topbannerarea {
    margin: auto;
    padding: 10px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.topbanner {
    width: 155px;
    margin: 6px 8px 6px 0px;
}
.topbanner p {
    font-size: 66%;
    line-height: 1.3;
    font-feature-settings: "pwid";
    text-align: justify;
    margin-top: 5px;
    padding: 0 4px;
}
/*--トップページのコース案内改訂--*/
.listwrap {
    margin: 10px auto;
    flex-wrap: wrap; 
    justify-content: space-around;   
}
.ta9 {
    margin: 10px 1%;
    padding: 10px 10px;
    background-color: #fff9f4;
    -webkit-box-shadow: 2px 2px 3px rgba(114,110,110,0.75);
    box-shadow: 2px 2px 3px rgba(114,110,110,0.75);
}
.ta9 h4 {
    font-size: 110%;
    letter-spacing: -0.02em;
    line-height: 2;
    border: 2px dotted #F16E0B;
    border-radius: 57px;
    margin-bottom: 5px;
}
.ta9 a {text-decoration: none;}
.ta9 td{font-size: 83%;padding-right: 4px;}
.imag1 {width: 86%;height: auto;}
.ta9 td .lead2 {
    font-size: 110%;
 }        

/* ----トップページ中間部分の説明ボックス list50の設定680----*/

.list50 {
    width: 98%;
    position: relative;
    float: none;
    margin: 5px 1% 25px;
    padding: 15px 3% 20px;
    border: 4px dotted #3ab3f5;
    border-radius: 32px;
}
.list50 h4 {
	font-size: 110%;
    letter-spacing: 0.01em;
	color: #eb7802;
    text-align: left;
    padding: 2px 20px 0 20px;
    line-height: 1.6;
}
.phtx {
    /*clear: both;*/
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
/*----写真を右、文章を左680----------*/
.migi {
    width: 35%;
    margin-top: 20px;
    margin-bottom: 10px;
}
.bun_l {
    width: 60%;
	padding: 14px 0px 5px 9px;
}
.bun_l p {
    font-size: 85%;
    line-height: 1.7;
    text-align: justify;
}

/*----写真を左、文章を右680--------*/
.hidari {
    width: 35%;
    margin-top: 20px;
    margin-bottom: 20px;
}
.bun_r {
    width: 60%;
	padding: 14px 0px 10px 5px;
}
.bun_r p {
    font-size: 85%;
    line-height: 1.7;
    text-align: justify;
}
/*--更新ページの　680------*/  
.new2 {margin: auto;
    padding: 0px 2%;
}
.new2 dl {
	background: #eee;
    width: 100%;
	padding: 12px 14px;		
    font-size: 82%;
    margin-bottom: 12px;
    line-height: 1.7;
    text-align: justify; 
}


/*コースall紹介ページ　ボックス（list6）設定680------------------------*/
/*----home2はコースインデックスの---------*/
.home2 .main h2 {
	clear: both; 
	margin-bottom: 0px;
	font-size: 160%;
	text-align: center;
	line-height: 1.6;      
}
/*--コースインデックスのコースのリスト6　680--------------------*/
.list6 {
	background: #fff9f4;	
	margin-bottom: 8px;	
	border-radius: 8px;
	overflow: hidden;
	position: relative;
	-webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.2);
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
	padding: 12px;
}
.list6 h4 {
    width: 100%;
    margin: 10px 0;
    text-align: center;
    font-size: 110%;
    border-radius: 14px;
    border: 1px solid #666;
    padding: 4px;
    background-color: #fff;
}
.month img {
    width: 15%;
    height: auto;
    padding-left: 10px;
    padding-bottom: 4px;
}    

/*-----コースインデックスlist6内の表形式　680---------*/
.ta7 {display: block;}
.ta8 {display: none;}
.ta7 img {
    width: 100%;
    height: auto;
    padding: 5px 0 0 5px;
}
.ta7bun {
    font-size: 97%;
    text-align: justify;
    line-height: 1.8;
}
.ta7gaiyou {
    margin-top: 20px;
    font-size: 95%;
    text-align: justify;
    line-height: 1.8;
}
/*-----緑の項目-------*/
 .atama2 {
    color: #fff;
    background-color: #6fa375;
    padding: 3px 6px;
    border-radius: 6px;
    font-size: 93%;
}  
.list6 a {text-decoration: none;}
.list6 a:hover {background: #fcf9d7;} 
    
.bunrui {
    margin: 30px 0 20px 4px;
    border-left: 8pt solid #f98600;
    border-bottom: 2px solid #f98600;
    width: 99%;
    padding: 0 0 2px 12px;
}
.bunrui p {font-size: 110%;}
    
/*---おまけの読みものコラム　680---------*/    
#yomimono h4 {
    margin: 40px 0 20px 0;
    font-size: 114%;
    font-weight: 500;
    text-align: center;
    border-bottom: 2px solid #f98600;
}    

#yomimono {
    margin: 10px 0 20px 0;
    padding: 0;
}

#yomimono .midasi {
    font-size: 107%;
    margin-bottom: 10px;
    padding-left: 0px;
}
#hyou-b {display: none;}
.gterabi {
    margin-bottom: 30px;
    padding: 10px 5% 8px;
    border: 1px solid #d9ae27;
    background-color: #faf9df;
}
.ta6 {
	width: 100%;
	table-layout: fixed;
	margin: 10px 0px 30px;
}
.ta6, .ta6 td, .ta6 th {
	border: 1px solid #999;
	padding: 10px;
}
.ta6 th {
	text-align: center;
    line-height: 1.0;
	background: #fbd8bd;
    font-size: 98%;
	font-weight: normal;
}
.ta6 td {
    vertical-align: top;
    line-height: 1.7;
    font-size: 96%;
}
.ta6 h5 {text-align: justify;
    font-size: 105%;
}
.tdbun {margin-top: 8px;}
.icons {
    margin-top: 10px;
    padding: 0px 3% 0 10%;
}
    
/*青い項目*/
.atama3 {
    color: #fff;
    background-color: #2688d4;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 92%;
}    
.just2 {
    text-align: justify;
    font-size: 92%;
}
/*----各コースページ　680-----------------*/ 
.catch {   
    text-align: center;
    font-size: 97%;
    color: royalblue;
}
.cstitle {
    width: 88%;
    margin: 0 auto;		
    border-radius: 30px;	
    border: 3px dotted #f16e0b;	
    padding: 10px 4% 15px; 
}
.cstitle h2 {
    font-size: 122%;		
    text-align: center;		
    line-height: 1.5;
    letter-spacing: 0.05em;
}
.cstitle h2 span {
	display: block;
	font-size: 70%;	
	color: #e5831f;	
	letter-spacing: 0.1em;	
    margin-bottom: 10px; 
}
.cstitle .lead {
    font-size: 88%;
    line-height: 1.7;
    text-align: justify;
}
/*---コース見出し頭のアイコン枠　680--------*/
.icon2 {
    width: 82%;
    background: #fff4cc;
    border-radius: 14px;   
}
.gakki {
    padding: 8px 7%;
}    
/*----とくとく写真-------------*/
.tokimag {
    margin: 0px 10% 10px;
    padding: 2px;
    text-align: center;
}
/*----コースの値段の囲み----------*/
.nedan {
    margin-bottom: 20px;
    text-align: center;
    padding: 14px 10px 14px 10px;
    background-color: rgba(253,231,215,0.90);
}
.atama4 {
    color: #fff;
    background-color: #2688d4;
    margin-right: 5px;
    padding: 3px 18px;
    border-radius: 10px;
    font-size: 70%;
    vertical-align: 0.2em;
}      
.course .nedan h3 {
    font-size: 98%;
    line-height: 1.6;
    font-weight: 500;
    padding: 5px 20px;
    margin-bottom: 14px;
    background-color: #fff;
    border-radius: 16px;
    border: 1px solid #6a6a6a;
}

.nedan p {font-size: 88%;line-height: 1.7;}
.medatu {color: #098079;}
/* .naiyou {
    padding: 10px 0 30px;
}
.naiyou p {
    font-size: 90%;
    line-height: 1.8;
    text-align: justify;
    margin-bottom: 10px;
}  */
.chuu p {
    font-size: 84%;
    color: #006400;
    margin-bottom: 0px;
} 
.site2 {
    background-color: #FFFFD8;
    padding: 16px 10px 5px 10px;   
}
.site2 p {font-size: 77%;}
.site2 a {text-decoration: none;}
/*---案内動画まわり680-------------------*/
.dlimg {padding: 10px 5% 20px; display: block;}    
.dlimg {width: 80%;height: auto;}     
.gallary {
    padding: 0px 0px 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
}
.gallary img {
    width:220px;
    height:auto;
    padding: 0px 7px 7px;
}        
.video {
    text-align: center;
    }
.videouk {text-align: center;}
.videouk h5 {font-size: 80%;}
.videouk video{width: 448px; height: auto;}    
.youtube {
    margin: 5px 10% 0px;
    width: 80%;
    height: auto; 
    padding: 0px;
}
.youtube iframe {
    max-width:440px; 
    min-height: 248px;
}    
.pdfdown {margin-top: 5px;}
.pdfdown table {width: 88%;padding-left:10%;}
.pdfdown td {font-size: 90%;}
.pdfdown a :hover {background-color: rgba(113,112,112,0.20);}

/*---YouTubeの画面説明--*/
.gamensample p {
    font-size: 89%;
    text-align: justify;
    margin-bottom: 14px;
}
.gamen {
    margin-bottom: 5px;
    padding: 8px 60px 20px;  
}
.gamen img {
    width: 100%;
    height: auto;
    text-align: center;   
}    
/*---教材の代金と申し込み　カート680---------*/
.daikin {margin: 15px 0px 35px;}
.daikin h5 {
    margin-bottom: 14px;
    font-size: 95%;
}
.daikin p {
    font-size: 90%;
    text-align: justify;
    margin-bottom: 20px;
}
.syouhinimg {
    background-color: #faebd7;
    min-height : 190px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 5px 10px;
}
.stcode {
    background-color: #faebd7;
    padding: 0px 10px 10px 10px;
    font-size: 78%;
}
.product1 {
    width: 150px;
    height: auto;
    padding: 2px 20px 3px 10px;
    }

.product2 {
    max-width: 150px;
    height: auto;
    padding: 2px 14px 0px 1px;
    }   
.cartgroup {
    width: 300px;
    max-height: 170px;
    background-color: #fff;
    border: 2px dotted #1647a8;
    margin: 0 auto;   
}
.cartgroup h6{
    font-size: 76%;
    letter-spacing: -0.025em;
    text-align: center;
    margin: 20px 0px 15px;
}
.cart {
    text-align: center;    
}
.cart img {
    max-width: 150px;
    height: auto;
    margin-bottom: 10px;
}
.come {
    margin-top: 0px;
    margin-bottom: 15px;
    font-size: 75%;}

.cart a :hover {background-color: rgba(113,112,112,0.20);}

.course h4 {
    margin: 40px 0 15px 0;
    border-left: 8pt solid #f98600;
    font-size: 105%;
    border-bottom: 2px solid #f98600;
    }   

/*---コースの表680----*/
.ta4 {
	width: 100%;
	table-layout: fixed;
	margin: 20px 0px 30px;
}
.ta4, .ta4 td, .ta4 th {
	border: 1px solid #999;	
	padding: 12px;
}
.just {text-align: justify;}

.ta4 th {
	text-align: center;
	background: #cce6f6;
	font-weight: normal;
	font-size: 80%;
    line-height: 1;
    letter-spacing: 0.3em;    
}
.ta4 td {
    font-size: 87%;
    line-height: 1.7;
    word-break: break-all;
}
.ta4 h5 {font-weight: 600;}    
.ta4 td img {
    padding: 5px 8px 0 16px;
    width: 80%;
    height: auto;
}
/*--トップの送料の表--*/
.ta50 {
	width: 80%;
	table-layout: fixed;
	margin: 15px 5px 10px 10px;
}
.ta50, .ta50 td, .ta50 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta50 th {
	text-align: center;
	background: #cce6f6;
	font-size: 86%;
    line-height: 1;   
}
.ta50 td {
    font-size: 86%;
    line-height: 1.3;
    text-align: center;
    word-break: break-all;
}
/*--利用ガイド内の送料の表--*/
.ta51 {
	width: 80%;
	table-layout: fixed;
	margin: auto;
}
.ta51, .ta51 td, .ta51 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta51 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta51 td {
    font-size: 83%;
    line-height: 1.3;
    text-align: center;
    word-break: break-all;
} 
/*ウクレレダウンロード版-----*/
.ta-dl1 {
    width: 100%;
    margin: 20px auto;
    background-color: #fff;    
}
.ta-dl1 td{
    padding: 10px;    
}
.ta-dl1 h3{
    font-size: 100%;
    color: #D56994;
    font-weight: bolder;
    margin-bottom: 13px;
}
.ta-dl1 p {
    font-size: 85%;
}
.teika {font-size: 90%;}    
    

/*講師紹介のわく 680*/
.koushi{
    width: 90%;
    margin: 20px 0;
    background-color: rgba(211,233,247,0.80);
    padding: 2px 4.5% 20px;
}
.koushi h5 {
    margin-bottom: 4px;
    font-size: 80%;
}
.koushi_waku{
    display: flex;
    background-color: #fff;
    padding: 8px;
}
.koushi_bun{
    width:72%;
    font-size: 78%;
    line-height: 1.7;
}
.koushi_bun2{
    font-size: 78%;
    line-height: 1.8;
}    
.koushi_fa {width: 28%;
    margin:10px 0px 10px 10px;   
}
.koushi_fa img {width: 80%;height: auto;}

.txsampl {margin-bottom: 40px;
    margin-left: -15px;
    margin-right: -15px;}
.txsampl p {
    margin: 20px 0;
    font-size: 90%;
} 
.hassou {display: flex;justify-content: center;}
.hassou img {width: 74%;height: auto;}
.yuucho {
    display: flex;
    flex-wrap: wrap;
    margin: 15px 0;
    background-color: #f5f5dc;
    padding: 12px 2%;
}
.yuucho img {width: 49%;height:auto;}
.tejun {width: 45%;padding: 40px 0 0 0;}
.tejun ul {font-size: 75%;}

.hurigami {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.zukai3 {
    text-align: center;
    margin-bottom: 10px;}
.zukai3 img {width: 66%;}    
.hurigami ul {
    width: 66%;
    margin: 0 20% 10px;
    font-size: 77%;
}
/*---ご利用ガイド680--------------*/
/*oomidasiはfaqと共通*/
.oomidasi {
    clear: both;
    margin-bottom: 25px;	
    border-radius: 30px;
    border: 3px dotted #f16e0b;	
    padding: 10px 5%;
}
.oomidasi h2 {
    font-size: 140%;
    text-align: center;
    line-height:  1.5;
}
.oomidasi h2 span {
	display: block;
	font-size: 60%;	
    line-height: 1.5;
	color: #e5831f;	
	letter-spacing: 0.2em;	
    margin-bottom: 10px; 
}
.oomidasi .lead {
    margin: 0px 0px 2px 0px;
    padding-top: 10px;
    border-top: 2px solid #5c5a5a;
}
.oomidasi .lead p {
    font-size: 82%;
    line-height: 1.7;
    text-align: justify;
}
.oomidasi2 {
    clear: both;
    width: 80%;
    margin: 0 10% 30px;	
    border-radius: 50px;
    border: 3px dotted #f16e0b;	
    padding: 10px 30px 10px 30px;
}
.oomidasi2 h2 {
    font-size: 170%;
    text-align: center;
    line-height:  1.7;
}
.oomidasi2 h2 span {
	display: block;
	font-size: 60%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	 
}
/*よく頂く質問ページ　利用ガイドも　680-------------------------*/

/*質問の設定*/
.faq dt {
	color: #e5831f;
	padding-top: 10px;
	margin-bottom: 10px;
    font-size: 84%;
    text-align: justify;
}
/*回答の設定*/
.faq dd {
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding-bottom: 10px;
    font-size: 84%;
    text-align: justify;
}
/*「Q」と「A」のマーク共通設定*/
.faq dt::before,
.faq dd::before {
	margin-right: 5px;display: inline-block;text-align: center;
	width: 22px;
	line-height: 22px;
}

.fandq h3 {
    clear: both;
    margin: 40px 0 20px;
    text-align: center;
    font-size: 110%;
    line-height: 2.5;
    border-radius: 30px;
    border: 1px solid #666;
    padding: 0 20px;
    background-color: #fff;    
}
.fandq h6 {
    font-size: 90%;
    margin-bottom: 5px;
}    
.zukai {
    margin: 10px;
    padding: 10px 0px;
    }
.zukai img {width: 480px;height: auto;}
.zukai2 {text-align: center;margin-bottom: 40px;}
.zukai2 img {width: 350px;height: auto;}    

.tokuzu {
    width: 100%;
    margin: auto;
    padding: 20px 20px;
    margin-bottom: 15px;
    background-color: #f5f5dc;
    display: flex;
    flex-direction: column;
    align-items: center;    
}
.tokuzu img {
    width: 400px;height: auto;
}
.cyapu {
    width: 94%;
    text-align: left;
    margin: 18px auto;
    font-size: 92%;
    line-height: 1.7;
}
.tokuzucan {
    width: 74%;
    margin: auto;
    padding: 20px 20px;
    margin-bottom: 15px;
    background-color: #E0EDF4;
    display: flex;
    flex-direction: column;
    align-items: center;   
}
.tokuzucan img {
    width: 340px;height: auto;
}
.cyapu2 {
    width:96%;
    text-align: left;
    margin: 16px 0px;
    font-size: 92%;
    line-height: 1.7;
}  
.atesaki {
    font-size: 88%;
    text-align: justify;
    margin-bottom: 10px;
    padding: 0px;
}    
/*教材のご購入のページ　680-----------------*/
.oomidasi3 {
    width: 66%;
    height: auto;
    margin: 0 auto 30px;	
    border-radius: 20px;
    border: 3px dotted #f16e0b;	
    padding: 10px;
}
.oomidasi3 h2 {
    font-size: 130%;
    text-align: center;
    line-height:  1.4;
}
.oomidasi3 h2 span {
	display: block;
	font-size: 65%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	 
}
.kounyuwrap {
    margin: 24px auto;
    padding: 0 3%;
}
.k1 p {
    font-size: 85%;
    line-height: 1.7;
}    

.kounyuwrap2 {
    padding: 25px 5% 0px; 
    font-size: 92%;
}    
.kounyuwrap h4 {
    margin: 20px 0px;
    border-left: 10pt solid #f98600;
    font-size: 110%;
    border-bottom: 2px solid #f98600;
    padding-left: 10px;
}
.btnlead {
    margin: 0 auto;
    padding: 10px;
}
.btnlead p {
    text-align: center;
    font-size: 85%;
    margin-bottom: 10px;
}    
.sugubtn {
    width: 80%;
    margin: 0px 10%;
    padding: 0px;
    text-align: center;
}
.sugubtn img {
    padding: 0px 0px 10px;
    width: 150px;
    align-content: center;
}  
.kounyu p {
    font-size: 95%;
    margin-bottom: 40px;
    text-align: justify;
    padding: 0;
}
.tokucho {
    width : 330px;
    height: auto;
    margin: auto;
    margin-bottom: 30px;
    background-color: #fff6d2;
    padding: 10px 20px 5px;
}
.tokucho p {
    font-size: 92%;
    margin-bottom: 0px;
}
.tokucho ul {
    font-size: 88%;
    padding: 0px 0px 5px 40px;
}
.atama6 {
    color: #fff;
    background-color: #2688d4;
    padding: 8px 10px;
    border-radius: 4px;
    font-size: 96%;
}
.storehyou {
    margin: -10px 0 30px;
    display: flex;
    justify-content: center;
}    
.kounyuwrap table {
    width: 94%;
    font-size: 75%;
}    
.cartgroup2 {
    width : 300px;
    height: auto;
    margin: auto;
    margin-top: 0px;
    margin-bottom: 20px;
    background-color: #fff;
    border: 2px dotted #1647a8;
    }
.cartgroup2 h6 {
    font-size: 84%;
    text-align: center;
    margin: 10px 0 ;
}
.cartgroup2 .cart img{
    width:55%;
    height: auto;
    margin-bottom: 18px;
}
.kuwake {
    margin: auto;
    padding-left: 3%;
	font-size: 110%;
    text-align: left;
    letter-spacing: 0.02em;
	color: #e5831f;
}
.detail {
    border: 1px solid #FA9D56;
    margin-bottom: 10px;
}
.voicearea2 {
    display: flex;
    flex-flow: wrap;
    justify-content: flex-start;
    margin-bottom: 20px;
    }
.voice2 {
    width: 31%;
    height: auto;
    padding: 10px 10px 10px 10px;
    background-color: rgba(210,255,245,0.90);
    margin: 10px 0 10px 8px;
}
.voice2 p {
    font-size: 78%;
    line-height: 1.5;
    text-align: justify;
    padding-top: 10px;
} 
.voicearea3 {
    display: flex;
    flex-flow: wrap;
    justify-content: center;
    margin-bottom: 24px;
    font-size: 95%;
    }
#youtubewaku p {font-size: 86%;margin-bottom: 20px;}    
.voice3 {
    width: 40%;
    height: auto;
    padding: 10px;
    background-color: rgba(210,255,245,0.90);
    margin: 6px;
    -webkit-box-shadow: 2px 2px 4px 1px #C6C0C0;
    box-shadow: 2px 2px 4px 1px #C6C0C0;
}
.voice3 p {
    line-height: 1.5;
    text-align: justify;
    padding-top: 10px;
}
.voicearea4 {
    display: flex;
    flex-flow: wrap;
    justify-content:space-around;
    padding: 0px;
    margin-bottom: 10px;
    }
.voice4 {
    width: 30%;
    height: auto;
    padding: 6px;
    background-color: rgba(210,255,245,0.90);
    margin: 6px;
    -webkit-box-shadow: 2px 2px 4px 1px #C6C0C0;
    box-shadow: 2px 2px 4px 1px #C6C0C0;
}    
}


/*画面幅550px以下の設定
------------------------------------------------------------------*/
@media screen and (max-width:550px){

/*全体の設定
----------------------------------------------------------------*/
header #logo img {width:230px;}    
body {font-size: 16px;}
    
/*---main,subコンテンツ550-----------------------------------------*/
#formstyle #contents .main {
    width: 94%;
    margin: auto;
}
#contents {
	clear: both;
    overflow: hidden;
    position: relative;
	background: #fff;
	padding: 5% 2%;		
	margin: 0 2% 0px;	
}
        
#contents .main {
	float: none;
	width: auto;
    padding: 10px;
}
/*---サブメニューは下に2ブロック　550----------*/    
#contents .sub {
	float: none;
    width: auto;
    padding: 20px 1%;
    display: flex;
    flex-direction: column-reverse;    
}
.subw1 {
    display: flex;
    justify-content: center;
} 
.subgrp {
    margin: 0 1.3% 20px ;   
}    
.sub .box1,
.sub .box2,
.sub .box3,
.sub .box4 {
     width: 178px;   
 }
.sub .box5 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}    
.sub .banner-s {
    width: 165px;
    margin: 2px 2%;
 } 
/*---写真の上の飾り---*/
.kei {
    padding: 0px 2%;
}
.message1 {
    padding: 5px 0%;
    text-align: center;
    font-size: 82%;
}
.message2 {
    padding: 4px 3% 20px;
    text-align: center;
    font-size: 66%;
}    
.pop {
  margin: 0px auto 20px;
  width: 380px;
  padding: 10px 2px;      
}
.pop img {width:380px;height:auto;}  
    
/*マークの設定各種*/
.mark2 {width: 60px;height: auto;margin-top: -10px;margin-left:-50px;}
.mark3 {width: 30px;height: auto;margin-top: 0px;padding-right:5px;}
.mark4 {width: 25px;height: auto;margin-top: -5px;margin-right:8px;}
.mark5 {width: 29px;height: auto;margin-top: -2px;margin-right:0px;}      
/*---mainのsection同士の余白　550--------------*/
#contents section + section {
	margin-top: 30px;
}
/*---スマホ用メニューブロック 550---------------------*/
#menubar-s {
	display: block;overflow: hidden;
	position: absolute;z-index: 2;
	top: 2px;right: 1px;
	width: 330px;
	background: rgba(0,0,0,0.8);
	border-top: 1px solid #fff;	
	animation-name: menubar;
	animation-duration: 0.5s;
	animation-fill-mode: both;	
}
/*---メニュー１個あたりの設定---*/
#menubar-s li a {
	display: block;
    text-decoration: none;
	padding: 5px 30px;
	border-bottom: 1px solid #fff;
	color: #fff;
	font-size: 12px;
}
#subsub li a {
    font-size: 12px;
    padding: 5px 30px;
}
li .current-s {background-color:#e5831f;}    

/*--PC用メニューを非表示にする　550--*/
#menubar {display: none;}

/*-３本バーアイコン設定
------------------------------------------------------------------*/
/*---３本バーブロック-------*/
#menubar_hdr {
	display: block;
	position: absolute;z-index: 2;
	top: 20px;
	right: 4%;
	border: 1px solid #fff;	
}
/*---アイコン共通設定---*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 50px;
	height: 50px;
}
/*---三本バーアイコン---*/
#menubar_hdr.close {
	background: #e5831f url(../images/icon_menu.png) no-repeat center top/50px;
}
/*---閉じるアイコン---*/
#menubar_hdr.open {
	background: #e5831f url(../images/icon_menu.png) no-repeat center bottom/50px;
}    
     
/*---本文　550--------------*/
.honbun {margin-bottom: 15px;}
.honbun p {
    font-size: 88%;
    line-height: 1.8;
    text-align: justify;
}
.honbun p + p {margin-top: 10px;} 
    
/*------リンクの囲み　550--------------------*/
.siori {
    width: 88%;
    margin: 0 auto;
    background-color: #fff6d2;
    border-radius: 10px;
    padding: 10px 6%;
}

.siori ul {overflow: hidden;}
.siori li{
    float: left;
    list-style: none;
    font-size: 70%;
    line-height: 2.2;
    padding: 0 22px 0 0;
}

.siori2 {
    width: 88%;
    margin: 0 auto;
    margin-bottom: 30px;
    background-color: #fff6d2;
    border-radius: 10px;
    padding: 8px 10px 8px 20px;
}

.siori2 ul {overflow: hidden;}
.siori2 li{
    float:left;
    list-style: none;
    font-size: 75%;
    line-height: 2.2;
    padding: 0 13px 0  0;
}
.gainatesaki {
    padding: 10px 4%;
    margin: auto;
    margin-bottom: 30px;
    width: 340px;
    border: 2px solid #F58631;
    font-size: 88%;
    -webkit-box-shadow: inset 2px 2px 7px 4px #FBDAC0;
    box-shadow: inset 2px 2px 7px 4px #FBDAC0;
}    

/*---トップページ　550-------------------------*/       
.home #contents h2 {
	clear: both; 
	margin-bottom: 25px;
	font-size: 155%;
	text-align: center;
	line-height: 1.6;       
}
/*---h2の上にまる　550---------------------*/
.maru p {
    text-align: center;
    font-size: 135%;
    color: darkorange;
}
/*---h2タグ内のspanタグ（英語の飾り文字）--------------*/
.home h2 span {
	display: block;
	font-size: 60%;
    line-height: 1.8;
	color: #e5831f;
	letter-spacing: 0.2em;
    margin-bottom: 0px;
}
/*-------h3の頭-----------------*/
.mark1 {
    width: 46px;
    height: auto;
    margin-bottom: 6px;
    margin-right:-5px;
}    
/*トップページの頭の3つのポイント　550-------------------------*/
#toppoint {
    margin: 0 auto;
    padding: 20px 0 0;
    display: flex;
    flex-direction: column;
    justify-content:space-around;    
}
.list2 {
	width: 90%;
    display: flex;
    margin: 0 auto 10px;
}
.list2 figure {
    width:40%;
    margin: 0 auto 25px;
    padding-right: 10px;
}
.list2 figure a:hover {
	opacity: 0.8;	/*マウスオン時。透明度80%にする。*/
}
.pointbun {
    width: 100%;
}
.pointbun h4 {
	background: #fd7208;	/*背景色（古いブラウザ用）*/
	background: rgba(255,135,43,0.8);
	color: #fff;
    font-size: 88%; 
    text-align: center;
    margin-bottom: 7px;
}
.pointbun p {
    font-size: 84%;
    line-height: 1.6;
}
/*---左右の写真を見せなくする　550-----------*/
.usiro-le {position: relative;}
.usiro-le img {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 25%;
}
.usiro-ri {position: relative;}
.usiro-ri img {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    width: 25%;
}    
/*トップページのコース案内ボックス（list4）設定550-----------------------*/
.list4wrap {
    display: flex;
    flex-wrap: wrap; 
    justify-content: flex-start;
}
/*---list4の要素----------------------*/
.list4 {
    width: 47%;
    height: auto;
	background: #fff9f4;
    margin: 5px 1.5% 10px;
	border-radius: 6px;
	overflow: hidden;
	position: relative;
	-webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.2);
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
	padding: 10px 2% 10px;    
}
.list4 h4 {
    font-size: 89%;
    line-height: 1.5;
    font-weight: 500;
    margin-top: 10px;
    padding: 8px;
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #878787;
} 

.listmigi {
    margin-top: 14px;
}
.listmigi p {
    font-size: 88%;
    line-height: 1.9;
    text-align: left;
}
.listbun {
    margin: 12px 0 10px 0;
}
.listbun p {
    font-size: 90%;
    line-height:  1.7;
    text-align: justify;
}
.list4 a {text-decoration: none;}
.list4 a:hover {background: #fcf9d7;}
.list4banner {
    width: 48%;
    height: auto;
    background: #fff;
    margin: 10px 0.5%;
    overflow: hidden;
    position: relative;
    padding: 10px 3%;
    border: thin solid #909090;
    display: flex;
    flex-direction: column;
    text-align: center; 
}
.banner {
    margin-bottom: 2px;
}
.banner p {
    font-size: 70%;
    line-height: 1.5em;
    text-align: left;
    margin: 4px 0;
} 
.list4banner2 {display: none;}
.ban_1song {
    margin: 0 auto 30px;
    width: 72%;
}
.topbannerarea {
    margin: 40px auto 0px;
    padding: 2px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.topbanner {
    width: 180px;
    margin: 5px 8px 5px 0px;
}
.topbanner p {
    font-size: 74%;
    line-height: 1.3;
    font-feature-settings: "pwid";
    text-align: justify;
    margin-top: 5px;
    padding: 0 4px;
}    
/*--トップページのコース案内改訂--*/
.listwrap {
    margin: 10px auto 20px;   
}
.ta9 {
    margin: 10px 1%;
    padding: 12px 8px;
    background-color: #fff9f4;
    -webkit-box-shadow: 2px 2px 3px rgba(114,110,110,0.75);
    box-shadow: 2px 2px 3px rgba(114,110,110,0.75);
}
.ta9 h4 {
    font-size: 100%;
    letter-spacing: -0.05em;
    line-height: 2;
    border: 2px dotted #F16E0B;
    border-radius: 57px;
    margin-bottom: 5px;
}
.ta9 a {text-decoration: none;}
.ta9 td{font-size: 83%;padding-right: 4px;}
.imag1 {width: 90%;height: auto;}
.ta9 td .lead2 {
    font-size: 107%;
    line-height: 1.5;
 }        
/*---トップページ中間部分の説明ボックスlist50 550の設定--------*/

.list50 {
    width: 98%;
    position: relative;
    float: none;
    margin: 5px 1% 20px;
    padding: 12px 2% 10px;
    border: 3px dotted #3b3f5;
    border-radius: 30px;
}
.list50 h4 {
	font-size: 110%;
    text-align: left;
    letter-spacing: 0.01em;
	color: #eb7802;
    padding: 5px 17px 0 17px;
}
.phtx {
    /*clear: both;*/
    display: flex;
    flex-direction: column;
    align-items: center
}
/*---写真を右、文章を左------------*/
.migi {
    width: 48%;
    margin: 10px auto;
}
.bun_l {
    width: 98%;
	padding: 14px 1% 10px;
}
.bun_l p {
    font-size: 90%;
    line-height: 1.8;
    text-align: justify;
}

/*---写真を左、文章を右-----------*/
.hidari {width: 48%;
    margin: 10px auto;
}
.bun_r {
    width: 98%;
	padding: 14px 1% 10px;
}
.bun_r p {
    font-size: 90%;
    line-height: 1.8;
    text-align: justify;
}
/*---トップページ下のほうの表550------------*/
.ta3 {
	width: 100%;
	table-layout: fixed;
	margin: 0 auto;
    margin: 15px 0;
}
.ta3, .ta3 td, .ta3 th {
	border: 1px solid #999;
	line-height: 1.6;
    font-size: 88%;
	padding: 8px;
	word-break: break-all;
}
/*----ta3の上のボックス----*/
.ta3 th {
	text-align: center;
	background: #fbd8bd;
	font-weight: normal;
}
/*--トップの送料の表--*/
.ta50 {
	width: 90%;
	table-layout: fixed;
	margin: 10px auto;
}
.ta50, .ta50 td, .ta50 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta50 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta50 td {
    font-size: 90%;
    line-height: 1.3;
    text-align: center;
    word-break: break-all;
}
/*--利用ガイド内の送料の表--*/
.ta51 {
	width: 100%;
	table-layout: fixed;
	margin: auto;
}
.ta51, .ta51 td, .ta51 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta51 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta51 td {
    font-size: 83%;
    line-height: 1.3;
    text-align: center;
    word-break: break-all;
}
/*ウクレレダウンロード版-----*/
.ta-dl1 {
    width: 100%;
    margin: 20px auto;
    background-color: #fff;    
}
.ta-dl1 td{
    padding: 8px 10px;    
}
.ta-dl1 h3{
    font-size: 100%;
    color: #D56994;
    font-weight: bolder;
    margin-bottom: 13px;
}
.ta-dl1 p {
    font-size: 88%;
}
.teika {font-size: 94%;}    
/*トップページの教材一覧*/
.lineup {
    width: 100%;
    margin: 5px auto 40px;
    padding: 10px 0px;
    background: #FBFAF4;
    display: flex;
    flex-wrap: wrap;
}
.lineup a {width:20%;}
.lineup img {
    width: 85%;
    padding: 10px 0px;
}    

/*--お客様の感想のバルーン　550----------------*/
.list7 h4 {
	font-size: 120%;
    letter-spacing: 0.02em;
    text-indent: 0.02em;
	color: #e5831f;
}
.list7 {
	/*overflow: hidden;*/
	border-top: 1px solid #ccc;
	padding: 20px 0 10px;
}
.voicearea {
    display: flex;
    flex-flow: wrap;
    justify-content: space-around;
    margin-bottom: 5px;
    }
.voice {
    width: 90%;
    height: auto;
    padding: 15px 15px 15px 15px;
    background-color: rgba(253,207,198,0.90);
    border-radius: 20px;
    margin-top: 20px;
}
.voice p {
    font-size: 79%;
    line-height: 1.7;
    text-align: justify;
} 
/*--SPコンテンツのボックス--*/
.kuwake {
    margin: auto;
    padding-left: 3%;
	font-size: 110%;
    text-align: left;
    letter-spacing: 0.02em;
	color: #e5831f;
}
.detail {
    border: 1px solid #FA9D56;
    margin-bottom: 10px;
}
.voicearea2 {
    display: flex;
    flex-flow: wrap;
    justify-content: flex-start;
    margin-bottom: 30px;
    }
.voice2 {
    width: 47%;
    height: auto;
    padding: 10px 8px 10px 8px;
    background-color: rgba(210,255,245,0.90);
    margin: 10px 0 10px 8px;
}
.voice2 p {
    font-size: 78%;
    line-height: 1.5;
    text-align: justify;
    padding-top: 7px;
}  
.voicearea3 {
    display: flex;
    flex-flow: wrap;
    justify-content: center;
    margin-bottom: 24px;
    font-size: 95%;
    }
#youtubewaku p {font-size: 90%;margin-bottom: 20px;}    
.voice3 {
    width: 40%;
    height: auto;
    padding: 10px;
    background-color: rgba(210,255,245,0.90);
    margin: 6px;
    -webkit-box-shadow: 2px 2px 4px 1px #C6C0C0;
    box-shadow: 2px 2px 4px 1px #C6C0C0;
}
.voice3 p {
    line-height: 1.5;
    text-align: justify;
    padding-top: 10px;
} 
.voicearea4 {
    display: flex;
    flex-flow: wrap;
    justify-content:space-around;
    padding: 0px;
    margin-bottom: 10px;
    }
.voice4 {
    width: 44%;
    height: auto;
    padding: 6px;
    background-color: rgba(210,255,245,0.90);
    margin: 6px;
    -webkit-box-shadow: 2px 2px 4px 1px #C6C0C0;
    box-shadow: 2px 2px 4px 1px #C6C0C0;
}    
/*--トップページの更新情報ブロック 550--------------------*/
#new dl {
	background: #eee;
    width: 94%;
    margin: 0 auto;
	padding: 18px;
	border-radius: 4px;
    font-size: 88%;
    line-height: 1.8;
    font-feature-settings: "pwid";
    text-align: justify;
}
/*----日付設定---------------*/
#new dt {
	float: left;
	width: 8em;
	color: #e5831f;
}
/*----記事設定-----------------*/
#new dd {
	padding-left: 0em;
}
/*---更新ページの更新情報550----------------------*/
.new2 {margin: auto;
    padding: 0px 2%;
}
.new2 dl {
	background: #eee;
    width: 100%;
	padding: 14px 14px;		
    font-size: 88%;
    margin-bottom: 10px;
    line-height: 1.7;
    text-align: justify; 
}
.new2 dt {
	float: left;
	width: 8em;	
	color: #e5831f;	
	letter-spacing: 0.1em;
    font-size: 92%;
}
.new2 dd {
	padding-left: 0em;
}     
    
/*----各コースページ　550-------------------------*/ 
.catch {   
    text-align: center;
    font-size: 110%;
    color: royalblue;
}
.cstitle {
    width: 90%;
    margin: 0 auto;		
    border-radius: 26px;	
    border: 3px dotted #f16e0b;	
    padding: 10px 4%; 
}
.cstitle h2 {
    font-size: 130%;		
    text-align: center;		
    line-height: 1.5;
    letter-spacing: 0.025em;
}
.cstitle h2 span {
	display: block;
	font-size: 75%;	
	color: #e5831f;	
	letter-spacing: 0.025em;	
    margin-bottom: 10px; 
}
.cstitle .lead {
    font-size: 85%;
    line-height: 1.7;
    text-align: justify;
    margin-bottom: 5px;
}
/*---コース見出し頭のアイコン枠　550--------------------*/
.icon2 {
    width: 88%;
    background: #fff4cc;
    border-radius: 10px;
    margin: 0 auto;
    margin-bottom: 15px;
}
.gakki {
    padding: 8px 4%;
}    

/*---とくとく写真-----------------*/
.tokimag {
    margin: 10px 0 10px 0;
    text-align: center;
    padding: 0px 20px 3px;
}

/*---コースの値段の囲み-----------------*/
.nedan {
    margin-bottom: 20px;
    text-align: center;
    padding: 14px 10px 14px 10px;
    background-color: rgba(253,231,215,0.90);
}
.atama4 {
    color: #fff;
    background-color: #2688d4;
    margin-right: 5px;
    padding: 3px 18px;
    border-radius: 10px;
    font-size: 80%;
}      
.course .nedan h3 {
    font-size: 100%;
    line-height: 1.6;
    font-weight: 500;
    letter-spacing: -0.01em;
    margin-bottom: 15px;
    background-color: #fff;
    border-radius: 16px;
    border: 1px solid #6a6a6a;
    padding: 8px 18px;
}

.nedan p {
    font-size: 88%;
    line-height: 1.8;
}
.medatu {color: #098079;}
/*  .naiyou {
    padding: 3px 0 10px;
}
.naiyou p {
    font-size: 90%;
    line-height: 1.8;
    text-align: justify;
    margin-bottom: 10px;
}  */
.chuu p {
    font-size: 84%;
    color: #006400;
    margin-bottom: 20px;
}
.site2 {
    background-color: #FFFFD8;
    padding: 12px 10px 8px 10px;   
}
.site2 p {font-size: 73%;}
.site2 a {text-decoration: none;}    
/*---案内動画まわり　550---------------------------*/
.dlimg {padding: 10px 0px; display: block;}    
.dlimg {width: 94%;height: auto;}     
.gallary {
    padding: 00px 0px 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
}
.gallary img {
    width:300px;
    height:auto;
    padding: 0px 0px 7px;
}  
#sityouken {
    background-color: #F0FCE2;
    padding: 0px 15px 20px 15px;   
}
#sityouken h5 {
    font-size: 85%;
    color: #0D7235;
    padding-top: 20px;
}
#sityouken p {
    font-size: 80%; padding-left: 0px; 
}    
    
.video {text-align: center;}
.video h5 {font-size: 80%;}
.videouk {text-align: center;}
.videouk h5 {font-size: 80%;}
.videouk video{width: 90%; height: auto;}    
.youtube {
    margin: 0 auto;
    width: 90%;
    height: auto; 
    padding: 5px;
}
.youtube iframe {
    max-width:400px; 
    min-height: 225px;
}    
.pdfdown {margin-top: 2px;}
.pdfdown table {width: 97%;}
.pdfdown td {font-size: 90%;letter-spacing: -0.025em;}
.pdfdown a :hover {background-color: rgba(113,112,112,0.20);}
 
/*---YouTubeの画面説明---------------------*/
.gamensample p {
    font-size: 85%;
    text-align: justify;
    margin-bottom: 12px;
}
.gamen {
    margin-bottom: 5px;
    padding: 5px 14px 20px;  
}
.gamen img {
    width: 100%;
    height: auto;
    text-align: center;  
}    
/*---教材の代金と申し込み　カート550---------------*/
.daikin {margin: 15px 1% 40px;}
.daikin h5 {
    margin-bottom: 14px;
    font-size: 94%;
}
.daikin p {
    font-size: 86%;
    text-align: justify;
    margin-bottom: 10px;
}
.syouhinimg {
    width:100%;
    margin: 20px 0px 0px;
    padding: 0px 0px 20px;
    height : auto;
    display: flex;
    flex-direction: column;
}
.product1 {
    width: 150px;
    height: auto;
    margin: 0 auto;
    padding: 5px 0px 5px;  
}   
.product2 {
    width: 180px;
    height: auto;
    margin:  0 auto;
    padding: 10px 0 14px;
}       
.cartgroup {
    width: 300px;
    background-color: #fff;
    border: 2px dotted #1647a8;
    margin: 0 auto;
}
.cartgroup h6{
    font-size: 80%;
    letter-spacing: -0.025em;
    text-align: center;
    margin: 10px 0px 10px 0px;
}
.cart {
    text-align: center;    
}
.cart img {
    width: 150px;
    height: auto;
    margin-bottom: 18px;
}
.come {
    margin-top: -10px;
    margin-bottom: 10px;
    font-size: 78%;
}
.stcode {
    background-color: #faebd7;
    padding: 0px 10px 10px 10px;
    font-size: 75%;
}    
.cart a :hover {background-color: rgba(113,112,112,0.20);}

.course h4 {
    margin: 40px 0 14px 0;
    border-left: 8pt solid #f98600;
    font-size: 102%;
    border-bottom: 2px solid #f98600;
}    
/*---コースの表　550-----------------*/
.ta4 {
	width: 100%;
	table-layout: fixed;
	margin: 20px 0px 30px;
}
.ta4, .ta4 td, .ta4 th {
	border: 1px solid #999;	
	padding: 12px;
}
.just {text-align: justify;}

.ta4 th {
	text-align: center;
	background: #cce6f6;
	font-weight: normal;
	font-size: 86%;
    line-height: 1;
    letter-spacing: 0.3em;    
}
.ta4 td {
    font-size: 86%;
    line-height: 1.7;
    word-break: break-all;
}
.ta4 h5 {font-weight: 600;}    
.ta4 td img {
    padding: 10px 2px 0 2px;
    width: 90%;
    height: auto;
} 
/*だれ弾きの表550*/
.ta44 {
	width: 100%;
	table-layout: fixed;
	margin: 20px 0px 30px;
}
.ta44, .ta44 td, .ta44 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta44 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta44 td {
    font-size: 84%;
    line-height: 1.7;
    word-break: break-all;
}    
.ta44 td img {
    width: 93%;
    height: auto;
} 
.ta44 .txt {
    width: 80%;
    height: auto;}    

/*講師紹介のわく 550--------------------*/
.koushi{
    margin: auto;
    background-color: rgba(211,233,247,0.80);
    padding: 2px 5% 12px;
}
.koushi h5 {
    margin-bottom: 4px;
    font-size: 85%;
}
.koushi_waku{
    display: flex;
    background-color: #fff;
    padding: 3px;
}
.koushi_bun{
    width:72%;
    font-size: 82%;
    line-height: 1.8;
}
.koushi_bun2{
    font-size: 82%;
    line-height: 1.8;
}    
.koushi_fa {width: 28%;
    margin:16px 1px 10px 1px;   
}
.koushi_fa img {width: 90%;height: auto;}
    
.txsampl {margin-bottom: 40px;
    margin-left: -20px;
    margin-right: -20px;
}
.txsampl p {
    margin: 20px 0;
    font-size: 90%;
}
.hassou {display: flex;justify-content: center;}
.hassou img {width: 90%;height: auto;}
    
.yuucho {
    display: flex;
    flex-direction: column;
    margin: 10px 4px 25px;
    background-color: #f5f5dc;
    padding: 15px 6%;
}
.yuucho img {
    width: 82%;
    height:auto;
    margin-bottom: 12px;
}
.tejun {
    width:100%;
    padding: 10px 0px 10px 10px;
}
.tejun ul {font-size: 80%;}


.hurigami {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.zukai3 {
    text-align: center;
    margin-bottom: 6px;
}
.zukai3 img {width: 80%;}    
.hurigami ul {
    width: 80%;
    margin: 0 13% 20px;
    font-size: 77%;
}        
    
/*コースall紹介ページ　ボックス（list6）設定　550
------------------------------------------------------------*/
/*----home2はコースインデックスの---------*/
.home2 .main h2 {
	clear: both; 
	margin-bottom: 0px;
	font-size: 145%;
	text-align: center;
	line-height: 1.6;      
}
    
.bunrui {
    margin: 20px 0 20px 4px;
    border-left: 8pt solid #f98600;
    border-bottom: 2px solid #f98600;
    width: 99%;
    padding: 0 0 2px 12px;
}
.bunrui p {font-size: 100%;}
    
/*---おまけの読みものコラム　550---------*/    
#yomimono h4 {
    margin: 40px 0 20px 0;
    font-size: 114%;
    font-weight: 500;
    text-align: center;
    border-bottom: 2px solid #f98600;
}  
    
.list6 {
	background: #fff9f4;	
	margin-bottom: 8px;	
	border-radius: 8px;
	overflow: hidden;
	position: relative;
	-webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.2);
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
	padding: 12px;
}
.list6 h4 {
    width: 100%;
    clear: both;
    margin: 1% 0 3%;
    text-align: center;
    font-size: 95%;
    line-height: 1.7;
    border-radius: 12px;
    border: 1px solid #666;
    padding: 4px 3px;
    background-color: #fff;
}
.month img {
    width: 18%;
    height: auto;
    padding-left: 3px;
    padding-bottom: 4px;
} 
/*---コースインデックスlist6内のta8表形式　550----------------*/
.ta7 {display: none;}
.ta8 {display: block;}
.ta8 img {
    width: 50%;
    height: auto;
    margin-top: -10px;
}
.ta7gaiyou {
    margin-top: 0px;
    font-size: 98%;
    text-align: justify;
    line-height: 1.8;
}    
.ta7bun {
    margin-top: 8px;
    font-size: 100%;
    text-align: justify;
    line-height: 1.8;
}
/*---緑の項目---*/
 .atama2 {
    color: #fff;
    background-color: #6fa375;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 92%;
}  
.list6 a {text-decoration: none;}
.list6 a:hover {background: #fcf9d7;} 
    
.atama5 img {
    width: 15%;
    padding-right: 10px;
}
    
.inlist6 {
    clear: both;
    margin: auto;
    display: flex;
    flex-direction: row;
    justify-content: space-around; 
}
.csbun {
    width: 60%;
    height: auto;
    padding: 1% 3px 20px 0;
    font-size: 87%;
    line-height: 1.7;
    text-align: justify;
}
.listpict2 {
    width: 33%;
    height: auto;
    padding-top: 0;
    padding-left: 2px;
}
.csgaiyo {
    width: 97%;
    position: relative;
    top: 0px;
    left: 1.5%;   
}
.csgaiyo p {
    font-size: 84%;
    text-align: left;
}
/*---会社概要 550--------------------*/    
/*-------会社概要のページ-------------------------*/
.gaiyou #contents .main {
    float: left;
    width: 100%;
    padding: 0 1%;
}    

.gaiyou h3 {
    clear: both;
    margin-bottom: 30px;
    text-align: left;
    font-size: 100%;
    padding-left: 24px;
    border-radius: 50px;	
    border: 1px solid #666;	
    background-color: #fff;
}
.orang {
	font-size: 94%;	
	color: #e5831f;	     
}
/*これが全然効いていない*/
.list6.csh3 h3 {
    font-size: 10%;      
}

.honbun2 {
    margin: -10px 1.5% 25px;
    text-align: justify;
    font-size: 80%;
}
.sengen h5 {
    font-size: 85%;
    padding-left: 10px;
}
.sengen p {
    font-size: 82%;
    text-align: justify;
    margin: 0px 1.5%  20px;
}

.guideline ul {margin-bottom: 25px;}
.guideline li{
    list-style-type: disc;
    margin: 0px 9px 10px 30px;
    text-align: justify;
    font-size: 82%;
}
/*---緑の項目------------*/
 .atama2 {
    color: #fff;
    background-color: #6fa375;
    padding: 4px;
    border-radius: 6px;
    font-size: 95%;
}  

.list6 a {text-decoration: none;}
.list6 a:hover {background: #fcf9d7;}

/*---おまけの読みものコラム　大見出しはh4のところにある550---------*/
#yomimono {
    margin: 10px 0 20px 0;
    padding: 0;
}
#yomimono .midasi {
    font-size: 106%;
    margin-bottom: 10px;
    padding-left: 0px;
}
#hyou-a {display: none;}  
#hyou-b {display: block;}    
.gterabi {
    margin-bottom: 30px;
    padding: 10px 5% 8px;
    border: 1px solid #d9ae27;
    background-color: #faf9df;
}

/*--550以下で切り替わる　表6のbバージョン--------------*/
.ta26 {
	width: 100%;
	table-layout: fixed;
	margin: 10px 0px 14px;
}
.ta26, .ta26 td {
	border: 2px solid #999;
	padding: 10px;
}
.ta26 td {
    vertical-align: top;
}
.ta26 th {
    padding: 5px 3% 5px;
    border: 2px solid #f16e0b;
    background-color: #fef3ea;
}    
.ta26 h5 {
    text-align: justify;
    font-size: 114%;
    font-weight: 500;
}
.ta26 a {text-decoration: none;}
.ta26 a:hover {background: #fcf9d7;}   
.tdbun {
    font-size: 97%;
    line-height: 1.8;
    font-feature-settings: "pkna";
    text-align: justify;
}
.icons {
    margin: 2px 0 2px;
    padding: 0px;
}
    
/*---青い項目--------------*/
.atama3 {
    color: #fff;
    background-color: #2688d4;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 90%;
    letter-spacing: 0.05em;
}    
.just2 {
    text-align: justify;
    font-size: 96%;
}      

/*---ご利用ガイド550--------------*/
/*--oomidasiはfaqと共通--*/
.oomidasi {
    clear: both;
    margin-bottom: 20px;	
    border-radius: 20px;
    border: 3px dotted #f16e0b;	
    padding: 8px 4%;
}
.oomidasi h2 {
    font-size: 130%;
    text-align: center;
    line-height:  1.5;
}
.oomidasi h2 span {
	display: block;
	font-size: 60%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	
    margin-bottom: 8px; 
}
.oomidasi .lead {
    margin: 0px 0px 2px 0px;
    padding-top: 8px;
    border-top: 2px solid #5c5a5a;
}
.oomidasi .lead p {
    font-size: 80%;
    line-height: 1.6;
    text-align: justify;
}
.oomidasi2 {
    clear: both;
    width: 80%;
    margin: 0 10% 30px;	
    border-radius: 50px;
    border: 3px dotted #f16e0b;	
    padding: 10px 30px 10px 30px;
}
.oomidasi2 h2 {
    font-size: 170%;
    text-align: center;
    line-height:  1.7;
}
.oomidasi2 h2 span {
	display: block;
	font-size: 60%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	 
} 
/*---よく頂く質問ページ　利用ガイド　550-------------------------*/
.faq {padding: 0px 5px;}
    
/*質問の設定*/
.faq dt {
	color: #e5831f;
	padding-top: 10px;
	margin-bottom: 10px;
    font-size: 84%;
    text-align: justify;
}
/*回答の設定*/
.faq dd {
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding-bottom: 10px;
    font-size: 84%;
    text-align: justify;
}
/*「Q」と「A」のマーク共通設定*/
.faq dt::before,
.faq dd::before {
	margin-right: 5px;display: inline-block;text-align: center;
	width: 22px;
	line-height: 22px;
}
.fandq h3 {
    clear: both;
    margin: 30px 0 25px;
    text-align: center;
    font-size: 100%;
    line-height: 2.5;
    border-radius: 12px;
    border: 1px solid #666;
    padding: 0px;
    background-color: #fff;    
}
.fandq h6 {
    font-size: 90%;
    margin-bottom: 5px;
}    
.zukai {
    margin: 8px 0px;   
}
.zukai img {width: 96%;height: auto;}
.zukai2 {text-align: center;margin-bottom: 30px;}
.zukai2 img {width: 300px;height: auto;}    
  
.tokuzu {
    width: 100%;
    margin: auto;
    padding: 20px 20px;
    margin-bottom: 15px;
    background-color: #f5f5dc;
    display: flex;
    flex-direction: column;
    align-items: center;    
}
.tokuzu img {
    width: 390px;height: auto;
}
.cyapu {
    width: 98%;
    text-align: left;
    margin: 18px auto;
    font-size: 90%;
    line-height: 1.7;
}
.tokuzucan {
    width: 74%;
    margin: auto;
    padding: 20px 20px;
    margin-bottom: 15px;
    background-color: #E0EDF4;
    display: flex;
    flex-direction: column;
    align-items: center;   
}
.tokuzucan img {
    width: 320px;height: auto;
}
.cyapu2 {
    width:98%;
    text-align: left;
    margin: 16px 0px;
    font-size: 90%;
    line-height: 1.7;
}  
.atesaki {
    font-size: 88%;
    line-height: 1.7;
    text-align: justify;
    margin-bottom: 10px;
    padding: 0px;
}       
/*----教材のご購入のページ　550-------------------*/
.oomidasi3 {
    width: 70%;
    height: auto;
    margin: 0 auto;	
    margin-bottom: 15px;
    border-radius: 20px;
    border: 3px dotted #f16e0b;	
    padding: 7px;
}
.oomidasi3 h2 {
    font-size: 120%;
    text-align: center;
    line-height:  1.4;
}
.oomidasi3 h2 span {
	display: block;
	font-size: 62%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	 
}
.kounyuwrap {
    margin: 25px auto;
    padding: 0 2%;
}
.k1 p {
    font-size: 85%;
    line-height: 1.7;
}      
.kounyuwrap2 {
    padding: 20px 5% 0px;
    margin: 0 auto;
    border-top: 2px solid #F16E0B;
    font-size: 90%;
}    
.kounyuwrap h4 {
    margin: 20px 0px;
    border-left: 10pt solid #f98600;
    font-size: 100%;
    border-bottom: 2px solid #f98600;
    padding-left: 10px;
}
.btnlead {
    margin: 20px auto 0;
    padding: 10px 0;
    border: 2px solid #33AF9E;
}
.btnlead p {
    text-align: center;
    font-size: 85%;
    margin-bottom: 5px;}    
.sugubtn {
    width: 80%;
    margin: 0 10%;
    padding: 0px;
    text-align: center;
}
.sugubtn img {
    padding: 5px 0px;
    width: 145px;
}    
.kounyu p {
    margin-bottom: 30px;
    line-height: 1.7;
    font-size: 95%;
}
.tokucho {
    width : 280px;
    height: auto;
    margin: auto;
    margin-bottom: 25px;
    background-color: #fff6d2;
    padding: 10px 18px 5px;
}
.tokucho p {
    font-size: 90%;
    margin-bottom: 0px;
}
.tokucho ul {
    font-size: 84%;
    padding: 5px 0px 5px 30px;
}
.atama6 {
    color: #fff;
    background-color: #2688d4;
    padding: 6px 10px;
    border-radius: 4px;
    font-size: 95%;
}
.storehyou {
    margin: -10px 0 30px;
    display: flex;
    justify-content: center;
}    
.kounyuwrap table {
    width: 94%;
    font-size: 75%;
}        
.cartgroup2 {
    width : 260px;
    height: auto;
    margin: auto;
    margin-top: 0px;
    margin-bottom: 20px;
    background-color: #fff;
    border: 2px dotted #1647a8;
}
.cartgroup2 h6 {
    font-size: 82%;
    text-align: center;
    margin: 10px 0 ;
}
.cartgroup2 .cart img{
    width:56%;
    height: auto;
    margin-bottom: 15px;
}
    
/*--その他----------*/  
.color1, .color1 a {color: #e5831f !important;}
.color2 {color: #dd1a47;font-size: 105%;}
.color3 {color: #006400;font-weight: 800;}
.color4 {color: #dd1a47;font-size: 100%;font-weight: 700;}          
}



/*画面幅420px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:420px){

/*全体の設定
--------------------------------------------------------------------*/
body {font-size: 14px;}	
/*main,subコンテンツ　420-----------------------------------------------*/
#formstyle #contents .main {
    width: 94%;
    margin: auto;
}
#contents {
	clear: both;
    overflow: hidden;
    position: relative;
	background: #fff;
	padding: 5% 2%;
	margin: 0px;
}
        
#contents .main {
	float: none;
	width: auto;
    padding: 12px;
    background: #fff;
}

/*サブコンテンツのh2タグ*/
#contents .sub h2 {
	font-size: 108%;
    line-height: 20px;
	margin-bottom: 6px;
	text-align: left;
}
#contents .sub h2::first-letter {
	padding-left: 15px;	
    border-left: 5px solid #fff;
}
#contents .sub p {
	padding: 0;
	font-size: 90%;
}
#contents .sub section + section {
	margin-top: 5px;
}    
#contents .sub {
	float: none;
    width: auto;
    padding: 20px 3%;
    display: flex;
    flex-direction: column-reverse;    
}
.subw1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
} 
.subw2 .box5{
    display: none;
}     
.subgrp {
    margin: 0 1% 10px;   
}    
.sub .box1,
.sub .box2,
.sub .box3,
.sub .box4 {
     width: 260px;
 }
.sub .box5 {
    margin:  5px 1% 10px;
    padding: 5px 5%;
}    
.sub .banner-s {
    width: 230px;
    height: auto;
    margin: 0 0 5px;
 } 
.sub .box1 li {font-size: 86%;padding-left: 10px;} 
.sub .box2 li {font-size: 86%;padding-left: 10px;} 
.sub .box3 li {font-size: 86%;padding-left: 10px;}
.sub .box4 li {font-size: 86%;padding-left: 10px;}    
/*---スマホ用メニューブロック 420---------------------*/
#menubar-s {
	display: block;
    overflow: hidden;
	position: absolute;
    z-index: 2;
	top: 2px;right: 1px;
	width: 300px;
	background: rgba(0,0,0,0.8);
	border-top: 1px solid #fff;
	animation-name: menubar;
	animation-duration: 0.5s;
	animation-fill-mode: both;
}
/*---メニュー１個あたりの設定---*/
#menubar-s li a {
	display: block;
    text-decoration: none;
	padding: 5px 25px 5px 20px;
	border-bottom: 1px solid #fff;
	color: #fff;
	font-size: 12px;
}
#subsub li a{
    font-size: 12px;
    padding: 5px 20px 5px 30px;
}
li .current-s {background-color:#e5831f;}    

/*---PC用メニューを非表示にする　420---*/
#menubar {display: none;}

/*---３本バーアイコン---設定
---------------------------------------------------------------------------*/
/*---３本バーブロック---*/
#menubar_hdr {
	display: block;
	position: absolute;z-index: 2;
	top: 20px;
	right: 4%;
	border: 1px solid #fff;
}
/*---アイコン共通設定---*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 50px;
	height: 50px;
}
/*---三本バーアイコン---*/
#menubar_hdr.close {
	background: #e5831f url(../images/icon_menu.png) no-repeat center top/50px;
}
/*---閉じるアイコン---*/
#menubar_hdr.open {
	background: #e5831f url(../images/icon_menu.png) no-repeat center bottom/50px;
}    
/*---写真の上の飾り---*/
.kei {
    padding: 3px 1%;
}    
.message1 {
    padding: 0px;
    text-align: center;
    font-size: 88%;
}
.message2 {
    padding: 4px 3% 20px;
    text-align: center;
    font-size: 75%;
}    
.pop {
  margin: 0px auto 20px;
  max-width: 310px;
  padding: 10px 0px;       
} 
.pop img {width:310px;height:auto;}  
    
/*マークの設定各種*/
.mark2 {width: 60px;height: auto;margin-top: -10px;margin-left:-50px;}
.mark3 {width: 30px;height: auto;margin-top: 0px;padding-right:5px;}
.mark4 {width: 22px;height: auto;margin-top: -5px;margin-right:8px;}
.mark5 {width: 25px;height: auto;margin-top: -2px;margin-right:1px;}    
    
/*コースall紹介ページの　ボックス（list6）設定　420
------------------------------------------------------------*/
/*----home2はコースインデックスの---------*/
.home2 .main h2 {
	clear: both; 
	margin-bottom: 0px;
	font-size: 150%;
	text-align: center;
	line-height: 1.6;      
}
    
.bunrui {
    margin: 20px 0 20px 4px;
    border-left: 8pt solid #f98600;
    border-bottom: 2px solid #f98600;
    width: 99%;
    padding: 0 0 2px 12px;
}
.bunrui p {font-size: 110%;}
    
/*---おまけの読みものコラム　420---------*/    
#yomimono h4 {
    margin: 40px 0 20px 0;
    font-size: 114%;
    font-weight: 500;
    text-align: center;
    border-bottom: 2px solid #f98600;
}  
/*----コースインデックス　420----------------------*/    
.list6 {
	background: #fff9f4;	
	margin-bottom: 8px;	
	border-radius: 8px;
	overflow: hidden;
	position: relative;
	-webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.2);
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
	padding: 12px;
}
.list6 h4 {
    width: 100%;
    clear: both;
    margin: 1% 0 3%;
    text-align: center;
    font-size: 95%;
    line-height: 1.7;
    border-radius: 12px;
    border: 1px solid #666;
    padding: 3px 3px;
    background-color: #fff;
}
.month img {
    width: 19%;
    height: auto;
    padding-left: 3px;
    padding-bottom: 4px;
}       
.atama5 img {
    width: 14%;
    padding-right: 10px;
}
    
.inlist6 {
    clear: both;
    margin: auto;
    display: flex;
    flex-direction: row;
    justify-content: space-around; 
}
.csbun {
    width: 60%;
    height: auto;
    padding: 1% 3px 18px 0;
    font-size: 87%;
    line-height: 1.7;
    text-align: justify;
}
.listpict2 {
    width: 36%;
    height: auto;
    padding-top: 0;
    padding-left: 2px;
}
.csgaiyo {
    width: 97%;
    position: relative;
    top: 0px;
    left: 1.5%;   
}
.csgaiyo p {
    font-size: 84%;
    text-align: left;
    line-height: 2.1;
}      

/*コースインデックスlist6内のta8表形式　420----------------*/
.ta7 {display: none;}
.ta8 {display: block;}
.ta8 img {
    width: 60%;
    height: auto;
    margin-top: -10px;
}
.ta7gaiyou {
    margin-top: 0px;
    font-size: 98%;
    text-align: justify;
    line-height: 1.8;
}    
.ta7bun {
    margin-top: 8px;
    font-size: 103%;
    text-align: justify;
    line-height: 1.7;
}
/*------緑の項目--------*/
 .atama2 {
    color: #fff;
    background-color: #6fa375;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 92%;
}  
.list6 a {text-decoration: none;}
.list6 a:hover {background: #fcf9d7;} 

#hyou-a {display: none;}  
#hyou-b {display: block;}    
.gterabi {
    margin-bottom: 30px;
    padding: 10px 5% 8px;
    border: 1px solid #d9ae27;
    background-color: #faf9df;
}

/*-----切り替わる　表6のbバージョン　420-----*/
.ta26 {
	width: 100%;
	table-layout: fixed;
	margin: 10px 0px 14px;
}
.ta26, .ta26 td {
	border: 2px solid #999;
	padding: 10px;
}
.ta26 td {
    vertical-align: top;
}
.ta26 th {
    padding: 5px 3% 5px;
    border: 2px solid #f16e0b;
    background-color: #fef3ea;
}    
.ta26 h5 {
    text-align: justify;
    font-size: 118%;
    font-weight: 500;
}
.ta26 a {text-decoration: none;}
.ta26 a:hover {background: #fcf9d7;}    
.tdbun {
    font-size: 102%;
    line-height: 1.8;
}
.icons {
    margin: 2px 0 2px;
    padding: 0px;
}    

/*----青い項目420----*/
.atama3 {
    color: #fff;
    background-color: #2688d4;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 90%;
    letter-spacing: 0.075em;
}     
.just2 {
    text-align: justify;
    font-size: 104%;
} 
/*---おまけの読みものコラム　大見出しはh4のところにある　420---------*/
#yomimono {
    margin: 10px 0 20px 0;
    padding: 0;
}

#yomimono .midasi {
    font-size: 105%;
    margin-bottom: 10px;
}    

/*ヘッダー　420---------------------------------------------------*/
/*----ヘッダーブロック----*/
header {
	position: static;
	height: auto;
}
/*----ロゴ画像----*/
header #logo img {
	width: 210px;
	position: static;
	padding: 20px 3%;
}

/*ヘッダー内メニュー-----------------------------------------------*/
/*----メニューブロック全体----*/
#headermenu {
	position: static;
	overflow: hidden;
	padding-bottom: 10px;
}
/*----メニュー１個あたり---*/
#headermenu li a.btn1 {
	display: block;
	margin-bottom: 5px;
}

/*-----btn1　420-------------*/
#contents a.btn1 {
	padding: 0px 10px;
}

/*inputボタンにclass="btn"をつけた場合の設定
--------------------------------------------------------------------*/
#contents input[type="submit"].btn,
#contents input[type="button"].btn,
#contents input[type="reset"].btn {
	font-size: 12px;
}
    
/*---本文　420--------------*/
.honbun {margin-bottom: 20px;}
.honbun p {
    font-size: 96%;
    line-height: 1.8;
    text-align: justify;
}
.honbun p + p {margin-top: 15px;} 
    
/*------リンクの囲み　　420--------------------*/
.siori {
    width: 84%;
    margin: 0 auto;
    background-color: #fff6d2;
    border-radius: 10px;
    padding: 10px;
}

.siori ul {overflow: hidden;}
.siori li{
    float: left;
    list-style: none;
    font-size: 78%;
    line-height: 2.5;
    padding: 0 10px 0 10px;
}
.siori2 {
    width: 88%;
    margin: auto;
    margin-bottom: 20px;
    background-color: #fff6d2;
    border-radius: 10px;
    padding: 8px 4%;
}

.siori2 ul {overflow: hidden;}
.siori2 li{
    float:left;
    list-style: none;
    font-size: 75%;
    line-height: 2.2;
    padding: 0 10px 0  20px;
}
.gainatesaki {
    padding: 8px 3%;
    margin: auto;
    margin-bottom: 25px;
    width: 88%;
    border: 2px solid #F58631;
    font-size: 91%;
    -webkit-box-shadow: inset 2px 2px 8px 6px #FBDAC0;
    box-shadow: inset 2px 2px 6px 2px #FBDAC0;
}      
/*---トップページ　420---------*/       
.home #contents h2 {
	clear: both; 
	margin-bottom: 15px;
	font-size: 155%;
	text-align: center;
	line-height: 1.6;       
}
/*---h2の上にまる---*/
.maru p {
    text-align: center;
    font-size: 155%;
    color: #ff8c00;
}
/*----h2タグ内のspanタグ（英語の飾り文字）----*/
.home h2 span {
	display: block;
	font-size: 60%;
    line-height: 1.8;
	color: #e5831f;
	letter-spacing: 0.2em;
    margin-bottom: 0px;
}
/*-----h3の頭-----*/
.mark1 {
    width: 46px;
    height: auto;
    margin-bottom: 6px;
    margin-right:-5px;
}    
/*トップページの頭の3つのポイント　　420-------------------------*/
#toppoint {
    margin: 0 auto;
    padding: 15px 0 0 0;
    display: flex;
    flex-direction: column;
    justify-content:space-around;    
}
.list2 {
	width: 90%;
    display: flex;
    margin: 0 auto 5px;
}
.list2 figure {
    width:40%;
    margin: 1px auto 25px;
    padding-right: 10px;
}
.list2 figure a:hover {
	opacity: 0.8;	/*マウスオン時。透明度80%にする。*/
}
.pointbun {
    width: 100%;
}
.pointbun h4 {
	background: #fd7208;	/*背景色（古いブラウザ用）_元は000*/
	background: rgba(255,135,43,0.8);	/*背景色。*/
	color: #fff;	/*文字色*/
    font-size: 105%; 
    text-align: center;
    margin-bottom: 6px;
}
.pointbun p {
    font-size: 96%;
    line-height: 1.6;
}
/* ---左右の写真を見せなくする---*/
.usiro-le {position: relative;}
.usiro-le img {display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 25%;
}
.usiro-ri {position: relative;}
.usiro-ri img {display: none;
    position: absolute;
    top: 0;
    right: 0;
    width: 25%;
}    
/*トップページのコース案内ボックス（list4）設定420----------------------------*/
.list4wrap {
    display: flex;
    flex-wrap: wrap; 
    justify-content: flex-start;
    padding: 0px 8px
}
/*-----list4の要素-----*/
.list4 {
    width: 100%;
    height: auto;
	background: #fff9f4;
    margin: 8px 0px 8px;
	border-radius: 6px;
	overflow: hidden;
	position: relative;
	-webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.2);
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
	padding: 10px 2% 6px;    
}
.list4 h4 {
    font-size: 100%;
    line-height: 1.4;
    font-weight: 500;
    margin-top: 6px;
    padding-left: 10px;
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #878787;
} 
 
.list4 table {
    width:94%;
    margin: auto;
}    
.list4 img {width: 48%;}    

.listmigi {
    margin-top: 10px;
}
.listmigi p {
    font-size: 97%;
    line-height: 2;
    text-align: justify;
}
.listbun {
    margin: 5px 0 10px 0 ;
}
.listbun p {
    font-size: 99%;
    line-height:  1.9;
    text-align: justify;
}
.list4 a {text-decoration: none;}
.list4 a:hover {background: #fcf9d7;}
/*--420の時、バナーの位置を変更する------*/
.list4banner {
    display: none;
    } 
.list4banner2 {
    overflow: hidden;
    position: relative;
    width: 100%;
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center; 
    border: 0px;
    margin-top: 30px;
    margin-bottom: 10px;
    }     
.banner {
    width: 47%;
    height: auto;
    padding: 6px 4px;
}
.banner p {
    display: none;
}
.ban_1song {
    margin: 0 auto 30px;
    width: 78%;
}    
.topbannerarea {
    margin: 40px auto 0px;
    padding: 2px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.topbanner {
    width: 160px;
    margin: 5px 8px 5px 0px;
}
.topbanner p {
    font-size: 74%;
    line-height: 1.3;
    font-feature-settings: "pwid";
    text-align: justify;
    margin-top: 5px;
    padding: 0 4px;
}    
/*--トップページのコース案内改訂--*/
.listwrap {
    margin: 10px auto 20px;   
}
.ta9 {
    margin: 10px 1%;
    padding: 12px 8px;
    background-color: #fff9f4;
    -webkit-box-shadow: 2px 2px 3px rgba(114,110,110,0.75);
    box-shadow: 2px 2px 3px rgba(114,110,110,0.75);
}
.ta9 h4 {
    font-size: 107%;
    letter-spacing: -0.05em;
    line-height: 2;
    border: 2px dotted #F16E0B;
    border-radius: 57px;
    margin-bottom: 5px;
}
.ta9 a {text-decoration: none;}
.ta9 td{font-size: 83%;padding-right: 4px;}
.imag1 {width: 90%;height: auto;}
.ta9 td .lead2 {
    font-size: 107%;
    line-height: 1.5;
 }            
    

/* トップページ中間部分の説明ボックスlist50 420の設定*/

.list50 {
    width: 96%;
    position: relative;
    float: none;
    margin: 10px 1% 15px;
    padding: 20px 3% 14px;
    border: 3px dotted #3ab3fd5;
    border-radius: 32px;
}
.list50 h4 {
	font-size: 115%;
    text-align: left;
    padding: 3px 14px 0 14px;
    letter-spacing: 0.01em;
	color: #eb7802;
}
.phtx {
    /*clear: both;*/
    display: flex;
    flex-direction: column;
    align-items: center;
}
/*---写真を右、文章を左----*/
.migi {width: 55%;
    margin-top: 10px;
    margin-bottom: 10px;
}
.bun_l {width: 97%;
	padding: 14px 1% 10px;
}
.bun_l p {
    font-size: 96%;
    line-height: 1.8;
    text-align: justify;
}

/*---写真を左、文章を右---*/
.hidari {width: 55%;
    margin-top: 10px;
    margin-bottom: 10px;
}
.bun_r {width: 97%;
	padding: 14px 1% 10px;
}
.bun_r p {
    font-size: 96%;
    line-height: 1.8;
    text-align: justify;
}
/*---トップページ下のほうの表　420----*/
.ta3 {
	width: 100%;
	table-layout: fixed;
	margin: 0 auto;
    margin: 15px 0;
}
.ta3, .ta3 td, .ta3 th {
	border: 1px solid #999;	
	line-height: 1.6;
    font-size: 91%;
	padding: 8px;
	word-break: break-all;
}
/*---ta3の上のボックス---*/
.ta3 th {
	text-align: center;
	background: #fbd8bd;
	font-weight: normal;
}
/*--トップの送料の表--*/
.ta50 {
	width: 94%;
	table-layout: fixed;
	margin: 10px auto;
}
.ta50, .ta50 td, .ta50 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta50 th {
	text-align: center;
	background: #cce6f6;
	font-size: 97%;
    line-height: 1;   
}
.ta50 td {
    font-size: 97%;
    line-height: 1.3;
    text-align: center;
    word-break: break-all;
}
/*--利用ガイド内の送料の表--*/
.ta51 {
	width: 96%;
	table-layout: fixed;
	margin: auto;
}
.ta51, .ta51 td, .ta51 th {
	border: 1px solid #999;	
	padding: 8px 10px;
}
.ta51 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta51 td {
    font-size: 83%;
    line-height: 1.3;
    text-align: center;
    word-break: break-all;
} 
/*ウクレレダウンロード版-----*/
.ta-dl1 {
    width: 100%;
    margin: 20px auto;
    background-color: #fff;    
}
.ta-dl1 td{
    padding: 8px;    
}
.ta-dl1 h3{
    font-size: 102%;
    color: #D56994;
    font-weight: bolder;
    margin-bottom: 13px;
}
.ta-dl1 p {
    font-size: 94%;
}
.teika {font-size: 105%;}

/*トップページの教材一覧*/
.lineup {
    width: 100%;
    margin: 5px auto 30px;
    padding: 10px 0px;
    background: #FBFAF4;
    display: flex;
    flex-wrap: wrap;
}
.lineup a {width:20%;}
.lineup img {
    width: 85%;
    padding: 10px 0px;
}    

/*--お客様の感想のバルーン--420*/
.list7 h4 {
	font-size: 140%;
    letter-spacing: 0.02em;
    text-indent: 0.02em;
	color: #e5831f;
}
.list7 {
	/*overflow: hidden;*/
	border-top: 1px solid #ccc;
	padding: 20px 0 10px;
}
.voicearea {
    display: flex;
    flex-flow: wrap;
    justify-content: space-around;
    margin-bottom: 5px;
}
.voice {
    width: 92%;
    height: auto;
    padding: 15px 15px 15px 15px;
    background-color: rgba(253,207,198,0.90);
    border-radius: 20px;
    margin-top: 20px;
}
.voice p {
    font-size: 90%;
    line-height: 1.7;
    text-align: justify;
}
/*--SPコンテンツのボックス--*/  
.kuwake {
    margin: auto;
    padding-left: 3%;
	font-size: 100%;
    text-align: left;
    letter-spacing: 0.01em;
	color: #e5831f;
}
.detail {
    border: 1px solid #FA9D56;
    margin-bottom: 10px;
}
.voicearea2 {
    display: flex;
    flex-flow: wrap;
    justify-content: flex-start;
    margin-bottom: 30px;
    }
.voice2 {
    width: 46%;
    height: auto;
    padding: 10px 8px 10px 8px;
    background-color: rgba(210,255,245,0.90);
    margin: 10px 0px 10px 8px;
}
.voice2 p {
    font-size: 88%;
    line-height: 1.5;
    text-align: justify;
    padding-top: 8px;
} 
.voicearea3 {
    display: flex;
    flex-flow: wrap;
    justify-content: center;
    margin-bottom: 24px;
    font-size: 108%;
    }
#youtubewaku p {font-size: 90%;margin-bottom: 20px;}    
.voice3 {
    width: 70%;
    height: auto;
    padding: 10px;
    background-color: rgba(210,255,245,0.90);
    margin: 6px;
    -webkit-box-shadow: 2px 2px 4px 1px #C6C0C0;
    box-shadow: 2px 2px 4px 1px #C6C0C0;
}
.voice3 p {
    line-height: 1.5;
    text-align: justify;
    padding-top: 10px;
} 
.voicearea4 {
    display: flex;
    flex-flow: wrap;
    justify-content:space-around;
    padding: 0px;
    margin-bottom: 10px;
    }
.voice4 {
    width: 44%;
    height: auto;
    padding: 6px;
    background-color: rgba(210,255,245,0.90);
    margin: 6px;
    -webkit-box-shadow: 2px 2px 4px 1px #C6C0C0;
    box-shadow: 2px 2px 4px 1px #C6C0C0;
}    
/*---トップページの更新情報ブロック420-----*/
#new dl {
	background: #eee;
    width: 94%;
    margin: 0 auto;
	padding: 18px;
	border-radius: 4px;
    font-size: 92%;
    font-feature-settings: "pwid";
    text-align: justify;
    line-height: 1.9;
}
/*----日付設定----*/
#new dt {
	float: left;
	width: 8em;
	color: #e5831f;
}
/*------記事設定--------*/
#new dd {
	padding-left: 0em;
}
/*---更新ページの更新情報420----------------------*/
.new2 {margin: auto;
    padding: 0px 4%;
}
.new2 dl {
	background: #eee;
    width: 98%;
	margin: 0 auto;
	padding: 12px;		
    font-size: 92%;
    margin-bottom: 10px;
    line-height: 1.7;
    text-align: justify; 
}
.new2 dt {
	float: left;
	width: 8em;	
	color: #e5831f;	
	letter-spacing: 0.1em;
    font-size: 92%;
}
.new2 dd {
	padding-left: 0em;
}     
    
    
/*----各コースページ　420-----------------*/ 
.catch {   
    text-align: center;
    font-size: 110%;
    color: royalblue;
}
.cstitle {
    width: 92%;
    margin: 0 auto;		
    border-radius: 26px;	
    border: 3px dotted #f16e0b;	
    padding: 15px 4%; 
}
.cstitle h2 {
    font-size: 140%;		
    text-align: center;		
    line-height: 1.6;
    letter-spacing: -0.05em;
}
.cstitle h2 span {
	display: block;
	font-size: 70%;	
    line-height: 1.8;
	color: #e5831f;	
	letter-spacing: 0em;	
    margin-bottom: 15px; 
}
.cstitle .lead {
    font-size: 100%;
    line-height: 1.7;
    text-align: justify;
    margin-bottom: 0px;
}
/*---コース見出し頭のアイコン枠　420--------*/
.icon2 {
    width: 90%;
    background: #fff4cc;
    border-radius: 10px;
    margin: 0 auto;
    margin-bottom: 15px;
}
.gakki {
    padding: 10px 0%;
}    

/*--とくとく写真------*/
.tokimag {
    margin: 10px 0 30px 0;
    text-align: center;
}

/*----コースの値段の囲み-------*/
.nedan {
    margin-bottom: 10px;
    text-align: center;
    padding: 15px 6px 15px 6px;
    background-color: rgba(253,231,215,0.90);
}
.atama4 {
    color: #fff;
    background-color: #2688d4;
    margin-right: 5px;
    padding: 3px 8px;
    border-radius: 10px;
    font-size: 80%;
    vertical-align: 0.05em;
}      
.course .nedan h3 {
    font-size: 110%;
    line-height: 1.7;
    font-weight: 500;
    margin-bottom: 15px;
    background-color: #fff;
    border-radius: 16px;
    border: 1px solid #6a6a6a;
    padding: 4px 14px
}

.nedan p {font-size: 92%;line-height: 1.8;letter-spacing: -0.025em;}
.medatu {color: #098079;}
/* .naiyou {
    padding: 10px 0 10px;
}
.naiyou p {
    font-size: 96%;
    line-height: 1.8;
    text-align: justify;
    margin-bottom: 10px;
}  */
.chuu p {
    font-size: 88%;
    color: #006400;
    margin-bottom: 1px;
} 
.site2 {
    background-color: #FFFFD8;
    padding: 12px 10px 5px 10px;   
}
.site2 p {font-size: 84%;}
.site2 a {text-decoration: none;}
/*---案内動画まわり420----------*/
.dlimg {padding: 10px 2%; display: block;}    
.dlimg {width: 96%;height: auto;}     
.gallary {
    padding: 0px 0px 5px;
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
}
.gallary img {
    width:280px;
    height:auto;
    padding: 0px 0px 7px;
} 
#sityouken {
    background-color: #F0FCE2;
    padding: 0px 10px 15px 10px;   
}
#sityouken h5 {
    font-size: 94%;
    color: #0D7235;
    padding-top: 15px;
}
#sityouken p {
    font-size: 91%; padding-left: 0px; 
}        
    
.video {text-align: center;}
.video h5 {font-size: 88%;}
.videouk {text-align: center;}
.videouk h5 {font-size: 80%;}
.videouk video{width: 94%; height: auto;}     
.youtube {
    margin: auto;
    width: 92%;
    height: auto; 
    padding: 5px 3%;
}
.youtube iframe {
    max-width:360px; 
    min-height: 214px;
}    
.pdfdown {margin-top: 5px;}
.pdfdown table {width: 95%;}
.pdfdown td {font-size: 90%;letter-spacing: -0.04em;}
.pdfdown a :hover {background-color: rgba(113,112,112,0.20);}
    
/*---YouTubeの画面説明--*/
.gamensample p {
    font-size: 90%;
    text-align: justify;
    margin-bottom: 14px;
}
.gamen {
    margin-bottom: 5px;
    padding: 5px 14px 20px;   
}
.gamen img {
    width: 100%;
    height: auto;
    text-align: center;   
}
/*----教材の代金と申し込み　カート---------420*/
.daikin {margin: 15px 0px 35px;}
.daikin h5 {
    margin-bottom: 14px;
    font-size: 92%;
}
.daikin p {
    font-size: 94%;
    text-align: justify;
    margin-bottom: 10px;
}
.syouhinimg {
    width: 94%;
    margin: 20px 3% 0px;
    padding: 0px 0px 20px;
    height : auto;
    display: flex;
    flex-direction: column;
}
.product1 {
    width: 130px;
    height: auto;
    margin: 0 auto;
    padding: 5px 0px 5px;  
}   
.product2 {
    width: 160px;
    height: auto;
    margin:  0 auto;
    padding: 10px 0 14px;
}       
.cartgroup {
    width: 80%;
    background-color: #fff;
    border: 2px dotted #1647a8;
    margin: 0 auto;
}
.cartgroup h6{
    font-size: 82%;
    letter-spacing: -0.025em;
    text-align: center;
    margin: 10px 0px 10px 0px;
}
.cart {
    text-align: center;    
}
.cart img {
    width: 150px;
    height: auto;
    margin-bottom: 18px;
}
.come {
    margin-top: -10px;
    margin-bottom: 10px;
    font-size: 80%;
}
.stcode {
    background-color: #faebd7;
    margin: 0px 3% 0px;
    padding: 0px 10px 14px;
    font-size: 84%;
} v
    
.cart a :hover {background-color: rgba(113,112,112,0.20);}


.course h4 {
    margin: 40px 0 15px 0;
    border-left: 8pt solid #f98600;
    font-size: 108%;
    border-bottom: 2px solid #f98600;
}    
/*-------コースの表-----------420*/
.ta4 {
	width: 100%;
	table-layout: fixed;
	margin: 20px 0px 30px;
}
.ta4, .ta4 td, .ta4 th {
	border: 1px solid #999;	
	padding: 12px;
}
.just {text-align: justify;}

.ta4 th {
	text-align: center;
	background: #cce6f6;
	font-weight: normal;
	font-size: 70%;
    line-height: 1.0;
    letter-spacing: 0.3em;    
}
.ta4 td {
    font-size: 93%;
    line-height: 1.8;
    word-break: break-all;
}
.ta4 h5 {font-weight: 600;}    
.ta4 td img {
    padding: 14px 0 0 2px;
    width: 100%;
    height: auto;
} 
/*だれ弾きの表420*/
.ta44 {
	width: 100%;
	table-layout: fixed;
	margin: 20px 0px 30px;
}
.ta44, .ta44 td, .ta44 th {
	border: 1px solid #999;	
	padding: 8px 8px;
}
.ta44 th {
	text-align: center;
	background: #cce6f6;
	font-size: 90%;
    line-height: 1;   
}
.ta44 td {
    font-size: 83%;
    line-height: 1.7;
    word-break: break-all;
}    
.ta44 td img {
    width: 94%;
    height: auto;
} 
.ta44 .txt {
    width: 80%;
    height: auto;}    

/*講師紹介のわく 420*/
.koushi{
    margin: auto;
    background-color: rgba(211,233,247,0.80);
    padding: 2px 5% 12px;
}
.koushi h5 {
    margin-bottom: 4px;
    font-size: 82%;
}
.koushi_waku{
    display: flex;
    background-color: #fff;
    padding: 3px;
}
.koushi_bun{
    width:72%;
    font-size: 80%;
    line-height: 1.8;
}
.koushi_bun2{
    font-size: 80%;
    line-height: 1.8;
}    
.koushi_fa {width: 28%;
    margin:16px 1px 10px 1px;   
}
.koushi_fa img {width: 90%;height: auto;}
    
.txsampl {
    padding: 0 5% 10px;
}

 /*-------会社概要の　420-------*/    
.gaiyou #contents .main {
    float: left;
    width: 100%;
    padding: 0 2%;
}    

.gaiyou h3 {
    clear: both;
    margin-bottom: 30px;
    text-align: left;
    font-size: 100%;
    padding-left: 24px;
    border-radius: 50px;	
    border: 1px solid #666;	
    background-color: #fff;
}
.orang {
	font-size: 94%;	
	color: #e5831f;	     
}
.honbun2 {
    margin: -10px 1.5% 25px;
    text-align: justify;
    font-size: 85%;
}
.sengen h5 {
    font-size: 83%;
    padding-left: 10px;
}
.sengen p {
    font-size: 82%;
    text-align: justify;
    margin: 0px 1.5%  10px;
}
.guideline ul {margin-bottom: 25px;}
.guideline li{
    list-style-type: disc;
    margin: 0px 9px 10px 30px;
    text-align: justify;
    font-size: 82%;
}
    
.hassou {display: flex;justify-content: center;}
.hassou img {width: 95%;height: auto;}
.yuucho {
    display: flex;
    flex-direction: column;
    margin: 10px 4px 25px;
    background-color: #f5f5dc;
    padding: 15px 6%;
}
.yuucho img {
    width: 85%;
    height:auto;
    margin-bottom: 12px;
}
.tejun {
    width:100%;
    padding: 10px 0px 10px 10px;
}
.tejun ul {font-size: 84%;}


.hurigami {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.zukai3 {
    text-align: center;
    margin-bottom: 3px;
}
.zukai3 img {width: 92%;}    
.hurigami ul {
    width: 80%;
    margin: 0 10% 10px;
    font-size: 88%;
} 
/*---ご利用ガイド420--------------*/
/*--oomidasiはfaqと共通--*/
.oomidasi {
    clear: both;
    margin-bottom: 20px;	
    border-radius: 15px;
    border: 3px dotted #f16e0b;	
    padding: 8px 4%;
}
.oomidasi h2 {
    font-size: 120%;
    text-align: center;
    line-height:  1.5;
}
.oomidasi h2 span {
	display: block;
	font-size: 65%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	
    margin-bottom: 5px; 
}
.oomidasi .lead {
    margin: 0px 0px 2px 0px;
    padding-top: 8px;
    border-top: 2px solid #5c5a5a;
}
.oomidasi .lead p {
    font-size: 80%;
    line-height: 1.6;
    text-align: justify;
}    

/*---よく頂く質問ページ420--------------------------------------------------*/
.faq {
	padding: 0px 4px;
}
/*質問の設定*/
.faq dt {
	color: #e5831f;
	padding-top: 10px;
	margin-bottom: 5px;
    font-size: 90%;
    text-align: justify;
}
/*回答の設定*/
.faq dd {
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding-bottom: 5px;
    font-size: 90%;
    text-align: justify;
}
/*「Q」と「A」のマーク共通設定*/
.faq dt::before,
.faq dd::before {
	margin-right: 5px;display: inline-block;text-align: center;
	width: 20px;
	line-height: 20px;
}
/*----よく頂く質問ページ　利用ガイドも　420-------------------------*/
.fandq h3 {
    clear: both;
    margin: 30px 0 20px;
    text-align: center;
    font-size: 110%;
    line-height: 2.5;
    border-radius: 15px;
    border: 1px solid #666;
    padding: 0px;
    background-color: #fff;    
}
.fandq h6 {
    font-size: 90%;
    margin-bottom: 5px;
}    
.zukai {
    margin: 10px 1%;
    padding: 0px 0px;
}
.zukai img {width: 100%;height: auto;}
.zukai2 {text-align: center;margin-bottom: 40px;}
.zukai2 img {width: 300px;height: auto;}    
 
.tokuzu {
    width: 100%;
    margin: auto;
    padding: 20px 16px;
    margin-bottom: 15px;
    background-color: #f5f5dc;
    display: flex;
    flex-direction: column;
    align-items: center;    
}
.tokuzu img {
    width: 340px;height: auto;
}
.cyapu {
    width: 98%;
    text-align: left;
    margin: 18px auto;
    font-size: 98%;
    line-height: 1.7;
}
.tokuzucan {
    width: 79%;
    margin: auto;
    padding: 20px 20px;
    margin-bottom: 15px;
    background-color: #E0EDF4;
    display: flex;
    flex-direction: column;
    align-items: center;   
}
.tokuzucan img {
    width: 320px;height: auto;
}
.cyapu2 {
    width:98%;
    text-align: left;
    margin: 16px 0px;
    font-size: 90%;
    line-height: 1.7;
}   
.atesaki {
    font-size: 90%;
    line-height: 1.8;
    text-align: justify;
    margin-bottom: 10px;
    padding: 0px;
}       
/*---教材のご購入のページ　420------------------*/
.oomidasi3 {
    width: 70%;
    height: auto;
    margin: auto;	
    margin-bottom: 15px;
    border-radius: 20px;
    border: 3px dotted #f16e0b;	
    padding: 8px;
}
.oomidasi3 h2 {
    font-size: 130%;
    text-align: center;
    line-height:  1.4;
}
.oomidasi3 h2 span {
	display: block;
	font-size: 60%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	 
}
.kounyuwrap {
    margin: 20px auto;
    padding: 0 3%;
}
.k1 p {
    font-size: 94%;
    line-height: 1.7;
}    
.kounyuwrap2 {
    padding: 20px 8% 0px;
    margin: 0 auto;
    border-top: 2px solid #F16E0B;
    font-size: 94%;
}    
.kounyuwrap h4 {
    margin: 20px 0px;
    border-left: 10pt solid #f98600;
    font-size: 112%;
    border-bottom: 2px solid #f98600;
    padding-left: 8px;
}
.btnlead {
    margin: 20px auto 0;
    padding: 10px 0;
    border: 2px solid #33AF9E;
}
.btnlead p {
    text-align: center;
    font-size: 90%;
    margin-bottom: 10px;}        
.sugubtn {
    width: 90%;
    margin: 0px 5% 0 5%;
    padding: 0px;
    text-align: center;
}
.sugubtn img {
    padding: 5px 0px;
    width: 160px;
}    
.kounyu p {
    margin-bottom: 30px;
}
.tokucho {
    width : 250px;
    height: auto;
    margin: auto;
    margin-bottom: 20px;
    background-color: #fff6d2;
    padding: 10px 10px 5px;
}
.tokucho p {
    font-size: 90%;
    margin-bottom: 0px;
}
.tokucho ul {
    font-size: 88%;
    padding: 6px 0px 5px 22px;
}
.atama6 {
    color: #fff;
    background-color: #2688d4;
    padding: 6px 10px;
    border-radius: 4px;
    font-size: 95%;
}
.storehyou {
    margin: -10px 0 30px;
    display: flex;
    justify-content: center;
}    
.kounyuwrap table {
    width: 98%;
    font-size: 70%;
}        
.cartgroup2 {
    width : 260px;
    height: auto;
    margin: auto;
    margin-top: 0px;
    margin-bottom: 25px;
    background-color: #fff;
    border: 2px dotted #1647a8;
    }
.cartgroup2 h6 {
    font-size: 90%;
    text-align: center;
    margin: 10px 0 ;
}
.cartgroup2 .cart img{
    width: 70%;
    height: auto;
    margin-bottom: 15px;
}
    
/*---その他　　420------------------------------------------------------*/
.ws,.wl {width: 94%;}
.big1 {font-size: 16px;}
img.fl {margin-right: 5px;margin-bottom: 5px;}
img.fr {margin-left: 5px;margin-bottom: 5px;}
ul.disc {padding: 0em 0px 20px 18px;}
.color1, .color1 a {color: #e5831f !important;}
.color2 {color: #dd1a47;font-size: 100%;}
.color3 {color: #006400;font-weight: 800;}
.color4 {color: #dd1a47;font-size: 100%;font-weight: 700;} 
.tel {color: #000;text-decoration: none;}    
}