@charset "utf-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.8/dist/web/variable/pretendardvariable.css");

/* Reset */
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,img { margin:0; padding:0; }
html {margin:0 auto;width:100%; height:100%; }
body,code { font:1em 'Pretendard Variable', '맑은 고딕', sans-serif; color:#1c1c1c; -webkit-text-size-adjust:none; }
  html:lang(ja) body, html:lang(ja) code { font-family:Meiryo,"メイリオ","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",sans-serif; }
  html:lang(vi) body, html:lang(vi) code { font-family:"Helvetica Neue",Helvetica,Arial,sans-serif }
  html:lang(en) body, html:lang(en) code { font-family:"Helvetica Neue",Helvetica,Arial,sans-serif }
body { margin:0 auto;width:100%; height:100%; }
li { list-style:none; }
img,fieldset { border:0; vertical-align:top; }
table {width:100%; border:0; border-spacing:0; border-collapse:collapse; }
table img { vertical-align:middle; }
caption { display:none; }
th,td { border:0; word-wrap:break-word; }
input,select,textarea { font-size:16px; font-family:'Pretendard Variable', '맑은 고딕', sans-serif; color:#111; vertical-align:middle; resize: none;}
  html:lang(ja) input, html:lang(ja) select, html:lang(ja) textarea, html:lang(ja) button { font-family:Meiryo,"メイリオ","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",sans-serif; }
  html:lang(vi) input, html:lang(vi) select, html:lang(vi) textarea, html:lang(vi) button { font-family:"Helvetica Neue",Helvetica,Arial,sans-serif }
  html:lang(en) input, html:lang(en) select, html:lang(en) textarea, html:lang(en) button { font-family:"Helvetica Neue",Helvetica,Arial,sans-serif }
legend { visibility:hidden; position:absolute; left:-9999px; top:-9999px; width:0; height:0; line-height:0; }
button { overflow:visible; padding:0; margin:0; border:0; cursor:pointer; background-color:transparent; border:1px solid #babec2;}
hr.layout { display:none; }
a { text-decoration:none; color:#1c1c1c; }
a:hover { text-decoration:underline; }
input[type="text"],input[type="password"]{border: 1px solid #D6D6D6;border-radius: 5px;height:40px;padding:0 10px; line-height:40px;}
select{border: 1px solid #D6D6D6;border-radius: 5px;height:40px;padding:0 10px; line-height:40px;}
:-ms-input-placeholder { color:#999; }
u{text-decoration:none; border-bottom: 1px solid;padding-bottom: 3px;}

/* login */
#loginV{width:90%;max-width:400px;margin:80px auto;text-align:center;}
#loginV .subt{color: #002F84;font-size:18px;margin-top:10px;}
#loginV ul{margin-top:80px;}
#loginV ul>li{text-align:left;padding:10px 0;}  
#loginV ul>li>p{font-size:16px;color: #2E3646;margin-bottom:5px;}
#loginV ul>li>input{width:95%;height:50px;padding:0 10px;}
#loginV ul>li>input[type="button"]{width:100%;border-radius: 5px;background: #002F84;color:#fff;border: 1px solid #002F84;}

/* container */
#container{position:relative;margin:0 auto;width:100%;background:#fff;}

/* header */
#header{position:relative;width:100%;max-width:1000px;height:140px;margin:0 auto;background: #FFFFFF;}
#header .user{width:100%;height:60px;background: #F3F3F3;border-top: 1px solid #D6D6D6;border-bottom: 1px solid #D6D6D6;display:flex;}
#header .vmem{color: #838383;font-size:16px;text-align:left;padding-left:50px;line-height:60px;width:50%;background:url('/assets/images/view/user-6-line.svg') 5% center no-repeat;}
@media (min-width: 851px) {
#header .menu{width:100%;height:80px;text-align:left;}
#header .menu>h1{padding-top:25px;padding-left:27px;}
#header .menu > ul {position:absolute;top:15px;right:20px;}
#header .menu > ul > li{display:inline-block;zoom:1;/* *display:inline */;color:#fff; padding:10px 20px;line-height:40px;}
#header .menu > ul > li a, a:link, a:visited, a:active, a:focus{text-decoration:none;color: #000000; font-size:20px;}
#header .menu input[type="button"]{background: #F2F1F6 0% 0% no-repeat padding-box;border: 1px solid #D6D6D6;border-radius: 5px;height:32px;padding:0px 20px;line-height:30px;margin-bottom:10px;}
#header .vtime{color: #079DDE;font-size:16px;text-align:right;padding-right:30px;line-height:60px;width:50%;background:url('/assets/images/view/time-line.svg') 75% center no-repeat;}
}
@media (max-width: 850px) {
#header .menu{width:100%;height:80px;text-align:left;}
#header .menu>h1{padding-top:25px;}
#header .menu>h1>img{height:40px;}
#header .menu > ul {position:absolute;top:15px;right:0px;}
#header .menu > ul > li{display:inline-block;zoom:1;/* *display:inline */;color:#fff; padding:10px 10px;line-height:40px;}
#header .menu > ul > li a, a:link, a:visited, a:active, a:focus{text-decoration:none;color: #000000; font-size:16px;}
#header .menu input[type="button"]{background: #F2F1F6 0% 0% no-repeat padding-box;border: 1px solid #D6D6D6;border-radius: 5px;height:32px;padding:0px 10px;line-height:30px;margin-bottom:10px;}
#header .vtime{color: #079DDE;font-size:16px;text-align:right;padding-right:30px;line-height:60px;width:50%;background:url('/assets/images/view/time-line.svg') 60% center no-repeat;}
}

/* bottom */
#container .bottomv{margin-top:50px;width:100%;height: 100px;background: #2E2E2E;}
#container .bottomv>p{text-align:center;line-height:100px;color: #838383;font-size:14px;}

/* content */
#content{position:relative;margin:0 auto;width:100%;max-width:1000px;}

#content>h2{width:100%;text-align:center;margin:50px auto;}
#content .main{position:relative;text-align:center;padding-bottom:50px;}
#content .main>li{padding:30px;position:relative;display:inline-block;zoom:1;/* *display:inline */;width:27%;max-width:186px;margin:2%;border-radius: 30px 60px;box-shadow: 6px 6px 6px #00000029;height: 256px;overflow: hidden;}
#content .main .ico{height:100px;position:absolute; top:30px;right:30px; }
#content .main>li:nth-child(1){background:#0040F4;}
#content .main>li:nth-child(2){background:#295AFF;}
#content .main>li:nth-child(3){background:#5A54FE;}
#content .main>li:nth-child(4){background:#276EFE;}
#content .main>li:nth-child(5){background:#BBEAFF;text-align:center;padding:30px 5px;max-width:236px;}
#content .main>li:nth-child(6){background:#5F66FF;}
#content .main>li:nth-child(7){background:#519CFD;}
#content .main>li:nth-child(8){background:#5A7BFE;}
#content .main>li:nth-child(9){background:#BBEAFF;text-align:center;padding:30px 5px;max-width:236px;}
#content .main .bgimg{margin:30px auto 0px;}
#content .main .ptit{color:#FFFFFF;font-size:32px;font-weight:bold;text-align:left;margin-top:80px;}
#content .main p{margin-top:20px;color:#FFFFFF;font-size:16px;line-height:26px;text-align:left;}
#content .main .ttxt{color:#5994AE;text-align:center;font-size:20px;margin:18px 0 5px;}
#content .main .midtit{margin-top:5px;color:#357895;text-align:center;font-size:36px;font-weight:bold;}
#content .main .bbtn{width:44px;height:44px;background:url('/assets/images/view/arrow-right-down-line.svg') center center no-repeat;background-color:#002f84;border-radius: 22px;position:absolute; bottom:30px;right:30px; }

#content>h1{margin:70px auto 0;width:135px;text-align: center;color: #002F84;font-size:20px;padding:0 30px;background: #DFF7FF;border-radius: 30px;height: 44px;line-height: 44px;}
#content>h3{margin:20px auto;width:100%;text-align: center;color: #000;font-size:32px;}
#content>p{width:100%;text-align: center;color: #838383;font-size:20px;}
#content .toppoint{width:100%;text-align:center;margin:30px auto 0;border: 1px solid #D6D6D6;}
#content .toppoint th{font-size:16px;color:#000;background: #F3F3F3;line-height:59px;}
#content .toppoint td{font-size:20px;color:#000;line-height:60px;}
@media (min-width: 851px) {
#content .tinfo{margin-top:10px;text-align: left;color: #000;font-size:32px;}
#content .tinfo>li{padding:5px 0 5px 16%;background:url('/assets/images/view/chat-check-line.svg') 12% center no-repeat;}
}
@media (max-width: 850px) {
#content .tinfo{margin-top:10px;text-align: left;color: #000;font-size:24px;}
#content .tinfo>li{padding:5px 0 5px 6%;background:url('/assets/images/view/chat-check-line.svg') 2% center no-repeat;}
}

#content .search{margin-top:30px;border-radius: 10px;width:92%;background: #F3F3F3;padding:20px 4%;line-height:50px;}
#content .search>*{margin-right:14px;}
#content .search input[type="button"]{width:100px;background: #002F84;border-radius: 5px;height:40px;padding:0 10px; line-height:40px;text-align: center;color: #fff;font-size:16px;cursor:pointer;}

#content .toppoint2{width:100%;text-align:center;margin:20px auto;border: 1px solid #D6D6D6;}
#content .toppoint2 th{font-size:16px;color:#000;background: #F3F3F3;line-height:39px;}
#content .toppoint2 td{font-size:20px;color:#000;line-height:40px;}

#content .bodypoint{width:100%;text-align:center;margin:10px auto;border: 1px solid #D6D6D6;}
#content .bodypoint tr{border-bottom: 1px solid #D6D6D6;}
#content .bodypoint th{font-size:14px;color:#000;background: #F3F3F3;line-height:18px;padding:5px 0;}
#content .bodypoint td{font-size:14px;color:#000;line-height:16px;padding:10px 5px;}
#content .bodypoint th.left{text-align:left;padding-left:5px;}
#content .bodypoint td.left{text-align:left;}

#content .btnDiv{display:flex;margin-top:70px;}
#content .btnDiv .left{text-align:left;width:40%;}
#content .btnDiv .left input[type="button"]{cursor:pointer; height:36px;border: 1px solid #D6D6D6;border-radius: 5px;font-size:14px;color:#838383;padding:10px 15px;background: #FFFFFF}
#content .btnDiv .right{width:60%;text-align:right;}
#content .btnDiv .right input[type="button"]{cursor:pointer; height:36px;border: 0px;font-size:14px;color:#000;padding:10px 15px 10px 30px;background-color: #FFFFFF;}
#content .btnDiv .right .retestbtn{background:url('/assets/images/view/pencil-lineb.svg') 2% center no-repeat;}
#content .btnDiv .right .delbtn{background:url('/assets/images/view/delete-bin-line.svg') 10% center no-repeat;}
#content .btnDiv .right .printbtn{background:url('/assets/images/view/printer-line.svg') 10% center no-repeat;}

#content .listinfo{margin-top:50px;text-align: left;color: #000;font-size:16px;}
#content .listinfo>span{color: #079DDE;}
#content .testList{position:relative;width:100%;max-width:1000px;margin-top:10px;border-bottom: 1px solid #000000;}
#content .testList.erv{position:relative;max-width:1000px;width:100%;margin-top:10px;border-bottom: 1px solid #fff;}
#content .testList>li{position:relative;width:100%;padding:20px 0;border-top: 1px solid #D6D6D6;}
#content .testList.erv>li{position:relative;width:100%;padding:20px 0;border-top: 1px solid #fff;}
#content .testList>li:first-child{position:relative;width:100%;padding:20px 0;border-top: 1px solid #000000;}
#content .testList.erv>li:first-child{position:relative;width:100%;padding:20px 0;border-top: 1px solid #fff;}
#content .testList .pstep input[type="button"]{padding:6px 15px;background: #DFF7FF;border: 1px solid #DFF7FF;border-radius: 13px;color: #002F84;text-align: center;font-size:12px;margin-right:10px;}
#content .testList .pstep span{font-size:16px;color: #838383;margin-right:10px;}
#content .testList .pstep span>b{color:#002F84;}
#content .testList .ttitle{margin:10px 0;color: #000000;font-size:20px;}
#content .testList .qtitle{font-family:'Wonho-Regular';margin-top:20px;width:94%;max-width:94%;inline-size:94%;overflow-wrap:break-word;padding:18px 3%;border: 1px solid #D6D6D6;border-radius: 5px;text-align: left;color: #000000;font-size:16px;line-height:24px;}
#content .testList .atitle{font-family:'Wonho-Regular';margin-top:20px;width:100%;padding:18px 0;border: 1px solid #D6D6D6;border-radius: 5px;text-align: left;color: #000000;font-size:16px;line-height:24px;}
#content .testList .atitle>table{width:100%;max-width:1000px;}
#content .testList .atitle th{padding:10px 20px;}
#content .testList .atitle td{padding:10px 20px;max-width:800px;color:#838383;}
#content .testList .tarea{position:relative;padding:10px 0;margin-bottom:15px;border-bottom: 1px solid #000000;}
#content .testList .tarea h3{color: #838383;font-size:18px;}
#content .testList .tarea h3 input[type="checkbox"]{width:19px;height:19px;border: 1px solid #D6D6D6;margin-right:7px;}
#content .testList .tarea svg{cursor:pointer; position:absolute; top:15px; right:10px;}
#content .testList .tsub{color: #838383;font-size:16px;}
#content .testList .tresult{color: #838383;font-size:16px;margin-top:10px;}
#content .testList .tresult span{color: #000;font-weight:bold;}
#content .testList .gtestb{cursor:pointer; position:absolute; top:20px; right:20px; width:87px;height:37px;padding-top:50px;color: #fff;font-size:14px;text-align: center;background:url('/assets/images/view/pencil-line.svg') center 30% no-repeat;background-color: #002F84;border-radius: 5px;}
#content .testList .gtestr{cursor:pointer; position:absolute; top:20px; right:20px; width:87px;height:37px;padding-top:50px;color: #fff;font-size:14px;text-align: center;background:url('/assets/images/view/pencil-line.svg') center 30% no-repeat;background-color: #255E34;border-radius: 5px;}
#content .testList .gtestr .vcount{position:absolute; top:-10px; right:5px;width:25px;height:25px;color:#fff;background:#E67474;border-radius: 15px;line-height:24px;}
#content .testList .gtestg{cursor:pointer; position:absolute; top:20px; right:20px; width:87px;height:37px;padding-top:50px;color: #fff;font-size:14px;text-align: center;background:url('/assets/images/view/pencil-line.svg') center 30% no-repeat;background-color: #E67474;border-radius: 5px;}
#content .testList .trView{cursor:pointer; position:absolute; top:20px; right:20px; width:76px;height:116px;text-align:center;}
#content .testList .trView>div{border: 1px solid #D6D6D6;border-radius: 5px;height: 65px;width:100%;line-height:67px;color: #000000;font-weight:bold;font-size:20px;}
#content .testList .trView>div>span{font-size:16px;font-weight:medium;margin-left:3px;line-height:60px;}
#content .testList .trView input[type="button"]{cursor:pointer; width:100%;height:46px;margin-top:10px;text-align:center;background:url('/assets/images/view/chart_line.svg') center center no-repeat;background-size:33px 30px;background-color: #002F84;border-radius: 5px;border: 1px solid #002F84;color:#fff;}

#content .testList.erv .testtop{padding:10px 20px;display:flex;}
#content .testList.erv .testtop>div{width:50%;}
#content .testList.erv .testtop>div:first-child{font-size:20px;font-weight:bold;}
#content .testList.erv .testtop>div:last-child{font-size:16px;text-align:right;}
#content .testList.erv .testtop>div:last-child span{color: #838383;}
#content .testList.erv .testline{width:97%;margin:10px auto;border-bottom: 1px solid #000000;}
#content .testList.erv .testlineb{width:97%;margin:10px auto;border-bottom: 1px solid #D6D6D6;}
#content .testList.erv .tarea2{padding:10px 20px;max-width:94%;inline-size:94%;overflow-wrap:break-word;}

#content .vmore{cursor:pointer; margin:50px auto;padding-left:20px;width: 186px;height: 49px;border: 1px solid #D6D6D6;border-radius: 5px;font-size:16px;color: #000000;line-height:49px;background:url('/assets/images/view/arrow-down-s-line.svg') 85% center no-repeat;}
#content .golist{text-align:center;cursor:pointer; margin:50px auto;width: 150px;height: 49px;border: 1px solid #D6D6D6;border-radius: 5px;font-size:16px;color: #000000;line-height:49px;}
.testlineb{width:97%;margin:10px auto;border-bottom: 1px solid #D6D6D6;}
/* test content */

/* Rcontent */
#Rcontent{padding:0 50px;position:relative;width:80%;vertical-align:top;}
#Rcontent h1{font-size:32px;margin-top:50px;}

#Rcontent .sVcontent{margin-top:20px;padding:20px;background: #FFFFFF 0% 0% no-repeat padding-box;border-radius: 10px;}
#Rcontent .sVcontent h3{font-size:26px;}

#Rcontent .board_list {
	width:100%;	
	margin-top:20px;
	text-align:center;
	border-collapse:collapse;
}
#Rcontent .board_list tr {
	border-bottom:1px solid #D6D6D6;
}
#Rcontent .board_list thead th {
	height:30px;
	padding:5px;
	white-space:nowrap;	
	vertical-align:middle;
	font-size:16px;
	color:#000;
	background:#fff;
	border-bottom:2px solid #000; 
}
#Rcontent .board_list tbody td {
	padding:5px;
	line-height:30px;
	vertical-align:middle;
	color:#000;
}
#Rcontent .board_list tbody td.left {
	text-align:left;
	padding:0px 5px;
	line-height:30px;
	vertical-align:middle;
	color:#000;
}
#Rcontent .board_list tbody tr:nth-child(even){background:#F2F1F6;}
#Rcontent .board_list tbody tr:nth-child(odd){background:#fff;}
#Rcontent .board_list>tbody>tr>td>a, .board_list>tbody>tr>td>a:link, .board_list>tbody>tr>td>a:visited, .board_list>tbody>tr>td>a:active, .board_list>tbody>tr>td>a:focus{color:#1c1c1c;}
#Rcontent .board_list>tbody>tr>td>ul>li{text-align:left;margin:5px 0;width:150px;display:inline-block;zoom:1;/* *display:inline; */}
#Rcontent .board_list>tbody>tr>td>h2{margin:10px;}
#Rcontent .board_list>tbody>tr>td>ul>li>input{margin-top:5px;}
#Rcontent .board_list>tbody>tr>td>input[type="button"]{margin:15px 10px;width:70px;height:40px;}

/* command button */
.cmdBtn {margin-top:20px;padding:20px 30px;background: #FFFFFF 0% 0% no-repeat padding-box;border-radius: 10px;overflow:hidden;}
.cmdBtn>div.cmdCenter {width:98%;text-align:left;margin-bottom:20px;}
.cmdBtn>div.cmdCenter h4{font-size:18px;margin-top:10px;line-height:32px;}
.cmdBtn>div.cmdRight {margin-left:0.8%;float:left; width:32%;text-align:right;}
.cmdBtn>div.cmdLeft {margin-left:0px;float:left; width:66%;text-align:left;}
.cmdBtn select{background: #F2F1F6 0% 0% no-repeat padding-box;border: 1px solid #D6D6D6;border-radius: 5px;height:32px;padding-left:10px;}
.cmdBtn input[type="text"]{background: #F2F1F6 0% 0% no-repeat padding-box;border: 1px solid #D6D6D6;border-radius: 5px;height:30px;padding-left:10px;}
.cmdBtn input[type="button"]{height:32px;padding:0px 20px;line-height:30px;border: 1px solid var(--unnamed-color-d6d6d6);background: #002F84 0% 0% no-repeat padding-box;border: 1px solid #D6D6D6;border-radius: 5px;color:#fff;}

/*paging*/
.paging{padding:10px 0px 20px 0px; text-align:center;width:100%;}
.paging a{display:inline-block; /* *display: inline; *zoom:1 */; width:25px; height:25px; line-height: 25px; vertical-align:middle; background:#fff;  border:1px solid #909090; text-decoration:none; color: #909090;}
.paging .btn_arr{text-decoration:none; border:0px}
.paging .btn_arr, .paging a{margin:0 3px; padding-top:0;}
.paging .on{ color:#fff; font-weight:normal; background:#909090;  border:1px solid #909090;  }
.paging .paging_pd {padding:0px 8px}
.paging a img {vertical-align: middle; width: 27px; position: relative; top:-1px;}

/*footer*/
.footer { clear: both;  height: 15px; padding: 15px; font-size: 11px; font-weight: bold;  letter-spacing: 0px; color: #2e2f34;border-top: 1px solid #d4d4d4; background: white;}
.footer p { display: block; width: 1170px; margin: 0 auto; text-align: center}

/* popup */
.PopupLayer {display:none; position:fixed; _position:absolute; top:0; left:0; width:100%; height:100%; z-index:10;}
.PopupLayer h3 {text-align:left;height:30px;padding-top:5px;text-indent:10px;width:100%;font-size:16px; color:#000;border-bottom: 1px solid #000;}
.PopupLayer .bg {position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.5; filter:alpha(opacity=50);}
.PopupLayer .pop-layer {display:block;}
.pop-layer {display:none; position: absolute; top: 50%; left: 50%; width: 600px; height:auto;  background-color:#fff; border: 1px solid #666; z-index: 10;border-radius: 10px;padding:20px;}  
.pop-layer p.ctxt {color: #666; line-height: 25px;}
.pop-layer .btn-r {width: 100%; margin:10px 0 20px; padding-top: 10px; border-top: 1px solid #DDD; text-align:right;}
.PopupLayer .pop-layer2 {display:block;}
.pop-layer2 {display:none; position: absolute; top: 50%; left: 50%; width: 900px; height:auto;  background-color:#fff; border: 5px solid #666; z-index: 10;}  
.pop-layer2 .pop-container {padding: 10px 20px;}
.pop-layer2 p.ctxt {color: #666; line-height: 25px;}
.pop-layer2 .btn-r {width: 100%; margin:10px 0 20px; padding-top: 10px; border-top: 1px solid #DDD; text-align:right;}
.pop-layer2 p{margin-top:15px;text-align:center;}
a.cbtn {position:absolute; top:20px; right:20px;} 
a.cbtn:hover {background-color:#fff; color:#fff;}

/* form style */
.form_ldata{ 
	margin-top:15px;
	border-collapse:collapse;
	width:100%;
}
.form_ldata li {padding-left:5px;text-align:left;}
.form_ldata li {font-size:15px;color:#000;padding:10px 0;line-height:20px;}
.form_ldata li p {text-align:left;padding:5px 0;}
.form_ldata #tinfo{border: 1px solid #D6D6D6;border-radius: 5px;padding:10px;}
.form_ldata li  input[type="button"]{padding:6px 15px;background: #DFF7FF;border: 1px solid #DFF7FF;border-radius: 13px;color: #002F84;text-align: center;font-size:12px;margin-right:10px;}
.form_ldata li>div{width:20%;display:inline-block;zoom:1;/* *display:inline */;}
.form_ldata li>div>*{text-align:center;}
.form_ldata li>div>p{margin-top:5px;line-height:30px;}
.btnDiv{text-align:center; margin-top:20px;} 
.btnDivw{text-align:center; margin-top:20px;} 
.btnDivw input[type="button"]{width:100px;background: #002F84;border-radius: 5px;height:40px;padding:0 10px; line-height:40px;text-align: center;color: #fff;font-size:16px;cursor:pointer;}

.tbg {display:none;position:absolute; top:-40px; left:0; width:100%; height:100%; background:#fff; opacity:.9; filter:alpha(opacity=90);text-align:center;font-size:30px;color:#000;z-index: 990;}
.tbg>p{position: absolute; left: 0; width: 100%; text-align:center; height:auto; color:#000; z-index: 991;border-radius: 10px;padding:20px;}  

.modal .btn{cursor: pointer;border: 1px solid #999999;text-align: center;border-radius: 5px;outline: none;font-weight: 500;}
.dimLayer{display: block;width: 100%;background-color: rgba(0, 0, 0, 0.3);position: fixed;left: 0;top: 0px;margin: 0;padding: 0;z-index: 9998;}
.modal{width: 600px;height: 252px;border-radius: 10px;padding: 80px 24px;box-sizing: border-box;text-align: center;}
.modal-section{background: #ffffff;box-sizing: border-box;display: none;position: fixed;top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-o-transform: translate(-50%, -50%);transform: translate(-50%, -50%);display: none;z-index: 9999;}
.menu_msg{font-size: 18px;font-weight: 500;}
.enroll_box p{padding-bottom: 56px;}
.gray_btn {width: 90px;background: #ffffff;color: #999999;height: 36px;line-height: 36px;transition: 0.5s;font-size: 17px;}
.pink_btn {width: 90px;background: #ed197a;color: #fff;height: 36px;line-height: 36px;transition: 0.5s;font-size: 17px;border: none;}

.img-resize-wrapper{display:none;}


.player {width: 400px;}
.controls {display: flex;justify-content: space-between;margin-top: 10px;}
.progress-container {position: relative; width:260px;height: 10px; background: #ccc;}
.progress { position: absolute; height: 100%; width: 0; background: #3498db;}
.time-display { font-size: 14px; text-align: right; margin-top: 5px;}
.playback-rate{ margin-top: 5px;}