@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap");
@import url('https://fonts.googleapis.com/css2?family=Lemon&display=swap');

@font-face {
    font-family: 'Cafe24Ssurround';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/Cafe24Ssurround.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

* {
    font-family: "Noto Sans KR", sans-serif !important;
    box-sizing: border-box;
    letter-spacing: -0.5px;
}

.buycancel {
    background-color: #ff3a3a;
    padding: 6px 10px;
    color: #fff;
    margin-top: 5px;
    border-radius: 4px;
    font-size: 14px;
    transition: 0.2s;
}

.buycancel:hover {
    background-color: #ff1e1e;
}

.hot {
    width: 28px;
    margin-bottom: -2px;
}

.pb80 {
    padding-bottom: 80px;
}

.first-li a.active {
    color: #4A6CF7;
}

.comingsoon-p {
    font-size: 34px;
    font-weight: 600;
    margin-bottom: 20px;
}

.comingsoon-img {
    width: 40%;
}

/* 諛섏쓳�삎硫붾돱 */
.respone-leftbutton {
    position: fixed;
    left: 20px;
    bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px !important;
    font-size: 21px;
    font-weight: 500;
    padding-right: 18px !important;
    z-index: 20;
}

.responeOffcan {
    background-color: #212529;
    border: none !important;
    max-width: 280px;
    box-shadow: 4px 0px 12px rgb(0 0 0 / 10%);
}

.responeOffcan .offcanvas-body {
    padding-left: 10px;
    padding-right: 10px;
}

.offcanvas-header {
    border-bottom: 1px solid #6b6b6b !important;
}

.responeOffcan .offcanvas-title {
    font-size: 22px;
    font-weight: 500;
    color: #fff;
}

.responeOffcan .accordion-item {
    margin-top: 9px;
    background-color: transparent !important;
    border: none !important;
}

.responeOffcan .accordion-button {
    font-weight: 400;
    color: #fff !important;
    padding: 10px;
    background-color: transparent !important;
    line-height: 24px;
    border: none !important;
    box-shadow: none !important;
}

.responeOffcan .acbut-after {
    padding: 10px !important;
    font-weight: 400 !important;
    border-radius: 5px;
}

.responeOffcan .accordion-button::after {
    background: url("/assets/images/sidemenu-arrow.png") !important;
    width: 18px;
    height: 11px;
}

.responeOffcan .accordion-header:hover {
    background-color: #0d6efd;
    border-radius: 6px;
}

/* �뫖�꽣 */
.w1175 {
    max-width: 1175px;
    margin: 0 auto;
}

.footerbox {
    margin-top: 100px;
    border-top: 1px solid #131415;
}

.bottom-sns {
    display: flex;
    margin-bottom: 20px;
}

.bottom-sns li {
    margin-right: 8px;
}

.footer-flex {
    padding: 60px 0;
    display: flex;
    justify-content: space-between;
}

.footer-addressul li {
    font-size: 18px;
    color: #565656;
    margin-top: 10px;
}

.footer-addressul li:nth-child(1) {
    margin-top: 0;
}

.footer-num {
    font-size: 24px;
    font-weight: 600;
}

.footer-info02 ul li {
    font-size: 14px;
}

.footer-phonetime {
    font-size: 16px;
    color: #a0a0b6;
    margin-top: 10px;
}

/* �씠�슜�빟愿� */
.white-box {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    box-shadow: 8px 8px 9px rgb(0 0 0 / 6%);
    padding: 30px 15px;
}

/* �씠�슜�빟愿� */
.use-p {
    text-align: center;
    font-weight: 500;
    word-break: keep-all;
    line-height: 22px;
    font-size: 15px;
}

.usebigbox {
    margin-top: 20px;
    border-top: 1px solid #e0e0e0;
    padding-top: 20px;
}

.use-overbox {
    font-size: 14px;
    line-height: 22px;
    word-break: keep-all;
}

.use-title {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 10px;
}

.usecheckbox {
    margin-top: 10px;
    display: flex;
    justify-content: end;
}

.usecheckbox label {
    font-size: 15px;
}

.usecheckbox .mlcheck {
    margin-left: 8px;
}

.use-allagree {
    display: flex;
    justify-content: end;
    border-top: 1px solid #e0e0e0;
    margin-top: 20px;
    padding-top: 20px;
}

/* 濡쒓렇�씤 */
.loginbox {
    margin-top: 80px;
}

.loginbox-content-p {
    font-size: 30px;
    font-weight: 600;
    line-height: 38px;
    margin-bottom: 30px;
}

.loginbox-content {
    width: 390px;
    margin: 0 auto;
    margin-top: 30px;
}

.loginbox-content ul {
    display: flex;
}

.loginbox-content ul li {
    width: 50%;
}

.loginbox-content ul li a {
    width: 100%;
    display: inline-block;
    text-align: center;
    font-size: 16px;
    height: 50px;
    line-height: 50px;
}

.loginbox-content ul li a.signup-a {
    background-color: #F7F7F7;
    color: #7A7A7A;
}

.loginbox-content .login-input {
    width: 100%;
    height: 50px;
    padding-left: 20px;
    border-radius: 10px;
    border: 1px solid #dee2e6;
}

.login-input-pass {
    letter-spacing: 6px;
}

.login-input-pass::placeholder {
    letter-spacing: 0px;
}

.loginbox-content .login-input:focus {
    outline: 1px solid #78b2ff;
}

.loginbox-content .loginbutton {
    width: 100%;
    height: 50px;
    border-radius: 10px;
    background-color: #4A6CF7;
    color: #fff;
    font-size: 15px;
    margin-top: 8px;
    transition: background 0.2s linear;
}

.loginbox-content .loginbutton:hover {
    background-color: #3059fa;
}

.loginbox-content .signbutton {
    width: 100%;
    height: 50px;
    border-radius: 10px;
    background-color: #1E1E1E;
    color: #fff;
    font-size: 15px;
    margin-top: 8px;
}

.login-slide {
    width: 390px;
    height: 140px;
    margin: 0 auto;
    margin-top: 30px;
}

.login-slide .carousel-item {
    width: 100%;
    height: 140px;
    background-color: #f4f4f4;
    border-radius: 20px;
}

.login-slide .carousel-indicators [data-bs-target] {
    background-color: rgb(122, 122, 122);
    border-radius: 50%;
    width: 8px;
    height: 8px;
}

.login-slide .carousel-indicators {
    bottom: -46px;
}

.login-slide .carousel-indicators .active {
    background-color: #3059fa !important;
}

.link-login-button {
    width: 100%;
    height: 52px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #131415;
}

.link-login-button p {
    font-weight: 500;
    margin-left: 10px;
}

.log-kakaobut {
    background-color: #FFE600;
}

.log-naverbut {
    background-color: #06be34;
    color: #fff;
    margin-top: 8px;
}

.log-googlebut {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    margin-top: 8px;
    margin-bottom: 30px;
}

.log-usherbut {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    margin-top: 15px;
}

.login-arrowtext {
    position: relative;
    background-color: #131415;
    padding: 12px 0px;
    border-radius: 50px;
    color: #fff;
    width: 220px;
    margin-right: 6px;
    margin: 0 auto;
    text-align: center;
}

.login-arrowtext::after {
    content: "";
    display: block;
    position: absolute;
    width: 18px;
    height: 15px;
    bottom: -9px;
    left: 50%;
    transform: translateX(-50%);
    background: url("/assets/images/poly.png");
}

/* �쉶�썝媛��엯 */
.signupbox {
    width: 500px;
    margin: 0 auto;
    margin-bottom: 80px;
}

.signupbox-p {
    text-align: center;
    font-size: 30px;
    font-weight: 600;
    line-height: 38px;
    margin-bottom: 30px;
}

.signupbox-content-ulbox {
    background-color: #f4f4f4;
    border-radius: 10px;
    padding: 20px;
}

.signupbox-content-ulbox li {
    font-size: 13px;
    margin-top: 8px;
    line-height: 18px;
}

.signupbox-content-ulbox li:nth-child(1) {
    margin-top: 0;
}

.signupbox-content {
    border: 1px solid #e0e0e0;
    padding: 30px;
    border-radius: 20px;
    padding: 30px;
}

.mypage-input {
    width: 100%;
    border: none;
    border-bottom: 1px solid #dee2e6;
    margin-top: 20px;
    padding-left: 10px;
    padding-bottom: 10px;
    border-radius: 0 !important;
}

.mypage-input::placeholder {
    font-size: 16px;
    font-weight: 300;
    color: #B5B5B5;
    font-family: 'Noto Sans KR', sans-serif !important;
}

.agreebox {
    border: 1px solid #dee2e6;
    border-radius: 6px;
    margin-top: 20px;
}

.agreebox-all {
    background-color: #f7f7f7;
    padding: 14px 20px;
}

.agreespan {
    color: #303030;
}

.morespan {
    font-size: 14px;
    text-decoration: underline;
    color: #bcbcbc;
}

.signinbut {
    width: 185px;
    height: 52px;
    border-radius: 4px;
    background-color: #DE1A32;
    color: #fff;
    font-family: 'Noto Sans KR', sans-serif !important;
    font-size: 16px;
    font-weight: 500;
}

.signinbut02 {
    width: 100%;
    height: 52px;
    border-radius: 10px;
    background-color: #4A6CF7;
    color: #fff;
    font-family: 'Noto Sans KR', sans-serif !important;
    font-size: 16px;
    font-weight: 500;
    margin-top: 20px;
    transition: background 0.2s linear;
}

.signinbut02:hover {
    background-color: #345cfc;
}

.signup-input-alert {
    font-size: 12px;
    line-height: 18px;
    color: #DE1A32;
    margin-top: 5px;
}

.signup-certifybutbox {
    display: flex;
    align-items: center;
}

.signup-certifybutbox button {
    height: 40px;
    background-color: #dee2e6;
    padding: 0 15px;
    border-radius: 4px;
    color: #fff;
    font-family: 'Noto Sans KR', sans-serif !important;
}

.seradio {
    opacity: 0;
}

.seradiobox {
    padding-left: 0;
}

.seradiobox label {
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    width: 100%;
    font-size: 14px;
    padding: 16px 0;
    text-align: center;
    justify-content: center;
    cursor: pointer;
}

.seradiobox input[type="radio"]:checked+label {
    background-color: #090E34;
    border: none;
    color: #fff;
}

.signupbox-content select {
    border: none;
    border-bottom: 1px solid #dee2e6;
    font-size: 16px;
    font-weight: 400;
    color: #2c2c2c;
    font-family: 'Noto Sans KR', sans-serif !important;
    padding: 8px;
    margin-top: 13px;
}

.signupbox-content select:focus {
    outline: none;
    border: none;
}

.sign-mt {
    margin-top: 40px;
}

.cash-title {
    display: flex;
    justify-content: space-between;
}

.cash-box {
    display: flex;
}

.cash-box01 {
    margin-right: 15px;
}

.cash-numbox {
    display: flex;
    margin-top: 20px;
}

/* �궗�씠�뱶硫붾돱 */

.sub-menu {
    display: none;
}

.sub-btn-little-title {
    color: #1d1d1d !important;
    font-weight: 500 !important;
    margin-top: 20px;
}

.sub-item {
    display: block;
    width: 100%;
    text-align: left;
    font-size: 16px !important;
    line-height: 24px !important;
    font-weight: 500 !important;
    margin-top: 0 !important;
}

.sub-item span {
    color: #005EEB;
}

.dongdown {
    position: absolute;
    right: 0px;
    transition: 0.3s ease;
}

.rotate {
    transform: rotate(90deg);
}

.side-scroll {
    height: 82%;
    overflow-y: scroll;
}

.sidenav {
    height: 100%;
    /* 100% Full-height */
    width: 226px;
    /* 0 width - change this with JavaScript */
    position: fixed;
    /* Stay in place */
    z-index: 1;
    /* Stay on top */
    left: 0px;
    background-color: #fff;
    /* Black*/
    overflow-x: hidden;
    /* Disable horizontal scroll */
    transition: 0.3s;
    /* 0.5 second transition effect to slide in the sidenav */
    box-shadow: 4px 0px 12px rgb(0 0 0 / 10%);
}

.sidenav::-webkit-scrollbar {
    display: none;
}

.sidenav .form-check .form-check-input {
    float: right;
}

.sidenav .form-check {
    padding-left: 0;
}

.mainmenu {
    padding: 20px 20px 20px 15px;
    border-bottom: 1px solid #e0e0e0;
}

.mainmenu a.sub-btn.mainmenuOn {
    position: relative;
    font-weight: 600;
    color: #090E34;
    display: flex;
    align-items: center;
    width: 100%;
    height: 30px;
    cursor: pointer;
}

.mainmenu a.sub-btn:hover {
    color: #5060DB;
}

.sub-btn-co2 {
    color: #5060DB !important;
}

.mainmenu .form-check label {
    color: #6C6C6C;
    font-size: 15px;
}

.mainmenu .form-check-input {
    border: none;
    background-color: #EDEDED;
}

.mainmenu .form-check-input:checked {
    background-color: #4A6CF7;
}

.mainmenu .sub-menu {
    margin-top: 20px;
}

.mainmenu .sub-menu .item {
    margin-top: 10px;
}

.mainmenu .sub-menu .item:nth-child(1) {
    margin-top: 0;
}

.sidenav .form-check {
    margin-bottom: 3px;
}

.mainmenu .sub-menu .form-check:last-child {
    margin-bottom: 0;
}

.sidenav .scroll-bar-css::-webkit-scrollbar-track {
    background-color: #ECF0FF !important;
    border-radius: 10px;
}

.sub-btn-little-title:hover {
    color: #005EEB !important;
}

/* 諛뷀�硫붾돱 */
.mobile-bottommenu {
    width: 100%;
    height: 70px;
    background-color: #fff;
    position: fixed;
    bottom: 0;
    border-top-left-radius: 9px;
    border-top-right-radius: 9px;
    border-top: 1px solid #f1f1f1;
    padding-top: 6px;
}

.mobile-bottommenu ul {
    display: flex;
    justify-content: center;
}

.mobile-bottommenu ul li {
    width: 20%;
    text-align: center;
}

.mobile-bottommenu ul li button p {
    color: #5f5f5f;
    font-size: 0.7rem;
    margin-top: 5px;
    font-weight: 500;
}

/* -- */
.w100 {
    width: 100%;
}

.visi {
    visibility: hidden;
}

.w25 {
    width: 25% !important;
}

.max1422 {
    max-width: 1422px;
    margin: 0 auto;
}

.nav-num {
    padding: 60px 0;
}

.scroll-bar-css::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.scroll-bar-css::-webkit-scrollbar-thumb {
    background-color: #787EFF;
    border-radius: 10px;
}

.scroll-bar-css::-webkit-scrollbar-track {
    background-color: #E7E7E7;
    border-radius: 10px;
}

.nav-num ul li a {
    display: block;
    width: 40px;
    height: 40px;
    font-size: 16px;
    border-radius: 50px;
    font-weight: 500;
    margin: 0 10px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: auto 1.6rem;
    border-radius: 50%;
    box-sizing: border-box;
    text-align: center;
    line-height: 39px;
}


.nav-num-active {
    background-color: #4A6CF7;
    color: #fff;
}

.backbg {
    background-color: #F6F7FB;
}

.backbg-white {
    background-color: #fff;
}

#main-header {
    position: sticky;
    top: 0;
    z-index: 10;
}

