@charset "utf-8";
/* CSS Document */
@media screen and (min-device-width: 768px) and (max-device-width: 1024px) {
/*iPad*/

}
@media screen and (max-width: 767px) {
html {
 font-size: 62.5%; /* -> 10px */ 
}
section {display: block;
	width: 100%;}
/*login*/
#login {
		display: block;
		width: 100%;
		margin: 60px auto;
	    text-align: center;
	}
#login h3 {
		font-size: 2.4rem;
		font-weight: 400;
	}
.logininputBx {
display: block;
width: 100%;
margin: 30px 0;
	}
#login_loginBx {
	display: block;
	width: 90%; 
	margin: 0 5%;}

.idpassBx {
	display: block;
    width: 96%;
    text-align: left;
	font-size: 1.8rem;
	margin-bottom: 20px;
	margin: 0 2%;
	}
input.idBx{
	display: block;
	height: 3em;
	font-size: 2rem;
	width: 96%;
	border: solid 1px #838485;
	padding: 5px 2%;
	margin-bottom: 20px;
	}
.itemLi1 {
width:auto;
	}
.itemLi2 {
width: 100%;
	}
.btn_login {
	display: block;
	text-align: center;
	max-width: 92%;
	padding: 20px 4%;
	margin: 20px auto;
	background-color: #37c695;
	color: #FFFFFF;
	font-size: 2.0rem;
}
/*title area*/
.header_line {
	display: block;
	background-color: rgba(0,0,0,1.00);
	min-height: 10px;
	width: 100%;
}
.headerBx {
	display: block;
	background-color: #FFFFFF;
	width: 98%;
	margin: 0 auto;
	padding: 1.0rem 1% 0.6rem;
	color: #000000;
	}	
.h1Bx {
	display: block;
	align-items: center;
	width: 100%;
	padding: 0.5rem 0 0;
	font-size: 0.6rem;
	font-weight: 500;
}
.h1Bx img {
	width: 28%;
	height: auto;
	margin-bottom: 0.5rem;
}	
#elearn_mvBx {
	display: block;
	width: 98%;
	padding:2rem 2% 1.5rem;
	background-image:url('/import/tenant_2/www.icb-image.com/e-learn/img_elearn/el_titbg_1.webp');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	border-top: solid 1px #e7e4d3;
	border-bottom: solid 1px #FFFFFF;
}
.elearn_titile {
	color: #000000;
	display: block;
	width:100%;
	margin: 0 auto;
}
.elearn_titile_inBx {
	display: block;
	width: 100%;
	margin: 0 auto;
	align-items: center;
}
.elearn_titile_inBx img {
	width: 40%!important;
	height: auto;
	margin:0.8rem 2% 0 58%;
	}
.elearn_titile h2 {
	font-size: 2.8rem;
	font-weight:400;
}
/*ID area*/
#mypage_account {
	display: block;
	width: 100%;
	background-color: #f5f1f1;
	padding-bottom: 0.5rem;
}
.mypage_accountBx{
	display: block;
	width: 96%;
	margin: 0 2%;
}
#mypage_loginoutBx {
	display: block;
	text-align: right;
	width: 40%; 
	padding-left: 58%;
	margin: 0 auto;
}
.btn_loginout {
	display: block;
	text-align: center;
	padding: 0.3rem 1rem;
	margin-left: 0;
	background-color: #37c695;
	color: #FFFFFF;
	border-radius: 0 0 12px 12px;
	font-size: 1.4rem;
}
#mypage_idBx {
	display: block;
	width: 100%;
	padding: 0;
	margin: 0 auto 1.5rem;
}

.mp_id_item1 {
	width: 100%;
}
.mp_id_item1 h2 {
	font-size: 2.4rem;
	font-weight: 500;
	margin-bottom: 1.0rem;
}
.name_id {font-size: 1.8rem;
	margin-bottom: 1.0rem;}
.mp_id_item2 {
	width: 100%;
}
.mp_id_item2 h4 {
	font-size: 1.8rem;
	font-weight: 500;
	margin-bottom: 0.5rem;
	color: cadetblue;
}
.name_course {
	display: block;
}
.name_course p {
	display: block;
	text-align: center;
	margin:0 0 0.3rem;
	padding: 2px 0;
	background-color: #c997db;
	color: #ffffff;
	font-size: 1.6rem;
}
/*video area*/
#list_video_color, #list_video_skeletal {
	display: block;
	width: 100%;
	margin: 0 auto 6rem;
	padding-top: 5rem;
}

