@charset "Shift_JIS";

/* --- タイプ2 デザイン2 --- */


/* --- 全体の背景・テキスト --- */
body {
min-width: 880px; /* 全体の最小幅 */
margin: 0;
padding: 0;
background-color:  #ffffff; 
/*background-image: url(../image/pink2.jpg);*/
/*background-repeat: repeat;*/
color: #404040; /* 全体の文字色 */
font-size: 80%; /* 全体の文字サイズ */
line-height: 150%; /* 行の高さ */
font-family: Meiryo UI,Arial, Helvetica, sans-serif, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
letter-spacing:1px
}

/* --- 全体のリンクテキスト --- */
a:link { color: #808080; }
a:visited { color: #000000; }
a:hover { color: #696969; }
a:active { color: #000000; }


/* --- コンテナ --- */
#header div.container,
#content div.container,
#footer div.container{
width: 880px; /* コンテナの幅 */
margin: 0 auto; /* センタリング */
}


/* --- ▼ヘッダ内の設定開始 --- */

/* --- ヘッダ --- */
#header{
border-top: 5px #402900 solid; /* ヘッダの上境界線 */
}

/* --- トップエリア --- */
#header div.top {
padding: 10px 0 10px; /* トップエリアのパディング（上、左右、下） */
background-color: #ffffff; /* トップエリアの背景色  #ffffff*/
border-top: 5px #FFFFFF solid; /* トップエリアの上境界線 #ffffff */
border-bottom: 3px #ffffff solid; /* トップエリアの下境界線 */
}
#header div.top div.container {
position: relative; /* 相対配置（ガイドメニューのために設定） */
}

/* --- サイトタイトル --- */
#header h1.siteTitle,
#header p.siteTitle {
margin: 0 0 7px; /* サイトタイトルのマージン（上、左右、下） */
font-size: 200%; /* サイトタイトルの文字サイズ */
}
/* サイトタイトルの画像 */
#header h1.siteTitle img,
#header p.siteTitle img {
border: none;
}

/* --- キャッチフレーズ --- */
#header p.catch {
margin: 0;
}
#header p.catch strong {
font-weight: normal; /* 文字の太さ（ノーマル） */
}

/* --- ガイドメニュー --- */
#header ul.guide {
position: absolute; /* 絶対配置 */
top: 10px; /* 上からの距離 */
right: 10px; /* 右からの距離 */
margin: 0;
padding: 0;
list-style-type: none;
}
/* メニュー項目 */
#header ul.guide li {
display: inline;
padding: 0 4px 0 8px; /* 項目のパディング（上右下左） */
background: url(../image/menu_line_gray.gif) no-repeat left; /* 項目の背景（区切り線） */
}
/* 最初の項目 */
#header ul.guide li.first {
background: none; /* 区切り線なし */
}

/* --- オープニングエリア（トップページ） --- */
#header div.opening {
padding: 8px 0; /* オープニングエリアのパディング（上下、左右） */
background: #ffffff url(../image/opening_back2.gif) repeat-x top; /* オープニングエリアの背景 */
border-bottom: 1px #402900 solid; /* オープニングエリアの下境界線 */
}
/* オープニングエリア内の見出し */
#header div.opening h2 {
margin: 0;
}

/* --- ヘッダメニュー --- */
#header div.nl {
    background-color: #634111;
/*background: url(../image/hor_menu7_off.gif) repeat-x top; /* ヘッダメニューの背景 #402700 */
border-top: 1px #4d3d21 solid; /* ヘッダメニューの上境界線 */
border-bottom: 2px #402900 solid; /* ヘッダメニューの下境界線 */
}
/* --- メニュー本体 --q- */
#header div.nl ul {
width: 875px; /* メニュー本体の幅（コンテナの幅から2px引いた値） */
margin: 0;
padding: 0;
border-left: 1px #2e1c00 solid; /* メニュー本体の左境界線 */
border-right: 1px #4d3d21 solid; /* メニュー本体の右境界線 */
list-style-type: none;
text-align: center;
}
/* メニュー項目 */
#header div.nl li {
width: 107px; /* 項目の幅 */
float: left;
line-height: 100%;
}
/* 最初の項目と最後の項目 */
#header div.nl li.first,
#header div.nl li.last {
width: 125px; /* 項目の幅 */
}
/* リンクエリア */
#header div.nl li a {
display: block;
position: relative; /* IE6用 */
padding: 10px 2px 7px; /* リンクエリアのパディング（上、左右、下） */
border-left: 1px #4d3d21 solid; /* リンクエリアの左境界線 */
border-right: 1px #2e1c00 solid; /* リンクエリアの右境界線 */
text-decoration: none; /* テキストの下線（なし） */
font-weight: bold; /* 文字の太さ（太字） */
color: #ffffff; /* 文字色 */
}
/* 英字部分 */
#header div.nl li a span.en {
display: block;
margin-top: 2px; /* 英字部分の上マージン */
font-size: 85%; /* 英字の文字サイズ */
font-weight: normal; /* 文字の太さ（ノーマル） */
color: #eee8aa; /* 英字の文字色 */
}

/* ポイント時とアクティブ時の設定 */
#header div.nl li a:hover,
#header div.nl li.active a {
background: #4d3400 url(../image/hor_menu7_on.gif) repeat-x top; /* ポイント時（アクティブ時）の背景 */
}
#header div.nl li a:hover span.en,
#header div.nl li.active span.en {
color: #fde337; /* ポイント時（アクティブ時）の英字の文字色 */
}

