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

@import url('https://fonts.cdnfonts.com/css/fugaz-one');


/* 青い帯
=========================================================== */
#BackGround	{ width: 556px; margin: 0 0 0 0px; float: left; }
#BackGround h2	{ color: #fff; font-size: 1.2em; font-weight: bold; background-color: #1067ba; padding: 5px; text-align: center; }
#BackGround h3	{ color: #fff; font-size: 1.2em; font-weight: bold; background-color: #1067ba; padding: 5px; text-align: center; }


/* 人財育成担当者様のボタンのロールオーバー
=========================================================== */

.button01 { background: url("/service/i/shinjin_ico.jpg""/service/i/shinjin_ico.jpg") no-repeat; /* ロールオーバー時のチラつき防止 */}
.button01 a { width: 125px; height: 125px; background: url("/service/i/shinjin_ico.jpg") no-repeat; display: block; text-indent: -9999px; margin: 0 auto; }
.button01 a:hover { background-image: url("/service/i/shinjin_ico_over.jpg");}

.button02 { background: url("/service/i/shinjin_ico.jpg""/service/i/kensyu_ico.jpg") no-repeat; /* ロールオーバー時のチラつき防止 */}
.button02 a { width: 125px; height: 125px; background: url("/service/i/kensyu_ico.jpg") no-repeat; display: block; text-indent: -9999px; margin: 0 auto; }
.button02 a:hover { background-image: url("/service/i/kensyu_ico_over.jpg");}

.button03 { background: url("/service/i/shinjin_ico.jpg""/service/i/jyosei_ico.jpg") no-repeat; /* ロールオーバー時のチラつき防止 */}
.button03 a { width: 125px; height: 125px; background: url("/service/i/jyosei_ico.jpg") no-repeat; display: block; text-indent: -9999px; margin: 0 auto; }
.button03 a:hover { background-image: url("/service/i/jyosei_ico_over.jpg");}

