@charset "utf-8"; 
.scroll_on { opacity: 0; transition: all 1s; transform: translate(0, 50px); } 
.scroll_on.active { opacity: 1 !important; transform: translate(0, 0) !important; transition: transform 1s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.8s; } 

/* 상단 */
#wrapper { padding-top: 131px; } 
#header { position: absolute; top:0; left:0; width:100%; background:#000; z-index:200; } 
#header .header-top { position:relative; max-width:1240px; margin:0 auto; padding: 0 20px; } 
#header .header-top .logo {width:28px;}
#header .header-top .logo img {width:100%; vertical-align:top;}
.top-menu { display: flex; align-items: center; height: 72px; } 
.top-menu .menu-list1 { display: flex; align-items: center; gap:24px; margin-left: 44px; } 
.top-menu .menu-list1 > li { position: relative; } 
/* .top-menu .menu-list1 > li.active { pointer-events: none; } */
.top-menu .menu-list1 > li a { display: block; position: relative; font-family: 'Pretendard'; font-size: 18px; font-weight: 700; color: var(--color-gray-500); } 
.top-menu .menu-list1 > li:hover a,
.top-menu .menu-list1 > li.active a { color:#fff; } 
/* .top-menu .menu-list1 > li + li::before { content:''; position: absolute; top: 50%; left: -11px; width: 3px; height: 3px; background: var(--color-gray-700); border-radius:50%; transform: translate(0,-50%); }  */
.top-menu .menu-list1 > li .img { position: absolute; top: 50%; left: 50%; height: 51px; transform: translate(-50%,-50%); opacity: 0; } 
.top-menu .menu-list1 > li:has(.img):hover .txt { opacity: 0; } 
.top-menu .menu-list1 > li:has(.img):hover .img { opacity: 1; }
.top-menu .menu-list1 > li.beta a {padding-right:14px;}
.top-menu .menu-list1 > li.beta a::after {content:'Beta'; position:absolute; top:-7px; right:-11px; font-size:12px; font-weight:700; vertical-align:top; background:linear-gradient(128.68deg, #FF9E9E 5%, #FF3D3D 96.25%); -webkit-background-clip:text; -webkit-text-fill-color:transparent;} 
.top-menu .menu-list1 > li.bebybilly {padding-left:17px;}
.top-menu .menu-list1 > li.bebybilly a {color:var(--color-gray-500);}
.top-menu .menu-list1 > li.bebybilly img {width:13px; height:13px; margin-left:5px;}
.top-menu .menu-list1 > li.bebybilly::before {content:''; position: absolute; top: 50%; left:-5px; width:1px; height: 15px; background: rgba(255,255,255,0.18);transform: translate(0,-50%); } 
.top-menu .menu-list1 > li.bebybilly a::after {content:''; display:inline-block; width:13px; height:13px; margin-left:5px; background:url(/html/_skin/1/images/common/icon_link.png) no-repeat center/contain; } 
.top-menu .menu-list1 > li.bebybilly:hover a {color:#FFF;}
.top-menu .menu-list1 > li.bebybilly:hover a::after {background-image:url(/html/_skin/1/images/common/icon_link_active.png);} 
.top-menu .right { position: relative; margin-left: auto; } 
.top-menu .menu-list2 { display: flex; align-items: center; gap:19px; } 
.top-menu .menu-list2 > li { position: relative; } 
.top-menu .menu-list2 > li a { display: block; font-family: 'Pretendard'; font-size: 15px; color: #fff; font-weight:400;  font-style: normal; } 
/* .top-menu .menu-list2 > li:hover a { color: rgba(255, 255, 255, 0.75); }  */
.top-menu .menu-list2 > li + li::before { content:''; position: absolute; top: 50%; left: -10px; width: 3px; height: 3px; background: var(--color-gray-700); border-radius:50%; transform: translate(0,-50%); } 
.login-menu { display:none; position:absolute; top:100%; right:0; width:160px; margin-top:21px; padding:20px; background:#fff; border:1px solid var(--color-dark-gray); border-radius:3px; z-index:110; } 
.login-menu .user-name { margin-bottom:15px; font-size:14px; font-weight:500; color:var(--color-primary); } 
.login-menu .user-name strong { font-weight:700; } 
.login-menu .alarm-wrap { position:absolute; top:20px; right:20px; line-height:0; } 
.login-menu .alarm-wrap .new { position:absolute; top:-8px; right:-10px; width:16px; height:16px; background:var(--color-red); border-radius:50%; font-size:11px; font-weight:500; line-height:16px; color:#fff; text-align:center; } 
.login-menu .user-menu li a { display:inline-block; position:relative; font-size:18px; font-weight:400; line-height:32px; color:var(--color-dark-gray); transition:.3s; } 
.login-menu .user-menu li a:after { content:''; position:absolute; bottom:5px; left:0; width:100%; height:1px; background:var(--color-dark-gray); transition:.3s; opacity:0; } 
.login-menu .user-menu li:hover a { font-weight:700; } 
.login-menu .user-menu li:hover a:after { opacity:1; } 
.login-menu .user-menu .btn-admin { margin-top:7px; } 
.login-menu .user-menu .btn-admin a { display:inline-flex; align-items:center; gap:5px; } 

/* search */
#header .search-wrap { position:relative; width:100%; max-width:450px; margin:0 auto; border-radius:15px; box-shadow:0 3px 7px rgba(0,0,0,.15); } 
@media only screen and (min-width:1025px) { 
    #header .search-wrap { display:block!important; } 
}
#header .search-wrap input[type="text"] { width:100%; height:48px; padding:0 56px 0 20px; border:0 none; border-radius:15px; font-size:16px; font-weight:400; color:var(--color-dark-gray); } 
#header .search-wrap .search { position:absolute; top:0; right:0; width:56px; height:48px; padding:0; background:none; text-align:center; } 
#header .search-wrap .back { display:none; position:absolute; top:0; left:30px; width:30px; height:80px; padding:0; background:none; } 
#header .m-search-btn { display:none; line-height:0; } 

/* logion */
.header-login-wrap { position:absolute; top:16px; right:0; } 
.header-login-wrap .login-utils { display:flex; align-items:center; padding-right:70px; background:url(../images/common/login_icon.png) no-repeat 99% center; cursor:pointer; } 
.header-login-wrap .login-utils li { display:inline-block; vertical-align:middle; } 
.header-login-wrap .login-utils li a { display:block; font-size:16px; font-weight:500; line-height:48px; color:#000; } 
.header-login-wrap .login-utils li.join a { color:var(--color-primary); } 
.header-login-wrap { display:flex; align-items:center; gap:20px; } 
.language-select-box { position:relative; } 
.language-select-box .language-select { display:block; position:relative; min-width:90px; padding:14px 14px 15px; background:#333; border-radius:15px; font-size:15px; font-weight:500; color:#fff; } 
.language-select-box .language-select:after { content:''; position:absolute; top:50%; right:12px; width:16px; height:16px; background:url(/html/_skin/1/images/common/icon_globe.webp) no-repeat center/contain; transform:translateY(-50%); } 
.language-select-box.on .language-select:after { width:11px; height:9px; background-image:url(/html/_skin/1/images/common/icon_select_arrow.webp); } 
.language-select-box .language-list { display:none; position:absolute; top:100%; left:0; width:100%; padding:10px 5px 10px 15px; background:#4e4e4e; border-radius:15px; z-index:110; } 
.language-select-box .language-list li + li { margin-top:5px; } 
.language-select-box .language-list a { display:block; padding:2px 0; font-size:15px; font-weight:500; color:rgba(255,255,255,0.5); } 
.language-select-box .language-list a:where(:hover,.on) { color:#fff; } 

@media only screen and (max-width:1080px) {
    #wrapper { padding-top: 116px; } 
    #header {position: fixed;} 
    #header .header-top { width:100%; height:60px; padding:16px 30px; } 
    #header #logo { left:30px; } 
    .header-login-wrap { top:16px; right:75px; } 
    .header-login-wrap .login-utils { padding-right:0; background:none; } 
    .login-menu { right:50px; } 
    .top-menu { display: none; }
}

@media only screen and (max-width:1024px) { 
    .header-login-wrap { gap:15px; top:50%; right:75px; z-index:10; transform:translateY(-50%); } 
    .header-login-wrap .login-utils { display:none; } 
    .language-select-box .language-select span { display:none; } 
    .language-select-box .language-select { height:30px; min-width:30px; padding:0; background:transparent; } 
    .language-select-box .language-select:after { right:0; width:30px; height:30px; background-image:url(/html/_skin/1/images/common/icon_globe.svg); } 
    .language-select-box.on .language-select:after { width:30px; height:30px; background-image:url(/html/_skin/1/images/common/icon_globe.svg); } 
    .language-select-box .language-list { top:calc(100% + 10px); left:-30px; width:90px; } 
    #header .m-search-btn { display:block; /*right:120px*/ } 
    #header .search-wrap { display:none; position:fixed; top:0; left:0; max-width:100%; border-bottom:2px solid var(--color-dark-gray); border-radius:0; z-index:20; box-shadow:none; } 
    #header .search-wrap input[type="text"] { height:80px; padding:0 75px; border-radius:0; font-size:24px; } 
    #header .search-wrap .back { display:block; } 
    #header .search-wrap .search { right:30px; width:30px; height:80px; background:url(../images/common/m_icon_search.png) no-repeat center center; } 
    #header .search-wrap .search img { display:none; } 
}


/* -------- gnb -------- */
#header * { letter-spacing: normal; }
#gnb { position: relative; width:100%; background:#000; border-top: 1px solid #000; border-top: 1px solid rgba(255, 255, 255, 0.15); border-bottom: 1px solid rgba(255, 255, 255, 0.15); text-align:center; transition:.3s; } 
#gnb .in_Layer { display: flex; align-items: center; max-width: 1240px; margin: 0 auto; padding: 0 20px; } 
#gnb #logo {position:absolute; top:-52px;} 
#gnb #logo a { display: block; font-size: 0; } 
#gnb #logo a img { width: 28px; vertical-align:top;} 
.all-class { position: relative; margin-right: 13px; } 
.all-class .open { display: flex; align-items: center; gap:5px; height: 70px; font-family: 'Pretendard'; font-size: 16px; font-weight: 400; color: #FFFFFF; } 
.all-class .open:hover {opacity: 0.8;}
.all-class .open::after { content:''; width: 16px; height: 16px; background:url('/html/_skin/1/images/common/all-class-arr.png') center/contain no-repeat; } 
.all-class .open.active::after { transform: scaleY(-1); } 
.all-class-menu { display: none; position: absolute; top: calc(100% - 9px); left: -13px; width: 145px; padding: 12px 0; background: rgba(255, 255, 255, 0.07); backdrop-filter: blur(20px); border-radius: 8px; text-align: left; z-index: 1; } 
.all-class .open.active + .all-class-menu { display: block; } 
.all-class-menu > li > a { display: block; padding: 8px 0 8px 24px; font-family: 'Montserrat'; font-weight: 500; font-size: 15px; line-height: 140%; letter-spacing: -0.2px !important; color: #FFFFFF; } 
.all-class-menu > li:hover > a { color: rgba(255, 255, 255, 0.8); } 
/* .all-class-menu > li:hover > a::after { content:''; display: inline-block; position: relative; top: -1px; left: 5px; width: 5px; height: 5px; background: #744AE8; border-radius:50%; vertical-align: top; }  */

.fixed #gnb { position:fixed; top:0; left:0; } 
#gnb .gnb-wrap { font-size:0; } 

@media only screen and (max-width:1024px) { 
    .gnb-inner { overflow:hidden; } 
}

#gnb .depth01 { width: auto; } 
#gnb .depth01 a { display: flex; align-items: center; height: 60px; padding: 0 10px; font-family: 'Pretendard'; font-size: 16px; font-weight: 500; color: #FFFFFF; } 
#gnb .depth01:first-child a {padding-left:5px;}
/* #gnb .depth01 a:hover { color: rgba(255, 255, 255, 0.8); }  */
#gnb .depth01.divider { margin-left:6px; } 
#gnb .depth01.divider a { margin-left:6px; } 
#gnb .depth01.divider::before { content:''; display: inline-block; position: absolute; top: 50%; left: 0; width: 1px; height: 13px; background: rgba(255, 255, 255, 0.18); transform: translate(0,-50%); } 
#gnb .depth01:has(.depth02>li) > a::after { content:''; width: 16px; height: 16px; margin-left:4px; background:url('/html/_skin/1/images/common/icon_gnb_arrow.png') center/contain no-repeat; }
#gnb .depth01:has(.depth02>li):hover > a::after {transform:rotate(180deg);}
#gnb .depth02:has(>li) { overflow:hidden; display: none; position:absolute; top:calc(100% - 9px); left:50%; width:163px; height:0; background:rgba(255,255,255,0.07); z-index:90; transform:translateX(-50%); transition:.3s; border-radius:8px; backdrop-filter:blur(40px)} 
@media only screen and (min-width:1024px) { 
    #gnb .depth01:has(.depth02>li):hover .depth02 { height:auto; padding:12px 0} 
}
/* #gnb .depth02 a { height:40px; padding:4px 0; font-size:15px; font-weight:400; line-height:21px; color:var(--color-dark-gray); transition:.3s; } 
#gnb .depth02 a:hover { color:var(--color-primary); }  */

#gnb .depth01:has(.depth02>li):hover .depth02 {display:block;}
/* #gnb .depth01 .depth02:before {content:''; position:absolute; top:0; left:0; width:100%; height:100%; backdrop-filter: blur(40px);} */
#gnb .depth01 .depth02 li a { display: block; width:100%; height:auto; font-family: 'Montserrat'; padding:8px 0 8px 24px; font-size: 16px; font-weight: 500; line-height: 22px; text-align:left; letter-spacing: normal; color:#FFF; letter-spacing:-.02em;}
#gnb .depth01 .depth02 li:hover a { color:rgba(255,255,255,0.8); } 

#gnb .gnb-bg { display:none; } 
#gnb .login-link {display: none;position: absolute; top: 14px; right: 60px; font-family: 'Pretendard';font-weight: 600;font-size: 13px;color: #FFFFFF;justify-content: center;align-items: center;min-width:62px;border: 1px solid rgba(255, 255, 255, 0.15);border-radius: 40px;padding: 8px 13px 7px;}
#gnb .mypage-link {position: absolute;top:17px;right: 60px;}
#gnb .mypage-link img {width: 26px;height: 26px;}

@media only screen and (max-width:1080px) { 
    #header { box-shadow:none; } 

    /* -------- menu btn -------- */
    /* #gnb { position:static; }  */
    #gnb .menu-btn { display: block; position:absolute; top:-43px; right:20px; width:24px; bottom:100%; left:auto; margin-top:0; height:24px; margin-bottom:0; z-index: 1; cursor: pointer; } 
    #gnb .menu-btn span { position:absolute; left:50%; transform: translate(-50%,0); width:calc(100% - 9px); height:2px; background:#fff; border-radius:3px; transition:.3s; } 
    #gnb .menu-btn span:nth-child(1) { top:5px; } 
    #gnb .menu-btn span:nth-child(2) { top:50%; transform: translate(-50%,-50%); } 
    #gnb .menu-btn span:nth-child(3) { bottom:5px; } 
    #gnb .login-link { display: flex; } 

    .m-gnb-top { position: relative; width: 100%; height: 60px; border-bottom: 1px solid rgba(255,255,255,0.2); }
    /* .all-class, .gnb-inner { display:none !important; }  */
    .menu-btn-close { display: block; position:absolute; top:18px; right:28px; width:24px; bottom:100%; left:auto; margin-top:0; height:24px; margin-bottom:0; z-index: 1; cursor: pointer; }
    .menu-btn-close span { position:absolute; left:4px; width: 17px; height:2px; background:#fff; border-radius:3px; transition:.3s; } 
    .menu-btn-close span:nth-of-type(1) { top: 11px; transform:rotate(-45deg); } 
    .menu-btn-close span:nth-of-type(2) { top: 11px; transform:rotate(45deg); } 
    .m-gnb-top #logo {position: absolute;top: 18px;left: 28px;}
    .m-gnb-top #logo img { width: 24px; }
    .fixed #gnb { position: static; }
    #gnb #logo { position: fixed; top: -43px; left: 20px;}
    #gnb #logo a img {width: 24px;}

    .gnb-not-scroll {overflow: hidden;width: 100%;height: 100%;touch-action:none;}

    #gnb {background:rgba(0,0,0,0.9); backdrop-filter: blur(10px); border-bottom:1px solid rgba(255,255,255,.15); border-top:none;}
    #gnb .in_Layer {padding:0;}
    #gnb .gnb-inner {padding-left:6px;}
    #gnb .depth01 a {height:55px; font-size:15px; font-weight:400; color:rgba(255,255,255,0.9);}
    #gnb .depth01:first-child a {padding-left:10px;}
    #gnb .depth01 + .depth01::before { content:''; display: inline-block; position: absolute; top: 50%; left: 0; width: 1px; height: 12px; background: rgba(255, 255, 255, 0.15); transform: translate(0,-50%); } 
    #gnb .depth01:has(.depth02>li) > a::after {display:none;}
    #gnb .depth01.divider a {margin-left:0px;}
    #gnb:has(.depth01.on) .depth01 a {color:rgba(255,255,255,0.6); font-weight:400;}
    #gnb .depth01.on a {color:#FFF !important; font-weight:700 !important;}
}


@media only screen and (min-width:1081px) { 
    #m-gnb-wrap { display: none !important; }
}

@media only screen and (max-width:1080px) { 
    /* mobile gnb */
    #m-gnb-wrap { display:none; position:fixed; top:0; right:0; width:100%; height:100dvh; background:rgba(0,0,0,.8); z-index:10; } 
    .m-gnb-inner { position:absolute; top:0; right:-100%; width: 84.445%; height:100%; max-width: 687px;background: rgba(0, 0, 0, 1);} 
    .m-gnb-inner .login-link {position: absolute; top: 14px; left:28px; font-family: 'Pretendard';font-weight: 600;font-size: 13px;color: #FFFFFF;display: flex;justify-content: center;align-items: center;min-width:62px;border: 1px solid rgba(255, 255, 255, 0.15);border-radius: 40px;padding: 8px 13px 7px;}
    .m-gnb-inner .mypage-link {display: flex;gap:8px; align-items: center; position: absolute;top:17px;left: 32px;font-family: 'Pretendard';font-weight: 500;font-size: 14px;color: #FFFFFF;white-space: nowrap;}
    .m-gnb-inner .mypage-link img {width: 100%;width: 24px;height: 24px;}
    .m-header-utils { display: none; position:absolute; top:30px; right:88px; font-size:0; } 
    .m-header-utils li { display:inline-block; margin-left:20px; vertical-align:top; } 
    .m-header-utils li a { display:block; position:relative; line-height:0; } 
    .m-header-utils .alarm .new { position:absolute; bottom:100%; left:100%; width:18px; height:18px; margin-bottom:-10px; margin-left:-6px; background:var(--color-red); border-radius:50%; font-size:14px; font-weight:500; line-height:18px; color:#fff; text-align:center; } 
    .login-utils { display:flex; flex-wrap:wrap; justify-content:center; padding:55px 0 30px; font-size:0; text-align:center; row-gap:7px; } 
    .login-utils li { display:inline-block; position:relative; margin:0 27px; vertical-align:top; } 
    .login-utils li:after { content:''; position:absolute; top:50%; right:-27px; width:1px; height:20px; margin-top:-10px; background:var(--color-light-gray,#ccc); } 
    .login-utils li:last-child:after { display:none; } 
    .login-utils li a { display:block; font-size:22px; font-weight:400; color:var(--color-light-gray); }

    .gnb-scroll { display: flex;flex-direction: column;overflow: auto; height: calc(100% - 60px); padding: 20px 24px; } 
    .m-user-menu { } 
    .m-user-menu > li + li { margin-top: 8px; } 
    .m-user-menu > li a { display: flex; justify-content: center; align-items: center; height: 40px; background: #FFFFFF; font-family: 'Pretendard';font-weight: 600;font-size: 14px;color: #35393F; border-radius: 40px; } 
    .m-gnb { padding-top:24px; } 
    .m-gnb .depth01.divider {margin-top:10px; padding-top:10px; border-top: 1px solid rgba(255, 255, 255, 0.15); } 
    .m-gnb .depth01 + li { margin-top: 2px; } 
    .m-gnb .depth01 > a { display: block; position: relative; padding:12px 0; font-family: 'Pretendard';font-weight: 700;font-size: 15px;line-height: 155%;color: #FFFFFF;} 
    .m-gnb .depth01:has(.depth02 li) > a::after { content:''; position: absolute; top: 50%; right: 0; width: 20px; height: 20px; background:url('/html/_skin/1/images/common/gnb-mo-arr.png') center/contain no-repeat; transform: translate(0,-50%); } 
    .m-gnb .depth01:has(.depth02 li).on > a::after { transform: translate(0,-50%) scaleY(-1); } 
    /* .m-gnb .depth01 .badge {position:relative; display:inline-block; height:22px; margin-left:6px; padding:3px 8px 2px; font-weight:700; font-size:11px; line-height:1.55em; text-align:center; color:#FFF; vertical-align:1px; background:linear-gradient(111.85deg, #CFB9FF -22.36%, #703DE1 93.27%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; border-radius:12px;}
    .m-gnb .depth01 .badge:before {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(255,255,255,0.15); border-radius:inherit;} */
    .m-gnb .depth01.badge a:after {content:''; display:inline-block; width:36px; height:22px; margin-left:6px; background:url('/html/_skin/1/images/common/m_badge_free.png') center/contain no-repeat; vertical-align:-6px;}
    .m-gnb .depth02 { display: none; padding: 16px 0 20px; } 
    .m-gnb .depth02 > li + li { margin-top: 16px; } 
    .m-gnb .depth02 > li a { display: block; font-family: 'Montserrat';font-weight: 500;font-size: 14px;line-height: 1.3em;letter-spacing: -0.2px;color:rgba(255,255,255,0.7); } 
    .family-menu { display: flex; align-items: center; gap:16px; margin-top: auto; } 
    .family-menu > li a { display: block; width: 48px; } 
    .family-menu > li.active { pointer-events: none; }
    .family-menu > li a img { width: 100%; } 
    
    .m-user {display:flex; align-items:center;}
    .m-user .user-info {display:flex; align-items:center; gap:8px;}
    .m-user .user-info:before {content:''; display:inline-block; width:28px; height:28px; background:rgba(255,255,255,0.5) url('/html/_skin/1/images/common/header_user.png') center/contain no-repeat; border:1px solid rgba(255,255,255,0.1); border-radius:50%;}
    .m-user a.user-info:before {background-color:rgba(255,255,255,0.25);}
    .m-user a.user-info {position:relative; padding-right:20px;}
    .m-user a.user-info:after {content:''; position:absolute; top:50%; right:0; width:18px; height:18px; background:url('/html/_skin/1/images/common/icon_right_arrow.png') center/contain no-repeat; transform:translateY(-50%);}
    .m-user .user-img {display:inline-block; width:28px; height:28px;}
    .m-user .user-img img {width:100%; vertical-align:top;}
    .m-user .username {padding-right:1px; font-size:16px; font-weight:600; color:rgba(255,255,255,0.5); line-height:28px; letter-spacing:normal;}
    .m-user a.user-info .username {color:#FFF}
    .m-user .btn-login {margin-left:auto; padding:7px 15px 8px; font-size:13px; font-weight:600; color:var( --color-gray-700); background:#FFF; letter-spacing:normal; border-radius:16px;}

    .m-family-menus {display:flex; flex-wrap:wrap; row-gap:16px; margin-top:16px; padding:20px; background:rgba(255,255,255,0.1); border-radius:12px;}
    .m-family-menus .menu {width:50%;}
    .m-family-menus .menu a {display:flex; align-items:center; gap:8px; font-size:14px; font-weight:500; color:#FFF; letter-spacing:normal;}
    .m-family-menus .menu a img {width:28px; height:28px; border-radius:8px;}
}

/* 하단 */
/* -------- utils -------- */
#footer {background: #000;padding: 43px 0 80px;}
#footer * { letter-spacing: normal; }
#footer .in_Layer {position: relative; max-width: 1240px;padding: 0 20px;margin: 0 auto;}
#footer .foot-logo {width: 93px;}
#footer .foot-logo img {display: block;width: 100%;}
#footer .foot-cs {display: flex;align-items: center;flex-wrap:wrap;gap:12px;margin-top: 38px;}
#footer .foot-cs > li {font-family: 'Pretendard';font-weight: 400;font-size: 15px;color: rgba(255, 255, 255, 0.95);line-height: 150%;}
#footer .foot-cs > li a {display: block;color: rgba(255, 255, 255, 0.95);text-decoration: underline;text-underline-offset: 2px;}
#footer .foot-cs > li:hover a {color: rgba(255, 255, 255, 0.7);}
#footer .foot-cs > li + li {}
#footer address {margin-top: 17px;font-family: 'Pretendard';line-height: 150%;font-weight: 400;font-size: 15px;color: rgba(255, 255, 255, 0.5);font-style: normal;word-break: keep-all;}
#footer .foot-menu {display: flex;flex-wrap:wrap;align-items: center;gap:16px;margin-top: 23px;}
#footer .foot-menu > li {}
#footer .foot-menu > li a {display: block;font-family: 'Pretendard';line-height: 150%;font-weight: 400;font-size: 15px;color: rgba(255, 255, 255, 0.5);white-space: nowrap; }
#footer .foot-menu > li:hover a {color: rgba(255, 255, 255, 0.35);}
#footer .foot-sns {position: absolute;bottom: 0;right: 0;display: flex;align-items: center;flex-wrap:wrap;gap:16px;}
#footer .foot-sns > li {}
#footer .foot-sns > li a {display: block;width: 42px;height: 42px;background: rgba(255, 255, 255, 0.1);border-radius:50%;}
#footer .foot-sns > li a img {width: 100%;opacity: 0.5;}
#footer .foot-sns > li:hover a img {opacity: 0.3;}

@media only screen and (max-width:767px) { 
    #footer {padding: 28px 0 60px;}
    #footer .in_Layer {padding: 0 16px;}
    #footer .foot-logo {width: 78px;}
    #footer .foot-logo img {}
    #footer .foot-cs {margin-top: 29px;}
    #footer .foot-cs > li {font-size: 13px;}
    #footer .foot-cs > li a {font-size: 13px;}
    #footer .foot-cs > li:hover a {}
    #footer .foot-cs > li + li {}
    #footer address {margin-top: 17px;font-size: 13px;}
    #footer .foot-menu {gap:12px;margin-top: 12px;}
    #footer .foot-menu > li {}
    #footer .foot-menu > li a {font-size: 13px;}
    #footer .foot-menu > li:hover a {}

    #footer .foot-sns {position: static;margin-top: 32px;}
    #footer .foot-sns > li a { width: 32px; height: 32px; }
}
@media only screen and (max-width:640px) { 

}


/* form css */
/* checkbox */
.checkbox-wrap input{display:none}
.checkbox-wrap label{display:inline-block;font-size:16px;line-height:24px;color:#fff;vertical-align:top;cursor:pointer}
.checkbox-wrap label:before { content:''; display:inline-block; width:24px; height:24px; margin-right:7px; background:#1D1D22 url(/html/images/common/icon_check_gray.png) no-repeat center center; background-size:auto 13.7px; border:1px solid #35393F; border-radius:50%; box-sizing:border-box; vertical-align:top; } 
.checkbox-wrap input:checked + label:before { background-color:var(--color-primary); background-image:url(/html/images/common/icon_check.png); background-size:auto 13.7px; border:none; }

.checkbox-wrap input:disabled + label:before {background:var(--color-gray-700, #35393F); border-color:var(--color-gray-600, #575B60); } 
.checkbox-wrap.white input:disabled + label:before {background:#fff; border-color: #D5D9E1} 
.checkbox-wrap.square label:before{border-radius:4px}
.checkbox-wrap.lg label {font-size:18px;}
.checkbox-wrap.lg label:before {margin-right:12px;}
.checkbox-wrap.sm label {font-size:15px; line-height:20px;}
.checkbox-wrap.sm label:before {margin-right:6px; width:20px; height:20px; background-size:auto 11.4px;}
.checkbox-wrap.sm input:checked + label:before {background-size:11.4px auto;}
@media only screen and (max-width:767px) {
    .checkbox-wrap label{font-size:14px;line-height:20px}
    .checkbox-wrap label:before{margin-right:6px;width:20px;height:20px; background-size:auto 11.4px;}
    .checkbox-wrap input:checked + label:before,.checkbox-wrap.gray input:checked + label:before{background-size:auto 11.4px;}
    .checkbox-wrap.lg label{font-size:15px;}
    .checkbox-wrap.lg label:before{margin-right:8px;}
}
/* checkbox btn */
.checkbox-btn input{display:none}
.checkbox-btn label{display:inline-block;margin-right:10px;width:100px;border-radius:4px;border:1px solid #ccc;background:#fff;font-size:18px;line-height:38px;color:var(--color-dark-gray);text-align:center;cursor:pointer}
.checkbox-btn input:checked + label{border-color:var(--color-primary);background:var(--color-primary);color:#fff}
@media only screen and (max-width:767px) {
    .checkbox-btn label{font-size:14px;line-height:30px}
}
/* radio */
.radio-wrap input{display:none}
.radio-wrap label{display:inline-block;font-size:16px;line-height:24px;color:#fff;vertical-align:top;cursor:pointer}
.radio-wrap label:before{content:'';display:inline-block;margin-right:8px;width:24px;height:24px;border: 1px solid rgba(255, 255, 255, 0.7); box-sizing:border-box;border-radius:50%;background:var(--color-dark-gray);vertical-align:top}
.radio-wrap input:checked + label:before { background:var(--color-primary, #724AE8); border-color:var(--color-primary, #724AE8); box-shadow:inset 0 0 0 4px #000; } 
.radio-wrap input:disabled + label:before { background:var(--color-gray-700, #35393F); border-color:var(--color-gray-600, #575B60); } 
.radio-wrap.lg label {font-size:18px;}
.radio-wrap.lg label:before {margin-right:12px;}
.radio-wrap.sm label {font-size:15px; line-height:20px;}
.radio-wrap.sm label:before {margin-right:6px; width:20px; height:20px;}
@media only screen and (max-width:767px) {
    .radio-wrap label{font-size:15px;line-height:20px}
    .radio-wrap label:before{margin-right:6px;width:20px;height:20px}
    .radio-wrap input:checked + label:before{ box-shadow:inset 0 0 0 3px #000; }
    .radio-wrap.lg label{font-size:15px;}
    .radio-wrap.lg label:before{margin-right:6px;}
}
/* date */
.select-date { font-size:0; } 
.select-date > * { display:inline-block; vertical-align:top; } 
.select-date .date { height:40px; padding:0 10px; border:1px solid #ccc; border-radius:4px; font-size:18px; line-height:38px; color:var(--color-dark-gray); } 
.select-date .date + span { width:30px; font-size:18px; line-height:40px; color:var(--color-dark-gray); text-align:Center; } 
@media only screen and (max-width:767px) { 
    .select-date .date { height:30px; padding:0 10px; background-size:auto 14px; font-size:15px; line-height:30px; } 
    .select-date .date + span { font-size:15px; line-height:30px; } 
}
/* file select */
.select-file { font-size:0; } 
.select-file input[type="file"] { display:none; } 
.select-file label { display:inline-block; margin-right:11px; padding:0 13px; background:var(--color-primary); border-radius:12px; font-size:12px; line-height:24px; color:#fff; vertical-align:top; } 
.select-file span { display:inline-block; font-size:16px; line-height:24px; color:var(--color-dark-gray); vertical-align:top; } 
.attach-list { font-size:0; } 
.attach-list li { margin-bottom:7px; font-size:16px; line-height:24px; color:var(--color-dark-gray); } 
.attach-list li:last-child { margin-bottom:0; } 
.attach-list li strong { display:inline-block; margin-right:11px; padding:0 13px; background:#ccc; border-radius:12px; font-size:12px; font-weight:400; line-height:24px; color:#fff; vertical-align:top; } 
/* 하단 */
#sitemap { display: none; position:relative; width:100%; background:#fff; } 
/* -------- utils -------- */
 #sitemap .footer-utils { overflow:hidden; border:1px solid #ddd; border-width:1px 0; } 
 #sitemap .footer-utils .swiper-wrapper { width:1180px; margin:0 auto; font-size:0; } 
 #sitemap .footer-utils .swiper-slide { display:inline-block; width:auto; margin-right:40px; vertical-align:top; } 
 #sitemap .footer-utils .swiper-slide a { display:block; font-size:16px; font-weight:500; line-height:67px; color:var(--color-dark-gray); } 
@media only screen and (max-width:1080px) { 
    #sitemap .footer-utils .swiper-wrapper { width:100%; padding:0 30px; } 
}
@media only screen and (max-width:768px) { 
    #sitemap .footer-utils .swiper-wrapper { padding:0 20px; } 
    #sitemap .footer-utils .swiper-slide { margin-right:30px; } 
    #sitemap .footer-utils .swiper-slide a { font-size:15px; line-height:60px; } 
}
@media only screen and (max-width:640px) { 
    #sitemap .footer-utils .swiper-slide { margin-right:20px; } 
    #sitemap .footer-utils .swiper-slide a { font-size:14px; line-height:50px; } 
}
.band-banner { overflow:hidden; } 

.text-primary { color:var(--color-primary); } 

/* popup */
.popup-wrap { display:none; } 
.popup-wrap { position:fixed; top:0; right:0; bottom:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.8); z-index:110; } 
.popup-wrap .popup-inner { position:absolute; top:50%; left:50%; width:calc(100% - 32px); height:calc(100% - 60px); max-width:560px; max-height:800px; padding:32px 20px; background:#fff; border-radius:10px; transform:translate(-50%,-50%); } 
.popup-wrap .popup-tit { font-size:18px; font-weight:700; line-height:1.5em; color:var(--color-dark-gray,#333); text-align:center; } 
.popup-wrap .popup-btn { display:flex; width:100%; margin-top:58px; } 
/* .popup-wrap .popup-btn { display:flex } */
.popup-wrap .popup-btn a { display:block; } 
.popup-wrap .popup-btn button { width:100%; } 
.popup-wrap .popup-btn button + button { margin-left:10px; } 
.popup-wrap .popup-contents-wrap { display:flex; justify-content:center; height:calc(100% - 178px); margin-top:32px; padding:0 12px; } 
.popup-wrap .popup-scroll { overflow-x:hidden; } 
:where(.popup-box,.popup-wrap) .close { position:absolute; top:37px; right:37px; width:42px; height:42px; font-size:0; } 
:where(.popup-box,.popup-wrap) .close:before,:where(.popup-box,.popup-wrap) .close:after { content:''; position:absolute; top:50%; left:0; width:100%; height:2px; background:var(--color-gray,#aaa); border-radius:5px; z-index:1; } 
:where(.popup-box,.popup-wrap) .close:before { transform:rotate(45deg); } 
:where(.popup-box,.popup-wrap) .close:after { transform:rotate(-45deg); } 
.popup-wrap .popup-sub-tit { font-size:23px; font-weight:400; line-height:36px; color:#333; word-break:keep-all; } 
/*약관 팝업*/
:where(.popup-box,.popup-wrap) .close { top:34px; right:32px; width:24px; height:24px; } 
:where(.popup-box,.popup-wrap) .close:before { top:0; width:100%; height:100%; background:url(/html/images/common/popup_close.svg) no-repeat center; transform:none; } 
:where(.popup-box,.popup-wrap) .close:after { display:none; } 
.popup-wrap.agree .popup-inner { max-height:562px; padding:32px 12px 10px; } 
.popup-wrap.agree .popup-tit { font-size:18px; font-weight:700; line-height:1.5em; color:var(--color-gray-900, var(--color-gray-900)); text-align:center; } 
.popup-wrap.agree .agree-popup-conts { width:100%; height:460px; margin-top:32px; padding:12px 20px; font-size:14px; line-height:1.5em; color:var(--color-gray-800,#474C51); overflow-x:hidden; word-break:keep-all; } 
.popup-wrap.agree .agree-popup-conts p { font-size:14px; line-height:1.5em; color:var(--color-gray-800,#474C51); word-break:keep-all; } 
.popup-wrap.agree .agree-popup-conts strong { font-weight:600; color:var(--color-dark-gray,var(--color-gray-900)); } 
/* .popup-wrap.agree .agree-popup-conts::-webkit-scrollbar { width:4px; } 
.popup-wrap.agree .agree-popup-conts::-webkit-scrollbar-thumb { background-color:var(--color-gray-500, #B1BAC4); outline:transparent; border-radius:4px; } */
/* .popup-wrap.agree .popup-btn { margin-top:36px } */
@media only screen and (max-width:767px) { 
    .popup-wrap .popup-tit { font-size:15px; } 
    .popup-wrap .popup-inner { height:auto; max-height:calc(100vh - 100px); padding:24px 10px; border-radius:8px; } 
    .popup-wrap .popup-contents-wrap { height:calc(100vh - 282px); margin-top:20px; padding-right:6px; padding-left:6px; } 
    /* .popup-wrap .close { top:17px; right:17px; width:32px; height:32px } */
    /* :where(.popup-box,.popup-wrap) .close { top:17px; right:17px; width:32px; height:32px } */
    .popup-wrap .popup-btn { margin-top:30px; } 
    .popup-wrap .popup-sub-tit { font-size:17px; line-height:25px; } 

    :where(.popup-box,.popup-wrap) .close { top:25px; right:20px; width:20px; height:20px; } 
    .popup-wrap.agree .popup-inner { max-width:328px; max-height:487px; padding:24px 6px 10px; } 
    .popup-wrap.agree .popup-tit { font-size:15px; } 
    .popup-wrap.agree .agree-popup-conts { height:420px; margin-top:20px; padding:12px 14px; } 
}

.main-class-box { display:inline-block; width:33.33%; width:calc((100% - 40px) / 3); vertical-align:top; } 
.main-class-box .thumb { overflow:hidden; height:auto; border-radius:6px; aspect-ratio:1.9/1.07; } 
.main-class-box .thumb a { display:block; } 
.main-class-box .thumb img { width:100%; transition:transform .5s; } 
.main-class-box .class-info { position:relative; padding:22px 10px 0; } 
.main-class-box .class-name { font-size:14px; line-height:26px; color:var(--color-dark-gray,#333); } 
.main-class-box .class-name strong { display:inline-block; margin-right:6px; padding:0 10px; background:var(--color-primary,#0148d4); border-radius:4px; font-weight:400; color:#fff; } 
.main-class-box .name { margin-top:15px; margin-bottom:7px; font-size:15px; color:#000; } 
.main-class-box .class-subject { overflow:hidden; display:-webkit-box; width:100%; height:40px; font-size:16px; font-weight:700; line-height:20px; color:var(--color-dark-gray,#333); -webkit-line-clamp:2; -webkit-box-orient:vertical; text-overflow:ellipsis; word-break:keep-all; } 
.main-class-box .price { display:block; margin-top:20px; font-size:16px; color:#111; text-align:right; } 
.main-class-box .price .discount { margin-right:5px; color:var(--color-red,#dc3545); } 
.main-class-box .price strong { font-size:24px; font-weight:400; word-break:keep-all; } 
.main-class-box .price del { color:var(--color-light-gray,#ccc); text-decoration:line-through; } 
.main-class-box .lecture-label { display:flex; position:absolute; top:-15px; left:10px; z-index:1; } 
.main-class-box .lecture-label li { display:inline-block; margin-right:4px; padding:0 13px; background:var(--color-sky-blue,#0098e0); border-radius:4px; font-size:14px; font-weight:700; line-height:30px; color:#fff; vertical-align:top; } 
.main-class-box .lecture-label li:first-child { background:var(--color-primary,#0148d4); } 
@media only screen and (max-width:1024px) { 
    .main-class-box { padding-right:20px; } 
}
@media only screen and (max-width:640px) { 
    .main-class-box { margin-bottom:40px; padding-right:15px; } 
    .main-class-box .class-info { padding:18px 7px 0; } 
    .main-class-box .class-name { font-size:13px; line-height:22px; } 
    .main-class-box .class-name strong { margin-right:4px; padding:0 7px; } 
    .main-class-box .name { margin-top:12px; margin-bottom:5px; font-size:13px; } 
    .main-class-box .class-subject { height:34px; font-size:14px; line-height:17px; } 
    .main-class-box .price { margin-top:12px; font-size:14px; } 
    .main-class-box .price strong { font-size:20px; } 
    .main-class-box .lecture-label { top:-13px; left:7px; } 
    .main-class-box .lecture-label li { padding:0 10px; font-size:12px; line-height:26px; } 
}

/*sweetalert custom*/
/* .swal2-popup.custom { padding:32px 36px; border-radius:12px; } 
.swal2-popup.custom .swal2-header { align-items:flex-start; padding:0; } 
.swal2-popup.custom .swal2-title { margin-bottom:12px; line-height:140%; font-size:20px; font-weight:700; color:var(--color-gray-900, var(--color-gray-900)); } 
.swal2-popup.custom .swal2-content { padding:0; } 
.swal2-popup.custom #swal2-content { line-height:1.5em; font-size:18px; color:var(--color-gray-800, #474C51); text-align:left; } 
.swal2-popup.custom .swal2-actions { justify-content:flex-end; padding:0; margin-top:75px; gap:12px; } 
.swal2-popup.custom .swal2-styled { margin:0; padding:7px 20px; line-height:1.5em; } 
.swal2-popup.custom .swal2-styled.swal2-confirm { font-size:16px; border:1px solid var(--color-primary, #724AE8); border-radius:20px; } 
.swal2-popup.custom .swal2-styled.swal2-cancel { font-size:16px; color:var(--color-dark-gray, var(--color-gray-900)); background-color:#fff; border:1px solid var(--color-gray-300, #E3E8EE); border-radius:20px; } 
.swal2-popup.custom .swal2-styled:focus { box-shadow:none; } 
.swal2-popup.custom .swal2-actions:not(.swal2-loading) .swal2-styled:hover { background:transparent; } */
/*alert 팝업*/
.swal2-popup.custom { padding:32px 36px; border-radius:12px; } 
.swal2-popup.custom .swal2-header { align-items:flex-start; padding:0; } 
.swal2-popup.custom .swal2-title { margin-bottom:12px; font-size:20px; font-weight:700; line-height:1.4em; color:var(--color-gray-900, var(--color-gray-900)); } 
.swal2-popup.custom .swal2-content { padding:0; } 
.swal2-popup.custom #swal2-content { font-size:18px; line-height:1.5em; color:var(--color-gray-800, #474C51); text-align:left; } 
.swal2-popup.custom .swal2-actions { justify-content:flex-end; gap:12px; margin-top:75px; padding:0; } 
.swal2-popup.custom .swal2-styled { margin:0; padding:9px 20px; line-height:1.5em; } 
.swal2-popup.custom .swal2-styled.swal2-confirm { border:1px solid var(--color-primary, #724AE8); border-radius:40px; font-size:14px; line-height:21px; } 
.swal2-popup.custom .swal2-styled.swal2-cancel { background-color:#fff; border:1px solid var(--color-gray-300, #E3E8EE); border-radius:20px; font-size:14px; line-height:21px; color:var(--color-dark-gray, var(--color-gray-900)); } 
.swal2-popup.custom .swal2-styled:focus { box-shadow:none; } 
.swal2-popup.custom .swal2-actions:not(.swal2-loading) .swal2-styled:hover { background:transparent; } 
/*confirm 팝업*/
.swal2-popup.custom-confirm { overflow:hidden; display:flex; justify-content:center; align-items:center; height:270px; padding:0 0 65px; border-radius:12px; } 
.swal2-popup.custom-confirm .swal2-title { display:flex; margin-bottom:8px; font-size:18px; font-weight:700; line-height:1.5em; color:var(--color-dark-gray); text-align:center; } 
.swal2-popup.custom-confirm .swal2-content { padding:0 1.6em; font-size:18px; line-height:1.5em; color:var(--color-gray-700); text-align:center; } 
.swal2-popup.custom-confirm .swal2-actions { flex-wrap:nowrap; gap:0; position:absolute; bottom:0; left:0; width:100%; padding:0; border-top: 1px solid var(--color-gray-300); } 
.swal2-popup.custom-confirm .swal2-styled { width:50%; height:64px; margin:0; background:#fff !important; font-size:18px; font-weight:500; color:var(--color-dark-gray); } 
.swal2-popup.custom-confirm .swal2-styled:last-of-type { border-left:1px solid var(--color-gray-300); color:var(--color-primary, #2778c4); } 
.swal2-popup.custom-confirm .swal2-styled:focus { box-shadow:none; } 
/*팝업*/
.on-popup { overflow:hidden; } 
.popup-basic { display:none; position:fixed; top:0; right:0; bottom:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, .8); z-index:110; overflow-y:auto; } 
.popup-basic.on { display:flex; } 
.popup-basic .popup-area { display:flex; justify-content:center; align-items:center; width:100%; height:100%; } 
.popup-basic .popup-inner { width:calc(100% - 60px); max-width:444px; padding:32px 38px; background:#fff; border-radius:12px; } 
.popup-basic .popup-title { margin-bottom:12px; font-size:20px; font-weight:700; line-height:1.4em; color:var(--color-gray-900, var(--color-gray-900)); } 
.popup-basic .popup-text { font-size:18px; line-height:1.5em; color:var(--color-gray-800, #474C51); } 
.popup-basic .popup-btns { display:flex; justify-content:flex-end; gap:12px; margin-top:48px; } 
.popup-basic .popup-btns .btn { padding:7px 20px 8px; background:transparent; border:1px solid var(--color-gray-300); border-radius:40px; font-size:16px; line-height:1.55em; color:var(--color-gray-800, #474C51); } 
.popup-basic .popup-btns .btn.confirm { background:var(--color-primary, #2778c4); border-color:var(--color-primary, #2778c4); color:#fff; } 
.popup-basic .form-wrap { margin-top:20px; } 
.popup-basic .form-wrap .form-box + .form-box { margin-top:12px; } 

.popup-select { display:none; position:fixed; top:0; right:0; bottom:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, .8); z-index:201; overflow-y:auto;  } 
.popup-select .popup-area { display:flex; justify-content:center; align-items:center; width:100%; height:100%; } 
.popup-select .popup-inner { display:flex; justify-content:center; align-items:center; position:relative; width:calc(100% - 60px); max-width:444px; min-height:270px; padding:0 0 65px; background:#fff; border: 1px solid var(--color-gray-300); border-radius:12px; flex-direction:column; } 
.popup-select .popup-title { margin-bottom:8px; padding:0 20px; font-size:18px; font-weight:700; line-height:27px; color:var(--color-dark-gray); text-align:center; } 
.popup-select .popup-text { padding:0 20px; font-size:18px; line-height:24.8px; color:var(--color-gray-700); text-align:center; } 
.popup-select .popup-btns { display:flex; flex-wrap:nowrap; position:absolute; bottom:0; left:0; width:100%; padding:0; border-top: 1px solid var(--color-gray-300); } 
.popup-select .popup-btns .btn { width:50%; height:64px; background:transparent; font-size:18px; font-weight:500; color:var(--color-dark-gray); } 
.popup-select .popup-btns .btn + .btn { border-left:1px solid var(--color-gray-300); color:var(--color-primary, #2778c4); } 

/*toast popup*/
.swal2-popup.swal2-toast.custom-toast { justify-content:flex-start; min-width:360px; padding:19px 20px; background:rgb(27,27,29,0.8); border-radius:8px; box-shadow:none; } 
.swal2-popup.swal2-toast.custom-toast .swal2-icon { width:auto; height:auto; min-width:auto; margin:0; border:none; } 
.swal2-popup.swal2-toast.custom-toast .swal2-title { margin-right:0; margin-left:11px; font-size:16px; font-weight:400; color:#fff; text-align:left; } 

/*tag*/
.tag-box { display:flex; flex-wrap:wrap; gap:6px;} 
.tag { display:inline-block; padding:4px 10px 5px; font-size:13px; line-height:19px; color:rgba(255, 255, 255, 0.8); background:transparent; border:1px solid rgba(255, 255, 255, 0.15); border-radius:4px;} 
.tag.primary { background:var(--color-primary,#744AE8); color:#fff; } 
.tag.primary-light { background:var(--color-primary-50,#F8F5FF); color:var(--color-primary,#744AE8); } 
.tag.bd-primary { background:#fff; border-color:var(--color-primary,#744AE8); } 
.tag.gray { color:var(--color-gray-800,#474C51); } 
.tag.blue { background:var(--color-sb-50,#F0FBFF); color:var(--color-secondary-blue,#2FBFF4); } 
.tag.pink { background:var(--color-sp-50,#FCF5FF); color:var(--color-secondary-pink,#DA86F9); } 

.gray-box { width:100%; padding:20px 24px; background:var(--color-gray-100); border-radius:8px; } 

.font-number { font-family:'Montserrat'; } 
.ellipsis1 { overflow:hidden; width:100%; white-space:nowrap; text-overflow:ellipsis; } 
.ellipsis2 { overflow:hidden; display:-webkit-box; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; } 

.bullet-list li + li { margin-top:8px; } 
.bullet-list li { position:relative; padding-left:17px; font-size:18px; line-height:1.5em; color:#fff; } 
.bullet-list li:before { content:''; position:absolute; top:11px; left:0; width:5px; height:5px; background:#fff; border-radius:50%;} 
.bullet-list.sm li {padding-left:14px; line-height:23px; font-size:15px; color:rgba(255, 255, 255, 0.8);}
.bullet-list.sm li + li { margin-top:6px; } 
.bullet-list.sm li:before {top:9px; width:4px; height:4px; background-color:rgba(255, 255, 255, 0.8);}

/* 강의 유닛 */
.lecture-item .item-inner {display:block;}
.lecture-item .image-box {width:100%; border-radius:8px; aspect-ratio:282/168; overflow:hidden;}
.lecture-item .image-box img {width:100%; height:100%; transition:all .4s cubic-bezier(.215,.61,.355,1);}
.lecture-item .item-inner:hover .image-box img {transform:scale(1.025); filter:brightness(.75);}
.lecture-item .sub-image-box {position:absolute; top:-18px; right:16px; width:36px; height:36px; border-radius:50%; border:0.5px solid rgba(255, 255, 255, 0.7); box-shadow:0px 0px 20px 0px rgba(0, 0, 0, 0.03); overflow:hidden;}
.lecture-item .sub-image-box img {width:100%; height:100%; object-fit:cover;}
.lecture-item .item-info {position:relative; padding-top:10px;;}
.lecture-item .item-info:has(>.sub-image-box) {padding-top:20px;}
.lecture-item .item-info .item-title {line-height:25px; font-size:16px; font-weight:400; color:#fff; overflow:hidden; display:-webkit-box; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.lecture-item .item-info .tag-box {display:flex; gap:6px; margin-top:12px;}
.lecture-item .item-info .tag {padding:2px 8px; font-size:12px; line-height:19px; color:rgba(255, 255, 255, 0.8); background:transparent; border:1px solid rgba(255, 255, 255, 0.15); border-radius:4px;}
@media only screen and (max-width:767px) { 
    /*alert 팝업*/
    .swal2-popup.custom { overflow:hidden; display:flex; justify-content:center; align-items:center; width:280px; min-height:170px; padding:4px 0 56px; border-radius:12px; } 
    .swal2-popup.custom .swal2-title { display:flex; margin-bottom:6px; font-size:15px; font-weight:700; color:var(--color-dark-gray); text-align:center; } 
    .swal2-popup.custom .swal2-content { padding:0 1.6em; } 
    .swal2-popup.custom #swal2-content { font-size:14px; text-align:center; } 
    .swal2-popup.custom .swal2-actions { flex-wrap:nowrap; gap:0; position:absolute; bottom:0; left:0; width:100%; padding:0; border-top: 1px solid var(--color-gray-300); } 
    .swal2-popup.custom .swal2-styled { width:100%; height:56px; margin:0; background:#fff !important; font-size:18px; font-weight:500; color:var(--color-primary, #2778c4); } 
    .swal2-popup.custom .swal2-styled:focus { box-shadow:none; } 
    .swal2-popup.custom .swal2-styled:is(.swal2-confirm,.swal2-cancel) { border:none; border-radius:0; font-size:15px; font-weight:500; } 
    .swal2-popup.custom .swal2-styled:last-of-type { border-left:1px solid var(--color-gray-300); } 

    /*toast popup*/
    .swal2-popup.swal2-toast.custom-toast { padding:12px 14px; } 
    .swal2-popup.swal2-toast.custom-toast .swal2-title { margin-left:8px; font-size:13px; } 

    /* 팝업 ~767px */
    .popup-select .popup-inner { width:calc(100% - 40px); max-width:280px; min-height:180px; padding:0 20px 57px; border-radius:12px; } 
    .popup-select .popup-title { margin: 8px 0 4px; padding:0; font-size: 15px;line-height: 150%; } 
    .popup-select .popup-text { padding: 0; font-size: 14px;line-height: 150%; } 
    .popup-select .popup-btns .btn {  height:56px; font-size:15px;  } 

    /*tag*/
    .tag { font-size:12px; } 
    .gray-box { padding:16px 12px; border-radius:6px; } 

    .bullet-list li { padding-left:14px; font-size:15px; } 
    .bullet-list li:before { top:8px; } 
    .bullet-list li + li { margin-top:4px; } 
    .bullet-list.sm li {font-size:14px;}
    .bullet-list.sm li + li { margin-top:2px; } 
    .bullet-list.sm li:before { top:8px; } 

    /* 강의 유닛 */
    .lecture-item .image-box {border-radius:6px;}
    .lecture-item .item-info {padding-top:10px;}
    .lecture-item .sub-image-box {top:-14px; right:8px; width:28px; height:28px;}
    .lecture-item .item-info:has(>.sub-image-box) {padding-top:18px;}
    .lecture-item .item-info .item-title {line-height:20px;font-size:13px;} 
    .lecture-item .item-info .tag-box {gap:4px; margin-top:8px;}
    .lecture-item .item-info .tag {padding:2px 6px; line-height:17px; font-size:11px;}
}