/* --- トピックパス（下層ページ） --- */
#header div.topicPath {
margin: 0;
padding: 7px 2px; /* トピックパスのパディング（上下、左右） */
background-color:#EDE2B2 ; /* トピックパスの背景色 　background-color:#F5F5F5 ; */
}
#header div.topicPath ol {
margin: 0;
padding: 0;
list-style-type: none;
}
/* リスト項目 */
#header div.topicPath li {
display: inline;
}
/* リンクエリア */
#header div.topicPath li a {
padding-right: 12px; /* リンクエリアの右パディング */
background: url(../image/topic_path_gray.gif) no-repeat right; /* リンクエリアの背景（区切り記号） */
}

/* --- 罫線 --- */
#header hr.none {
display: none; /* 表示形式（なし） */
border: none;
}

/*Full Line Advertisement*/
div.headlineImage{
    margin-top: 10px;
    margin-bottom: 10px;
/*January 2013 background-image:url(../main/img/january2013.png);*/
/*background-image:url(../main/img/march2013.png);*/
/*March 2013 春の生徒募集中！ Ume version
background-image:url(../main/img/PianohouseAreOpenForNewStudents2013.png);*/
/*March 2013 春の生徒募集中！Sakura version*/
/*background-image:url(../main/img/pianohouseAreOpenForNewStudents2013March.png);*/
/*April 2013 春の生徒募集中！Tsukushi & Mitsubachi version*/
/*background-image:url(../image/spring2013April.png);*/
/*May 2013 春の生徒募集中！Koi-nobori version background-image:url(../main/img/May2013-1-1.png);*/

/* --- トップページの季節ごとのアイコン↓ --- */
background-image:url(../main/img/2026.4.16.png);


/*June 2013 七夕調律キャンペーン実施中！background-image:url(../main/img/tanabata2013.png);*/
/*June 2013 七夕調律キャンペーン実施中！background-image:url(../main/img/tanabata2013.png);*/

/*August 2013 夏休み期間のお知らせ*/
/*background-image:url(../main/img/2013-aut.png);*/
vertical-align:  middle;
/*background-image:url(../main/img/2013-win.png);*/
/*節分 2013
background-image:url(../main/img/setubun2013.png);*/

/*background-image:url(../main/img/2014.png);*/
/*ひな祭り 2013
background-image:url(../main/img/hinamaturi2013.png);*/
/*Santa 
background-image:url(../main/img/santa2014.png);
*/
/* 年の瀬 2014 */
/*background-image:url(../main/img/December2014.png);*/
/*謹賀新年2015*/
/*background-image:url(../main/img/HappyNewYear2015.png);*/
/*謹賀新年2014*/
/*background-image:url(../main/img/happyNewYear2014.png);*/
/*謹賀新年2015*/
/*background-image:url(../main/img/setubun2013.png);*/
background-repeat:no-repeat;
background-position:center;
height:100px;

/*Happy New Year 2013 version
background-image:url(../main/img/happyNewYear2013.png); 
background-repeat:no-repeat;
background-position:center;
*/
}

img.headlineImage{
display:block;
margin:auto;
vertical-align:middle;
}
p.headlineImage{
display:block;
margin:auto;
text-align:center;
line-height: 150%; /* 行の高さ */
}




/* --- ▲ヘッダ内の設定終了 --- */


/* --- ▼コンテンツ内の設定開始 --- */

/* --- コンテンツ --- */
#content {

padding: 20px 0 10px; /* コンテンツのパディング（上、左右、下） */

}


/* --- ▼メインカラム内の設定開始 --- */

/* --- メインカラム --- */
#main {display: inline;
float: left;
width: 680px; /* メインカラムの幅 */
background-color:  #ffffff; /* 全体の背景色  #ffffff*/
}

/* --- ページタイトル（下層ページ） --- */
#main h1.pageTitle {
margin: 0 20px 15px 0px; /* ページタイトルのマージン（上右下左） */
padding: 6px 10px; /* ページタイトルのパディング（上下、左右） */
background-color: #ffffff ; /* ページタイトルの背景色 #F5F5F5 */
border-bottom: 1px #b6ada0 solid; /* 見出しの下境界線 */
font-size: 150%; /* ページタイトルの文字サイズ */
}

#main li.Information p.Information {
margin-left: 20px;
margin-right: 80px;
line-height: 140%; /* 行の高さ */
letter-spacing: 1px;
font-size: 110%;
}
#main p.InformationBold {
line-height: 140%; /* 行の高さ */
letter-spacing: 1px;
font-size: 100%;
font-weight:  600;
}
#main li.Information {
margin-bottom: 5px;
}
#main img.ItNeedsRepair {
float: left;
}

#main ul.example {

}
#main li.example {
margin-bottom: 10px;
}
#main img.ItNeedsRepair {
margin: 20px;
float: right;
}
#main img.ItNeedsRepair2 {
display: block;
margin: 20px;
}
#main h2.example {
    display:inline;
margin: 50px 0 0.8em; /* 見出しのマージン（上、左右、下） */
font-size: 130%; /* 見出しの文字サイズ */
line-height: 150%; /* 見出しの文字サイズ */
color: #000000; /* 見出しの文字色 */
border-bottom: solid 1px;
}
#main div.spacer {
line-height: 200%;
}


/* --- セクション（共通設定） --- */
#main div.section {
margin: 0 0 2em 20px; /* セクションのマージン（上右下左） */
}

