@charset "utf-8";
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@2.0/nanumsquare.css);
/* 20180816 / 박수진 / ver 1.0 / ielts CDT */

/*******************************************************************************
                                    reset
********************************************************************************/
html,body {height:100%;margin:0;font-size:16px;}
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select {margin:0;padding:0;}
header,footer,section,article,aside,nav,menu,figure,figcaption {display:block;margin:0;padding:0;}
body,input,textarea,select,button,th,td,li,p {font-family:'맑은 고딕','Malgun Gothic','맑은고딕',MalgunGothic,돋움,Dotum,arial,sans-serif;}
h1,h2,h3,h4,h5,h6 {font-family:'NanumSquare';line-height:100%;}
img,fieldset {margin:0;padding:0;border:0;vertical-align:middle;}
/*input,select,button,label {vertical-align:middle;}*/
em,address,i,cite {font-style:normal;}
ul,ol {list-style:none;}
ul:after,ol:after {content:'';display:block;width:100%;clear:both;}
a {text-decoration:none;color:inherit;}

/*******************************************************************************
                                페이지 공통
********************************************************************************/
[class^="sp-"] {display:inline-block;background-image:url(https://static.edmclass.com/cdt/sp-icon.png);background-repeat:no-repeat;background-size:150px;vertical-align:middle;overflow:hidden;}
.sp-smile {width:21px;height:21px;background-position:0 0;}
.sp-monitor {width:20px;height:20px;background-position:-30px 0;}
.sp-headset {width:20px;height:20px;background-position:-60px 0;}
.sp-info-red {width:16px;height:16px;background-position:0 -30px;}
.sp-info-blue {width:16px;height:16px;background-position:-30px -30px;}
.sp-user {width:20px;height:20px;background-position:-60px -30px;}
.sp-speaker {width:16px;height:16px;background-position:-90px -30px;}
.sp-close {width:20px;height:20px;background-position:0 -60px;}
.sp-doc {width:12px;height:12px;background-position:-30px -60px;}
.sp-check {width:14px;height:12px;background-position:-60px -60px;}

.button {display:inline-block;text-align:center;cursor:pointer;vertical-align:middle;box-sizing:border-box;text-transform:capitalize;}
.button:focus {outline:none;}

.textual + .textual {margin-top:2rem;}

.dot-list li {position:relative;padding-left:15px;}
.dot-list li:before {content:'';position:absolute;top:0.6rem;left:0;display:block;width:4px;height:4px;border-radius:50%;background:#444;}
.left-indent {margin-left:1rem !important;}
.left-indent.order-list {margin-left:1.5rem !important;}
.left-indent.order-list li {position:relative;margin-top:0.5rem;line-height:140%;}
.left-indent.order-list .order {position:absolute;display:inline-block;top:0;left:-1.5rem;font-weight:bold;}
.ta-center {text-align:center;}
.ta-right {text-align:right;}
.column:after {content:'';display:block;width:100%;clear:both;}
.mgt {margin-top:1rem;}

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

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

/*******************************************************************************
                            팝업 레이아웃
********************************************************************************/
.cdt-window {background:#e8eff9;}
.cdt-window-wrap {position:relative;width:1280px;height:100%;margin:0 auto;}
.cdt-window-header {position:relative;display:block;height:70px;border-bottom:1px solid #b9c4d9;background:#fff;box-sizing:border-box;/*box-shadow:0 0 8px #b9c4d9;*/}
.cdt-window-header:before {content:'';position:absolute;top:8px;display:block;width:100%;height:calc(100% - 8px);box-shadow:0 0 8px #b9c4d9;z-index:-1;}
.cdt-window-header.read-only {margin-top:-70px;}
.cdt-window-header h1 {position:absolute;top:50%;left:2rem;transform:translateY(-50%);-ms-transform:translateY(-50%);font-size:1.6rem;color:#e31837;font-family:NS;}
.cdt-window-header h1 .exp {margin-left:0.5rem;font-size:1rem;color:#969fac;font-weight:normal;font-family:'맑은 고딕','Malgun Gothic','맑은고딕',MalgunGothic,돋움,Dotum,arial,sans-serif;letter-spacing:-1px;}
.cdt-window-header .logo {position:absolute;top:50%;right:2rem;width:136px;height:24px;transform:translateY(-50%);-ms-transform:translateY(-50%);background:url(https://static.edmclass.com/cdt/cdt_logo_ielts.png) no-repeat;text-indent:-999px;overflow:hidden;}
.cdt-window-header + .cdt-window-container {height:calc(100% - 70px);}
.cdt-window-header.read-only + .cdt-window-container {position:relative;height:100%;}

/* 상단 유저정보 및 버튼 등 */
.cdt-navigation {position:relative;height:45px;margin-top:-1px;border-top:1px solid #e2e8f0;border-bottom:1px solid #b9c4d9;background:#fff;box-sizing:border-box;/*box-shadow:0 0 8px #b9c4d9;*/}
.cdt-navigation:before {content:'';position:absolute;top:8px;display:block;width:100%;height:calc(100% - 8px);box-shadow:0 0 8px #b9c4d9;z-index:-1;}
.cdt-navigation:after {content:'';display:block;width:100%;clear:both;}
.cdt-navigation > div {position:absolute;top:50%;transform:translateY(-50%);-ms-transform:translateY(-50%);}
.cdt-navigation .candidate {display:block;width:20%;left:2rem;font-size:0.875rem;}
.cdt-navigation .candidate:before {content:'';display:inline-block;width:21px;height:21px;background-image:url(https://static.edmclass.com/cdt/sp-icon.png);background-repeat:no-repeat;background-size:150px;vertical-align:middle;background-position:-60px -30px;}
.cdt-navigation .timer {display:block;width:30%;left:50%;transform:translate(-50%,-50%);text-align:center;color:#e61b39;cursor:default;}
.cdt-navigation .timer em {font-size:1.125rem;font-weight:bold;}
.cdt-navigation .timer .remaining {display:block;}
.cdt-navigation .timer .countdown {display:none;}
.cdt-navigation .timer:hover .remaining {display:none;}
.cdt-navigation .timer:hover .countdown {display:block;}
.cdt-navigation .button-wrap {display:block;width:20rem;right:8rem;text-align:right;}
.cdt-navigation .button-wrap .button {display:inline-block;opacity:1;width:4rem;padding:3px 0 4px;border:none;border-radius:4px;background:#8aa0cb;color:#fff;font-size:0.875rem;}
.cdt-navigation .button-wrap .button:hover {background:#7e95c2}
.cdt-navigation .button-wrap .button.point {background:#f53d57;}
.cdt-navigation .button-wrap .button.point:hover {background:#ed324d;}

.audio-control  { position:absolute; top: 1px; right: 2rem; display:inline-flex; justify-content: flex-end; }
/*.audio-control  .volume {position:relative;width:3.75rem;height:10px;float:right;border:1px solid #b9c4d9;border-radius:2px;box-sizing:border-box;}
.audio-control  .sp-speaker {position:absolute;top:50%;right:calc(100% + 10px);transform:translateY(-50%);text-indent:999px;}
.audio-control  .ui-slider .ui-slider-handle {position:absolute;z-index:2;width:16px;height:16px;top:-4px;left:-8px;border:1px solid #b9c4d9;border-radius:2px;box-sizing:border-box;background:#fff;cursor:default;-ms-touch-action:none;touch-action:none;}
.audio-control  .ui-slider .ui-slider-range {position:absolute;z-index:1;top:0;height:100%;font-size:.5rem;display:block;border:0;background-position: 0 0;}
.audio-control  .ui-widget-content {background:#e8eff9;}
.audio-control  .ui-widget-header {background:#fff;}
.audio-control  .audio-skip-button { border: solid 1px #ccc; border-radius: 4px; padding: 2px 6px; cursor: pointer; background-color: #fff; }*/
.audio-control button { margin: 0 0 0 -1px; padding: 5px 10px; background-color: #f8f9fa; border: 1px solid #aaa; cursor: pointer; transition: all 0.2s ease; }
.audio-control button:first-child { border-radius: 4px 0 0 4px;}
.audio-control button:last-child { border-radius: 0 4px 4px 0; }
.audio-control button:hover { background-color: #e9ecef; }

.audio-playpause-button.pause { background-color: #f44336; color: white; border: 1px solid #d32f2f; } 
.audio-playpause-button.pause:hover { background-color: #d32f2f; } 
.audio-playpause-button.play { background-color: #4CAF50; color: white; border: 1px solid #388E3C; } 
.audio-playpause-button.play:hover { background-color: #388E3C; }


/* 하단 페이지네이션 및 컨트롤 박스 */
.cdt-controls {position:absolute;bottom:0;left:0;width:100%;height:78px;background:#e8eff9;}
.cdt-controls .chk-review {position:absolute;bottom:0.5rem;left:2rem;width:4.5rem;}
.cdt-controls .chk-review input {margin-right:5px;}
.cdt-controls .pagination {position:absolute;bottom:-1px;left:7rem;display:block; width: 990px; padding:10px 15px;box-sizing:border-box;border:1px solid #b9c4d9;border-radius:5px 5px 0 0;background:#f6f8fc;}
.cdt-controls .pagination .num {letter-spacing:-1px;}
.cdt-controls .pagination span {position:relative;display:inline-block;width:24px;height:24px;margin:2px 0;box-sizing:border-box;border:1px solid #c1c1c1;background:linear-gradient(#f7f7f7 40%, #e4e4e4);font-size:0.94rem;font-weight:bold;color:#585d62;text-align:center;line-height:22px;cursor:pointer;}
.cdt-controls .pagination span.check {text-decoration:underline;}
.cdt-controls .pagination span.blank {border-color:#111;background:#3c3c3c;color:#fff;}
.cdt-controls .pagination span.current {border-color:#5786f1;background:linear-gradient(#7da2ff,#5786f1);color:#fff;}
.cdt-controls .pagination span.review {border-radius:50%;}
.cdt-controls .pagination .toggle-btn {position:absolute;bottom:0.5rem;right:0.5rem;width:30px;height:30px;background-image:url(https://static.edmclass.com/cdt/icon_controls_toggle.png);background-repeat:no-repeat;text-indent:-999px;overflow:hidden;cursor:pointer;}
.cdt-controls .pagination .toggle-btn {background-position:-30px 0;}
.cdt-controls .pagination.minimum {padding:10px 0;border:none;background:none;}
.cdt-controls .pagination.minimum .toggle-btn {background-position:0 0;}
.cdt-controls .pagination.minimum .num {letter-spacing:-3px;}
.cdt-controls .pagination.minimum span {width:16px;height:16px;font-size:0;line-height:22px;text-indent:-999px;overflow:hidden;}
.cdt-controls .pagination.minimum span.check {text-decoration:none;background:linear-gradient(#7da2ff,#5786f1);border:1px solid #5786f1;}
.cdt-controls .pagination.minimum span.blank {border-color:#111;background:#3c3c3c;color:#fff;}
.cdt-controls .pagination.minimum span.current {width:18px;margin:0 -1px;border:none;background:url(https://static.edmclass.com/cdt/pagenation_current.png) no-repeat center;}
.cdt-controls .pagination.minimum span.consider {border-radius:50%;}
.cdt-controls .page-arrow {position:absolute;bottom:0;right:2rem;letter-spacing:-4px;}
.cdt-controls .page-arrow:after {content:'';display:block;width:100%;clear:both;}
.cdt-controls .page-arrow a {display:inline-block;width:45px;height:45px;background-image:url(https://static.edmclass.com/cdt/icon_arr.png);background-repeat:no-repeat;text-indent:-999px;overflow:hidden;}
.cdt-controls .page-arrow a.prev {background-position:0 0;}
.cdt-controls .page-arrow a.next {background-position:-50px 0;}
.cdt-controls .page-arrow a.prev:hover {background-position:0 -50px;}
.cdt-controls .page-arrow a.next:hover {background-position:-50px -50px;}
