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

/*--- common selector ---*/
* {margin:0; padding:0;}
body, input, textarea, select, button{ 
	font-family:나눔고딕,Dotum,굴림,Gulim,Apple-Gothic,sans-serif,verdana; color:#666; font-size:14pt;
	font-size:13px;
	-webkit-text-size-adjust:none;
	line-height:140%;
} 
@font-face{ font-family:ngttf; src:url(NanumGothic.ttf);}
@font-face{ font-family:ngeot; src:url(NanumGothic.eot);}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,form,fieldset,p,button{margin:0;padding:0;}
body,input,select,textarea{ color:#666; font-weight:normal;} /* 137.5% == 22px */
body{background-color:#fff;-webkit-text-size-adjust:none;}
hr{display:none;}
img,fieldset{border:0;}
input,select,textarea{vertical-align:middle;}
img { vertical-align:top; }
ul,ol,li{list-style:none;}
a{color:#666;text-decoration:none;text-overflow:ellipsis;-o-text-overflow:ellipsis;cursor:pointer;}
a:link,a:hover,a:active{text-decoration:none;}
.selected{cursor:none;}
strong{font-weight:bold;}
input[type="text"]{-webkit-appearance:none;-webkit-border-radius:0;}
input:checked[type="checkbox"]{background-color:#fff;-webkit-appearance:checkbox;}
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal;}
h1{text-align:center;}
input.checkbox {width:13px;height:13px;vertical-align:top; padding:0px; margin:0px;}
.blind{display:none;}
.clear{clear:both;}



/*--- layout ---*/
html, body{height:100%;margin:0;padding:0;}
body{background:#96a3ac;text-align:center;}

#mWrapper{position:relative;width:100%;height:100%;height:auto !important;min-height:100%;max-width:650px;margin:0 auto;text-align:left;background-color:#fff;background-size:cover;*background-color:#fff }


#mHeader{position:relative;height:48px;}

/*--- 폰 ---*/
@media(max-width:400px){
	#mHeader{position:relative;height:45px;}
	#mHeader h1 a{position:absolute;top:12px;left:10px;width:136px;height:30px;background:url(../image/logo.png) no-repeat 0 0; border:0px solid red}
}
/*--- 태블릿 
@media(min-width:321px)and(max-width:768px){
	#mHeader h1 a{position:absolute;top:15px;left:18px;width:136px;height:33px;background:url(../image/mlogo.png) no-repeat 0 0;}
}---*/
/*--- pc ---*/
@media(min-width:401px){
	#mHeader{position:relative;height:48px;}
	#mHeader h1 a{position:absolute;top:12px;left:10px;width:136px;height:33px;background:url(../image/mlogo.png) no-repeat 0 0;}
}

#mHeader .loginBtn{position:absolute;top:16px;right:12px;font-size:16px;color:#292929;}



.mainBtn1{ border:0px solid red; width:100%;max-height:510px; position:relative}

.mainBtn1 .left{clear:both;float:left;max-height:916px; border:0px solid red; height:100%;width:calc((434 / 650)*100%);width:66.6%\9;}




.mainBtn1 .left .loginBtn{position:absolute;top:calc((650 / 650)*100%);top:100%\9;margin-left:4%;margin-top:4%;text-align:center;}

.mainBtn1 .left .loginBtn img{width:100%;}


.mainBtn1 .right{float:left;max-height:510px; border:0px solid red;height:100%;width:calc((216 / 650)*100%);width:33.3%\9; }


.mainBtn1 img {width:100%;}

.mainBtn2{}
.mainBtn2 ul{}
.mainBtn2 li{float:left;text-align:center;width:33.3%;max-height:180px;}
.mainBtn2 li img{width:100%;}


/*--- 폰 ---*/
@media(max-width:400px){
	.timer{float:left;max-height:916px; border:0px solid red; height:100%;width:100%; padding:5px 0; background-color:#b1b9bc}
}
/*--- 태블릿 
@media(min-width:321px)and(max-width:768px){
	#mHeader h1 a{position:absolute;top:15px;left:18px;width:136px;height:33px;background:url(../image/mlogo.png) no-repeat 0 0;}
}---*/
/*--- pc ---*/
@media(min-width:401px){
	.timer{clear:both; float:left; border:0px solid blue; max-height:100px;width:100%; position: relative; top:0px; left:0px;}
}

.timer .bt_timer a{width:100%;max-height:111px}
.timer .bt_timer img{width:100%;}
.timer .bt_timer a:hover{}





#bottom_m{float:right;position:relative;height:auto;width:100%;max-width:650px;min-width:300px;z-index: 2;border:0px solid red;margin-top: 0px;}
#bottom_m table{width:100%; border-top:1px solid #bebebe}
#bottom_m td{
	height:42px;

	border-right:1px solid #d1d1d1;
	background:linear-gradient(to bottom, #fefefe, #ededed);
	text-align:center;
	cursor:pointer;
	background-color:#ededed;
}
#bottom_m td.b1{border-left:0px solid #c1c1c1;}
#bottom_m td.help{border-right:none;}
#bottom_m td a{height:42px;display:block;margin:0px auto;line-height:42px; }
#bottom_m td.b1 a{font-size:14px;}
#bottom_m td.b2 a{font-size:14px;}
#bottom_m td.b3 a{font-size:14px;}
#bottom_m td.b4 a{font-size:14px;}
#bottom_m td.b4{border-right:0px}
#bottom_m td:hover, #bottom_m td.selected{

}
#bottom_m td.b1:hover, #bottom_m td.b1.selected{border-left:none;}
#bottom_m td:hover a, #bottom_m td.selected a{font-size:14px;color:#2b2b2b;}



#bottom_m .sec_link{ height:28px; text-align:center; background-color:#FFF; border-bottom:1px solid #d0d0d0; padding-top:8px;}
#bottom_m .sec_link a{ color:#227dee}
#bottom_m .sec_link a:hover{color:#000}
#bottom_m .sec_copy{ height:25px; text-align:center; background-color:#FFF; padding-top:5px; font-size:12px; color:#939393}




#bottom{position: absolute;bottom:0;width:100%;max-width:650px;min-width:300px;z-index: 2;}
#bottom table{width:100%; border-top:1px solid #bebebe}
#bottom td{
	height:42px;

	border-right:0px solid #d1d1d1;
	background:linear-gradient(to bottom, #fefefe, #ededed);
	text-align:center;
	cursor:pointer;
	background-color:#ededed;
}
#bottom td.b1{border-left:0px solid #c1c1c1;}
#bottom td.help{border-right:none;}
#bottom td a{height:42px;display:block;margin:0 auto;line-height:42px; }
#bottom td.b1 a{font-size:14px;}
#bottom td.b2 a{font-size:14px;}
#bottom td.b3 a{font-size:14px;}
#bottom td.b4 a{font-size:14px;}
#bottom td.b4{border-right:0}
#bottom td:hover, #bottom td.selected{
}
#bottom td.b1:hover, #bottom td.b1.selected{border-left:none;}
#bottom td:hover a, #bottom td.selected a{font-size:14px;color:#2b2b2b;}



#bottom .sec_link{ height:28px; text-align:center; background-color:#FFF; border-bottom:1px solid #d0d0d0; padding-top:8px;}
#bottom .sec_link a{ color:#227dee}
#bottom .sec_link a:hover{color:#000}

#bottom .sec_copy{ height:25px; text-align:center; background-color:#FFF; padding-top:5px; font-size:12px; color:#939393}


/* sub */
#wrapper{position:relative;width:100%;/*height:100%*/;height:auto !important;min-height:100%;max-width:650px;background:#fff;margin:0 auto;text-align:left;}

#header{position:relative;height:34px;border-bottom:1px solid #1276f2;}
#header h1 a{position:absolute;top:8px;left:10px;width:87px;height:20px;background:url(../image/logo.png) no-repeat 0 -1px;}

#header h2{position:absolute;top:9px;font-size:17px;color:#0d6ee7;font-weight:bold;line-height:17px;margin-left:105px;border-left:1px solid #1276f2; height:17px; padding:1px 0 0 7px}

#header .loginBtn{position:absolute;top:8px;right:12px;font-size:14px;color:#292929;}

.contWrap_index{padding-bottom:25px;}
.contWrap{padding-bottom:25px;}
.contWrap h3{font-size:24px;color:#0d6ee7;font-weight:bold;text-align:center;padding:35px 0 40px; }
.contWrap .cont_table {width:100%;}
.contWrap .cont_table th{font-size:14px;color:#227dee;font-weight:normal;letter-spacing:-1px;text-align:right;padding-right:15px;background:url(../image/arrow.png) no-repeat right 13px;}
.contWrap .cont_table td{padding:5px 10px;}
.contWrap .cont_table td input{border:0;border-bottom:1px solid #227dee;font-size:14px;width:100%;height:26px;}
.contWrap .cont_table td .comment{position:absolute;margin-top:-1px;font-size:11px;color:#e71515;}


.contWrap .cont_table0 {width:100%;}
.contWrap .cont_table0 th{font-size:14px;color:#227dee;font-weight:normal;letter-spacing:-1px;text-align:right;padding-right:15px;background:url(../image/arrow.png) no-repeat right 17px;}
.contWrap .cont_table0 td{padding:10px 10px;}
.contWrap .cont_table0 td input{border:0;border-bottom:1px solid #227dee;font-size:14px;width:100%;height:26px;}
.contWrap .cont_table0 td .comment{position:absolute;margin-top:-1px;font-size:11px;color:#e71515;}

.contWrap .pwWrap{background:#e9edf2;padding:15px;}
.contWrap .tableBox{background:#fff;border:1px solid #d3dce8;padding:20px;-webkit-box-shadow: 2px 2px 2px #dfe4ea;-moz-box-shadow: 2px 2px 2px #dfe4ea;box-shadow: 2px 2px 2px #dfe4ea;}
.contWrap .contTxt{text-align:center;font-size:16px;color:#444;line-height:30px;letter-spacing:-1px;margin:0 8%;}
.contWrap .contTxt a.txt_r{text-decoration:underline;color:#e71515;}
.contWrap .checkTxt{position:relative;height:23px;font-size:16px;color:#fff;line-height:23px;letter-spacing:-1px;background:#e95c5c;padding-left:40px;margin:0 8% 20px;}
.contWrap .checkTxt p.check{position:absolute;top:-5px;left:5px;width:31px;height:31px;background:url(../image/check.png) no-repeat 0 0;}
.contWrap .infoTxt{font-size:16px;color:#444;letter-spacing:-1px;margin:0 8% 15px;}
.contWrap .joinWrap{padding:0 15px;margin-bottom:30px;}
.contWrap .emailWrap{font-size:18px;color:#414141;text-align:center;line-height:30px;letter-spacing:-1px;margin:0 8%;}
.contWrap .emailWrap p{margin-bottom:30px;}
.contWrap .emailWrap .txt_b{color:#0d6ee7;}
.contWrap .btnWrap{margin-top:50px;text-align:center;}
.contWrap .btnWrap a{width:255px;height:56px;display:block;background:#1276f2 url(../image/btn_corner.png) no-repeat right top;font-size:20px;color:#fff;letter-spacing:-1px;line-height:56px;text-align:center;margin:0 auto;}
.contWrap .btnWrap a:hover{background:#2687ff url(../image/btn_corner.png) no-repeat right top;}
.contWrap .btnWrap span.txt_y{color:#fff14f;}
.popupWrap{width:60%;max-width:260px;height:90px;padding:35px 25px;background:#e9edf2;border:1px solid #d4d9e0;border-radius:5px;text-align:center;}
.popupWrap .popTxt{font-size:14px;color:#000;text-align:left;}
.popupWrap .popBtn a{margin:20px auto 0;width:97px;height:38px;display:block;font-size:18px;color:#fff;line-height:38px;text-align:center;background:#5b6877;}
.layerWrap{width:100%;background:url(../image/layer_bg.png) repeat 0 0;}
.layerBox{position:relative;margin:30px;padding:15px;background:#fff;}
.layerBox .layerTit{font-size:18px;color:#037ce6;border-bottom:1px solid #037ce6;padding-bottom:6px;margin-bottom:20px;}
.layerBox .layerTxt{font-size:12px;color:#494949;line-height:120%;}
.layerBox .closeBtn{position:absolute;top:5px;right:5px;font-size:18px;color:#464646;}

.nameBar{position:relative;height:36px;font-size:14px;font-weight:normal;color:#fff;line-height:36px;letter-spacing:-1px;}
.nameBar .name{position:absolute;top:0;left:0;width:100%;height:36px;background:#037ce6;}
.nameBar .btnManage a{position:absolute;top:0;right:0;width:80px;height:36px;background:#034d8e;text-align:center;color:#fff;}
.nameBar .name span{padding-left:15px;}

#tabBox{position:relative;width:100%; min-height: 360px;}
#tabBox>.smenu{position:absolute;top:0;height:46px;background:linear-gradient(to bottom, #f1f1f1, #d9d9d9);overflow:hidden;cursor:pointer;background-color:#eee;}
#tabBox>.smenu#theme{left:0;width:50%;}
#tabBox>.smenu#cast{left:50%;width:50%;}
#tabBox .smenu>a{height:40px;font-size:14px;color:#4d4e4e;font-weight:normal;letter-spacing:-1px;margin:5px;display:block;text-align:center;line-height:35px;}
#tabBox .smenu.on a{border:1px solid #dadada;background:#fff;font-size:14px;color:#0c77e4;line-height:34px;-webkit-box-shadow: 0 2px 3px #c1c1c1;-moz-box-shadow: 0 2px 3px #c1c1c1;box-shadow: 0 2px 3px #c1c1c1;}
#tabBox>.sbmain{position:absolute;top:47px;left:0;display:none;max-width:100%;position:relative;height:100%;min-height: 400px;}
#tabBox>.sbmain.on{display:block; padding-bottom: 10px;}
#tabBox .sbmain>ul>li{border-bottom:1px solid #ececec;}
#tabBox .sbmain>ul>li>a{position:relative;display:block;min-height:20px;line-height:125%;font-size:14px;letter-spacing:-1px;}
#tabBox .sbmain>ul>li a .subj{padding:20px 120px 20px 25px;color:#222;display:block;}
#tabBox>.sbmain>ul>li a.on .subj{background:url(../image/open.png) no-repeat 8px 22px;}
#tabBox .sbmain>ul>li a .date{position:absolute;top:0;right:0;padding:20px;width:100px;color:#037ce6;text-align:right;}
#tabBox .sbmain>ul>li li{background:#f0f6fb;border-top:1px solid #ececec;padding:20px 15px 20px 25px;font-size:14px;color:#222;letter-spacing:-1px;line-height:125%;}
#tabBox .btnWrap2{margin-top:20px;text-align:center;}
#tabBox .btnWrap2 a{width:97px;height:38px;display:inline-block;margin:0 10px;background:#1276f2;font-size:18px;color:#fff;line-height:38px;text-align:center;}
.layerWrap table.manage{}
.layerWrap table.manage th{font-size:18px;color:#037ce6;letter-spacing:-1px;text-align:center;background:none;padding:5px;border-bottom:1px solid #037ce6;}
.layerWrap table.manage td{font-size:18px;color:#464646;letter-spacing:-1px;text-align:center;padding:5px;height:25px;border-bottom:1px solid #e1e1e1;}
.layerWrap table.manage td .group1{margin:0 auto;width:78px;height:30px;background:#1276f2;font-size:16px;color:#fff;line-height:30px;}
.layerWrap table.manage td .group2{margin:0 auto;width:76px;height:28px;border:1px solid #1276f2;font-size:16px;color:#0466e0;line-height:28px;}

table.toeicTest{width:100%;padding-top:15px;*margin-top:15px;}
table.toeicTest th{font-size:14px;color:#0d6ee7;font-weight:normal;letter-spacing:-1px;text-align:left;padding-left:15px;width:99px;height:37px;background:url(../image/arrow_bg.png) no-repeat -30px 3px;}
table.toeicTest td{font-size:14px;color:#222;font-weight:normal;letter-spacing:-1px;padding:0;}

table.toeicList{width:100%;margin-top:50px;}
table.toeicList th{font-size:13px;color:#fff;font-weight:normal;letter-spacing:-1px;text-align:center;height:36px;background:#96a3ac;padding:0;}
table.toeicList td{font-size:13px;color:#222;font-weight:normal;letter-spacing:-1px;line-height:130%;text-align:center;padding:10px 0;}
table.toeicList td.subj{text-align:left;}
table.toeicList td.subj p a{cursor:pointer;}
table.toeicList td .date{font-size:11px;color:#037ce6;}
table.toeicList td .lineNum{border-top:1px solid #d3d3d3;padding:5px 5px 0 5px;margin-top:5px;}
table.toeicList tr:nth-child(odd){background:#fff; }
table.toeicList tr:nth-child(even){background:#ededed;}
table.toeicList tr.odd td{background:#fff;border-bottom:1px solid #ededed}
table.toeicList tr.even td{background:#ededed;}

#tabBox>.smenu#noti{left:0;width:33%;}
#tabBox>.smenu#manage{left:33%;width:34%;}
#tabBox>.smenu#open{left:67%;width:33%;}
.selectWrap{height:52px;text-align:center;}
.selectWrap .select{border:1px solid #a0a0a0;padding:3px;color:#000;margin:14px 5px;}
.inputWrap{background:#e0e8f3;padding:40px 0 20px;}
.inputWrap .input{border:1px solid #c7d0d2;font-size:14px;color:#000;width:120px;height:17px;padding:3px;}
.inputWrap .inputBox{width:90%;max-width:390px;margin:0 auto 10px;font-size:14px;color:#000;line-height:24px;}
.inputWrap .textarea{width:100%;height:145px;border:1px solid #c7d0d2;font-size:14px;color:#000;}
.inputWrap .check{margin-right:5px;}
.inputWrap .txtNum{font-size:14px;color:#687485;text-align:right;}
.inputWrap .duration{font-size:14px;color:#1276f2;font-weight:bold;margin-bottom:5px;}

table.oxNote{width:100%;}
table.oxNote th{font-size:13px;color:#fff;font-weight:normal;letter-spacing:-1px;text-align:center;height:36px;background:#96a3ac;padding:0;}
table.oxNote td{font-size:13px;color:#222;font-weight:normal;letter-spacing:-1px;line-height:130%;text-align:center;padding:10px 0;}
table.oxNote td.subj{text-align:left;}
table.oxNote td .date{font-size:11px;color:#037ce6;}
table.oxNote td.xNum{color:#de1212;text-decoration:underline;}
table.oxNote tr:nth-child(odd){background:#fff;}
table.oxNote tr:nth-child(even){background:#ededed;}
table.oxNote tr.odd td{background:#fff;border-bottom:1px solid #ededed}
table.oxNote tr.even td{background:#ededed;}

table.gradeList{width:100%;}
table.gradeList th{font-size:13px;color:#fff;font-weight:normal;letter-spacing:-1px;text-align:center;height:36px;background:#96a3ac;padding:0;}
table.gradeList td{font-size:13px;color:#222;font-weight:normal;letter-spacing:-1px;line-height:130%;text-align:center;padding:10px 0;}
table.gradeList td.subj{text-align:left;}
table.gradeList td .date{font-size:11px;color:#037ce6;}
table.gradeList td .lineNum{border-top:1px solid #d3d3d3;padding:5px 5px 0 5px;margin-top:5px;}
table.gradeList tr:nth-child(odd){background:#fff;}
table.gradeList tr:nth-child(even){background:#ededed;}
table.gradeList tr.odd td{background:#fff;border-bottom:1px solid #ededed}
table.gradeList tr.even td{background:#ededed;}

#tabBox>.smenu#part{left:0;width:33%;}
#tabBox>.smenu#relative{left:33%;width:34%;}
#tabBox>.smenu#highRank{left:67%;width:33%;}
.graphInfo{padding:25px 25px 0;}
.graphInfo .txt{background:#deebf3;border-radius:10px;padding:10px 20px;width:;font-size:14px;color:#222;line-height:125%;}
.graphWrap{padding-top:20px;}
.graphWrap .subj{width:136px;height:39px;margin-bottom:10px;background:url(../image/arrow_bg2.png) no-repeat 0 0;font-size:18px;color:#fff;line-height:39px;padding-left:75px;}
.graphWrap .graphBox{width:80%;height:200px;background:#f0f0f0;margin:0 auto;}
.contWrap .btnWrap3{margin-top:50px;margin-bottom:50px;text-align:center;}
.contWrap .btnWrap3 a{width:255px;height:56px;display:block;background:#5b6877 url(../image/btn_corner2.png) no-repeat right top;font-size:20px;color:#fff;letter-spacing:-1px;line-height:56px;text-align:center;margin:0 auto;}
.contWrap .btnWrap3 a:hover{background:#6b7784 url(../image/btn_corner2.png) no-repeat right top;}

#tabBox>.smenu#allWord{left:0;width:33%;}
#tabBox>.smenu#noWord{left:33%;width:34%;}

#tabBox>.smenu#memoryWord{left:67%;width:33%;}
.subjBar{position:relative;background:#d1dfe4;height:36px;font-size:14px;font-weight:normal;color:#000;line-height:36px;letter-spacing:-1px;}
.subjBar .name{position:absolute;top:0;left:15px;width:100%;height:36px;}
.subjBar .select{position:absolute;top:5px;right:15px;border:1px solid #a0a0a0;padding:3px;color:#000;width:80px;}
li.wordList{padding:10px 15px;}
li.wordList .wordArea{float:left;width:calc(100% - 65px);}
li.wordList .wordArea .word{font-family:arial;font-size:18px;color:#ee3915;line-height:140%;}
li.wordList .wordArea .explain{font-size:14px;color:#4c4c4c;letter-spacing:-1px;line-height:140%;}
li.wordList .memoryArea{float:right;width:60px;}
li.wordList .memoryArea .memory{background:#f42e1a;width:55px;height:25px;font-size:14px;color:#fff;font-weight:bold;line-height:25px;text-align:center;}
li.wordList .memoryArea .nomemory{border:1px solid #f42e1a;width:53px;height:23px;font-size:14px;color:#f42e1a;font-weight:bold;line-height:23px;text-align:center;}

.timerBg{background:#dce4ec;position:relative;top:0px;bottom:0;width:100%;height:570px;}
.timerBg .timer{clear:both;position:relative;top:0;bottom:0;width:100%;background:#dce4ec;text-align:center;padding-bottom:0px;}
.timer .timerWrap{min-width:300px;max-width:516px;width:80%;height:120px;padding-top:20px;background:#687578;border-radius:10px;-webkit-box-shadow: 0 0 4px #c0c8d0;-moz-box-shadow: 0 0 4px #c0c8d0;box-shadow: 0 0 4px #c0c8d0;margin:30px auto 12px;}
.timer .timerWrap .totalTxt{width:104px;height:39px;margin:0 auto 20px;background:url(../image/img_total.png) no-repeat 0 0;}
.timer .timerWrap .time{width:220px;height:41px;margin:0 auto;}
.timer .timerWrap p{float:left;width:28px;height:41px;background:url(../image/num.png) no-repeat 0 0;}
.timer .timerWrap .t0{background-position:-119px; 0;}
.timer .timerWrap .t1{background-position:-147px; 0;}
.timer .timerWrap .t2{background-position:-175px; 0;}
.timer .timerWrap .t3{background-position:-203px; 0;}
.timer .timerWrap .t4{background-position:-231px; 0;}
.timer .timerWrap .t5{background-position:-259px; 0;}
.timer .timerWrap .t6{background-position:-287px; 0;}
.timer .timerWrap .t7{background-position:-315px; 0;}
.timer .timerWrap .t8{background-position:-343px; 0;}
.timer .timerWrap .t9{background-position:-371px; 0;}
.timer .timerWrap .tImg{width:29px;background-position:-77px; 0;margin-right:5px;}
.timer .timerWrap .colon{width:7px;background-position:-109px; 0;}
.timer .partWrap{min-width:300px;max-width:516px;width:80%;height:;background:#fff;border-radius:10px;-webkit-box-shadow: 0 0 4px #c0c8d0;-moz-box-shadow: 0 0 4px #c0c8d0;box-shadow: 0 0 4px #c0c8d0;margin:0 auto;padding:40px 0 30px;}
.timer .partWrap .partOn{position:relative;width:80%;height:50px;margin:;min-width:280px;max-width:400px;margin:0 auto 10px;}
.timer .partWrap .partOn .part{position:absolute;top:3px;left:0;right:62px;}
.timer .partWrap .partOn .partBg{margin:0 20px;height:43px;background:url(../image/part_bg.png) repeat 0 0;}
.timer .partWrap .partOn .partLeft{position:absolute;top:0;left:0;width:20px;height:43px;background:url(../image/part_left.png) no-repeat 0 0;}
.timer .partWrap .partOn .partRight{position:absolute;top:0;right:0;width:20px;height:43px;background:url(../image/part_right.png) no-repeat 0 0;}
.timer .partWrap .partOn .playIcon{position:absolute;top:0;right:0;width:50px;height:50px;background:url(../image/img_play.png) no-repeat -50px 0;}
.timer .partWrap .partOff{position:relative;width:80%;height:50px;margin:;min-width:280px;max-width:400px;margin:0 auto 10px;}
.timer .partWrap .partOff .part{position:absolute;top:3px;left:0;right:62px;width:130px;}
.timer .partWrap .partOff .partBg{margin:0 20px;height:43px;background:url(../image/part2_bg.png) repeat 0 0;}
.timer .partWrap .partOff .partLeft{position:absolute;top:0;left:0;width:20px;height:43px;background:url(../image/part2_left.png) no-repeat 0 0;}
.timer .partWrap .partOff .partRight{position:absolute;top:0;right:0;width:20px;height:43px;background:url(../image/part2_right.png) no-repeat 0 0;}
.timer .partWrap .partOff .playIcon a{position:absolute;top:0;right:0;width:50px;height:50px;background:url(../image/img_play.png) no-repeat 0 0;}
.timer .partWrap .partOn .partTxt{font-size:18px;color:#0d6ee7;line-height:43px;float:left;margin-left:5px;}
.timer .partWrap .partOn .partTime{font-size:18px;color:#0d6ee7;line-height:43px;float:right;margin-right:5px;}
.timer .partWrap .partOff .partTxt{font-size:18px;color:#0d6ee7;line-height:43px;}
.timer .partWrap .partOff .partTime{font-size:18px;color:#0d6ee7;line-height:43px;float:right;margin-right:5px;left:237px;position: absolute; display: none;}
.contWrap .btnWrap4{margin:20px 0 30px;text-align:center;}
.contWrap .btnWrap4 a{width:136px;height:56px;display:inline-block;background:#1276f2 url(../image/btn_corner.png) no-repeat right top;font-size:20px;color:#fff;letter-spacing:-1px;line-height:56px;text-align:center;margin:0 8px;}
.contWrap .btnWrap4 a:hover{background:#2687ff url(../image/btn_corner.png) no-repeat right top;}

.testBottom{padding-bottom:0;}
.test{position:relative;top:0;bottom:0;width:100%;background:#dce4ec;text-align:center;padding-bottom:50px;}
.testBar{position:relative;height:34px;border-bottom:1px solid #fff;}
.testBar .testTit{height:34px;background:#005bab ;font-size:17px;color:#fff;line-height:34px;text-align:left;padding-left:10px;}


.testBar .testBtnT{position:absolute;top:0;right:0;background:#fff;padding-left:1px;}
.testBar .testBtnT a{font-size:13px;color:#fff;text-align:center;line-height:35px;}
.testBar .testBtnT .btnBack{float:left;width:43px;height:35px;background:#086fca url(../image/test_back2.png) no-repeat 10px 4px;margin:-1px 0 0 0;}
.testBar .testBtnT .btnBackOff{float:left;width:43px;height:35px;background:#b7babc url(../image/test_back2.png) no-repeat 10px 4px;margin:-1px 0 0 0;cursor:default;}
.testBar .testBtnT .btnNext{float:left;width:43px;height:35px;background:#005bab url(../image/test_next2.png) no-repeat 12px 4px;margin:-1px 0 0 0;}
.testBar .testBtnT .btnNextOff{float:left;width:43px;height:35px;background:#b7babc url(../image/test_next2.png) no-repeat 12px 4px;margin:-1px 0 0 0;cursor:default;}


.testBar .testBtnT .btnSubmit{float:left;width:63px;height:35px;background:#00468e ;margin:-1px 0 0 1px;}
.testBar .testBtnT .btnList{float:left;width:63px;height:35px;background:#00468e ;margin:-1px 0 0 1px;}


.timerBar{ position: relative;height:31px;background:#90a3a8;background:url(../image/time_bg.gif) repeat-y 0 0; padding-top:3px}
.timerBar_close{ position: relative;height:3px;background:url(../image/time_bg.gif) repeat-y 0 0;}

.timerBar .time{float:left;width:180px;height:22px;margin-left:10px; border:0px solid red}
.timerBar p{float:left;width:22px;height:28px;background:url(../image/num2.png) no-repeat 0 0;}
.timerBar .t0{background-position:-117px 0;}
.timerBar .t1{background-position:-138px 0;}
.timerBar .t2{background-position:-161px 0;}
.timerBar .t3{background-position:-183px 0;}
.timerBar .t4{background-position:-205px 0;}
.timerBar .t5{background-position:-227px 0;}
.timerBar .t6{background-position:-249px 0;}
.timerBar .t7{background-position:-271px 0;}
.timerBar .t8{background-position:-293px 0;}
.timerBar .t9{background-position:-315px 0;}

.timerBar .tSnd{width:36px;background-position:0px 0;margin-right:10px;}
.timerBar .tImg{width:24px;background-position:-65px 0;margin-right:5px; border:0px solid red}
.timerBar .tImg2{background:url(../image/clock_red.gif) no-repeat 0 -2px; width:24px;margin-right:5px;}
.timerBar .colon{width:7px;background-position:-107px 0;}


.timerBar .fontSize{float:right;margin:0px 3px 0 0;background:url(../image/img_fontsize2.png) no-repeat 2px 2px; width:65px; height:28px; padding-left:2px}
.timerBar .fontSize .font_small{ width:30px; height:28px; border:0px solid red; float:left}
.timerBar .fontSize .font_small a{ display:block;width:28px; height:28px; }
.timerBar .fontSize .font_big{ width:30px; height:28px; border:0px solid red; float:left}
.timerBar .fontSize .font_big a{display:block;width:28px; height:28px; }


.timerBar .fontSize2{float:right;margin:2px 3px 0 0;background:url(../image/img_fontsize2.png) no-repeat 2px 2px; width:65px; height:28px; padding-left:2px}
.timerBar .fontSize2 .font_small{ width:30px; height:28px; border:0px solid red; float:left}
.timerBar .fontSize2 .font_small a{ display:block;width:28px; height:28px; }
.timerBar .fontSize2 .font_big{ width:30px; height:28px; border:0px solid red; float:left}
.timerBar .fontSize2 .font_big a{display:block;width:28px; height:28px; }



.time_close{position: relative;top:0px; margin:0 auto ;background:#fff;width:54px;height:22px;}
.time_close a{ display:block;width:54px;height:22px;background:url(../image/time_btn.png) no-repeat 0 -1px;}

.time_open{position: relative;top:0px; margin:0 auto ;background:#fff;width:54px;height:22px;}
.time_open a{ display:block;width:54px;height:22px;background:url(../image/time_btn.png) no-repeat 0 -26px;}



/*.testBtnB{width:100%;height:34px;margin:30px 0;}*/
.testBtnB{position:relative;width:100%;height:34px;/*margin:30px 0;*/padding:30px 0;text-align: center;}
.testBtnB a{font-size:14px;color:#fff;text-align:left;line-height:34px;padding-left:35px;}

.testBtnB .btnBack{width:48px;height:34px;display:inline-block;background:#086fca url(../image/test_back2.png) no-repeat 7px 4px;}
.testBtnB .btnBackOff{width:48px;height:34px;display:inline-block;background:#b7babc url(../image/test_back2.png) no-repeat 7px 8px;cursor:default;}
.testBtnB .btnNext{width:70px;height:34px;display:inline-block;background:#005bab url(../image/test_next2.png) no-repeat 53px 4px;padding-left:13px;}
.testBtnB .btnNextOff{width:70px;height:34px;display:inline-block;background:#b7babc url(../image/test_next2.png) no-repeat 53px 4px;padding-left:13px;cursor:default;}
.testBtnB .btnSubmit{width:63px;height:34px;display:inline-block;background:#00468e ;padding-left:13px;}


.topBtn{max-width:650px;position:fixed;width:100%;bottom:20px;}
.topBtn a{position:absolute;bottom:0;right:8px;width:34px;height:34px;background:url(../image/btn_top.png) no-repeat 0 0;}



.startBox{position:relative;width:221px;height:177px;margin:180px auto 0;padding:20px;background:url(../image/testalert_bg.png) repeat 0 0;text-align:center;}
.startBox .layerTxt{font-size:16px;color:#fff;line-height:120%;}
.startBox .btnStart a{width:125px;height:87px;display:block;background:url(../image/btn_start.png) repeat 0 0;margin:20px auto 0;}

.direction{padding:20px 20px 0;text-align:left;}
.direction dt{font-family:arial;font-size:20px;color:#005bab;line-height:125%;margin:20px 0 10px;}
.direction dd{font-family:arial;font-size:16px;color:#292929;line-height:125%;}
.direction dd.sample{text-align:right;margin-top:20px;}
.direction dd.sample .tit{color:#005bab;margin-bottom:5px;font-size:20px;}
.direction dd.sample span{font-size:20px;vertical-align:middle;display:inline-block;width:18px;height:18px;line-height:100%;}
.direction dd.sample .selected{background:url(../image/test_selected.png) no-repeat 1px 1px;}
.direction dd.example{margin-top:20px;font-size:16px;}
.direction dd.example .tit{color:#005bab;margin-bottom:5px;font-size:20px;}
.direction dd.example img{width:100%;}

/* 개발자 추가분 */
#div_cont1{position:relative; margin:0 0 10px 0; left:0; top:0; height:100%; max-width: 100%; /*overflow-x:hidden;overflow-y:auto;*/ border: 0px solid red;}
#div_cont{position: relative; top: 0px; margin-left:auto; margin-right: auto; /*max-height:100%; max-width:590px;*/ padding-bottom: 10px; border: 0px solid blue;}

 .sel {cursor:pointer;}
 .omr {cursor:pointer;}
/* 개발자 추가분 */

.finishBg{background:url(../image/finish_bg.gif) repeat 0 0;position:absolute;top:35px;bottom:0;width:100%;}
.finishBg .test{background:url(../image/finish_bg.gif) repeat 0 0;}
.finish{position:relative;width:80%;height:211px;min-width:280px;max-width:467px;margin:50px auto 0;}
.finish .finBg{margin:0 30px;height:211px;background:url(../image/fin_bg.png) repeat 0 0; text-align: center;}
.finish .finLeft{position:absolute;top:0;left:0;width:30px;height:211px;background:url(../image/fin_left.png) no-repeat 0 0;}
.finish .finRight{position:absolute;top:0;right:0;width:30px;height:211px;background:url(../image/fin_right.png) no-repeat 0 0;}
.finish .finTxt{width:100%;max-width:310px;font-size:16px;color:#2c343e;line-height:130%;margin:0 auto;}
.finish img{width:100%;max-width:272px;margin:50px 0 30px;}
.finish dt{font-size:20px;color:#272727;font-weight:bold;line-height:130%;text-align:center;padding:50px 0 30px;}
.finish dt span{color:#f42e1a;}
.finish dd{font-size:16px;color:#2c343e;line-height:130%;text-align:center;}

.finish .btnWrap4{margin:20px 0 30px;text-align:center;}
.finish .btnWrap4 a{width:136px;height:56px;display:inline-block;background:#1276f2 url(../image/btn_corner.png) no-repeat right top;font-size:20px;color:#fff;letter-spacing:-1px;line-height:56px;text-align:center;margin:0 8px;}
.finish .btnWrap4 a:hover{background:#2687ff url(../image/btn_corner.png) no-repeat right top;}


.answerBg{background:#fff;}
.answerBg .timerBar .time{float:none;width:221px;margin:0 auto;}
/*
.answerSheet{padding:0 55px;}
.answerSheet table{margin-top:20px;}
.answerSheet table th{padding:13px 5px;font-family:arial;font-size:18px;color:#e95902;letter-spacing:0;text-align:left;border-bottom:1px solid #e67e0e;background:none;}
.answerSheet table td{height:38px;border-bottom:1px solid #d7d7d7;padding:0;}
.answerSheet table td.qNum{font-family:arial;font-size:18px;color:#e67e0e;}
*/
.answerSheet{padding:0 30px; text-align:center; border:0px solid red; min-width: 120px; }
.answerSheet table{margin-top:20px; border:0px solid blue;}
.answerSheet table th{padding:13px 5px;font-family:arial;font-size:18px;color:#e95902;letter-spacing:0;text-align:left;border-bottom:1px solid #e67e0e;background:none; width:600px;}
.answerSheet table td{height:38px;border-bottom:1px solid #d7d7d7;padding:0px; }
.answerSheet table td.qNum{font-family:arial;font-size:18px;color:#e67e0e; min-width: 40px;}

.answerSheet table td a{font-size:18px;color:#000;}
.answerSheet table td.correct{background:url(../image/test_correct.png) no-repeat 50% 50%;}
.answerSheet table td.incorrect{background:url(../image/test_incorrect.png) no-repeat 50% 50%;}
.answerSheet table td.answer{background:url(../image/test_answer.png) no-repeat 50% 50%;}
.answerSheet table td.selected{background:url(../image/test_selected.png) no-repeat 50% 50%;}


.explainBg{background:#fff;}
.explainBg .selectBar{height:35px;background:#dce4ec;border-bottom:1px solid #fff;}
.explainBg .selectBar .select{border:1px solid #a0a0a0;padding:3px;color:#000;margin:5px 3px;min-width:120px;}

.timerBar .playBtn{float:left;margin-left:5%;}
.timerBar .playBtn a{width:28px;height:28px;display:block;background:url(../image/btn_play.png) no-repeat 0 0;}

.progressWrap{margin:0px 80px 0 5%;padding:9px 0 0 40px;}
.progress{position:relative;width:100%;max-width:448px;height:11px;}
.progress .proLeft{position:absolute;top:0;left:0;width:5px;height:11px;background:url(../image/progress_left.png) no-repeat 0 0;}
.progress .proRight{position:absolute;top:0;right:0;width:5px;height:11px;background:url(../image/progress_right.png) no-repeat 0 0;}
.progress .proBg{position:relative;width:;height:11px;margin:0 5px;background:url(../image/progress_bg.png) repeat 0 0;}
.progress .proBg .current{position:absolute;top:4px;left:0;height:3px;background:#fff;}


.explainWrap{margin-bottom:20px;}
.explainWrap .quest{text-align:left;padding:15px 10px 0 10px;}
.explainWrap .quest .qNum{}
.explainWrap .quest .testThumb{ padding:0 10px}
.explainWrap .quest dd{ padding:3px 10px}
.explainWrap .quest dl{ padding-bottom:10px}

.explainWrap .quest .correct{background:url(../image/test_correct.png) no-repeat 0 20px;padding:30px 0 10px 10px;}
.explainWrap .quest .incorrect{background:url(../image/test_incorrect.png) no-repeat 0 20px;padding:30px 0 10px 10px;}
.explainWrap .quest li{font-size:16px;color:#272727;line-height:125%;}


/*.explainWrap .explain{background:url(../image/explain_bg.gif) repeat-x 0 0;text-align:left;padding:10px 30px 0;}*/
.explainWrap .explain{text-align:left;padding:10px 20px;}



.explainWrap .explain .tit{height:23px;background:url(../image/explain_tit.png) no-repeat 0 0;font-size:20px;color:#086fca;font-weight:bold;line-height:23px;padding-left:26px;margin-bottom:25px;}
.explainWrap .explain .num{font-size:18px;color:#272727;margin-bottom:5px;}
.explainWrap .explain .ans{font-size:16px;color:#f42e1a;font-weight:bold;}
/*.explainWrap .explain dl{margin-top:18px;}*/
/*.explainWrap .explain dt{font-size:14px;color:#086fca;line-height:125%;font-weight:bold;}*/
.explainWrap .explain .subj{margin-top:18px;font-size:14px;color:#086fca;line-height:125%;font-weight:bold;}
/*.explainWrap .explain dd{font-size:14px;color:#272727;line-height:150%;}*/
.explainWrap .explain .qTxt{font-size:14px;color:#272727;line-height:150%;}
.explainWrap .explain .qTxtc{font-size:14px;color:#272727;line-height:150%;text-align: center;}
.explainWrap .explain .qSubject{font-size:14px;color:#272727;line-height:150%;text-align: center;font-weight:600;}
.explainWrap .explain .qTit{font-size:14px;color:#086fca;line-height:125%;font-weight:bold;}
.explainWrap .explain .qBox1{font-family:arial;font-size:16px;color:#272727;line-height:125%;padding:5px 0;border:1px solid #272727;padding:10px 15px;}
.explainWrap .explain .qBox2{font-family:arial;font-size:16px;color:#272727;line-height:125%;padding:5px 0;border:1px dotted #272727;padding:10px 15px;}

.typeBg{background:#fff;}
.quest{text-align:left;padding:20px;}
.quest .qTxt{font-size:14px;color:#272727;line-height:125%;padding:0px 10px;}
.quest .qSubject{font-size:14px;color:#272727;line-height:125%;padding:5px 0;text-align: center;font-weight:600;}
.quest .qTxtc{font-size:14px;color:#272727;line-height:125%;padding:5px 0;text-align: center;}
.quest .qTit{font-size:16px;color:#272727;line-height:125%;padding:5px 10px;}
.quest .qBox1{font-size:16px;color:#272727;line-height:125%;padding:5px 0;border:1px solid #272727;padding:10px 15px; margin:0 10px;}
.quest .qBox2{font-size:16px;color:#272727;line-height:125%;padding:5px 0;border:1px dotted #272727;padding:10px 15px; margin:0 10px;}

.quest .subj{margin-top:18px;font-size:14px;color:#086fca;line-height:125%;font-weight:bold;}
/*.quest .qTxt .qTxt {font-size:16px;line-height:125%;padding:5px 0;}*/

.quest dl{margin-top:0px; margin-bottom:0px;}
.quest dt{}
.quest dt .qNum{font-family:arial;font-size:18px;color:#272727;line-height:125%;padding:20px 0px 0 0;}
.quest dt .qNum2{font-family:arial;font-size:18px;color:#272727;line-height:125%;padding:20px 10px;}
.quest dt .qTit{font-family:arial;font-size:18px;color:#272727;line-height:125%;padding:5px 0;}
.quest dt .qBox1{font-family:arial;font-size:16px;color:#272727;line-height:125%;padding:5px 0;border:1px solid #272727;padding:10px 15px;}
.quest dt .qBox2{font-family:arial;font-size:16px;color:#272727;line-height:125%;padding:5px 0;border:1px dotted #272727;padding:10px 15px;}
.quest dd{font-family:arial;font-size:16px;line-height:125%;padding:5px 0;}
.quest dd input[type=radio]{float:left;margin-top:4px;*margin-top:1px;vertical-align:baseline;}
.quest dd a{display:block;margin-left:18px;color:#272727;}
.quest dt .testThumb img{width:100%;}









/* 졍 추가 및 수정 */

.contWrap .s_gray{font-size:12px;color:#666;}
.contWrap .wri_box{ padding:10px}
.contWrap textarea{border:1;border:1px solid #227dee;font-size:14px;width:100%;height:76px; color:#333}
li.wordList .memoryArea .nomemory a{color:#f42e1a;}


#tabBox>.sbmain2{position: relative;top:0px;left:0;display:none;width:100%;}
#tabBox>.sbmain2.on{display:block;}
#tabBox .sbmain2>ul>li{border-bottom:1px solid #ececec;}
#tabBox .sbmain2>ul>li>a{position:relative;display:block;min-height:20px;line-height:125%;font-size:14px;letter-spacing:-1px;}
#tabBox .sbmain2>ul>li a .subj{padding:20px 120px 20px 25px;color:#222;display:block;}
#tabBox>.sbmain2>ul>li a.on .subj{background:url(../image/open.png) no-repeat 8px 22px;}
#tabBox .sbmain2>ul>li a .date{position:absolute;top:0;right:0;padding:20px;width:100px;color:#037ce6;text-align:right;}
#tabBox .sbmain2>ul>li li{background:#f0f6fb;border-top:1px solid #ececec;padding:20px 15px 20px 25px;font-size:14px;color:#222;letter-spacing:-1px;line-height:125%;}


.contWrap .mypage{background:#e9edf2;padding:35px 20px 20px 20px;}
.contWrap .mp_box{background:#fff;border:1px solid #d3dce8;padding:10px;-webkit-box-shadow: 2px 2px 2px #dfe4ea;-moz-box-shadow: 2px 2px 2px #dfe4ea;box-shadow: 2px 2px 2px #dfe4ea; margin-bottom:20px}

.contWrap .mp_link  {  width:100%}
.contWrap .mp_link a{ display:block; width:100%; background:url(../image/arrow2.gif) no-repeat right ;padding:10px; font-weight:bold; color:#0d6ee7}
.contWrap .mp_link a:hover{color:#000 }


.contWrap .memcan{background:#e9edf2;padding:25px 20px 5px 20px;}
.contWrap .memcan .mp_box{background:#fff;border:1px solid #d3dce8;padding:10px;-webkit-box-shadow: 2px 2px 2px #dfe4ea;-moz-box-shadow: 2px 2px 2px #dfe4ea;box-shadow: 2px 2px 2px #dfe4ea; margin-bottom:20px}

.contWrap .memcan .mp_box .tit{ width:90%; font-weight:bold; float:left;border-bottom:1px solid  #b2b2b2;  padding-bottom:3px; color:#444}
.contWrap .memcan .mp_box .che{ width:10%; font-weight:bold; float:left;float:left; text-align:right;border-bottom:1px solid #b2b2b2 ;padding-bottom:3px;}
.contWrap .memcan .mp_box .cont{ clear:both; padding-top:7px;}
.contWrap .memcan .mp_box .cont .red{ color:#de1212}

.contWrap .btn_cancel{margin-top:15px;text-align:center; border:0px solid red}
.contWrap .btn_cancel a{width:255px;height:56px;display:block;background:#1276f2 url(../image/btn_corner.png) no-repeat right top;font-size:20px;color:#fff;letter-spacing:-1px;line-height:56px;text-align:center;margin:0 auto;}
.contWrap .btn_cancel a:hover{background:#2687ff url(../image/btn_corner.png) no-repeat right top;}




.contWrap .tb_thbg{ background-color::#099}

table.gradeList th{font-size:13px;color:#fff;font-weight:normal;letter-spacing:-1px;text-align:center;height:36px;background:#9badba;padding:0;}
table.oxNote th{font-size:13px;color:#fff;font-weight:normal;letter-spacing:-1px;text-align:center;height:36px;background:#9badba;padding:0;}



.joinWrap .login_auto{ text-align:right}
.joinWrap .login_auto .input{border:0;border-bottom:1px solid #fff;font-size:14px;width:20px;height:20px;}

.contWrap .btn_login{margin-top:0px;text-align:center;}
.contWrap .btn_login a{width:255px;height:56px;display:block;background:#1276f2 url(../image/btn_corner.png) no-repeat right top;font-size:20px;color:#fff;letter-spacing:-1px;line-height:56px;text-align:center;margin:0 auto;}
.contWrap .btn_login a:hover{background:#2687ff url(../image/btn_corner.png) no-repeat right top;}


/* 단어장 탭 분리 */
#tabBox>.vmenu{position:relative;top:0;height:46px;background:linear-gradient(to bottom, #f1f1f1, #d9d9d9);overflow:hidden;cursor:pointer;background-color:#eee;float:left;width:33.33%;}
#tabBox>.vmenu#theme{left:0;width:50%;}
#tabBox>.vmenu#cast{left:50%;width:50%;}
#tabBox .vmenu>a{height:40px;font-size:14px;color:#4d4e4e;font-weight:normal;letter-spacing:-1px;margin:5px;display:block;text-align:center;line-height:35px;}
#tabBox .vmenu.on a{border:1px solid #dadada;background:#fff;font-size:14px;color:#0c77e4;line-height:34px;-webkit-box-shadow: 0 2px 3px #c1c1c1;-moz-box-shadow: 0 2px 3px #c1c1c1;box-shadow: 0 2px 3px #c1c1c1;}
#tabBox>.sbmain1{position:absolute;top:47px;left:0;display:none;width:100%;}
#tabBox>.sbmain1.on{display:block;}
#div_voca li{border-bottom:1px solid #ececec;}

/* 추가 스타일 */
.qBold { font-weight:600; }
.qItalic { font-style: italic;}


/* for jQuery Mobile */
.ui-loader-default h1 {
	font-size: 0;
	width: 0;
	height: 0;
	overflow: hidden;
}


/* loading */
@keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
  }
}

@-moz-keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
  }
}

@-webkit-keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
  }
}

@-o-keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
  }
}

@keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
  }
}

@-moz-keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
  }
}

@-webkit-keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
  }
}

@-o-keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
  }
}

@keyframes loading-text-opacity {
  0% {
    opacity: 0
  }
  20% {
    opacity: 0
  }
  50% {
    opacity: 1
  }
  100% {
    opacity: 0
  }
}

@-moz-keyframes loading-text-opacity {
  0% {
    opacity: 0
  }
  20% {
    opacity: 0
  }
  50% {
    opacity: 1
  }
  100% {
    opacity: 0
  }
}

@-webkit-keyframes loading-text-opacity {
  0% {
    opacity: 0
  }
  20% {
    opacity: 0
  }
  50% {
    opacity: 1
  }
  100% {
    opacity: 0
  }
}

@-o-keyframes loading-text-opacity {
  0% {
    opacity: 0
  }
  20% {
    opacity: 0
  }
  50% {
    opacity: 1
  }
  100% {
    opacity: 0
  }
}

.loading-container,
.loading {
  height: 100px;
  position: relative;
  width: 100px;
  border-radius: 100%;
}

.loading-container {
  margin: 40px auto
}

.loading {
  border: 2px solid transparent;
  border-color: transparent #fff transparent #FFF;
  -moz-animation: rotate-loading 1.5s linear 0s infinite normal;
  -moz-transform-origin: 50% 50%;
  -o-animation: rotate-loading 1.5s linear 0s infinite normal;
  -o-transform-origin: 50% 50%;
  -webkit-animation: rotate-loading 1.5s linear 0s infinite normal;
  -webkit-transform-origin: 50% 50%;
  animation: rotate-loading 1.5s linear 0s infinite normal;
  transform-origin: 50% 50%;
}

.loading-container:hover .loading {
  border-color: transparent #E45635 transparent #E45635;
}

.loading-container:hover .loading,
.loading-container .loading {
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}

#loading-text {
  -moz-animation: loading-text-opacity 2s linear 0s infinite normal;
  -o-animation: loading-text-opacity 2s linear 0s infinite normal;
  -webkit-animation: loading-text-opacity 2s linear 0s infinite normal;
  animation: loading-text-opacity 2s linear 0s infinite normal;
  color: #ffffff;
  font-family: "Helvetica Neue, "Helvetica", ""arial";
  font-size: 10px;
  font-weight: bold;
  margin-top: 45px;
  opacity: 0;
  position: absolute;
  text-align: center;
  text-transform: uppercase;
  top: 0;
  width: 100px;
}