/* --- 標準セクション --- */
/* --- 見出しエリア --- */
#main div.normal div.heading {
margin: 0 0 1em; /* 見出しエリアのマージン（上、左右、下） */
padding: 6px; /* 見出しエリアのパディング */
}
/* 見出し */
#main div.normal h2 {
margin:2px 2px 0px 2px;
padding: 10px 10px 0px 0px; /* 見出しのパディング（上右下左） */
background-image: none;
/* 春の見出し飾り

background-image: url("../main/img/flower0620.jpg");
background-repeat:no-repeat;
*/

/* border-left: 5px #b6ada0  solid; 見出しの左境界線 */
/* font-size: 120%; *//* 見出しの文字サイズ */-->
line-height: 100%; /* 行の高さ */
/*color:*/  
}
/* 段落 */
#main div.normal p {
margin: 0 10px 1em; /* 段落のマージン（上、左右、下） */
line-height: 160%; /* 行の高さ */
}

/* --- 強調セクション --- */
#main div.emphasis {
margin-bottom: 1em; /* セクションの下マージン（上書き） */
padding: 5px; /* セクションのパディング */
}

#main div.emphasis div.inner {
padding: 1px; /* 内部のパディング（上、左右、下） */

}
 /* 見出し */
#main div.emphasis h2 {
margin: 0 0 0.8em; /* 見出しのマージン（上、左右、下） */
font-size: 130%; /* 見出しの文字サイズ */
color: #000000; /* 見出しの文字色 */
}
 /* 段落 */
#main div.emphasis p {
margin: 1em 0 1em; /* 段落のマージン（上、左右、下） */
line-height: 150%; /* 行の高さ */
}



/* --- 新着情報（トップページ） --- */
#main div.update dl {
width: 620px; /* 新着情報の幅（メインカラムの幅から40px引いた値） */
margin: 0 auto; /* センタリング */
}
/* 日付エリア */
#main div.update dt {
width: 11em; /* 日付エリアの幅 */
float: left;
padding: 7px 0 6px 3px; /* 日付エリアのパディング（上右下左） */
line-height: 200%; /* 行の高さ */
}
/* 本文エリア */
#main div.update dd {
margin: 0;
padding: 7px 3px 6px 6.6em; /* 本文エリアのパディング（上右下左） */
border-bottom: 1px #c0c0c0 dotted; /* 本文エリア下境界線 */
line-height: 200%; /* 行の高さ */}

/* 日付エリア2 */
#main div.update2 dt {
width: 6.7em; /* 日付エリアの幅 */
float: left;
padding: 7px 0 6px 3px; /* 日付エリアのパディング（上右下左） */
line-height: 400%; /* 行の高さ */
}
/* 本文エリア2 */
#main div.update2 dd {
margin: 0;
padding: 7px 3px 6px 6.6em; /* 本文エリアのパディング（上右下左） */
border-bottom: 1px #c0c0c0 dotted; /* 本文エリア下境界線 */
line-height: 400%; /* 行の高さ */}

/*写真エリア2*/
ul.new dt.photo {display: inline;
width: 150px; /* 写真エリアの幅 */

float: left;
}
ul.detail dt.photo img {
    border: 1px #808080 solid; /* 写真の境界線 */
}
/*音楽教室　料金表*/
div.listOfCharges
{
 margin-left: auto;
 margin-right: auto;
}

table.listOfCharges
{
 margin-left: auto;
 margin-right: auto;
 border: 1px solid #330000;   
}

th.listOfCharges {
background-color: #eee8aa;
border: 1px solid;
padding: 6px;
}
td.listOfCharges {

border: 1px solid;
padding: 5px;
}


/* --- ▲メインカラム内の設定終了 --- */


/* --- ▼サイドバー内の設定開始 --- */

/* --- サイドバー --- */
#nav {display: inline;
float: left;
width: 200px; /* サイドバーの幅 */
background-color:  #ffffff; /* 全体の背景色  #ffffff*/
}

/* --- セクション（共通設定） --- */
#nav div.section {
margin-bottom: 10px; /* セクションの下マージン */
}
/* 見出し */
#nav div.section h2 {
margin: 0 0 0.7em; /* 見出しのマージン（上、左右、下） */
padding: 4px 0px; /* 見出しのパディング（上下、左右） */
font-size: 120%; /* 見出しの文字サイズ */
}
/* 段落 */
#nav div.section p {
margin: 0 4px 0.6em; /* 段落のマージン（上、左右、下） */
line-height: 130%; /* 行の高さ */
}

/* --- 標準セクション（白） --- */
#nav div.normal {
padding: 2px; /* セクションのパディング */
border: 1px #e0e0e0 solid; /* セクションの境界線 */
}
/* 見出し */
#nav div.normal h2 {
background-color: #AFEEEE; /* 見出しの背景色 */
}


/* --- 強調セクション1（こげ茶） --- */

#nav div.emphasis {
padding: 8px 5px 5px; /* セクションのパディング（上、左右、下） */
background: #ffffff; /* セクションの背景#F5F5F5 */
border: 1px #b6ada0 solid; /* セクションの境界線 #463f34*/
color: #404040; /* セクションの文字色 */
}
/* 見出し */
#nav div.emphasis h2 {
border-bottom: 1px #b6ada0 solid; /* 見出しの下境界線 */
}
/* リンク */
#nav div.emphasis a:link {
color: #404040; 
text-decoration: none;
}
#nav div.emphasis a:hover {
color: #404040; /* マウスが乗ったときのリンクの文字色 */
text-decoration: underline;
}
#nav div.emphasis a:visited {
color: #0A2140; /* 訪問後のリンクの文字色 */
}
#nav div.emphasis img {
display: block;

