@charset "UTF-8";

/*================================================
 *  一般・共通設定
 ================================================*/
body {font-size:20pt; font-weight:plain; font-family:UD デジタル 教科書体 N-B }
h1 {font-size:35pt }
h2 {color:white; padding:1px; font-size:25pt;
background-color:green }
p {font-size:20pt }

/*================================================
 *  テーブルでセル全体をリンクする
 ================================================*/
table.sample { width:60%; }
table.sample td { width:100%; border: 1px solid #c7c7bc; color: #404040; }
table.sample td a{ display:block; width:100%; height:100%; } 
table.sample td a:hover{ background-color: #f49d9d; } 
    a { color:#0000FF; text-decoration:none; }
    
/*================================================
 *  表示・非表示を切り替えるボタンサンプル
 ================================================*/
/*全体*/
.hidden_box {margin: 2em 0;/*前後の余白*/padding: 0; }
/*ボタン装飾*/
.hidden_box label {padding: 15px; font-weight: bold; border: solid 2px black; cursor :pointer; }
/*ボタンホバー時*/
.hidden_box label:hover {background: #efefef; }
/*チェックは見えなくする*/
.hidden_box input {display: none; }
/*中身を非表示にしておく*/
.hidden_box .hidden_show {height: 0; padding: 0; overflow: hidden; opacity: 0; transition: 0.8s; }
/*クリックで中身表示*/
.hidden_box input:checked ~ .hidden_show {padding: 10px 0; height: auto; opacity: 1; }

/*================================================
 *  ボタンのデザイン
 ================================================*/
.c-button {
 appearance: none;
 border: 1;
 border-radius: 5px;
 background: orange;
 color: white;
 padding: 8px 16px;
 font-size: 20px;
 font-weight: bold;
 font-family: :UD デジタル 教科書体 N-B;
}