@charset "utf-8";
/* CSS Document */

/* ===============================
   共通設定
================================ */

body{
background:#f5f6f8;
font-size:14px;
color:#333;
line-height:1.6;
}

a{
text-decoration:none;
}



/* ===============================
   Header
================================ */

.site-header{
background:#ffffff;
}

.logo{
height:40px;
}

.user-menu{
font-size:13px;
}



/* ===============================
   Navigation
================================ */

nav a{
margin:0 4px;
}



/* ===============================
   メインエリア
================================ */

main{
min-height:70vh;
}

.container{
max-width:700px;
}

.card{
border-radius:8px;
border:1px solid #e5e5e5;
}

.card-body{
padding:25px;
}



/* ===============================
   ページタイトル
================================ */

h1{
font-size:18px;
font-weight:600;
}



/* ===============================
   請求書UI
================================ */

.table{
font-size:14px;
}

.table td,
.table th{
padding:10px;
}



/* ===============================
   カテゴリー色分け
   （プログラムからclass付与）
================================ */

/* カテゴリー1：授業料 */

.category-1{
background:#e8f2ff;
}

/* カテゴリー2：諸経費 */

.category-2{
background:#f0f0f0;
}

/* カテゴリー3：入学金 */

.category-3{
background:#ffe8cc;
}

/* カテゴリー4：教材費など */

.category-4{
background:#fff8e1;
}

/* カテゴリー5：その他 */

.category-5{
background:#e8f5e9;
}



/* ===============================
   合計金額
================================ */

.invoice-total{
font-size:18px;
font-weight:bold;
}



/* ===============================
   フッター
================================ */

footer{
font-size:12px;
color:#777;
}



/* ===============================
   スマホ調整
================================ */

@media (max-width:576px){

.card-body{
padding:20px;
}

h1{
font-size:16px;
}

.logo{
height:34px;
}

}