margin-left: -6px;
padding-left: 0px;
border: none;
color: #0A2140; /* 訪問後のリンクの文字色 */
}


/* --- 強調セクション２（こげ茶） --- */
#nav div.emphasis2 {
display: block;
margin: auto;
margin-bottom: 10px;
width: 140px;
padding: 8px 5px 5px; /* セクションのパディング（上、左右、下） */
background: #ffffff; /* セクションの背景#F5F5F5 */
border: 1px #b6ada0 solid; /* セクションの境界線 #463f34*/
color: #404040; /* セクションの文字色 */
}
/* 見出し */
#nav div.emphasis2 h3 {
margin: 0 0 0 2px;
background: #ffffff;
color: #404040;
text-align: center;
 /* 見出しの下境界線 border-bottom: 1px #b6ada0 solid; */
}
#nav div.emphasis2 h4 {
padding: 0 ;
margin-top: 0;
margin-bottom: 2px;
background: #037f8c;
color: #bfb093;
 /* 見出しの下境界線 border-bottom: 1px #b6ada0 solid; */
}

/* リンク */
#nav div.emphasis2 a:link {
color: #404040; /* リンクの文字色 */
text-decoration: none;
}
#nav div.emphasis2 a:hover {
color: #404040; /* マウスが乗ったときのリンクの文字色 */
text-decoration: underline;
}
#nav div.emphasis2 a:visited {
color: #0A2140; /* 訪問後のリンクの文字色 */
}
#nav div.emphasis2 img {
display: block;
margin: auto;
margin-top: 3px;
text-align:center;
color: #0A2140; /* 訪問後のリンクの文字色 */
}
#nav div.emphasis2 a img {
border: none;
}


/* --- 強調セクション３（こげ茶） --- */
#nav div.emphasis3 {
display: block;
margin: auto;
margin-bottom: 10px;
width: 140px;
padding: 8px 5px 5px; /* セクションのパディング（上、左右、下） */
background: #ffffff; /* セクションの背景#F5F5F5 */
border: 1px #b6ada0 solid; /* セクションの境界線 #463f34*/
color: #404040; /* セクションの文字色 */
}
/* 見出し */
#nav div.emphasis3 h3 {
margin: 0 0 0 2px;
background: #ffffff;
color: #404040;
text-align: center;
 /* 見出しの下境界線 border-bottom: 1px #b6ada0 solid; */
}
#nav div.emphasis3 h4 {
padding: 0 ;
margin-top: 0;
margin-bottom: 2px;
background: #bf0f30;
color: #bfb093;
 /* 見出しの下境界線 border-bottom: 1px #b6ada0 solid; */
}

/* リンク */
#nav div.emphasis3 a:link {
color: #404040; /* リンクの文字色 */
text-decoration: none;
}
#nav div.emphasis3 a:hover {
color: #404040; /* マウスが乗ったときのリンクの文字色 */
text-decoration: underline;
}
#nav div.emphasis3 a:visited {
color: #0A2140; /* 訪問後のリンクの文字色 */
}
#nav div.emphasis3 img {
display: block;
margin: auto;
margin-top: 3px;
text-align:center;
color: #0A2140; /* 訪問後のリンクの文字色 */
}








/* --- 強調セクション2（グレー） --- */
#nav div.strong {
padding: 8px 5px 5px; /* セクションのパディング（上、左右、下） */
background: #f4f2ee url(../image/box_back_gray2.gif) repeat-x top; /* セクションの背景 */
border: 1px #e4e0da solid; /* セクションの境界線 */
}
/* 見出し */
#nav div.strong h2 {
border-bottom: 1px #b6ada0 solid; /* 見出しの下境界線 */
}

/* --- サブメニュー --- */
/* サブメニュー内の見出し */
#nav div.subMenu h2 {
margin: 0; /* 見出しのマージン（上書き） */
padding: 6px 9px; /* 見出しのパディング（上書き） */
background-color: #ffffff ; /* 見出しの背景色 #F5F5F5 */
border-bottom: 1px #b6ada0 solid; /* 見出しの下境界線 */
}
/* メニューエリア */
#nav div.subMenu ul.nl {
margin: 0;
padding: 4px 6px 2px; /* メニューエリアのパディング（上、左右、下） */
background-color: #ffffff; /* メニューエリアの背景色 #F5F5F5 */
list-style-type: none;
}
/* メニュー項目 */
#nav div.subMenu ul.nl li {
margin-bottom: 2px; /* 項目の下マージン */
 /* 項目の背景 background: #f9f9f9 url(../image/ver_menu3_back.gif) repeat-x top;*/
border: 1px solid; /* 項目の境界線（太さ、スタイル） */
border-color: #ffffff #ffffff #ffffff #ffffff; /* 項目の境界線色（上右#202020下#202020左） */
}
/* リンクエリア */
#nav div.subMenu ul.nl li a {
display: block;
position: relative; /* IE6用 */
padding: 12px 5px 12px 15px; /* リンクエリアのパディング（上右下左） */
background: url(../image/ver_menu3_off.gif) no-repeat 4px; /* リンクエリアの背景（三角マーク） */
color: #404040; /* 文字色 */
text-decoration: none; /* テキストの下線（なし） */
}
/* ポイント時の設定 */
#nav div.subMenu ul.nl li a:hover {
background: url(../image/ver_menu3_on.gif) no-repeat 4px; /* ポイント時の背景（三角マーク） */
text-decoration: underline; /* テキストの下線（あり） */
}

