@charset "utf-8";
@import "../css/font.css?a=3";
/* CSS Document */
header, section, footer, aside, nav, main, article, figure{display: block;}
html{background-repeat:no-repeat; background-position:top; background-attachment:fixed; background-size:cover; }
html[lang=ch],html[lang=en] a#btn_lang{font-family:cssFontSansHKRegular,cssFont;}
html[lang=en],html[lang=ch] a#btn_lang{font-family:cssFontSansHKRegular,sans-serif;}
html.ie{line-height:1.35em;}
/* 20200915 edited start */
/*
*:not(div.question) {font:inherit; text-shadow:inherit; box-sizing: border-box;}
*/
/* 20200915 edited end */
select {font:inherit; text-shadow:inherit;} 

html{width:100%; height:100%;}

html, body{min-width:100%; min-height:100%; box-sizing:border-box;}
body, body *{margin:0 auto; padding:0; box-sizing:border-box;}
body{overflow-x:hidden; padding:65px 0; position:relative;}
body#welcome main{top:50%; left:50%; right:0; position:absolute; transform-origin:50% 50%;}
/* body.exercise, body.welcome{text-align:center;} */
body.exercise>main, body.welcome>main{text-align:left;}
body>*{text-shadow:0 0 0;}
header, footer {clear:both; width:100%; position:fixed;}
header{text-align:right;}
body#login header{min-width:100vw; width:100vw;}

body>main{margin:0 1%;}

a{text-decoration:none; color:inherit;}
strong, strong>*, h1, h2, button{font-size:inherit; text-shadow:none;}
button{border:0 none; background:none; padding:.3em; cursor:pointer;}
table td{padding:.5em 0;}

/* Edmond edited 20180424 start */
input, select{
	font-family:cssFontSansHKRegular, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #000000;
	text-shadow: none;
	font-size: 14px;
	line-height: 16px;
	border: 1px solid #7cbfb2;
	padding: 5px;
	box-sizing: border-box;
	outline-color: #1abc9c;
	border-radius: 3px;
	margin: 0px 3px;	
}
@-moz-document url-prefix() {
	select{
	-webkit-appearance: none;
       -moz-appearance: none;
        -ms-appearance: none;
         -o-appearance: none;
            appearance: none;
	padding: 2px 8px 2px 2px;
	}
}


select{
	-webkit-appearance: none;
       -moz-appearance: none;
        -ms-appearance: none;
         -o-appearance: none;
            appearance: none;
	background-color: white;
	background-image: url(../img/select_arrow.png);
	background-repeat: no-repeat;
	background-position: right center;
	padding-right: 25px;
}

@media screen and (-moz-min-device-pixel-ratio:0) {
input {padding: 8px;}
}
select>option{font-size:1em; }
input[type=radio],input[type=checkbox]{	position: relative;	transform: scale(1.5,1.5);	margin: 0em .5em 0em .2em;}
input[type=file]{}
input[type=number]{width:3.5em;}
input[type=text]{}
input.datepicker{width:8em; }
/* Edmond edited 20180506 start */
.ui-datepicker{font-size:.7em !important; line-height:120% !important;}
/* Edmond edited 20180506 end */
html select:not(.ui-datepicker-month) {}
html select>option{}
input:first-child {
	margin-right:5px;
}
/* Edmond edited 20180424 end */

label{padding:0 0 0 0em;}

var{font-style:inherit; font-family:sans-serif; text-decoration:none; position:relative;}
#paper_resource_list_sortOption{
	background-color:#FFFFFF;
}
*[data-before]:before{content:attr(data-before);}
*[data-after]:after{content:attr(data-after);}

.clear{clear:both; float:none; height:0; overflow:hidden; width:100%; display:block;}
body.table>main :link, body.table>main :link *, body#welcome>main .islink:not(.selected):not(.alert), body#welcome>main .islink:not(.alert) *{font-weight: normal;}
/* For student index sec use*/
/*body.table>main :link *, */


/* edit 20200817*/
/*
body.table>main :link, body#welcomesec>main .islink:not(.selected):not(.alert), body#welcomesec>main .islink:not(.alert) *{
	font-weight: normal;
	background-color: #e6f4f6;
	padding-top: 2px;
	padding-right: 8px;
	padding-bottom: 2px;
	padding-left: 8px;
	box-shadow: 1px 1px 1px #b5b5b5;
	border-radius: 3px;
}
*/

.paper_bg{
	background-color: #e6f4f6;
	padding: 10px;
	box-shadow: 1px 1px 1px #b5b5b5;
	border-radius: 3px;
}
.paper_title{
	margin-bottom: 5px;
	display: block;
}
.paper_title:hover{
	color: rgba(51,102,204,1);
}
.edit_btn a {
    color: #996600;
    border-right: 1px solid;
    border-bottom: 1px solid;
    text-decoration: none;
    background-color: #FFC;
    margin-right: 5px;
    padding: .1em .5em;
	border-radius: 3px;
}
.edit_btn a:hover {
    background-color: #FFF;
}

