@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

body {font-family:'Pretendard-Regular';}
.card {box-shadow:none; background:none; border-radius:0;}
.card-secondary:not(.card-outline)>.card-header {background:none; padding:0; border:0px; border-radius:0;}

.card-title {width:100%; display:block; position:relative; height:57px; line-height:57px; letter-spacing:0; border-radius:57px; background:#E3F1FE; border:1px solid #4eaaff; overflow:hidden; color:#1C5bcf; font-size:24px; font-weight:600; padding-left:68px; letter-spacing:0;}
.card-title:before {content:''; position:absolute; left:5px; top:5px; width:47px; height:47px; background:#FFF url(../img/title_logo.png) no-repeat 50% 50%; border-radius:50%;}
.card-title:after {content:''; position:absolute; right:22px; top:50%; transform:translate(0, -50%); width:78px; height:36px; background:url(../img/title_logo_right_b.png) no-repeat 50% 50%;}
.card-title em {font-weight:200; font-size:18px; margin-left:15px;}

.sidebar-dark-primary .nav-sidebar>.nav-item>.nav-link.active, .sidebar-light-primary .nav-sidebar>.nav-item>.nav-link.active {background:#1C5bcf; color:#FFF;}
.nav-sidebar .nav-link p strong {color:#667ba8!important; font-weight: 500!important;}
[class*=sidebar-dark-] .nav-treeview>.nav-item>.nav-link.active, [class*=sidebar-dark-] .nav-treeview>.nav-item>.nav-link.active:focus, [class*=sidebar-dark-] .nav-treeview>.nav-item>.nav-link.active:hover {background:#f8b500; color:#FFF!important;}

/* renew */
.nav-item a {display:flex; justify-content:flex-start; align-items:center; gap:12px; font-family: 'Pretendard-Regular';}
.nav-item a p {font-size:18px !important;}

.nav-treeview>.nav-item>.nav-link {padding:0;}
.nav-sidebar>.nav-item>.nav-link.active p {color:#ffff44;}
/* .nav-sidebar>.nav-item>.nav-link p.color {color:#ffff44;} */
.nav-treeview>.nav-item>.nav-link .subMenu {padding:4px 20px 4px 48px; position:relative; font-size:16px !important;}
.nav-treeview>.nav-item>.nav-link .subMenu:after {content:''; position:absolute; left:24px; top:10px; width:6px; height:6px; border-radius:50%; background:rgba(255, 255, 255, 1.0);}

.mico {display:inline-block; width:20px; height:20px;}
.mico.m01 {background:url(../img/mico01.png) no-repeat 50% 50%; background-size:100%;}
.mico.m02 {background:url(../img/mico02.png) no-repeat 50% 50%; background-size:100%;}
.mico.m03 {background:url(../img/mico03.png) no-repeat 50% 50%; background-size:100%;}
.mico.m04 {background:url(../img/mico04.png) no-repeat 50% 50%; background-size:100%;}
.mico.m05 {background:url(../img/mico05.png) no-repeat 50% 50%; background-size:100%;}
.mico.m06 {background:url(../img/mico06.png) no-repeat 50% 50%; background-size:100%;}
.mico.m07 {background:url(../img/mico07.png) no-repeat 50% 50%; background-size:100%;}
.mico.m08 {background:url(../img/mico08.png) no-repeat 50% 50%; background-size:100%;}
.mico.m09 {background:url(../img/mico09.png) no-repeat 50% 50%; background-size:100%;}
.mico.m10 {background:url(../img/mico10.png) no-repeat 50% 50%; background-size:100%;}
.mico.m11 {background:url(../img/mico11.png) no-repeat 50% 50%; background-size:100%;}

.nav-sidebar .menu-is-opening>.nav-link i.right, .nav-sidebar .menu-open>.nav-link i.right {transform:rotate(90deg);}
.nav-sidebar .nav-link>.right, .nav-sidebar .nav-link>p>.right {right:1.0rem !important;}

.btn-primary {background:#f8b500; border:1px solid #f8b500;}
.btn-primary:hover {background:#f88000; border:1px solid #f88000;}

.bookList {display:block; height:auto; overflow:hidden;}
.perBookBox {display:flex; justify-content:flex-start; align-items:stretch; gap:20px; flex-wrap:wrap; background:#FFF; border:1px solid #ccc; margin-bottom:30px; padding:30px; border-radius:20px; transition:.8s all;}
.perBookBox:hover {background:#e5fffc; border:1px solid #00ac97;}
.perBookBox .thumb {display:block; width:28%; text-align:center;}
.perBookBox .thumb img {height:200px;}
.perBookBox .bookInfo {width:30%;}
.perBookBox .bookInfo .perItem {display:block; color:#111; font-size:16px; margin-bottom:10px; font-weight:600;}
.perBookBox .bookInfo .perItem .item {position:relative; padding-left:18px; color:#333; font-weight:400;}
.perBookBox .bookInfo .perItem .item:after {content:''; position:absolute; left:5px; top:8px; width:4px; height:4px; background:#111; border-radius:50%;}
.perBookBox .bookInfo .perItem.full {font-size:20px; line-height:1.4; font-weight:700; margin-bottom:15px;}
.perBookBox .bookInfo .perItem.full .item {display:block; margin-bottom:0px; padding-left:0; font-size:14px; font-weight:400;}
.perBookBox .bookInfo .perItem.full .item:after {display:none;}
.perBookBox .bookBtns {width:calc((100% - 58%) - 40px);}
.perBookBox .bookBtns .perBtns {display:flex; justify-content:flex-start; align-items:stretch; gap:10px; margin:10px 0; flex-wrap:wrap;}
.perBookBox .bookBtns .perBtns button {display:flex; justify-content:flex-start; align-items:center; color:#FFF; border-radius:8px; border:0; font-size:18px; font-weight:500; padding:10px 20px; gap:10px; letter-spacing:0; transition:.4s all;}
.perBookBox .bookBtns .perBtns button.bookBtn {background:#00ac97;}
.perBookBox .bookBtns .perBtns button.bookBtn:hover {background:#009381;}
.perBookBox .bookBtns .perBtns button.bookBtn.quiz {background:#f8b500;}
.perBookBox .bookBtns .perBtns button.bookBtn.quiz:hover {background:#df9000;}
.perBookBox .bookBtns .perBtns button.word:before {content:''; width:20px; height:20px; background:url(../img/bico_word.png) no-repeat 50% 50%; background-size:100%;}
.perBookBox .bookBtns .perBtns button.mean:before {content:''; width:20px; height:20px; background:url(../img/bico_mean.png) no-repeat 50% 50%; background-size:100%;}
.perBookBox .bookBtns .perBtns button.spell:before {content:''; width:20px; height:20px; background:url(../img/bico_spell.png) no-repeat 50% 50%; background-size:100%;}
.perBookBox .bookBtns .perBtns button.book:before {content:''; width:20px; height:20px; background:url(../img/bico_bquiz.png) no-repeat 50% 50%; background-size:100%;}
.perBookBox .bookBtns .perBtns button.voca:before {content:''; width:20px; height:20px; background:url(../img/bico_voca.png) no-repeat 50% 50%; background-size:100%;}
.perBookBox .bookBtns .perBtns button.library:before {content:''; width:20px; height:20px; background:url(../img/bico_library.png) no-repeat 50% 50%; background-size:100%;}
.perBookBox .bookBtns .perBtns button.aloud:before {content:''; width:20px; height:20px; background:url(../img/bico_aloud.png) no-repeat 50% 50%; background-size:100%;}

.perBookBox .bookBtns .perBtns button.bookBtn.quiz.library {background:#d72121;}
.perBookBox .bookBtns .perBtns button.bookBtn.quiz.library:hover {background:#af1515;}
.perBookBox .bookBtns .perBtns button.bookBtn.quiz.library.dis {background:#999;}
.perBookBox .bookBtns .perBtns button.bookBtn.quiz.library.dis:hover {background:#666;}

.perBookBox .bookBtns .perBtns button.bookBtn.aloud {background:#239edb;}
.perBookBox .bookBtns .perBtns button.bookBtn.aloud:hover {background:#097db7;}


/*renew 25-03-31*/
.main-sidebar {background:#E3F1FE!important}
.nav-sidebar .nav-link p {color: #003f87; font-weight: 800!important;}
.nav-sidebar .nav-link:hover p {color: #fff!important;}
.nav-sidebar .nav-link:focus p {color: #fff!important;}
.sidebar .user-panel .info {color: #000!important;}
[class*=sidebar-dark-] .sidebar a {color: #000!important;}
.nav-treeview>.nav-item>.nav-link .subMenu {font-weight: 500!important; color: #667ba8!important;}
.nav-treeview>.nav-item>.nav-link p.subMenu.active {font-weight: 800!important; color: #fff!important;}
label:not(.form-check-label):not(.custom-file-label) {font-weight: 700;color: #003470 !important;}
[class*=sidebar-dark] .user-panel {border-bottom: 1px solid #c6c6c6!important;}
[class*=sidebar-dark-] .nav-sidebar>.nav-item.menu-open>.nav-link, [class*=sidebar-dark-] .nav-sidebar>.nav-item:hover>.nav-link, [class*=sidebar-dark-] .nav-sidebar>.nav-item>.nav-link:focus {
    background-color: #1C5bcf;
    color: #fff!important;
}
[class*=sidebar-dark-] .nav-sidebar>.nav-item>.nav-link{}
.nav-item> a > p > font{color:#e83528!important; }
/* renew */

/* rexi 250707 */
.rexiPreview {display:block; margin-top:60px;}
.rexiPreview:after {display:none;}
.rxCont {display:flex; justify-content:flex-start; align-items:flex-start; gap:40px; margin-top:40px;}
.rxCont:after {display:none;}
.rxCont .rcTitle {display:inline-flex; justify-content:flex-start; align-items:center; gap:10px; color:#222; font-size:16px; margin-bottom:24px;}
.rxCont .rcTitle span {padding:6px 18px; border-radius:100px; color:#FFF; font-size:16px; font-weight:500;}
.rxCont .rcTitle span.purple {background:#6f3190;}
.rxCont .rcTitle span.orange {background:#f26a2d;}
.rxCont .rxVod {display:block; width:44%;}
.rxCont .rxVod:after {display:none;}
.rxCont .rxVod .vodSec {position:relative; border-radius:8px; overflow:hidden;}
.rxCont .rxVod .vodSec .vodGuide {position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(111, 49, 144, 0.7); display:flex; justify-content:center; align-items:center; color:#FFF; font-size:24px; font-weight:600; line-height:1.3; text-align:center; z-index:10;}
.rxCont .rxVod .vodSec:after {content:''; display:block; height:auto; padding-bottom:56.25%;}
.rxCont .rxVod .vodSec video {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%;}
.rxCont .rxAudio {display:block; width:calc(56% - 40px);}
.rxCont .rxAudio:after {display:none;}
.rxCont .rxAudio .audList {display:flex; justify-content:flex-start; align-items:stretch;}
.rxCont .rxAudio .audList .perAud {width:16.66667%; padding:16px; text-align:center; border-radius:8px; background:transparent; opacity:0.5; transition:.4s all; cursor:pointer;}
.rxCont .rxAudio .audList .perAud img {width:100%;}
.rxCont .rxAudio .audList .perAud p {color:#222; font-size:16px; font-weight:500; margin-top:10px;}
.rxCont .rxAudio .audList .perAud.on {opacity:1.0; background:#ffe56a;}
.rxCont .rxAudio .audList .perAud:hover {background:#ddd;}

.rxCont .rxAudio .audCate {display:flex; justify-content:flex-start; align-items:flex-start; gap:20px; margin-top:24px;}
.rxCont .rxAudio .audCate:after {display:none;}
.rxCont .rxAudio .audCate .cateList {width:40%; display:flex; justify-content:flex-start; align-items:stretch; gap:4px; flex-wrap:wrap;}
.rxCont .rxAudio .audCate .cateList .perCate {width:calc(25% - 3px); background:#eee;  border-radius:4px;}
.rxCont .rxAudio .audCate .cateList .perCate a {display:block; padding:12px 10px; text-align:center; font-size:14px; color:#999; font-weight:500;}
.rxCont .rxAudio .audCate .cateList .perCate.on {background:#f26a2d;}
.rxCont .rxAudio .audCate .cateList .perCate.on a {color:#FFF;}
.rxCont .rxAudio .audCate .audioPlay {position:relative; width:calc(60% - 20px);}
.rxCont .rxAudio .audCate .audioPlay .audBox {display:flex; justify-content:flex-start; align-items:stretch; margin-bottom:20px;}
.rxCont .rxAudio .audCate .audioPlay .audBox a.perAudio {display:block; width:20%; text-align:center; padding:0 3px; opacity:0.4; transition:.4s all;}
.rxCont .rxAudio .audCate .audioPlay .audBox a.perAudio .ico {display:block; margin:0 auto 8px; width:66px; height:66px; background:url(/main/_img/rico_audio.png) no-repeat 50% 50%; background-size:34px; border-radius:50%; border:6px solid #000; opacity:0.4;}
.rxCont .rxAudio .audCate .audioPlay .audBox a.perAudio .txt {font-size:16px; font-weight:500; color:#666; opacity:1;}
.rxCont .rxAudio .audCate .audioPlay .audBox a.perAudio.on {opacity:1.0;}
.rxCont .rxAudio .audCate .audioPlay .audBox a.perAudio.on .ico {background:url(/main/_img/rico_audio_on.png) no-repeat 50% 50%; background-size:34px; border:6px solid #f26a2d; opacity:1.0;}
.rxCont .rxAudio .audCate .audioPlay .audBox a.perAudio.on .txt {color:#f26a2d; opacity:1.0;}

.rxCont .rxAudio .audCate .audioPlay .playMp3 {display:flex; justify-content:flex-start; align-items:stretch; gap:10px;}
.rxCont .rxAudio .audCate .audioPlay .playMp3:after {display:none;}
.rxCont .rxAudio .audCate .audioPlay .playMp3 .playVod {width:36%; display:flex; justify-content:center; align-items:center; background:#FFF; color:#6f3190; font-size:16px; font-weight:600; border:1px solid #6f3190; border-radius:100px;}
.rxCont .rxAudio .audCate .audioPlay .playMp3 .playVod:before {content:''; width:25px; height:100%; background:url(/main/_img/rico_play.png) no-repeat 50% 50%; background-size:14px auto;}
.rxCont .rxAudio .audCate .audioPlay .playMp3 .playVod p {margin:0;}
.rxCont .rxAudio .audCate .audioPlay .playMp3 .mp3Sec {width:calc(64% - 10px);}
.rxCont .rxAudio .audCate .audioPlay .playMp3 .mp3Sec audio {width:100%;}
.rxCont .rxAudio .audCate .audioPlay .playMp3 .mp3Sec .sampleMp3 {display:none;}
.rxCont .rxAudio .audCate .audioPlay .playMp3 .mp3Sec .sampleMp3.active {display:block !important;}

.rexiBtns {display:flex; justify-content:center; align-items:center; gap:20px; margin-top:80px;}
.rexiBtns a {display:block; padding:25px 0; background:#aad273; border-radius:8px; width:200px;}
.rexiBtns a .ico {display:block; width:50px; height:50px; margin:0 auto 10px;}
.rexiBtns a .ico img {width:100%;}
.rexiBtns a .txt {color:#FFF; font-size:18px; font-weight:500; line-height:1.2; text-align:center;}

@media only screen and (max-width:1280px) {
	.rxCont {flex-direction:column;}
	.rxCont .rxVod {width:100%;}
	.rxCont .rxAudio {width:100%;}
}

@media only screen and (max-width:768px) {
	.card-title:after {display:none;}
	.card-title {font-size:18px;}

	.perBookBox {flex-direction:column; padding:20px; border-radius:8px;}
	.perBookBox .thumb {width:100%;}
	.perBookBox .bookInfo {width:100%;}
	.perBookBox .bookBtns {width:100%;}
	.perBookBox .bookBtns .perBtns {flex-wrap:wrap; align-items:flex-start; gap:5px;}
	.perBookBox .bookBtns .perBtns button {padding:6px 16px; font-size:16px;}
	.perBookBox .bookBtns .perBtns button.word:before {width:16px; height:16px;}

	/* Rexi */
	.rxTitle {font-size:20px;}
	.rxDesc {font-size:18px;}
	.rexiService {padding:30px 20px;}
	.rexiService .srvList {gap:16px 0; margin:20px 0 40px;}
	.rexiService .srvList .perSrv {width:50%;}
	.rexiService .srvList .perSrv .txt {margin-top:16px;}
	.rexiService .srvList .perSrv .thumb .icoDown {width:30px; height:30px; right:-6px; background-size:14px;}
	.rexiBnr {width:100%; border-radius:16px; justify-content:center; align-items:center; flex-direction:column; font-size:18px; padding:16px 30px; margin-bottom:40px; text-align:center;}
	.rexiBnr a {padding:8px 0; width:100%; font-size:16px; margin-top:10px; text-align:center;}

	.rexiService .guideCont {gap:30px 12px; align-items:stretch;}
	.rexiService .guideCont:after {display:none;}
	.rexiService .guideCont .perGuide {width:calc(50% - 6px);}
	.rexiService .guideCont .perGuide .guideNum {font-size:14px; text-align:center; white-space:nowrap;}
	.rexiService .guideCont .perGuide .conBox {padding:30px 20px 20px; font-size:16px; height:100%;}
	.rxDesc {font-size:15px;}

	.rexiService {margin-top:40px; border-radius:12px;}
	.rexiService .srvList.rsSet {padding:20px 0; gap:40px 0px;}
	.rexiService .srvList.rsSet:after {display:none;}
	.rexiService .srvList .perSrv {padding :0 5px;}
	.rexiService .srvList.rsSet .perSrv .thumb img {border-radius:8px;}
	.rexiService .srvList.rsSet .perSrv .thumb .ico {padding:8px 0px; width:80px;}
	.rexiService .srvList.rsSet .perSrv .thumb .ico img {width:20px;}

	.seedImg {flex-direction:column; gap:16px;}
	.seedImg .sdImg01 {width:100%;}
	.seedImg .sdImg02 {width:100%;}
	.seedImg .sdImg02 .maTop {margin-top:16px;}

	.rexiPreview {margin-top:40px;}
	.rxCont .rxAudio .audList .perAud {padding:8px; text-align:center;}
	.rxCont .rxAudio .audList .perAud p {font-size:14px; margin-top:5px;}
	.rxCont .rxAudio .audList .perAud img {width:32px;}

	.rxCont .rxAudio .audCate {flex-direction:column; gap:20px;}
	.rxCont .rxAudio .audCate .cateList {width:100%;}
	.rxCont .rxAudio .audCate .cateList:after {display:none;}
	.rxCont .rxAudio .audCate .audioPlay {width:100%;}
	.rxCont .rxAudio .audCate .audioPlay:after {display:none;}
	.rxCont .rxAudio .audCate .cateList .perCate a {padding:6px;}
	.rxCont .rxAudio .audCate .audioPlay .audBox a.perAudio .ico {width:100%; height:auto; margin:0 auto 6px; position:relative;}
	.rxCont .rxAudio .audCate .audioPlay .audBox a.perAudio .ico:after {content:''; display:block; height:auto; padding-bottom:100%;}
	.rxCont .rxAudio .audCate .audioPlay .audBox a.perAudio .txt {font-size:14px;}
	.rexiBtns {margin-top:30px; flex-direction:column; gap:5px;}
	.rexiBtns a {width:100%; display:flex; justify-content:center; align-items:center; padding:16px 20px; gap:16px;}
	.rexiBtns a .txt {text-align:left; font-size:18px; font-weight:600;}
	.rexiBtns a .txt br {display:none;}
	.rexiBtns a .ico {margin:0; width:30px; height:30px;}
}