/* --- お問い合わせ --- */
#nav div.contact {
padding-bottom: 0.3em; /* セクションの下パディング */
}
/* 段落 */
#nav div.contact p {
margin-bottom: 0.4em; /* 段落の下マージン（上書き） */
}
/* 電話番号 */
#nav div.contact p.tel {
margin-bottom: 0.1em; /* 段落の下マージン（上書き） */
font-size: 150%; /* 電話番号の文字サイズ */
font-weight: bold; /* 文字の太さ（太字） */
color: #2b2b2b; /* 電話番号の文字色 */
}
/* フォームへのリンク */
#nav div.contact p.form {
margin-top: 0.7em; /* 段落の上マージン（上書き） */
padding: 3px; /* 段落のパディング（白フチの幅） */
background-color: #ffffff; /* 段落の背景色（白フチの色） */
border: 1px solid; /* 段落の境界線（太さ、スタイル） */
border-color: #e0e0e0 #cccccc #cccccc #e0e0e0; /* 段落の境界線色（上右下左） */
text-align: center;
line-height: 100%; /* 行の高さ（上書き） */
}
/* リンクエリア */
#nav div.contact p.form a {
display: block;
position: relative; /* IE6用 */
padding: 12px 2px; /* リンクエリアのパディング（上下、左右） */
background: #dc3a01 url(../image/form_back2_off.gif) repeat-x top; /* リンクエリアの背景 */
font-size: 110%; /* リンクエリアの文字サイズ */
font-weight: bold; /* 文字の太さ（太字） */
color: #ffffff; /* リンクエリアの文字色 */
text-decoration: none; /* テキストの下線（なし） */
}
/* ポイント時の設定 */
#nav div.contact p.form a:hover {
background: #e14a03 url(../image/form_back2_on.gif) repeat-x top; /* ポイント時の背景 */
}

/* --- ▲サイドバー内の設定終了 --- */


/* --- 罫線 --- */
#content hr.clear {
clear: right; /* 右フロートのクリア */
width: 100%;
margin: 0;
visibility: hidden; /* 非表示 */
}

/* --- ▲コンテンツ内の設定終了 --- */


/* --- ▼フッタ内の設定開始 --- */

/* --- フッタ --- */
#footer {
width: 100%;
height: 200px;
margin-top: 10px;
padding: 20px 0; /* フッタのパディング（上下、左右） */
background-color: #e4e0da; /* フッタの背景色 */
}

/* --- フッタメニュー --- */
#footer ul.nl {
margin: 0 0 10px; /* フッタメニューのマージン（上、左右、下） */
padding: 0;
list-style-type: none;
text-align: center;
}
/* --- メニュー項目 --- */
#footer ul.nl li {
padding: 0 4px 0 8px; /* 項目のパディング（上右下左） */
background: url(../image/menu_line_gray.gif) no-repeat left; /* 項目の背景（区切り線） */
display: inline;
}
/* 最初の項目 */
#footer ul.nl li.first {
background-image: none; /* 区切り線なし */
}
/* ガイドメニュー */
#footer ul.guide {
margin: 0 0 20px; /* ガイドメニューのマージン（上書き） */
}

/* --- アドレス・コピーライト --- */
#footer address {
font-style: normal;
text-align: center;
line-height: 140%; /* 行の高さ */
}

/* --- ▲フッタ内の設定終了 --- */


/* --- ▼その他の設定開始 --- */

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}

/* --- ▲その他の設定終了 --- */

/* --- ▲その他の設定2開始 --- */

/* --- リストエリア --- */
ul.piano {
width: 100%; /* リストエリアの幅 */
margin: 0;
padding:20px 0 0; /* リストエリアのパディング（上、左右、下） */
list-style-type: none;
}

/* --- リスト項目 --- */
ul.piano li {
width: 220px; /* 項目の幅 */
float: left;
}


/* --- 項目内容 --- */
ul.piano dl {
width: 200px; /* 内容の幅 */
padding-top: 80px;
margin: 0px auto; /* 内容のセンタリング */
font-size: 100%;
}

/* --- 写真エリア --- */
ul.piano dt {
/* height: 102px; */ /* 写真エリアの高さ（dt要素の高さを指定する場合） */
margin-bottom:0px; /* 写真エリアの下マージン */
}
ul.piano dt img {
border: 1px #808080 solid; /* 写真の境界線 */
}

/* --- キャプションエリア --- */
ul.piano dd {
margin: 0 0 3px; /* キャプションエリアのマージン（上、左右、下） */
height: 6.5em; /* キャプションエリアの高さ */
line-height: 150%;
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}



/* --- ▲その他の設定2終了 --- */

/* --- ▲その他の設定3 --- */

/* --- リストエリア --- */
ul.detail {
width: 100%; /* リストエリアの幅 */
margin: 0;
padding: 0;
 /* リストエリアの上境界線 */
list-style-type: none;
}

/* --- リスト項目 --- */
ul.detail li {
padding: 20px 15px; /* リスト項目のパディング（上下、左右） */
 /* リスト項目の下境界線 */
}

/* --- 項目内容 --- */
ul.detail dl {
width: 100%;
margin: 0;
font-size: 100%;
}

/* --- 写真エリア --- */
ul.detail dt.photo {
width: 320px; /* 写真エリアの幅 */

float: left;
}
ul.detail dt.photo img {
border: 1px #808080 solid; /* 写真の境界線 */
}