/* edit 20200817*/
.islink:hover {opacity:.8; cursor:pointer;}
.score{font-family:sans;}
.score:before{font-size:1.2em}
.icon:before{content:""; display:inline-block; background-repeat:no-repeat; background-size:100% auto; vertical-align:top; width:inherit; height:inherit;}
.icon.white:before{background-image:url(../img/icon_white.svg); }
.icon.black:before{background-image:url(../img/icon_black.svg); }
.icon.color:before{background-image:url(../img/icon_color.svg?a=2); }
.icon.white{color:#FFF;}
.icon.black{color:#000;}

.arrow{background-image:url(../img/arrow1.png); background-repeat:no-repeat; background-clip:content-box;}
.arrow.white{background-image:url(../img/arrow_white.png);}
.arrow.up, .arrow.left{background-position:top left;}
.arrow.down .arrow.right{background-position:bottom right;}
.arrow.inactive, .arrow.inactive:hover {cursor:default; opacity:.25 !important;}

/* Edmond edited 20170606 */
.arrow1{background-image:url(../img/arrow.png); background-repeat:no-repeat; background-clip:content-box;}
.arrow1.white{background-image:url(../img/arrow_white.png);}
.arrow1.up, .arrow1.left{background-position:top left;}
.arrow1.down .arrow1.right{background-position:bottom right;}
.arrow1.inactive, .arrow1.inactive:hover {cursor:default; opacity:.25 !important;}

header{height:100px; font-size:16px; background:#ffffff;color:#000000; padding:0; line-height:26px; top:0%; white-space:nowrap;}
header>*{display:inline-block; font-weight:normal !important; line-height:20px;text-decoration:none; padding:0;}
header>a:hover{opacity:.8;}
header>a#logos{margin: 27px 0 27px 35px; float:left; width:auto;}
header>a#logos>img{width:212px;height:47px;}
header>a#logos:hover{opacity:.7;}
header>div#logo_line{float:left;margin-top:27px;margin-left:35px;width:1px;height:50px;background-image:url(../img/logo_line.png);background-repeat:no-repeat;}
header>a#btn_back{float:left;margin-top:27px;margin-left:35px;}
header>a#btn_back>img{width:197px;}

header>#icon_book{width:auto; height:65px; float:left;}
#banner_span1, #banner_span2 {margin: 0 0 5px 0;}

header>div#user_id{float:right;margin:50px 10px 25px 0;}
header>div#user_id>.thumbnail{width:30px; height:30px; border-radius:15px; background-size:100%; display:inline-block; margin:0 .5em 5px -25px; position:absolute;}
header>div#lbl_user_id{float:right;margin:59px 10px 29px 0;}
header>a#btn_member_setting{float:right;margin:59px 10px 29px 0;width:53px;height:17px;background-image:url(../img/setting.png);background-repeat:no-repeat;}
html[lang=en] header>a#btn_member_setting{width:83px;}
header>a#btn_logout{float:right;margin:59px 10px 29px 0;width:53px;height:17px;background-image:url(../img/logout.png);background-repeat:no-repeat;}
html[lang=en] header>a#btn_logout{width:73px;}
header>a#btn_lang{float:right;padding:59px 35px 29px 0;}

footer{line-height:0; vertical-align:bottom; font-size:10px; bottom:0; height:60px;}
footer *{ text-shadow:none !important; font-family:cssFontSansHKRegular,sans-serif,"Segoe UI" !important; font-weight:normal !important; }
footer>*{display:inline-block;position:absolute;box-sizing:content-box;  font-size:10px; padding:0; min-width:auto; white-space:nowrap; border:0 none;}
footer>div#reminder, footer>div#copyright{line-height:16px; height:35px; background:#002B49; color:#ffffff; bottom:0; font-size:14px; }
footer>div#copyright{padding-top:15px; text-align:center; width:100%;}
footer>div#reminder{margin:0 auto 0 0; text-align:left; width:auto; text-overflow:ellipsis; overflow:hidden; left:0; right:250px;}
body:not(#create_paper) footer>div#reminder:hover{overflow:visible; right:auto;}
body:not(#create_paper) footer>div#reminder:hover~div#copyright{width:100vw;}

footer>div#disclaimer{float:none; margin-left:auto; margin-right:auto; text-align:center; width:100%;}
footer>div#disclaimer>a{padding:0 .3em;}
footer>div#disclaimer>a:hover{opacity:.7;}
footer>div#disclaimer {font-size:11px; line-height:13px; height:85px; bottom:0;}

/** login **/
body#login{background-image:url(../img/ADS-pattern.svg); background-repeat:repeat; margin:0; padding:0;}
html[lang=en] body#login{background-image:url(../img/ADS-pattern.svg);}
body#login form{text-align:right; font-size:1.2em; margin-left:auto; margin-right:auto; padding:0; width:460px; height:615px; top:220px; bottom:0; left:0; right:0; position:absolute; white-space:nowrap; background-color: rgba(255,255,255,0.6); border-radius: 21px;}
html[lang=en] body#login form{font-size:1em;}
body#login div#login_sys_logo {padding:117px 70px 0 70px;}
body#login div#login_sys_logo>img {width:100%;}
body#login .stay_login {float:left; color:#000000; font-family:cssFontSansHKRegular,sans-serif; font-size:14px; line-height:16px; padding:.5em 0 0 70px;}
body#login form>*:not(a){display:block; margin:0; text-align:left;}
body#login form>label{color:#000000; font-family:cssFontSansHKRegular,sans-serif; font-size:20px; line-height:24px; padding:.5em 70px 0 70px;}
body#login form>label#lbl_login_id {margin-top:76px; margin-left:auto; margin-right:auto; }
body#login form>input[type=text],body#login form>input[type=password]{width:320px; height:30px; margin:.15em 70px .5em 70px; border:1px solid #e0e0e0; border-radius:2px;}
body#login form>a{color:rgba(0,0,0,.5); font-size:.85em; display:inline-block; line-height:1em; margin:.5em 0; padding:0 0 0 .5em;}
html[lang=en] body#login form>a{font-weight:normal; font-size:.95em;}
body#login form>input+a{padding:0 .5em; border-right:2px solid;}
body#login form>a#btn_login{display:block; position:absolute; bottom:70px; margin:0 150px; padding:10px 0; float:left; width:160px; height:50px; font-size:28px; line-height:33px; border-radius: 10px; border-color:#ffffff; background:#ff6b00; color:#FFF; text-align:center; cursor:pointer;}
body#login form>a:hover{background:#CC5600!important;opacity:1;}
body#login p.errorMessage:not(:empty){position:absolute;left:0;top:20px;min-width:100%;background:#E20000; display:inline; padding:.5em 1em; border-radius:2em; font-size:.8em; font-weight:bold; color:#FFF;}


body.exercise{height:100%; overflow:hidden;}
body.exercise:before{content:""; display:block; position:fixed; top:0; left:0; right:0; bottom:0;}
body.exercise header a:not([href]), body.exercise footer a:not([href]){opacity:.7 !important;}
body.exercise>a.back:before, header>a>.btn{
	background-color: #ffffff;
	float: left;
}
body.exercise>a.back:before, header>a.icon:before{width:20px; height:20px; margin:0; background-size:20px auto; background-color:#F90; float: left;}
body.exercise>a.back{position:fixed; top:0; font-size:15px;}

body.exercise h1>.clock{color:#B95B00; width:90%;}
body.exercise h1>.clock:before{width:28px; height:28px; margin:0 .25em 0 0;}
body.exercise h1>.clock>var{font-size:1.5em; font-weight:bold; top:.1em;}

body.exercise main>h1{font-size:1.2em; color:rgba(0,0,0,.5); text-align:right; line-height:65px; position:absolute; top:-50px; width:auto; height:45px; padding:0 0 0 60%; overflow:hidden; text-overflow:ellipsis; right:0; left:140px; transform-origin:bottom right;}
body.exercise main>h1>div{position:absolute; width:60%; height:2em; overflow:visible; text-align:center; font-size:.8em; line-height:1.9em; bottom:0; left:0;}
body.exercise main>h1>div>select{font-size:1.2em;}
body.exercise main>*:not(h1){vertical-align:top; padding:0; margin:0;}
body.exercise main,body.exercise aside{position:relative;}
body.exercise main{width:98%; max-width:1178px; margin:5px 1%; white-space:nowrap; vertical-align:top; word-spacing:0; padding:0; position:fixed; top:130px; bottom:100px; height:auto;}
html[lang=en] body.exercise main{word-spacing:0em;}


/* Edited by Edmond 20180829 start */
/*
body.exercise main>aside{
	display:inline-block; 
	width:50px; 
	font-family:Arial; 
	padding:0 5px 0 0; 
	margin:0; 
	max-height:100%; 
	overflow:hidden; 
	position:absolute; 
	top:0; bottom:5px; 
	height:auto !important;
	background: #f8efe4;
	background: -moz-linear-gradient(top,  #f8efe4 1%, #c6e3d9 85%, #f8efe4 100%);
	background: -webkit-linear-gradient(top,  #f8efe4 1%,#c6e3d9 85%,#f8efe4 100%);
	background: linear-gradient(to bottom,  #f8efe4 1%,#c6e3d9 85%,#f8efe4 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8efe4', endColorstr='#f8efe4',GradientType=0 ); 
}

body.exercise main>aside *{list-style:none;width:48px;}
body.exercise main>aside a.arrow{background-color:#51c7bd; height:20px; background-size:35px 20px; border-radius:2px; display:none; position:relative;}
body.exercise main>aside ul{height:auto;}
body.exercise main>aside li{
	display:block;
	height:45px; 
	margin:0 0 5px 0; 
	border-radius: 5px 0px 0px 5px; 
	line-height:66px; 
	background: linear-gradient(to right, #ddd6cd 80%,#c1b29b 100%);
	color:rgba(0,0,0,.35); 
	font-size:1.2em; 
	cursor:pointer; 
	position:relative;
	padding-left: 3px;
}
body.exercise main>aside li:empty{display:none;}
body.exercise main>aside li>mark{position:absolute; background:none; margin:0 auto 0 -.5em;}
body.exercise main>aside li.current,body.exercise main>aside li.current:empty+li{
	width: 100%;
	color: #107779 !important;
	opacity: 1 !important;
	box-shadow: -3px 2px 2px #b2a290;
	background: #FFFFFF;
	padding-bottom: 0px;
	padding-left: 3px;
	padding-top: 0px;
	border-top-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-left-style: solid;
	border-top-color: #107779;
	border-left-color: #107779;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #107779;
}
*/

/*
body.exercise main>aside{
	display:inline-block; 
	width:50px; 
	font-family:Arial; 
	padding:0 5px 0 0; 
	margin:0; 
	max-height:100%; 
	overflow:hidden; 
	position:absolute; 
	top:0; bottom:5px; 
	height:auto !important;
	background: #f8efe4;
	background: -moz-linear-gradient(top,  #f8efe4 1%, #c6e3d9 85%, #f8efe4 100%);
	background: -webkit-linear-gradient(top,  #f8efe4 1%,#c6e3d9 85%,#f8efe4 100%);
	background: linear-gradient(to bottom,  #f8efe4 1%,#c6e3d9 85%,#f8efe4 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8efe4', endColorstr='#f8efe4',GradientType=0 );
}
body.exercise main>aside ul {height: auto;}
body.exercise main>aside * {list-style: none;}
body.exercise main>aside li {
	display: block;
	height: 45px;
	border-radius: 5px 0px 0px 5px;
	line-height: 66px;
	background: linear-gradient(to right, #ddd6cd 80%,#c1b29b 100%);
	color: rgba(0,0,0,.35);
	font-size: 1.2em;
	cursor: pointer;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 5px;
	margin-left: 0;
	text-align: left;
	position: relative;
	padding: 3px;
}
body.exercise main>aside li.current, body.exercise main>aside li.current:empty+li {
    width: 100%;
    color: #107779 !important;
    opacity: 1 !important;
    box-shadow: -3px 2px 2px #b2a290;
    background: #FFFFFF;
    padding-bottom: 0px;
    padding-left: 3px;
    padding-top: 0px;
    border-top-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-top-color: #107779;
    border-left-color: #107779;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #107779;
}
body.exercise main>aside li.done {color: rgba(255,255,255,.5);}
*/


/* 20181002 edited start */
body.exercise main>aside {
	display: inline-block;
	width: 68px;
	font-family: cssFontSansHKRegular;
	max-height: 100%;
	overflow: hidden;
	position: absolute;
	top: 0;
	bottom: 0;
	height: auto !important;
	background: #194f90;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 10px;
	padding: 0;
}
body.exercise main>aside *{list-style:none;}
body.exercise main>aside a.arrow{background-color:#51c7bd; height:20px; background-size:35px 20px; border-radius:2px; display:none; position:relative;}
body.exercise main>aside ul{height:auto;}
/* 20181019 edited start */
body.exercise main>aside li{
	display:block;
	height:49px; 
	margin:0 0 5px 0; 
	background-color: #194f90;
	border: 1px rgba(255, 255, 255, .5) solid;
	color:rgba(0,0,0,.35); 
	cursor:pointer; 
	position:relative;
	padding-bottom: 2px;
	padding-left: 3px;
	padding-top: 2px;
	width:66px;
}
body.exercise main>aside li:not(.current) {
	width:62px;
	margin-left:6px;
}
/* 20181019 edited end */
body.exercise main>aside li:empty{display:none;}
body.exercise main>aside li.current,body.exercise main>aside li.current:empty+li{
	width: 100%;
	color: #107779 !important;
	opacity: 1 !important;
	background: #FFFFFF;
	padding-bottom: 2px;
	padding-left: 3px;
	padding-top: 2px;
	border-top-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-left-style: solid;
	border-top-color: #107779;
	border-left-color: #107779;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #107779;
}
body.exercise main>aside li.done{color:rgba(255,255,255,.5);}
body.exercise main>aside.overflow li:first-of-type{margin-top:0px;}
body.exercise main>aside.overflow a.arrow{display:block; position:fixed; opacity:1 !important; width:48px; cursor:pointer; }
body.exercise main>aside.overflow a.arrow:after{content:"";display:block; width:inherit; height:auto; top:0; bottom:0; position:absolute; background:rgba(247,237,228,0.75); opacity:0;}
body.exercise main>aside.overflow a.arrow.up:after{bottom:-5px;}
body.exercise main>aside.overflow a.arrow.down:after{top:-5px;}
body.exercise main>aside.overflow a.arrow:hover:after{opacity:.25;}
body.exercise main>aside a.arrow.up{
	border-bottom: 5px solid #51c7bd;
	background-position: center 5px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	height:20px;
	display:block;
	width:68px;
}
body.exercise main>aside a.arrow.down{
	border-top:5px solid #51c7bd; 
	background-position:center -10px; 
	border-top-left-radius:0; 
	border-top-right-radius:0; 
	bottom:70px;
	height:20px;
	width:68px;
}
/* Edited by Edmond 20181002 start */
/*
body.exercise main.reach_top>aside a.arrow.up,body.exercise main.reach_bottom>aside a.arrow.down{opacity:1; cursor:default;}
*/
/* Edited by Edmond 20181002 end */
/* 20181019 edited start */
body.exercise main>aside li{
	display:block;
	height:45px; 
	margin:0 0 5px 0; 
	background-color: #194f90;
	border: 1px rgba(255, 255, 255, .5) solid;
	color:rgba(0,0,0,1); 
	cursor:pointer; 
	position:relative;
	padding-left: 3px;
}
/* 20181019 edited end */
body.exercise main>aside li:empty{display:none;}
body.exercise main>aside li .num{
	font-size: 18px;
	color:rgba(0,0,0,1);
}
body.exercise main>aside li:not(.current) .num {
	color:rgba(255,255,255,.5); 	
}
body.exercise main>aside.overflow ul{padding:0; position:absolute; padding-top:22px; padding-bottom:22px;}
body.exercise main>section{display:inline-block; width:auto; height:inherit; color:rgba(0,0,0,.7); background:#FFF; padding:0; border-radius:2px; position:absolute; bottom:0; top:0; right:0; left:48px;}
body.exercise main>aside li.current .num, body.exercise main>aside li.current:empty+li .num{
	color: #000000 !important;
}
mark.star:after,
mark.mark:after,
mark.hint:after,
mark.hint_used:after {
	content: "";
	position: static;
	display: inline-block;
	width: 14px;
	height: 14px;
	margin: 0px 0 0 0;
	background: #FFF;
	background-size: 100% auto;
	background-image: url(../../style/img/icon_color.svg);
	background-repeat: no-repeat;
	background-color:inherit;
}
mark.star:after {
    background-position: 0 28.5%;
}
mark.mark:after {
    background-position: 0 59%;
}
mark.hint:after {
    background-position: 0 24.5%;
}
mark.hint_used:after {
    background-position:0 26.55%;
}
mark {
	background: none;
	float: left;
	display: inline-block;
	height: 14px;
	width: 14px;
	margin: 0px;
	padding: 0px;
	box-sizing:inherit;
}
/* 20181019 edited start */
.num{
	margin: 0px;
	padding: 0px;
	line-height: 1.0em;
	display: block;
	width: 45px;
	float:left;
}
.num:before {
	content: "Q";
	font-size: 17px;
}
table.mark_area td {
	padding:0px;
	height: 20px;
}
/* 20181019 edited end */


/* 
body.exercise main.reach_top>aside a.arrow.up, body.exercise main.reach_bottom>aside a.arrow.down {
    opacity: 1;
    cursor: default;
}
.arrow.white {
    background-image: url(../../style/img/arrow_white.png);
}
body.exercise main>aside a.arrow {
    z-index: 99;
}

body.exercise main>aside a.arrow {
    background-color: #51c7bd;
    height: 20px;
    background-size: 35px 20px;
    border-radius: 2px;
    display: none;
    position: relative;
}
.arrow {
    background-image: url(../../style/img/arrow1.png);
    background-repeat: no-repeat;
    background-clip: content-box;
}
body.exercise main>aside a.arrow.up{
	border-bottom: 5px solid #51c7bd;
	background-position: center 5px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	height:20px;
	display:block;
}
body.exercise main>aside a.arrow.down{
	border-top:5px solid #51c7bd; 
	background-position:center -10px; 
	border-top-left-radius:0; 
	border-top-right-radius:0; 
	bottom:70px;
	height:20px;
}
body.exercise main>aside.overflow a.arrow:after{content:"";display:block; width:inherit; height:auto; top:0; bottom:0; position:absolute; background:rgba(247,237,228,0.75); opacity:0;}
body.exercise main>aside.overflow a.arrow.up:after{bottom:-5px;}
body.exercise main>aside.overflow a.arrow.down:after{top:-5px;}
body.exercise main>aside.overflow a.arrow:hover:after{opacity:.25;}


Edmond edited 20180828 */

/* Edmond edited 20180424 start */
/*
body.exercise main>aside li.done{color:rgba(255,255,255,.5);}
body.exercise main>aside li.star>mark:after, body.exercise main>aside li.hint>mark:before, body.exercise main>aside li.hint_used>mark:before{
	content:""; position:static; display:inline-block; width:14px; height:14px; margin:3px 0 0 0; background:#FFF; background:url(../img/icon_color.svg?a=2) no-repeat; background-size:100% auto;
}
body.exercise main>aside li.mark>mark:after{
	content:""; position:static; display:inline-block; width:14px; height:14px; margin:3px 0 0 0; background:#FFF; background:url(../img/icon_color.svg?a=2) no-repeat; background-size:100% auto;
}
body.exercise main>aside li.star>mark:after{background-position:0 28.5%;}
body.exercise main>aside li.mark>mark:after{background-position:0 59%;}
body.exercise main>aside li.hint>mark:before{background-position: 0 24.5%;}
body.exercise main>aside li.hint_used>mark:before{background-position:0 26.55%;}
body.exercise main>aside li:before{content:"Q"; font-size:.75em;}

body.exercise main>aside li:hover{opacity:.7;}
body.exercise main>aside.overflow{bottom:28px;}*/
/* Edmond edited 20180424 end */

/* Edmond edited 20170606 */
/*
body.exercise main>aside.overflow li:first-of-type{margin-top:0px;}
body.exercise main>aside.overflow a.arrow{display:block; position:fixed; opacity:1 !important;}
body.exercise main>aside.overflow a.arrow:after{content:"";display:block; width:inherit; height:auto; top:0; bottom:0; position:absolute; background:rgba(247,237,228,0.75); opacity:0;}
body.exercise main>aside.overflow a.arrow.up:after{bottom:-5px;}
body.exercise main>aside.overflow a.arrow.down:after{top:-5px;}
body.exercise main>aside.overflow a.arrow:hover:after{opacity:.25;}
body.exercise main.reach_top>aside a.arrow.up:after,body.exercise main.reach_bottom>aside a.arrow.down:after{opacity:.95 !important;}
body.exercise main>aside a.arrow.up{
	border-bottom: 5px solid #51c7bd;
	background-position: center 5px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	height:20px;
	display:block;
}
body.exercise main>aside a.arrow.down{
	border-top:5px solid #51c7bd; 
	background-position:center -10px; 
	border-top-left-radius:0; 
	border-top-right-radius:0; 
	bottom:70px;
	height:20px;
}*/
/* Edmond edited 20170606 */
/*body.exercise main>aside.overflow ul{padding:0; position:absolute; padding-top:22px; padding-bottom:22px;}*/


body.exercise main>section{display:inline-block; width:auto; height:inherit; color:rgba(0,0,0,.7); background:#FFF; padding:0; border-radius:2px; position:absolute; bottom:0; top:0; right:0; left:78px;}

/* Edmond edited 20170622 
body.exercise main>section>*{display:inline-block; width:auto; position:absolute; left:auto; right:auto; top:auto; bottom:auto; transform-origin:top left;}*/
body.exercise main>section>*{display:inline-block; position:absolute; left:auto; right:auto; top:auto; bottom:auto; transform-origin:top left;}

body.exercise main>section div.qnum{font-family:Arial; color:#000000; font-size:1.2em; top:20px; left:20px;}
body.exercise main>section div.qnum:before{content:"Q";font-size:.75em; position:relative;}
body.exercise main>section div.qnum>q{quotes:"[ " " ]"; color:#999; font-weight:normal; font-size:.85em; vertical-align:baseline; padding:0 .2em;}
/* Edmond edited 20180619 start */
span.qnum2{color:#ff0000; font-weight:normal; font-size:.85em; vertical-align:baseline; padding:0 .5em;}
/* Edmond edited 20180619 end */
body.exercise main>section div.qnum>q:before, body.exercise main>section .qnum>q:after{font-size:.75em; letter-spacing:.1em; vertical-align:baseline; position:relative;}
body.exercise main>section div.top_button{top:10px; right:10px;}
/* Edmond edited 20180424 start */
body.exercise main>section div.top_button>*{
	color: #555;
	border-radius: 2px;
	padding: 0.2em;
	margin: 0 0 0 2px;
	display: inline-block;
	height: 30px;
	vertical-align: bottom;
	overflow: hidden;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #d6d6d6;
	border-right-color: #999999;
	border-bottom-color: #999999;
	border-left-color: #d6d6d6;
	box-shadow: 1px 1px 1px #b5b5b5;
	background: rgba(230, 230, 230, .4)
}
body.exercise main>section div.top_button>:hover{
	color: #555;
	border-radius: 2px;
	padding: 0.2em;
	margin: 0 0 0 2px;
	display: inline-block;
	height: 30px;
	vertical-align: bottom;
	overflow: hidden;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #d6d6d6;
	border-right-color: #999999;
	border-bottom-color: #999999;
	border-left-color: #d6d6d6;
	box-shadow: 1px 1px 1px #b5b5b5;
	background-color: #ffe800;
	opacity:1;
}
/* Edmond edited 20180424 end */
html[lang=en] body.exercise main>section div.top_button>*{font-size:.95em; padding:0.2em 0 0 0;}
body.exercise main>section div.top_button>*.icon:before{display:inline-block; position:relative; margin:0 10px 0 0; opacity:.3; width:24px; height:24px; vertical-align:sub;}
body.exercise main>section div.top_button>*:hover.icon:before{display:inline-block; position:relative; margin:0 10px 0 0; opacity:1; width:24px; height:24px; vertical-align:sub;}
body.exercise main>section div.top_button>*.icon.tag:before{background-position:0 28.45%;}
body.exercise main>section div.top_button>*.icon.hint:before{background-position:0 24.45%;}
body.exercise main>section div.top_button>*.icon.edit:before{background-position:0 32.6%;}
body.exercise main>section div.top_button>*.icon.fullscreen:before{background-position:0 73.15%;}
body.exercise main>section div.top_button>*.icon.window:before{background-position:0 75.05%;}
body.exercise main>section div.top_button>*.icon.remove:before{background-position:0 34.6%;}
body.exercise main>section div.top_button>*.icon.delete:before{background-position:0 34.6%;}
body.exercise main>section div.top_button>*.icon.related:before{background-position:0 83.5%; margin:0 5px 0 10px;}
body.exercise main>section div.top_button>*.icon.undo:before{background-position:0 48.85%; margin:0 5px 0 10px;}
body.exercise main>section div.top_button>*.icon.redo:before{background-position:0 50.85%; margin:0 5px 0 10px;}
body.exercise main>section div.top_button>*.icon.add:before{background-position:0 77.3%;}
body.exercise main>section div.top_button>*.icon.copy:before{background-position:0 89.4%;}
body.exercise main>section div.top_button>*.icon.note:before{background-position:0 32.55%;}
body.exercise main>section div.top_button>*.icon.ans_guide:before{background-position:0 69.1%;}
body.exercise main>section div.top_button>*.button_tag, body.exercise main>section div.top_button>*.icon.related, body.exercise main>section div.top_button>*.icon.undo, body.exercise main>section div.top_button>*.icon.redo{margin:0;border-radius:0; border-right-width:0; border-left-width:0;}
body.exercise main>section div.top_button>*.button_tag{border-radius:2px;}
body.exercise main>section div.top_button>*.icon.related:after, body.exercise main>section div.top_button>*.icon.undo:after{content:"";border-right:1px solid #DDD; position:relative; top:-14px; left:-1px; height:10px; display:inline-block;}
body.exercise main>section div.top_button>*.button_tag{border-left-width:1px;}
body.exercise main>section div.top_button>*.button_tag:hover{opacity:1;}
body.exercise main>section div.top_button>*.button_tag:before{font-size:.85em; position:relative; top:-.55em;}
body.exercise main>section div.top_button>*.icon.related{border-right:0 none;border-left:0 none;}
body.exercise main>section div.top_button>*.icon.related, body.exercise main>section>div.top_button>*.icon.undo{margin:0 -1px;}
body.exercise main>section div.top_button>*.icon.redo{border-right-width:1px; border-top-left-radius:2px; border-bottom-left-radius:2px;}
body.exercise main>section div#frameBoxQus{position:absolute; top:45px; bottom:50px; left:20px; right:10px; width:auto; display:block; height:auto !important; max-width:inherit; overflow:hidden; clear:both; white-space:normal; font-size:1.3em; line-height:150%; padding:0;}

body.exercise main>section div.question{display:block;/* max-height:100%; */min-height:150px;}
body.exercise main>section div.question>form{word-spacing:0;margin-bottom:.5em}
body.exercise main>section div.question *.icon.play_sound{display:inline-block; width:1em; height:1em; border:1px solid #CCC; border-radius:5px; vertical-align:top; box-sizing:content-box; padding:5px; margin:0 2px;}
body.exercise main>section div.question *.icon.play_sound:before{background-position:0 91.5%; opacity:.7;}
body.exercise main>section div.question *.icon.play_sound.on, body.exercise main>section div.question *.icon.play_sound.on:hover{background-color:#CCC; opacity:1;}
body.exercise main>section div.question *.icon.play_sound.on:before{opacity:1;}
body.exercise main>section div.question.MC_point>*:first-child{padding-bottom:.2em;}
body.exercise main>section div.long_question>div#student_answer{border:1px solid #DDD; padding:10px; margin:0 0 10px 0; font-size:.9em; font-weight:normal; height:50%;; overflow-y:auto; line-height:150%;}
body.exercise main>section div.question.group>*.left{position:fixed; top:120px; bottom:120px; width:500px; overflow:auto; display:inline-block; margin:0 auto 0 0;}
body.exercise main>section div.question.group>*:not(.left){position:relative; width:400px; margin:0 0 0 520px; display:block;}
body.exercise main>section div.question.group>*.left+*{margin-top:.5em;}
body.exercise main>section div.question.group>*{padding-bottom:.25em}
body.exercise main>section div.page_nav{
	display: block;
	clear: both;
	border-top: 1px solid #CCC;
	left: 10px;
	right: 10px;
	bottom: 10px;
	background: #FFF;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 10px;
	text-align:center;
}
body.exercise main>section>div.page_nav:empty{bottom:35px;}
body.exercise main>section div.page_nav .inactive{display:none;}
body.exercise main>section div.page_nav>*{display:inline-block; font-family:Arial; font-size:1.2em; text-align:center;}
body.exercise main>section div.page_nav>*:before{content:"Q"; font-size:.8em; position:relative;}
body.exercise main>section div.page_nav>strong{padding:0; text-align:center; opacity:.5; font-size:1.35em; vertical-align:baseline;}
body.exercise main>section div.page_nav>strong.manual_mark{padding-right:20px;}

/* Edmond edited 20170606 */
body.exercise main>section div.page_nav>a.arrow{
	font-size:.95em;
	color:#009689;
	background-size:20px 25px;
	background-origin:border-box;
	border:10px solid #FFF;
	border-top:0 none;
	border-bottom:0 none;
	background-color:#b3e4e1;
}
body.exercise main>section div.page_nav>a.arrow:after{content:""; padding:0 20px 0 0;}
body.exercise main>section div.page_nav>a.arrow:before{font-size:.8em;}
body.exercise main>section div.page_nav>a.arrow.right{background-position:left 0;}
body.exercise main>section div.page_nav>a.arrow.right:before{padding:0 0 0 20px;}
body.exercise main>section div.page_nav>a.arrow.left{background-position: right 0;}
body.exercise main>section div.page_nav>a.arrow.left:before{padding:0 0 0 20px;}

/* Edmond edited 20170606 */
body.exercise main>section div.page_nav>a.arrow1{
	font-size:1.3em;
	color:#009689;
	background-size:20px 25px;
	background-origin:border-box;
	border:10px solid #FFF;
	border-top:0 none;
	border-bottom:0 none;
	background-color:#b3e4e1;
}
body.exercise main>section div.page_nav>a.arrow1:after{content:""; padding:0 20px 0 0;}
body.exercise main>section div.page_nav>a.arrow1:before{font-size:.8em;}
body.exercise main>section div.page_nav>a.arrow1.right{background-position:left 0;}
body.exercise main>section div.page_nav>a.arrow1.right:before{padding:0 0 0 20px;}
body.exercise main>section div.page_nav>a.arrow1.left{background-position: right 0;}
body.exercise main>section div.page_nav>a.arrow1.left:before{padding:0 0 0 20px;}

.use_time{
	float:right;
	text-decoration:none;
	background-color:#C7B4A3;
	padding:5px 5px 5px 5px;
	line-height:100%;
	color:#FFFFFF;
	margin-right:10px;
	margin-top:5px;
	border-radius: 2px;
}
.use_time:hover{
	background-color:#947960;
}

body.exercise main>section>div.bottom_button{width:auto; padding:0; margin:-25px 0 -50px auto; bottom:40px; right:10px;}
body.exercise main>section>div.bottom_button>a{display:inline-block; background:#ff6b00; color:#FFF; padding:0 15px; font-size:27px; line-height:33px; font-weight:normal; border-top:10px solid #ff6b00; border-bottom:10px solid #ff6b00; border-left:1px solid rgba(255,255,255,.3);}

html[lang=en] body.exercise main>section>div.bottom_button>a{font-size:1.2em; padding:0 10px;}
body.exercise main>section>div.bottom_button>*.icon:before{display:inline-block; position:relative; width:30px; height:30px; vertical-align:middle; margin:0 5px 0 0;}
body.exercise main>section>div.bottom_button>*.icon.finish:before{background-position:0 14.25%;}
body.exercise main>section>div.bottom_button>*.icon.save:before{background-position:0 12.2%;}
body.exercise main>section>div.bottom_button>*.icon.submit:before{background-position:0 10.2%;}
body.exercise main>section>div.bottom_button>*.icon.preview:before{background-position:0 85.35%;}
body.exercise main>section>div.bottom_button>*.icon.prev_step:before{background-position:0 16.25%%;}
body.exercise main>section>div.bottom_button>*.icon.next_step:before{background-position:0 18.25%;}
body.exercise main>section>div.bottom_button>*.icon.reset:before{background-position:0 48.8%;}
body.exercise main>section>div.bottom_button>*.icon.add:before{background-position:0 77.2%}
body.exercise main>section>div.bottom_button>a:first-of-type{border-top-left-radius:5px;border-bottom-left-radius:5px;}
body.exercise main>section>div.bottom_button>a:last-of-type{border-top-right-radius:5px;border-bottom-right-radius:5px;}
body.exercise main>section>div.bottom_button, body.exercise main>section>div.top_button{font:inherit; text-shadow:0 0 0; word-spacing:-.05em;padding-right:.5em;}
body.exercise main>section>div.top_button>small{background:rgba(230,230,230,.4); border-width:1px !important; margin-left:5px !important;}
body.exercise main>section>div.top_button>small>.score:before{color:#333; font-weight:normal; font-size:2em; letter-spacing:-.01em;}
body.exercise main>section>div.top_button>small:after{font-size:.75em; position:relative;}
body.exercise main>section>div.top_button>small>.score{display:inline-block; height:inherit; font-weight:normal; opacity:.6; padding:0 .25em;}
body.exercise main>section div.top_button>small.button_tag:before{display:inline-block; height:inherit; line-height:1em; vertical-align:top; top:-2px;}
.question *[question], div[id^=answers]>*:not(button), div#popup.popform>*:not(h2):not(.buttons):not(form), h2.hints~div:not([class]){line-height:1.75em;}

.icon.white.save2:before, .icon.white.submit2:before {
    background-image: none!important;
	width:0!important;
	height:0!important;
}
.icon.white.save2, .icon.white.submit2 {
	width:160px!important;
	height:50px!important;
	text-align: center;
	border-radius:5px;
}
.icon.white.save2 {
    margin-right: 10px;
}
.icon.white.save2:hover, .icon.white.submit2:hover {
	border-top: 10px solid #CC5600!important;
    border-bottom: 10px solid #CC5600!important;
	background-color: #CC5600!important;
	opacity:1!important;
}

/*drawing*/
body.drawing main>aside{width:105px;}
body.drawing main>aside *{width:100px !important;}
body.drawing main>aside li{ height:140px; background:rgba(0,0,0,.25); line-height:100%;}
body.drawing main>aside li>img{opacity:.5;position:absolute; width:inherit; height:inherit; display:block; top:0; left:0;}
body.drawing main>aside li.current{border:1px solid #DDD;}
body.drawing main>aside li.current>img{opacity:.1}
body.drawing main>aside li:before{content:"P";}
body.drawing main>section{width:885px;}
body.drawing main>section div.qnum:before{content:"P";font-size:.75em;}
body.drawing main>section div.question{padding:0; top:45px; left:10px;}
body.drawing main>section div.question>img{position:relative; width:100%; height:auto; padding:0;}
body.drawing main>section canvas{position:absolute; width:100%; top:0; left:0; border:1px solid #FFF;}
body.drawing main>section div#tool{position:fixed; top:115px; border-radius:5px; background:rgba(255,255,255,.3); padding:5px; margin:5px; display:block; line-height:100%;}
body.drawing main>section div#tool>*{display:inline-block;vertical-align:middle;width:380px;}
body.drawing main>section div#tool #options{padding:9px 5px; height:40px; background:#FAFAFA; border:1px solid #EEE; border-radius:5px; font-size:.65em;}
body.drawing main>section div#tool #options>var{font-size:1.5em; padding:0 .2em;}
body.drawing main>section div#tool #options>*{vertical-align:middle;}
body.drawing main>section div#tool #options div.tool_box1{float:left;}
body.drawing main>section div#tool #options div.tool_box2{float:left;}
body.drawing main>section div#tool #options div.tool_box3{float:left; padding-left:5px;}
body.drawing main>section div#tool button{display:inline-block; width:40px; height:40px; background:url(../img/icon_white.svg) no-repeat; background-size:100% auto; background-color:#555; background-origin:content-box; border-radius:5px; padding:5px; margin:0 0 0 2px; opacity:.35;}
body.drawing main>section div#tool button:hover{opacity:.5;}
body.drawing main>section div#tool button.current{opacity:.9; background-color:#51C7BD; color:#51C7BD; border:1px solid;}
body.drawing main>section div#tool button.current:after{content:""; position:relative; left:20px; font-size:.8em;}
body.drawing main>section div#tool button#pen{background-position:0 44.7%;}
body.drawing main>section div#tool button#rubber{background-position:0 46.7%;}
body.drawing main>section div#tool button#undo{background-position:0 48.8%;}
body.drawing main>section div#tool button#redo{background-position:0 50.85%;}
body.drawing main>section mark{display:inline-block; width:.7em; height:.7em; border-radius:100%; margin:0 5px; cursor:pointer; }
body.drawing main>section mark:berfore{content:" ";}
body.drawing main>section mark.red{background-color:#F00;}
body.drawing main>section mark.blue{background-color:#00F;}
body.drawing main>section mark.green{background-color:#0F0;}
body.drawing main>section mark.yellow{background-color:#FF0;}
body.drawing main>section mark.black{background-color:#000;}
body.drawing main>section mark.selected{zoom:1.5;}
body.drawing main>section>div.page_nav>*:before{content:"P";}

/* file upload*/
body.file main>section{width:795px;}
body.file main>aside{border-radius:2px; padding:0 10px; margin-right:5px;}
body.file main>aside, body.file main>section{height:inherit;}
body.file main>*:not(h1)>*:not(.bottom_button|.top_button){position:absolute; display:block; left:10px; right:10px; width:auto;}
body.file main>aside *{width:auto !important;}
body.file main>aside>*{position:absolute;}
body.file main>aside{width:190px; background:#00b4a5; color:#FFF; white-space:normal; font:inherit;}
body.file main>aside a.icon{font-size:1.2em; display:block; line-height:130%; padding:10px; border:1px solid rgba(255,255,255,.5); color:#FFF;}
body.file main>aside a.icon.homework:before{background-position:0 36.6%;}
body.file main>aside a.icon.test:before{background-position:0 38.6%;}
body.file main>aside a.icon.uploaded:before{background-position:0 71.15%;}
body.file main>aside a.icon>strong{display:block;}
body.file main form{font-size:1em; position:absolute; bottom:10px; width:770px}
body.file main form button{font-size:1.5em; float:right; border-radius:5px; border:1px solid #DDD; padding:.25em 2em; margin-top:-.25em;}
body.file main form button:hover{background:#FAFAFA;}
body.file main>section>div.page_nav>*:before{content:"";}

/*check answer / marking*/
body.check main>section.correct .qnum>q>.score:before{color:#01770f;}
body.check main>section.wrong .qnum>q>.score:before{color:#c22a2a;}
/*body.check main>section div.question{height:100% !important; margin-bottom:1%;}*/
body.check main>section div.question{margin-bottom:1%;}
/* 20181023 edited start */
body.check div.question mark{position:relative; float:inherit}
/* 20181023 edited end */
body.check main>section>div[id^=answers]{font-size:1.3em; left:10px; right:10px; height:auto !important;}
body.check main>section>*>div[id^=answers]{position:relative; width:100%;}
/* Edmond edited 20170619 start*/
body.check main>section div[id^=answers]{background:#FFF;padding-top:20px; padding-left:10px; padding-right:0px; padding-bottom:20px;}
/* Edmond edited 20170619 end*/
body.check main>section div[id^=answers]>button{background:#536f8a; color:#FFF; margin-top:-30px; padding:5px 10px; padding-bottom:0; border:1px solid #e9e9e9; border-bottom:0 none; border-radius:2px; border-bottom-left-radius:0; border-bottom-right-radius:0; text-shadow:none; bottom:-1px; position:relative;}
body.check main>section div[id^=answers]>*:not(div){margin-top:-30px; float:left;}
body.check main>section div[id^=answers]>div{display:none;}
body.check main>section div[id^=answers].explanation>button.explanation,body.check main>section div[id^=answers].model_answer>button.model_answer,body.check main>section div[id^=answers].feedback>button.feedback,
body.check main>section div[id^=answers].feedback_pos>button.feedback_pos,
body.check main>section div[id^=answers].feedback_neg>button.feedback_neg,
body.check main>section div[id^=answers].comment>button.comment,body.check main>section div[id^=answers].hint>button.hint,body.check main>section div[id^=answers].reference>button.reference
{background:#FFF; color:#666; font-weight:bold; cursor:default;}
html[lang=en] body.check main>section div[id^=answers].explanation>button.explanation,
body.check main>section div[id^=answers].model_answer>button.model_answer,
body.check main>section div[id^=answers].feedback>button.feedback,
body.check main>section div[id^=answers].feedback_pos>button.feedback_pos,
body.check main>section div[id^=answers].feedback_neg>button.feedback_neg,
body.check main>section div[id^=answers].comment>button.comment,
body.check main>section div[id^=answers].hint>button.hint,
body.check main>section div[id^=answers].reference>button.reference
{word-spacing:1px;}
body.check main>section div[id^=answers].explanation>div.explanation,
body.check main>section div[id^=answers].model_answer>div.model_answer,
body.check main>section div[id^=answers].feedback>div.feedback,
body.check main>section div[id^=answers].feedback_pos>div.feedback_pos,
body.check main>section div[id^=answers].feedback_neg>div.feedback_neg,
body.check main>section div[id^=answers].comment>div.comment,
body.check main>section div[id^=answers].hint>div.hint,
body.check main>section div[id^=answers].reference>div.reference
{display:block; padding:10px; border:1px solid #E9E9E9; background-color:#FFF; background-clip:content-box; overflow:inherit; clear:both;}

/* Edmond edited 20170622 */
body.check main>section div[id^=answers].explanation>div.explanation>p>img,
body.check main>section div[id^=answers].model_answer>div.model_answer>p>img,
body.check main>section div[id^=answers].feedback>div.feedback>p>img,
body.check main>section div[id^=answers].feedback_pos>div.feedback_pos>p>img,
body.check main>section div[id^=answers].feedback_neg>div.feedback_neg>p>img,
body.check main>section div[id^=answers].comment>div.comment>p>img,
body.check main>section div[id^=answers].hint>div.hint>p>img
{max-width: 99%}

body.check main>section div[id^=answers].comment>div.comment{overflow:hidden;}
body.check main>section>div[id^=answers]>div{height:inherit !important;}
body.check main>section div[id^=answers]>div>p{padding:.1em .5em;}
body.check main>section div[id^=answers] a{color:#82B800 !important; text-decoration:underline;}

/*upload*/
body.check.file main>*:not(h1)>*:first-child{top:10px;}
body.check.file main>aside>*{top:10px; left:0; position:relative; margin-bottom:10px;}

/*Question Type Formal*/
div.question label{line-height:130%; display:inline-block;}
div.question.MC_point>p{font-weight:bold;}
div.question.MC_point>label{margin:.25em 0; text-indent:-1.35em; padding-left:1.35em;}
div.question.MC_point>label>input{margin-right:.5em;}

div#popup{width:440px; height:250px; position:fixed; top:50%; left:50%; margin:-185px auto auto -200px; font-size:1.5em; line-height:120%; text-align:center;}
div#popup:before{content:""; background:rgba(0,0,0,.7); position:fixed; top:0; left:0; bottom:0; right:0; display:block;}
div#popup:after{content:""; display:block; position:absolute; border-radius:2px; background:url(../img/popup_bg.png) no-repeat; top:0; left:0; right:0; bottom:0;}

div#popup.confirm:after {
	background:#EA327A 50px 20px url(../img/reminder.png) no-repeat!important;
}
div#popup.start_test:after {
	background:#EA327A 50px 20px url(../img/timeup.png) no-repeat!important;
}

div#popup>*{position:relative;}
div#popup strong{display:block; margin:0 25px 0 auto; color:rgba(0,0,0,.7);font-family:cssFontSansHKMedium;font-size:26px; color:#ffffff; line-height:31px;}
div#popup strong b{display:block; font-size:1.5em; margin-bottom:.35em; font-family:cssFontSansHKMedium;font-size:26px; color:#ffffff; line-height:31px;}
div#popup p{border-bottom-left-radius:2px; border-bottom-right-radius:2px; background:#EA327A; padding:10px;}
div#popup button{background:none; border-radius:5px;border:1px #DDD solid; color:#EA327A; background:#ffffff; margin:0; padding:10px; cursor:pointer; display:table-cell;}
div#popup button:hover {opacity:.7;}
div#popup button#btn1 {margin-right:10px;}
div#popup div#error_message_div>p{background:#FFF!important;padding:0!important;}

div#popup.msg{text-align:center; margin:0 auto auto -25% !important; top:20% !important; width:50% !important;}
div#popup.msg *{margin:0 auto; padding:0;}
div#popup.msg:after{background:#FFF;}
div#popup.confirm:after{background-color:#EA327A; background-position:0 0;}
div#popup.confirm strong{width:260px; height:180px; padding:0.8em 0 0 0; text-align:left;font-family:cssFontSansHKMedium;font-size:26px; color:#ffffff; line-height:31px;}

div#popup.start_test:after{background-position:0 -250px; background-color:#EA327A;}
div#popup.start_test strong{width:220px; height:180px; padding:0.5em 0 0 0; text-align:left;font-family:cssFontSansHKMedium;font-size:26px; color:#ffffff; line-height:31px;}
div#popup.start_test strong>b{text-align:left; font-family:cssFontSansHKMedium;font-size:26px; line-height:31px;}
div#popup.start_test strong>b>var{display:inline; font:inherit; font-size:1.1em;}
div#popup.start_test strong>b>var:before,div#popup.start_test strong>b>var:after{font-size:.7em; vertical-align:bottom;}
div#popup.start_test strong>b>var:before{display:inline; font-size:.8em;}
div#popup.start_test strong>b>var:first-of-type:before,div#popup.start_test strong>b>var:last-of-type{display:block;}
div#popup.start_test strong>b>var:last-of-type{font-size:.8em; margin-top:.1em}

div#popup.emptylist:after{background-position:0 -500px; background-color:#ffae00;}
div#popup.emptylist strong{width:240px; height:200px; padding:1.5em 0 0 0; margin:0 20px 0 auto;font-family:cssFontSansHKMedium;font-size:26px; line-height:31px;}
div#popup.emptylist strong>b{line-height:110%; margin-bottom:.1em;}

div#popup.select_option{min-height:180px; height:auto;}
div#popup.select_option:after{background-color:#EA327A; background-image:none;}
div#popup.select_option strong{width:auto; height:auto; padding:1.1em .25em 1em .25em; margin:0 auto; text-align:center; font-family:cssFontSansHKMedium;font-size:26px; color:#ffffff; line-height:31px;}
div#popup.select_option strong var{font-size:.9em; padding:0 0 1em 0;}
div#popup.select_option strong var q{quotes:"" "";}
div#popup.select_option strong var q:before{position:relative; left:-.2em; top:-.4em; font-size:.8em; opacity:.8;}
div#popup.select_option strong var q:after{position:relative; right:-.2em; bottom:-.25em; font-size:.8em; opacity:.8;}
div#popup.select_option strong var:before{display:block; font-size:.7em; opacity:.9;}
div#popup.select_option strong>b{margin:0 auto; padding-bottom:.5em; font-family:cssFontSansHKMedium;font-size:26px; line-height:31px;}

div#popup.create_success{height:auto;}
div#popup.create_success:after{background-color:#EA327A; background-image:none;}
div#popup.create_success strong{text-align:center; margin:2em auto 1.25em auto;font-family:cssFontSansHKMedium;font-size:26px; color:#ffffff; line-height:31px;}

div#popup.popform:after{background:none #FFF;}
div#popup.popform{width:90%; max-width:800px; height:auto; margin:0 auto; padding:1em .5em .5em 1em; top:10%; left:0; right:0; background:#FFFFFF;}
div#popup.popform img {max-width:100%;max-height:100%;}
div#popup.popform>*{display:block; position:relative; margin:0; padding:0; text-align:left; height:auto; max-height:55vh;}
div#popup.popform>form{line-height:24px; min-height:150px; overflow:auto; font-size:16px;}
div#popup.popform>form>*{font-weight:normal;}
div#popup.popform>h2{font-size:1.3em; color:#00a09a; padding:0 0 .2em 0;}
div#popup.popform>h2>small{font-size:28px; padding-left: 0px; padding-bottom:.5em; vertical-align:baseline;}
div#popup.popform>h2>small:before,div#popup.popform>h2>small:after{font-size:.75em; vertical-align:bottom;}
div#popup.popform[data-step=null]>h2>small{display:none;}
div#popup.popform>h2:empty~div{word-break:break-all; word-wrap:break-word;overflow: auto;}

/* Edmond edited 20180424 start */
div#popup.popform dt, div#popup.popform dd{padding:.4em .6em;}
/* Edmond edited 20180424 end */
div#popup.popform form#download_paper dt, div#popup.popform form#download_paper dd{padding:.4em 0;}
div#popup.popform dt{display:block; clear:both;}

/* Edmond edited 20170606 */
div#popup.popform dt:before,div#popup.popform dt+dd:before{display:inline-block; position:relative; width:20%; white-space:normal; float:left;}

div#popup.popform dd~dd, div#popup.popform dt+dd{display:table-cell;}

/* Edmond edited 20170606 */
div#popup.popform *>label{display:inline-table;font-weight:normal;font-family: sans-serif;}

div#popup.popform dt[data-before]:hover{background:#F9F9F9;}
/* Edmond edited 20180424 start */
div#popup.popform dt[data-before]>select{width:78%;margin:0 0 0 auto;line-height: 130%;}
/* Edmond edited 20180424 end */
div#popup.popform dt[data-before]>select+select{margin-top:.5em; margin-left:20%;}
div#popup.popform dt#question_type>label{width:32%;}
div#popup.popform dd>select{width:150px; margin-right:2em;}
div#popup.popform *:after, div#popup.popform *:before{font-size:inherit; white-space:nowrap;}
div#popup.popform dt input[data-after]{margin-right:20px;}
div#popup.popform dd input[data-after]{margin-right:20px;}
div#popup.popform input[data-after]:after{margin-left:1.2em; font-size:.7em; line-height:100%;}
/*
div#popup.popform form#download_paper dt[data-before]{padding-left:200px;}
div#popup.popform form#download_paper dt[data-before]:first-of-type{padding-left:200px;}
*/
div#popup.popform form#create_question div#text_editor{height:10em; border:1px solid #DDD; display:block;}
div#popup.popform form#download_paper dt>label{font-size:inherit; white-space:nowrap;font-family: cssFont;}
div#popup.popform form#create_question h3.expand~div>div#text_editor{margin-bottom:.5em;}

/*font-size:.85em*/
/* Edmond edited 20180706 start */
div#popup.popform>form a{
	color: #82b800;
	font-size: 1em;
	margin-right: 1em;
	display: inline-block;
	line-height: 1.2em;
	text-decoration: none;
}
/* Edmond edited 20180706 end */
div#popup.popform>form a:hover{opacity:.7;}
div#popup.popform>form h3{display:block; margin:.3em 0 .25em 0; color:#00a09a; font-size:1.1em;}
div#popup.popform div.buttons{text-align:center; padding:.2em 0 0 0;}
div#popup.popform div.buttons>button{background:#ff6b00; color:#FFF; border:0 none; border-top:.5em solid #ff6b00; border-bottom:.5em solid #ff6b00; padding:0 0.6em; width:120px; height:40px; display:inline-block;margin-right:20px;}
/* edit 20200817*/
div#popup.popform div.buttons>button#btn_cancel{background: rgba(153,153,153,1);border-top:.5em solid rgba(153,153,153,1); border-bottom:.5em solid rgba(153,153,153,1); }

/* edit 20200817*/
div#popup.popform button:nth-of-type(1){border-bottom-left-radius:2px; border-top-left-radius:2px;}
div#popup.popform button:nth-last-of-type(1){border-right:0; border-bottom-right-radius:2px; border-top-right-radius:2px;}
div#popup.popform div#finish_msg{display:none; text-align:center;}
div#popup.popform div#finish_msg.show{display:block; padding:2em 0;}
div#popup.popform div#finish_msg.show:before{display:block; height:80%; text-align:center; font-size:2.2em; margin:.5em auto; color:#00a09a;}
div#popup.popform div#finish_msg.show>span>a{background:#82b800; color:#FFF; border:0 none; font-size:1em; border-top:.35em solid #82b800; border-bottom:.35em solid #82b800; padding:0 1.5em; margin:.5em auto; display:inline-block; width:auto; border-radius:2px; position:relative;}
div#popup.popform div#finish_msg.loading{background:url(../img/loading.svg) no-repeat top center; background-size:auto 80%;}
div#popup.popform div#finish_msg.loading:before{color:rgba(0,0,0,0)}
div#popup.popform div#finish_msg.loading>span:first-of-type{display:inline;}
div#popup.popform div#finish_msg.loading>span:last-of-type{display:none;}
div#popup.popform div#finish_msg:not(.loading)>span:first-of-type{display:none;}
div#popup.popform div#finish_msg:not(.loading)>span:last-of-type{display:inline;}
/* Edmond edited 20170606 */
div#popup.popform div.buttons>.button1 {background:#ff6b00; border-top:.5em solid #ff6b00; border-bottom:.5em solid #ff6b00;}

div dl.dropdown{margin:0; display:inline-block;}
div dl.dropdown dt, div dl.dropdown dd{margin:0; padding:0;}
div dl.dropdown dt, div dl.dropdown dt>input, div dl.dropdown>dd{width:140px;}
div dl.dropdown>dd.show{height:8em;}
div dl.dropdown dt>input{}
div dl.dropdown dd{opacity:1; position:absolute; background:rgba(255,255,255,.95); border-bottom-right-radius:5px; border-bottom-left-radius:5px; border-top:0 none; margin:-1px 0 0 0; height:0; overflow:auto;}
div dl.dropdown dd:empty{border:0 none;}
div dl.dropdown dd.show{border:1px solid #CCC;}
div dl.dropdown dd>*{display:block; padding:.25em 1em; border-top:1px solid #EEE;}
div dl.dropdown dd>*:hover{background:#DDD;}
div#popup>form p.two_column{display:inline-block; width:640px; line-height:130%; padding:.3em 0; vertical-align:top;}
div#popup>form p.two_column>label{width:32%; margin:0; display:inline-block;}
div#popup>form#upload_resources>p{font-size:.85em; display:block; opacity:.6;}
div#popup>form#upload_resources:after{font-size:.85em; display:block; opacity:.6;}
div#popup>form>span{font-size:.75em;}
div#popup>form input[type=file]{border:1px solid #DDD;}
div#popup>form>h3[class]{margin-top:1em; line-height:120%;}
div#popup>form>h3[class]:after, div#popup>form>h3[class]:before{border-bottom:1px solid; cursor:pointer;}
div#popup>form>h3[class]:after{background:#00a09a; color:#FFF; display:inline-block; width:1em; height:1em; text-align:center; padding:.1em; margin-left:.2em; border-radius:1em;}
div#popup>form>h3.collapse:after{content:"+";line-height:1.1em;}
div#popup>form>h3.collapse+*{display:none;}
div#popup>form>h3.expand:after{content:"－";}
div#popup>form>h3.expand+*{display:block; padding:0; line-height:inherit; font:inherit; padding-bottom:.5em;}
div#popup>form#download_paper label>*{font-weight:normal;}
div#popup>form#gen_question dt,div#popup>form#gen_question dd{display:inline-block; width:18%; padding:0.6em 0; margin:0; border-bottom:1px dashed #CCC;}
div#popup>form#gen_question dt{width:25%; padding-left:0.5em}
div#popup>form#gen_question dd:before, div#popup>form#gen_question dd:after{position:static;display:inline;}
div#popup>form#gen_question>:nth-last-child(1),div#popup>form#gen_question>:nth-last-child(2),div#popup>form#gen_question>:nth-last-child(3),div#popup>form#gen_question>:nth-last-child(4),div#popup>form#gen_question>:nth-last-child(5){border-bottom:0 none;}
div#popup>form#gen_question input[type=number]{line-height:100%; text-align:center;}

/* Contact Form*/
div#popup>form#contact_form, div#popup>form#contact_form~dl{font-size:17px;}
div#popup>form#contact_form{width:73%; display:inline-block; margin:0 1%;}
div#popup>form#contact_form~dl{font-size:13px; letter-spacing:0; width:22%; float:left; padding:1em 1em 2em 0; border-right:1px solid #DDD; opacity:.7; position:absolute; top:45px; bottom:10px;}
html[lang=ch] div#popup>form#contact_form~dl{font-size:16px;}
div#popup>form#contact_form~dl:before{text-transform:uppercase; opacity:.25; font-size:1em; display:block; white-space:normal;}
div#popup>form#contact_form~dl>*{display:block; margin:0 0 .75em 0; padding:.2em 0 0 0; line-height:135%; white-space:normal;}
html[lang=en] div#popup>form#contact_form~dl>dt:before, html[lang=ch] div#popup>form#contact_form~dl>dt:after{content:attr(data-dept); position:static; display:block; font:inherit !important; text-shadow:inherit !important;}
html[lang=en] div#popup>form#contact_form~dl>dt:before{content:attr(data-dept)", ";}
div#popup>form#contact_form~dl>dd{font-family:sans-serif; font-weight:normal !important; font-size:13px; padding-left:1.75em; position:relative;}
div#popup>form#contact_form~dl>dd:before{content:""; display:inline-block; opacity:.5; position:absolute; left:0; top:0; width:1.5em; height:1.5em; background:url(../img/icon_contact.svg) no-repeat; background-size:cover; padding:0; margin:0;}
div#popup>form#contact_form~dl>dd:nth-of-type(1):before{background-position:0 0;}
div#popup>form#contact_form~dl>dd:nth-of-type(2):before{background-position:0 25%;}
div#popup>form#contact_form~dl>dd:nth-of-type(3):before{background-position:0 50%;}
div#popup>form#contact_form~dl>dd:nth-of-type(4):before{background-position:0 75%;}
div#popup>form#contact_form dt{display:block; width:auto; margin:0 auto 0 0;}
div#popup>form#contact_form dt:not(:last-child):not(:first-child)>*{width:95%; margin:0;}
div#popup>form#contact_form dt>textarea{margin:.5em 0 !important;}
div#popup>form#contact_form dt:last-child{padding-bottom:10px;}
div#popup>form#contact_form dt:last-child>*{vertical-align:middle; margin:0 5px 0 0; height:40px;}
div#popup>form#contact_form dt input#captcha_code{width:6em;}
div#popup>form#contact_form dt img#captcha_image{display:inline-block; height:40px; width:auto;}
div#popup>form#contact_form dt img#captcha_image+a{display:inline-block; background:url(../../securimage/images/refresh.png) no-repeat #82b800; margin-right:1em; border-radius:25px; width:25px; height:25px; background-size:cover;}

/* Legal: terms + privacy */
div.legal{height:65vh; overflow:auto; line-height:150%; padding:.5em 1em 2em .25em !important; margin:1em 0 0 0; position:relative;}
div.legal, div.legal *{font-weight:normal !important; font-size:16pt !important; line-height:24pt;}
div.legal>*{display:block;}
div.legal>*:before{display:block; font-weight:bold; margin:1.5em 0 .25em 0;}
div.legal ol{padding:.25em 0 0 1.6em;}
div.legal li{margin:0 0 .25em .5em;}
div.legal>*>li{margin:0 0 1em .5em;}
div.legal ol ol{list-style:lower-latin;}
html[lang=en] div.legal{font-size:.6em; line-height:140%;letter-spacing:0 !important;}
html[lang=en] div.legal>*:before{zoom:1.2;}

/* QB table*/
body.table{overflow:auto;}
/* edit 20200817*/
body.table>h1 select{margin:0 !important; min-width:130px;}
/* edit 20200817*/
body.table>h1 span{white-space:nowrap; text-overflow:ellipsis; overflow:hidden; max-width:65%;}
body.table>main, body.table section#page_nav{position:absolute; left:1%; right:1%; width:auto; margin-top:10px;}
body.table>main{top:200px; bottom:115px; overflow:auto; height:auto; margin:0; padding:0; background-color:rgba(255,255,255,.5);}

/* Edmond edited 20170606 */
body.table>main>table{border-spacing:0; position:relative; width:auto; min-width:100%; margin:0; padding:0; table-layout:fixed;}

body.table>main>table tr>td{white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
body.table>main>table tr>th{white-space:normal;}
body.table>main>table tr>th.sortable{/*white-space:nowrap;*/ padding-right:20px; padding-left:20px;}
body.table>main>table thead a[class*="sort"]{opacity:.5; display:inline-block; white-space:normal; word-wrap:break-word; width:20px; height:20px; vertical-align:middle; border-radius:2px; margin:0 5px; text-align:center;}
body.table>main>table thead a[class*="sort"].active{opacity:1;}
body.table>main>table thead a[class*="sort"]:before{content:"▼"; letter-spacing:0 !important; line-height:20px; vertical-align:middle; font-size:.7em; font-weight:bold; font-family:Arial !important; display:inline-block; width:1em;}
body.table>main>table thead a.sort_up:before{content:"▲";}
body.table>main>table thead a.sort_btn:before{content:"▲▼"; opacity:.5; line-height:10px; transform:scale(1,.6); transform-origin:center;}
body.table>main>table th label{padding:0 0 0 .5em;}

/* Edmond edited 20171024 */
/*body.table>main>table td[class] {white-space:normal !important; word-break:break-word;}*/


/* 20200930 edited start */
/*
body.table section#page_nav{background:#FFF; border-top:1px solid #EEE; padding:10px; color:#333; text-align:center; position: fixed; bottom:200px; height:45px; font-size:100%;}
*/
.page_nav_new{
	background: #FFF;
	border-top: 1px solid #EEE;
	padding: 10px;
	color: #000000;
	text-align: center;
	height: 75px;
	position: absolute;
    left: 1%;
    right: 1%;
    width: auto;
	z-index:5000;
	bottom:100px;
	font-family: cssFontSansHKRegular;
	font-size: 16px;
    font-weight: normal;
	line-height: 19px;
    text-shadow: none;
}

.page_nav_new>p {
    display: inline-block;
    width: auto;
    min-width: 33%;
    position: absolute;
}
.page_nav_new>p :before, .page_nav_new>p :after {
    font-family: cssFontSansHKRegular;
    font-weight: normal;
    text-shadow: none;
}
.page_nav_new>p:first-of-type {
    text-align: left;
    left: 0;
    padding-left: 1em;
	
}
.page_nav_new>p:last-of-type {
    text-align: right;
    right: 0;
    padding-right: 1em;
}
.page_nav_new a.arrow {
    color: #e5b010;
}
.page_nav_new a.left, .page_nav_new a.right {
    background: none;
    font-weight: bold;
    margin: 0px;
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 0px;
}
.page_nav_new a.left:before, .page_nav_new a.right:after {
    background-color: #e5b010;
    border-color: #e5b010;
}

.page_nav_new a.left:before {
    background-position: top left;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
    margin-right: .6em;
}
.page_nav_new a.left:before, .page_nav_new a.right:after {
    content: "";
    display: inline-block;
    width: 4px;
    height: 16px;
    background: url(../img/arrow_white.png) no-repeat;
    background-size: 16px;
    vertical-align: -7px;
    border-top-width: 2px;
    border-right-width: 8px;
    border-bottom-width: 2px;
    border-left-width: 8px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    margin-top: 0;
    margin-right: 0px;
    margin-bottom: 2px;
    margin-left: 0px;
}

.page_nav_new a.left:before {
    background-position: top left;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
    margin-right: .6em;
}
.page_nav_new a.right:after {
    background-position: top right;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    margin-left: .75em;
}
.page_nav_new p select {
    background-color: #e7e7e7;
    opacity: .8;
    font-weight: bold;
    height: 24px;
    border-radius: 2px;
    border: none;
    margin-left: 10px;
}
.page_nav_new a.left:before, .page_nav_new a.right:after {
    background-color: #e5b010;
    border-color: #e5b010;
}
.page_nav_new a.arrow:last-child {
    background: none;
    font-weight: bold;
    margin: 0px;
    padding-top: 0;
    padding-right: 0px;
    padding-bottom: 0;
    padding-left: 5px;
}

/* 20200930 edited end */

body.table section#page_nav>p{font-family:cssFontSansHKRegular;font-size:16px;line-height:19px;font-weight:normal;}
body.table section#page_nav>p:before{padding-right:.15em; font-size:16px;}
body.table section#page_nav>p:after{padding-left:.15em; font-size:inherit;}
body.table section#page_nav>p{display:inline-block; width:auto; min-width:33%; position:absolute;}
body.table section#page_nav>p{text-align:center;}
body.table section#page_nav>p:first-of-type{text-align:left; left:0; padding-left:1em;}
body.table section#page_nav>p:first-of-type+p:not(:last-of-type){left:25%; right:25%;}
body.table section#page_nav>p:last-of-type{text-align:right; right:0; padding-right:1em;}
body.table section#page_nav>p:last-of-type>*:last-child{padding-right:0;}
body.table section#page_nav>p.arrows{font-family:cssFontSansHKRegular;font-size:15px;line-height:18px;font-weight:normal;color:#000000;opacity:0.8;}
body.table section#page_nav a.arrow:last-child{
	background: none;
	font-weight: bold;
	margin: 0px;
	padding-top: 0;
	padding-right: 0px;
	padding-bottom: 0;
	padding-left: 5px;
}
body.table section#page_nav a.left, body.table section#page_nav a.right{
	background: none;
	font-weight: bold;
	margin: 0px;
	padding-top: 0;
	padding-right: 5px;
	padding-bottom: 0;
	padding-left: 0px;
}
body.table section#page_nav a.left:before, body.table section#page_nav a.right:after{
	content: "";
	display: inline-block;
	width: 4px;
	height: 16px;
	background: url(../img/arrow_white.png) no-repeat;
	background-size: 16px;
	vertical-align: -7px;
	border-top-width: 2px;
	border-right-width: 8px;
	border-bottom-width: 2px;
	border-left-width: 8px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	margin-top: 0;
	margin-right: 0px;
	margin-bottom: 2px;
	margin-left: 0px;
}
body.table section#page_nav a.left:before{background-position:top left; border-top-left-radius:2px; border-bottom-left-radius:2px; margin-right:.6em;}
body.table section#page_nav a.right:after{background-position:top right; border-top-right-radius:2px; border-bottom-right-radius:2px; margin-left:.75em;}
body.table section#page_nav p>small{opacity:.7;}
body.table section#page_nav p select{
	background-color: #e7e7e7;
	opacity: .8;
	font-weight: bold;
	height: 24px;
	border-radius: 2px;
	border: none;
	margin-left: 10px;
}
body.table section#page_nav p>var, body.table section#page_nav p>select{}
body.table section#page_nav p>var {
	margin-right: 5px;
	margin-left: 5px;
}
body.table section#page_nav p var:before, body.table section#page_nav p var:after{}
body.table section#page_nav p.remarks{font-family:cssFontSansHKRegular;font-size:14px; line-height:16px; color:#000000;opacity:0.5; white-space:normal; text-overflow:ellipsis; overflow:hidden;}

body.table td:empty{text-align:center !important;}
body.table td:empty:before{content:"--";}
body.table tr:only-child>td:only-child{padding:1em 0 !important; border-bottom:none !important;}
.item_count{font-weight:normal;color:#000000;opacity:0.5;}
.item_count:before,.item_count:after{padding:0 .25em;}

/* icons */
.tag:before{background-position:0 28.45%}
.hint:before{background-position:0 24.45%}
.edit:before{background-position:0 32.55%}
.fullscreen:before{background-position:0 73.15%}
.window:before{background-position:0 75.05%}
.remove:before{background-position:0 34.55%}
.delete:before{background-position:0 34.55%}
.related:before{background-position:0 83.3%}
.undo:before{background-position:0 48.85%}
.redo:before{background-position:0 50.85%}
.add:before{background-position:0 77.25%}
.copy:before{background-position:0 89.4%}
.note:before{background-position:0 32.55%}
.ans_guide:before{background-position:0 69.1%}
.play_sound:before{background-position:0 91.5%}
.uploaded:before{background-position:0 71.15%}
.search:before{background-position:0 22.4%}
.report:before{background-position:0 65.05%}
.attachment:before{background-position:0 61%}

/*footer button*/
.finish:before{background-position:0 14.25%}
.save:before{background-position:0 12.2%}
.submit:before{background-position:0 10.2%}
.preview:before{background-position:0 85.35%}
.prev_step:before{background-position:0 16.25%}
.next_step:before{background-position:0 18.25%}
.reset:before{background-position:0 48.8%}

/*table button*/
.create:before{background-position:0 8.1%}
.download_attachment:before{background-position:0 63.05%}
.reference:before{background-position:0 67.05%}
.publish:before{background-position:0 10.25%}
.upload_resources:before{background-position:0 81.25%}
.detail_report:before{background-position:0 95.1%}

/*status*/
.saved:before, [data-status="saved"] span{background-position:0 12.2% !important}
.crown:before{background-position:0 93.25% !important}
.clock:before{background-position:0 20.3%}

/*z-index*/
header, footer, main {z-index:9999;}
footer>div#reminder, footer>div#copyright{z-index:1;}
footer>div#reminder:hover{z-index:2;}
body>main:before{z-index:3;}
body.table h1{z-index:2;}
body.table main{z-index:1;}
body.table section#page_nav{z-index:9999;height:50px;}
body.exercise main{z-index:9999;}
body.exercise main>aside a.arrow{z-index:99;}
body.exercise main>aside li{z-index:10;}
body.exercise main>aside a.arrow{z-index:99;}
body.exercise main>section>div.bottom_button{z-index:1000;}
body.exercise main>section div.page_nav{z-index:1;}
body.exercise>a.back{z-index:999999;}
body.exercise footer{z-index:999999;}
div#popup:before{z-index:1;}
div#popup>*{z-index:3;}
div#popup:after{z-index:2;}
div#popup{z-index:9999999;}
div dl.dropdown dd{z-index:9999;}
body.drawing main>section>div.question>canvas{z-index:2;}
body.drawing main>section>div.question>#tool{z-index:3;}
body.check div[id^=answers]>button{z-index:2;}
body.check div[id^=answers]>div{z-index:1;}
div#popup>form input,div#popup>form select{z-index:2;}


/* font face*/
body.exercise main>section div.question>form *:not(button):not(span){font-family:initial !important;}

div#popup.popform>form h3,
body.check main>section div[id^=answers]>button{font-family:cssFontSansHKRegular,cssFont;}
body.exercise main>section>div.bottom_button{font-family:cssFontSansHKMedium;}

div#popup.popform div.buttons>button,
div#popup>form#gen_question dt,div#popup>form#gen_question dd,
div#popup>form#gen_question dd:before, div#popup>form#gen_question dd:after{font-family:cssFontSansHKRegular,cssFont; font-size:18px; line-height:20px; font-weight:normal; border-radius:5px; text-shadow:0 0 0;}

html[lang=ch] div#popup.popform div#finish_msg.show:before,
div#popup.popform *:after, div#popup.popform *:before,
div#popup>form#gen_question dt{font-family:cssFontSansHKRegular,cssFontBold; font-weight:normal; text-shadow:none;}
html[lang=ch] div#popup.start_test strong>b>var:before,div#popup.start_test strong>b>var:after {font-family:cssFontSansHKMedium;}
div#popup.confirm strong{width:260px; height:180px; padding:0.8em 0 0 0; text-align:left;font-family:cssFontSansHKMedium;font-size:26px; color:#ffffff; line-height:31px;}

strong, strong>*, h1, h2, button,
div#popup button:not(.model_answer,.explanation,.feedback,.feedback_pos,.feedback_neg),
div#popup.select_option strong var:before{font-family:cssFontSansHKBold; font-weight:normal;}
div#popup>form#contact_form~dl,
body#login form>a:not(:last-child),
div#popup.popform div#finish_msg.show:before,
div#popup.popform *:after, div#popup.popform *:before,
div#popup>form#gen_question dt{font-family:cssFontSansHKRegular,cssFontBold; font-weight:normal; text-shadow:none;}
div#popup.start_test strong>b>var:before,div#popup.start_test strong>b>var:after{font-family:cssFontSansHKRegular,cssFontBold;}

input, select, select>option,
div#popup>form#report_used h3,
div#popup.popform>form,
.item_count:before,.item_count:after{/*! font-family:cssFontHei; */}
div#popup>form>span,
body.table section#page_nav p var:before, body.table section#page_nav p var:after,
div#popup>form#upload_resources:after{font-family:cssFontHei; font-weight:normal;}
header>*,
body.exercise,
body.table section#page_nav, body.table section#page_nav>p :before, body.table section#page_nav>p :after 
{font-family:cssFontSansHKRegular; font-weight:normal; text-shadow:none;}

body.exercise main>section div.qnum>q:before, body.exercise main>section .qnum>q:after,
div#popup.select_option strong var,
div.legal{font-family:cssFontHei; font-weight:bold;}
div.legal table#system_check{width:100%; margin:20px 0;}
div.legal table#system_check *{font-size:15px !important; font-family:sans-serif !important; line-height:150%;}
table#system_check th{font-weight:bold !important; text-align:center; padding:.25em 0;}
table#system_check td{vertical-align:top; width:40%; border-top:1px solid #CCC; color:#555;}
table#system_check td>b{padding:0 .25em; color:#333;}
table#system_check td>dt:not(:first-child){margin-top:1em;}
table#system_check td>dd{display:list-item !important; margin:0 0 0 1.5em; padding:0 0 .25em 0 !important;}
table#system_check td:first-child{width:20%; font-weight:bold !important;}
table#system_check td:last-child[class]{padding-left:30px;}
table#system_check td:before{display:inline-block; border-radius:20px; width:20px; height:20px; text-align:center; line-height:22px; color:#FFF; margin:0 10px 0 -30px;}
table#system_check td.pass:before{content:"\2714"; background:#80b914;}
table#system_check td.fail:before{content:"\2757"; background:#e6180c;}

/*
html[lang=en], html[lang=en]>body:not(.exercise),
html[lang=en] div#popup.popform>form h3,
html[lang=en] body.exercise main>section>div.bottom_button,
html[lang=en] body.check main>section div[id^=answers]>button,
html[lang=en] div.legal{font-family:sans-serif;}
*/
html[lang=en], html[lang=en]>body:not(.exercise),
html[lang=en] div#popup.popform>form h3,
html[lang=en] body.exercise main>section>div.bottom_button,
html[lang=en] div.legal{font-family:sans-serif;}

html[lang=en] div#popup.popform div.buttons>button,
html[lang=en] div#popup>form#gen_question dt,html[lang=en] div#popup>form#gen_question dd,
html[lang=en] div#popup>form#gen_question dd:before, html[lang=en] div#popup>form#gen_question dd:after{font-family:sans-serif; font-weight:bold; text-shadow:0 0 0;}

html[lang=en] strong, html[lang=en] strong>*, html[lang=en] body h1, html[lang=en] h2, html[lang=en] button,
html[lang=en] div#popup button,
html[lang=en] div#popup.select_option strong var:before{font-family:sans-serif; font-weight:bold;}
html[lang=en] body#login form>a:not(:last-child),
html[lang=en] div#popup.popform div#finish_msg.show:before,
html[lang=en] div#popup.popform *:after, html[lang=en] div#popup.popform *:before,
html[lang=en] div#popup>form#gen_question dt{font-family:sans-serif;font-weight:bold;text-shadow:none;line-height: 2em;}
html[lang=en] div#popup.start_test strong>b>var:before, html[lang=en] div#popup.start_test strong>b>var:after{font-family:sans-serif; font-weight:bold;}

html[lang=en] header>a.icon{font-size:18px !important;}
html[lang=en] header>a:not(.icon), html[lang=en] *[data-subject] *, html[lang=en] *[data-subject="chinese"], html[lang=en] .popform *:before, html[lang=en] select{font-family: cssFontSansHKRegular, sans-serif;}
html[lang=en] th{line-height:120%; font-weight:bold; font-size:.9em;}
html[lang=en] body#login form{font-weight:normal;}
html[lang=en] div#popup, html[lang=en] div#popup>*:not(form), html[lang=en] div#popup>*:not(form) *:before, html[lang=en] div#popup>*:not(form) *:after{font-family:sans-serif !important; font-weight:normal !important; letter-spacing:-.03em;}




div#finish_msg{display:none; text-align:center;}
/* Edmond edited 20180910 */
div#finish_msg.show:before{display:block; height:30%; text-align:center; font-size:1.3em; line-height:1em; margin:.5em auto; color:#00a09a;}
/* Edmond edited 20180910 */
div#finish_msg.show>span>a{background:#82b800; color:#FFF; border:0 none; font-size:1em; border-top:.35em solid #82b800; border-bottom:.35em solid #82b800; padding:0 1.5em; margin:.5em auto; display:inline-block; width:auto; border-radius:2px; position:relative;}
div#finish_msg.loading{background:url(../img/loading.svg) no-repeat top center; background-size:auto 80%;}
div#finish_msg.loading:before{color:rgba(0,0,0,0)}
div#finish_msg.loading>span:first-of-type{display:inline;}
div#finish_msg.loading>span:last-of-type{display:none;}
div#finish_msg:not(.loading)>span:first-of-type{display:none;}
div#finish_msg:not(.loading)>span:last-of-type{display:inline;}

div#finish_msg.show:before {font-family:cssFontBold; font-weight:normal; text-shadow:none;}
html[lang=en] div#finish_msg.show:before {font-family:sans-serif; font-weight:bold; text-shadow:none;}

textarea {overflow:auto; font-size:1em;}



@viewport{
	width:device-width; height:device-height; initial-scale:1;
}
@media only screen and (orientation: landscape) {
}
@media only screen and (orientation:portrait) {
	body#login{background-image:url(../img/ADS-pattern.svg); background-repeat:repeat; background-position:left 100px;}
	body{overflow-x:visible;}
}

@media screen and (max-width:890px) {
	#lbl_user_id,#user_id{display:none;}
}
@media screen and (max-width:760px) {
    body.table>main>table{min-width:100%; width:auto;}
	body.table>main>table tr>th{white-space:nowrap; width:auto;}
	
	header>a#btn_back>img{width:157px;}
	#lbl_user_id,#user_id,#btn_lang,#btn_member_setting,#btn_logout{display:none;}
	
	div#popup.popform dt:before, div#popup.popform dt+dd:before{display:block; width:95%; float:none;}
	div#popup.popform dt[data-before]>select{width:95%;}
	div#popup.popform dt[data-before]>select+select{margin-left:0;}
	div#popup.popform dt input{margin-left: .6em; !important}	

}
@media screen and (max-width:990px) {
}
@media screen and (min-width:1024px) {
	body.exercise>main{left:47%; margin-left:-500px;}
}

@media screen and (max-height:500px) and (min-width:990px){
	body:not(#welcome) footer{display:none;}
	body.table section#page_nav{bottom:-45px;}
	body.table>main{bottom:0;}
	body.exercise main>aside.overflow{bottom:80px;}
	body.exercise main{bottom:0; height:auto; top:130px;}
	body.exercise main>section div.question{height:auto !important; max-height:auto !important; overflow:visible;}
}
@media screen and (max-height:500px){
	body.exercise footer{display:none;}
	body.exercise main>aside.overflow{bottom:80px;}
	body.exercise main{bottom:0; height:auto; top:130px;}
	body.exercise main>section div.question{height:auto !important; max-height:auto !important; overflow:visible;}
	body.check main>section div.question{/* max-height:50%; */}
}
@media screen and (max-height:250px){
	header,footer{display:none;}
	body.table h1{display:none;}
	body.table>main{top:0; position:absolute; height:100%;}
	body.table section#page_nav{display:none;}
	body.exercise main>aside{display:none;}
	body.exercise main{top:-10px; bottom:-70px;}
}


/* Edmond edited 20170901 */

.info_box{
	background-color: #CCC;
	display: block;
	height: 16px;
	width: 28px;
	border: 1px solid #999;
	float: left;
	padding: 0px;
	margin: 5px;
}

.colour_01{
	background-color:rgba(255,105,105,1);
}
.colour_02{
	background-color:rgba(255,156,0,1);
}
.colour_03{
	background-color:rgba(143,195,31,1);
}
.colour_04{
	background-color:rgba(19,182,179,1);
}
.colour_05{
	background-color:rgba(0,132,255,1));
}

/* Edmond edited 20170901 */

/* Edmond edited 20180424 start */
.question_type_SQ > button{
	background: #536f8a;
    color: #FFF;
    margin-top: -30px;
    padding: 5px 10px;
    padding-bottom: 0;
    border: 1px solid #e9e9e9;
    border-bottom: 0 none;
    border-radius: 2px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    text-shadow: none;
    bottom: -1px;
    position: relative;
}

/* Edmond edited 20180424 end */

/* 20190612 edited start */
/* treeview_2 */
.acidjs-css2-treeview, .acidjs-css2-treeview *{
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
	padding-top: 0px;
    margin: 0;
    list-style: none;
	line-height:17px;
	}
/* + */
.acidjs-css2-treeview #label2[for]::before{
	content: "\2795";
	display: inline-block;
	width: 15px;
	height: 15px;
	color: #14adab;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: -14px;
}
.acidjs-css2-treeview #label2 span::before{
	content: "\2795";
	display: inline-block;
	width: 15px;
	height: 15px;
	color: #14adab;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
.acidjs-css2-treeview ul{
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.acidjs-css2-treeview li ul{
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 15px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.acidjs-css2-treeview *{
    /* vertical-align: middle; */
}
.acidjs-css2-treeview li{
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
	margin-left:10px;
	padding-left:10px;
	margin-bottom:5px;
}
.acidjs-css2-treeview input[type="checkbox"]{
    display: none;
}
.acidjs-css2-treeview #label2{
	cursor: pointer;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
 	width:90%;
	/* vertical-align:text-top; */
}

.acidjs-css2-treeview #label2[for]::before{
    -webkit-transform: translatex(-25px);
    -moz-transform: translatex(-25px);
    -ms-transform: translatex(-25px);
    -o-transform: translatex(-25px);
    transform: translatex(-25px);
}

.acidjs-css2-treeview #label2 span::before{
    -webkit-transform: translatex(0px);
    -moz-transform: translatex(0px);
    -ms-transform: translatex(0px);
    -o-transform: translatex(0px);
    transform: translatex(0px);
}

/* - */
.acidjs-css2-treeview input[type="checkbox"][id]:checked ~ #label2[for]::before{
    content: "\2796";
}
.acidjs-css2-treeview input[type="checkbox"][id]:not(:checked) ~ ul{
    display: none;
}
.acidjs-css2-treeview #label2:not([for]){
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px; width: inherit; vertical-align:text-top;
}
/* 口 */
.acidjs-css2-treeview #label2 span::before{
    content: "";
    border: solid 1px #1375b3;
    color: #1375b3;
    opacity: .50;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	line-height:20px;
	vertical-align:text-top;
	float:left;
	line-height:20px;
}
/* v */
.acidjs-css2-treeview #label2 input:checked + span::before{
	content: "\2714";
	box-shadow: 0 0 2px rgba(0, 0, 0, .25) inset;
	opacity: 1;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 2px;
	line-height:17px;
}
.acidjs-css2-treeview #label2.no_arrow{
}

.acidjs-css2-treeview #label2.no_arrow[for]::before, .acidjs-css2-treeview #label2.no_arrow span::before {content:" ";cursor:pointer;}
.acidjs-css2-treeview #label2.no_arrow2 {content:" ";cursor:default; width:90%; vertical-align:text-top; padding-left:5px;}
/* treeview_2 */

/* treeview_3 */
.acidjs-css3-treeview, .acidjs-css3-treeview *{
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
	padding-top: 0px;
    margin: 0;
    list-style: none;
	line-height:inherit;
	}
/* + */
.acidjs-css3-treeview #label3[for]::before{
	content: "\2795";
	display: inline-block;
	width: 15px;
	height: 15px;
	color: #14adab;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: -10px;
}
.acidjs-css3-treeview #label3 span::before{
	content: "\2795";
	display: inline-block;
	width: 15px;
	height: 15px;
	color: #14adab;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
.acidjs-css3-treeview ul{
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.acidjs-css3-treeview li ul{
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 15px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.acidjs-css3-treeview *{
    /* vertical-align: middle; */
}
.acidjs-css3-treeview li{
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
	margin-left:10px;
	padding-left:10px;
	margin-bottom:5px;
}
.acidjs-css3-treeview input[type="checkbox"]{
    display: none;
}
.acidjs-css3-treeview #label3{
	cursor: pointer;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
 	width:90%;
	vertical-align:text-top;
}

.acidjs-css3-treeview #label3[for]::before{
    -webkit-transform: translatex(-25px);
    -moz-transform: translatex(-25px);
    -ms-transform: translatex(-25px);
    -o-transform: translatex(-25px);
    transform: translatex(-25px);
}

.acidjs-css3-treeview #label3 span::before{
    -webkit-transform: translatex(0px);
    -moz-transform: translatex(0px);
    -ms-transform: translatex(0px);
    -o-transform: translatex(0px);
    transform: translatex(0px);
}

/* - */
.acidjs-css3-treeview input[type="checkbox"][id]:checked ~ #label3[for]::before{
    content: "\2796";
}
.acidjs-css3-treeview input[type="checkbox"][id]:not(:checked) ~ ul{
    display: none;
}
.acidjs-css3-treeview #label3:not([for]){
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px; width: inherit; vertical-align: -webkit-baseline-middle;
}
/* 口 */
.acidjs-css3-treeview #label3 span::before{
    content: "";
    border: solid 1px #1375b3;
    color: #1375b3;
    opacity: .50;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	line-height:15px;
	vertical-align:text-top;
	float:left;
}
/* v */
.acidjs-css3-treeview #label3 input:checked + span::before{
	content: "\2714";
	box-shadow: 0 0 2px rgba(0, 0, 0, .25) inset;
	opacity: 1;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 2px;
	line-height:17px;
}
.acidjs-css3-treeview #label3.no_arrow{
}

.acidjs-css3-treeview #label3.no_arrow[for]::before, .acidjs-css3-treeview #label3.no_arrow span::before {content:" ";cursor:pointer;}
.acidjs-css3-treeview #label3.no_arrow2 {content:" ";cursor:default; width:90%; vertical-align: -webkit-baseline-middle; padding-left:5px;}
/* treeview_3 */

/* treeview_4 */
.acidjs-css4-treeview, .acidjs-css4-treeview *{
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
	padding-top: 0px;
    margin: 0;
    list-style: none;
	line-height:inherit;
	}
/* + */
.acidjs-css4-treeview #label4[for]::before{
	content: "\2795";
	display: inline-block;
	width: 15px;
	height: 15px;
	color: #14adab;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: -10px;
}
.acidjs-css4-treeview #label4 span::before{
	content: "\2795";
	display: inline-block;
	width: 15px;
	height: 15px;
	color: #14adab;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
.acidjs-css4-treeview ul{
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.acidjs-css4-treeview li ul{
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 15px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.acidjs-css4-treeview *{
    /* vertical-align: middle; */
}
.acidjs-css4-treeview li{
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
	margin-left:10px;
	padding-left:10px;
	margin-bottom:5px;
}
.acidjs-css4-treeview input[type="checkbox"]{
    display: none;
}
.acidjs-css4-treeview #label4{
	cursor: pointer;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	width:90%;
	vertical-align: initial;
}

.acidjs-css4-treeview #label4[for]::before{
    -webkit-transform: translatex(-25px);
    -moz-transform: translatex(-25px);
    -ms-transform: translatex(-25px);
    -o-transform: translatex(-25px);
    transform: translatex(-25px);
}

.acidjs-css4-treeview #label4 span::before{
    -webkit-transform: translatex(0px);
    -moz-transform: translatex(0px);
    -ms-transform: translatex(0px);
    -o-transform: translatex(0px);
    transform: translatex(0px);
}

/* - */
.acidjs-css4-treeview input[type="checkbox"][id]:checked ~ #label4[for]::before{
    content: "\2796";
}
.acidjs-css4-treeview input[type="checkbox"][id]:not(:checked) ~ ul{
    display: none;
}
.acidjs-css4-treeview #label4:not([for]){
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px; width: inherit; vertical-align:text-top;
}
/* 口 */
.acidjs-css4-treeview #label4 span::before{
    content: "";
    border: solid 1px #1375b3;
    color: #1375b3;
    opacity: .50;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	line-height:15px;
	vertical-align:text-top;
	float:left;
}
/* v */
.acidjs-css4-treeview #label4 input:checked + span::before{
	content: "\2714";
	box-shadow: 0 0 2px rgba(0, 0, 0, .25) inset;
	opacity: 1;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	line-height:15px;
}
.acidjs-css4-treeview #label4.no_arrow{
}

.acidjs-css4-treeview #label4.no_arrow[for]::before, .acidjs-css4-treeview #label4.no_arrow span::before {content:" ";cursor:pointer;}
.acidjs-css4-treeview #label4.no_arrow2 {content:" ";cursor:default;width:90%;vertical-align: initial;padding-left:5px;}
/* treeview_4 */



.treeview_area_c{
	overflow: auto;
	margin: 0px;
	padding-left:15px;
}
/* 20190612 edited start */

/* 20181128 Edited start */
.acidjs-p{
	vertical-align:text-top;
	line-height:20px;
}
.acidjs-css2-treeview #label2 .acidjs-p::before {
    display:none;
}
.acidjs-css3-treeview #label3 .acidjs-p::before {
    display:none;
}
.acidjs-css4-treeview #label4 .acidjs-p::before {
    display:none;
}
/* Edited by Edmond 20180829 end */

.treeview_area_c{
	overflow: hidden;
	padding: 0px;
	margin: 0px;
}
.new_icon{
	color: #FFF;
	background-color: #F60;
	font-size: 12px;
	border-radius: 15px;
	box-shadow: 1px 1px 1px #b5b5b5;
	padding-top: 2px;
	padding-right: 4px;
	padding-bottom: 2px;
	padding-left: 4px;
	margin-right:5px;
	line-height:normal;
	margin-left:0px;
}
body.exercise main>section>.new_icon{
	color: #FFF;
	background-color: #F60;
	font-size: 12px;
	border-radius: 15px;
	box-shadow: 1px 1px 1px #b5b5b5;
	padding-top: 2px;
	padding-right: 4px;
	padding-bottom: 2px;
	padding-left: 4px;
	margin-right:5px;
	margin-left:5px;
	margin-top: 5px;
	line-height:normal;
}
/* Edmond edited 20180817 start */
.optionText a {
	display:inline;
}
/* Edmond edited 20180817 end */
form a.underline {
	border-bottom: 1px solid #82b800;
}
/* Edmond edited 20180424 end */

@media screen and (max-width: 857px){
	div#popup.popform dt:before, div#popup.popform dt+dd:before {
    display: block;
    width: 95%;
    float: none;
	}
	div#popup.popform dt input {
    margin-left: .6em;
	}
}
/* 20190104 edited start */
/* regist_area */
.regist_area{
	float: right;
	text-decoration: none;
	color: #000000;
	font-family: cssFontSansHKRegular, sans-serif;
	padding-right: 70px;
}
html[lang=en] .regist_area{padding-right: 50px;} 
.regist_area a{
	font-family:cssFontSansHKRegular,sans-serif; 
	font-size:14px; 
	line-height:16px;
	color: #000000;
	transition: all 0.2s;
	opacity:1;
}
.regist_area a:hover{
	opacity:0.6;
}
/* 20190104 edited end */

/* edit 20200817*/
.menu-container{
	width:100%;
	margin-top:10px;
}
div#popup.popform .menu-container .series .series_label{
	font-family: cssFontBold;
    font-weight: normal;
    text-shadow: none;
	
}
.menu-container .series_label {
	position: relative;
	z-index: 20;
	display: block;
	line-height:30px;
	cursor: pointer;
	background-image: url(../img/arrow_up.png);
	background-repeat: no-repeat;
	background-position: right center;
	width:100%;
	font-family: cssFontBold;
    font-weight: normal;
    text-shadow: none;
	background-color:#F9F9F9;
	line-height:40px;
	padding-left:10px;
	transition:all 0.2s;
	border-radius:5px;
}
.menu-container .series_label:hover {
    background: #eeeeee;
	background-image: url(../img/arrow_up.png);
	background-repeat: no-repeat;
	background-position: right center;
	
}
.menu-container input:checked + .series_label,.menu-container input:checked + .series_label:hover {
    background: #F9F9F9;
	background-image: url(../img/arrow_down.png);
	background-repeat: no-repeat;
	background-position: right center;
	border-radius:5px 5px 0px 0px;

}
.menu-container .series{
	margin-bottom:10px;
	background-color:#F9F9F9;
	border-radius:5px;
}
.menu-container .ac_radio {
    display: none;
}

.menu-container article {
    overflow: hidden;
    height: 0;
    position: relative;
    z-index: 10;
    transition: height 0.3s ease-in-out,box-shadow 0.6s linear;
	background: #FFFFFFs;
	padding-left:150px;
	
}

.menu-container input:checked ~ article {
    transition: height 0.5s ease-in-out,box-shadow 0.1s linear;
}
.menu-container input:checked ~ article.large {
	height: auto;
	border:none;
}
.menu-container input:checked + .series_label,.menu-container input:checked + .series_label:hover{
    border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #00a09a;
	border-right-color: #00a09a;
	border-bottom-color: #F9F9F9;
	border-left-color: #00a09a;

}
.menu-container input:checked ~ article.large{
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #F9F9F9;
	border-right-color: #00a09a;
	border-bottom-color: #00a09a;
	border-left-color: #00a09a;
	border-radius:0px 0px 5px 5px;
}
/* edit 20200817*/