/* 境界線
=========================================================== */
p.border01 { border-bottom: 1px solid #959595; }

/* 境界線（点線）
========================================================== */
p.border02 { border-bottom: 1px dotted #959595; }

/* フロート（レスポンシブで縦ならび）//location/index.html
=========================================================== */
.float_right{ float: right; padding: 0px 0px 20px 20px;}
.float_left{ float: left; padding: 20px;}

img.float_left{ float: left; }
img.float_right { float: right; }

.responsiveimg:after {
  content: "";
  clear: both;
  display: block;
}
.boxbox{
  float: right; padding: 0px 0px 20px 20px;
}
@media(max-width: 768px) {
  .boxbox{
    float: none;
  }
}



/* 写真の枠とドロップシャドウ
=========================================================== */
.shotaro{ -moz-box-shadow: 1px 1px 1px 1px #CCC; -webkit-box-shadow: 1px 1px 1px 1px #CCC; box-shadow: 1px 1px 1px 1px #CCC; background-color: #FFF; padding: 10px; margin: 5px; }
.shotaro_s{ -moz-box-shadow: 1px 1px 2px 2px #CCC; -webkit-box-shadow: 1px 1px 2px 2px #CCC; box-shadow: 1px 1px 2px 2px #CCC; background-color: #FFF; padding: 7px; margin: 7px; }

.frame img { border-radius: 10px;}

/* センタリング
=========================================================== */
.M_center{ padding: 20px 0; text-align: center; }

/* PROGで使用　テーブル　1
=========================================================== */
table.kazuo01 { width: 100%; border-collapse: separate; border-spacing: 1px; line-height: 1.5; }
table.kazuo01 thead th { padding: 5px 5px; text-align: center; font-weight: bold; vertical-align: middle; color: #fff; background: #036; }
table.kazuo01 tbody th { padding: 5px 5px; vertical-align: middle; text-align: center; border-bottom: 1px solid #ccc; background: #eee; }	
table.kazuo01 td { padding: 5px 5px; text-align: left; vertical-align: middle; border-bottom: 1px solid #ccc; background: #eee; }

/* PROGで使用　テーブル　2
=========================================================== */

table.kazuo02 { width: 100%; margin: 5px 0px 10px; border-collapse: collapse; }
table.kazuo02 thead th { padding: 5px 5px; text-align: center; font-weight: bold; vertical-align: middle; color: #fff; border: 1px solid #352e2b; }
table.kazuo02 tbody th { padding: 5px 5px; vertical-align: middle; text-align: center; border: 1px solid #352e2b; }
table.kazuo02 td { padding: 5px 5px; text-align: left; vertical-align: middle; border: 1px solid #352e2b; }

/* 強いチームで使用　テーブル　3
=========================================================== */
table.kazuo03 { width: 100%; border-collapse: separate; border-spacing: 1px; line-height: 1.5; }
table.kazuo03 thead th { padding: 5px 5px; text-align: center; font-weight: bold; vertical-align: middle; color: #fff; background: #7d7d7d; }
table.kazuo03 tbody th { padding: 5px 5px; vertical-align: middle; text-align: center; border-bottom: 1px solid #ccc; }	
table.kazuo03 td { padding: 5px 5px; text-align: left; vertical-align: middle; border-bottom: 1px solid #ccc;}
table.kazuo03 .first { background: #dde6f1; }
table.kazuo03 .second {	background: #eeeeee; }

/* アセスメントツールで使用
=========================================================== */

table.kazuo04 { border-collapse: separate; border-spacing: 0; text-align: left; line-height: 1; border-top: 1px solid #ccc; border-left: 1px solid #ccc; }
table.kazuo04 th { width: 80px; padding: 2px; font-weight: bold; text-align: center; vertical-align: middle; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; border-top: 1px solid #fff; border-left: 1px solid #fff; background: #deecf6; }
table.kazuo04 td { width: 476px; padding: 2px 2px 2px 10px; vertical-align: top; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; line-height: 1.5em; }


/* アサーティブ・コミュニケーション　フォント
=========================================================== */
p.example01 { font-size: 120%; color: #7B0C0D; text-align: center; }
p.example02 { text-align: right; }


/* PROG　出典フォント
=========================================================== */
.example03 { font-size: 90%; text-align: right; }


/* analytics　ポップアップ
=========================================================== */
a.analytics:hover { position: relative; text-decoration: none; }
a.analytics span { display: none; position: absolute; top: 1em; left: 0; }
a.analytics:hover span { border: none; display: block; z-index: 2; }

a:hover img.noClear { opacity: 1; -webkit-opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); /* IE lt 8 / -ms-filter: "alpha(opacity=100)"; / IE 8 */}

/* セミナーレポート　写真を並べる
=========================================================== */
.box_ak { float: left; }


.boxContainer_ak { overflow: hidden; }

/* clearfix */ 
.boxContainer_ak:before,
.boxContainer_ak:after { content: ""; display: table; }
.boxContainer_ak:after { clear: both; }
 
/* For IE 6/7 (trigger hasLayout) */
.boxContainer_ak { zoom: 1; }

/* セミナーレポート　飾り文字
=========================================================== */
.tetsu_ora { font-size: 1.2em; font-weight: bold; color: #cc6600; text-shadow: 1px 2px 0px #dcdcdc; }
.tetsu_bla { font-size: 1.2em; font-weight: bold; color: #313131; text-shadow: 1px 2px 0px #dcdcdc; }


/* セミナーレポート　リンクボタン下のマージン
=========================================================== */
img.report { margin: 0px 0px 3px 0px; }


/* コラムのページ
=========================================================== */

/*----------------------------------------------------
　グローバルナビゲーション
----------------------------------------------------*/
.columnGlobalNav {  list-style: none; overflow: hidden; }
.columnGlobalNav li { float: left; border-right: 1px solid #DDD; }
.columnGlobalNav li a { display: block; padding: 10px 15px; text-align: center; text-decoration: none; color: #7d7d7d; }
.columnGlobalNav li a:hover { background: #EEE; }

/*----------------------------------------------------
　日付
----------------------------------------------------*/
.column_date { font-size: 0.8em; font-weight:bold; text-align: right; color: #F4B637; font-family: "メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif; ; padding: 17px 0 0 0; }
.column_date2 { float: right; font-size: 0.8em; font-weight:bold; text-align: right; color: #F4B637; font-family: "メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif; ; padding: 3px 0 0 0; }
.column_date_fb { padding: 5px 0px 0px 0px; font-weight:bold; text-align: right; color: #F4B637; font-family: "メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif; }
.column_left{ float: left; margin: 0 20px 10px 5px; }

/*----------------------------------------------------
　タイトル
----------------------------------------------------*/
.column_titlemain { float:left; font-size: 1.5em; font-weight: bold; color: #323232; text-shadow: 1px 2px 0px #dcdcdc; padding: 12px 0px 5px 0px; text-decoration: none; }
.column_title { font-size: 1.1em; font-weight: bold; color: #323232; text-shadow: 1px 2px 0px #dcdcdc; padding: 0px 0px 5px 0px; text-decoration: none; }
.column_list_title { font-size: 1em; font-weight: bold; color: #323232; padding: 0px 3px; text-decoration: none; }

a.underline_black { color: #323232; }

/*----------------------------------------------------
　ページの基本設計
----------------------------------------------------*/
#columnMain	{ font-size: 1.1em; width: 748px; margin: 0 0 0 20px; float: left; display: inline;}
#columnRight	{ font-size: 1.1em; width: 250px; margin: 0 0 0 20px; float: left; display: inline;}
#columnRight ul li { display: inline-block; margin: 0 0 1.5em 0.3px ; padding: 0; }

#columnMain h1	{ font-size: 1.6em; font-weight: bolder; margin-bottom: 0px; padding-bottom: 0px; }
#columnMain h2	{ font-size: 2.3em; font-weight: bold; line-height: 1.3em; padding: 0 0 10px; }
hr.column1{ border-top: 1px solid #c9c9c9; margin:8px 0px 5px 0px; }
hr.column2{ border-top: 1px solid #c9c9c9; margin:10px 0px 5px 0px; }
hr.column3{ border-top: 1px dashed #8c8b8b; }
hr.column4{ border-top: 2px solid #919191; margin:2px 0px 5px 0px; }

p.contents01 {margin: 0 0 40px 0;}
p.contents02 { margin: 0 0 15px 0; }
p.contents03 { margin: 1em 0 ; }
p.contents04 {margin: 5px 0 0 0;}
p.contents05 { margin: 0 0 25px 0; }
p.contents06 {margin: 1px 0 0 0;}
p.contents07 {margin: 0 0 10px 0;}
p.contents08 {margin: 0 0 30px 0;}
p.contents09 {margin: 0 0 1px 0;}

.author01 {margin: 10px 0 7px 0; color: #494949;/*文字色*/ }
.author02 {margin: 0 0 10px 0; color:#7d7d7d;}
.author03 {margin: 60px 0 7px 0; color: #494949;/*文字色*/ }

.redBorder { font-size: 1.2em; line-height: 1.3; font-weight: bold; text-shadow: 1px 1px 1px #fff; background: url(/images/common/redborder.jpg) left top no-repeat; padding: 0 0 0 1.2em; }
.red2Border { font-size: 1.2em; line-height: 1.3; font-weight: bold; text-shadow: 1px 1px 1px #fff; background: url(/images/common/red2border.jpg) left top no-repeat; padding: 0 0 0 1.2em; }
.blueBorder { font-size: 1.2em; line-height: 1.3; font-weight: bold; text-shadow: 1px 1px 1px #fff; background: url(/images/common/blueborder.jpg) left top no-repeat; padding: 0 0 0 1.2em; }
.yellowBorder { font-size: 1.2em; line-height: 1.3; font-weight: bold; text-shadow: 1px 1px 1px #fff; background: url(/images/common/yellowborder.jpg) left top no-repeat; padding: 0 0 0 1.2em; }
.greenBorder { font-size: 1.2em; line-height: 1.3; font-weight: bold; text-shadow: 1px 1px 1px #fff; background: url(/images/common/greenborder.jpg) left top no-repeat; padding: 0 0 0 1.2em; }

.pinkBorder { font-size: 1.2em; line-height: 1.3; font-weight: bold; text-shadow: 1px 1px 1px #fff; background: url(/images/common/pinkborder.jpg) left top no-repeat; padding: 0 0 0 1.2em; }
.column_subtitle { font-size: 16px; line-height: 2; font-weight: bold; text-shadow: 1px 1px 1px #fff; padding: 5 0 0 0px; }
.defaultlist
.defaultlist li{ padding:0px; margin:0px; font-weight: bold; }
.defaultlist li{ list-style-type:none !important; list-style-image:none !important; margin: 5px 0px 5px 0px !important; }
.list7 li{ position:relative; display: block; padding: 5px 0px 5px 30px; background: #ccc; color: #444; border-radius:15px 0px 0px 15px; }
.list7 li:after{ content:''; display:block;  position:absolute; width:14px; height: 14px; top:9px; left:5px; background: #fff; border-radius: 10px; }

img.columnpic_small { width: 150px; height: 64px; float: left; margin: 5px 20px 10px 5px;  }
img.authorPic { border-radius: 50%;  /* 角丸半径を50%にする(=円形にする) */ width:  120px;       /* ※縦横を同値に */ height: 120px;       /* ※縦横を同値に */  margin: 15px 15px 5px 5px; vertical-align: middle;}
.clearleft{ clear: both;}

.right01{ background:FFF; padding:10px; width:250px; margin-bottom:40px; clear:both; border: 1px solid #BBB3B3;}
.right01 h4{ text-align: center;}
/*----------------------------------------------------
　デザインリスト
----------------------------------------------------*/
ol.column-list{ counter-reset:number; /*数字をリセット*/ list-style-type: none!important; /*数字を一旦消す*/ padding:0.5em; }
ol.column-list li{ position: relative; padding-left: 35px; line-height: 1.7em; padding: 0em 0.5em 0.5em 35px; }

ol.column-list li:before{ /* 以下数字をつける */ position: absolute; counter-increment: number; content: counter(number); /*以下数字のデザイン変える*/
  display:inline-block; background: #959595; color: white; font-family: 'Avenir','Arial Black','Arial',sans-serif; font-weight:bold; font-size: 15px; border-radius: 50%; left: 0; width: 25px; height: 25px; line-height: 25px; text-align:center; }

/*----------------------------------------------------
　回想の囲み
----------------------------------------------------*/
.box_column01 { position: relative; margin: 2em 0 2em 40px; padding: 8px 15px; background: #e5e5e5; border-radius: 20px; }
.box_column01:before{font-family: FontAwesome; content: "\f111"; position: absolute; font-size: 15px; left: -40px; bottom: 0; color: #e5e5e5; }
.box_column01:after{ font-family: FontAwesome; content: "\f111"; position: absolute; font-size: 23px; left: -23px; bottom: 0; color: #e5e5e5; }
.box_column01 p { margin: 0; padding: 10px; }

/*----------------------------------------------------
　Font Awesome関連
----------------------------------------------------*/
.columnCategory { position: relative;  color: 000; background: #e2a12f; padding: 0.5em 1em 0.5em 1.8em; }
a.linkCC{ color: #FFF; }
.columnCategory:before {/*疑似要素*/ font-family: FontAwesome; content: "\f02b"; color:#FFF; position: absolute; left : 0.5em; /*左端からのアイコンまでの距離*/ }
#column_category ul li { display: inline-block; margin: 0 0 12px 0.3px ; padding: 0;}
#column_category ul { text-align: right; }


.columnCategory2 { position: relative; background: #968e8e; padding: 0.3em 0.5em 0.3em 1.8em; color: #FFF; border-radius: 3px; font-size: 0.9em;}
.columnCategory2:before {/*疑似要素*/ font-family: FontAwesome; content: "\f00c"; color:#FFF; position: absolute; left : 0.5em; /*左端からのアイコンまでの距離*/ }
#column_category2 ul li { display: inline-block; margin: 0 0 1.6px 0.3px ; padding: 3px 0 0 0 ;}
#column_category2 ul { text-align: right; }


.box_column_1 { border: 1px solid#ddd; padding: 2em; }

/*  ぼっくす囲み

=========================================================== */
.note { position: relative; background-color: #fff; padding: 1em; border-top: solid 1px #726862; border-bottom: solid 1px #726862;}
.note h5 { position: absolute; top: -1em; background-color: rgba(83,83,83,0.5); padding: 0.45em 2em; color: #fff; transform: rotate(-4deg);}
.clearfix:after{content: ""; clear: both; display: block;}



/*  受講者コメント
=========================================================== */
.column_parent{ width: 556px; margin: 0px 0px; padding: 0px 10px 0px 0px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; }
.column_inner{ width: 100%; border: 1px dashed #ccc; padding: 5px; margin: 5px 0px 5px 5px; display: inline-block; }
/* ▼レスポンシブ対応 */
.column_parentR{ width: 100%; margin: 0px 0px; padding: 0px 10px 0px 0px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; }

/*   パートナーワールド
=========================================================== */
dl.pt_world { overflow: hidden; zoom: 1; }
dl.pt_world dt{ width : 150px; /* 左寄せ */ float : left; /* float解除 */ clear : both; }
dl.pt_world dd{ padding:0px 0px 5px 120px; }

/*   アセスメトツール　表組みのタイトル
=========================================================== */
.asses01 { margin-bottom:0px ; color:#51b7e3; font-size: 1.3em; font-weight: bold; }
.asses02 { margin-top:0px ; font-weight: bold;}

/*   高評価の講師のクラス
=========================================================== */
.recommend_class01{ background-color: #eeeeee; margin: 2em 0; padding: 1.5em; position: relative; }
.recommend_class01::after { content: ""; border-color: #c9c9c9 #fff #fff #c9c9c9; border-style: solid; border-width: 0 0 24px 24px; bottom: 0; position: absolute; right: 0; vertical-align: middle; }
.recommend_frame { border:1px solid #eee;/* 外枠の色 */  padding:3px;/* 余白 */  background-color:#ffffff;/* 余白部分の色 */  margin-right: 15px; float: left; }
.recommend_text01 {  color: #707070; font-size: 1.2em;  line-height: 2em; font-weight: bold; }
.recommend_text02 {  color: #707070; font-size: 1em;  line-height: 1.5em; overflow:hidden; }
.recommend_text03 {  text-align: left; }
.recommend_text04 {  color: #707070; font-size: 1em;  line-height: 1.5em; overflow:hidden; }
.recommend_text05 {  color: #707070; font-size: 1.2em;  line-height: 1.5em; font-weight: bold; }
.recommend_text06 {  color: #707070; font-size: 1.2em;  padding-bottom: 5px; font-weight: bold; }

.clear { clear:both; /*floatの解除、ここがポイント*/ }
p.recommend01{ padding :2em; text-align: left;}

table.recommend_table { border-collapse: separate; border-spacing: 1px; text-align: center; line-height: 1.5; }
table.recommend_table th { padding: 3px 7px; font-weight: bold; vertical-align: top; color: #fff; background: #036; text-align: center; }
table.recommend_table td { padding: 3px 10px; vertical-align: top; background: #fff; line-height: 1.4; }

/*   CSR活動報告
=========================================================== */
.csr_title { font-size: 1.1em; font-weight: bold; color: #00509a;  padding: 0px 0px 5px 0px; text-decoration: none; }
.csr_title2 { font-size: 1.0em; font-weight: bold; color: #00509a;  padding: 10px 0px 0px 0px; text-decoration: none; }
a.csrunderline_black { color: #00509a; }
a.csrunderline_orange { color: #B06819; }
.csr_comments { font-size: 0.8em; color: #8B8888; }
.csr_subtitle { font-size: 1.3em; font-weight: bold; color: #323232; padding: 0px 0px 5px 0px; text-decoration: none; }
.csr ol{ margin: 0; padding: 0; list-style-type: none; }
img.csrpic_small { width: 150px; height: 100px; float: left; margin: 5px 20px 10px 5px;  }
img.csrpic_small2{ width: 150px; height: 100px; float: left; margin: 5px 20px 100px 5px;  }

/*   営業研修
=========================================================== */
table.sales_style { border-collapse: separate; border-spacing: 1px; text-align: center; line-height: 1.5; width: 100%; }
table.sales_style th { padding: 3px 7px; font-weight: bold; vertical-align: middle; color: #fff; background: #036; text-align: center; }
table.sales_style td { padding: 3px 10px; vertical-align: middle; line-height: 1.4; background: #eeeeee; text-align: left}


table.sales_style02 { border-collapse: collapse; border: 1px solid #ccc; line-height: 1.5; }

table.sales_style02 th { padding: 3px 10px; font-weight: bold; vertical-align: middle; text-align:center; border: 1px solid #ccc;}
table.sales_style02 td { padding: 3px 10px; vertical-align: middle; border: 1px solid #ccc; text-align:left; }

/*   講座テンプレート
=========================================================== */
/* --- 表全体 --- */
table.template { width: 100%; /* 表の幅 */ border: 1px #c0c0c0 solid; /* 大枠の境界線 */ border-collapse: collapse; }

/* --- 表タイトル --- */
table.template caption { padding-bottom: 5px; /* 表タイトルの下パディング */ }

/* --- セル --- */
table.template th,
table.template td { padding: 4px 8px; /* セルのパディング（上下、左右） */ border: 1px #c0c0c0 solid; /* セルの境界線 */ }

/* --- 見出しセル --- */
table.template thead th { background-color: #036; /* 見出しセルの背景色 */ font-weight: bold; text-align: center; color: #FFF; }
table.template thead th:nth-child(1) { width:9%; text-align: center; vertical-align: middle; }
table.template thead th:nth-child(2) { width:50%; vertical-align: middle; }
table.template thead th:nth-child(3) { width:7%; text-align: center; vertical-align: middle; white-space: nowrap; }
table.template thead th:nth-child(4) { width:34%; vertical-align: middle; }

/* --- 表ボディ --- */
table.template tbody { background-color: #ffffff; /* ボディの背景色 */ }

/* --- マウスオーバー時 --- */
table.template tbody tr:hover { background-color: #e5e5e5; /* 行の背景色 */ }
table.template tr td:nth-child(1) { width:9%; text-align: center; vertical-align: middle; }
table.template tr td:nth-child(2) { width:50%; vertical-align: middle; }
table.template tr td:nth-child(3) { width:7%; text-align: center; vertical-align: middle; white-space: nowrap; }

table.template tr td:nth-child(4) { width:34%; vertical-align: middle; }

/*   講座テンプレート(PDU)
=========================================================== */
/* --- 表全体 --- */
table.templateP { width: 100%; /* 表の幅 */ border: 1px #c0c0c0 solid; /* 大枠の境界線 */ border-collapse: collapse; }
.templateP-responsive {
  min-height: .01%;
  overflow-x: auto;
}
@media screen and (max-width: 767px) {
  .templateP-responsive {
    width: 100%;
    margin-bottom: 18px;
    overflow-y: hidden;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    white-space: nowrap;
  }
}
/* --- 表タイトル --- */
table.templateP caption { padding-bottom: 5px; /* 表タイトルの下パディング */ }

/* --- セル --- */
table.templateP th,
table.templateP td { padding: 4px 8px; /* セルのパディング（上下、左右） */ border: 1px #c0c0c0 solid; /* セルの境界線 */ }

/* --- 見出しセル --- */
table.templateP thead th { background-color: #036; /* 見出しセルの背景色 */ font-weight: bold; text-align: center; color: #FFF; }
table.templateP thead th:nth-child(1) { width:8%; text-align: center; vertical-align: middle; }
table.templateP thead th:nth-child(2) { width:44%; vertical-align: middle; }
table.templateP thead th:nth-child(3) { width:7%; text-align: center; vertical-align: middle; }
table.templateP thead th:nth-child(4) { width:7%; text-align: center; vertical-align: middle; white-space: nowrap; }
table.templateP thead th:nth-child(5) { width:34%; vertical-align: middle; }

/* --- 表ボディ --- */
table.templateP tbody { background-color: #ffffff; /* ボディの背景色 */ }

/* --- マウスオーバー時 --- */
table.templateP tbody tr:hover { background-color: #e5e5e5; /* 行の背景色 */ }
table.templateP tr td:nth-child(1) { width:9%; text-align: center; vertical-align: middle; }
table.templateP tr td:nth-child(2) { width:44%; vertical-align: middle; }
table.templateP tr td:nth-child(3) { width:7%; text-align: center; vertical-align: middle; white-space: nowrap; }
table.templateP tr td:nth-child(4) { width:7%; text-align: center; vertical-align: middle; white-space: nowrap; }
table.templateP tr td:nth-child(5) { width:33%; vertical-align: middle; }

/*   右メニューなし幅820px
=========================================================== */
#wide820Main	{ font-size: 1.1em; width: 820px; margin: 0 0 0 40px; float: left; display: inline;}
img.template_icons { width: 40px; height: 30px; margin :0px 2px; }
#wide820Main h1 { font-size: 2em; font-weight: bold; line-height: 1.3em; margin: 0; padding: 0 0 15px 10px; }
#wide820Main .iLearning-container { line-height: 1.6em; }
#wide820Main .iLearning-container { clear: both; width: auto; border-top: 2px solid #666; margin: 0 0 10px 10px; }


/*   提供形態のアイコン
=========================================================== */
#wide820Main	{ font-size: 1.1em; width: 820px; margin: 0 0 0 40px; float: left; display: inline;}
img.group1 { width:46px; height:30px; margin-right:4px; }
img.group2 { width:96px; height:30px; margin-right:4px; }
img.group3 { width:146px; height:30px; margin-right:4px; }
img.group4 { width:196px; height:30px; margin-right:4px; }
img.group5 { width:46px; height:30px; margin-top: 4px; }

.kouzataikeizu { font-size: 1.2em; color:#98978c;  font-weight: bold; padding-bottom: 5px;}
#secondMain .iLearning-Ks_container { clear: both; width: auto; margin: 0 0 10px 10px; }

/*   ITトップのタブ1
=========================================================== */
/*タブ切り替え全体のスタイル*/
.tabs {　margin-top: 50px; padding-bottom: 40px; background-color: #f5f5f5;  width: 556px; margin: 0 auto; }

/*タブのスタイル*/
.tab_item { width: calc(100%/2); height: 70px; border-bottom: 3px solid #95ab41; background-color: #a0a0a0; line-height: 70px; font-size: 18px; letter-spacing: 2px;　text-align: center; color: #565656; display: block; float: left; text-align: center; font-weight: bold; transition: all 0.2s ease; }
.tab_item:hover { opacity: 0.75 }

/*ラジオボタンを全て消す*/
input[name="tab_item"] { display: none; }

/*タブ切り替えの中身のスタイル*/
.tab_content { display: none; padding: 40px 40px 0; clear: both; overflow: hidden; }


/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content { display: block; }

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item { background-color: #95ab41; color: #fff; }

/*   ITトップのボタン
=========================================================== */
.btn_it { padding: 15px 0px; width:278px; font-weight: bold; text-align: center; display: inline-block; text-decoration: none !important; font-size: 20px; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; letter-spacing: 2px; }

.btn_it01 { background-color: #95ab41; color: #fff !important; float: left;}
.btn_it:hover { opacity: 1.0; }

.btn_it02 { background-color: #bfbfbf; color: #898989 !important; float: right;}
.btn_it02:hover { background-color: #848cb9; color: #fff !important; }


.itskill_list{ margin-left:20px; }

/*   IBMトップのボタン
=========================================================== */
.btn_ibm { padding: 15px 0px; width:278px; font-weight: bold; display: inline-block; text-decoration: none !important; text-align: center; font-size: 20px; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; letter-spacing: 2px; }

.btn_ibm01 { background-color: #848cb9; color: #fff !important; float: right;}
.btn_ibm:hover { opacity: 1.0; }

.btn_ibm02 { background-color: #bfbfbf; color: #898989 !important; float: left;}
.btn_ibm02:hover { background-color: #95ab41; color: #fff !important; }


/*   ITトップのリスト
=========================================================== */
ul.template_it{ padding: 0; color:#000; }
ul.template_it li { color: #404040; border-left: solid 6px #95ab41;/*左側の線*/ border-bottom: solid 2px #dadada;/*下に灰色線*/ background: whitesmoke; margin-bottom: 5px;/*下のバーとの余白*/ line-height: 1; padding: 0.5em; list-style-type: none!important;/*ポチ消す*/ font-weight: bold; }
ul.template_it a { color:#313131; }
ul.template_it a:hover { color:#9abb1a; }

/*入れ子*/
dl.template_it_second{ padding: 0; color:#000; }
dl.template_it_second dd { color: #404040; line-height: 1; padding: 0.2em; font-weight: normal; }
dl.template_it_second dt { color: #404040; line-height: 1; padding: 0.2em; padding-top: 0.8em; font-weight: normal; }
dl.template_it_second a { color:#313131; }
dl.template_it_second a:hover { color:#9abb1a; }


/*   IBMトップのリスト
=========================================================== */
ul.template_ibm{ padding: 0; color:#000; }
ul.template_ibm li { color: #404040; border-left: solid 6px #848cb9;/*左側の線*/ border-bottom: solid 2px #dadada;/*下に灰色線*/ background: whitesmoke; margin-bottom: 5px;/*下のバーとの余白*/ line-height: 1; padding: 0.5em; list-style-type: none!important;/*ポチ消す*/ font-weight: bold; }
ul.template_ibm a { color:#313131; }
ul.template_ibm a:hover { color:#7687ec }

/*   フォーカスエリアのリスト
=========================================================== */
ul.template_focus{ padding: 0; color:#000; }
ul.template_focus li { color: #404040; border-left: solid 6px #961912;/*左側の線*/ border-bottom: solid 2px #dadada;/*下に灰色線*/ background: whitesmoke; margin-bottom: 5px;/*下のバーとの余白*/ line-height: 1; padding: 0.5em; list-style-type: none!important;/*ポチ消す*/ font-weight: bold; }
ul.template_focus a { color:#313131; }
ul.template_focus a:hover { color:#961912; }

/*   関連講座のリスト
=========================================================== */
ul.template_kanren{ padding: 0; color:#000; }
ul.template_kanren li { color: #404040; border-left: solid 6px #7d7d7d;/*左側の線*/ border-bottom: solid 2px #dadada;/*下に灰色線*/ background: whitesmoke; margin-bottom: 5px;/*下のバーとの余白*/ line-height: 1; padding: 0.5em; list-style-type: none!important;/*ポチ消す*/ font-weight: bold; }
ul.template_kanren a { color:#313131; }
ul.template_kanren a:hover { color:#7d7d7d; }

/*   デジタルビジネスのリスト
=========================================================== */
ul.template_digitalbusiness{ padding: 0; color:#000; }
ul.template_digitalbusiness li { color: #404040; border-left: solid 6px #408673;/*左側の線*/ border-bottom: solid 2px #dadada;/*下に灰色線*/ background: whitesmoke; margin-bottom: 5px;/*下のバーとの余白*/ line-height: 1; padding: 0.5em; list-style-type: none!important;/*ポチ消す*/ font-weight: bold; }
ul.template_digitalbusiness a { color:#313131; }
ul.template_digitalbusiness a:hover { color:#408673; }

/*   ビジネススキルのリスト
=========================================================== */
ul.template_human{ padding: 0; color:#000; }
ul.template_human li { color: #404040; border-left: solid 6px #db9739;/*左側の線*/ border-bottom: solid 2px #dadada;/*下に灰色線*/ background: whitesmoke; margin-bottom: 5px;/*下のバーとの余白*/ line-height: 1; padding: 0.5em; list-style-type: none!important;/*ポチ消す*/ font-weight: bold; }
ul.template_human a { color:#313131; }
ul.template_human a:hover { color:#db9739; }



.focus_area { font-size:1.1em; font-weight: bold; color:#961912; }
.focus_it { font-size:1.1em; font-weight: bold; color:#95ab41; }
.focus_ibm { font-size:1.1em; font-weight: bold; color:#848cb9; }
.focus_kanren { font-size:1.1em; font-weight: bold; color:#7d7d7d; }
.focus_digitalbusiness { font-size:1.1em; font-weight: bold; color:#408673; }
.focus_human { font-size:1.1em; font-weight: bold; color:#db9739; }
.focus_projectmngmnt { font-size:1.1em; font-weight: bold; color:#df8089; }
.focus_newcomer { font-size:1.1em; font-weight: bold; color:#4a83b1; }


.kouza_subtitle { font-size: 1.6em; font-weight: bold;line-height: 1.3em;margin: 0; padding: 0 0 15px 0px; border-bottom: 2px solid #666666;}

p.courseG { color:#898989; font-size:0.8em; line-height: 1.4;}

/*  プロジェクトマネジメントのリスト
=========================================================== */
ul.template_projectmngmnt{ padding: 0; color:#000; }
ul.template_projectmngmnt li { color: #404040; border-left: solid 6px #df8089;/*左側の線*/ border-bottom: solid 2px #dadada;/*下に灰色線*/ background: whitesmoke; margin-bottom: 5px;/*下のバーとの余白*/ line-height: 1; padding: 0.5em; list-style-type: none!important;/*ポチ消す*/ font-weight: bold; }
ul.template_projectmngmnt a { color:#313131; }
ul.template_projectmngmnt a:hover { color:#df8089; }

/*  新入社員研修のリスト
=========================================================== */
ul.template_newcomer{ padding: 0; color:#000; }
ul.template_newcomer li { color: #404040; border-left: solid 6px #4a83b1;/*左側の線*/ border-bottom: solid 2px #dadada;/*下に灰色線*/ background: whitesmoke; margin-bottom: 5px;/*下のバーとの余白*/ line-height: 1; padding: 0.5em; list-style-type: none!important;/*ポチ消す*/ font-weight: bold; }
ul.template_newcomer a { color:#313131; }
ul.template_newcomer a:hover { color:#4a83b1; }

/*   資料ダウンロード
=========================================================== */
h2.iLearning-dl{ font-size:1.3em;  padding: 10px 0 5px 0; height: 1%; border-top: 2px solid #666; margin-top: 10px !important;}
.dl_subTitle{ font-size:1.1em; padding: 5px 0; font-weight:bold;}
img.course_guide{ margin-left:10px;}
.topics_left20{ padding-left:10px;}
.topics_hr { border: none; border-top: 2px #5c5c5c solid; padding: 2px 0; }
.topics_title { font-weight: bold; font-size:1.2em; padding-left:10px; }

/*   デジタルビジネススクール
=========================================================== */
.box001 { display: inline-block; width: 85%; padding : 10px; background: #a6d4ea; font-size: 1.1em; color: #000; }
.boxCh1 { display: inline-block; height: 120px; width: 200px; margin: 10px; padding-top: 50px; background: #4e72be; text-align: center; font-size: 1.2em; font-weight: bold; color: #FFFFFF; }
.boxCh2 { display: inline-block; height: 120px; width: 200px; margin: 10px 0 10px 50px; padding-top: 35px; background: #f6b006; text-align: center; vertical-align: middle; font-size: 1.2em; font-weight: bold; color: #FFFFFF; }
.dbarrow {　display:inline-block;　height:20px;　width:80px;　background-color:#5bc0de;　position:relative;　top:20px;　margin-left: 20px;　margin-bottom: 15px; }

.dbarrow:before { position:absolute;　content:"";　width:0;　height:0;　border:30px solid transparent;　border-left:30px solid #5bc0de;　left:80px;　top:-20px;　margin-bottom: 15px; }
.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }
.wf-notosansjapanese { font-family: "Noto Sans Japanese"; }
h2.dbs { border-top: 2px solid #666; padding: 5px 0; }
img.dbiz_hr { width:100%; }
img.contact820 { width:80%; }

p.indent-1 {　padding-left:1em;　text-indent:-1em; }

/*   ITスキル　リストをテーブル
=========================================================== */
div.it_cover { display: table; margin: 0px; padding: 0px; width: 100%; }
div.it_cover div.box1 { display: table-cell; width: 48%; }
div.it_cover div.box2 { display: table-cell; width: 2%; }
div.it_cover div.box3 { display: table-cell; width: 48%; }

/*   「発想法・思考法」特集2018
=========================================================== */
.hassou_title {  margin-bottom: 5px;  color:#898989;}

#secondMainR .inquiry-container	{ background-color: #fdfdfd; position: relative; margin: 15px 0 15px 10px; padding: 10px 20px; border: dotted 1px #c5c5c5; }
#secondMainR .inquiry-container h2	{ color: #808080; font-size: 1.3em; float: left; margin: 0; padding: 0 15px 0 0; display: inline; }
#secondMainR .inquiry-container p	{ font-size: 1.1em; margin: 0; padding:0; }
#secondMainR .inquiry-container p span	{ color: #07913a; font-size: 1.7em; font-weight: bold; }
#secondMainR .inquiry-container .inquiry-container-body	{ line-height: 2em; float: left; display: block; display: inline; }
#secondMainR .inquiry-container p.form	{ position: absolute; right: 20px; bottom: 15px; }

.hassou_box { padding:2px; color:#fff;}
.hassou_box01{ background-color: #3396C1; color:#fff; font-size:1.3em; width:100%;  padding:5px 0px 5px 10px; margin-bottom: 3px;}
.hassou_box02{ background-color: #f39800; color:#fff; font-size:1.3em; width:100%;  padding:5px 0px 5px 10px; margin-bottom: 3px;}
.hassou_box03{ background-color: #32b16c; color:#fff; font-size:1.3em; width:100%;  padding:5px 0px 5px 10px; margin-bottom: 3px;}
.hassou_box04{ background-color: #ec8490; color:#fff; font-size:1.3em; width:100%;  padding:5px 0px 5px 10px; margin-bottom: 3px;}


a.h_box00{ color:#fff; }
.hassou_box05 { font-size:0.8em; }

/*   講座テンプレート
=========================================================== */
/* --- 表全体 --- */
table.hassou { width: 100%; /* 表の幅 */ border: 1px #c0c0c0 solid; /* 大枠の境界線 */ border-collapse: collapse; }
/* --- セル --- */
table.hassou th, table.hassou td { padding: 4px 8px; /* セルのパディング（上下、左右） */ border: 1px #c0c0c0 solid; /* セルの境界線 */ }
/* --- 見出しセル --- */
table.hassou thead th { background-color: #036; /* 見出しセルの背景色 */ font-weight: bold; text-align: center; color: #FFF; }
/* --- 表ボディ --- */
table.hassou tbody {
background-color: #ffffff; /* ボディの背景色 */ }
/* --- マウスオーバー時 --- */
table.hassou tbody tr:hover {
background-color: #e5e5e5; /* 行の背景色 */ }
table.hassou tr td:nth-child(1) { width:10%; text-align: center; vertical-align: middle; }
table.hassou tr td:nth-child(2) { width:50%; vertical-align: middle; }
table.hassou tr td:nth-child(3) { width:40%; vertical-align: middle; }

.new_atten {font-family: 'Fugaz One', sans-serif; color:#C40F12; padding: 0px 10px; font-size: 1.1em; white-space: nowrap;}
.new_atten2 {font-family: 'Fugaz One', sans-serif; color:#C40F12; padding: 0 10px 0 0; font-size: 1.1em; white-space: nowrap;}

/*   ITスキル　メニューリスト
=========================================================== */

div.it_anchor{ width:100%; padding:15px 10px; margin-top: 5px; background:#efefef; text-align:left; font-size:1em; color: #777777; }
div.it_anchor ul { width:100%;  }
div.it_anchor ul li{ margin:0 20px 8px 0; padding-left:20px; display:inline-block; display:inline;/*IE7*/zoom:1;/*IE7*/ zoom:1; }
div.it_anchor a { color:#777777; }
div.it_anchor a:hover { color:#9abb1a; }

/*   ビジネススキル　メニューリスト
=========================================================== */
div.human_anchor{ width:100%; padding:15px 10px 3px 10px; margin-top: 5px; background:#efefef; text-align:left; font-size:1em; color: #777777; }
div.human_anchor ul { width:100%;  }
div.human_anchor ul li{ margin:0 20px 10px 0; padding-left:20px; display:inline-block; display:inline;/*IE7*/zoom:1;/*IE7*/ zoom:1; }
div.human_anchor a { color:#777777; }
div.human_anchor a:hover { color:#db9739; }

/* inquiry 820
=========================================================== */
#wide820Main .inquiry-container	{ background-color: #fdfdfd; position: relative; margin: 15px 0 15px 10px; padding: 10px 20px; border: dotted 1px #c5c5c5; }
#wide820Main .inquiry-container h2	{ color: #808080; font-size: 1.3em; float: left; margin: 0; padding: 0 15px 0 0; display: inline; }
#wide820Main .inquiry-container p	{ font-size: 1.1em; margin: 0; padding:0; }
#wide820Main .inquiry-container p span	{ color: #07913a; font-size: 1.7em; font-weight: bold; }
#wide820Main .inquiry-container .inquiry-container-body	{ line-height: 2em; float: left; display: block; display: inline; }
#wide820Main .inquiry-container p.form	{ position: absolute; right: 20px; bottom: 15px; }

/* inquiry detailMain
=========================================================== */
#detailMain .inquiry-container	{ background-color: #fdfdfd; position: relative; margin: 15px 0 15px 10px; padding: 10px 20px; border: dotted 1px #c5c5c5; }
#detailMain .inquiry-container h2	{ color: #808080; font-size: 1.3em; float: left; margin: 0; padding: 0 15px 0 0; display: inline; }
#detailMain .inquiry-container p	{ font-size: 1.1em; margin: 0; padding:0; }
#detailMain .inquiry-container p span	{ color: #07913a; font-size: 1.7em; font-weight: bold; }
#detailMain .inquiry-container .inquiry-container-body	{ line-height: 2em; float: left; display: block; display: inline; }
#detailMain .inquiry-container p.form	{ position: absolute; right: 20px; bottom: 15px; }


/*   マイラ　　テーブル
=========================================================== */
/* --- 表全体 --- */
table.myla { width: 100%; /* 表の幅 */ border: 1px #c0c0c0 solid; /* 大枠の境界線 */ border-collapse: collapse; }

/* --- セル --- */
table.myla th { background-color: #d6e5cb; text-align: center; border: 1px #c0c0c0 solid; }
table.myla td { padding: 4px 8px; /* セルのパディング（上下、左右） */ border: 1px #c0c0c0 solid; /* セルの境界線 */ }

/* --- 見出しセル --- */
table.myla thead th { background-color: #7d7d7d; /* 見出しセルの背景色 */ font-weight: bold; text-align: center; color: #FFF; }

/* --- 表ボディ --- */
table.myla tbody { background-color: #ffffff; /* ボディの背景色 */ }

table.myla tr td:nth-child(1) { width:30%; text-align: center; vertical-align: middle; }
table.myla tr td:nth-child(2) { width:25%; vertical-align: middle; text-align: right; }
table.myla tr td:nth-child(3) { width:25%; vertical-align: middle; text-align: right; }
table.myla tr td:nth-child(4) { width:20%; vertical-align: middle; text-align: right; }

table.template tr td:nth-child(4) { width:34%; vertical-align: middle; }

.myla_movie_back { background-color: #000; text-align:center; vertical-align: middle; padding:30px;}
.myla_text_small { font-size:0.9em; padding:3px; }

/*   マイラ　　ボタン
=========================================================== */

a.myla_btn01 { position: relative; display: inline-block; padding: 0.5em 2em; text-decoration: none; color: #FFF; background: #499844;/*背景色*/ border-bottom: solid 2px #00838F;/*少し濃い目の色に*/ border-radius: 4px;/*角の丸み*/ box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19); font-weight: bold; font-size:1.2em; font-family: "Mplus 1p";}
a.myla_btn01:active { border-bottom: solid 2px #295727; box-shadow: 0 0 2px rgba(0, 0, 0, 0.30); }

a.myla_btn02 { position: relative; display: inline-block; padding: 0.5em 2em; text-decoration: none; color: #FFF; background: #fd9535;/*背景色*/ border-bottom: solid 2px #d27d00;/*少し濃い目の色に*/ border-radius: 4px;/*角の丸み*/ box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19); font-weight: bold; font-size:1.2em; font-family: "Mplus 1p";}
a.myla_btn02:active { border-bottom: solid 2px #fd9535; box-shadow: 0 0 2px rgba(0, 0, 0, 0.30); }

a.myla_btn03 { position: relative; display: inline-block; padding: 0.5em 2em; text-decoration: none; color: #FFF; background: #ec2c6e;/*背景色*/ border-bottom: solid 2px #e5004f;/*少し濃い目の色に*/ border-radius: 4px;/*角の丸み*/ box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19); font-weight: bold; font-size:1.2em; font-family: "Mplus 1p";}
a.myla_btn03:active { border-bottom: solid 2px #ec2c6e; box-shadow: 0 0 2px rgba(0, 0, 0, 0.30); }

a.myla_btn04 { position: relative; display: inline-block; padding: 0.5em 2em; text-decoration: none; color: #FFF; background: #1481ce;/*背景色*/ border-bottom: solid 2px #1c6395;/*少し濃い目の色に*/ border-radius: 4px;/*角の丸み*/ box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19); font-weight: bold; font-size:1.2em; font-family: "Mplus 1p";}
a.myla_btn04:active { border-bottom: solid 2px #59ace6; box-shadow: 0 0 2px rgba(0, 0, 0, 0.30); }

.myla_btn_off { position: relative; display: inline-block; padding: 0.5em 2em; text-decoration: none; color: #e5e5e5; background: #bfbfbf;/*背景色*/ border-bottom: solid 2px #a0a0a0;/*少し濃い目の色に*/ border-radius: 4px;/*角の丸み*/ box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19); font-weight: bold; font-size:1.2em; font-family: "Mplus 1p";}

/*   サンプル　　ボタン
=========================================================== */
.myButton {
  box-shadow:inset 0px 1px 0px 0px #ffffff;
  background:color-stop(0.05, #f9f9f9), color-stop(1, #d3d2d2);
  background:linear-gradient(to bottom, #f9f9f9 5%, #d3d2d2 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#d3d2d2',GradientType=0);
  background-color:#f9f9f9;
  border-radius:6px;
  border:1px solid #d3d2d2;
  display:inline-block;
  cursor:pointer;
  font-size:0.8em;
  color:#555454;
  font-weight: bold;
  padding:2px 8px; /* ボタンの上下と左右の中の余白 */
  text-decoration:none;
  vertical-align: middle;
  white-space: nowrap;
}
.myButton:hover {
  background:color-stop(0.05, #d3d2d2), color-stop(1, #f9f9f9);
  background:linear-gradient(to bottom, #d3d2d2 5%, #f9f9f9 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d3d2d2', endColorstr='#f9f9f9',GradientType=0);
  background-color:#d3d2d2;
}
.myButton:active {
  position:relative;
  top:1px;
  color:#555454;
}
a.myButton {
  text-decoration: none;
  color:#555454;
}

/*   ilLAB　ヒーロー
=========================================================== */
.illab_link {
  font-family: 'Noto Sans Japanese', sans-serif;
  text-align: center;
  padding-top: 40px;
}

.btn-push {
  display: inline-block;
  letter-spacing: 0.1em;
  text-align: left;
  background-color: #ffa300;
  font-size: 18px;
  color: #FFF;
  text-decoration: none;
  font-weight: bold;
  padding: 18px 30px;
  border-radius: 4px;
  border-bottom: 4px solid #d37800;
}
.btn-push:hover{
  background-color: #f9c500;/*ボタン色*/
  border-bottom: solid 4px #f39800; /*下線色*/
}
.btn-push:active {
  ransform: translateY(4px);
  border-bottom: none;
	 
}

a.btn-push {
  text-decoration: none;
  color:#FFF;
}

.illab_hero {/*親div*/
  position: relative;/*相対配置*/
}

.illab_text01 {
  position: absolute;/*絶対配置*/
  color: #000000;/*文字の色*/
  font-family　:　'Noto Sans', sans-serif;
  font-weight: 700;
  font-size: 46px;
  top: 40px;
  left: 320px;
  }
  
.illab_text02 {  
	
  position: absolute;/*絶対配置*/ 
  font-size:18px; 
  letter-spacing: 0.1em;
  font-family: 'Noto Sans', sans-serif;
  top: 116px;
  left: 320px;
  }
  
.illab_text03 {
  position: absolute;/*絶対配置*/
  color: #535353;/*文字の色*/
  font-family　:　'Noto Sans', sans-serif;
  font-weight: 700;
  font-size: 20px;
  top: 30px;
  left: 30px;
  }

.illab_hero img {
  width: 100%;
  }
 
img.illab_icon{ vertical-align:middle; width:70px; height: 70px; margin :0 10px; }
.illab_title { font-size:18px; font-weight: bold; font-family: 'Noto Sans', sans-serif; background-color: #e9e7e8; width:100%; height: 70px; text-shadow: 2px 1px 1px #FFF;}

.illab_box {
  padding: 1em 1em;
  margin: 2em 0;
  font-weight: bold;
  color: #74aa48;;/*文字色*/
  background: #FFF;
  border: solid 3px #74aa48;/*線*/
  border-radius: 10px;/*角の丸み*/
  text-align: center;
  font-size: 1.2em;
  font-family: 'Noto Sans', sans-serif;
}
.illab_box p {
  margin: 0; 
  padding: 0;
}

/*   写真　ポラロイド風
=========================================================== */
.polaroid_r { position: relative; margin: 5px 0px 5px 20px; float: right; }
 
.polaroid_r img { border: 6px solid #fff; width:160px; border-bottom: 40px solid #fff;
  -webkit-box-shadow: 1px 1px 1px 1px #777;
     -moz-box-shadow: 1px 1px 1px 1px #777;
          box-shadow: 1px 1px 1px 1px #777;
}
 
.polaroid_r p { position: absolute; text-align: center; vertical-align: middle; width: 100%; bottom: 7px; font: 400 0.7em "Noto Sans Japanese"; color: #834e00; }

.polaroid_rb { position: relative; margin: 5px 0px 5px 20px; float: right; }
 
.polaroid_rb img { border: 6px solid #fff; width:200px; border-bottom: 5px solid #fff;
  -webkit-box-shadow: 1px 1px 1px 1px #777;
     -moz-box-shadow: 1px 1px 1px 1px #777;
          box-shadow: 1px 1px 1px 1px #777;
}
 
.polaroid_rb p { position: absolute; text-align: center; vertical-align: middle; width: 100%; bottom: 7px; font: 400 0.7em "Noto Sans Japanese"; color: #834e00; }

.polaroid_l { position: relative; margin: 5px 20px 5px 0px; float: left; }
 
.polaroid_l img { border: 6px solid #fff; width:200px; border-bottom: 30px solid #fff;
  -webkit-box-shadow: 1px 1px 1px 1px #777;
     -moz-box-shadow: 1px 1px 1px 1px #777;
          box-shadow: 1px 1px 1px 1px #777;
}
 
.polaroid_l p { position: absolute; text-align: center; vertical-align: middle; width: 100%; bottom: 7px; font: 400 0.7em "Noto Sans Japanese"; color: #834e00; }

.polaroid_ll { position: relative; margin: 5px 20px 5px 0px; float: left; }
 
.polaroid_ll img { border: 6px solid #fff; width:260px; border-bottom: 30px solid #fff; padding-bottom: 3px;
  -webkit-box-shadow: 1px 1px 1px 1px #777;
     -moz-box-shadow: 1px 1px 1px 1px #777;
          box-shadow: 1px 1px 1px 1px #777;
}
 
.polaroid_ll p { position: absolute; text-align: center; vertical-align: middle; width: 100%; bottom: 7px; font: 400 0.7em "Noto Sans Japanese"; color: #834e00; }

.polaroid_lb { position: relative; margin: 5px 20px 5px 0px; float: left; }
 
.polaroid_lb img { border: 6px solid #fff; width:200px; border-bottom: 5px solid #fff;
  -webkit-box-shadow: 1px 1px 1px 1px #777;
     -moz-box-shadow: 1px 1px 1px 1px #777;
          box-shadow: 1px 1px 1px 1px #777;
}

.polaroid_c {  position: relative; margin: 5px 20px 5px 0px; text-align: center; }
 
.polaroid_c img { border: 6px solid #fff; width:420px; border-bottom: 30px solid #fff;
  -webkit-box-shadow: 1px 1px 1px 1px #777;
     -moz-box-shadow: 1px 1px 1px 1px #777;
          box-shadow: 1px 1px 1px 1px #777;
}
 
.polaroid_c p { position: absolute; text-align: center; vertical-align: middle; width: 100%; bottom: 7px; font: 400 0.7em "Noto Sans Japanese"; color: #834e00; }

.clear { clear: both; }

/*   rm
=========================================================== */

.rm_item { display: flex; align-items: center; border-bottom:1px dotted #c9c9c9; margin-bottom: 5px; }
.rm_thmb { width: 100px; margin: 2px 0; }
.rm_content { flex: 1; padding-left: 7px; font-size: 0.9em; font-weight: bold; line-height:1.3; }
.ol_indent { padding:0 10px 0 20px; text-align: right; float:left; }

.illindent1 { text-indent: -1em; padding-left: 1em; }
.illindent2 { text-indent: -2em; padding-left: 2em; }
.illindent3 { text-indent: -3em; padding-left: 3em; }

.tboxin4 { text-align: left; font-weight: bold; padding: 10px; }

/*   グレーの角丸背景
=========================================================== */
.gray_box {
	padding: 0.5em 1em;
	margin: .5em 0;
	background: #e5e5e5;
	border-radius: 10px;/*角の丸み*/
}
.gray_box p {
	font-size:1.1em;
	font-family: "Noto Sans Japanese";
	line-height: 1.6em;
	margin: 0; 
	padding: 10 0 10 14;
}

/*   フォントサイズ
=========================================================== */
.f-11{
    font-size:11px!important;
}
.f-12{
    font-size:12px!important;
}
.f-13{
    font-size:13px!important;
}
.f-14{
    font-size:14px!important;
}
.f-15{
    font-size:15px!important;
}
.f-16{
    font-size:16px!important;
}
.f-17{
    font-size:17px!important;
}
.f-18{
    font-size:18px!important;
}
.f-19{
    font-size:19px!important;
}
.f-20{
    font-size:20px!important;
}
.f-22{
    font-size:22px!important;
}
.f-24{
    font-size:24px!important;
}
.f-26{
    font-size:26px!important;
}
.f-28{
    font-size:28px!important;
}
.f-30{
    font-size:30px!important;
}
.f-32{
    font-size:32px!important;
}
.f-34{
    font-size:34px!important;
}
.f-36{
    font-size:36px!important;
}
.f-38{
    font-size:38px!important;
}
.f-40{
    font-size:40px!important;
}
.f-bold{ font-weight: bold; }
.f-padding5 { padding-top:5px; }
.f-padding10 { padding-top:10px; }

img.mawarikomi_r {float:right; margin-left:10px;}
img.mawarikomi_l {float:left; margin-right:10px;}

/*   インデント
=========================================================== */
p.indent_1{ text-indent: 1em; }
p.indent_2{ text-indent: 2em; }
p.indent_3{ text-indent: 3em; }
.indent_div3 {padding-left: 3em;}
.indent_div2 {padding-left: 2em;}
.indent_div1 {padding-left: 1em;}

/*   余白
=========================================================== */
p.pt-2{ padding-top: 2px!important; }
p.pt-3{ padding-top: 3px!important; }
p.pt-4{ padding-top: 4px!important; }
p.pt-5{ padding-top: 5px!important; }
p.pt-6{ padding-top: 6px!important; }
p.pt-7{ padding-top: 7px!important; }
p.pt-8{ padding-top: 8px!important; }
p.pt-10{ padding-top: 10px!important; }
p.pt-12{ padding-top: 12px!important; }
p.pt-15{ padding-top: 15px!important; }
p.pt-20{ padding-top: 20px!important; }
p.pt-25{ padding-top: 25px!important; }
p.pt-30{ padding-top: 30px!important; }
p.pt-40{ padding-top: 40px!important; }
p.pt-50{ padding-top: 50px!important; }
p.pt-60{ padding-top: 60px!important; }
p.pt-70{ padding-top: 70px!important; }
p.pt-80{ padding-top: 80px!important; }
p.pt-90{ padding-top: 90px!important; }
p.pt-100{ padding-top: 100px!important; }

.pt-2{ padding-top: 2px!important; }
.pt-3{ padding-top: 3px!important; }
.pt-4{ padding-top: 4px!important; }
.pt-5{ padding-top: 5px!important; }
.pt-6{ padding-top: 6px!important; }
.pt-7{ padding-top: 7px!important; }
.pt-8{ padding-top: 8px!important; }
.pt-10{ padding-top: 10px!important; }
.pt-12{ padding-top: 12px!important; }
.pt-15{ padding-top: 15px!important; }
.pt-20{ padding-top: 20px!important; }
.pt-25{ padding-top: 25px!important; }
.pt-30{ padding-top: 30px!important; }
.pt-40{ padding-top: 30px!important; }
.pt-50{ padding-top: 50px!important; }
.pt-60{ padding-top: 60px!important; }
.pt-70{ padding-top: 70px!important; }
.pt-80{ padding-top: 80px!important; }
.pt-90{ padding-top: 90px!important; }
.pt-100{ padding-top: 100px!important; }


p.ptb-5{ padding-bottom: 10px!important; }



.m-10{ margin-top: 10px; }

img.cen { margin: 5px; }

/*   上付き文字
=========================================================== */
span.supText { font-size: 75.5%; vertical-align: top; position: relative; top: -0.1em; color:#959595; }
span.supText2 { font-size: 75.5%; color:#959595; }
span.supText3 { font-size: 75.5%; vertical-align: top; position: relative; top: -0.1em;}

/*   フォントの色
=========================================================== */
.fcolor_g { color:#777; }
.fcolor_green { color:#009944; }
.f-c-ora{ color:#b84901; }
.fcolor_r { color:#d32c25; }


/*   ランキング
=========================================================== */
*, *:before, *:after {
	box-sizing: border-box;
}
.col_3{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.col_3 > div{
	width: 33.33333%;
	padding: 5px;
}
.col_3 > div > div{
	background: #d32c25;
	height:70px;
	position: relative;
	overflow: hidden;
	border-radius: 5px;
}

@media screen and (max-width: 960px) {
	.col_3 > div{
		width: 50%;
	}
}
@media screen and (max-width : 481px ){
	.col_3 > div{
		width: 100%;
	}
}


.ranking {
	text-align: center;
	vertical-align: middle;
	color: #FFF;
	font-weight: bolder;
	margin-top: 16px;
	letter-spacing: 1px;
}

.ranking a {color: #FFF; }


.ranking2 {
	text-align: center;
	vertical-align: middle;
	color: #FFF;
	font-weight: bolder;
	margin-top: 16px;
	font-size: 1.2em;
	letter-spacing: -2px;
}

.ranking2 a {color: #FFF; }



.ranking_red {width: 100% ; background: #d32c25; color: #FFF; font-weight: bolder; padding: 8px 20px ;  font-size: 1.1em; letter-spacing: 1px; border-radius: 5px; }

.ranking_bg { width: auto; margin: 5px 20px 0px 0px; float: left; }
.ranking_bg p { overflow: hidden; }


/*   医療ページ
=========================================================== */
table.table01 {
	width:100%;
	padding: 20px;
}
table.table01 tbody th {
	padding:0px 20px 20px 20px;
	vertical-align:middle;
	width: 170px;
}
table.table01 tbody td {
	padding:2px 0px 2px 5px;
	vertical-align:top;
	
	
}
 
@media screen and (max-width: 640px) {
table.table01 tbody th {
	display:block;
}
table.table01 tbody tr {
	display:block;
}

}

/*   ラインなしh1代用
=========================================================== */
.title_noboder { margin: 0 0 10px 10px; }

.demo1{
  width: 100px;
  margin: 0 auto;
  
  border: 1px solid #000;
}

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

.demo2{
  width: 250px;
  margin: 0 auto;
  
  border: 1px solid #000;
  padding: 10px;
  overflow: hidden;
}
.demo2-1{
  width: 123px;
  float: left;
  
  border: 1px solid #000;
}
.demo2-2{
  width: 123px;
  float: left;

  border: 1px solid #000;
}

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

.demo3{
  width: 250px;
  margin: 0 auto;
  
  border: 1px solid #000;
  padding: 10px;
  overflow: hidden;
}
.demo3-1{
  width: 123px;
  float: left;
  
  border: 1px solid #000;
  margin: 0;
  padding: 0;
}
.demo3-1 li{
  list-style: none;
}
.demo3-2{
  width: 125px;
  float: left;
  
  border: 1px solid #000;
  border-collapse: collapse;
}
.demo3-2 td{
  padding: 0;
}


.manseki {
	float:right;
	font-size: 12px;
	font-weight: 400;
	color: #ffffff;
	padding: 1px 8px;
	background: -moz-linear-gradient(
		top,
		#f00000 0%,
		#cf0000);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#f00000),
		to(#cf0000));
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #000000;
	-moz-box-shadow:
		0px 1px 3px rgba(000,000,000,0.3),
		inset 0px 0px 1px rgba(255,255,255,0.6);
	-webkit-box-shadow:
		0px 1px 3px rgba(000,000,000,0.3),
		inset 0px 0px 1px rgba(255,255,255,0.6);
	box-shadow:
		0px 1px 3px rgba(000,000,000,0.3),
		inset 0px 0px 1px rgba(255,255,255,0.6);
	text-shadow:
		0px -1px 0px rgba(000,000,000,1),
		0px 1px 0px rgba(255,255,255,0.2);
}



/*   スキル育成マップ　ビジネススキル編
=========================================================== */
.btn_bizskill { padding: 15px 0px; width:410px; font-weight: bold; text-align: center; display: inline-block; text-decoration: none !important; font-size: 16px; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; letter-spacing: 2px; }

.btn_bizskill01 { background-color: #ed928a; color: #fff !important; float: left;}
.btn_bizskill:hover { opacity: 1.0; }

.btn_bizskill02 { background-color: #bfbfbf; color: #898989 !important; float: right;}
.btn_bizskill02:hover { background-color: #73b757; color: #fff !important; }


.itskill_list{ margin-left:20px; }

/*   Iスキル

=========================================================== */
.btn_itskill { padding: 15px 0px; width:410px; font-weight: bold; display: inline-block; text-decoration: none !important; text-align: center; font-size: 16px; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; letter-spacing: 2px; }

.btn_itskill01 { background-color: #73b757; color: #fff !important; float: right;}
.btn_itskill:hover { opacity: 1.0; }

.btn_itskill02 { background-color: #bfbfbf; color: #898989 !important; float: left;}
.btn_itskill02:hover { background-color: #ed928a; color: #fff !important; }

/*   囲み線
=========================================================== */
.normal_kakomi {
 margin: 1em auto;  
 font-size: 1.1em;
 padding: 1em;
 width: 100%; /*幅の調節*/
 color: #666666; /*文字色*/
 border: 2px solid #ccc; /*線の太さ・色*/
 border-radius: 10px; /*角の丸み*/ 
}

/*   囲み
=========================================================== */
.gray_kakomi {
margin: 1em auto;
font-size: 1em;
padding: 0.5em;
font-weight: bold;
width: 100%; /*幅の調節*/
color: #666666; /*文字色*/
background-color:#DEDDDD ; /*背景色*/
border-radius: 10px; /*角の丸み*/
text-align:center;

}

.gray_kakomi_left {
margin: 1em auto;
font-size: 0.9em;
padding: 1em;
font-weight: bold;
width: 100%; /*幅の調節*/
color: #666666; /*文字色*/
background-color:#DEDDDD ; /*背景色*/
border-radius: 10px; /*角の丸み*/

}

/*   オリンパス会社プロフィールのテーブル
=========================================================== */

table.c_pro {
	border-collapse: collapse;
	width:100%;
}
table.c_pro th.t_top {
    border-top: #e1b347 4px solid;
}
table.c_pro th {
	border-bottom: #e3e3e3 1px dotted;
	text-align: left;
	background: #f7f7f7;
	padding: 10px;
	font-weight: normal;
}
table.c_pro td.t_top {
	border-top: #b3b3b3 4px solid;
}
table.c_pro td {
	border-bottom: #e3e3e3 1px dotted;
	text-align: left;
	padding: 10px;
}


	.box_pro img {
		float:left;
	}

	.box_pro p{
		overflow:hidden;
	}
	

.hoge img {
    float: left; padding-right: 10px; vertical-align: middle
}
.hoge p {
    overflow: hidden;
}

/* サテライト
=========================================================== */
img.satellitemaps{ width: 60%; float:left;}
div.centeringTest p {
	display: table-cell;
	vertical-align: middle;
	margin: 0;
}
.my-red {color: red}

a.greenButtun {
	-moz-box-shadow:inset 0px 1px 0px 0px #a4e271;
	-webkit-box-shadow:inset 0px 1px 0px 0px #a4e271;
	box-shadow:inset 0px 1px 0px 0px #a4e271;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #89c403), color-stop(1, #77a809));
	background:-moz-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-webkit-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-o-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-ms-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:linear-gradient(to bottom, #89c403 5%, #77a809 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#89c403', endColorstr='#77a809',GradientType=0);
	background-color:#89c403;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #74b807;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:16px;
	font-weight:bold;
	padding:12px 28px;
	text-decoration:none;
	text-shadow:0px 1px 0px #528009;
}
.greenButtun:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #77a809), color-stop(1, #89c403));
	background:-moz-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:-webkit-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:-o-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:-ms-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:linear-gradient(to bottom, #77a809 5%, #89c403 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77a809', endColorstr='#89c403',GradientType=0);
	background-color:#77a809;
}
.greenButtun:active {
	position:relative;
	top:1px;
}

/*  サテライト福岡の表
=========================================================== */
/* --- 表全体 --- */
table.templateFu { width: 100%; /* 表の幅 */ border: 1px #c0c0c0 solid; /* 大枠の境界線 */ border-collapse: collapse; box-sizing: border-box;}

/* --- 表タイトル --- */
table.templateFu caption { padding-bottom: 5px; /* 表タイトルの下パディング */ }

/* --- セル --- */
table.templateFu th,
table.templateFu td { padding: 4px 8px; /* セルのパディング（上下、左右） */ border: 1px #c0c0c0 solid; /* セルの境界線 */ }

/* --- 見出しセル --- */
table.templateFu thead th { background-color: #036; /* 見出しセルの背景色 */ font-weight: bold; text-align: center; color: #FFF; }
table.templateFu thead th:nth-child(1) { width:9%; text-align: center; vertical-align: middle; white-space: nowrap; }
table.templateFu thead th:nth-child(2) { width:50%; vertical-align: middle; word-break: break-all; }
table.templateFu thead th:nth-child(3) { width:7%; text-align: center; vertical-align: middle; white-space: nowrap; }
table.templateFu thead th:nth-child(4) { width:14%; vertical-align: middle; white-space: nowrap;}
table.templateFu thead th:nth-child(5) { width:20%; vertical-align: middle; text-align: center; }

/* --- 表ボディ --- */
table.templateFu tbody { background-color: #ffffff; /* ボディの背景色 */ }

/* --- マウスオーバー時 --- */
table.templateFu tbody tr:hover { background-color: #e5e5e5; /* 行の背景色 */ }
table.templateFu tr td:nth-child(1) { width:9%; text-align: center; vertical-align: middle; white-space: nowrap; }
table.templateFu tr td:nth-child(2) { width:50%; vertical-align: middle;  word-break: break-all; }
table.templateFu tr td:nth-child(3) { width:7%; text-align: center; vertical-align: middle; white-space: nowrap; }
table.templateFu tr td:nth-child(4) { width:14%; vertical-align: middle; text-align: right; } 
table.templateFu tr td:nth-child(5) { width:20%; vertical-align: middle; text-align: center; word-break: break-all; }

.satellit_textS { font-size:0.8em; line-height: 1.1em; }

/*  グレー角丸の囲い枠
=========================================================== */
.il_kakomi {
 margin: 0.6em auto;  
 font-size: 1em;
 padding: 0.6em 1em;
 width: 100%; /*幅の調節*/
 color: #666666; /*文字色*/
 background-color: #f7f7f7; /*背景色*/
 border: 2px solid #ccc; /*線の太さ・色*/
 border-radius: 10px; /*角の丸み*/ 
}

.il_kakomi2 {
 margin: 0.6em auto;  
 font-size: 1em;
 padding: 0.6em 1em;
 width: 100%; /*幅の調節*/
 border: 2px solid #ccc; /*線の太さ・色*/
 color: #666666; /*文字色*/
 border-radius: 10px; /*角の丸み*/ 
}

/*  アイ・ラーニングの特長
=========================================================== */
.box17{
    margin:2em 0;
    position: relative;
    padding: 0.5em 1.5em;
    border-top: solid 2px #0068b7;
    border-bottom: solid 2px #0068b7;
}
.box17:before, .box17:after{
    content: '';
    position: absolute;
    top: -10px;
    width: 2px;
    height: -webkit-calc(100% + 20px);
    height: calc(100% + 20px);
    background-color: #0068b7;
}
.box17:before {left: 10px;}
.box17:after {right: 10px;}
.box17 p {
    margin: 0; 
    padding: 0;
}

/* 会社概要のテーブル
=========================================================== */

table.c_il {
	border-collapse: collapse;
	width:100%;
	font-size: 14px !important;
}
table.c_il th.t_top {
    border-top: #1848a5 4px solid;
}	
table.c_il th.t_top2 {
    border-top: #b3b3b3 4px solid;
	
}
table.c_il th {
	border-bottom: #e3e3e3 1px dotted;
	text-align: left;
	background: #f7f7f7;
	padding: 10px;
	font-weight: normal;
}
table.c_il td.t_top {
	border-top: #b3b3b3 4px solid;
}
table.c_il td {
	border-bottom: #e3e3e3 1px dotted;
	text-align: left;
	padding: 10px;
}

/*   講演プログラム/東京
=========================================================== */
/* --- 表全体 --- */
table.privacyhandle { width: 100%; /* 表の幅 */ border: 1px #c0c0c0 solid; /* 大枠の境界線 */ border-collapse: collapse; background-color: #fff; font-size:14px; margin: 0; }

/* --- 表タイトル --- */
table.privacyhandle caption { padding-bottom: 5px; /* 表タイトルの下パディング */ }

/* --- セル --- */
table.privacyhandle th,
table.privacyhandle td { padding: 8px 14px; /* セルのパディング（上下、左右） */ border: 1px #c0c0c0 solid; /* セルの境界線 */ font-size:14px; }

/* --- 見出しセル --- */
table.privacyhandle thead th { background-color: #eeeeee; /* 見出しセルの背景色 */ font-weight: bold; text-align: center;  padding: 8px 14px; font-size:14px; }
table.privacyhandle thead th:nth-child(1) { width:35%; text-align: center; vertical-align: middle; font-size:14px; }
table.privacyhandle thead th:nth-child(2) { width:65%; vertical-align: middle; }

/* --- 表ボディ --- */
table.privacyhandle tbody { background-color: #ffffff; /* ボディの背景色 */ color:#000;font-size:14px;  }


table.privacyhandle p { margin: 0; font-size:16px; }
table.privacyhandle p.pt-6{ padding-top: 6px!important; }
table.privacyhandle p.pt-3{ padding-top: 3px!important; }


/*   ラーナビリティ　囲み枠
=========================================================== */
ul.foo {
    display:table;
    table-layout:fixed;
    padding-bottom: 16px;
	width:85%;
}
ul.foo li {
    display:table-cell;
    vertical-align:middle;
    padding: 10px 15px 10px 8px;
    border-left:1px solid white;
	text-align: left;
}
ul.foo li:nth-child(1)  {
    border:none;  
	background-color:#cadfb7;
	width:48%;
}
ul.foo li:nth-child(2)  {
    border:none;  
	width:16%;
	padding: 0px 10px 0px 25px;
}
ul.foo li:nth-child(3)  {
    border:none;  
	background-color:#eb9388;
	width:43%;
}
ul.foo li a {
    display:block;
    text-decoration:none;
}

@media screen and (max-width : 481px ){

ul.foo {
	width: 100%;
}

ul.foo li:nth-child(1)  {
    border:none;  
	background-color:#cadfb7;
	width:37%;
}
ul.foo li:nth-child(2)  {
    border:none;  
	width:26%;
	padding: 0px 10px 0px 15px;
}
ul.foo li:nth-child(3)  {
    border:none;  
	background-color:#eb9388;
	width:37%;
}
}

/*   ラーナビリティ　囲み枠二段目
=========================================================== */
ul.foo2 {
    display:table;
    table-layout:fixed;
    padding-bottom: 16px;
	width: 85%;
	font-size: 1.2em;
	font-weight: bold;
}
ul.foo2 li {
    display:table-cell;
    vertical-align:middle;
    padding: 10px 15px 10px 8px;
    border-left:1px solid white;
	text-align: left;
}
ul.foo2 li:nth-child(1)  {
    border:none;  
	background-color:#b0cf95;
	width:48%;
}
ul.foo2 li:nth-child(2)  {
    border:none;  
	width:16%;
	padding: 0px 10px 0px 25px;
}
ul.foo2 li:nth-child(3)  {
    border:none;  
	background-color:#da6d5c;
	width:43%;
}
ul.foo2 li a {
    display:block;
    text-decoration:none;
}

@media screen and (max-width : 481px ){
ul.foo2 {
	width: 100%;
}

ul.foo2 li:nth-child(1)  {
    border:none;  
	background-color:#cadfb7;
	width:37%;
}
ul.foo2 li:nth-child(2)  {
    border:none;  
	width:26%;
	padding: 0px 10px 0px 15px;
}
ul.foo2 li:nth-child(3)  {
    border:none;  
	background-color:#eb9388;
	width:37%;
}
}

/*   ラーナビリティ　タイトル
=========================================================== */
ul.foo3 {
    display:table;
    table-layout:fixed;
    padding-bottom: 5px;
	width: 85%;
	font-weight: bold;
}
ul.foo3 li {
    display:table-cell;
    vertical-align:middle;
    border-left:1px solid white;
	text-align: center;
}
ul.foo3 li:nth-child(1)  {
	width:48%;
}
ul.foo3 li:nth-child(2)  { 
	width:16%;
}
ul.foo3 li:nth-child(3)  {
	width:43%;
}
ul.foo3 li a {
    display:block;
    text-decoration:none;
}

@media screen and (max-width : 481px ){

ul.foo3 {
	width: 100%;
}

ul.foo3 li:nth-child(1)  {
    border:none;  
	width:37%;
}
ul.foo3 li:nth-child(2)  {
    border:none;  
	width:26%;
}
ul.foo3 li:nth-child(3)  {
    border:none;  
	width:37%;
}
}

/*   ラーナビリティ　矢印
=========================================================== */
.arrow {
  display:inline-block;
  height:20px;
  width:25px;
  background-color:#5bc0de;
  position:relative;
  top:0px;
}

.arrow:before {
  position:absolute;
  content:"";
  width:0;
  height:0;
  border:25px solid transparent;
  border-left:30px solid #5bc0de;
  left:23px;
  top:-15px;
}

/*   カラーの囲み枠
=========================================================== */

.il_btnblue { padding: 10px 20px; font-size:1.4em; letter-spacing: 2px; text-align: center; color: #FFF; background: #4f71be; border-radius: 10px; width: 80%; }

/*   ラーナビリティ　オレンジの囲み枠
=========================================================== */

.il_btnora { padding: 5px 20px; font-size:1.2em; letter-spacing: 2px; color: #FFF; background: #f7a62c; border-radius: 10px; font-weight: bold; }

/*   オンライン　青い囲み枠
=========================================================== */

.il_btblue { padding: 5px 20px; font-size:1.2em; letter-spacing: 2px; color: #FFF; background: #04aacb; border-radius: 10px; font-weight: bold; }

/*   SOD　青い囲み枠
=========================================================== */

.il_btbblue { padding: 5px 20px; font-size:1.2em; letter-spacing: 2px; color: #FFF; background: #0f6fc6; border-radius: 10px; font-weight: bold; }

/*   SOD　濃い青い囲み枠
=========================================================== */

.il_btdblue { padding: 5px 20px; font-size:1.2em; letter-spacing: 2px; color: #FFF; background: #04093e; border-radius: 10px; font-weight: bold; }

/*   マイラ　緑囲み枠
=========================================================== */

.il_btngreen { padding: 5px 20px; font-size:1.2em; letter-spacing: 2px; color: #FFF; background: #288f3a; border-radius: 10px; font-weight: bold; }

/*   リストを表示させる　il
=========================================================== */
ul.ilon li {
  position: relative;
  margin: 0px 0px 0px 30px;
}
ul.ilon li::after {
  display: block;
  content: '';
  position: absolute;
  top: .5em;
  left: -1em;
  width: 6px;
  height: 6px;
  background-color: #666;
  border-radius: 100%;
  text-indent: -2em;  
}

/*   リストを表示させる　il 黒
=========================================================== */
ul.ilonB li {
  position: relative;
  margin: 0px 0px 0px 30px;
}
ul.ilonB li::after {
  display: block;
  content: '';
  position: absolute;
  top: .5em;
  left: -1em;
  width: 6px;
  height: 6px;
  background-color: #000;
  border-radius: 100%;
  text-indent: -2em;  
}


/*   リストを表示させる　ol①
=========================================================== */
ol.ilonol {
  position: relative;
  margin: 0px 0px 0px 10px;
}
ol.ilonol li  {
  list-style: decimal;
}
ol.ilonol li span {
  position: absolute;
  vertical-align: middle;
}


/*   リストを表示させる　ol
=========================================================== */
ol.ilonol2 {
  position: relative;
  margin: 0px 0px 0px 10px;
}
ol.ilonol2 li  {
  list-style: decimal;
}

.vmiddle div {
    display: table-cell;
    vertical-align: middle;
}

/*   リストを表示させる　インデントあり
=========================================================== */
ol.ilonol3 {
  position: relative;
  margin: 0px 0px 0px 50px;
}
ol.ilonol3 li  {
  list-style: decimal;
  list-style-position: outside;
  
}

/*   リストを表示させる　インデントあり
=========================================================== */
ol.ilonol4 {
  position: relative;
  margin: 0px 0px 0px 30px;
}
ol.ilonol4 li  {
  list-style: decimal;
  list-style-position: outside;
  
}

/*   リストを表示させる　インデントあり
=========================================================== */
ol.ilonol5 {
  margin: 0;
  padding: 0
}
ol.ilonol5 li  {
  list-style: none;
  padding-left: 0.4em;
  text-indent: -0.4em;
}


/*   写真を角丸にする
=========================================================== */
.border_radius {
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
}

/*   ラーナビリティテーブル
=========================================================== */

.il820 hr {
  border-top: 1px dashed #bbb; marigin-top:10px; margin-bottom: 10px; width:100%;
}

.il820_nomargin hr {
  border-top: 1px dashed #bbb; pinkwidth:100%;
}

.il820_solid hr {
  border-top: 2px solid #bbb; marigin-top:10px; margin-bottom: 10px; width:100%;
}

.il820_solid_nomargin hr {
  border-top: 2px solid #555151; pinkwidth:100%;
}

.colorboder hr {
  border-top: 1px dashed #bbb; marigin: 0; width:100%;
}

table.lbcourse {
  width: auto;
  border-spacing: 0;
  font-size:14px;
  border:1px solid #84b2e0;
}
table.lbcourse th {
  color: #fff;
  padding: 8px 15px;
  background: #258;
  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;
  line-height: 120%;
  text-align: center;
}
table.lbcourse td:first-child {
  border-top:1px solid #84b2e0;
  text-align: center;
}
table.lbcourse td:last-child {
  border-right:1px solid #84b2e0;
  border-top:1px solid #84b2e0;
  text-align: left;
}
table.lbcourse tr td {
  padding: 8px 15px;
  border-bottom: 1px solid #84b2e0;
  border-left: 1px solid #84b2e0;
  
}
table.lbcourse tr td:last-child {
  border-right: 1px solid #84b2e0;

}
table.lbcourse tr {
  background: #fff;
}
table.lbcourse.lbcourse tr:nth-child(2n+1) {
  background: #f1f6fc;


}
table.lbcourse tr:hover {
  background: #bbd4ee;
  cursor:pointer;
}



/*   新規改定コース　申し込みボタン
=========================================================== */
a.cp_btn {
	position: relative;
	display: block;
	width: 140px;
	padding: 0.3em;
	text-align: center;
	text-decoration: none;
	color: #FFF;
	background: #f8bd1a;
	border-bottom: 2px solid #d5a725;
	border-radius: 6px;
	box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
	font-size: 1.2em;
	font-weight: bold;
}
a.cp_btn:active {
	border-bottom: 2px solid #f8bd1a;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}


img.tapi { float: left; vertical-align: middle; padding:0 10px; }
p.vm { padding-top: 10px; font-size: 1.2em; font-weight: bold;}

/*  DX人財育成の表
=========================================================== */
/* --- 表全体 --- */
table.templateDX { width: 100%; /* 表の幅 */ border: 1px #c0c0c0 solid; /* 大枠の境界線 */ border-collapse: collapse; margin: 5px 0; }

/* --- セル --- */
table.templateDX th,
table.templateDX td { padding: 8px 8px; /* セルのパディング（上下、左右） */ border: 1px #c0c0c0 solid; /* セルの境界線 */ }

/* --- 見出しセル --- */
table.templateDX thead th { background-color: #036; /* 見出しセルの背景色 */ font-weight: bold; text-align: center; color: #FFF; }

/* --- 表ボディ --- */
table.templateDX tbody { background-color: #ffffff; /* ボディの背景色 */ }

table.templateDX tr td:nth-child(1) { width:20%; text-align: center; vertical-align: middle; }
table.templateDX tr td:nth-child(2) { width:15%; text-align: center; vertical-align: middle; }
table.templateDX tr td:nth-child(3) { width:65%;  }


/*  透明テーブル
=========================================================== */
/* --- 表全体 --- */
table.DXimg { width: 100%; /* 表の幅 */ border: none; /* 大枠の境界線 */ border-collapse: collapse; margin: 5px 0; font-size: 1em!important; }

/* --- セル --- */
table.DXimg th,
table.DXimg td { padding: 8px 8px; /* セルのパディング（上下、左右） */ border: none; /* セルの境界線 */ font-size: 1em!important;}

/* --- 表ボディ --- */
table.DXimg tbody { background-color: #ffffff; /* ボディの背景色 */ }

table.DXimg tr td:nth-child(1) { text-align: left; vertical-align: middle; padding-top: 10px;}
table.DXimg tr td:nth-child(2) { vertical-align: top;}

@media screen and (max-width: 640px){
table.DXimg tr td { display: block; width: auto; }
table.DXimg tr td:nth-child(2) { width:80%; text-align: center; }
}

/*  透明テーブル
=========================================================== */
/* --- 表全体 --- */
table.lbimg { width: 100%; /* 表の幅 */ border: none; /* 大枠の境界線 */ border-collapse: collapse; margin: 5px 0; font-size: 1em!important; }

/* --- セル --- */
table.lbimg th,
table.lbimg td { padding: 8px 8px; /* セルのパディング（上下、左右） */ border: none; /* セルの境界線 */ font-size: 1em!important;}

/* --- 表ボディ --- */
table.lbimg tbody { background-color: #ffffff; /* ボディの背景色 */ }

table.lbimg tr td:nth-child(1) { text-align: left; vertical-align: middle; padding-top: 10px;}
table.lbimg tr td:nth-child(2) { vertical-align: top;}

@media screen and (max-width: 640px){
table.lbimg tr td { display: block; width: auto; }
}

/*  dx05
=========================================================== */
/* --- 表全体 --- */
table.DXimg05 { width: 100%; /* 表の幅 */ border: none; /* 大枠の境界線 */ border-collapse: collapse; }

/* --- セル --- */
table.DXimg05 th,
table.DXimg05 td { /* セルのパディング（上下、左右） */ border: none; /* セルの境界線 */ }

/* --- 表ボディ --- */
table.DXimg05 tbody { background-color: #ffffff; /* ボディの背景色 */ }

table.DXimg05 tr td:nth-child(1) { text-align: left; vertical-align: middle; padding-top: 10px; padding: 8px; }
table.DXimg05 tr td:nth-child(2) { text-align: left; vertical-align: top;}

@media screen and (max-width: 640px){
table.DXimg05 tr td { display: block; width: auto; }
table.DXimg05 tr td:nth-child(1) { width: 50%;}
}


/*  画像の調整（レスポンシブ）
=========================================================== */
img.resizeimage80 { width: 80%; }
@media only screen and (max-width: 800px) {
img.resizeimage80 { width: 100%; }
}

img.resizeimage90 { width: 90%; }
@media only screen and (max-width: 800px) {
img.resizeimage90 { width: 100%; }
}
/*  囲み線 オレンジ
=========================================================== */
.attenarea_o { margin: 0 0 20px ; padding: 1em 1em 0.5em; border: solid 1px #ab4e2a; }

/*  ランキング　お客様の声　　https://www.i-learning.jp/topics/ranking.html
=========================================================== */
.r_comments{
    padding: 0.5em 1em;
	text-align: center;
	width: 160px;
	font-weight: bold;
    margin: 1em 0;
    color: #48a7b8;
    background: whitesmoke;/*背景色*/
    border-left: double 7px #4ec4d3;/*左線*/
    border-right: double 7px #4ec4d3;/*右線*/
}
.r_comments p {
    margin: 0; 
    padding: 0;
}

@media screen and (max-width: 640px) {
    .r_comments { width: 100%; }
}

img.pt-top { padding-top:10px;}

/*  ランキング見出し　　https://www.i-learning.jp/topics/ranking.html
=========================================================== */
.ranking2019 {
  position: relative;
  padding: 0.5em;
  background: #a6d3c8;
  color: white;
  font-weight: bold;
  font-size: 1.2em;
  text-align: center;
}

.ranking2019::before {
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 15px transparent;
  border-right: solid 20px rgb(149, 158, 155);
}




/*  IBM portal　　https://www.i-learning.jp/topics/ranking.html
=========================================================== */
.f-container{
	display:flex;	
	flex-diretion: row;
	flex-wrap:wrap;
	justify-content: space-between;
	align-content: space-between;
}	
.f-item {
	width:180px;
  	height:60px;
	margin-bottom: 10px;
}

div.kakomi_g{ width:100%; padding:15px 20px; background:#efefef; text-align:left; font-size:1em; color: #777777; }


/*  DXリスト　/service/dx.html
=========================================================== */
.illist_s{
    display: flex;
}
.illist_s_left{
    padding: 0 0.5em 0 1em;
}
.illist_s_right{
    flex: 1;
}


/*  e-ラーニング表 /service/elearning.html
=========================================================== */
*, *:before, *:after {
	box-sizing: border-box;
}
.elcol_3{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.elcol_3 > div{
	width: 33.33333%;
	padding: 5px;

	font-weight: bold;
}
.elcol_3 > div > div{


	position: relative;
	overflow: hidden;
}

@media screen and (max-width: 960px) {
	.elcol_3 > div{
		width: 50%;
	}
}
@media screen and (max-width : 481px ){
	.elcol_3 > div{
		width: 100%;
	}
}

.elcol_1 > div{
	width: 100%;
	padding: 5px;

	font-weight: bold;
}
.elcol_1 > div > div{
	position: relative;
	overflow: hidden;
}


.elbox01 {
	text-align: center;
	vertical-align: middle;
	color: #FFF;
	font-weight: bolder;
    margin-top: 6px; 
	letter-spacing: 1px;
	font-size: 1em;
}

.elbox01 a {color: #FFF; }

.elbox02 {
	text-align: center;
	vertical-align: middle;
	color: #FFF;
	font-weight: bolder;
    margin-top: 16px; 
	letter-spacing: 1px;
	font-size: 1.1em;
}

.elbox02 a {color: #FFF; }

.elbox03 {
	text-align: center;
	vertical-align: middle;
	color: #FFF;
	font-weight: bolder;
    margin-top: 16px; 
	letter-spacing: 1px;
}

.elbox03 a {color: #FFF; }

.elbox04 {
	text-align: center;
	vertical-align: middle;
	color: #FFF;
	font-weight: bolder;
    margin: 16px 0; 
	letter-spacing: 1px;
}

.elbox04 a {color: #FFF; }


div.elearningbg01 {	background: #e07d84; border-radius: 5px; height:50px; font-size: 0.9em; }
div.elearningbg02 {	background: #6da9d7; border-radius: 5px; height:70px;}
div.nhbox { background: #a4ca3f; border-radius: 5px; min-height:70px;}
div.inquiry_nh { background: #c5ad92; border-radius: 5px; height:70px;}

/* オンライン研修 /service/it/topics/centra.html
=========================================================== */
a.orangeButtun {
	-moz-box-shadow:inset 0px 1px 0px 0px #e2b971;
	-webkit-box-shadow:inset 0px 1px 0px 0px #e2b971;
	box-shadow:inset 0px 1px 0px 0px #e2b971;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #eb961c), color-stop(1, #d6801a));
	background:-moz-linear-gradient(top, #eb961c 5%, #d6801a 100%);
	background:-webkit-linear-gradient(top, #eb961c 5%, #d6801a 100%);
	background:-o-linear-gradient(top, #eb961c 5%, #d6801a 100%);
	background:-ms-linear-gradient(top, #eb961c 5%, #d6801a 100%);
	background:linear-gradient(to bottom, #eb961c 5%, #d6801a 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eb961c', endColorstr='#d6801a',GradientType=0);
	background-color:#eb961c;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #d27f07;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:16px;
	font-weight:bold;
	padding:12px 28px;
	text-decoration:none;
	text-shadow:0px 1px 0px #a97505;
}
.orangeButtun:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #d6801a), color-stop(1, #eb961c));
	background:-moz-linear-gradient(top, #d6801a 5%, #eb961c 100%);
	background:-webkit-linear-gradient(top, #d6801a 5%, #eb961c 100%);
	background:-o-linear-gradient(top, #d6801a 5%, #eb961c 100%);
	background:-ms-linear-gradient(top, #d6801a 5%, #eb961c 100%);
	background:linear-gradient(to bottom, #d6801a 5%, #eb961c 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d6801a', endColorstr='#eb961c',GradientType=0);
	background-color:#d6801a;
}
.orangeButtun:active {
	position:relative;
	top:1px;
}

/*  SODタブ /service/elearning.html
=========================================================== */
*, *:before, *:after {
	box-sizing: border-box;
}
.tub_3{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.tub_3 > div{
	width: 33.33333%;
	padding: 0 5px;

	font-weight: bold;
}
.tub_3 > div > div{


	position: relative;
	overflow: hidden;
}


@media screen and (max-width : 481px ){
	.tub_3 > div{
		width: 100%;
        padding: 5px;
	}
}

.tub01 {
	text-align: center;
	vertical-align: middle;
	font-weight: bolder;
    margin-top: 10px; 
	letter-spacing: 1px;
	font-size: 1em;
}
.tub01 a {color: #FFF; }


div.tubnor { background: #c5cbd0;  border-radius: 10px 10px 0 0; height:50px; color: #0f6fc6; }
div.tubhigh { background: #0f6fc6;  border-radius: 10px 10px 0 0; height:50px; color: #fff; }


hr.il820tub { border: 2px solid; marigin:0 ; border-color:#0f6fc6; width:100%; margin: 0px; padding: 0px; }


/* ITスキル　IT/IBM //service/it.html
=========================================================== */
*, *:before, *:after {
	box-sizing: border-box;
}
.itlcol_2{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.itlcol_2 > div{
	width: 50%;
	padding: 0px;
    font-weight: bold;
}
.itlcol_2 > div > div{


	position: relative;
	overflow: hidden;
}

@media screen and (max-width: 960px) {
	.itlcol_2 > div{
		width: 50%;
	}
}
@media screen and (max-width : 481px ){
	.itlcol_2 > div{
		width: 100%;
	}
}

.itb {
	text-align: center;
	vertical-align: middle;
	color: #FFF;
	font-weight: bolder;
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; 
    letter-spacing: 2px;
    padding: 1em 0;
    font-size: 1.2em; 
    margin-top: 16px;
    background-color: #95ab41;
    height: 70px;
}

.itb a {color: #FFF; }

.itb02 {
	text-align: center;
	vertical-align: middle;
	color: #898989;
	font-weight: bolder;
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; 
    letter-spacing: 2px;
    padding: 1em 0;
    font-size: 1.2em; 
    margin-top: 16px;
    background-color: #bfbfbf;
    height: 70px;
}
.itb02 a {color: #FFF; }
.itb02:hover { background-color: #95ab41; color: #fff !important; }

.ibmb {
	text-align: center;
	vertical-align: middle;
    color: #898989;
	font-weight: bolder;
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; 
	letter-spacing: 2px;
    padding: 1em 0;
	font-size: 1.2em;
    margin-top: 16px;
    background-color: #bfbfbf;
    height: 70px;
}

.ibmb02 {
	text-align: center;
	vertical-align: middle;
    color: #FFF;
	font-weight: bolder;
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; 
	letter-spacing: 2px;
    padding: 1em 0;
	font-size: 1.2em;
    margin-top: 16px;
    background-color: #848cb9;
    height: 70px;
}
.ibmb02 a {color: #FFF; }

.ibmb a {color: #FFF; }
.ibmb:hover { background-color: #848cb9; color: #fff !important; }



/* お問い合わせ
=========================================================== */
.faq {
	text-align: center;
	vertical-align: middle;
	color: #FFF;
	font-weight: bolder;
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; 
    letter-spacing: 2px;
    padding: 1em 0;
    font-size: 1.2em; 
    margin-top: 16px;
    background-color: #f29c9f;
    height: 70px;
}

.faq a {color: #FFF; }

.faq02 {
	text-align: center;
	vertical-align: middle;
	color: #898989;
	font-weight: bolder;
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; 
    letter-spacing: 2px;
    padding: 1em 0;
    font-size: 1.2em; 
    margin-top: 16px;
    background-color: #bfbfbf;
    height: 70px;
}
.faq02 a {color: #FFF; }
.faq02:hover { background-color: #f29c9f; color: #fff !important; }

.cont {
	text-align: center;
	vertical-align: middle;
    color: #898989;
	font-weight: bolder;
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; 
	letter-spacing: 2px;
    padding: 1em 0;
	font-size: 1.2em;
    margin-top: 16px;
    background-color: #bfbfbf;
    height: 70px;
}

.cont02 {
	text-align: center;
	vertical-align: middle;
    color: #FFF;
	font-weight: bolder;
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; 
	letter-spacing: 2px;
    padding: 1em 0;
	font-size: 1.2em;
    margin-top: 16px;
    background-color: #85a8c7;
    height: 70px;
}
.cont02 a {color: #FFF; }

.cont a {color: #FFF; }
.cont:hover { background-color: #85a8c7; color: #fff !important; }

h3.pt-10 {padding-top: 10pt;}

/* アカウント+
=========================================================== */
.apbox01 {
    padding: 1.2em 1.4em;
    margin: 1.5em 0;
    color: #282828;/*文字色*/
    background: #edf3db;
    border: none;
    border-radius: 20px;/*角の丸み*/
    width: 100%;
    text-align: left;
}
.apbox01 p {
    margin: 0; 
    padding: 0;
}

@media only screen and (max-width: 480px) {
.apbox01 {
    width: 100%; }
}



.apbox02 {
    padding: 1.2em 1.4em;
    margin: 1.5em 0;
    color: #282828;/*文字色*/
    background: #99cee9;
    border: none;
    width: 100%;
    text-align: left;
}

.apbox02 p {
    margin: 0; 
    padding: 0;
}
@media only screen and (max-width: 480px) {
.apbox02 {
    width: 100%; }
}

.apbox03 {
    padding: 1.2em 1.4em;
    margin: 1.5em 0;
    color: #282828;/*文字色*/
    background: #bbe0f0;
    border: none;
    border-radius: 20px;/*角の丸み*/
    width: 100%;
    text-align: left;
}
.apbox03 p {
    margin: 0; 
    padding: 0;
}

@media only screen and (max-width: 480px) {
.apbox03 {
    width: 100%; }
}


/*ローコード開発ツールGeneXus（ジェネクサス）研修
=========================================================== */
.genebox01 {
    padding: 1.2em 1.4em;
    margin: 1.5em 0;
    color: #FFFFFF;/*文字色*/
    background: #d7155d;
    border: none;
    border-radius: 20px;/*角の丸み*/
    width: 100%;
    text-align: left;
}
.genebox01 p {
    margin: 0; 
    padding: 0;
}


*, *:before, *:after {
	box-sizing: border-box;
}
.genebox02{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.genebox02 > div{
	width: 33.33333%;
    padding:5px;
}
.genebox02 > div > div{
    
    height: 280px;
	position: relative;
	overflow: hidden;
	border-radius: 5px;
}

@media screen and (max-width: 960px) {
	.genebox02 > div{
		width: 50%;
	}
}
@media screen and (max-width : 481px ){
	.genebox02 > div{
		width: 100%;
        
	}
    .genebox02 > div > div{
    height: 100%;
	position: relative;
	overflow: hidden;
	border-radius: 5px;
}
}


.gene {
	text-align: left;
	color: #FFF;
    letter-spacing: 1px;
}

div.gene_01 { background: #406aab; padding: 10px 15px; line-height: 1.4em;}
div.gene_02 { background: #13ae67; padding: 10px 15px; line-height: 1.4em;}
div.gene_03 { background: #00a29a; padding: 10px 15px; line-height: 1.4em;}
div.gene_04 { background: #e07d00; padding: 10px 15px; line-height: 1.4em;}
div.gene_05 { background: #ea5514; padding: 10px 15px; line-height: 1.4em;}
div.gene_06 { background: #7a6a56; padding: 10px 15px; line-height: 1.4em;}

@media screen and (min-width: 768) {
  .sp_br{
    display: none;
  }
}

@media screen and (max-width: 768) {
  .pc_br{
    display: none;
  }
}



/* GODX+
=========================================================== */
.apbox_blue {
    padding: 1.2em 1.4em;
    margin: 1.5em 0;
    color: #FFF;/*文字色*/
    background: #4266ab;
    border: none;
    border-radius: 20px;/*角の丸み*/
    width: 100%;
    text-align: left;
}
.apbox_blue p {
    margin: 0; 
    padding: 0;
}

.apbox_red {
    padding: 1.2em 1.4em;
    margin: 1.5em 0;
    color: #FFF;/*文字色*/
    background: #d9344b;
    border: none;
    border-radius: 20px;/*角の丸み*/
    width: 100%;
    text-align: left;
}
.apbox_red p {
    margin: 0; 
    padding: 0;
}

.apbox_cream {
    padding: 1.2em 2em;
    margin: 1.5em 0;
    background: #fff2cc;
    border: none;
    border-radius: 20px;/*角の丸み*/
    width: 100%;
    text-align: left;
}

.apbox_green {
    padding: 1.2em 2em;
    margin: 1.5em 0;
    background: #e8f3da;
    border: none;
    border-radius: 20px;/*角の丸み*/
    width: 100%;
    text-align: left;
}


blockquote {
    margin: 10px;
    padding: 5px 9em;
    color: #737070;
}

.hr_box {
    padding: 1.5em;
    margin: 2em 0;
    border: solid 2px #aaaaaa;
}
.hr_box p {
    margin: 0; 
    padding: 0;
}

.ilbg {background-color: #e9ecf5; padding: 10px 15px; }

/* ilスクエア　タイトル囲み
=========================================================== */

.ils_fra_rblue { padding: 0px 15px; font-size:1.2em; letter-spacing: 2px; color: #0a5882; background: #b2e1fa; border-radius: 10px; font-weight: bold; }
.ils_fra_rgreen { padding: 0px 15px; font-size:1.2em; letter-spacing: 2px; color: #2d3b2d; background: #b2e2bd; border-radius: 10px; font-weight: bold; }
.ils_fra_rora { padding: 0px 15px; font-size:1.2em; letter-spacing: 2px; color: #8f5c19; background: #ffddb0; border-radius: 10px; font-weight: bold; }
.ils_fra_rpink { padding: 0px 15px; font-size:1.2em; letter-spacing: 2px; color: #994653; background: #ffada9; border-radius: 10px; font-weight: bold; }
.ils_fra_ryellow { padding: 0px 15px; font-size:1.2em; letter-spacing: 2px; color: #6e6e09; background: #ffffa2; border-radius: 10px; font-weight: bold; }
.ils_fra_rbg { padding: 0px 15px; font-size:1.2em; letter-spacing: 2px; color: #2d4849; background: #55a5b1; border-radius: 10px; font-weight: bold; }
.ils_fra_rpurple { padding: 0px 15px; font-size:1.2em; letter-spacing: 2px; color: #412f4e; background: #cab1dc; border-radius: 10px; font-weight: bold; }
.ils_fra_rgrey { padding: 0px 15px; font-size:1.2em; letter-spacing: 2px; color: #605c5c; background: #e9e9e9; border-radius: 10px; font-weight: bold; }


/* 事例囲み
=========================================================== */
.jirei_box {
    padding: 0.5em 1em;
    margin: 0.5em 0em 1em 0em;
    border: solid 2px #d3d4d5;
    width : 95%;
}
.jirei_box p {
    margin: 0; 
    padding: 0;
}

/*   ITスキル　メニューリスト
=========================================================== */
div.myla_anchor{ width:100%; padding:15px 10px; margin-top: 5px; background:#edeadb; text-align:left; font-size:1em; color: #777777; }
div.myla_anchor ul { width:100%;  }
div.myla_anchor ul li{ margin:0 20px 8px 0; padding-left:20px; display:inline-block; display:inline;/*IE7*/zoom:1;/*IE7*/ zoom:1; }
div.myla_anchor a { color:#39351f; }
div.myla_anchor a:hover { color:#9abb1a; }

/*   hr
=========================================================== */

hr.il820  {
  border-top: 1px dashed #bbb; marigin-top:10px; margin-bottom: 10px; width:100%;
}

hr.il820_nomargin {
  border-top: 1px dashed #bbb; pinkwidth:100%;
}

hr.il820_solid1 {
  border-top: 1px solid #bbb; marigin-top:10px; margin-bottom: 10px; width:100%;
}

hr.il820_solid2 {
  border-top: 2px solid #bbb; marigin-top:10px; margin-bottom: 10px; width:100%;
}

hr.il820_solid_nomargin {
  border-top: 2px solid #555151; pinkwidth:100%;
}

hr.colorboder {
  border-top: 1px dashed #bbb; marigin: 0; width:100%;
}


/*   PM
=========================================================== */
.normal-box2{
  padding: 1em;
  background-color: #6da9d7;
  border-radius: 10px;
}

.normal-box2 p{
  margin: 0;
  padding: 0;
  vertical-align: middle;
  color: #FFF;  
  font-weight: bolder;
  letter-spacing: 1px;
  font-size: 1.1em;
}

.normal-box2 p a {color: #FFF; }



/* アイラーニングのデジタル化宣言
=========================================================== */
.digitalization2021_box2 {
    padding: 1em 1.5em;
    margin: 2em 0;
    font-weight: bold;
    background: #FFF;
    border: solid 3px #53ad18;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.digitalization2021_box2 p {
    margin: 0; 
    padding: 0;
}

/* 若手DX+
=========================================================== */
.apbox_lightblue {
    padding: 1.2em 1.4em;
    margin: 1.5em 0;
    background: #d7eff5;
    border: none;
    border-radius: 20px;/*角の丸み*/
    width: 100%;
    text-align: left;
}
.apbox_ightblue p {
    margin: 0; 
    padding: 0;
}

ul.ilul li { margin-left: 20px; list-style: square; }

/* 研修事例囲み線
=========================================================== */
.case_box1 {
    padding: 1em 1em;
    margin: 2em 0;
    font-weight: bold;
    background: #FFF;
    border: solid 3px #84aab4;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.case.box1 p {
    margin: 0; 
    padding: 0;
}

.case_boxtext1 { color:#7499a3; }

.case_box2 {
    padding: 1em 1em;
    margin: 2em 0;
    font-weight: bold;
    background: #FFF;
    border: solid 3px #b88099;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.case.box2 p {
    margin: 0; 
    padding: 0;
}

.case_boxtext2 { color:#b88099; }

.case_box3 {
    padding: 1em 1em;
    margin: 2em 0;
    font-weight: bold;
    background: #FFF;
    border: solid 3px #84aab4;/*線*/
    border-radius: 10px;/*角の丸み*/
		}
.case.box3 p {
    margin: 0; 
    padding: 0;
}

.case_boxtext3 { color:#7499a3; }

.case_box4 {
    padding: 1em 1em;
    margin: 2em 0;
    font-weight: bold;
    background: #FFF;
    border: solid 3px #c39b6f;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.case.box4 p {
    margin: 0; 
    padding: 0;
}

.case_boxtext4 { color:#c39b6f; }
img.solving03 { max-width: 100%;　object-fit: contain; }

/* iLスクエア利用ガイド
=========================================================== */

ol.sample1{
  counter-reset:list;
  list-style-type:none;
  font: 14px/1.6 'arial narrow', sans-serif;
  padding: 1.5em;
}
ol.sample1 li{
  position:relative;
  padding: 7px 5px 7px 40px;
  margin: 7px 0 10px 30px;
  font-weight: bold;
  font-size:14px;
  border-bottom:dashed 1px #F6A38B;
}
ol.sample1 li:before{
  counter-increment: list;
  content: counter(list);
  position: absolute;
  left: 0px;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  color: #fff;
  background: #F6A38B;
  border-radius: 50%;
  top: 50%;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}


/* レガシーの囲み線
=========================================================== */
.regacy_box1 {
    padding: 1em;
    margin: 2em 0;
    font-weight: bold;
    border: solid 3px #1f4e78;
}
.regacy_box1 p {
    margin: 0; 
    padding: 0;
}



body.category  {
   margin: 10;
   padding: 10;
}

.full-page {
  width: 100%;
  height: 100%;

  background: #f2f2f2;
}


/* タイトル下の線
=========================================================== */

.hr_nh {
    height: 4px;
    width: 70px;
    text-align: center;
    position: relative;
    background: #8fc31f;
    margin: 0 auto;
    margin-bottom: 20px;
    border: 0;
}

/* HEROのテキスト
=========================================================== */
.il_hero {/*親div*/
  position: relative;/*相対配置*/
  }
  
.hero_text01  {
  position: absolute;/*絶対配置*/
  color: #ffffff;/*文字の色*/
  font-weight: 700;
  line-height: 1.4em;
  top: 1.6em;
  left: 1.6em;
  font-size: 18px;
  }
  
  .hero_text02  {
  position: absolute;/*絶対配置*/
  color: #000000;/*文字の色*/
  font-weight: 700;
  line-height: 1.4em;
  top: 2em;
  left: 8.5em;
  font-size: 18px;
  text-shadow: 1px 2px  #fff;
  }

.hero_text03  {
  position: absolute;/*絶対配置*/
  color: #000000;/*文字の色*/
  font-weight: 700;
  line-height: 1.4em;
  top: 1.6em;
  left: 1.6em;
  font-size: 18px;
  }

  
  @media (min-width: 600px) {
.hero_text01  {
    font-size: 24px;
  }

}

@media (min-width: 1280px) {
.hero_text01 {
    font-size: 28px;
  }

}

  @media (min-width: 600px) {
.hero_text02  {
    font-size: 24px;
  }

}

@media (min-width: 1280px) {
.hero_text02 {
    font-size: 28px;
  }

}

  @media (min-width: 600px) {
.hero_text03  {
    font-size: 24px;
  }

}

@media (min-width: 1280px) {
.hero_text03 {
    font-size: 28px;
  }

}


.fuchidori {
  color: #000;
  -webkit-text-stroke: 1px #FFF;
  text-stroke: 2px #FFF;
}

.cmt p::before {
	content: "※";
}
.cmt p{
	padding-left: 1em;
	text-indent: -1em;
	font-size: 0.8em;
	color:#959595;
	margin: 0;
}

.t_list {
    text-indent: -1em;
    margin-left: 1em;
}
.t_list:before {
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    margin-right: 4px;
    margin-left: 4px;
    border: transparent solid 5px;
    border-left-color: #f00;
    vertical-align: 4px;
}

/* opencourse HEROのテキスト
=========================================================== */
.iLearning-page-opencourse .opencourse_hero {
  position: relative;
  width: 100%;
  position: relative;
  background: url('/service/i/opencourse.jpg') no-repeat;
  background-size: contain;
  aspect-ratio: 1200 / 260;
}
.iLearning-page-opencourse .hero_desc {
  position: absolute;
  top: 14%;
  left: 3%;
}
.hero_desc_sub  {
  position: absolute;/*絶対配置*/
  color: #000000;/*文字の色*/
  font-weight: 700;
  line-height: 1.4em;
  top: 7em;
  left: 1.6em;
  font-size: 18px;
  text-shadow: 1px 2px  #fff;
  }
@media (max-width: 889px) { 
.iLearning-page-opencourse .hero_desc {
    line-height: 0;
    top: 18%;
    left: 2%;
}
 .iLearning-page-opencourse .hero_desc h1 {
  font-size: 1.4em !important;
}
.hero_desc_sub  {
  top: 66%;
  left: 2%;
  font-size: 3.4vw;
}
}
  
 

.opencourse_title { font-size: 1.1em; font-weight: bold; padding: 10px 0px 5px 0px; text-decoration: none; }
img.opencourse_small { width: 200px; float: left; margin: 5px 20px 10px 5px;  }
@media (max-width: 889px) { 
  .opencourse_text01  {
    line-height: 1;
    top: 1em;
    left: 1em;
    font-size: 13px;
    }
  .opencourse_text02  {
    top: auto;
    left: 1em;
    bottom: 0;
  font-size: 12px;
}
}

.iLearning-page-opencourse .page_nav {
  font-weight: bold;
  display: flex;
  justify-content: space-around;
  margin: 2em auto 6em;
}
@media (max-width: 889px) { 
  .iLearning-page-opencourse .page_nav {
      flex-wrap: wrap;
  }
}
.iLearning-page-opencourse a.page_nav_btn {
  position: relative;
  color: #63b8ee;
  text-decoration: none;
  display: block;
  width: 30%;
  text-align: center;
  padding: 5px;
  transition: opacity 0.3s;
}
@media (max-width: 889px) { 
  .iLearning-page-opencourse a.page_nav_btn {
      width: 80%;
      margin-bottom: 20px;
  }
}
.iLearning-page-opencourse a.page_nav_btn:hover {
  opacity: .7;
}
.iLearning-page-opencourse a.page_nav_btn::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: #74c0ff; 
  transform: scale(1, 1);
  transition: transform .3s;
}
.iLearning-page-opencourse a.page_nav_btn:hover::before {
  transform: scale(0, 1); 
}
.iLearning-page-opencourse a.page_nav_btn::after {
  position: absolute;
right: 2%;
content: '\f0ab';
color: currentColor;
font-family: fontAwesome;
z-index: -1;
transition: transform .3s;
}
.iLearning-page-opencourse a.page_nav_btn:hover::after {
  transform: translateY(15%);
}
.iLearning-page-opencourse .sec_ttl {
  position: relative;
  width: 100%;
  margin: 0 0 .5em !important;
  font-size: 1.2em;
  background: #63b8ee;
  padding: 20px .5em 15px;
  color: #fff;
  text-align: center;
}
.iLearning-page-opencourse .sec_ttl span{
  position: absolute;
  top: -25%;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  border: 1px solid #74c0ff;
  display: block;
  font-size: 70%;
  color: #74c0ff;
  padding: 5px 10px;
}
@media (max-width: 889px) { 
  .iLearning-page-opencourse .sec_ttl span{
      width: 60vw;
  }
}
.iLearning-page-opencourse .sec_ttl_sub {
border-bottom: 1px solid #ccc;
}

  .iLearning-page-opencourse .sec_box {
  padding-top: 2em;
  margin-top: -2em;
  margin-bottom: 6em;
}
.iLearning-page-opencourse .sec_box:last-of-type {
  margin-bottom: 4em;
}
.iLearning-page-opencourse .sec_contents {
  width: 96%;
  margin: auto;
}
.iLearning-page-opencourse .sec_contents sup {
  font-size: .7em;
}
.iLearning-page-opencourse .sec_contents img[src$="_sp.png"]{
  display: none;
}
.iLearning-page-opencourse .sec_desc {
  background: #fef5dc;
  padding: 1em;
  border-radius: 5px;
  margin: 1em auto;
}
.iLearning-page-opencourse .sec_desc i {
  color: #e79412;
}
@media (max-width: 889px) { 
  .iLearning-page-opencourse .sec_contents img[src$="_sp.png"]{
      display: block;
  }
}
.iLearning-page-opencourse .sec_cta {
  width: 92%;
  padding: 1em;
  margin:2em auto;
  border: 2px solid #45c0d2;
  border-radius: 15px;
}
.iLearning-page-opencourse .sec_cta a {
 text-decoration: underline;
}

.iLearning-page-opencourse .opencourse_btn {
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
}
.iLearning-page-opencourse .opencourse_btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
    font-size: 14px;
    font-weight: bold;
    line-height: 1.4;
    text-align: center;
    padding: 20px 10px;
    width: calc(100% / 3 - 8px);
    margin: 0 12px 12px 0;
    text-decoration: none;
	border: 1px solid #63b8ee;
  /* background: #63b8ee; */
	color: #63b8ee;
	position: relative;
 	overflow: hidden;
 	z-index: 1;
   transition: all .5s;
  }
  .iLearning-page-opencourse .opencourse_btn a::before {
      content: "\f138";
      color: currentColor;
    font-family: fontAwesome;
      display: block;
      position: absolute;
      right: 3%;
      top: 50%;
      transform: translateY(-50%);
  }

.iLearning-page-opencourse .opencourse_btn a:nth-child(3n) {
  margin: 0 0 12px 0;
}

.iLearning-page-opencourse .opencourse_btn > a span	{ width: 100%; font-size: 18px; display: block;text-align: center; }

.iLearning-page-opencourse .opencourse_btn a:hover {
  background: #63b8ee;
	color: #fff;

}

@media (max-width: 889px) {
.iLearning-page-opencourse .opencourse_btn a {
  justify-content: flex-start;
  text-align: left;
    width: calc(100% / 2 - 12px);
}
.iLearning-page-opencourse .opencourse_btn > a span	{  font-size: 13px;text-align: left; }
}



/* プライベート研修ページ
=========================================================== */
.iLearning-page-private .private_hero {
    position: relative;
    width: 100%;
    position: relative;
    background: url('/customize/i/customize_hero02.jpg') no-repeat;
    background-size: contain;
    aspect-ratio: 1200 / 260;
}
.iLearning-page-private .hero_desc {
    position: absolute;
    top: 58%;
    right: 20%;
    transform: translateY(-50%);
}
@media (max-width: 889px) { 
  .iLearning-page-private .hero_desc {
      line-height: 0;
      top: 75%;
      right: 10%;
  }
   .iLearning-page-private .hero_desc h1 {
    font-size: 1.4em !important;
  }
}
.iLearning-page-private .page_nav {
    display: flex;
    justify-content: space-around;
    margin: 2em auto 5em;
    font-weight: bold;
}
@media (max-width: 889px) { 
    .iLearning-page-private .page_nav {
        flex-wrap: wrap;
    }
}
.iLearning-page-private a.page_nav_btn {
    position: relative;
    color: #a09567;
    text-decoration: none;
    display: block;
    width: 30%;
    text-align: center;
    padding: 5px;
    transition: opacity 0.3s;
}
@media (max-width: 889px) { 
    .iLearning-page-private a.page_nav_btn {
        width: 80%;
        margin-bottom: 20px;
    }
}
.iLearning-page-private a.page_nav_btn:hover {
    opacity: .7;
}
.iLearning-page-private a.page_nav_btn::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #a09567; 
    transform: scale(1, 1);
    transition: transform .3s;
}
.iLearning-page-private a.page_nav_btn:hover::before {
    transform: scale(0, 1); 
}
.iLearning-page-private a.page_nav_btn::after {
    position: absolute;
  right: 2%;
  content: '\f0ab';
  color: currentColor;
  font-family: fontAwesome;
  z-index: -1;
  transition: transform .3s;
}
.iLearning-page-private a.page_nav_btn:hover::after {
    transform: translateY(15%);
}
.iLearning-page-private .sec_ttl {
    position: relative;
    width: 100%;
    margin: 0 0 1em !important;
    font-size: 1.5em;
    /* background:linear-gradient(105deg, #fdfcfb 0%, #a09567 30%,#a09567 70%, #fdfcfb 100%); */
    /* background: #a09567; */
    background: url(/customize/i/bg_ttl.png) no-repeat center center;
    background-size: cover;
    padding: 25px .5em;
    color: #a09567;
    text-align: center;
    letter-spacing: 3px;
}
.iLearning-page-private .sec_subttl {
  color: #868686;
  display: flex;
  align-items: center;
  font-size: 1.1em;
}

.iLearning-page-private .sec_subttl:after {
  content: "";
  height: 1px;
  flex-grow: 1;
  background-color: #ccc;
}

.iLearning-page-private .sec_subttl:before {
  margin-right: 1rem;
}

.iLearning-page-private .sec_subttl:after {
  margin-left: 1rem;
}
@media (max-width: 889px) { 
    .iLearning-page-private .sec_ttl span{
        width: 60vw;
    }
}
.iLearning-page-private .sec_box {
    padding-top: 2em;
    margin-top: -2em;
    margin-bottom: 6em;
}
.iLearning-page-private .sec_contents {
    width: 96%;
    margin: auto;
}
.iLearning-page-private .sec_contents img[src$="_sp.png"]{
    display: none;
}
@media (max-width: 889px) { 
    .iLearning-page-private .sec_contents img[src$="_sp.png"]{
        display: block;
    }
}
.iLearning-page-private .private_personal {
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
}
.iLearning-page-private .private_personal .private_personal_btn {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
    font-size: 12px;
    line-height: 15px;
    text-align: left;
    padding: 15px 20px;
    width: calc(100% / 3 - 8px);
    margin: 0 12px 12px 0;
    text-decoration: none;
	border: 1px solid #ccc;
  background: #f4f4f4;
	color: #666;
	position: relative;
 	overflow: hidden;
 	z-index: 1;
}
.iLearning-page-private .private_personal .private_personal_btn:before {
  content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 125%;
	height: 100%;
	background-color: #fdfcfb;
	transform: translateX(-120%) skewX(-25deg);
	transition: all .5s;
	z-index: -1;
}
.iLearning-page-private .private_personal .private_personal_btn:after {
  content: "";
  display: block;
  position: absolute;
  right: 10px;
  margin-top: 10px;
  margin-right: 10px;
  margin-left: auto;
  width: 25%;
  height: 8px;
  border-bottom: 1px solid #bdb388;
  border-right: 1px solid #bdb388;
	transition: all .5s;
  transform: skew(45deg);
}
.iLearning-page-private .private_personal .private_personal_btn:hover {
  color: #333;
}
.iLearning-page-private .private_personal .private_personal_btn:hover::before {
  transform: translateX(-10%) skewX(-25deg);
}

.iLearning-page-private .private_personal .private_personal_btn:hover::after {
  transform: translateX(10%) skew(45deg);
  border-bottom: 1px solid #a09567;
  border-right: 1px solid #a09567;
}

.iLearning-page-private .private_personal a:nth-child(3n) {
  margin: 0 0 12px 0;
}
.iLearning-page-private .private_personal > a p	{ padding: 0; margin: 0; }
.iLearning-page-private .private_personal > a p strong	{ font-size: 14px; font-weight: 700; line-height: 20px;display: block; }
.iLearning-page-private .private_personal > a p b	{ color:#bdb388; font-size: 16px; font-weight: 700; line-height: 20px; padding: 0 0 3px; display: block; }
.iLearning-page-private .private_personal > a p span	{ display: inline-block; }
.iLearning-page-private .private_personal > a .sponly	{ display: none; }

@media (max-width: 889px) { 
	.iLearning-page-private .private_personal	{ justify-content: space-between; }
	.iLearning-page-private .private_personal .private_personal_btn	{ padding: 18px 10px; width: calc(100% / 2 - 8px); margin: 0 0 10px; }
	.iLearning-page-private .private_personal > a:nth-child(3n)	{ margin: 0 0 10px; }
.iLearning-page-private .private_personal > a .sponly	{ display: block; }
}

.iLearning-page-private .sec_cta {
    width: 92%;
    padding: 1em;
    margin:2em auto;
    border: 1px solid #ccc;
    border-radius: 15px;
}
.iLearning-page-private .sec_cta a {
   text-decoration: underline;
   color: #a09567;
}

@media (max-width: 889px) { 
.iLearning-page-private .sec_cta {
  width: 100%;

}
}



.ai-up .page_nav {
  display: flex;
  width: 90%;
  margin: 4rem auto 6rem;
}
@media(max-width: 768px) {
.ai-up .page_nav {
  width: 100%;
}
}
.ai-up .page_nav a {
  display: block;
  position: relative;
  border: 2px solid #00509a;
  text-align: center;
  padding: 20px 5px 30px;
  flex-basis: 20%;
  line-height: 1;
  color: #000;
  transition: all .3s;
}
@media(max-width: 768px) {
  .ai-up .page_nav a {
    flex-basis: 48%;
    margin-bottom: 2vw;
  }
  }
.ai-up .page_nav a:hover {
  text-decoration: none;
  background: #00509a;
  color: #fff;
}
.ai-up .page_nav a:after {
  position: absolute;
  bottom: 15px;
  left: 50%;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #00509a;
  border-right: 2px solid #00509a;
  transform: rotate(135deg) translateX(50%);
  transition: all .3s;
}
.ai-up .page_nav a:hover:after {
  bottom: 12px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}
.ai-up .page_nav div {
  width: 50px;
  display: flex;
  align-items: center;
  flex-wrap: wrap  ;
}
@media(max-width: 768px) {
  .ai-up .page_nav div {
    display: none;
  }
}
.ai-up .page_nav div img{
  width: 100%;
}
.ai-up .page_nav a span {
  display: block;
  font-size: 1.2rem;
}
.ai-up .page_nav a b {
  display: inline-block;
  font-size: 1.8rem;
  margin-bottom: 1rem;
  text-decoration: underline;
}
.ai-up .page_nav a p {
  font-size: 1.4rem;

}

.topic_ttl {
  position: relative;
  font-size: 2.8rem;
  text-align: center;
  margin: inherit !important;
  margin-bottom: 2rem !important;
}

.topic_ttl:before {
  content: '';
  position: absolute;
  bottom: -15px;
  display: inline-block;
  width: 60px;
  height: 5px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #00509a;
  border-radius: 2px;
}

.overview {
  margin-bottom: 8rem;
}
.overview-box {
  /* display: flex; */
  margin: 6rem auto;
  overflow: hidden;
}
@media(max-width: 768px) {
  .overview-box {
    display: block;
  }
}
.overview-box .overview_ttl {
  width: 50%;
  float: left;
  font-size: 2.4rem;
  margin: 0 !important;
  margin-bottom: 1rem !important;
  padding: 0 15px;
}
.overview-box .box_desc {
  float: left;
  width: 50%;
  padding: 0 15px;
  font-size: 1.4rem;
}
.overview-box .box_img {
  float: right;
  width: 50%;
  padding: 0 15px;
}
@media(max-width: 768px) {
  .overview-box .overview_ttl,.overview-box .box_desc,.overview-box .box_img {
    width: 100%;
    float: none;
  }
}

.overview-box:nth-of-type(2) .box_desc, .overview-box:nth-of-type(2) h3{
  float: right;
}
.overview-box:nth-of-type(2) .box_img {
  float: left;
}
.overview-box .box_img figcaption{
  font-size: 12px;
}

.overview-box .box_schema {
  background: #f1f1f1;
  width: 100%;
  text-align: center;
  padding: 15px;
}
.overview-box .box_schema h2 {
  font-size: 2.6rem;
}
.box_schema_item {
  display: flex;
  justify-content: center;
  width: 80%;
  margin: 1.5rem auto;
}
@media(max-width: 768px) {
  .box_schema_item {
    width: 100%;
  }
}
.overview-box .box_schema dl {
  width: 30%;
}
.overview-box .box_schema dt {
  width: 70%;
  margin: auto;
  aspect-ratio: 1/1;
}

.overview-box .box_schema h3 {
  font-size: 1.8rem;
}
.overview-box .box_schema p {
  font-size: 1.4rem;
}
.box_schema_arrow {
  flex-basis: 8%;
  padding-top: 4rem;
}

.point {
  margin: 6rem auto;

}

.box_point {
  margin: 6rem auto;
}
.box_point .box_desc{
  position: relative;
  margin: 2rem auto;
  padding: 1.5rem 10%;
}
.box_point .box_desc.point05{
  padding-right: 18%;
  background: url(/service/it/topics/i/ai-utilization-program-point05.png) no-repeat right center;
  background-size: contain;
}

@media(max-width: 768px) {
  .box_point .box_desc.point05 {
    background-size: 30%;

    padding-right: 10%;
  }
}

#secondMain820R .box_point .box_desc .ttl_point {
  text-align: center;
  font-size: 2.2rem;
  margin-bottom: 2rem;
}
.ttl_point_num {
  font-size: 18rem;
  font-weight: bold;
  position: absolute;
  z-index: -1;
  color: #eaf6ff;
  top: 0;
  left: 3rem;
  line-height: 1;
}

.plan {
  background: #f1f1f1;
  padding: 5rem 2rem;
}
.plan .topic_ttl {
  margin-bottom: 6rem !important;
}
.plan .topic_ttl::before {
  background: #fda300;
}
.cta {
  margin: 12rem auto;
  display: flex;
  justify-content: space-around;
}
@media(max-width: 768px) {
  .cta {
    display: block;
  }
}
.box_cta {
  width: 45%;
  background: #f1f1f1;
}
@media(max-width: 768px) {
  .box_cta {
    width: 100%;
    margin-bottom: 2rem;
  }
}
.box_cta_desc {
  padding: 2rem;
}
.box_cta_desc h3 {
  font-size: 1.8rem;
  margin: inherit !important;
  margin-bottom: 1.5rem !important;
}
.box_cta_desc p {
  font-size: 1.4rem;
  margin-bottom: 1.5em;
}

.box_cta_btn a{
  display: block;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  padding: 0.8rem;
}
.box_cta_btn a.blue{
  background: #1067ba;
}
.box_cta_btn a.orange{
  background: #fca300;
}
.box_cta_btn a:hover {
  text-decoration: none;
  opacity: 0.7;
}

.recommend {
  border: 2px solid #fca300;
}
.point01_box {
  display: flex;
  align-items: center;
}
.point01_box dl {
  width: 48%;
}
.point01_box dd {
  padding: 1em;
  font-size: 12px;
}
.point01_box_kangaku {
  background: #cba46b;
}
.point01_box_ibm {
  background: #82adda;
}



.cross {
  position: relative;
  display: inline-block;
  width: 45px;
  height: 4px;
  background: #333;
  transform: rotate(45deg);
  vertical-align: middle;
}
.cross::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #333;
  transform: rotate(90deg);
}
.point04_box {
  background: #eaf6ff;
  padding: 25px;
  font-size: 12px;
}
.point04_box_ttl {
  font-size: 22px;
  font-weight: bold;
  color: #1067ba;
}
.point04_box_wrap {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
}
@media(max-width: 768px) {
  .point04_box_wrap {
    display: block;
  }
}
.point04_card {
  background: #fff;
  width: calc((100% / 3) - 20px);
  padding: 15px;
  border-radius: 15px;
}
@media(max-width: 768px) {
  .point04_card {
    width: 100%;
    margin-bottom: 2rem;
  }
}
  .point04_card dt {
  text-align: center;
  font-weight: bold;
  font-size: 18px;
  margin-bottom: 10px;
}
.point04_card dd {
  font-size: 12px;
}
.point04_card_img {
  width: 90%;
  margin: auto;
  margin-bottom: 10px;
}


/* アイラーニングのプロジェクトマネジメントの特長ページ */

.projectmngmnt-feature .feature_ttl {
		text-align: center;
    font-size: 1.5em;
    padding-bottom: 10px;
    border-bottom: 5px solid #ccc;
}
.projectmngmnt-feature h2 {
  margin-left: 0 !important;
}
.feature_box {
  margin: 6rem auto;
  overflow: hidden;
}
@media(max-width: 768px) {
  .feature_box {
    display: block;
  }
}
.feature_box h3 {
  width: 50%;
  float: left;
  font-size: 2.8rem;
  margin: 0 !important;
  margin-bottom: 1rem !important;
  padding: 0 15px;
  display: flex;
  align-items: center;
  color: #0b549d;
}
.feature_box h3 span {
  display: block;
  font-size: 280%;
  color: #aaa;
  margin-right: 1rem;
}
.feature_box .box_desc {
  float: left;
  width: 50%;
  padding: 0 15px;
  font-size: 1.4rem;
}
.feature_box .box_img {
  float: right;
  width: 50%;
  padding: 0 15px;
}
@media(max-width: 768px) {
  .feature_box h3,.feature_box .box_desc,.feature_box .box_img {
    width: 100%;
    float: none;
  }
}
.feature_box:nth-of-type(2) .box_desc, .feature_box:nth-of-type(2) h3{
  float: right;
}
.feature_box:nth-of-type(2) .box_img {
  float: left;
}
.feature_box-full {
  width: 100%;
}

.feature_box-full h3 {
  font-size: 2.8rem;
  margin: 0 !important;
  margin-bottom: 1rem !important;
  padding: 0 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0b549d;
}
.feature_box-full h3 span {
  display: block;
  font-size: 280%;
  color: #aaa;
  margin-right: 1rem;
}
.course_box {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}
.course_box a {
  display: block;
  width: calc((100% / 3) - 15px);
  padding: 15px;
  text-decoration: none;
  border: 1px solid #ccc;
  border-radius: 15px;
}
@media(min-width: 769px) {

.course_box.col_4 a {
  width: calc((100% / 4) - 10px);
  padding: 10px;
}

}
.course_box a p {
  font-size: 1.4rem;
  color: #000;
}
@media(max-width: 768px) {
  .course_box {
    flex-wrap: wrap;

  }
    .course_box a {
    width: 48%;
    margin-bottom: 1rem;
  }
  .course_box a {
    width: 48%;
    margin-bottom: 1rem;
  }
}

/* メールマガジン登録
=========================================================== */
.iLearning-page-mail .mail_hero {
  position: relative;
  width: 100%;
  position: relative;
  background: url('/form/i/hrd_mail.jpg') no-repeat;
  background-size: contain;
  aspect-ratio: 1200 / 260;
  color: #fff;
}
.iLearning-page-mail .mail_hero_ttl {
  position: absolute;
  top: 50%;
  left: 10%;
  transform: translateY(-50%);
}
.iLearning-page-mail .form_box {
  padding-top: 40px;
  display: flex;
  justify-content: center;
}
@media (max-width: 889px) { 
.iLearning-page-mail .mail_hero_ttl {
    line-height: 0;
    top: 50%;
    left: 3%;
    font-size: 1.2em !important;
  }

}



.features {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.features_box {
  background: #d6f1ea;
  border-radius: 5px 5px 0 0;
  font-size: 12px;
  line-height: 1.6;
  width: 49%;
  margin-bottom: 15px;
}
@media (max-width: 768px) { 
  .features_box {
    width: 100%;
  }
}
.features_box_ttl {
  color: #fff;
  border-radius: 5px 5px 0 0;
  padding: 5px;
  font-size: 12px;
}
.box01 .features_box_ttl {
  background: linear-gradient(180deg, #288ca6 0%, #2e8cae 25%, #286c81 100%);
}
.box02 .features_box_ttl {
  background: linear-gradient(180deg, #3271a7 0%, #3a74b3 25%, #275380 100%);
}
.box03 .features_box_ttl {
  background: linear-gradient(180deg, #5b559f 0%, #5e509b 25%, #473f7a 100%);
}
.box04 .features_box_ttl {
  background: linear-gradient(180deg, #a43f67 0%, #b4416c 25%, #883154 100%);
}
.box05 .features_box_ttl {
  background: linear-gradient(180deg, #d1493d 0%, #ed493f 25%, #b63a32 100%);
}
.box06 .features_box_ttl {
  background: linear-gradient(180deg, #d56c2a 0%, #f06c2c 25%, #b25522 100%);
}
.box07 .features_box_ttl {
  background: linear-gradient(180deg, #c9963a 0%, #e5993b 25%, #e5993b 100%);
}
.box08 .features_box_ttl {
  background: linear-gradient(180deg, #d46ca7 0%, #f06eae 25%, #bb588e 100%);
}
.box09 .features_box_ttl {
  background: linear-gradient(180deg, #41aa67 0%, #49ac6b 25%, #358351 100%);
}
.features_box_body {
  padding: 10px 20px;
}
.box01 .features_box_fig {
  margin-top: 10px;
}
.box02 .features_box_fig {
  background: #fff;
  border-radius: 5px;
  display: flex;
  justify-content: space-between;
  padding: 10px;
  font-size: 10px;
}
.box02 .features_box_fig dl:first-child{
  width: 35%;
}
.box02 .features_box_fig dl:last-child{
  width: 64%;
}
@media (max-width: 480px) { 
  .box02 .features_box_fig {
    display: block;
  }
  .box02 .features_box_fig dl:first-child{
    width: 100%;
    margin-bottom: 10px;
  }
  .box02 .features_box_fig dl:last-child{
    width: 100%;
  }
}
.box02 .features_box_fig dt{
  font-weight: bold;
}
.box02 .features_box_fig dd{
  padding-left: 1em;
}
.box02 .features_box_fig dd span{
  color: #00509a;
  display: block;
}
.box03 .features_box_body {
  display: flex;
  justify-content: space-between;
}
.box03 .features_box_body .txt {
  width: 49%;
}
.box03 .features_box_fig {
  width: 49%;
}
@media (max-width: 480px) { 
  .box03 .features_box_body {
    display: block;
  }
  .box03 .features_box_body .txt {
    width: 100%;
  }
  .box03 .features_box_fig {
    width: 100%;
  }
}
.box04 .features_box_body {
  display: flex;
  justify-content: space-between;
}
.box04 .features_box_body .txt {
  width: 49%;
}
.box04 .features_box_body .txt h4{
  color: #00509a;
}
.box04 .features_box_fig {
  width: 49%;
}
@media (max-width: 480px) { 
  .box04 .features_box_body {
    display: block;
  }
  .box04 .features_box_body .txt {
    width: 100%;
  }
  .box04 .features_box_fig {
    width: 100%;
  }
}
.box05 .features_box_fig {
  font-size: 11px;
  border: 2px solid #00509a;
  background: #f3f9eb;
  border-radius: 10px;
  padding: 10px;
  margin-top: 10px;
}
.box06 .features_box_fig {
  display: flex;
  justify-content: space-between;
}
.box06 .features_box_fig p {
  padding: 3px;
}
@media (max-width: 480px) { 
  .box06 .features_box_fig {
    display: block;
  }
}
.box08 .features_box_fig {
  display: flex;
  justify-content: space-between;
}
.box08 .features_box_fig p {
  font-weight: bold;
  padding: 3px;
}
@media (max-width: 480px) { 
  .box08 .features_box_fig {
    display: block;
  }
  .box08 .features_box_fig p {
    margin-top: 10px;
  }
}
.box09 .features_box_body .txt {
  float: left;
  width: 49%;
}
.box09 .features_box_body .txt h4 {
  font-weight: bold;
  color: #00509a;
  font-size: 110%;
  margin: 5px auto;
}
.box09 .features_box_fig {
  float: right;
  width: 50%;
}
@media (max-width: 480px) { 
  .box09 .features_box_body .txt {
    float: none;
    width: 100%;
  }
  .box09 .features_box_fig  {
    margin-top: 10px;
    float: none;
    width: 100%;
  }
}


.issue_box {
  display: flex;
}
@media (max-width: 768px) {
  .issue_box {
    flex-direction: column;
  }
}

.issue_box dl {
  width: 48%;
}
@media (max-width: 768px) {
  .issue_box dl {
    width: 100%;
  }
}
.issue_box dd {
  padding: 1em;
  font-size: 14px;
}
.issue_box li {
  text-indent: -1em;
   padding-left: 1em;
}
.issue_box_01 {
  background: #f9ddb3;
}
.issue_box_02 {
  background: #c3e0ff;
}
.issue_box_01 + div {
  display: flex;
  align-self: center;
}
@media (max-width: 768px) {
  .issue_box_01 + div {
  transform: rotate(90deg);
}
}
a.bbt-cta_Button {
  position: relative;
    background-color: #ff8643;
  border: 1px solid #ff8643;
  border-radius: 30px;
    display: block;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    text-decoration: none;
    padding: 5px;
    color: #fff;
}
a.bbt-cta_Button:hover {
  text-decoration: none;
  border: 1px solid #ff8643;
  background: #fff;
  color: #ff8643;
}



.agile .tbl-program {
  margin-bottom: 2rem;
}
.agile .tbl-program th, .agile .tbl-program td {
  border: 1px solid #ccc;
  background: #fff;
}
.agile .tbl-program th {
  background: #6b6a6a;
  text-align: center;
  color: #fff;
  padding: 0.5em 0;
}
.agile .tbl-program .program-name {
  width: 33%;
}
.agile .tbl-program .program-skill {
  width: 33%;
}
.agile .tbl-program td {
  padding: 5px;
  vertical-align: middle;
}