/* --- キャプションエリア --- */
ul.detail dt.title,
ul.detail dd {
margin: 0 0 0 170px; /* キャプションエリアのマージン（上右下左） */
}

/* --- タイトルエリア --- */
ul.detail dt.title {
margin-bottom: 5px; /* タイトルエリアの下マージン */
line-height: 120%;
}

/* --- コメントエリア --- */
ul.detail dd {
line-height: 250%;
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}

/* --- ▲その他の設定3終了 --- */

/* --- ▼講師プロフィール設定開始 --- */



/* --- リストエリア --- */
ul.profile {
width: 600px; /* リストエリアの幅 */
margin: 0;
padding: 0;
border-top: 1px #808080 dotted; /* リストエリアの上境界線 */
list-style-type: none;
}

/* --- リスト項目 --- */
ul.profile li {
padding: 20px 15px; /* リスト項目のパディング（上下、左右） */
border-bottom: 1px #808080 dotted; /* リスト項目の下境界線 */
}

/* --- 項目内容 --- */
ul.profile dl {
width: 100%;
margin: 0;
font-size: 100%;
}

/* --- 写真エリア --- */
ul.profile dt {
width: 160px; /* 写真エリアの幅 */
float: left;
}
ul.profile dt img {
border: 1px #808080 solid; /* 写真の境界線 */
}

/* --- キャプションエリア --- */
ul.profile dd {
margin: 0 0 0 160px; /* キャプションエリアのマージン（上右下左） */
line-height: 180%;
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;

}

/* --- ▲講師プロフィール設定終了 --- */

/* --- ▼他4開始 --- */

#cont_left h2 {
	background: url(../image/navi_title_bg.gif) no-repeat top center;
	font-size: 12px;
	height: 39px;
	margin: 0;
	padding: 12px 0 0;
	text-align:center;
	color: #000000;
	}

/* --- ▲他4終了 --- */

/* --- DOCUMENT AREA IN RIGHT BOX START --- */

#rightArea *{
width:85%;
}

#rightArea table{
    border-top:1px solid #663300;
    border-left:1px solid #663300;
    border-collapse:collapse;
    border-spacing:0;
    background-color:#ffffff;
    empty-cells:show;
}
#rightArea table col{width:33%}

#rightArea th{
    border-right:1px solid #663300;
    border-bottom:1px solid #663300;
    color:#330000;
    background-color:#996633;
    background-image:url(../img/table-back.gif);
    background-position:left top;
    padding:0.3em 1em;
    text-align:center;
}
#rightArea th.width1over3{
    border-right:1px solid #663300;
    border-bottom:1px solid #663300;
    color:#330000;
    background-color:#996633;
    background-image:url(../img/table-back.gif);
    background-position:left top;
    padding:0.3em 1em;
    text-align:center;
    width:33%
}

#rightArea th.width1over4{
    border-right:1px solid #663300;
    border-bottom:1px solid #663300;
    color:#330000;
    background-color:#996633;
    background-image:url(../img/table-back.gif);
    background-position:left top;
    padding:0.3em 1em;
    text-align:center;
    width:20%
}


#rightArea th.width150{
    border-right:1px solid #663300;
    border-bottom:1px solid #663300;
    color:#330000;
    background-color:#996633;
    background-image:url(../img/table-back.gif);
    background-position:left top;
    padding:0.3em 1em;
    text-align:center;
    width:150px
}



#rightArea td{
    border-right:1px solid #663300;
    border-bottom:1px solid #663300;
    padding:0.3em 1em;
    text-align:center;
    width:150px;
    line-height:150%
}

#rightArea td.textToLeft{
    border-right:1px solid #663300;
    border-bottom:1px solid #663300;
    padding:0.3em 1em;
    text-align:left;
    width:150px
}

#rightArea td.width1over4{
    border-right:1px solid #663300;
    border-bottom:1px solid #663300;
    padding:0.3em 1em;
    text-align:center;
    width:20%
}

#rightArea td.width2over4{
    border-right:1px solid #663300;
    border-bottom:1px solid #663300;
    padding:0.3em 1em;
    text-align:center;
    width:60%
}


#rightArea th.width1over4{
    border-right:1px solid #663300;
    border-bottom:1px solid #663300;
    color:#330000;
    background-color:#996633;
    background-image:url(../img/table-back.gif);
    background-position:left top;
    padding:0.3em 1em;
    text-align:center;
    width:20%
}

#rightArea ul{
line-height: 150%; /* 行の高さ */
letter-spacing:1px;
}

#rightArea p{
line-height: 150%; /* 行の高さ */
letter-spacing:1px;
padding-left: 30px;
}

.webmail a{
float:right
}

div.icon_grid{float:right}
.icon img{margin:10px 0 0 20px;border:0}
.icon_title p{
margin:0;
padding:0;
font-size:9px;
text-align:center}

/* --- DOCUMENT AREA IN RIGHT BOX END --- */


ul.concertInfo{list-style:none;}
li.concertInfo{
padding-left:30px;
line-height: 180%; /* 行の高さ */
letter-spacing:1px;
background-repeat:no-repeat;
background-position:left center;
background-image:url("https://drastuc.me/img/087.gif");
}
h3.concertInfo {
    margin-left: 30px;
                font-size: 12px;
                color: #404040;
}