.list_video_titleBx {
	display: block;
	width: 98%;
	margin: 0 0 30px 2%;
	text-align: center;
}
.list_video_titleBx>.cource, .elearn_testBx h2 {
	font-size: 2.2rem;
	font-weight: 500;
	margin-bottom: 20px;
	line-height: 1.4;
}
.period_openBX{
display: block;
width: 100%; 
padding-top: 1.2rem;
padding-bottom: 1.2rem;
font-size: 1.8rem;
border-top:solid 1px #cccccc;
border-bottom:solid 1px #cccccc;
margin-bottom: 20px;
line-height: 1.8;
}

.videoBx{
	display:block;
	width: 96%;
	margin:0 2% 2.6rem;
	height: auto;
}
.video_title {
	font-size:1.8rem;
	font-weight: 400;
}
.video_title::before {
 content: '';
  display: inline-block;
  min-width: 6px;
  min-height: 20px;
  background-color: #c997db;
  vertical-align:bottom;
margin-right: 8px;	
}
ul.item_v {
	width: 80%;
	margin: 0 10% 3rem;
}
.vimeo_thum {
	display: block;
	min-width: 100%;
	min-height: 160px;
	border: solid 1px #cdcdcd;
	margin-bottom: 1rem;
}
/*test link area*/
.elearn_test {
	display: block;
	width: 98%;
	height: auto;
	margin: 40px 1%;
	padding-top: 20px;
	background: url('/import/tenant_2/www.icb-image.com/e-learn/img_elearn/el_bg_testBx_1.webp') no-repeat left bottom;
	background-color:rgba(255,255,255,0.5);
background-blend-mode:lighten;
	background-size: cover;
	border: solid 1px #dddddd;
	line-height: 1.2;
	}
.elearn_testBx{
	display: block;
	width: 96%;
	margin: 0 2% 1rem;
}
	.elearn_testBx p.txt {
		margin-bottom: 80px;
	}
.btn_v_test {
	display: block;
	max-width: 270px;
	text-align: center;
	margin: 30px auto 15px;
	padding: 36px 20px;
	background-color: #13b5b1;
	color: #ffffff;
	font-size: 2.4rem;
}
/*play area*/
#video_idBx {
	display: block;
	width: 100%;
	padding: 0;
	margin: 0 0 25px;
}

.vd_id_item1 {
	margin-bottom: 1.5rem;
}

.name_id {font-size: 1.8rem;}

.mp_id_item2 {
}
	#videoplay {
		display:block;
		width: 96%;
		margin: 30px 2%;
		text-align: center;
	}
	#videoplay>.cource {
		font-size: 1.8rem;
		margin-bottom: 30px;
	}#videoplay>.video_title {
		font-size: 2.4rem;
		margin-bottom: 20px;
	}
	#teach-material {
		display: block;
		width: 100%;
		text-align: center;
	}
	.t-mateBx {
		display: inline-flex;
		width: 96%;
		margin: 0 2% 50px;
		justify-content: space-between;
	}
	.t-mateBx h3{
		font-size: 1.6rem;
		font-weight: 400;
		line-height: 2;
	}
	.t-mateBx h3::after {
		content: '';
		display: inline-block;
		min-width: 1px;
		min-height: 2.6rem;
		background-color: #c997db;
		vertical-align: middle;
		margin-left: 1rem;	
	}
	.t-matelistBx {
	display: block;
    width: 70%;
    margin-top: 0;
    padding: 0 0 0 6%;
    height: auto;
    font-size: 1.8rem;
    line-height: 2;
    text-align: left;
		}
	.t-matelistBx ul {
		list-style: none;
		line-height: 2;
	}
/* footer styles
================================================== */
#footer {
}

#footer #copy {
    border-top: 1px solid #c3c3c3;
    padding: 10px 3%;
    border-bottom: 1px solid #c3c3c3;
}
#footer #copy h2 {
    font-size: 100%;
    line-height: 1.5;
    margin: 0 auto 15px;
    width: auto;
}
#footer #copy .txt1 {
    font-size: 100%;
    line-height: 1.5;
    width: auto;
}
}