@charset "UTF-8";

/*================================================
 *  テーマカラーメモ
 ================================================
基本色１（ブルー）：#1D2088
基本色２（濃い灰色）：#ddd

 ================================================*/

/*================================================
 *  CSSリセット
 ================================================*/
html,body,div,span,h1,h2,h3, p,img,dl,dt,dd,ol,ul,li,form,label,button,input,select,option,textarea,table,tbody,tr,th,td,footer,header,nav,time { margin:0; padding:0; border:0; outline:0; line-height:1.6; vertical-align:baseline; background:transparent; font-size:14px; font-weight:normal; }
div, footer, header, nav, ul, dl, dt, dd { display:block; overflow:hidden; }
ul { list-style:none; }
a { margin:0; padding:0; vertical-align:baseline; background:transparent; color:black; text-decoration:none; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0); }
a:link, a:visited, a:hover, a:active, a:focus { text-decoration:none; outline:none; }
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
input[type="submit"], input[type="button"] { border-radius:0; -webkit-box-sizing:content-box; -webkit-appearance:button; appearance:button; border:none; box-sizing:border-box; cursor:pointer; }
input[type="submit"]::-webkit-search-decoration, input[type="button"]::-webkit-search-decoration { display:none; }
input[type="submit"]::focus,input[type="button"]::focus { outline-offset:-2px; }


/*================================================
 *  タグ設定
 ================================================*/