ul.LinkInfo{list-style:none;}
li.LinkInfo{
padding-left:30px;
line-height: 180%; /* 行の高さ */
letter-spacing:1px;

}
h3.LinkInfo {
background-repeat:no-repeat;
background-position:left center;
background-image:url("https://drastuc.me/img/087.gif");
padding-left: 30px;
margin-left: 30px;
font-size: 14px;
color: #404040;
}


/*修理のページ*/
div.syu{
margin: 0;
padding: 0;
background-color:  #ffffff; 
/*background-image: url(../image/pink2.jpg);*/
/*background-repeat: repeat;*/
color: #404040; /* 全体の文字色 */
font-size: 16px; /* 全体の文字サイズ */
line-height: 120%; /* 行の高さ */
font-family: Meiryo UI,Arial, Helvetica, sans-serif, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3"; 
    
}



div.pianoIcon {
    width: 200px;
    height: 360px;
    border: solid;
    border-width: 1px;
    border-color: #808080;
    color: #404040;
    text-align:center;
    margin: 0px auto;
    margin-top: 10px;
}


div.pianoIcon.soldout {
    width: 200px;
    height: 360px;
    border: solid;
    border-width: 1px;
    border-color: #808080;
    color: #404040;
    text-align:center;
    margin: 0px auto;
    margin-top: 10px;
    background-image:url("../image/piano-top/soldoutW200.png");
    background-repeat:no-repeat;
}

p.pianoIcon{
    margin-top:0px;
    margin-bottom:0px;
    padding-top: 0px;
    padding-bottom: 0px;
    text-align: left;
    font-size: 12px;
    color: #404040;
}

p.pianoIcon.Category{
    margin-top:0px;
    margin-bottom:0px;
    padding-top: 0px;
    padding-bottom: 0px;
    text-align: left;
    font-size: 12px;
    font-weight: bold;
    color: #404040;
}

p.pianoIcon.Comments{
    padding-top: 10px;
    text-align: left;
    font-size: 12px;
    font-weight:normal;
    color: #404040;
}

p.pianoIcon.Model{

    margin-top:0px;
    margin-bottom:0px;
    padding-top: 0px;
    padding-bottom: 0px;
    text-align: left;
    font-size: 12px;
    font-weight: bold;
    color: #404040;
}


strong.pianoIcon{
    padding: 0;
    margin: 0;
    text-align: left;
    font-size: 12px;
    font-weight: bold;
    line-height: 110%;
    color: #330000;
}
b.pianoIcon{
    display:block;
    padding: 5px 0 5px 10px;
    margin-bottom: 10px;
    text-align: left;
    font-size: 13px;
    font-weight: bold;
    color: #b6ada0;
    background-color: #0A2140;
}

a img.pianoIcon{
border:solid;
border-width: 1px;
margin:0 auto;
text-align: center;    
}

div.Nyuumon{
    width:100%;
    height: 200px;
    border-style: solid;
    border-width: medium;
    border-color:#404040;
}

img.Nyuumon{
   border: none;
   float: left; 
   width: 260px;
   
}


div.rentalPiano {
    width: 200px;
    height: 300px;
    text-align: center;
    border: solid;
    border-width: 1px;
    border-color: #808080;
    color: #404040;
    padding: 0px;
    margin-top: 10px;
    margin-bottom: 10px;
}
p.rentalPiano{
    padding: 0;
    margin: 0;
    text-align: left;
    font-size: 12px;
    font-weight: bold;
    line-height: 110%;
    color: #330000;
}
strong.rentalPiano{
    padding: 0;
    margin: 0;
    text-align: left;
    font-size: 12px;
    font-weight: bold;
    line-height: 110%;
    color: #330000;
}
b.rentalPiano{
    display:block;
    padding: 0;
    margin: 0;
    text-align: left;
    font-size: 13px;
    font-weight: bold;
    line-height: 110%;
    color: #FFFFFF;
    background-color: #4d3d21;
}

a img.rentalPiano{
border:solid;
border-width: 1px;
margin:0 auto;
text-align: center;    
}


/*ConcertInfo2*/
ul.concertInfo2{list-style:none;}
li.concertInfo2{
padding-left:30px;
line-height: 180%; /* 行の高さ */
letter-spacing:1px;
}
h3.concertInfo2{
padding-left:30px;
background-repeat:no-repeat;
background-position:left center;
background-image:url("https://drastuc.me/img/087.gif");
                font-size: 12px;
                color: #404040;
}

img.concertInfo02{
 float: left       
}


 ul.msguide {
list-style-type: none;
}
 li.list{
    width: 100%;
  /*  font-weight: bold; */ 
    padding: 4px 8px 5px 30px;
    background: url(../image/rose.png) no-repeat left;
    background-size:18px;
    font-size: 14px;
 
}

/*レッスンシステム*/

 li.lesson{
    width: 100%;
    line-height: 180%; /* 行の高さ */  
    letter-spacing:1px;
    font-size: 14px;
 
}
h3.lessons{
    height: 36px;
    padding-top: 14px;
    padding-left: 30px;
    background-image: none;
/*
background-repeat:no-repeat;
background-position:left;
background-image:url("../image/clo.gif");
                font-size: 18px;
                color: #404040;
*/
}

h2.lesson{
margin:0;
padding: 10px 10px 10px 10px; /* 見出しのパディング（上右下左） */
/* クリスマスシーズンの見出し飾り
background-image: url("../main/img/poinsettia.png");
background-repeat:no-repeat;
*/
border-left: 5px #b6ada0  solid;
border-bottom: 1px #b6ada0  dotted; /* 見出しの左境界線 */
font-size: 120%; /* 見出しの文字サイズ */
line-height: 100%; /* 行の高さ */  
}