.nav-action {
    display: none;
}

/* �룿 �뿤�뱶 */
.header-phone {
    background-color: #ECEFF1;
    height: 50px;
    line-height: 50px;
}

.header-phone-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-phone-inner p {
    font-size: 15px;
    font-weight: 600;
    color: #111c2e;
}

/* 硫붿씤 �뿤�뜑 */
.header-menu {
    background-color: #fff;
    height: 75px;
    border-bottom: 1px solid #CECFD6;
}

.header-menu>div {
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.login-but {
    background-color: #090E34;
    color: #fff;
    border-radius: 50px;
    font-size: 14px;
    padding: 12px 15px;
}

.header-menu-left {
    display: flex;
    align-items: center;
}

/* 硫붿씤 �뱶濡��떎�슫 硫붾돱 */
nav.dropmenu {
    display: flex;
    margin-left: 100px;
}

.dropmenu ul {
    list-style: none;
    /* ul�쓽 �븯�쐞�뿉 �냽�븯�뒗 �쟾泥� �냽�꽦�뿉 list-style�뾾�쓬*/
    display: flex;
    /* flex �꽑�뼵*/
    border-radius: 5px;
    /* 蹂대뜑瑜� �뫁湲�寃�*/
    background-color: #fff;
    border: 1px solid #dee2e6;
}

.dropmenu>ul {
    border: none;
    padding: 0;
}

.dropmenu a {
    color: #36384D;
    /* 而щ윭*/
    text-decoration: none;
    /* a�깭洹몄쓽 諛묒쨪 �궘�젣*/
    display: block;
    /* 釉붾윮�삎�쑝濡� 蹂�寃�*/
    font-size: 18px;
    font-weight: 500;
}

.dropmenu li {
    width: 180px;
    /* �꼻�씠 吏��젙*/
}

.dropmenu li.first-li {
    height: 45px;
    width: 140px !important;
}

.dropmenu li.first-li:last-child {
    margin-right: 0;
}

.dropmenu ul ul {
    display: none;
    /* .dropmenu�쓽 ul �븯�쐞�쓽 ul�쓣 �닲源�泥섎━*/
}

.dropmenu ul li:hover ul {
    /* 留덉슦�뒪瑜� ul �븯�쐞 li�쐞�뿉 �삱由대븣 li �븯�쐞ul �쓣 異쒕젰*/
    display: block;
    /* �뵒�뒪�뵆�젅�씠 異쒕젰�릺�룄濡� �꽕�젙*/
    position: absolute;
    /* ul�쓽 �쐞移섎�� 遺�紐⑥쓽 �븯�쐞�뿉 �굹�삤�룄濡� 怨좎젙*/
}

.bigul {
    position: relative;
}

.bigul li:hover .sub-ul {
    top: 74px;
    margin-top: 0;
}

.dropmenu ul li.top-action:hover ul {
    top: 74px;
}

.dropmenu ul li:hover li.subdropmenu ul {
    /*異붽� 2�떒 �뱶�엻硫붾돱 援ъ꽦*/
    display: none;
    /*異붽� �뱶�엻硫붾돱 �닲湲곌린*/
}

.dropmenu ul li:hover li.subdropmenu:hover ul {
    display: block;
    /*異붽� �뱶�엻硫붾돱 �솢�꽦�솕*/
    position: absolute;
    /*異붽� �뱶�엻硫붾돱 �쐞移섎�� 遺�紐� 湲곗��쑝濡� 怨좎젙*/
    left: 180px;
    /*異붽� �뱶�엻硫붾돱 �쐞移섎�� �쇊履쎌뿉�꽌 100px留뚰겮 �삷源�(.dropmenu li �뿉�꽌 吏��젙�븳 �꼻�씠媛� 留뚰겮)*/
    top: 4px;
    /*異붽� �뱶�엻硫붾돱 �쐞移섎�� �긽�떒�뿉�꽌 30px留뚰겮 �삷源�(a �뿉�꽌 吏��젙�븳 �넂�씠媛� 留뚰겮)*/
}

.dropmenu ul li:hover li.subdropmenu:hover ul li {
    width: 180px;
    /*異붽� �븯�쐞硫붾돱 �꼻�씠 �닔�젙*/
}

.sub-ul {
    padding: 10px 0;
}

.sub-ul li {
    margin-left: 10px;
}

.sub-ul li a {
    font-size: 15px;
    padding: 8px 0;
    line-height: 20px;
}

.sub-ul li a:hover {
    color: #4A6CF7;
}

.sub-ul ul {
    padding: 10px 0;
}

.dropmenu ul li.subdropmenu:hover li.subdropmenu02 ul {
    /*異붽� 2�떒 �뱶�엻硫붾돱 援ъ꽦*/
    display: none;
    /*異붽� �뱶�엻硫붾돱 �닲湲곌린*/
}

.dropmenu ul li.subdropmenu:hover li.subdropmenu02:hover ul {
    display: block;
    /*異붽� �뱶�엻硫붾돱 �솢�꽦�솕*/
    position: absolute;
    /*異붽� �뱶�엻硫붾돱 �쐞移섎�� 遺�紐� 湲곗��쑝濡� 怨좎젙*/
    left: 180px;
    /*異붽� �뱶�엻硫붾돱 �쐞移섎�� �쇊履쎌뿉�꽌 100px留뚰겮 �삷源�(.dropmenu li �뿉�꽌 吏��젙�븳 �꼻�씠媛� 留뚰겮)*/
    top: 4px;
    /*異붽� �뱶�엻硫붾돱 �쐞移섎�� �긽�떒�뿉�꽌 30px留뚰겮 �삷源�(a �뿉�꽌 吏��젙�븳 �넂�씠媛� 留뚰겮)*/
}

.dropmenu ul li.subdropmenu:hover li.subdropmenu02:hover ul li {
    width: 180px;
    /*異붽� �븯�쐞硫붾돱 �꼻�씠 �닔�젙*/
}

.subdropmenu,
.subdropmenu02 {
    position: relative;
}

.dropmenu li.first-li a:hover {
    color: #4A6CF7;
}



/* ------------------------------product---- */
.product-head {
    width: 100%;
    height: auto;
    text-align: center;
    background: url("/assets/images/product-bg.png") center/cover;
    padding: 60px 0;
}

.product-head-p01 {
    font-size: 44px;
    font-weight: 600;
    color: #fff;
}

.product-head-p02 {
    font-size: 20px;
    color: #D3D3D3;
    margin-top: 30px;
    font-weight: 400;
}

.product-nav button {
    width: 158px;
    height: 50px;
    background-color: #fff;
    border-radius: 50px !important;
    text-align: center;
    color: #444444;
    font-size: 18px;
    font-weight: 500;
}

.product-nav button.active {
    background-color: #4A6CF7 !important;
    color: #fff;
}

.product-nav button:hover {
    color: #4A6CF7;
}

.center-probut {
    margin: 0 10px;
}

.product-head02 {
    margin-top: 50px;
}

.product-content {
    max-width: 1320px;
    margin: 50px auto;
}

.product-sub-title {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 15px;
}

.program-questionbut {
    position: relative;
    background-color: #4A6CF7;
    border-radius: 50px;
    padding: 14px 30px;
    color: #fff;
    font-size: 20px;
    margin-top: 30px;
    transition: 0.2s;
}

.program-questionbut:hover {
    background-color: #2c50dd;
}

.program-questionbut:after {
    position: absolute;
    content: "";
    display: block;
    width: 61px;
    height: 58px;
    right: -32px;
    bottom: -28px;
    background: url("/assets/images/tap_7931935 copy.png");
}

.product-bigbox {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

.product-box {
    position: relative;
    overflow: hidden;
    padding: 40px 30px;
    border-top: 3px solid #FC4AB5;
    width: calc(100%/3 - 20px);
    background-color: #fff;
    box-shadow: 2px 5px 13px rgb(180 189 223 / 40%);
}

.product-box-title {
    font-size: 20px;
    font-weight: 600;
    color: #090E34;
    line-height: 26px;
    text-align: center;
}

.product-box-title span {
    color: #FC4AB5;
}

/* .product-box-price{
    display: flex;
    align-items: end;
    justify-content: end;
    height: 68px;
    text-align: right;
} */
.product-box-price {
    height: 68px;
    text-align: center;
    margin-top: 20px;
}

/* .product-box-price-day{
    font-size: 15px;
    font-weight: 600;
    color: #A1A8BC;
} */
.product-box-price-day {
    font-size: 32px;
    font-weight: 600;
    color: #2c2c2c;
    text-align: center;
    margin-bottom: 20px;
}

.product-box-price-past {
    color: #AFAFAF;
    text-decoration: line-through;
    margin-bottom: 5px;
    font-size: 20px;
}

.mbprice {
    display: flex;
    justify-content: center;
    align-items: baseline;
    margin-right: 20px;
}

.teacher-productbut {
    margin-top: 15px;
    min-height: 90px;
    display: flex;
    align-items: center;
    border-top: 1px solid #e0e0e0;
}

.teacher-productbut:nth-child(1) {
    margin-top: 0;
    border: none;
}

.product-box-price-now {
    font-size: 24px;
    font-weight: 600;
    color: #090E34;
    margin-right: 8px;
    display: flex;
    align-items: center;
}

.product-box-price-now .price-teacher {
    font-size: 16px;
    background-color: #2569c7;
    color: #fff;
    font-weight: 500 !important;
    padding: 6px 10px;
    border-radius: 50px;
    margin-right: 8px;
}

.price-teacher-minjoo {
    background-color: #A863FF !important;
}


.product-box-price-percent {
    font-size: 24px;
    font-weight: 600;
    color: #FC4AB5;
    margin-right: 8px;
}

.product-buy-button {
    width: 120px;
    background-color: #212121;
    color: #fff;
    height: 32px;
    font-size: 16px;
    border-radius: 6px;
}

.product-buy-button:hover {
    background-color: #111111;
}

.product-badge {
    position: absolute;
    right: -67px;
    top: 9px;
    background-color: #FC4AB5;
    padding: 9px;
    color: #fff;
    text-align: center;
    width: 197px;
    transform: rotate(39deg);
    font-family: 'Lemon', cursive !important;
    font-size: 15px;
}

.product-badge02 {
    position: absolute;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    font-size: 14px;
    color: #fc4848;
}

.product-submenu {
    display: flex;
    justify-content: center;
}

.product-submenu-bg {
    display: flex;
    align-items: center;
    background-color: #f3f3f3;
    border-radius: 50px;
}

.product-submenu-bg button {
    color: #6B6E84;
    border-radius: 50px;
    padding: 10px 25px;
    height: 100%;
    font-weight: 500;
    line-height: 20px;
}

.product-submenu-bg button.active {
    background-color: #090E34;
    color: #fff;
}

.teacher-productday {
    margin-top: 15px;
    min-height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #e0e0e0;
}

.teacher-productday:nth-child(1) {
    border: none;
    margin-top: 0;
}

/* 援먯옱�뙋留� */
.product-box-book {
    padding: 30px !important;
    width: calc(100%/2 - 20px) !important;
}

.product-book-p01 {
    font-size: 24px;
    font-weight: 600;
    color: #090E34;
    line-height: 26px;
}

.product-book-p02 {
    font-size: 16px;
    font-weight: 400;
    color: #9b9b9b;
    line-height: 26px;
    margin-top: 5px;
}

.product-book-pbox {
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 10px;
}

.product-book-contentbox {
    display: flex;
    margin-top: 30px;
}

.product-book {
    border: 1px solid #e0e0e0;
    height: 200px;
}

.product-book-contentbox-left {
    margin-right: 50px;
}

.product-book-contentbox-right {
    width: 100%;
}

.bookproduct-mp3 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 85px;
    height: 45px;
    background-color: #f4f4f4;
    border: 1px solid #e0e0e0;
    font-weight: 600;
}

.product-buybookbut {
    display: flex;
}

.product-buybook-button {
    width: 100%;
    background-color: #212121;
    color: #fff;
    height: 40px;
}

.buybook-button-con {
    background-color: #fff !important;
    border: 1px solid #212121;
    color: #212121;
    font-weight: 500;
}

/* -------mypage--- */
.mypageContent {
    max-width: 1422px;
    margin: 0 auto;
    padding: 30px 0px;
}

.mypageContent-title {
    font-size: 22px;
    font-weight: 600;
    color: #090E34;
}

.voca-video-box {
    margin-right: 30px;
}

.voca-video {
    display: flex;
    align-items: center;
    border: 1px solid #dadada;
    border-radius: 6px;
    background-color: #fff;
    padding: 8px 18px;
    margin-right: 5px;
}

.voca-video:hover {
    border: 1px solid #4A6CF7;
}

.voca-video:hover p {
    color: #4A6CF7;
}

.voca-video p {
    font-size: 16px;
    font-weight: 500;
    color: #090E34;
    margin-left: 3px;
}

.mypageContent-day {
    font-size: 16px;
    font-weight: 500;
    color: #131415;
}

.mypageContent-bottom-bg {
    /* background-color: #F6F7FB; */
    padding: 50px 0;
}

.but-book {
    width: 40px;
    margin-bottom: 5px;
}

.voca-nav,
.voca-nav-div {
    display: flex;
    justify-content: center;
}

.voca-nav-div {
    background-color: #4A6CF7;
    border-radius: 50px;
    padding: 8px;
    min-height: 68px;
}

.book-nav-div {
    border-radius: 15px !important;
}

.voca-nav-div button {
    color: #fff;
    height: 100%;
    width: 189px;
    font-size: 20px;
    font-weight: 500;
    border-radius: 50px !important;
}

.book-nav-div button {
    border-radius: 12px !important;
}

.voca-nav-div button:hover {
    color: #fff;
}

.voca-nav-div button.active {
    background-color: #fff !important;
    border-radius: 50px;
    color: #4A6CF7 !important;
}

.voca-bigbox {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 50px;
}

.voca-box {
    width: calc(100%/3 - 10px);
    background-color: #fff;
    box-shadow: 2px 5px 13px rgb(180 189 223 / 40%);
    border-radius: 10px;
    padding: 30px;
}

.voca-box-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.voca-box-title01 {
    font-size: 20px;
    font-weight: 500;
    color: #1d1d1d;
}

.voca-box-titl-day {
    background-color: #393939;
    color: #fff;
    font-size: 15px;
    border-radius: 50px;
    padding: 6px 10px;
}

.voca-box02 {
    margin-top: 40px;
}

.voca-l-p {
    font-size: 16px;
    margin-bottom: 8px;
    display: inline-block;
}

.voca-box02 .progress {
    background-color: #D6E1F2;
    height: 28px;
    border-radius: 50px;
}

.voca-box02 .progress-bar {
    background-color: #4A6CF7;
    border-radius: 50px;
}

.voca-box02-butbox {
    display: flex;
    justify-content: end;
    margin-top: 10px;
}

.voca-box02-butbox button {
    height: 38px;
    padding: 0 20px;
    border-radius: 6px;
    font-size: 14px;
    color: #4e4e4e;
    font-weight: 500;
}

.voca-box02-butbox-start {
    background-color: #fff;
    border: 1px solid #D6E1F2;
    transition: background 0.2s linear;
}

.voca-box02-butbox-start:hover {
    background-color: #f3f3f3;
}

.voca-box02-butbox-see {
    background-color: #FF4F4F;
    margin-left: 5px;
    color: #fff !important;
    transition: background 0.2s linear;
}

.voca-box02-butbox-see:hover {
    background-color: #ff2c2c;
}

.voca-box02-little {
    margin-top: 20px;
}

.anp,
.enp,
.inp {
    position: relative;
}

.anp::after {
    content: "";
    display: block;
    position: absolute;
    right: -27px;
    top: 1px;
    width: 22px;
    height: 16px;
    background: url("/assets/images/anp-icon.png");
}

.enp::after {
    content: "";
    display: block;
    position: absolute;
    right: -23px;
    top: 0px;
    width: 18px;
    height: 18px;
    background: url("/assets/images/exam-icon.png");
}

.inp::after {
    content: "";
    display: block;
    position: absolute;
    right: -20px;
    top: 0px;
    width: 14px;
    height: 18px;
    background: url("/assets/images/inter-icon.png");
}

/* 留덉씠�럹�씠吏� �뒪�뵾�궧 */
.speaking-table {
    display: flex;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    align-items: center;
    width: 100%;
    margin-top: 10px;
}

.speaking-table-head {
    padding: 13px 0;
}

.speaking-table-head p {
    font-weight: 600;
    color: #747474;
}

.speaking-table-body {
    padding: 18px 0;
}

.speaking-table:nth-child(1) {
    margin-top: 0;
}

.speaking-table-p {
    text-align: center;
    padding: 0 5px;
    line-height: 24px;
    font-weight: 400;
}

.speaking-table-01,
.speaking-table-02,
.speaking-table-04,
.speaking-table-08,
.speaking-table-09 {
    width: 5%;
}

.speaking-table-03 {
    width: 8%;
}

.speaking-table-05 {
    width: 40%;
    padding: 0 18px;
    color: #2f3da7;
    font-weight: 500;
}

.speaking-table-05 a {
    color: #2f3da7;
}

.speaking-table-05 a:hover {
    text-decoration: underline;
    text-underline-position: under;
}

.speaking-table-06,
.speaking-table-07,
.speaking-table-10 {
    width: 9%;
}

.speaking-table-green {
    background-color: #ECFFD4;
}

.speaking-table-green .speaking-green-span {
    color: #219E0D;
}

.chum-but {
    display: block;
    width: 74px;
    background-color: #1e1e1e;
    color: #fff;
    font-size: 13px;
    margin: 0 auto;
    border-radius: 50px;
}

/* ------------------------------------- */
.grammar-blueprint-table {
    display: flex;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    align-items: center;
    width: 100%;
    margin-top: 10px;
}

.grammar-blueprint-table-head {
    padding: 13px 0;
}

.grammar-blueprint-table-head p {
    font-weight: 600;
    color: #747474;
    text-align: center;
}

.blueprint-thead-p01 {
    width: 10%;
}

.blueprint-thead-p02 {
    width: 25%;
}

.blueprint-thead-p03,
.blueprint-thead-p04,
.blueprint-thead-p05,
.blueprint-thead-p06 {
    width: 16.25%;
}

/* ---------------------------- */
.grammar-blueprint-body {
    width: 100%;
    margin-top: 10px;
}

.blueprint-body-little {
    border: 1px solid #E0E0E0;
    border-radius: 10px;
}

.grammar-blueprint-body-01 {
    width: 51.25%;
}

.actual-body-01 {
    width: 35% !important;
}

.blue-column01-body {
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    margin-top: 10px;
}

.blue-column01-body:first-child {
    margin-top: 0;
}

.blueprint-body-01-01 {
    width: 19%;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
}

.blueprint-body-01-01 p {
    font-weight: 500;
    color: #131415;
}

.blueprint-body-01-02 {
    width: 50%;
    border-left: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
}

.grammar-body-01-02 {
    width: 81% !important;
    border-right: none;
}

.blueprint-body-01-02 ul li {
    padding: 20px 30px;
    border-bottom: 1px solid #e0e0e0;
}

.blueprint-body-01-02 ul li:last-child {
    border-bottom: none;
}

.blueprint-body-01-02 .progress {
    background-color: #D6E1F2;
    height: 20px;
    border-radius: 50px;
    margin-top: 8px;
}

.blueprint-body-01-02 .progress-bar {
    background-color: #4A6CF7;
    border-radius: 50px;
}

.blueprint-body-01-03 {
    width: 31%;
    text-align: center;
    padding: 20px 0;
}

.blueprint-body-01-03-div {
    justify-content: center;
    align-items: center;
}

.blueprint-body-01-03-div p {
    font-size: 18px;
    margin-right: 5px;
    width: 90px;
}

.blueprint-body-01-03-div p span {
    color: #4A6CF7;
}

.blueprint-body-01-03-div button {
    width: 100px;
    border-radius: 6px;
    background-color: #4A6CF7;
    color: #fff;
    padding: 10px 0;
    font-size: 14px;
    transition: background 0.2s linear;
}

.blueprint-body-01-03-div button:hover {
    background-color: #2e54eb;
}

.grammar-blueprint-body-02,
.grammar-blueprint-body-03 {}

.grammar-blueprint-body-02,
.grammar-blueprint-body-03,
.grammar-blueprint-body-04 {
    width: 15.70%;
    text-align: center;
    padding: 20px;
}

.blue-body01-02-span01 {
    margin-right: 8px;
    line-height: 22px;
}

.blue-jokbut {
    display: flex;
    align-items: center;
    background-color: #d5e8ff;
    width: 100%;
    padding: 0px 12px;
    border-radius: 6px;
    position: relative;
    margin-top: 20px;
    height: 34px;
}

.blue-jokbut:nth-child(1) {
    margin-top: 0;
}

.jok-arrow {
    position: absolute;
    top: 9px;
    right: 10px;
}

.blue-jokbut span {
    font-size: 14px;
    margin-left: 5px;
    font-weight: 500;
}

.jok-progressbut {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0px 12px;
    border: 1.5px solid #5f5f5f;
    border-radius: 6px;
    height: 34px;
    font-size: 14px;
    font-weight: 500;
    margin-top: 20px;
}

.jok-progressbut:nth-child(1) {
    margin-top: 0;
}

.grammar-blueprint-body-03 .jok-progressbut {
    transition: background 0.2s linear;
}

.grammar-blueprint-body-03 .jok-progressbut:hover {
    background-color: #3a3a3a;
    color: #fff;
}

.grammar-blueprint-body-03 .jok-progressbut:hover .iconify {
    color: #fff !important;
}


.grammar-blueprint-body-04 .jok-progressbut {
    border: 1.5px solid #4A6CF7;
    color: #4A6CF7;
    transition: background 0.2s linear;
}

.grammar-blueprint-body-04 .jok-progressbut:hover {
    background-color: #4A6CF7;
    color: #fff;
}

.grammar-blueprint-body-04 .jok-progressbut:hover .iconify {
    color: #fff !important;
}

.grammar-body-02 {
    border: 1px solid #e0e0e0;
    padding: 20px;
    border-radius: 10px;
}

.grammar-body-02,
.grammar-body-03,
.grammar-body-04,
.grammar-body-05 {
    width: 15.6% !important;
}

.actual-thead-p {
    text-align: left !important;
    padding-left: 18px;
}

.grammar-body-02 .blueprint-body-01-03-div {
    margin-top: 30px;
}

.grammar-body-02 .blueprint-body-01-03-div.blueprint-body-01-03-div:first-child {
    margin-top: 0;
}

/* ------------------------------- */
.reading_basic-nav {
    height: 64px;
}

.reading_basic-nav button {
    width: 140px;
}

.reading_basic-table {
    width: 100%;
}

.reading_basic-table thead tr th,
.reading_basic-table tbody tr td {
    text-align: center;
    border: 1px solid #dee2e6;
    padding: 15px 0;
}

.reading_basic-table thead tr th {
    border-color: #494e77;
}

.reading_basic-table thead tr th {
    background-color: #090E34;
    color: #fff;
    font-weight: 500;
}

.reading_basic-table tbody tr td {
    background-color: #fff;
    font-size: 18px;
    font-weight: 500;
    padding: 15px 20px;
    line-height: 24px;
    vertical-align: middle;
}

.rb-fil-span {
    background-color: #ff773c;
    display: inline-block;
    border-radius: 50px;
    padding: 8px 40px;
    margin-right: 10px;
}

.rb-fil-td,
.rb-cho-td {
    padding: 15px 20px !important;
}

.rb-fil-td p {
    background-color: #ff773c;
    border-radius: 50px;
    padding: 8px 0;
    font-weight: 500;
    color: #fff;
}

.rb-cho-td p {
    background-color: #ff4a77;
    border-radius: 50px;
    padding: 8px 0;
    font-weight: 500;
    color: #fff;
}

.rb-cho-span {
    background-color: #ff4a77;
    display: inline-block;
    border-radius: 50px;
    padding: 8px 40px;
}

/* reading-basic �뀒�씠釉� */
.reading-basic-thead-p {
    padding: 13px 0;
    background-color: #fff;
}

.reading-basic-thead-p p {
    text-align: center;
    font-weight: 600;
    color: #747474;
}

.reading-basic-thead-p .blueprint-thead-p01 {
    width: 30%;
}

.reading-basic-thead-p .blueprint-thead-p02 {
    width: 40%;
}

.reading-basic-thead-p .blueprint-thead-p03 {
    width: 30%;
}

.reading-basic-tbody01 {
    width: 100%;
    background-color: #fff;
    border-radius: 10px;
}

.reading-basic-tbody01 .blueprint-body-01-01 {
    width: 30%;
}

.reading-basic-tbody01 .blueprint-body-01-02 {
    width: 40%;
}

.reading-basic-tbody01 .blueprint-body-01-03 {
    width: 30%;
}

.reading-basic-tbody .blueprint-body-01-01 p {
    text-align: left;
    padding: 0 20px;
    line-height: 24px;
}

.reading-body-02 .blueprint-body-01-03-div {
    margin-top: 20px;
}

.reading-body-02 {
    padding: 20px;
}

.reading-body-02 .blueprint-body-01-03-div:first-child {
    margin-top: 0;
}

/* 由щ뵫 �씤�꽣 */
.reading-intermediate-div-content {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
}

.reading-intermediate-div {
    width: calc(100%/3 - 15px);
}

.intermediate-div-pbox {
    background-color: #090E34;
    color: #fff;
    font-weight: 500;
    display: flex;
    justify-content: space-between;
    padding: 10px 20px;
    line-height: 24px;
}

.intermediate-div-pbox>p:nth-child(1) {
    width: 60%;
}

.reading-intermediate-div table thead tr th {
    background-color: #090E34;
    color: #fff;
    font-weight: 500;
    text-align: center;
    border: 1px solid #494e77;
    padding: 15px 0;
}

.reading-intermediate-div table tbody tr {
    background-color: #fff;
}

.reading-intermediate-div table tbody tr td {
    text-align: center;
    border: 1px solid #dee2e6;
    padding: 15px 0;
}

.online_wrbut {
    width: 200px !important;
}

/* WRITING �씤媛� */
.online-wr-thead .blueprint-thead-p03,
.online-wr-thead .blueprint-thead-p04 {
    width: 25% !important;
}

.online-wr-thead .blueprint-thead-p05 {
    width: 20% !important;
}

.online-wr-tbody .blueprint-body-01-03 {
    border-right: 1px solid #e0e0e0;
}

.sp12but {
    line-height: 18px;
    letter-spacing: 0;
}

.online-wr-tbody .blueprint-body-01-02 {
    width: 30% !important;
    border-left: none;
}

.online-wr-tbody .blueprint-body-01-03,
.online-wr-tbody .blueprint-body-01-04 {
    width: 25% !important;
}

.online-wr-tbody .blueprint-body-01-05 {
    width: 20% !important;
    border-left: 1px solid #e0e0e0;
}

/* 紐⑥쓽怨좎궗 */

.article_exam-table {
    width: 100%;
}

.article_exam-table tr th,
.article_exam-table tr td {
    text-align: center;
    border: 1px solid #e0e0e0;
    padding: 15px 10px;
    font-size: 16px;
    letter-spacing: 0px;
}

.article_exam-table tr td {
    vertical-align: middle;
    font-weight: 400;
    line-height: 20px;
    font-size: 14px;
}

.article_exam-table tr td a {
    display: block;
    padding: 8px;
    color: #fff;
    border-radius: 6px;
    background-color: #1e1e1e;
    transition: background 0.2s linear;
}

.article-chum-but {
    background-color: #1e1e1e !important;
    transition: background 0.2s linear;
}

.article-startbut {
    background-color: #4A6CF7 !important;
}

.article-chum-but:hover,
.article-dic-but:hover {
    background-color: #0c0c0c !important;
}

.article_exam-table tr td a.article-startbut:hover {
    background-color: #2e57fa !important;
}

.article_exam-table tr th {
    background-color: #213792;
    color: #fff;
    font-weight: 500;
    border-color: #4e60a7;
}

.fz16 {
    font-size: 16px !important;
}

.article_exam-table tr th img {
    background-color: #fff;
    border-radius: 50px;
    padding: 5px;
}

.article_exam-table tr th>div {
    display: flex;
    align-items: center;
    justify-content: center;
}

.article_exam-table tr th>div span {
    margin-left: 7px;
}

.article_exam-title {
    max-width: 1800px;
}

.circle-wrap {
    overflow: hidden;
    margin: 0px auto 10px;
}

.circular-bar {
    text-align: center;
    position: relative;
}

.circular-bar .circular-bar-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.circular-bar .circular-bar-content strong {
    display: block;
    font-weight: 600;
    font-size: 16px;
    font-size: 1.125rem;
    line-height: 1.5rem;
    line-height: 24px;
}

.circular-bar .circular-bar-content label {
    display: block;
    font-weight: 400;
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 1.25rem;
    line-height: 20px;
}

.circular-bar canvas {
    background-color: #fff;
    border-radius: 50%;
}

.accordion-body-examresult-td-but {
    background-color: #1e1e1e;
    padding: 3px 12px;
    border-radius: 50px;
    color: #fff;
    font-size: 12px;
}

.accordion-body-examresult-td-but:hover {
    background-color: #0f0f0f;
}

.article-result-td {
    color: #4A6CF7 !important;
}

.article-none {
    background-color: #eeeeee;
    color: #5f5f5f;
}

.online-wr-tbody .reading-body-02 {
    padding: 20px 0px 0px 16px !important;
    text-align: left;
}

.online-wr-tbody .reading-body-02 .blueprint-body-01-03-div {
    margin-right: 5px;
}

/* 留덉씠�럹�씠吏� �씤媛� flexdiv */
.display-circle-wrapbox .blueprint-body-01-03-div {
    display: inline-block;
    width: calc(100%/3 - 10px);
}

.article-memor-thead .blueprint-thead-p02,
.article-memor-thead .blueprint-thead-p03,
.article-memor-thead .blueprint-thead-p04,
.article-memor-thead .blueprint-thead-p05 {
    width: 25% !important;
}

/* �븫湲� �떆�뿕 由ъ뒪�듃 */
.article-memobody .blueprint-body-01-01 {
    width: 10%;
    border-right: 1px solid #e0e0e0;
}

.article-memobody .blueprint-body-01-03 {
    border: none;
    width: 90% !important;
    padding: 20px;
}

.article-memobody .display-circle-wrapbox {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
}

.article-memobody .display-circle-wrapbox p {
    width: auto;
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    min-height: 90px;
}

.article-memobody .display-circle-wrapbox .blueprint-body-01-03-div {
    width: calc(100%/7 - 8px);
    background-color: #F6F7FB;
    box-shadow: 2px 5px 6px rgb(180 189 223 / 60%);
    padding: 15px;
    border-radius: 6px;
    margin-top: 0 !important;
}

/* 諛깆��떆�뿕 */
.arti-grammar-head .blueprint-thead-p01 {
    width: 10%;
}

.arti-grammar-head .blueprint-thead-p03 {
    width: 20%;
}

.arti-grammar-head .blueprint-thead-p04,
.arti-grammar-head .blueprint-thead-p05,
.arti-grammar-head .blueprint-thead-p06 {
    width: 24%;
}

.arti-grammar-tbody .grammar-blueprint-body-01 {
    width: 30%;
}

.arti-grammar-tbody .grammar-blueprint-body-02,
.arti-grammar-tbody .grammar-blueprint-body-03,
.arti-grammar-tbody .grammar-blueprint-body-04 {
    width: 23%;
}

.arti-grammar-tbody .blueprint-body-01-01 {
    width: 32%;
}

.arti-grammar-tbody .blueprint-body-01-03 {
    width: 68%;
    border-left: 1px solid #e0e0e0;
}

.arti-grammar-head02 p {
    width: calc(100%/8);
}

.arti-grammar-tbody02 .blueprint-body-01-01 {
    width: 177.5px;
    padding: 20px;
}

.artibdd {
    width: calc(100% - 177.5px);
}

.arti-grammar-tbody02 .blueprint-body-01-02 {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #e0e0e0;
}

.arti-grammar-tbody02 .blueprint-body-01-02:last-child {
    border-bottom: none;
}

.arti-grammar-tbody02 .blueprint-body-01-02>ul>li {
    width: calc(100%/7);
    border-bottom: none;
    text-align: center;
    border-right: 1px solid #e0e0e0;
}

.arti-grammar-tbody02 .blueprint-body-01-02>ul>li:last-child {
    border-right: none;
}

.arti-search {
    position: relative;
    width: 600px;
    display: flex;
    margin-left: 60px;
    height: 42px;
}

.arti-search .form-select {
    width: 140px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    height: 42px;
    background-color: #ECEFF1;
}

.arti-search .form-control {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: none;
    padding-right: 40px;
}

.arti-search .form-control:focus,
.arti-search .form-select:focus {
    outline: none;
    box-shadow: none;
}

.arti-search .form-select:focus {
    border-color: #ECEFF1;
}

.search-icon {
    position: absolute;
    right: 14px;
    top: 10px;
}

.arti-speaking-box-flexbox {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.arti-speaking-box {
    width: calc(100%/4 - 12px);
    background-color: #fff;
    box-shadow: 2px 5px 13px rgb(180 189 223 / 40%);
    border-radius: 10px;
    padding: 30px;
}

.arti-speaking-box .voca-box02-butbox-start {
    width: 100%;
    height: 38px;
    padding: 0 20px;
    border-radius: 6px;
    font-size: 14px;
    color: #4e4e4e;
    font-weight: 500;
    margin-top: 26px;
}

.arti-speaking-box-pbox {
    text-align: center;
    margin-bottom: 50px;
}

.arti-speaking-box-p01 {
    font-size: 36px;
    font-weight: 800;
}

.arti-speaking-box-p02 {
    font-size: 20px;
    font-weight: 400;
    margin-top: 20px;
}

/* �굹�쓽 �떆�뿕寃곌낵 */
.calenderpage-flexbox-left01 {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    margin-top: 20px;
}

.calender-left-top-arrow {
    cursor: pointer;
}

.calenderpage-flexbox-right {
    width: 484px;
    margin-top: 47px;
}

.examresult-page-calender-thead-tr {
    border-bottom: 1px solid #dee2e6;
    text-align: center;
}

.examresult-page-calender-thead-tr th {
    padding: 10px 0;
    font-weight: 500;
    color: #4D4D4D;
}

.examresult-page-calender-tbody tr td {
    height: 166px;
    border-left: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
    padding: 7px;
    font-size: 14px;
    font-weight: 400;
    color: #4d4d4d;
    position: relative;
}

.examresult-page-calender-tbody tr td.select {
    background-color: #DE1B34;
    color: #fff;
}

.examresult-page-calender-tbody tr td.pass-day {
    background-color: #fff4f6;
}

.examresult-page-calender-tbody tr td:nth-child(1) {
    border-left: none;
}

.examresult-page-calender-tbody tr:last-child td {
    border-bottom: none;
}

.examresult-page-calender-tbody .finishbox {
    width: 100%;
    border-radius: 2px;
    background-color: #FFE9E9;
    margin-top: 5px;
    line-height: 24px;
    text-align: center;
    font-weight: 500;
    padding: 2px 0;
}

.examresult-page-calender-tbody .nonefinishbox {
    width: 100%;
    border-radius: 4px;
    background-color: #4A6CF7;
    margin-top: 5px;
    line-height: 24px;
    text-align: center;
    font-weight: 500;
    padding: 2px 0;
    color: #fff;
}


.examresult-page-calender-tbody .finishbox:nth-child(1),
.examresult-page-calender-tbody .nonefinishbox:nth-child(1) {
    margin-top: 20px;
}

.examresult-page-calender-tbody td.select .finishbox,
.examresult-page-calender-tbody td.select .nonefinishbox {
    background-color: #fff;
}

.examresult-page-calender-tbody tr td {
    cursor: pointer;
}

.examresult-page-calender-tbody tr td:hover {
    background-color: #F6F7FB;
}

.result-pracbigbox {
    display: flex;
}

.calenderpage-flexbox-left {
    flex: 1;
    margin-right: 20px;
}

.calenderpage-flexbox-right {
    width: 360px;
    border-radius: 8px;
    background-color: #F6F7FB;
    border: 1px solid #dce0f1;
}

.day-title {
    background-color: #090E34;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    height: 42px;
    line-height: 42px;
    color: #fff;
    text-align: center;
}

.calenderpage-flexbox-right-box {
    padding: 20px;
}

.calenderpage-right-minibox {
    margin-top: 40px;
}

.calenderpage-right-minibox:nth-child(1) {
    margin-top: 0;
}

.calenderpage-right-minibox-title {
    font-size: 18px;
    font-weight: 500;
}

.right-minibox-flexbox {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.calender-circlebox {
    width: calc(100%/2 - 6px);
    background-color: #fff;
    box-shadow: 2px 5px 6px rgb(180 189 223 / 60%);
    padding: 15px;
    border-radius: 6px;
}

.calender-circle-title {
    text-align: center;
    line-height: 24px;
    margin-bottom: 10px;
    font-weight: 500;
}

.right-minibox-flexbox {
    margin-top: 15px;
}

.right-minibox-flexbox button {
    width: 100%;
    height: 38px;
    padding: 0 20px;
    border-radius: 6px;
    font-size: 14px;
    color: #4e4e4e;
    font-weight: 500;
    background-color: #fff;
    border: 1px solid #D6E1F2;
    transition: background 0.2s linear;
}

.right-minibox-flexbox button:hover {
    background-color: #f3f3f3;
}

.circle-time {
    text-align: center;
    font-size: 14px;
    margin: 10px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.circle-time-span {
    margin-left: 2px;
    margin-top: -2px;
}

.calender-circlebox .circle-wrap {
    margin-bottom: 5px;
}

.weektd {
    color: #ff1e3c !important;
}

.weektd02 {
    color: #1e65ff !important;
}

/* 援щℓ�궡�뿭 */
.order-table {
    width: 100%;
}

.order-table tr th,
.order-table tr td {
    border: 1px solid #e0e0e0;
    padding: 15px 0;
    text-align: center;
    vertical-align: middle;
}

.order-table tr th {
    background-color: #090E34;
    color: #fff;
    font-weight: 500;
    border: 1px solid #3f4363;
}

.correct-bg {
    width: 100%;
    height: 180px;
    padding-top: 64px;
    background: url("/assets/images/correction_bg.png");
}

.correct-mainbut {
    width: 180px !important;
}

/* ---------------- */
.write-list-content {
    width: 1422px;
    margin: 0 auto;
    padding-top: 30px;
}

.tagbox {
    position: fixed;
    top: 30%;
    right: 20px;
    width: 210px;
    background-color: #fff;
    height: 45px;
    z-index: 8;
}

.tagbox-tagmo {
    width: 100%;
}

.tagbox .tagboxbut {
    background-color: #4A6CF7;
    color: #fff;
    width: 100%;
    height: 40px;
    transition: background 0.2s linear;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

.tagbox .tagboxbut:hover {
    background-color: #335cff;
}

.goalset-day-tabbox-combox-daybut {
    margin-top: 8px;
}

.goalset-tabbox-combox-but-name {
    color: #005EEB;
    margin-top: -2px;
    margin-left: 5px;
    font-size: 16px;
}

.goalset-tabbox-combox-but .iconify {
    margin-top: -4px;
}

.tagbox-tagmobox {
    background-color: #fff;
    border: 1px solid #4A6CF7;
    padding: 5px 10px 13px 10px;
    height: 140px;
    overflow-y: scroll;
    border-top-right-radius: 6px;
    border-top-left-radius: 6px;
}

.memoir-search {
    width: 600px;
    margin: 0 auto;
    background-color: #4A6CF7;
    margin-top: 40px;
    height: 64px;
    padding: 0 30px;
    border-radius: 50px;
}

.memoir-search select {
    background-color: #4A6CF7;
    border: none;
    color: #fff;
}

.memoir-search select:focus {
    border: none;
    outline: none;
}

.memoir-search .form-control {
    background-color: transparent;
    border: none;
    padding-left: 40px;
}

.memoir-search .form-control {
    color: #fff;
}

.memoir-search .form-control::placeholder {
    color: #C9D3FD;
    font-weight: 400;
}

.memoir-search .search-icon {
    right: 30px;
    top: 20px;
}

.moemoirs-tablebox {
    margin-top: 30px;
}

.moemoirs-table {
    width: 100%;
}

.moemoirs-table tr th {
    background-color: #353535;
    color: #fff;
    font-weight: 500;
    padding: 13px 0;
    text-align: center;
    font-size: 15px;
}

.moemoirs-table tr td {
    background-color: #fff;
    text-align: center;
    padding: 13px 0;
    border-bottom: 1px solid #dee2e6;
}

.moemoirs-table tr td a:hover {
    color: #5060DB;
}

.write-makebut {
    background-color: #090E34;
    border-radius: 50px;
    color: #fff;
    display: flex;
    align-items: center;
    font-size: 14px;
    padding: 10px 15px;
    transition: background 0.2s linear;
}

.write-makebut:hover {
    background-color: #040820;
}

.sugiimg {
    position: fixed;
    right: 30px;
    bottom: 55px;
}

.sugiimg-p {
    font-family: 'Cafe24Ssurround' !important;
    position: absolute;
    top: 14px;
    right: 34px;
}

.sugiimg-p p {
    font-family: 'Cafe24Ssurround' !important;
}

.sugiimg-p-01 {
    font-size: 13px;
    color: #434343;
}

.sugiimg-p-02 {
    font-size: 20px;
    color: #5781FC;
    margin-top: 3px;
}

.alarm-detail-box {
    background-color: #fff;
}

.alarm-detail-title01 {
    font-size: 20px;
    font-weight: 600;
    border-bottom: 3px solid #131415;
    padding-bottom: 14px;
}

.alarm-detail-title02 {
    color: rgb(160, 160, 182);
    font-size: 16px;
    font-weight: 600;
}

.alarm-detail-title03 {
    font-size: 18px;
    font-weight: 600;
    margin-top: 14px;
    line-height: 26px;
    word-break: break-all;
}

.alarm-detail-box-01 {
    padding: 20px;
    border-bottom: 1px solid #dee2e6;
}

.alarm-detail-box-02 {
    padding: 30px 20px;
    border-bottom: 1px solid #a1a1a1;
}

.alarm-detail-content {
    word-break: break-all;
    line-height: 24px;
}

.alarm-detail-daytimebox {
    display: flex;
    justify-content: end;
    margin-top: 40px;
    align-items: center;
}

.alarm-detail-daytime {
    margin-right: 10px;
    font-size: 14px;
    color: rgb(160, 160, 182);
}

.alarm-detail-file {
    margin-top: 8px;
    display: block;
}

.alarm-file li:nth-child(1) .alarm-detail-file {
    margin-top: 0;
}

.alarm-detail-file:hover {
    border-bottom: 1px solid #272727;
}

.alarm-detail-daytime:last-child {
    margin-right: 0;
}

.alarm-detail-nav {
    text-align: center;
    margin-top: 20px;
}

.alarm-detail-nav button {
    width: 230px;
    height: 70px;
    border: 1px solid #dee2e6;
    margin: 0 90px;
    background-color: #fff;
    font-size: 20px;
    transition: background 0.2s linear;
}

.alarm-detail-nav button:hover {
    background-color: #f4f4f4;
}

.memoirs-write-content-m {
    padding-bottom: 80px;
}

.logincomdiv {
    display: flex;
    align-items: center;
}

.logincomdiv-center {
    width: 1px;
    height: 14px;
    background-color: #b9b9b9;
    margin: 0 12px;
}

.logincomdiv-logout {
    font-size: 14px;
    color: #757575;
}

.logincomdiv-logout:hover {
    color: #131415;
}

.logincomdiv-p {
    font-weight: 500;
}

/* �닔媛뺥썑湲� �벑濡� �뤌 */
.write-list-writeform-content {
    max-width: 1422px;
    margin: 0 auto !important;
}

.write-list-writeform-box {
    padding: 30px;
}

.writeformb01 .input-group {
    margin-bottom: 20px;
}


.writeformb01-title {
    margin-bottom: 10px;
    position: relative;
    padding-left: 10px;
}

.writeformb01-title::after {
    content: "";
    position: absolute;
    display: block;
    width: 4px;
    height: 4px;
    background-color: #4A6CF7;
    border-radius: 50px;
    left: 0px;
    top: 2px;
}

.writeformb01 textarea {
    height: 200px;
}

.writebigtitle {
    font-weight: 500;
    font-size: 20px;
    margin-top: 30px;
}

.writemtbox {
    margin-top: 20px;
}

.writeform-toeicscore {
    display: flex;
}

.writeform-toeicscore .input-group {
    margin-bottom: 0;
    margin-right: 10px;
}

.writeform-toeicscore .input-group:last-child {
    margin-right: 0;
}

.writelist-savebutbox {
    display: flex;
    justify-content: center;
}

.writelist-savebutbox button {
    margin: 0;
    border: none;
}

.writelist-savebutbox01 {
    background-color: #383838 !important;
    color: #fff !important;
    margin-right: 10px !important;
}

.writelist-savebutbox02 {
    background-color: #4A6CF7 !important;
    color: #fff !important;
    transition: background 0.2s linear;
}

.writelist-savebutbox02:hover {
    background-color: #3159fa !important;
}

/* �긽�뭹 援щℓ�븯湲� �긽�꽭*/
.porduct-datail-content {
    padding: 80px 20px 120px;
}

.product-detail-bigbox {
    margin-top: 80px;
}

.product-detail-bigbox:nth-child(1) {
    margin-top: 0;
}

.porduct-datail-title {
    font-size: 28px;
    font-weight: 600;
}

.porduct-datail-box {
    background-color: #fff;
    border-top: 2px solid #131415;
    border-bottom: 1px solid #dadada;
    display: flex;
    padding: 0 30px;
    margin-top: 30px;
}

.porduct-datail-info dl {
    width: calc(100%/3);
    display: flex;
    padding: 30px 0;
}

.porduct-datail-info dl dt {
    width: 100px;
}

.porduct-datail-product {
    border-top: 2px solid #131415;
    margin-top: 30px;
}

.porduct-datail-product table {
    width: 100%;
}

.porduct-datail-product table tr th,
.porduct-datail-product table tr td {
    padding: 30px 0;
    text-align: center;
}

.porduct-datail-product table tr td {
    vertical-align: middle;
}

.porduct-datail-product table tr th {
    background-color: #fafafa;
}

.porduct-datail-product table tr {
    border-bottom: 1px solid #dadada;
}

.product-td {
    display: flex;
    justify-content: center;
    align-items: center;
}

.product-td span {
    margin-left: 10px;
    font-size: 18px;
    font-weight: 500;
}

.datail-product-result tr td {
    font-size: 24px;
    font-weight: 600;
}

.datail-product-result tr td span {
    font-size: 20px;
}

.product-result-td {
    color: rgb(255, 86, 71);
}

.product-plustd,
.product-re-td {
    position: relative;
}

.product-plustd::after {
    content: "-";
    position: absolute;
    right: 27px;
    top: 28px;
    font-size: 30px;
    color: #c2c2c2;
}

.product-re-td::after {
    content: "=";
    position: absolute;
    right: -39px;
    top: 30px;
    font-size: 24px;
    color: #c2c2c2;
}

.product-detail-radio input[type="radio"] {
    opacity: 0;
}

.porduct-datail-product-flex {
    display: flex;
    margin-top: 30px;
}

.detail-product-label {
    width: 320px;
    height: auto;
    border: 2px solid #dee2e6;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 20px;
}

.detail-product-label span {
    font-size: 26px;
    font-weight: 500;
    margin-left: 20px;
    color: #9e9e9e;
}

.product-detail-radio input[type="radio"]:checked+label {
    color: #090E34;
    border-color: #090E34;
}

.product-detail-radio input[type="radio"]:checked+label span {
    color: #090E34;
}

.product-ann {
    margin-top: 20px;
    border-radius: 10px;
    padding: 30px;
    background-color: #edefff;
    line-height: 24px;
}

.product-listbox {
    background-color: #f1f1f1;
}

.product-ann-title {
    display: block;
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 15px;
}

.product-ann-span {
    display: inline-block;
    background-color: #090E34;
    color: #fff;
    padding: 10px;
    font-size: 14px;
    margin: 10px 0;
    border-radius: 6px;
}

.product-ann-span-red {
    color: #ff322b;
    font-size: 16px;
    font-weight: 600;
}

.buydiv {
    border-top: 1px solid #dee2e6;
    text-align: center;
    margin-top: 30px;
}

.buydiv button {
    background-color: #090E34;
    font-size: 20px;
    font-weight: 500;
    color: #fff;
    border-radius: 10px;
    padding: 30px 100px;
    margin-top: 30px;
    transition: background 0.2s linear;
}

.buydiv button:hover {
    background-color: #04092b;
}

.eventbuybutobox {
    margin-top: 30px;
    margin-bottom: 40px;
}

.main-reading-baicbuybox {
    background-color: #f0f0f0;
    padding-bottom: 80px;
    text-align: center;
}

.eventbuybutobox-m0 {
    margin: 0 !important;
}

.bookbuybox {
    background-color: #02ACDD;
    margin-top: -10px;
    padding-bottom: 80px;
}

.bookbuybox button {
    background-color: #fff;
    padding: 20px 60px;
    border-radius: 10px;
    font-size: 20px;
    font-weight: 500;
}

.bookbuybox02 {
    margin-left: 10px;
    background-color: #131415 !important;
    color: #fff;
}

/* ��由곌쾬 紐⑤떖 */
.wrong-modal-title {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 10px;
}

.wrong-modal-box {
    margin-top: 20px;
}

.wrong-modal-box p {
    font-size: 14px;
    margin-bottom: 10px;
}


/* ----------------------硫붿씤-------------------- */
.introduce-readingbox {
    border: 1px solid #e0e0e0;
    padding: 40px 60px;
}

.introduce-reading {
    font-size: 24px;
    line-height: 36px;
    text-align: center;
    font-weight: 600;
}

.introduce-reading-warn {
    font-size: 22px;
    line-height: 32px;
    text-align: center;
    color: #ff2323;
    font-weight: 500;
    background-color: #ffe3e3;
    padding: 20px 20px;
    border-radius: 6px;
    margin-top: 40px;
}

.reading-plusbut {
    position: relative;
    width: 400px;
    margin: 30px auto 0;
    padding: 15px 80px;
    font-size: 24px;
    font-weight: 500;
    background-color: #4A6CF7;
    color: #fff;
    border-radius: 6px;
}

.reading-plusbut::after {
    position: absolute;
    content: "";
    display: block;
    width: 64px;
    height: 58px;
    right: 11px;
    bottom: -27px;
    background: url("/assets/images/tap_7931935 copy.png");
}

.interval-box {
    width: 1165px;
    background-color: #fff;
    margin: 0 auto;
    margin-top: -40px;
    padding: 40px 60px;
}

.interval-box-p {
    text-align: center;
    font-size: 24px;
    line-height: 34px;
    font-weight: 600;
}

.interval-big-p {
    font-size: 60px;
    font-weight: 800;
    color: #ff2222;
    margin-bottom: 50px;
}

.wordprogram-videobut {
    position: relative;
}

.wordprogram-videobut:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 279px;
    height: 195px;
    background: url("/assets/images/program-videobut.png");
    background-repeat: no-repeat;
    background-size: contain;
}

.wordprogram-videobut::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(39, 39, 39, 0.7);
}

.interval-box-ul li {
    font-size: 24px;
    font-weight: 500;
    color: #fff;
    background-color: #4A6CF7;
    margin-top: 10px;
    padding: 20px 0;
    border-radius: 6px;
}

/* mp3 �럹�씠吏� 愿��젴 */
.mp3Content {
    margin-left: 0 !important;
    width: auto !important;
}

.red-p {
    color: #ff2929;
    font-weight: 500;
}

.mp3-downlistbox {
    background-color: #f4f4f4;
    border-radius: 6px;
    padding: 20px;
    margin-top: 20px;
}

.mp3-downlistbox-title {
    font-size: 18px;
    font-weight: 600;
}

.mp3down-li {
    margin-top: 10px;
}

.allmp3-li {
    margin-top: 30px !important;
}

.allmp3-li p {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px;
}

.mp3down-a {
    width: auto;
    display: inline-block;
    background-color: #4A6CF7;
    border-radius: 5px;
    padding: 9px 20px;
    color: #fff;
    transition: 0.2s;
    font-size: 14px;
}

.mp3down-a:hover {
    background-color: #3257ec;
}

.mp3down-a .iconify {
    font-size: 20px !important;
    margin-top: 0px !important;
}

.mp3-botul {
    margin-top: 10px;
}

.mp3-botul li {
    font-size: 14px;
    margin-top: 5px;
}

/* �뙎湲� */
.detail-mycontent-chat {
    padding: 30px 0px;
}

.detail-mycontent-inputbox {
    width: 100%;
    display: flex;
}

.detail-chat-input {
    width: calc(100% - 164px);
    margin-right: 5px;
    border-radius: 6px;
    border: 1px solid #dbdbdb;
    padding: 10px 20px;
}

.detail-chat-input:focus {
    border: 1px solid #3257ec;
}

.detail-chat-but {
    width: 164px;
    height: 50px;
    background-color: #3257ec;
    border-radius: 6px;
    color: #fff;
    font-weight: 500;
}

.detail-chat-but:hover {
    background-color: #3257ec;
}

.detail-mycontent-chat-ul {
    margin-top: 20px;
}

.detail-mycontent-chat-li {
    width: 100%;
    margin-top: 8px;
    background-color: #fff;
}

.detail-mycontent-chat-li:nth-child(1) {
    margin-top: 0;
}

.detail-mycontent-chat-li01 {
    margin-right: 20px;
}

.mycontent-chat-li01-name {
    font-weight: 500;
    margin-left: 2px;
}

.detail-mycontent-chat-li02 {
    width: 100%;
    padding: 10px 20px;
}

.mycontent-chat-li02-p {
    line-height: 22px;
    word-break: keep-all;
}

.detail-mycontent-chat-li03 {
    text-align: right;
}

.detail-mycon-flexbox {
    display: flex;
    width: 100%;
    background-color: #fcfcfc;
    padding: 10px 20px;
    border-bottom: 1px solid #e0e0e0;
    border-top: 1px solid #e0e0e0;
}

.mycontent-chat-li03-span {
    display: inline-block;
    font-size: 14px;
    color: #747474;
}

.mycontent-chat-li03-span:nth-child(1) {
    margin-right: 6px;
}

/* --- */

.bookqna-selectbox {
    display: flex;
    margin-top: 40px;
}

.bookqna-selectbox .input-group {
    margin-right: 10px;
}

.bookqna-selectbox .input-group:last-child {
    margin-right: 0;
}

/* �궙遺덇�諛� */
.nightClass-title {
    font-size: 30px;
    line-height: 42px;
    font-weight: 600;
    text-align: center;
}

.nightClass-title span {
    color: #ff672b;
}

.nightClass-title02 {
    width: 500px;
    margin: 0 auto;
    margin-top: 5px;
    font-size: 20px;
    background-color: #292625;
    border-radius: 50px;
    color: #fff;
    padding: 10px 0;
    font-weight: 500;
    text-align: center;
}

.nightClass-title02 span {
    color: #ffaa2a;
}

.nightClass-title03 {
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    margin-top: 15px;
}

.nightClass-intro {
    background-color: #f4f4f4;
    padding: 30px;
    border-radius: 6px;
    margin-top: 30px;
}

.aboutusher02-li-p01 {
    font-size: 20px;
    font-weight: 600;
}

.bul-02 {
    margin-top: 10px;
    line-height: 28px;
    word-break: keep-all;
}

.bul-02 span {
    font-weight: 600;
    color: #ff672b;
    text-decoration: underline;
    text-underline-position: under;
}

.bul-02ul li {
    margin-top: 8px;
}

/* ----- */
.program-videobutbox {
    position: relative;
}

.program-videobut {
    position: absolute;
    right: 180px;
    top: 55%;
}

/* 援щℓ�븯湲� �뀒�씠釉� */
.pro-table-title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px;
}

.product-book02 {
    border: 1px solid #e0e0e0;
    width: 100%;
}

.productContent {
    margin-top: 40px;
}

.productContent-flexbox {
    display: flex;
    align-items: center;
}

.productContent-flexbox-left {
    margin-right: 20px;
    width: 130px;
}

.productContent-flexbox-right {
    flex: 1;
}

.product-table {
    border: 1px solid #dbdbdb;
}

.product-table thead tr {
    background-color: #f4f4f4;
}

.product-table thead tr th {
    text-align: center;
    font-weight: 500;
    padding: 10px 0;
    font-size: 18px;
    border: 1px solid #dbdbdb;
}

.product-table tbody tr td {
    padding: 20px 12px;
    text-align: center;
    border: 1px solid #e0e0e0;
    vertical-align: middle;
}

.product-table .bookname {
    font-size: 18px;
    line-height: 26px;
    font-weight: 600;
}

.product-table .bookname:nth-child(2) {
    margin-top: 30px;
}

.buy-mt30 {
    margin-top: 30px;
}

.pro-day {
    line-height: 20px;
}

.pro-day span {
    font-size: 14px;
}

.toefl-select {
    width: 214px;
}

.product-book-buytd button {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 36px !important;
    margin-top: 6px;
    border-radius: 6px;
    font-weight: 500 !important;
}

.book-sangbut {
    width: 200px;
    border-radius: 6px;
    height: 36px;
    background-color: #2c2c2c;
    color: #fff;
    transition: 0.2s;
    margin-top: 8px;
}

.book-sangbut:hover {
    background-color: #1d1d1d;
}

.product-book-buytd button:nth-child(1) {
    margin-top: 0;
}

.storebut-naver {
    background-color: #03C75A !important;
}

.new-program-questionbut {
    width: 100%;
    background-color: #6a2aff;
    padding: 10px 8px;
    border-radius: 50px;
    font-size: 16px;
    color: #fff;
    font-weight: 500;
    margin-top: 8px;
}

.new-program-questionbut:nth-child(1) {
    margin-top: 0;
}

.new-internet-questionbut {
    background-color: #4A6CF7 !important;
}


.tie-modal p {
    font-size: 26px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 10px;
}

.tie-modal p span {
    color: #4A6CF7;
}

.tie-modalbox {
    margin-bottom: 50px;
    text-align: center;
}

.tie-modalbox video {
    width: 80%;
    border: 1px solid #e0e0e0;
}

/* ----` */
.main-voca-kakao {
    margin-top: 30px;
    text-align: center;
}

.grammar-arrowbut {
    position: relative;
}

.grammar-arrowbut-ab {
    position: absolute;
    right: -21px;
    top: 28px;
}

.writing-ch-box {
    background-color: #f4f4f4;
    text-align: center;
    border-radius: 10px;
    padding: 60px 30px;
}

.writing-ch-box p {
    font-size: 40px;
    font-weight: 600;
}


.program-bookimg-box {
    text-align: center;
    margin-top: 20px;
}

.program-bookimg {
    width: 100px;
    border: 1px solid #e0e0e0;
    height: 129px;
    margin-right: 8px;
}

.program-bookimg:last-child {
    margin-right: 0;
}

.program-but-nump-box {
    position: relative;
    display: flex;
    justify-content: center;
    margin-bottom: 8px;
}

.program-but-nump-box .finger {
    position: absolute;
    width: 25px;
    right: 50%;
    top: -17px;
    transform: translate(130%, 15%);
    transform:  rotate(-450deg);
    transform-origin: top right;
    animation: blink-effect 1s step-end infinite;
}

@keyframes blink-effect {
    50% {
        opacity: 0;
    }
}

.program-but-nump {
    background-color: #fff;
    width: 30px;
    height: 30px;
    line-height: 28px;
    text-align: center;
    border-radius: 50px;
    color: #4A6CF7;
}

.nav-link.active .program-but-nump {
    background-color: #4A6CF7 !important;
    color: #fff !important;
}

.borderra10 {
    border-radius: 10px !important;
}

.borderra10 li button {
    border-radius: 8px !important;
}

.program-chump {
    font-size: 26px;
    font-weight: 500;
    line-height: 38px;
}

.program-chump span {
    font-weight: 600;
    color: #005EEB;
}

.program-chump-button {
    position: relative;
    background-color: #131415;
    padding: 15px 30px;
    border-radius: 50px;
    font-size: 26px;
    color: #fff;
    margin-top: 30px;
}

.program-chump-button::after {
    content: "";
    display: block;
    position: absolute;
    right: -17px;
    top: 24px;
    width: 48px;
    height: 44px;
    background: url("/assets/images/hand.png");
}

.internetreadingbut {
    background-color: #272727;
    padding: 15px 25px;
    font-size: 20px;
    color: #fff;
    border-radius: 5px;
    transition: 0.2s;
}

.internetreadingbut:hover {
    background-color: #161616;
}

.product-warn {
    background-color: #f4f4f4;
    border-radius: 6px;
    padding: 20px;
    margin-top: 20px;
}

.product-warn p {
    line-height: 24px;
    font-weight: 500;
}

.product-warn p span {
    color: #ff2e2e;
}

.product-teacher-li {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 16px;
    border-top: 1px solid #e0e0e0;
    padding-top: 20px;
    height: 90px;
}

.product-teacher-li:nth-child(1) {
    margin-top: 0;
    padding-top: 0;
    border: none;
}

.product-teacher-li-left {
    margin-right: 10px;
}

.product-classname {
    font-size: 16px;
    font-weight: 500;
    background-color: #2569c7;
    color: #fff;
    padding: 10px 15px;
    color: #fff;
    border-radius: 50px;
}

.product-classname-minjoo {
    background-color: #A863FF;
}

.product-teachername {
    text-align: left;
    font-size: 15px;
    margin-top: 8px;
}


/* --------------------�닔媛뺥썑湲�----------------------- */
.leftside-checknum {
    display: inline-block;
    width: 22px;
    height: 22px;
    line-height: 21px;
    font-size: 14px;
    color: #fff;
    font-weight: 400;
    text-align: center;
    border-radius: 50px;
    background-color: #f8443e;
    margin-left: 10px;
}


.memor-content-top {
    margin-bottom: 120px;
}

.memor-content-top-box {
    background-color: #fff;
    border: 1px solid #e0e0e0;
}


/* 챘�슿늘�큄짤 챗째�궗챘혧�┚р�왖� */
.alarm-detail-ga-li {
    margin-top: 40px;
}

.alarm-detail-ga-li:nth-child(1) {
    margin-top: 0;
}

.memoirs-detail-stitle {
    font-size: 18px;
    font-weight: 600;
}

.alarm-detail-ga-li-ul {
    margin-top: 10px;
    margin-left: 20px;
}

.alarm-detail-ga-li-ul li {
    font-size: 16px;
}

.ga-li-06ul .input-group-text {
    width: 150px;
    display: block;
    vertical-align: middle;
    line-height: 200px;
}

.alarm-write-list-07input {
    margin-top: 10px;
}

.alarm-write-list-07input:nth-child(1) {
    margin-top: 0;
}

.alarm-write-list-07input textarea {
    height: 214px;
}

.alarm-class-tablebox {
    margin-top: 30px;
}

.alarm-class-table-p {
    font-weight: 600;
    color: #be0909;
    margin-bottom: 8px;
    font-size: 18px;
}

.alarm-class-table {
    width: 700px;
    border: 1px solid #e0e0e0;
}

.alarm-class-table thead tr {
    background-color: #f4f4f4;
}

.alarm-class-table thead tr th,
.alarm-class-table tbody tr td {
    border: 1px solid #e0e0e0;
    padding: 10px;
    text-align: center;
}

.alarm-class-table tbody tr th {
    border-bottom: 1px solid #e0e0e0;
    text-align: center;
    background-color: #f4f4f4;
}

.today-table tbody tr.on td a .fileicon {
    color: #fff !important;
}

.detail-mycontent-chat {
    padding: 30px 60px;
}

.today-tablebox {
    margin-top: 30px;
}

.today-table {
    width: 100%;
    border: 1px solid #DBDBDB;
}

.today-table thead tr {
    background-color: #F5F5F7;
}

.today-table thead tr th {
    padding: 15px 0;
    color: #363636;
    text-align: center;
}

.today-table tbody tr td {
    padding: 15px 0;
    vertical-align: middle;
    text-align: center;
}

.today-table tr.on {
    background-color: #3380ff;
}

.today-table tr.on td,
.today-table tr.on td a span {
    color: #fff !important;
}

.today-table tr.on .onnum {
    font-size: 24px;
    font-weight: 600;
    color: #fbff05 !important;
}

.today-lefttd {
    text-align: left !important;
}

.today-lefttd a:hover {
    color: #ff1e1e;
}

.today-new {
    display: inline-block;
    background: rgb(255, 92, 92);
    background: linear-gradient(125deg, rgba(255, 92, 92, 1) 0%, rgba(244, 10, 123, 1) 100%);
    width: 52px;
    height: 28px;
    border-radius: 50px;
    font-size: 13px;
    color: #fff;
    font-weight: 500;
    text-align: center;
    line-height: 28px;
}

.todaytable-title {
    font-weight: 500;
}

.todaytable-title span {
    color: #FF2020;
}

.today-table .board-modalButton {
    display: inline !important;
}

.today-table tbody tr {
    background-color: #fff;
    border-bottom: 1px solid #DBDBDB;
}

.today-table tbody tr:last-child {
    border: none;
}

.cheer-a-box-name {
    display: flex;
    align-items: center;
}

.cheer-a-box-name-user {
    display: flex;
    align-items: center;
    width: 200px;
}

.cheer-a-box-name-user .today-userimgbox {
    margin-right: 7px;
}

.today-cheer-name {
    font-size: 14px;
    font-weight: 600;
}

.today-cheer-class {
    font-size: 12px;
    font-weight: 400;
    margin-top: 2px;
}

.alarm-likebut {
    display: flex;
    border: 1px solid #e0e0e0;
    padding: 12px 20px;
    border-radius: 4px;
    align-items: center;
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(245, 245, 245, 1) 100%);
}


.alarm-detail-daytimebox {
    display: flex;
    justify-content: space-between;
    margin-top: 60px;
    align-items: center;
}

.alarm-likebut span {
    font-weight: 500;
}


/* 愿��젴媛뺤쥖 */
.book-teacherContent {
    max-width: 1080px;
    margin: 40px auto;
}

.book-teacherContent-title {
    font-size: 24px;
}

.book-teacherContent-box {
    margin-top: 20px;
    border-top: 1px solid #131415;
}

.book-teacherContent-box li {
    padding: 20px 30px;
    display: flex;
    border-bottom: 1px solid #e0e0e0;
}

.book-teacherContent-teacher {
    margin-right: 20px;
}

.book-teacherContent-classname {
    font-size: 24px;
    font-weight: 500;
}

.book-teacherContent-right {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.book-teacherContent-spanbox {
    margin-top: 20px;
}

.book-teacherContent-spanbox span {
    position: relative;
    display: inline-block;
    font-size: 13px;
    color: #9e9e9e;
    margin-right: 10px;
}

.book-teacherContent-spanbox span::after {
    content: "|";
    display: block;
    position: absolute;
    right: -8px;
    top: 1px;
    font-size: 11px;
}

.book-teacherContent-spanbox span:last-child {
    position: unset;
}

.book-teacherContent-button {
    width: 100px;
    height: 42px;
    color: #fff;
    font-weight: 500;
    background-color: red;
    border-radius: 4px;
    margin-right: 3px;
    transition: 0.2s;
}

.book-teacherContent-button:last-child {
    margin-right: 0;
}

.teachercon-but01 {
    background-color: #6e6e6e !important;
}

.teachercon-but01:hover {
    background-color: #555454 !important;
}

.teachercon-but02 {
    background-color: #53628b !important;
}

.teachercon-but02:hover {
    background-color: #37456d !important;
}

.teachercon-but03 {
    background-color: #2e292e !important;
}

.arti-exam {
    overflow-x: auto;
}

.mypage-speaking-scrollbox {
    width: auto;
}


/* ---------------------紐⑤컮�씪 硫붾돱----------------- */
.sidenav-mobile {
    height: 100%;
    /* 100% Full-height */
    width: 290px;
    /* 0 width - change this with JavaScript */
    position: fixed;
    /* Stay in place */
    z-index: 20;
    /* Stay on top */
    background-color: #fff;
    /* Black*/
    overflow-x: hidden;
    /* Disable horizontal scroll */
    transition: 0.3s;
    /* 0.5 second transition effect to slide in the sidenav */
    box-shadow: 4px 0px 12px rgb(0 0 0 / 10%);
    -ms-overflow-style: none;
    /* 챙혶쨍챠�왖걘モ�왖� 챙혶쨉챙힋짚챠�씵뮼ヂ∴벭ヅ맞� */
    scrollbar-width: none;
    /* 챠흸흸챙혶쨈챙�벬늘�혧짯챙힋짚 */
    left: -100%;
    top: 0;
}

.sidenav-mobile-titlebox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px;
    padding-bottom: 20px;
    padding-top: 20px;
    background-color: #040820;
    border-bottom: 2px solid #131415;
}

.mobile-title {
    color: #fff;
    font-size: 22px;
    font-weight: 500;
}

.sidenav-mobile .closebtn {
    font-size: 26px;
    color: #fff;
}


/* 諛섏썝 洹몃옒�봽 */
.progress-container {
    position: relative;
}

.semi-grade-flex{
    display: flex;
    margin-top: -40px;
}

.semi-gradebox-green{
    background-color: #e3eaff;
    margin-top: 10px;
    border-radius: 6px;
    padding: 10px 20px;
}

.semi-gradebox{
    width: 100%;
    text-align: center;
    margin-right: 10px;
}

.semi-gradebox:last-child{
    margin-right: 0;
}

.progress-bar:before {
    position: absolute;
    left: 2px;
    bottom: 60px;
    font-size: 12px;
    color: rgba(98, 107, 114, 1);
}

.progress-bar:after {
    position: absolute;
    right: -6px;
    bottom: 60px;
    font-size: 12px;
    color: rgba(98, 107, 114, 1);
}

.widget {
    padding: 25px;
    padding-top: 0;
    padding-bottom: 0;
    margin: 0 auto;
    width: 200px;
    margin-top: 14px;
    border-radius: 5px;
    position: relative;
}

.points {
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    bottom: 60px;
    text-align: center;
    text-transform: uppercase;
    color: rgba(98, 107, 114, 1);
    font-size: 12px;
}
/* --------------------------- */
.semi-progressbox{
    width: 260px;
    margin-right: 20px;
    border: 2px solid #4A6CF7;
    padding: 15px;
    border-radius: 15px;
}

.semi-pbox01{
    border-bottom: 1px solid #a8a8a8;
    padding-bottom: 15px;
}

.semi-progress-p01{
    font-size: 15px;
    font-weight: 600;
}

.semi-progress-p02{
    margin-top: 10px;
    font-size: 14px;
}

.semi-progress-p03{
    text-align: center;
}

.seme-flex-table{
    flex: 1;
}

.semi-table-flex{
    display: flex;
}

.semi-pbox02{
    padding-top: 20px;
}

.semi-green-p01{
    font-size: 24px;
    font-weight: 600;
}

.semi-green-p02{
    font-size: 13px;
    margin-top: 5px;
}

.semi-grade-flex02{
    margin-top: 20px;
}

.grade-title{
    font-size: 14px;
    color: #fff;
    background-color: #4A6CF7;
    border-radius: 50px;
    padding: 8px 12px;
    display: inline-block;
    margin-bottom: 8px;
}


/* mp3 */
.mp3-table{
    width: 100%;
    border: 1px solid #929292;
}

.mp3-table tr th,
.mp3-table tr td{
    border: 1px solid #929292;
    padding: 15px;
    text-align: center;
    vertical-align: middle;
    font-size: 20px;
    font-weight: 500;
}

.mp3-table tr th{
    background-color: #f4f4f4;
}

.mp3-table tr button{
    font-size: 24px;
}