* { box-sizing:border-box; font-family: "YuGothic","foo","游ゴシック", YuGothic , sans-serif; }
body { margin:0 auto; -webkit-text-size-adjust:100%; }
header { padding:10px 0 5px; text-align:center; border-bottom:0 solid #1D2088; }
h1 { font-size:200%; }
h2 { font-size:150%; font-weight:bold; }
h3 { font-size:125%; font-weight:bold; margin:5px 0; }
h3 span { font-size:100%; font-weight:bold; }
table { border:2px solid #333; table-layout:fixed; margin-left:auto; margin-right:auto; }
th, td { border:1px solid #333; }
th { background-color:#ddd; padding:5px; }
thead th { padding:0 5px; }
td { padding:0px; }
input[type="text"] { border:1px solid #ccc; padding:0 5px; }
input[type="submit"] { display:block; border-radius:0; border:0; background-color:#1D2088; color:white; width:200px; height:40px; line-height:40px; text-align:center; }
input[type="submit"]:hover, .button:hover { opacity:0.7; }
footer { padding:20px 0 100px; border-top:2px solid #1D2088; text-align:center; }

/*================================================
 *  クラス設定
 ================================================*/
.center { text-align:center; margin:0 auto; }
.right { text-align:right; }
.empha { font-weight:bold; }
.error { display:block; color:red; text-align:center; }
.number { text-align:right; }
.buttons_block { display:flex; justify-content:center; flex-wrap:wrap; margin-top:20px; }
.buttons_block * { margin-left:10px; margin-right:10px; }
.button { display:block; border-radius:0; border:0; background-color:#1D2088; color:white; }
.buttons_block .button { width:200px; height:40px; line-height:40px; margin-bottom:20px; text-align:center; }
table tr td a { display:block; width:100%; line-height:32px; background-color:#1D2088; color:white; margin-top:0; padding:0 5px; }
table tr td span { padding:0 5px; }

/*================================================
 *  名前欄
 ================================================*/
div#name { display:flex; justify-content:center; flex-wrap:wrap; text-align:center; }
div.name_0 { background-color:#eee; }
div.name_1 { background-color:lavender; }
div.name_2 { background-color:navajowhite; }
div#name p { border-left:1px solid #ccc; margin:5px 0; padding:10px; line-height:1; background-color:#ddd; }
div#name p:first-child { border-left:0; }
div#name p:last-child { border-right:1px solid #ccc; }
div#name a.button { margin:5px; width:100px; height:auto; line-height:1; padding:10px; }
div#name a.button:hover { background-color:#5052AD; color:white; }

/*================================================
 *  企業管理者用メニュー欄
 ================================================*/
div#corp_menu { display:flex; justify-content:center; flex-wrap:wrap; text-align:center; background-color:lavender; }
div#corp_menu p, div#corp_menu a { border-radius:5px 5px 0 0; margin-top:5px; line-height:1; }
div#corp_menu p { width:200px; padding:10px; font-weight:bold; background-color:white; }
div#corp_menu a.button { width:200px; height:auto; line-height:1; padding:10px; }
div#corp_menu a.button:hover { background-color:#5052AD; }
div#corp_menu *:first-child { margin-right:10px; }

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

/*================================================
 *  ページトップへの戻り
 ================================================*/
#page-top { position:fixed; bottom:20px; right:20px; opacity:0.8; }
#page-top a { display:block; width:50px; height:50px; background:url('images/totop.png'); background-color:#1D2088; }
#page-top a:hover { opacity:1; }

/*================================================
 *  本文
 ================================================*/
div.contents { min-height:500px; width:900px; margin:20px auto; }

/*================================================
 *  以下、各ページ定義
 *  [共通]ログイン画面
 ================================================*/
form.login { margin-top:30px; text-align:center; }
form.login p.login_mes { text-align:center; color:red; margin-bottom:10px; }
form.login div { display:inline-block; }
form.login div label { display:block; text-align:left; }
form.login div input { display:block; width:250px; height:30px; line-height:30px; border:1px solid gray; margin-bottom:30px; }
form.login div input[type="submit"] { height:50px; }

/*================================================
 *  企業管理
 ================================================*/
table#corp_list tr, table#corp_list th, table#corp_list td { line-height:30px; }
table#corp_list tr td { width:70px; }
table#corp_list tr td:nth-of-type(2) { width:407px; }
table#corp_detail tr th { width:200px; text-align:right; }
table#corp_detail tr td { width:600px; padding:0 5px; }
table#corp_detail tr td input { width:590px; }
table#corp_detail tr td input[name="admin_login"], table#corp_detail tr td input[name="admin_password"] { width:200px; }
table#corp_detail tr:nth-of-type(2) td input { width:30px; }

/*================================================
 *  ユーザ管理
 ================================================*/
table#user_list tr, table#user_list th, table#user_list td { line-height:30px; }
table#user_list tr td:nth-of-type(1) { width:90px; }
table#user_list tr td:nth-of-type(2) { width:80px; }
table#user_list tr td:nth-of-type(2) { width:150px; }
table#user_list tr td:nth-of-type(3) { width:150px; }
table#user_list tr td:nth-of-type(4) { width:230px; }
table#user_list tr td:nth-of-type(5) { width:150px; }
table#user_list tr td:nth-of-type(6) { width:90px; text-align:center; }
table#user_detail tr th { width:150px; text-align:right; }
table#user_detail tr td { width:410px; padding:0 5px; }
table#user_detail tr td input { width:400px; }
table#user_detail tr td input[type="radio"] { width:30px; }
table#user_detail tr td input.number { width:50px; }
form.csvuser input#upfile { margin-top:30px; margin-bottom:10px; }
a.csvuser { display:block; }

/*================================================
 *  進捗管理
 ================================================*/
table#progress_list { margin:0 auto; }
table#progress_list tr, table#progress_list th, table#progress_list td { line-height:30px; }
table#progress_list tr td { text-align:center; }
table#progress_list tr td:nth-of-type(1) { width:70px; }
table#progress_list tr td:nth-of-type(2) { width:70px; }
table#progress_list tr td:nth-of-type(3) { width:160px; }
table#progress_list tr td:nth-of-type(4) { width:160px; }

/*================================================
 *  契約管理
 ================================================*/
table#subscribe_list tr, table#subscribe_list th, table#subscribe_list td { line-height:30px; padding:0 5px; }
table#subscribe_list tr td { width:120px; padding:0; }
table#subscribe_list tr td span { padding:0 5px; }
table#subscribe_detail tr th { width:120px; text-align:right; }
table#subscribe_detail tr td { width:200px; padding:5px; }
table#subscribe_detail tr td input { width:190px; }
table#subscribe_detail tr td input.number { width:50px; }

/*================================================
 *  割り当て管理
 ================================================*/
table#assign_list tr, table#assign_list th, table#assign_list td { line-height:30px; }
table#assign_list tr td { width:90px; }
table#assign_list tr td:nth-of-type(2) { width:150px; }
table#assign_list tr td:nth-of-type(3) { width:150px; }
table#assign_list tr td:nth-of-type(4) { width:70px; text-align:center; }
table#assign_detail tr th { width:150px; text-align:right; }
table#assign_detail tr td { width:700px; padding:0 5px; }
table#assign_detail tr td input { width:690px; }
table#assign_detail tr td input[type="radio"] { width:30px; }
table#assign_detail tr td input.number { width:50px; }

table#assign_form tr, table#assign_form th, table#assign_form td { line-height:30px; }
table#assign_form tr td { width:90px; }
table#assign_form tr td:nth-of-type(3) { width:150px; }
table#assign_form tr td:nth-of-type(4) { width:150px;}
table#assign_form tr td:nth-of-type(5) { text-align:center; }
table#assign_form tr td:nth-of-type(6) { width:175px; text-align:center; }
table#assign_detail tr th { width:150px; text-align:right; }
table#assign_detail tr td { width:700px; padding:0 5px; }
table#assign_detail tr td input { width:690px; }
table#assign_detail tr td input[type="radio"] { width:30px; }
table#assign_detail tr td input.number { width:50px; }

/*================================================
 *  CSVファイルアップロード
 ================================================*/
form.csvuser label { width:200px; height:40px; line-height:40px; margin-bottom:20px; text-align:center; cursor:pointer; }

/*================================================
 *  受講画面
 ================================================*/
div.show { height:70px; }
video#video { width:100%; height:auto; }
video#video { background-image:url('images/loading.gif'); background-repeat: no-repeat; border:1px solid #ddd; }
a#next { display:none; }
p.textbook_finish { margin:40px 0; font-size:130%; color:green; text-align:center; }


/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */
/* ■■■■■■  ここからタブレット・スマートフォン向け  ■■■■■■■■ */
/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */
@media screen and (max-width:900px) {

/*================================================
 *  ヘッダ
 ================================================*/
header a img { width:100%; max-width:400px; padding:0 20px; }

/*================================================
 *  ログイン
 ================================================*/
form.login { margin-top:0; }
form.login div input { margin-bottom:10px; }
form.login div input[type="submit"] { margin-top:20px; }

/*================================================
 *  名前欄
 ================================================*/
div#name { padding:5px; }
div#name p { margin:5px 0; padding:10px 5px; }
div#name a.button { margin:5px 0 5px 5px; padding:10px 0; }


/*================================================
 *  本文
 ================================================*/
div.contents { min-height:200px; width:100%; padding:0 20px; }

/*================================================
 *  受講画面
 ================================================*/
div.textbook_title { font-size:100%; padding:5px; }
div.show { height:140px; }
.buttons_block * { margin-left:5px; margin-right:5px; }
.buttons_block .button { width:130px; }

}