.no1{
    width: 620px;
    height: 20px;
    background: url(../image/one.png) no-repeat left;
    padding: 2px 0 0 30px;
    font-size: 15px
}
.no2{
    width: 620px;
    height: 20px;
    background: url(../image/two.png) no-repeat left;
    padding: 2px 0 0 30px;
   
    font-size: 15px
}
.no3{
    width: 100%;
    height: 20px;
    background: url(../image/three.png) no-repeat left;
    padding: 2px 0 0 30px;
   
    font-size: 15px
}
.no4{
    width: 100%;
    height: 20px;
    background: url(../image/four2.png) no-repeat left;
    padding: 2px 0 0 30px;
  
    font-size: 15px
}


h3.lesson {
 height:30px;margin:0px 0px 5px 0px;padding:5px 0px 0px 0px;
 font-size:16px;font-weight:bold;color:#333333;
 text-align: center;
 background-image:url(../head011/head011_04.png);
 background-position:bottom;background-repeat:repeat-x;
 }




div.dl-list-01 {  
  width: 670px;  
  margin: 1em 0;
  margin-bottom: 30px;  
}   
img.sell{  
 width: 300px; /* 幅調節 */  
 /* 高さ調節 */  
  float: left;  
  clear: left;  
}    
p.sell {  
  width: 330px; /* 幅調節 */  
  padding-left: 5px;
  height: 300px; /* 高さ調節 */  
  float: left;  
} 

ul.sell {  
  width: 320px; /* 幅調節 */  
  padding-left: 0px;
  height: 300px; /* 高さ調節 */  
  float: right;  
}  

 div.box2 {  
  width: 320px; /* 幅調節 */  
  padding-left: 5px;
  height: 300px; /* 高さ調節 */  
  float: right;  
}


/*修理*/
div.re{
    width: 600px;
    height: 60px;
    padding-left: 25px;
    margin-top:50px;
    float: left;
    text-align: center;
    font-size: 20px
}

h4.re{
    float: right;
    font-size: 18px;
  
    
    
} 

/*修理詳細*/

.re-makar{
    font-size: 25px;
    font-family: Garamon,'Meiryo UI';
    margin: 10px;
    
}

.re-m{   
    background:#000000;
    color:#ffffff;
    font-size: 20px;
    font-family: Garamond,'Meiryo UI';
    border-bottom:7px solid #ccc;   
    padding:.5em .9em .3em;
    font-weight: bold;  
    margin:30px 0 20px 0;
}  


.re-spec table {
    width: 100%;
    height: 20%;
    border: 1px #000000 solid;
    border-collapse: collapse;
    
}

.re-spec td {
    width: 25%;
    border: 1px #000000 solid;
    padding: 10px 0;
    text-align: center;
    vertical-align: middle;
}

div.rebuild{
margin: 20px;
margin-top: 50px;
}


img.rebuild{
margin: 20px;
float: left;}

table.rebuild {
margin-top: 50px;
border-collapse:collapse;
border-color:#6495ed ;
border-style:groove;
border-width:5px ;
}

td.rebuild {
    width: 100%;
padding: 10px;
vertical-align: top;
}
tr.rebuild {
    border-bottom: 0.5px solid;
    border-top: 0.5px solid;
}
td.rebuild {
vertical-align: top;
padding: 10px;
}

/* レンタル・ルーム　*/
div.rentalroom {
margin: 20px;
margin-top: 50px;
}
strong.rentalroom {
display: block;
width: 600px;
margin-bottom:20px;
line-height: 180%;
font-size: 15px;
border-top-width: 2px;
border-bottom-width: 2px;
border-bottom: solid;
border-top: solid;
border-color:#0A2140;
}

img.rentalroom {
margin: 20px;
float: left;}

table.rentalroom {
margin-top: 50px;
border-collapse:collapse;
}
caption.rentalroom {
font-size: 12px;
font-weight: bold;
line-height: 180%;

}
td.leftColumn {
padding: 10px;
vertical-align: top;
}
tr.rentalroom {
    border-bottom: 0.5px solid;
    border-top: 0.5px solid;
}
td.rightColumn {
vertical-align: top;
padding: 10px;
}


/*ピアノ調律のページ*/
h3.tuningCharges{
margin-left:20px;
font-size:120%;
}

h3.wordExplanation{
display: block;
padding-left: 20px;
font-size:120%;
line-height: 180%;
border-top-width: 1px;
border-bottom-width: 1px;
border-bottom: solid;
border-top: solid;
border-color:#0A2140;
}


img.tuningCharges {
width: 240px;
margin: 10px;
float: left;
}
p.tuningCharges {
margin-left:20px;   
}

div.tuningCharges{
text-align:center;
}

table.tuningCharges{
    margin-left: auto;
    margin-right: auto;
}
.clear2 {
clear: both;}
hr.clear2 {
display: none;}

/*スライドショー*/
#slideshow {
   position: relative;
   width:  640px; /* 画像の横幅に合わせて記述 */
   height: 270px; /* 画像の高さに合わせて記述 */
}
#slideshow img {
   position: absolute;
   top: 0;
   left:0;
   z-index: 8;
   opacity: 0.0;
}
#slideshow img.active {
   z-index: 10;
   opacity: 1.0;
}
#slideshow img.last-active {
   z-index: 9;
}
.sidebar {
display: block;
margin-left: auto;
margin-right: auto;
}
img.sidebar {
width: 180px;
}
.center {
text-align:center;
}