@charset "UTF-8";

/* Reset */
*,*:before,*:after {box-sizing: border-box;}

ul {list-style:none;}
ul,li {margin:0; padding:0;}

ol {padding:0; margin:0 0 1em 1.5em;}
ol li {margin-bottom:0.5em; line-height: 1.5;}
ol ol, ol ul {margin-top:1em;}

a {color:#5e97d8; text-decoration:none; outline:none;}
a:hover {color:#82b4ee;}
button{
	background-color: transparent;
	border: none;
	cursor: pointer;
	outline: none;
	padding: 0;
}
img {vertical-align:middle;}

dl,dt,dd {margin:0;}

address,caption,em,th {font-style:normal;}

table {border-collapse: collapse; border-spacing: 0;}

/* Fluid-img */
img {width:100%; height:auto;}


/* --------------------------------------------------
	ベース
-------------------------------------------------- */
html {color:#333; font-feature-settings: "palt"; font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif; font-weight: 500; font-size: 16px; line-height:1; height:100%; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: 100%;}


/* BODY */
body {margin: 0;}
body.fixing-body {position: fixed; width:100%; height:100%;}



/* ------------------------------------3--------------
	共通
-------------------------------------------------- */
/* 見出し */
h1,h2,h3,h4,h5,h6 {margin:0 0 0.5em; line-height: 1.35;}

/* 段落 */
p {margin:0 0 0.75em; line-height: 1.7;}

/* リンクボタン */
.linkBtn {display: inline-block; width: 100%; background-color: #5e97d8; border: none; border-radius: 4px; color: #fff; line-height: 3; padding: 0; font-size: 1.125em;font-weight: bold; text-align: center; cursor: pointer;
	font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;}
.linkBtn:hover {background-color: #82b4ee; color: #fff;}

.linkBtn_Red {display: inline-block; width: 100%; background-color: #ea1111; border: none; border-radius: 4px; color: #fff; line-height: 3; padding: 0; font-size: 1.125em; font-weight: bold; text-align: center; cursor: pointer;}
.linkBtn_Red:hover {background-color: #F76A6A; color: #fff;}

.linkBtn_locked {display: inline-block; width: 100%; background-color: #999999; border: none; border-radius: 4px; color: #fff; line-height: 3; padding: 0; font-size: 1.125em; font-weight: bold; text-align: center; cursor: pointer;}
.linkBtn_locked:hover {background-color: #666666; color: #fff;}
.apply_semi_idpw .linkBtn_locked {width: 9em; font-size: 0.857em; font-weight: normal; line-height: 2;}

.linkBtn_Disabled, .linkBtn_AdminDisabled {display: inline-block; width: 100%; background-color: #999999; border: none; border-radius: 4px; color: #fff; line-height: 3; padding: 0; font-size: 1.125em; font-weight: bold; text-align: center; cursor: default;/*pointer-events:none;*/}
.linkBtn_Disabled:hover,
.linkBtn_AdminDisabled:hover {color: #fff;}

/*.locked {color:#999 !important;}*/

/* アコーディオンツリー */
.trigger {cursor: pointer;}
.accordionTree {display: none;}

/* --------------------------------------------------
フォーム
-------------------------------------------------- */
/* 入力エリア */
input[type="text"],input[type="password"],input[type="search"],input[type="email"],input[type="tel"],textarea {-webkit-appearance: none; background-color:#fcfcfc; border:1px solid #ccc; border-radius: 4px; font-size:16px; padding: 0.75em; width:100%; box-sizing:border-box; line-height:1;}
textarea {height:10em; line-height: 1.5;}
::-webkit-input-placeholder {color:#999;}

/* チェックボックス(labelの前にcheckboxがある普通の場合) */
input[type="checkbox"] {display:none;}
input[type="checkbox"] + label {position:relative; padding-left:2em; display: inline-block; line-height: 1; cursor: pointer;}
input[type="checkbox"]  + label:before {display:block; position:absolute; top:-0.25em; left:0; width:1.5em; height:1.5em; content: ""; border:1px solid #ccc; border-radius: 4px; background-color:#fcfcfc; cursor: pointer;}
input[type="checkbox"]:checked + label:before {background-color: #5e97d8; border-color: #5e97d8;}
input[type="checkbox"]:checked + label:after {content:""; display:block; width:1em; height:1em;  position: absolute; top:0.1em; left:0.25em; background:url(../img/icon_check.png) no-repeat; background-size:contain;}

/* セレクトボックス */
.select_type {background-color:#fff; border:1px solid #ccc; border-radius:0; line-height:1; position:relative;}
.select_type:after {content:""; display: block; width: 0.57em; height: 1em; position:absolute; top:50%; right:5px; transform: translateY(-50%); pointer-events: none; background: url("../img/common/icon_select.png") no-repeat; background-size: contain;}
select {width: 100%; background-color:transparent; border:none; border-radius:0; font-size:14px; line-height: 1.85; padding:0 1em 0 0.5em; cursor:pointer; margin:0 !important; position:relative; z-index:1;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;	
}
select::-ms-expand {display: none;}

/* ラジオボタン */
input[type="radio"] {display:none;}
input[type="radio"] + label {position:relative; padding-left:1.5em; display: inline-block; line-height:1;}
input[type="radio"] + label:before {display:block; position:absolute; top:-0.125em; left:0; width:1.25em; height:1.25em; content: ""; border:1px solid #ccc; border-radius:50%; background-color:#fcfcfc; cursor: pointer;}
input[type="radio"]:checked + label:before {background-color:#5e97d8; border-color:#5e97d8;}

.formBtn {width: 100%;  border: none; border-radius: 4px; color: #fff; line-height: 3; padding: 0; font-size: 1.125em; font-weight: bold; cursor: pointer;}

.formBtn:disabled {background-color: #999999;}
.formBtn:enabled {background-color: #5e97d8}
.formBtn:enabled:hover {background-color: #82b4ee;}

/* ラベル */
label {vertical-align: middle;}

/* 必須 */
.hissu {display: inline-block; background-color: #000; color: #fff; font-size: 0.75em; padding: 0 0.5em; line-height: 1.75; margin-left: 0.5em;}


/* --------------------------------------------------
	TOP背景画像
-------------------------------------------------- */
#cover {
	background-image: url("../img/mv.jpg");
	background-position: 50% 0;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
}
#cover .contents {background: rgba(59,59,59,0.25);}
/* --------------------------------------------------
	コンテンツ
-------------------------------------------------- */
.contents {background-color: #c9dcf2; padding: 15px 15px 30px;}
.contents_inner {max-width: 1000px; margin: 0 auto;}

/* --------------------------------------------------
	フッター
-------------------------------------------------- */
.footer {padding: 15px 15px 80px; border-top: 1px solid #c9dcf2;}
.footer_inner {max-width: 940px; margin: 0 auto;}
.footer_contact {margin-bottom: 20px;}
.footer_contact_ttl,
.footer_link_ttl {font-size: 1em; margin-bottom: 15px;}
.footer_contact p {font-size: 0.875em; line-height: 1.5; margin-bottom: 0.25em;}
.copyright {font-size: 0.75em; color: #666; line-height: 1.3;margin-top:20px;text-align:center;}

/* --------------------------------------------------
	ページトップ
-------------------------------------------------- */
.backToTop {position:fixed; right:15px; bottom:15px; width:45px; height:45px; cursor:pointer; z-index:90; transition: all 0.25s ease;}
.backToTop img:hover {opacity: 0.75; transition: all 0.25s ease;}

/* --------------------------------------------------
	トップページ
-------------------------------------------------- */
/* ページタイトル */
.top_ttl {font-size: 1.6875em; margin-bottom: 20px; text-align: center;}

/* メインビジュアル */
.mainVisual {margin-bottom: 40px;text-align:center;}
.mainVisual img {max-width:700px;}

/* スタートBOX */
.startBox {max-width: 940px; margin: 0 auto;}

/* ログインBOX */
.loginBox {background-color: rgba(255,255,255,0.65); padding: 30px 20px 12px; text-align: center; margin-bottom: 30px; box-shadow: 2px 2px 6px 0 rgba(0,0,0,0.3);}
.loginBox_ttl {font-size: 1em; margin-bottom: 15px; position: relative;}
.loginBox_ttl:before {content: ""; display: inline-block; width: 1.53em; height: 1.625em; background: url("../img/icon_user.png") no-repeat; background-size: contain; vertical-align: middle; margin-right: 0.5em;}
.loginBox_form input {margin-bottom: 15px;}
.login_btn {width: 140px; margin-top: 5px;}

/* 利用開始BOX */
.entryBox {background-color:  rgba(255,255,255,0.65);; padding: 29px 20px 34px; text-align: center; margin-bottom: 30px; box-shadow: 2px 2px 6px 0 rgba(0,0,0,0.3);}
.entryBox_ttl {font-size: 1em; margin-bottom: 15px; position: relative;}
.entryBox_ttl:before {content: ""; display: inline-block; width: 1em; height: 1.625em; background: url("../img/icon_beginner.png") no-repeat; background-size: contain; vertical-align: middle; margin-right: 0.5em;}
.entryBox_btn a {width: 220px; margin: 0 auto;}

/* 推奨環境BOX */
.cautionBox {max-width: 940px; margin: 0 auto;}
.cautionBox_ttl {font-size: 1em; padding-bottom: 10px; margin-bottom: 15px; border-bottom: 2px solid #5e97d8;}
.cautionBox p {font-size: 0.875em; margin-bottom: 0;}
.cautionBox ul {font-size: 0.875em; margin: 10px; list-style: disc;}
.cautionBox li {line-height: 1.35; margin-bottom: 10px; margin-left: 1em;}

/* お知らせ */
.newsBox {padding: 15px 15px 10px;background-color: rgb(255 255 255 / 0.65);box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.3);margin-bottom:20px;}
.newsBox_ttl {background-color: #f76a6a; margin-bottom: 20px;}
.newsBox_ttl h2 {font-size: 1.125em; color: #fff; text-align: center; line-height: 2.78em;}
.newsBox_item {padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #eaeaea; line-height: 1.5;}
.newsBox_item_date {color: #f76a6a;}
.newsBox_list dt {color: #F76A6A;line-height:1.5;}
.newsBox_list dd {
	border-bottom: solid 1px #EAEAEA;
	color: #333333;
	line-height:1.5;
	padding-bottom:15px;
	margin-bottom:15px;
}
.newsBox_list dd:last-child {margin-bottom:0;border:none;}

/* --------------------------------------------------
	下層ページ共通
-------------------------------------------------- */
/* ヘッダ */
.header {position: -webkit-sticky; position: sticky; top: 0; height: 50px; background-color: #fff; z-index: 100;}
.header.isFixed {background-color: rgba(255,255,255,0.95);box-shadow: 0 0 5px 0 rgba(0,0,0,0.15);}
.header_ttl {position: absolute; top: 50%; left: 15px; transform: translateY(-50%); font-size: 0.875em; margin-bottom: 0;}
.header_ttl a {color: #333;}
.header_ttl a:hover {color: #82b4ee;}
/*.header_ttl span {display: block;}*/
.header_ttl ul {display: table;}
.header_ttl ul li {display: table-cell;vertical-align: middle;}
.header_ttl ul li img {width:56px;}
.header_ttl ul li.system_ttl {display: table-cell;vertical-align: middle;padding: 0 110px 0 0;}
.header_ttl ul li.system_ttl p {line-height: 1.3em;margin: 0;}

/* ヘッダ マイページ・ログアウトボタン */
.header_nav {position: absolute; top: 0; right: 0; display: flex;}
.header_nav a {display: block; width: 50px; height: 50px; text-align: center;}
.header_nav a span {display: none;}
.header_nav_mypage a {background-color: #5e97d8;}
.header_nav_mypage a:hover {background-color: #82b4ee;}
.header_nav_mypage a img {width: 22px; position: relative; top: 50%; transform: translateY(-50%);}
.header_nav_logout a {background-color: #f76a6a;}
.header_nav_logout a:hover {background-color: #fd9191;}
.header_nav_logout a img {width: 42px; position: relative; top: 50%; transform: translateY(-50%);}

/* コンテンツ */
.col1Cont .contents_inner {background-color: #fff;}

/* ページタイトル */
.pageTtl {font-size: 1.25em; text-align: center; margin-bottom: 1em;}

/* --------------------------------------------------
	アカウント登録画面
-------------------------------------------------- */
.entryTtl {margin-bottom: 0.25em;}
.entryLead {font-size: 0.875em; text-align: center; margin-bottom: 15px;}

/* アカウント登録FORMテーブル */
.entryForm_tbl {width:100%;}
.entryForm_tbl tr {display:block; margin-bottom: 1em;}
.entryForm_tbl tr.noMargin {margin-bottom: 0;}
.entryForm_tbl th {display:block; background-color: #666; font-size: 1.125em; color: #fff; padding: 0.5em; margin-bottom: 1em;}
.entryForm_tbl td {display:block; padding:0.5em 1em;}

.entryForm_memnum_txt {font-size: 0.875em; color: #666; line-height: 1.5;}
.entryForm_input input {margin-bottom: 10px;}
.entryForm_contactPoint {margin-bottom: 10px;}
.entryForm_contactPoint label {margin-right: 20px;}
.privacyBox {border: 1px solid #999; padding: 20px; margin-bottom: 20px; height: 350px; overflow-y: auto;}
.privacyBox h3 {font-size: 1em; text-indent:-1.25em;padding-left:1.25em;}
.privacyAgree p {color: #e31919;}
.privacyBox ul {padding-left:1.25em;margin-bottom:10px;}
.privacyBox li {line-height:1.6;text-indent:-1.25em;padding-left:1.25em;}
.entryForm_btn {padding: 0 20px 30px;}
.entryForm_btn button {margin-bottom:10px;}

/* --------------------------------------------------
	e-Learning 受講お申込み
-------------------------------------------------- */
/* アカウント情報 アコーディオン */
.accontTrigger {margin-bottom: 20px; background-color: #5e97d8; color: #fff; font-size: 1.125em; font-weight: bold; line-height: 2.5; text-align: center; position: relative;}
.accontTrigger.open {margin-bottom: 0;}
.accontTrigger:after {content: ""; display: block; width: 15px; height: 8px; background-image: url("../img/icon_arrDown.png"); background-repeat: no-repeat; background-size: contain; position: absolute; top: 50%; right: 10px; transform: translateY(-50%);}
.accontTrigger.open:after {background-image: url("../img/icon_arrUp.png"); }
.accontInfo {margin: 0 auto 20px; background-color: #fff; padding: 15px 15px 20px;}
.accont_photo {width: 80px; height: 80px; padding: 15px; margin: 0 auto 20px; background-color: #c9dcf2; border-radius: 50%;}
.account_data {margin-bottom: 10px; line-height: 1.3;}
.account_data:after {content: ""; clear: both; display: block;}
.account_data dt {clear: both; float: left; font-weight: bold;}
.account_data dd {padding-left: 6em; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #e0e0e0;word-break: break-all;}
.account_data_unpaid {font-weight: bold;}
.paid {color:green;}
.no_paid {color:red;}
.account_edit_btn a {display: block;}

/* e-Learning お申し込み状況 */
.applyCont .mainCont {background-color: #fff;}

.apply_stats {margin-bottom: 30px;}
.apply_stats_ttl {background-color: #666; color: #fff; font-size: 1.125em; line-height: 2.22; text-align: center;}
.apply_stats_lead {font-size: 0.875em; text-align: center;}

.apply_paid {margin: 0 15px 15px; border: 1px solid #5e97d8; font-weight: bold;}
.pply_paid_ttl {font-size: 1em; background-color: #5e97d8; color: #fff; padding: 0.5em; margin-bottom: 0;}
.pply_paid_stats {background-color: #c9dcf2; text-align: right; font-size: 0.875em; padding: 0.7em;}
.pply_paid_stats img {width: 17px; margin-right: 0.2em;}
.pply_paid_stats span {vertical-align: middle;}

.apply_paid_list {font-size: 0.875em;}
.apply_semi {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding-bottom: 15px; margin: 15px 10px; border-bottom: 1px solid #dedede;}
.apply_semi_ttl {width: 100%;}
.apply_semi_idpw .linkBtn {width: 9em; font-size: 0.857em; font-weight: normal; line-height: 2;}
.apply_paid_total {background-color: #f3f9ff; border-top: 1px solid #5e97d8; margin-top: -16px; padding: 15px 10px;}
.apply_paid_total_payment {font-weight: normal; margin-bottom: 0.5em;}
.apply_paid_total_fee {text-align: right; margin-bottom: 0.5em;}
.apply_paid_total_receipt {text-align: right;}
.apply_paid_total_receipt .linkBtn,
.apply_paid_total_receipt .linkBtn_Redm,
.apply_paid_total_receipt .linkBtn_Disabled,
.apply_paid_total_receipt .linkBtn_AdminDisabled {font-size: 1em; width: 7em; line-height: 2;}

.apply_nopay {margin: 0 15px; border: 1px solid #f76a6a; font-weight: bold;}
.apply_nopay_ttl {font-size: 1em; background-color: #f76a6a; color: #fff; padding: 0.5em; margin-bottom: 0;}
.apply_nopay_stats {background-color: #fdc3c3; text-align: right; font-size: 0.875em; padding: 0.7em;}
.apply_nopay_stats img {width: 18px; margin-right: 0.2em;}
.apply_nopay_stats span {vertical-align: middle;}
.apply_nopay_total_fee {color: #f76a6a;}
.apply_nopay_total_fee img {width: 18px; margin-right: 0.2em;}
.apply_nopay_total_fee span {vertical-align: middle;}
.apply_nopay_list {font-size: 0.875em;}
.apply_nopay_list .apply_semi {display: block;}
.apply_nopay_list .apply_semi_fee {text-align: right;}

.apply_nopay_total {display: flex; flex-wrap: wrap; justify-content: space-between; background-color: #fff5f5; border-top: 1px solid #f76a6a; margin-top: -16px; padding: 15px 10px;}
.apply_nopay_total_payment {font-weight: normal; line-height: 1.8;}

.apply_add_ttl {background-color: #666; color: #fff; font-size: 1.125em; line-height: 2.22; text-align: center; margin-bottom: 0;}
.apply_add_btn {padding: 30px; max-width: 320px; margin: 0 auto;}


/* --------------------------------------------------
	 ID・PW モーダル
-------------------------------------------------- */
/* モーダル表示時の背景 */
#modal-overlay {position: fixed; top: 0; left: 0; z-index: 950; display: none; width: 100%; height: 100%; background:rgba(0, 0, 0, 0.9);}

/* モーダルターゲット */
.modal-content {display:none; position:fixed; background-color:#fff; width:92%; max-width:600px; z-index:1000;}
.idpw_header {display: flex; justify-content: space-between; background-color: #5e97d8; position: relative;}
.idpw_header h2 {width: calc(100% - 40px); font-size: 1em; color: #fff; padding: 0.6em; margin-bottom: 0;}

/* モーダルを閉じるボタン */
.close_modal {position:absolute; top: 0; right: 0; width:40px; height:100%; background-color: #175dad; cursor:pointer;}
.close_modal .close_btn {display:block; position:absolute; top:19px; left:5px; width:30px; height:1px; background-color:#fff; transform: rotate(45deg);}
.close_modal .close_btn:after {content:""; display:block; width:100%; height:100%; background-color:inherit; transform: rotate(90deg);}
.idpw_data dt {background-color: #d7e7f9; padding: 0.5em;}
.idpw_data dd {padding: 0.75em 0.5em; line-height: 1.3; word-break: break-all;}
.idpw_data dd a {text-decoration: underline;}
.alert_box {display: flex; flex-wrap: wrap; align-items: center; padding: 20px;font-size: 1em;padding:20px;}

/*領収書*/
.recipt_generate {margin:0 auto;margin-bottom:30px;width:15em;}
.recipt_generate .linkBtn {
	width: 100%;
	line-height: 2.25;
	padding: 0;
	font-size: 1.125em;
}
.reciept_data {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding: 20px 20px 0;
	font-size: 1em;
}
.reciept_data dt {
	width: 150px;
	padding: 0.5em 0;
	line-height: 1.3;
	text-align: center;
	margin-bottom: 5px;
}
.reciept_data dd {
	width: calc(100% - 150px);
	padding: 0.5em 0 0.5em 1em;
	margin-bottom: 5px;
	line-height: 1.3;
}
.reciept_data dt {background-color: #d7e7f9; padding: 0.5em;}
.reciept_data dd {padding: 0.75em 0.5em; line-height: 1.3; word-break: break-all;}
.reciept_data dd a {text-decoration: underline;}
.reciept_data input[type="text"] {
	padding: 0.5em;line-height: 1;
}
.receipt_count {color:red;}

/*
 * Component: Timeline
 * -------------------
 */
.timeline {
  position: relative;
  margin: 0 0 30px 0;
  padding: 0;
  list-style: none;
}
.timeline:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #ddd;
  left: 31px;
  margin: 0;
  border-radius: 2px;
}
.timeline > li {
  position: relative;
  margin-right: 10px;
  margin-bottom: 15px;
}
.timeline > li:before,
.timeline > li:after {
  content: " ";
  display: table;
}
.timeline > li:after {
  clear: both;
}
.timeline > li > .timeline-item {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  margin-top: 0;
  background: #fff;
  color: #444;
  margin-left: 60px;
  margin-right: 15px;
  padding: 0;
  position: relative;
}
.timeline > li > .timeline-item > .time {
  color: #999;
  float: right;
  padding: 10px;
  font-size: 12px;
}
.timeline > li > .timeline-item > .timeline-header {
  margin: 0;
  color: #555;
  border-bottom: 1px solid #f4f4f4;
  padding: 10px;
  font-size: 16px;
  line-height: 1.1;
}
.timeline > li > .timeline-item > .timeline-header > a {
  font-weight: 600;
}
.timeline > li > .timeline-item > .timeline-body,
.timeline > li > .timeline-item > .timeline-footer {
  padding: 10px;
}
.timeline > li > .fa,
.timeline > li > .glyphicon,
.timeline > li > .ion {
  width: 30px;
  height: 30px;
  font-size: 15px;
  line-height: 30px;
  position: absolute;
  color: #666;
  background: #c9dcf2;
  border-radius: 50%;
  text-align: center;
  left: 18px;
  top: 0;
}
.timeline > .time-label > span  {
    font-weight: 600;
    padding: 7px;
    display: inline-block;
    background-color: #5e97d8;
    border-radius: 4px;
    color: #fff;
}
.timeline-inverse > li > .timeline-item {
  background: #f0f0f0;
  border: 1px solid #ddd;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.timeline-inverse > li > .timeline-item > .timeline-header {
  border-bottom-color: #ddd;
}
.fa {
 display:inline-block;
 font:normal normal normal 14px/1 FontAwesome;
 font-size:inherit;
 text-rendering:auto;
 -webkit-font-smoothing:antialiased;
 -moz-osx-font-smoothing:grayscale
}




/* --------------------------------------------------
	 768px〜　タブレット
-------------------------------------------------- */
@media print, screen and (min-width : 768px) {
/* --------------------------------------------------
	コンテンツ
-------------------------------------------------- */
.contents {padding: 30px;}

/* --------------------------------------------------
	フッター
-------------------------------------------------- */
.footer {padding: 30px; border-top: 1px solid #c9dcf2;}


/* --------------------------------------------------
	ページトップ
-------------------------------------------------- */
.backToTop {width:60px; height:60px; right: 20px; bottom: 20px;}

/* --------------------------------------------------
	トップページ
-------------------------------------------------- */
/* ページタイトル */
.top_ttl {font-size: 2.5em; margin-top: 30px; margin-bottom: 40px;}

/* スタートBOX */
.startBox {display: flex; justify-content: space-between; align-items: stretch; margin-bottom: 40px;}

/* ログインBOX */
.loginBox {width: 62%; margin: 0; text-align: left;}
.loginBox_form {display: flex; justify-content: space-between; align-items: center;}
.loginBox_form input {width: 35%; margin-bottom: 0;}
.login_btn {width: 24.5%; margin-top: 0; margin-left: 10px;}

/* 利用開始BOX */
.entryBox {width: 36%; margin: 0;}
.entryBox_btn a {width: 100%; margin: 0;}

/* 推奨環境BOX */
.cautionBox {max-width: 940px; margin: 0 auto;}

/* お知らせ */
.newsBox {display: flex; justify-content: space-between; max-width: 940px; padding: 40px 30px; margin: 20px auto;}
.newsBox_ttl {width: 150px; margin-bottom: 0; display: flex; align-items: center;}
.newsBox_ttl h2 {width: 100%;}
.newsBox_list {width: calc(100% - 170px);}
.newsBox_item {display: flex;}
.newsBox_item:last-child {margin-bottom: 0;}
.newsBox_item_date {width: 8em;}
.newsBox_item_post {width: calc(100% - 8em);}
.newsBox_list dl {position:relative;}
.newsBox_list dt {position: absolute;left: 0;width: 8em;}
.newsBox_list dd {padding-left: 8em;}
.newsBox_list dd:last-child {border-bottom: solid 1px #EAEAEA;}

/* --------------------------------------------------
	下層ページ共通
-------------------------------------------------- */
/* ヘッダ */
.header {height: 60px;}
.header_ttl {left: 30px; font-size: 1.25em;}
.header_ttl span {display: inline; margin-left: 1em;}

/* ヘッダ マイページ・ログアウトボタン */
.header_nav a {width: 60px; height: 60px;}

/* コンテンツ */
.col1Cont .contents_inner {padding: 20px;}


/* ページタイトル */
.pageTtl {font-size: 1.5em; margin-bottom: 1.5em;}

/* --------------------------------------------------
	アカウント登録画面
-------------------------------------------------- */
.entryLead {font-size: 1em; margin-bottom: 30px;}

/* アカウント登録FORMテーブル */
.entryForm tr {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.entryForm td {padding: 0; margin-bottom: 20px;}
.entryForm_header {width: 100%;}
.entryForm_item {width: 240px; text-align: right;}
.entryForm_input {width: calc(100% - 260px);}
.entryForm_input input {margin-bottom: 0; margin-right: 10px;}
.entryForm_input input:last-child {margin-right: 0;}

.entryForm_memnum {display: flex !important; align-items: center;}
.entryForm_memnum input {width: auto; margin-right: 10px;}
.entryForm_name input {width: calc(50% - 5px);}

.entryForm_btn {text-align: center;}
.entryForm_btn button {width: 300px;}

/* --------------------------------------------------
	リマインダ画面
-------------------------------------------------- */
.entryLead {font-size: 1em; margin-bottom: 30px;}

/* リマインダFORMテーブル */
.entryForm tr {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.entryForm td {padding: 0; margin-bottom: 20px;}
.entryForm_header {width: 100%;}
.entryForm_re_item {width: 175px; text-align: right;}
.entryForm_input {width: calc(100% - 260px);}
.entryForm_input input {margin-bottom: 0; margin-right: 10px;}
.entryForm_input input:last-child {margin-right: 0;}

.entryForm_memnum {display: flex !important; align-items: center;}
.entryForm_memnum input {width: auto; margin-right: 10px;}
.entryForm_name input {width: calc(50% - 5px);}

.entryForm_btn {display:flex;justify-content:space-around;flex-direction:row-reverse;}
.entryForm_btn {/*margin-top: 10px; */text-align: center;}
.entryForm_btn button {width: 45%;}

/* --------------------------------------------------
	e-Learning 受講お申込み
-------------------------------------------------- */
/* ２カラムレイアウト */
.col2Cont .contents_inner:after {content: ""; clear: both; display: block;}
.col2Cont .sideCont {width: 40%; max-width: 360px; float: left; position: -webkit-sticky; position: sticky; top: 90px;}
.col2Cont .mainCont {width: 56%; max-width: 600px; float: right;}

/* アカウント情報 アコーディオン */
.accontTrigger {display: none;}
.accontInfo {display: block !important; margin: 0; padding: 20px 20px 30px;}

/* e-Learning お申し込み状況 */
.applyCont .mainCont {background-color: #fff;}

.apply_stats_ttl {font-size: 1.25em; line-height: 3;}
.apply_stats_lead {font-size: 1em;}

.apply_paid, .apply_start {margin: 0 20px 20px;}
.pply_paid_ttl {padding: 0.9em;}
.pply_paid_stats {font-size: 1em;}
.pply_paid_stats img {width: 22px;}

.apply_paid_list {font-size: 1em;}
.apply_semi, .apply_box {padding-bottom: 20px; margin: 20px 20px;}
.apply_semi_idpw .linkBtn {font-size: 0.875em;}
.apply_paid_total {margin-top: -21px; padding: 20px;}
.apply_paid_total_payment {margin-bottom: 0.7em;}
.apply_paid_total_fee {margin-bottom: 0.7em;}

.apply_nopay {margin: 0 20px;}
.apply_nopay_ttl {padding: 0.9em;}
.apply_nopay_stats {font-size: 1em;}
.apply_nopay_stats img {width: 24px;}
.apply_nopay_total_fee img {width: 24px;}
.apply_nopay_list {font-size: 1em;}

.apply_nopay_total {margin-top: -21px; padding: 20px;}

.apply_add_ttl {background-color: #666; color: #fff; font-size: 1.125em; line-height: 2.22; text-align: center; margin-bottom: 0;}
.apply_add_btn {padding: 30px;}

.red {color: #e31919;}
 input.disable + label:before {background-color:#ccc !important; cursor: pointer;}
 
/* --------------------------------------------------
	 ID・PW モーダル
-------------------------------------------------- */
/* モーダルターゲット */
.idpw_header h2 {width: calc(100% - 50px); font-size: 1.125em; padding:0.73em; text-align: center;}

/* モーダルを閉じるボタン */
.close_modal {width:50px;}
.close_modal .close_btn {top:23px; left: 11px}
.idpw_data {display: flex; flex-wrap: wrap; align-items: center; padding: 20px;font-size: 1em;}
.idpw_data dt {width: 150px; padding: 0.5em 0; line-height: 1.3; text-align: center; margin-bottom: 5px;}
.idpw_data dd {width: calc(100% - 150px); padding: 0.5em 0 0.5em 1em; margin-bottom: 5px; line-height: 1.3;}


}





/* --------------------------------------------------
	 1024px〜　タブレット・PC
-------------------------------------------------- */
@media print, screen and (min-width : 1024px) {

/* --------------------------------------------------
	フッター
-------------------------------------------------- */
.footer {padding: 30px 60px;}
.footer_inner {display: flex; justify-content: space-between; /*align-items: flex-end;*/}
.footer_contact {margin-bottom: 0;}


/* --------------------------------------------------
	ページトップ
-------------------------------------------------- */
.backToTop.isBottom {bottom: 60px;}

/* --------------------------------------------------
	トップページ
-------------------------------------------------- */

/* ログインBOX */
.loginBox {width: 67%;}
.loginBox_form {display: flex; justify-content: space-between; align-items: center;}
.loginBox_form input {width: 35%; margin-bottom: 0;}
.login_btn {width: 24.5%; margin-top: 0; margin-left: 10px;}

/* 利用開始BOX */
.entryBox {width: 30%;}

/* --------------------------------------------------
	下層ページ共通
-------------------------------------------------- */
/* コンテンツ */
.col1Cont .contents_inner {padding: 20px 50px;}

/* --------------------------------------------------
	アカウント登録画面
-------------------------------------------------- */
/* アカウント登録FORMテーブル */
.entryForm tr {display: table-row; margin-bottom: 0; border-top: 1px solid #ccc;}
.entryForm tr.noBorder {border-top: none;}
.entryForm th, .entryForm td {display: table-cell; margin-bottom: 0; padding: 30px 0;}
.entryForm .noMargin th, .entryForm .noMargin td {padding-bottom: 0;}
.entryForm td {vertical-align: middle;}
.entryForm th {color: #333; background-color: transparent; white-space: nowrap; padding-top: calc(30px + 0.75em); text-align: left; vertical-align: top;}
.entryForm_header {width: auto;}
.entryForm_item {width: auto; text-align: right; padding-right: 15px !important; white-space: nowrap;}
.entryForm_input {width: auto;}
.entryForm_name input {width: 150px;}
.entryForm_name2 input {width: 95px;}

.entryForm_header.contact {padding-top: calc(30px + 0.25em);}
.entryForm_memnum input {width: 260px;} 
.privacyBox, .privacyAgree {margin-left: 40px;}

/* --------------------------------------------------
	リマインダ
-------------------------------------------------- */
/* リマインダFORMテーブル */
.entryForm_re tr {display: table-row; margin-bottom: 0; border-top: 1px solid #ccc;}
.entryForm_re tr.noBorder {border-top: none;}
.entryForm_re th, .entryForm td {display: table-cell; margin-bottom: 0; padding: 30px 0;}
.entryForm_re .noMargin th, .entryForm .noMargin td {padding-bottom: 0;}
.entryForm_re td {vertical-align: middle;}
.entryForm_re th {color: #333; background-color: transparent; white-space: nowrap; padding-top: calc(30px + 0.75em); text-align: left; vertical-align: top;}
.entryForm_re_header {width: auto;}
.entryForm_re_item {width: 175px; text-align: right; padding-right: 15px !important; white-space: nowrap;}
.entryForm_re_input {width: auto;}
.entryForm_re_name input {width: 150px;}
.entryForm_re_header.contact {padding-top: calc(30px + 0.25em);}
.entryForm_re_memnum input {width: 260px;} 
.privacyBox, .privacyAgree {margin-left: 40px;}

}



/* リンクボタン+キャンセル */
.linkBtn.cancel {background-color:#ea1111;font-weight:bold;}
.linkBtn.cancel:hover {background-color: #EB6A6A; color: #fff;}

form .linkBtn.cancel{
	display:block;
	width:280px;
	margin:0 auto;
	font-size:1.1em;
	padding:15px 10px;
	line-height:1;	
}
.idpw_header.cancel {background-color: #F76A6A;}
.idpw_header.cancel .close_modal {background-color: #B54E4E;}
.idpw_data.cancel dt {background-color: #FDC3C3;}
.idpw_data.cancel {display:table}
.idpw_data.cancel dt,.idpw_data.cancel dd{display:table-cell}
.idpw_data.cancel {font-weight:bold;}

.visa{
	background:url('../img/card_visa_std.gif');
	background-repeat: no-repeat;
	background-position: center center;
	width: 50px;
	height: 50px;
	display:table-cell;
	margin-right: 10px;
}
.master{
	background:url('../img/card_master_std.gif');
	background-repeat: no-repeat;
	background-position: center center;
	width: 50px;
	height: 50px;
	display:table-cell;
	margin-right: 10px;
}
.jcb{
	background:url('../img/card_jcb_std.gif');
	background-repeat: no-repeat;
	background-position: center center;
	width: 50px;
	height: 50px;
	display:table-cell;
	margin-right: 10px;
}
.amex{
	background:url('../img/card_amex_std.gif');
	background-repeat: no-repeat;
	background-position: center center;
	width: 50px;
	height: 50px;
	display:table-cell;
	margin-right: 5px;
}
.dinners{
	background:url('../img/card_diners_std.gif');
	background-repeat: no-repeat;
	background-position: center center;
	width: 60px;
	height: 50px;
	display:table-cell;
}




.pay_semi_fee {
  margin-left: auto;
  margin-bottom: 0.5em;
}
.pay_method {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: center;
  padding: 20px;
  margin: 10px 30px;
  border-bottom: 1px solid #dedede;
}
.pay_offlinebank {
  padding: 20px 5px;
  margin-bottom: 15px;
}
.pay_bank {
  padding: 10px 15px 0 15px;
  margin: 20px 8px;
  border-top: 1px solid #dedede;
  border-bottom: 1px solid #dedede;
}
.pay_bankaccount dt {
  clear: both;
  float: left;
  font-weight: bold;
  padding-left: 10px;
}
.pay_bankaccount dd {
  padding-left: 6em;
  padding-bottom: 10px;
}
.pay_alart {
  font-weight: normal;
}

#bank hr {
	display:block;
	margin:1em 0;
	border:none;
	border-bottom:1px solid #dedede;
}
.apply_semi_table {display:table;}
.apply_semi_checkbox {display:table-cell;margin:0 10px 0 0;}
.apply_semi_table .apply_semi_ttl{display:table-cell; width:100%;}
.apply_semi_table .apply_semi_fee{display:table-cell;white-space:nowrap;}
.select_pay_method {padding:25px 0 0 25px;}
.select_pay_method input[type="radio"] + label:after {content:'　　';}
#bank {width:100%;}
#bank.pay_offlinebank {margin-bottom:0;padding:20px 5px 0;}
#pay_btn .apply_add_btn {padding-top:0;}

.apply_cancel{text-align:center; padding:15px 0;}
.apply_cancel .linkBtn_Red {font-size: 1em; width: 7em; line-height: 2;}
.paid_cancel{border-top:1px solid #5e97d8;}
.nopay_cancel {border-top:1px solid #f76a6a;}
#about_code {width:100%;margin:0;border-top:none}
#about_code td {flex-basis:100%;margin:0;padding:8px 0 0;}
#about_code td p {margin:0;font-size:0.9em;text-align:right;}
.law_box {margin: 10px 20px 0;}
.law_box p{margin:0;width:100%;text-align:right;}

.semi_memo{display:inline-block;margin:10px 0 0;font-size:13px;font-weight:normal;}
.apply_alert{margin-top:10px;line-height:1.3;color:red;font-weight:bold;}
.apply_alert a {color:red;text-decoration:underline;}
.apply_alert a:hover {color:blue;}

/* --------------------------------------------------
	メンテナンスモード表示
-------------------------------------------------- */
.maintenanceBox{text-align:center;width:100%;padding: 30px 20px 20px;border:1px solid red;color:red;margin-bottom:30px;background-color:rgba(255,255,255,0.5)}
.maintenanceTitle{margin-bottom:10px;text-align:center;font-size:14pt;}
.maintenanceBox p {margin-bottom:0;text-align:center;font-weight:bold;font-size:11pt;line-height:1.4;}
@media print, screen and (min-width : 768px) {
	.maintenanceBox{margin-bottom:0;}
	.maintenanceTitle{font-size:17pt;}
	.maintenanceBox p{font-size:12pt;}
}

/* --------------------------------------------------
	管理者モードでマイページログイン中の表示
-------------------------------------------------- */
.adminLogin{padding-right:10px;line-height:60px;color:#F76A6A;font-weight:bold;}
.blinking{
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
	-moz-animation:blink 1.5s ease-in-out infinite alternate;
	animation:blink 1.5s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{0% {opacity:0;}100% {opacity:1;}}
@-moz-keyframes blink{0% {opacity:0;}100% {opacity:1;}}
@keyframes blink{0% {opacity:0;}100% {opacity:1;}}
/* --------------------------------------------------
	formバリデーション関連
-------------------------------------------------- */
input.form-error {
	border:1px solid #a00;
}
div.error-message {
	clear:both;
	color:#a00;
	box-sizing:border-box;
	width:100%;
	margin:5px 0;
}