.sec-text{line-height:1.8em}pre code{cursor:not-allowed;-ms-user-select:none;-moz-user-select:-moz-none;-webkit-user-select:none;user-select:none}pre.allow code{cursor:inherit!important;-ms-user-select:inherit!important;-moz-user-select:inherit!important;-webkit-user-select:inherit!important;user-select:inherit!important}.img-container{text-align:center;margin:10px auto}.img-container img{max-width:90%;border:1px solid #ccc}.img-container .cmt{font-size:.8em;color:#333}.youtube-container{width:75%;margin:0 auto;-webkit-box-sizing:border-box;box-sizing:border-box;padding:48px}.youtube-wrap{position:relative;width:100%;padding-bottom:56.25%;border:1px solid #ccc}.youtube-wrap iframe{position:absolute;width:100%;height:100%}a.ex-link,a.ex-link:link,a.ex-link:visited{background:#efe;color:teal;font-weight:700;display:block;margin:10px 5%;padding:8px;border:1px solid #42b983}a.ex-link small{color:#42b983;font-weight:400}a.ex-link i.fa-external-link{float:right;margin-right:8px}.next-box,.next-box .btn{text-align:center}.next-box .btn{display:inline-block;border-radius:4px;background-color:#42b983;color:#fff;font-weight:700;padding:8px 24px;min-width:160px;margin:16px auto}.oxq-box{position:relative;border:1px dotted #ccc;padding:0 20px}.oxq-box .oxq-check-mark{position:absolute;width:100%;left:0;bottom:0;text-align:center;font-size:160px;font-weight:700;color:red}.oxq-box .oxq-title{font-size:1.25em}.oxq-box .oxq-hint{color:#066}.oxq-box .btn-ox{display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box;background:#eee;border-radius:5px;width:49%;margin-left:1%;padding:16px 0;text-align:center;font-size:2em;font-weight:700;cursor:pointer}.oxq-box .btn-ox.selected{background:#2c3e50;color:#eee}.oxq-box .btn-ox.answer{border:10px solid #42b983}.oxq-action-box{text-align:right}.oxq-box .btn-ans,.oxq-box .btn-hint{display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:48px;padding:12px 80px;cursor:pointer}.oxq-box .btn-hint{background:#eee;margin-right:16px}.oxq-box .btn-ans{background:#eee}.mcq-box{position:relative;border:1px dotted #ccc;padding:0 20px;margin-bottom:10px}.mcq-box .mcq-check-mark{position:absolute;width:100%;left:0;top:calc(50% - 80px);text-align:center;font-size:160px;font-weight:700;color:red}.mcq-box .ans{color:#00f}.mcq-box .mcq-hint{color:#066}.mcq-box .question{-webkit-box-sizing:border-box;box-sizing:border-box;background:#eee;border-radius:5px;margin-left:1%;padding:8px 16px;font-size:1.2em;font-weight:700;cursor:pointer;margin-bottom:4px}.mcq-box .question.selected{background:#2c3e50;color:#eee}.mcq-box .question.answer{border:6px solid #42b983}.mcq-action-box{text-align:right}.mcq-box .btn-ans,.mcq-box .btn-hint{display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:48px;padding:12px 80px;cursor:pointer}.mcq-box .btn-hint{background:#eee;margin-right:16px}.mcq-box .btn-ans{background:#eee}.tab-box .tab-titles{list-style:none;padding:0;margin:0}.tab-box .tab-titles:after{clear:both;content:"";display:table}.tab-box .tab-titles li{float:right;text-align:center;min-width:20%;padding:4px 16px;border-top:1px solid #ccc;border-left:1px solid #ccc;cursor:pointer}.tab-box .tab-titles li:first-child{border-right:1px solid #ccc}.tab-box .tab-titles .active{color:#008585;background:#efe}.tab-box .tab-body{border:1px solid #ccc;padding:10px}.collapse-box{border:1px solid #ccc;border-radius:8px;margin:10px auto}.collapse-title{padding:16px;cursor:pointer}.collapse-title .fa-fw{font-size:1.5em;float:right}.collapse-contents{overflow:hidden;max-height:10000px;-webkit-transition:.5s;transition:.5s}.collapse-contents.closed{max-height:0;-webkit-transition:.5s;transition:.5s}.compo{position:relative}.compo.admin{border-bottom:1px dashed #eee}.adminbox{right:-100px;width:100px;height:100%;text-align:center;color:teal;cursor:pointer}.adminbox,.adminbox>span{position:absolute;bottom:0}#page-box{width:100%;position:absolute;background-color:#efe;margin-top:66px;min-height:90vh;overflow-x:hidden;z-index:10}#page-box .loading{text-align:center;padding-top:100px}#page-box .loading .fa-spin,#page-box .loading h2{color:#006969}.page{border:1px solid #ccc;background-color:#fff;min-width:480px;width:80%;margin:50px auto 80px auto;padding:16px;-webkit-transition:.2s;transition:.2s}.page.menu-hide{width:90%}.page p{line-height:2em}.page .hint{border:1px solid #ddd;padding:0 8px;font-size:.9em}.page .codesites{font-size:2em;color:#777}.page .codesites a{color:#42b983}.slide-fade-enter-active{-webkit-transition:all .3s ease;transition:all .3s ease}.slide-fade-leave-active{-webkit-transition:all .2s ease;transition:all .2s ease}.slide-fade-enter{-webkit-transform:translateX(150%);transform:translateX(150%)}.slide-fade-leave-to{-webkit-transform:translateX(-150%);transform:translateX(-150%)}#header{position:fixed;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:64px;left:0;z-index:20;padding:15px;background-color:teal;color:#fff;font-size:1.6em}.float-right{color:#fff;float:right}.header-btn{border:none;background:transparent;font-size:inherit;color:inherit}#aside{position:fixed;left:0;top:64px;width:300px;height:calc(100% - 64px);-webkit-box-sizing:border-box;box-sizing:border-box;padding:10px;overflow:hidden;overflow-y:auto;z-index:100}#menu>a{border-radius:8px;display:block;padding:16px;margin-bottom:8px;color:#777}#menu>a:hover{background:#eee}#menu>a.router-link-exact-active,#menu>a .step{font-weight:700;color:#fff;background:#42b983}#menu>a .step{width:48px;height:48px;line-height:14px;font-size:14px;padding:8px;margin-left:4px;margin-right:4px;border-radius:24px}#menu>a.router-link-exact-active .step{color:#42b983;background-color:#fff}#menu>a .fa{line-height:32px;font-size:32px;margin-right:4px;border-radius:50%;color:#42b983;vertical-align:middle}#menu>a.router-link-exact-active .fa{color:#fff}#footer{position:fixed;bottom:0;left:0;width:calc(100% - 300px);margin-left:300px;background:teal;text-align:center;padding:8px;color:#eee;font-size:9pt;z-index:99}#footer.menu-hide{width:100%;margin-left:0}#footer a{color:#fff}#FLOATING_BANNER_HIDE{width:40px;height:200px}#FLOATING_BANNER,#FLOATING_BANNER_HIDE{position:fixed;bottom:45px;right:10px;background:#f7f7f7;border:1px solid #ccc;z-index:999}#FLOATING_BANNER{width:240px;max-height:600px}#FLOATING_BANNER .hide-btn-area{-webkit-box-sizing:border-box;box-sizing:border-box;padding:8px;cursor:pointer;border-bottom:1px solid #ccc}#FLOATING_BANNER .hide-btn-area:hover{background:#eee}#FLOATING_BANNER .banners-area{-webkit-box-sizing:border-box;box-sizing:border-box;overflow-x:hidden;font-size:0}.banner-hide-enter-active,.banner-hide-leave-active{-webkit-transition:all 1s ease;transition:all 1s ease}.banner-hide-enter,.banner-hide-leave-to{-webkit-transform:translateX(150%);transform:translateX(150%)}body{padding:0;margin:0;font-family:Jua,sans-serif}a,a:link,a:visited{text-decoration:none}.text-center{text-align:center}.clerfix:after{clear:both;content:"";display:table}#contents{position:relative;margin-left:300px;background-color:#f7f7f7;-webkit-transition:.2s;transition:.2s}#contents.menu-hide{margin-left:0}