/*
参考サイト
テーブルの角丸
http://www.htmq.com/css3/border-radius.shtml

たった一行でさまざまな要素をレスポンシブ対応にするスタイルシート -Fluidity
http://coliss.com/articles/build-websites/operation/css/css-small-framework-for-responsive-fluidity.html

CSSの display: inline、display: block、display: inline-block をマスターしよう！
http://taneppa.net/display-inline-block/
※ページの中ほどより少し下に、メニューの横並び有り

★横並びリストを自動で折り返させる
http://www.acky.info/tips/css/00012.html

*/

/* スマホで文字が勝手に大きくならないように 
 文字は表と同じ大きさになったが、レスポンシブしてないPCのページっぽく表示される 
body {
-webkit-text-size-adjust: 100%; 
}
*/



/* divでテーブル */
.container{
  width: 100%;
  margin: 0 auto;
}
.block{
  margin: 20px 0;
}
.block__element1{
  padding: 9px;
  font-size:90%;
}
.block__element2{
  display: table-cell;
  padding: 9px;
  font-size:90%;
}




table tr td.bgtest { 
  background: #ffffff;
} 


.mdw-x {
font-size:x-large;
border-bottom:  3px double green;
}

p.mdw-c {
font-size:x-large;
background: #dddddd;
}

p.bku {
width: 350px;
}



table { 
  width: auto; 
  border-spacing: 0; 
  font-size:14px; 
} 

table th { 
  color: #fff; 
  padding: 8px 15px; 
  background: #444; 
  background:-moz-linear-gradient(rgba(34,85,136,0.7), rgba(34,85,136,0.9) 50%); 
  background:-webkit-gradient(linear, 100% 0%, 100% 50%, from(rgba(34,85,136,0.7)), to(rgba(34,85,136,0.9))); 
  font-weight: bold;
  border-left:1px solid #000;
  border-top:1px solid #000;
  border-bottom:1px solid #000; 
  line-height: 120%;
  text-align: center;
  text-shadow:0 -1px 0 rgba(34,85,136,0.9);
  box-shadow: 0px 1px 1px rgba(255,255,255,0.3) inset;
  width: 5em;
} 

/* 口座振替用 */
table th.direct_debit_page1 { 
  width: 7em;
}
table th.direct_debit_page2 { 
  width: 25em;
}


table th:first-child { 
  border-radius: 5px 0 0 0;  
} 

table th:last-child { 
  border-radius:0 5px 0 0; 
  border-right:1px solid #000; 
  box-shadow: 2px 2px 1px rgba(0,0,0,0.1),0px 1px 1px rgba(255,255,255,0.3) inset; 
} 

table tr td { 
  padding: 8px 10px; 
  border-bottom: 1px solid #000; 
  border-left: 1px solid #000;
  text-align: left;
  vertical-align: top;
} 

table tr td.bgch { 
  background: #caeb71;
} 

table tr td.bgolive { 
  background: #555;
  color:white;
} 



table tr td:last-child { 
  border-right: 1px solid #000; 
  box-shadow: 2px 2px 1px rgba(0,0,0,0.1); 
} 

table tr { 
  background: #fff; 
} 

/*
table tr:nth-child(2n+1) { 
  background: #f1f6fc; 
} 
*/

table tr:last-child td { 
  box-shadow: 2px 2px 1px rgba(0,0,0,0.1); 
} 

table tr:last-child td:first-child { 
  border-radius: 0 0 0 5px; 

} 

table tr:last-child td:last-child { 
  border-radius: 0 0 5px 0; 
} 

table tr:hover { 
  background: #d9eba7;
  cursor:pointer; 
}




/*　-----------------------------------------------------------------------------  */

/*　↓について理解しているとCSSがより便利
display:inline-block;
display:inline;
display:block;
*/


/* ボタンメニュー用 */
/* 参考サイト
http://taneppa.net/display-inline-block/
リンクをブロック要素（div）全体にきかせる
http://junk-blog.com/div_a_link/
*/


/*
a {
text-decoration: none;
text-align: center;
}
*/


ul {
padding: 0;
margin: 1em 0;
} 


li{
display: inline-block;
margin:1px;
*display: inline;   /* IE用のハックです */
zoom: 1;            /* IE用の hasLayout を true にするための記述です */
}


.btn-muji {
display:block;

background: #EEE;
border-top: 1px solid #DDD;
border-left: 1px solid #DDD;
border-right: 1px solid #BBB;
border-bottom: 1px solid #BBB;
color:#000;
width:80px;
padding: 10px 0;

text-decoration: none;
text-align: center;
}

.btn-color-S {
display:block;

font-size:x-large;

background: #afeeee;
border-top: 1px solid #8cc;
border-left: 1px solid #8cc;
border-right: 1px solid #599;
border-bottom: 1px solid #599;
color:#233;
width:80px;
padding: 10px 0;

text-decoration: none;
text-align: center;
}


.btn-color-L {
display:block;

font-size:x-large;

background: #90ee90;
border-top: 1px solid #8cc;
border-left: 1px solid #8cc;
border-right: 1px solid #599;
border-bottom: 1px solid #599;
color:#233;
width:170px;
padding: 10px 0;

text-decoration: none;
text-align: center;
}


.btn-color-M {   /* 横サイズL、色S */
display:block;

font-size:x-large;

background: #afeeee;
border-top: 1px solid #8cc;
border-left: 1px solid #8cc;
border-right: 1px solid #599;
border-bottom: 1px solid #599;
color:#233;
width:170px;
padding: 10px 0;

text-decoration: none;
text-align: center;
}


.btn-color-F {   /* 色S 横サイズフリー */
display:block;

font-size:x-large;

background: #afeeee;
border-top: 1px solid #8cc;
border-left: 1px solid #8cc;
border-right: 1px solid #599;
border-bottom: 1px solid #599;
color:#233;
width:;
padding: 10px 0;

text-decoration: none;
text-align: center;
}


/* btn-colorのクリーム色
background: #fff495;
border-top: 1px solid #F0E68C;
border-left: 1px solid #F0E68C;
border-right: 1px solid #d7ce7d;
border-bottom: 1px solid #d7ce7d;
color:#000;
*/




/*　-----------------------------------------------------------------------------  
お知らせ用
*/
.btn-color-A {
display:block;

background: #afeeee;
border-top: 1px solid #8cc;
border-left: 1px solid #8cc;
border-right: 1px solid #599;
border-bottom: 1px solid #599;
color:#233;
width:100%;
padding: 10px 0;

text-decoration: none;
text-align: ;
}



/*　-----------------------------------------------------------------------------  
講師紹介用 displayについて→http://postd.cc/how-well-do-you-know-display/
https://saruwakakun.com/html-css/basic/display
*/
.lecturers-t{
display: block;
padding: 3px 1em;
margin: 3px;
background-color: #555;
color: #FFF;
text-decoration: bold;
}

img {
display: inline;
}

div {
display: table; /* tableのように使えるかも */
}