@charset "utf-8"

/* font */
@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 100;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');} @font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 300;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');} @font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 400;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');} @font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 500;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');} @font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 700;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');} @font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 900;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype');} body, h1, h2, h3, h4, h5, h6, input, textarea, select { font-family: 'Noto Sans KR', sans-serif; }

/* basic */
body {
    font-family: "Noto Sans KR", sans-serif !important;
    letter-spacing:-.5px;
    word-break:break-all;
    width:100%; overflow-x:hidden;
    font-size:16px;
}

input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { /* WebKit browsers */ color:transparent; }
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color:transparent; }
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder { /* Mozilla Firefox 19+ */ color:transparent; }
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder { /* Internet Explorer 10+ */ color:transparent; }

a {color:inherit;}
a:hover, a:focus {text-decoration:none; color:inherit;}
button {background:transparent; border:0;}

input[type=text], input[type=password], input[type=email], textarea {-webkit-appearance: none; border-radius:3px; border:1px solid #ccc;}
input[type="text"]::placeholder, textarea::placeholder{color:#aaa;}
input:focus, button:focus {outline:none !important;}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {-webkit-appearance: none; margin: 0;}
textarea {resize:none;}

ul {padding:0; list-style:none;}
.list-inline {margin-left:0;}

/* bootstrap */
.container {
    margin:0 auto;
    padding-left: 22px;
    padding-right: 22px;
}

.container, .back-wrap section, .main-sub-banner{max-width:1284px; width:100%; margin:0 auto}
.container-fluid {
    margin-right: auto;
    margin-left: auto;
    padding-left: 22px;
    padding-right: 22px;
}
.input-group .form-control:focus {z-index:0;}
.btn.active, .btn:active {box-shadow:none;}

.form-control {height:34px; line-height:34px; border-radius:3px; font-size:14px; box-shadow:none; padding:0 10px;}
.form-control:focus {border-color:#ccc; box-shadow:none;}

.radius {border-radius:100%; overflow:hidden; border:1px solid #ddd;}
.radius5 {border-radius:5px; overflow:hidden;}
.radius10 {border-radius:10px; overflow:hidden;}
textarea.radius {border-radius:5px;}


/* swiper */
.swiper-pagination-bullet {width:10px; height:10px; background:#fff; opacity:0.9;}
.swiper-pagination-bullet-active {background:#3770c1; opacity:1;}

.sub-swiper .swiper-nav {position: absolute; top: 0; height: 100%; left: 0; right: 0; width:65%;}
.sub-swiper .main-swiper .swiper-nav{width:100%;}


/* etc */
img {max-width:100%;}
.flex-wrap {display: -webkit-box; display: -ms-flexbox; display: flex; height: 100%; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.relative, .layer-pop-relative {position:relative;}
.img-responsive {width:100%;}
.inline {display:inline-block !important; vertical-align:middle;}
.block {display:block !important;}
.md-block, .xs_block{display:none !important}
.vtop {vertical-align:top !important;}
.middle {vertical-align:middle !important;}
.tac{text-align:center !important;}
.tal{text-align:left !important}
.tar{text-align:right !important}
.ovh{overflow:hidden;}
.fl{float:left;}
.fr{float:right;}
.nowrap {white-space: nowrap; text-overflow:ellipsis; overflow:hidden;}
.nowrap2 {
    display:-webkit-box !important; -webkit-line-clamp:2; -webkit-box-orient:vertical;
    height:34px; line-height:17px; overflow:hidden; text-overflow:ellipsis;
}
.nowrap3 {
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
    height:51px; line-height:17px; overflow:hidden; text-overflow:ellipsis;
}
.height-auto{height:auto !important}
.row, .psr{position:relative;}
.dim{position:fixed; top:0; bottom:0;left:0; right:0; background:rgba(0,0,0,0.3); z-index:99;}
.shadow{box-shadow:0 0 8px 8px rgba(0,0,0,.02)}
@keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@-webkit-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}

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

@keyframes loading-text-opacity {
    0%  {opacity: 0} 20% {opacity: 0} 50% {opacity: 1} 100%{opacity: 0}
}
@-webkit-keyframes loading-text-opacity {
    0%  {opacity: 0} 20% {opacity: 0} 50% {opacity: 1} 100%{opacity: 0}
}
.loading-container,
.loading {
    height: 100px; position: fixed; z-index:9999; left:50%; top:50%;
    margin:-50px 0 0 -50px !important; width: 100px; border-radius: 100%;
}
.loading-container { margin: 40px auto }
.loading {
    border: 2px solid transparent; border-color: transparent #fff transparent #FFF;
    -webkit-animation: rotate-loading 1.5s linear 0s infinite normal;
    -webkit-transform-origin: 50% 50%;
    animation: rotate-loading 1.5s linear 0s infinite normal;
    transform-origin: 50% 50%;
}
.loading-container:hover .loading {border-color: transparent #E45635 transparent #E45635;}
.loading-container:hover .loading,
.loading-container .loading {-webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}

#loading-text {
    -webkit-animation: loading-text-opacity 2s linear 0s infinite normal;
    animation: loading-text-opacity 2s linear 0s infinite normal;
    color: #ffffff; font-size: 10px; font-weight: bold;
    margin-top: 45px; opacity: 0; position: absolute; text-align: center;
    text-transform: uppercase; top: 0; width: 100px;
}
.cursor {cursor:pointer;}
.bold {font-weight:bold;}
.normal {font-weight:normal;}
.b500 {font-weight:500 !important;}
.mg0{margin:0 !important}
.mt0 {margin-top:0px !important;}
.mb0 {margin-bottom:0px !important;}
.mt5 {margin-top:5px !important;}
.mb5 {margin-bottom:5px !important;}
.mt10 {margin-top:10px !important;}
.mb10 {margin-bottom:10px !important;}
.mt15 {margin-top:15px !important;}
.mb15 {margin-bottom:15px !important;}
.mt20 {margin-top:20px !important;}
.mb20 {margin-bottom:20px !important;}
.mt25 {margin-top:25px !important;}
.mb25 {margin-bottom:25px !important;}
.mt30 {margin-top:30px !important;}
.mb30 {margin-bottom:30px !important;}
.mt-40 {margin-top:-40px !important;}
.mt50 {margin-top:50px !important;}
.mb50 {margin-bottom:50px !important;}
.mr5 {margin-right:5px !important;}
.ml5 {margin-left:5px !important;}
.mr10 {margin-right:10px !important;}
.ml10 {margin-left:10px !important;}
.mr20 {margin-right:20px !important;}
.ml20 {margin-left:20px !important;}
.mt-5 {margin-top:-5px !important;}
.mt-10 {margin-top:-10px !important;}
.mt-15 {margin-top:-15px !important;}
.pt30{padding-top:30px !important;}
.pb10{padding-bottom:10px !important;}
.pb20{padding-bottom:20px !important;}
.pb30{padding-bottom:30px !important;}

.pd0{padding:0 !important}
.pd15{padding:15px !important}
.pr0 {padding-right:0 !important;}
.pl0 {padding-left:0 !important;}
.pr10 {padding-right:10px !important;}
.pl10 {padding-left:10px !important;}
.pr20 {padding-right:20px !important;}
.pl15 {padding-left:15px !important;}
.pl20 {padding-left:20px !important;}
.pr15 {padding-right:15px !important;}
.pr30 {padding-right:30px !important;}
.pt15 {padding-top:15px !important;}

.col-1>li, .col-1>div {width:100%;}
.col-2>li, .col-2>div {width:50%;}
.col-3>li, .col-3>div {width:33.333%;}
.col-4>li, .col-4>div {width:25%;}
.col-5>li, .col-5>div {width:20%;}
.col-6>li, .col-6>div {width:16.666%;}
.col-7>li, .col-7>div {width:14.285%;}
.col-8>li, .col-8>div {width:12.5%;}
.col-9>li, .col-9>div {width:11.111%;}
.col-10>li, .col-10>div {width:10%;}

/* font-color */
.text-primary {color:#3770c1 !important;}
.text-danger {color:#db0909 !important;}
.text-gray {color:#999 !important;}
.text-gray7 {color:#777 !important;}
.text-yellow {color:#f7d649 !important;}
.text-yellow1 {color:#f7aa0f !important;}
.text-black {color:#222 !important;}
.text-pink {color:#ff486c !important;}
.text-pink1 {color:#ef3c55 !important;}
.text-blue {color:#42a4dc !important;}
.text-blue1 {color:#1d73bb !important;}
.text-sky {color:#71e3ff !important;}
.text-green {color:#14cc3f !important;}
.text-orange {color:#ec8915 !important;}
.text-red{color:#ff2222 !important}
.text-purple{color:#bc1daf !important}

a.text-primary:focus, a.text-primary:hover {color:#3770c1;}

/* bullet */
.items .blt{
    width:80px; height:26px; line-height:26px; color:#fff;
    border-radius:0 10px 0 10px; text-align:center;
    position:absolute; top:0; right:0; font-size:13px;
}
.items .blt01{background:#50d3b3}
.items .blt02{background:#53bcd2}
.items .blt03{background:#a051ce}
.items .blt04{background:#c753b4}
.items .blt05{background:#d37654}
.items .blt06{background:#d3ab54}
.items .blt07{background:#8255e4}
.items .blt08{background:#4f71d2; font-size:12px;}
.touch_blt{position:absolute; top:-10px; left:20px; width:140px; height:34px; line-height:34px; color:#fff; background:#01b4ff; border-radius:100px; text-align:center; z-index:1; font-size:15px; font-weight:normal; margin:0}
.product-info .touch_blt{top:-15px; left:25px}
.product-info .col-sm-5{padding:0 22.08px}

/* backgound */
.back-blue{background:#e1effa}
.back-green{background:#e1faf2}
.back-gray{background:#f0f2f3}
.creator{background:#eaeaea}
.back-primary{background:#3770c1 !important}
.back-pink{background:#ff486c !important}
.back-black{background:#6a6f78}

/* btn */
.btn {font-size:16px; background:#f5f5f5; border:1px solid #d9d9d9; border-radius:3px; color:#5a5858; padding:5px 10px; min-width:80px;}
.btn-default, .btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default:active:focus  {background:#4e4f51 !important; border:1px solid #4e4f51 !important;  color:#fff !important;}
.btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary:active:focus  {background:#1d73bc !important; border:1px solid #1d73bc !important;  color:#fff !important;}
.btn-danger, .btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger:active:focus  {background:#db0909 !important; border:1px solid #db0909 !important;  color:#fff !important;}
.btn-green, .btn-green:hover, .btn-green:focus, .btn-green:active, .btn-green:active:focus  {background:#35ab50; border:1px solid #35ab50;  color:#fff;}
.btn-link, .btn-link:hover, .btn-link:focus, .btn-link:active, .btn-link:active:focus  {border-bottom:1px solid #3770c1 ; text-decoration:none; color:#3770c1 ;}
.btn-link.text-black, .btn-link.text-black:hover, .btn-link.text-black:focus, .btn-link.text-black:active, .btn-link.text-black:active:focus  {border-bottom:1px solid #000 ; text-decoration:none; color:#000 ;}
.btn-border {border:1px solid #ddd; background: #fff; }
.btn-border-primary, .btn-border-primary:hover, .btn-border-primary:focus {border:1px solid #1d73bc; color:#1d73bc; background: #fff; }
.btn-border-danger, .btn-border-danger:hover, .btn-border-danger:focus {border:1px solid #db0909; color:#db0909; background: #fff; }
.btn-purple, .btn-purple:hover, .btn-purple:focus{background:#a051ce; color:#fff}
p.btn{cursor:default}
.gradient_pink, .gradient_pink:hover, .gradient_pink:focus{background:linear-gradient(135deg, #ff6034, 60%, #ff31a0); border:0; color:#fff}
.gradient_blue, .gradient_blue:hover, .gradient_blue:focus{background:linear-gradient(135deg, #0993fe, 60%, #00d0a6); border:0; color:#fff}
.btn-none, .btn-none:hover, .btn-none:focus{background:#cfcfcf !important; color:#939393 !important; cursor:default}
.btn-pink, .btn-pink:hover, .btn-pink:focus{background:#ff486c; border:1px solid #ff486c; color:#fff}
.btn-excel, .btn-excel:hover, .btn-excel:focus, .btn-excel:active, .btn-excel:active:focus  {background:#208327 !important; border:1px solid #208327 !important;  color:#fff !important;}
.btn-border-excel, .btn-border-excel:hover, .btn-border-excel:focus {border:1px solid #208327; color:#208327; background: #fff; }

.btn-xs {font-size:12px; padding:1px 3px 2px; min-width:auto;}
.btn-sm {font-size:15px; padding:2px 5px; min-width:50px;}
.btn-lg {padding:7px 20px 8px;}
.btn-xl {font-size:18px; padding: 8px 10px 9px;}
.btn-group-buy{font-size:0}
.btnarea-group{margin:40px 0}
.btn-group-buy > * + *{margin-left:10px}
.btnarea-group > * + *{margin-left:20px}
.btn-group-buy .btn, .btnarea-group .btn{font-size:17px; min-width:180px; padding:13px 20px;}
/*.btn-group-buy > * + *{margin-left:10px}*/
.btn-group-buy .ssamPay {font-size:17px; min-width:180px; padding:13px 20px;display: none}
.btn-group-buy .btn.active{display: inline-block}
.btn-group-buy.flex > *{width:100%; min-width:auto}

.btn-pop {border:1px solid #ddd; border-radius:3px;; min-width:200px; margin:auto; background:#fff; padding:6px 12px; font-size:14px;}
.btn-more {display:block; width:100%; padding:10px; border:0; background:#f7f6f6; color:#222;}
.btn.text-left {text-align:left;}
.underline, .underline:hover{text-decoration:underline}

/* font-size */
h2 {font-size:28px; font-weight:bold;}
h3 {font-size:24px; font-weight:bold;}
h3 small {color:#222; font-size:18px;}
h4 {font-size:19px;}
h5 {font-size:16px;}
h6 {font-size:13px;}
small {font-weight:normal;}

.font-0 {font-size:0px  !important;}
.font-12 {font-size:12px  !important;}
.font-13 {font-size:13px !important;}
.font-14 {font-size:14px !important;}
.font-15 {font-size:15px !important;}
.font-16 {font-size:16px !important;}
.font-17 {font-size:17px !important;}
.font-18 {font-size:18px !important;}
.font-20 {font-size:20px !important;}
.font-22 {font-size:22px !important;}
.font-24 {font-size:24px !important;}

/* layout */
aside {float: left; width: 200px;}
.aside-container  {float: right; width: calc(100% - 250px); min-height:300px;}
.view-scroll-top{
    position:absolute; left:50%; transform:translateX(-50%); bottom:-100px;
    width:67px; height:83px; text-indent:-9999px; z-index:999;
    background:url("//tvcache.teacherville.co.kr/ssam/ssam2.0/img/scroll-top.png")
}
.view-scroll-top1{
    position:fixed; left:50%; margin-left:410px; bottom:30px;
    width:67px; height:83px; text-indent:-9999px; z-index:999;
    background:url("//tvcache.teacherville.co.kr/ssam/ssam2.0/img/scroll-top.png")
}

/* header */
header #tnb {background:#474747; /*font-family:'malgun gothic';*/}
header #tnb ul {margin:0; font-size:0px;}
header #tnb li {position:relative; border-right:1px solid #565656; padding:0}
header #tnb li:first-child{border-left:1px solid #565656}
header #tnb li a{color:#c9c9c9; display:inline-block; width:90px; line-height:40px; font-size:15px; text-align:center; letter-spacing:-1px}
header #tnb li:first-child:before, header #tnb li.active:before {display:none;}
header #tnb li.active {background:#fff; z-index:2;}
header #tnb li.active a{color:#646464}
header #tnb ul.pull-right li{border:0; position:relative}
header #tnb ul.pull-right li a{font-size:14px; width:auto; padding:0 10px}
header #tnb ul.pull-right li + li::before{content:''; position:absolute; top:15px; left:0; width:1px; height:12px; background:#908f8f;}
header #tnb ul.pull-right li:last-child {color:#33a3ff;}
.beta{position:absolute; top:1px; right:0; width:28px; height:7px; color:#ee3f68; font-size:10px; font-weight:500; font-style:normal; line-height:1}
.cm_blt{
    position:absolute; left:50%; transform:translateX(-50%); font-size:12px; color:#fff; margin:0; padding:5px 10px; font-weight:normal;
    border-radius:5px; background:#ee3f68; min-width:110px; text-align:center; animation:slide-top 1.5s infinite; z-index:2; white-space:nowrap; display:none
}
.cm_blt::before{
    content:''; position:absolute; top:-5px; left:50%; transform:translateX(-50%); width:0; height:0;
    border-top:10px solid none; border-bottom:10px solid #ee3f68; border-right:10px solid transparent; border-left:10px solid transparent
}
@keyframes slide-top {0%, 100%{top:25px} 50%{top:30px}}
.blt_hover:hover .cm_blt{display:block}

header #tnb li:hover > span{display:block}
header #tnb li.active .beta{background:url('//tvcache.teacherville.co.kr/teacherville2/classmaker/image/beta_on.png')}

header #logo-search>div {margin-top:35px; margin-bottom:35px; position:relative;}
header h1{margin:0;}

.search-total{position:relative; max-width:400px;}
.search-wrap{height:60px; display:grid; grid-template-columns:auto 29px; gap:20px; align-items:center; padding:0 30px; border-radius:100px; border:1px solid #ddd; background:#fff; box-shadow:0 0 8px 8px rgba(0,0,0,.02);}
.search-wrap input{border:0; background-color:#fff; font-size:18px; padding:0}
.search-wrap .btn-search{font-size:0; text-indent:-9999px; background-image:url("../../image/ssam/renewal/ic_top_search.svg"); background-repeat: no-repeat; background-size:contain; background-color:#fff; width:29px; height:29px;}
.search-wrap .back-search{display:none;}
.search-total.active{max-width:610px}
.search-total.active .search-wrap{border-radius:30px 30px 0 0; max-width:610px}
.search-total.active .keyword-list{display:block;}
.keyword-list{position:absolute; top:60px; left:0; width:100%; border-radius:0 0 30px 30px; background:#fff; border:1px solid #ddd; border-top:none; padding:20px 30px; display:none; z-index:999;}
.keyword-list > div + div{margin-top:20px;}
.recent-list{display:flex; flex-direction:column; gap:5px;}
.recent-list li{display:flex; align-items:center; justify-content:space-between; gap:20px;}
.recent-list a{display:flex; align-items:center; gap:10px; color:#777}
.recent-list .del{width:12px; height:12px; background:url('../../image/ssam/renewal/recent_del.svg'); background-size:contain; font-size:0;}
.ic-search{display:inline-block; width:20px; height:20px; background:url('../../image/ssam/renewal/ic_search.svg'); background-size:contain;}
.popular-list{display:flex; flex-wrap:wrap; gap:10px;}
.popular-list a{display:inline-block; height:30px; line-height:30px; border-radius:100px; padding:0 15px; background:#d2f3ff; color:#217a9a}

header .tnb-my{margin:0; display:flex; gap:10px; justify-content:right; margin-right:-10px;}
header .tnb-my>li {position:relative; padding:0; vertical-align:top; text-align:center; padding:10px}
header .tnb-my>li>a>label {
    font-size:12px; color:#fff; background:#f45757; position:absolute; top:-6px; right:-6px;
    border-radius:30px; padding:0 3px; font-weight:normal; cursor:pointer; min-width:20px; height:20px; line-height:20px;
    text-align: center; word-break:keep-all; text-indent:-1px;
}
header .tnb-my>li>a>label.label-hotpink{right:8px; font-size:10px; animation:blink 0.9s infinite}
@keyframes blink{0%{opacity:0.1} 100%{opacity:1}}
header .tnb-my>li>a {font-size:12px; display:block; background-repeat:no-repeat; position:relative;}
header .tnb-my>li img{width:28px; height:28px; display:block;}
header .tnb-my>li:nth-child(2) > img{margin-left:3px;}
header .tnb-my>li:nth-child(3){font-size:10px;}

header #gnb{position:relative}
.gnb-menu{display:flex; justify-content:space-between;}
.menu-area{display:flex; gap:70px; margin:0;}
.menu-area > li > a{position:relative; display:block; font-size:18px; font-weight:500; padding-bottom:10px;}
.new_blt{position:absolute; top:-2px; right:-12px; font-size:10px; color:#f45757; font-family:'Gmarket Sans'; font-weight:bold;}
.sub-menu{position:absolute; top:36px; z-index:11; text-align:left; width:100%; left:0; white-space:nowrap; height:60px; line-height:60px; padding:0 22px; display:none;}
.sub-menu::before{content:''; position:absolute; top:0; height:100%; left:50%; transform:translateX(-50%); width:100vw; background:rgba(255,255,255,.9); border-top:1px solid #ddd;}
.sub-menu li{display:inline-block; color:#666; padding-left:5px; margin-right:30px; position:relative;}
.sub-menu li::before{content:''; position:absolute; top:30px; left:0; width:2px; height:2px; background:#666; border-radius:100%}

.my-user{padding:10px; margin:-10px;}
.my-user > a{font-size:12px; vertical-align:top}
.my-user > a > img{border:2px solid #333}
.my-user > a > img, .m-mypage img{border-radius:100%}
.m-mypage img{border:1px solid #ddd;}
.layer-my-bell {top:50px;}
.layer-my-user {top:40px; right:-15px; z-index:9999;}
.layer-my-user .icn-download {position:absolute; top:13px; right:0;}
.layer-my-user .row>div:first-child {border-right:1px solid #ddd; padding:20px 20px 20px 15px; margin:-20px 0;}
.layer-my-user .row>div:last-child {border-left:1px solid #ddd; padding:0; margin:-20px 0 -20px -1px;}
.layer-my-user .poptab{overflow:hidden;}
.layer-my-user .poptab li{
    float:left; width:50%; text-align:center; border-bottom:1px solid #cdd4d8;
    padding:8px 0; background:#f8f8f8; color:#999; cursor:pointer; font-size:14px;
}
.layer-my-user .poptab li.on{border-bottom:none; font-weight:bold; background:none; color:#333;}
.layer-my-user .poptab li + li{border-left:1px solid #cdd4d8}
.layer-my-user .poptab_con div{padding:15px; height:330px;}
.layer-my-user .poptab_con li{font-size:14px}
.layer-my-user .row{width: calc(100% + 35px)}

/** 등록Header **/
header.header-edit {border-top:8px solid #646464; padding-top:15px; padding-bottom:15px; border-bottom:1px solid #ddd; margin-bottom:30px;}
header.header-edit #logo {margin:0;}
header.header-edit .badge {padding-left:10px; padding-right:10px;}
header.header-edit .icn-download-lg {width:15px; height:15px; background-size:100%; margin:0;}

header.header-edit .edit-info .icn-del {position:absolute; right:0; bottom:0;}

header.header-edit .layer-save {top:30px;}
header.header-edit .list-save li {border-bottom:1px solid #ddd; padding:5px 0;}
header.header-edit .list-save li:last-child {border:0;}
header.header-edit.fixed-top {position:fixed; background:#fff; z-index:99; top:0; left:0; right:0; max-width:1036px; width:100%}
/*.modal-open header.header-edit.fixed-top {left:-17px;}*/

.familysite-btn, .gnb-familysite{display:none;}

@media (min-width: 768px) {
    .header-edit {width: 720px; padding:10px;}
    #modalGroupChannelAddForm .col-sm-5{width:38%}
    #modalGroupChannelAddForm .col-sm-7{width:62%}
}
@media (min-width: 992px) {
    .header-edit {width: 940px;}
}
@media (min-width: 1200px) {
    .header-edit {width: 1036px;}
}

/* footer */
footer {border-top:1px solid #ddd;}
footer .container {padding:26px 0}
footer ul.list-inline {margin-left:-10px; margin-bottom:27px;}
footer .list-inline li {position:relative; padding:0 10px;}
footer li a{color:#000}
footer .list-inline li:before {content:''; position:absolute; left:-1px; top:3px; height:14px; width:1px; background:#ddd;}
footer li:first-child:before {display:none;}
footer address {color: #888; line-height: 22px; font-size:13px;}
footer address span{display: inline-block; margin-right:20px;}
footer address p{margin-top:11px; color:#888}
footer address p img{margin-right:10px; vertical-align:bottom;}
.tel-area{text-align:right;}
.tel-area .tel{line-height:20px; display:inline-flex; align-items:center; gap:10px; font-size:17px; font-family:'Gmarket sans'; padding-left:30px; background:url('../../image/ssam/renewal/footer_tel.svg') no-repeat left center; background-size:contain}
.tel-area .tel strong{font-size:18px}
.tel-area .tel-tit{margin:15px 0 5px; font-size:12px; font-weight:bold; color:#aaa}
.tel-area .sm-tel{
    display: inline-block; vertical-align: top; margin-left: 10px; padding: 0 10px; height: 22px; line-height:20px;
    border-radius:100px; border: 1px solid #ddd; font-size: 12px; color: #777;
}
.tel-area .lg-tel{display: inline-block; height: 30px; padding: 0 10px 0 20px; border-radius:12px; border: 1px solid #ddd; background: #f8f8f8; margin-top:26px}
.tel-area .lg-tel span{
    display: inline-block; padding-right: 15px; font-size: 13px; line-height: 28px; color: #787878;
    background:url('../../image/ssam/renewal/arrow.svg') no-repeat right center;  background-size:4px 8px;
}

/* label */
.label {font-size:12px; font-weight:500; border-radius:30px; display:inline-block; padding:6px 15px 7px;}
.label.label-default {background:#9a45c1;}
.label.label-danger {background:#e22727;}
.label.label-primary {background:#1d73bc;}
.label.label-success {background:#58832a;}
.label.label-warning {background:#fe761c;}
.label.label-pink {background:#f76a81;}
.label.label-info {background:#8da0af;}
.label.label-black {background:#000;}
.label.label-gray {background:#666;}
.label.label-hotpink {background:#e60061;}
.label-border {border:1px solid #ddd; background:#fff; color:#666; font-size:14px; margin:0;}
.label-sm {background:#636465; padding:4px 8px; font-weight:normal;}
.label-reply {background:#737171; padding:.03em .5em .05em; font-weight:normal; border-radius:3px; position:relative; margin-left:20px;}
.label-reply:before {content:'└'; position:absolute; color:#777; top:0; left:-20px; font-size:18px;}
.new-label{width:50px; height:22px; line-height:20px; background:#fff; text-align:center; border-radius:5px; font-size:13px; font-weight:normal;}
.label-charge{border:1px solid #e22727; color:#e22727;}
.label-free{border:1px solid #273de2; color:#273de2;}

.badge {background:#333; min-width:20px; padding:3px 6px 4px; font-weight:normal; border-radius:30px; margin-top:-1px;}

/*** Radiobox ***/
.radio, .radio-inline, .checkbox, .checkbox-inline {font-size:15px;}
.radio input, .radio-inline input {display:inline-block; vertical-align:middle; position:absolute; -webkit-appearance:none; -moz-appearance:none; appearance:none; width:15px; height:15px; border:1px solid #ddd; border-radius:100%; margin-top:3px; background:#fff;}
.radio input[type="radio"]:checked:before, .radio-inline input[type="radio"]:checked:before {content: ''; position: absolute; width:13px; height:13px; background: #3770c1; top:0px; left:0px;  border-radius:100%; outline:none;}
/*** Checkbox ***/
.checkbox input, .checkbox-inline input {display:inline-block; position:absolute; -webkit-appearance:none; -moz-appearance:none; appearance:none; width:15px; height:15px; border:1px solid #ccc; border-radius:0; margin-top:3px; background:#fff;}
.checkbox input[type="checkbox"]:checked:before, .checkbox-inline input[type="checkbox"]:checked:before {content: ''; position: absolute; width:11px; height:8px; background: transparent; top:1px; left:1px; border:3px solid #999; border-top: none; border-right: none;  transform: rotate(-45deg); border-radius:2px; outline:none;}
.checkbox-inline+.checkbox-inline, .radio-inline+.radio-inline{margin-left:0;}
.checkbox-inline, .radio-inline{margin-right:10px;}
/*** selectbox ***/
.selectbox { background: #fff; position: relative; z-index: 1; display: inline-block; border-radius: 3px; vertical-align: middle;  min-width:131px;}
.selectbox.sm {min-width:60px;}
.selectbox select { padding: 0 10px; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAABlBMVEX///8AAABVwtN+AAAAG0lEQVQYlWNgoBtghAF0EXQ16LrQzaGdExkYAA7LABpOJul5AAAAAElFTkSuQmCC") no-repeat; background-position:right 10px center; border: 1px solid #ddd; border-radius: 3px; -webkit-appearance: none; -moz-appearance: none; appearance: none;  width:100% !important;}
.selectbox select::-ms-expand { display: none; }
.selectbox:before {display:none;}
.selectbox.block {min-width:auto;}

.maskimg {position:relative; overflow:hidden;}
.maskimg img {width:100%; min-height:100%; position:absolute;}
/* items */
.items {padding:0; list-style:none; font-size:0;}
ul.items {margin:30px -10px}
ul.items:after{content:''; display:block; clear:both}
.items li{
    width:25%; float:left; padding:10px; vertical-align:top;
    margin-bottom:10px; position:relative; border:1px solid #fff;
}
.items.swiper-wrapper .maskimg{padding-bottom:75%;}
.items li .maskimg{padding-bottom:100%}
.items.cont-list li .maskimg, .items#meetingObj li .maskimg{padding-bottom:75%;}
.items > *:hover .maskimg img, .cont-list > div:hover .maskimg img{
    -webkit-transform: scale(1.1); transform: scale(1.1); -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;
}
.items .maskimg label, .cont-list > div .maskimg label{position:absolute; top:7px; left:7px}

.caption h5 {font-size:15px; font-weight:normal; color:#333; margin:15px 0; word-break:break-all; height:36px; line-height:18px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; text-overflow: ellipsis; overflow: hidden;}
.caption p {margin-bottom:0; color:#686868; word-break:break-all; font-size:14px;}
.maskimg .price {font-size:18px; color:#0a3f72; height:25px;}
.maskimg .price strike {color:#686868;}
.maskimg .price{
    background:rgba(255,255,255,0.9); position:absolute; bottom:0; right:0;
    height:30px; line-height:28px; padding:0 12px; margin:0; border-radius:5px 0 10px 0;
}
.maskimg .price b{color:#0a3f72;}
.maskimg .price strike {font-size:13px; color:#999; margin-right:2px;}
.caption .grade {color:#a8a8a8; margin-top:10px;}
.caption .grade i {color:#f5b035;}
.caption .date:before {display: table; content: " ";}
.caption .date:after {content: " "; display: table; clear: both;}
.caption .avatar, .avatar  {width:35px; height:35px; border:1px solid #e7e6e4; border-radius:50%; margin-right:5px}
.caption span {display:inline-block; vertical-align:middle;}
.caption span.nowrap{max-width:calc(100% - 80px)}

.items-creators {text-align:center;}
.items-creators>div, .items-creators>li {padding:10px 30px;}
.items-creators li .maskimg{padding-bottom:70%; margin:0 15%;}
.items-creators li .caption h5 {margin:10px 0;}

.items li.disabled {background:#e9e9e9; border-radius:10px;}
.items li .checkbox {position:absolute; top:10px; left:20px; z-index:2;}
.checkbox.radius {border:0; overflow:visible;}
.checkbox.radius input {width:25px; height:25px; border-radius:100%; cursor:pointer;}
.checkbox.radius input:checked:before {top:6px; left:6px;}

.list-wrap{position:relative}
.list-wrap, .search-list-wrap {margin-top:50px; margin-bottom:50px;}
.items-total {font-size:18px;}
.items-total b {color:#3770c1;}
.items-total span {font-size:13px; display:inline-block; vertical-align:middle; margin:-5px 10px 0;}
.items-sort li {color:#686868;}
.items-sort .active {color:#3770c1;}
.items-sort li:before {content:''; width:1px; height:12px; background:#888; display:inline-block; margin-right:10px;}
.items-sort li:first-child:before {display:none;}

.price-radio{display:inline-block; position:absolute; left:150px;}
.price-radio li{display:inline-block;}
.price-radio input{display:none;}
.price-radio label{
    position:relative; background:#ddd; height:30px; line-height:28px; color:#827e7e;
    vertical-align:top; border-radius:10px 10px 0 0;
    font-size:15px; font-weight:400; width:75px; text-align:center; cursor:pointer
}
.price-radio li:nth-child(1) input:checked + label{background:#3770c1; color:#fff;}
.price-radio li:nth-child(2) input:checked + label{background:#e22727; color:#fff;}
.price-radio li:nth-child(3) input:checked + label{background:#28c292; color:#fff;}

.group-swiper .swiper-slide .maskimg{height:calc(100% - 161px)}
.group-swiper .caption .date span{font-size:13px;}

/*** FAQ ***/
.faq-wrap {border-top:1px solid #ddd; color:#222; background:#fff; margin-top:20px; margin-bottom:50px;}
.faq-wrap dt {position:relative; font-weight:normal; display:table; width:100%; padding:30px 65px; border-bottom:1px solid #ddd; cursor:pointer; margin-bottom:-1px;}
.faq-wrap dt:before {content:'Q'; position:absolute; left:0px; top:18px; width:46px; height:46px; line-height:42px; font-size:18px; font-weight:bold; border-radius:100%; text-align:center; border:2px solid #3770c1;}
.faq-wrap dt:after {content:"\f107"; font-family:"FontAwesome"; position:absolute; right:15px; top:50%; margin-top:-18px; font-size:25px; color:#999;}
.faq-wrap dt.active:after {content:"\f106";}
.faq-wrap dt b {display:table-cell; width:180px; font-weight:normal;}
.faq-wrap dt p {display:table-cell;}
.faq-wrap dt.active p {font-weight:bold; color:#000;}
.faq-wrap dd {display:none;}
.faq-wrap dd>div {position:relative; padding:0px 30px 20px 65px; border-top:1px solid #fff; border-bottom:1px solid #ddd;}
.faq-wrap dd>div:before {content:'A'; position:absolute; left:0px; top:5px; width:46px; height:46px; line-height:42px; font-size:18px; font-weight:bold; border-radius:100%; text-align:center; border:2px solid #3770c1;}

/*** Tabs ***/
.tabs-header {font-size:0;margin:0;padding:0;display: table;width: 100%;table-layout: fixed; text-align:center}
.tabs-header li {text-align:center; font-size:17px; display:inline-block; vertical-align:top; width:auto; /* min-width:104px; */ border-top:2px solid transparent; border-bottom:2px solid transparent;}
.tabs-header li.active {border-top:2px solid #3770c1; border-bottom:2px solid #3770c1; color:#3770c1;}
.tabs-header li a {display:inline-block; width:100%; height:40px; line-height:40px;}
.tabs-content>div {display:none;}
.tabs-content>div.active {display:block;}

.col-1 > li, .col-1 > div {width:100%;}
.col-2 > li, .col-2 > div {width:50%;}
.col-3 > li, .col-3 > div {width:33.333%;}
.col-4 > li, .col-4 > div {width:25%;}
.col-5 > li, .col-5 > div {width:20%;}
.col-6 > li, .col-6 > div {width:16.666%;}
.col-7 > li, .col-7 > div {width:14.285%;}
.col-8 > li, .col-8 > div {width:12.5%;}
.col-9 > li, .col-9 > div {width:11.111%;}
.col-10 > li, .col-10 > div {width:10%;}


.sub-cate ul {border:1px solid #ddd; padding:20px 30px; font-size:0; margin:0;}
.sub-cate ul li {font-size:17px; width:14.285%; letter-spacing:-1px; color:#827e7e; padding:3px 0;}
.sub-cate ul li:hover a, .sub-cate ul li:hover span {color:#000; border-bottom:1px solid #000; cursor:pointer;}
.sub-cate ul li.active span {border-top:2px solid #3770c1; border-bottom:2px solid #3770c1; color:#3770c1;}

.sub-cate2 {margin:30px 0;}
.sub-cate2 ul {padding:20px 0px; font-size:0; margin:0;}
.sub-cate2 ul li {font-size:18px; width:130px; color:#000; text-align:center; }
.sub-cate2 ul li a {border:3px solid transparent; display:inline-block; width:100%; padding:3px 0; }
.sub-cate2 ul li:hover a, .sub-cate2 ul li.active a {color:#000; border-radius:30px; border-color:#3770c1;}

.filter-price {text-align:center; font-size:15px; border:1px solid #ddd; margin-top:-1px; padding:15px 10px; display:none;}
.filter-price>* {display:inline-block; vertical-align:middle;}
.filter-price b, .filter-price label {margin:0 10px;}
.filter-price input[type=number] {width:70px; height:22px; padding:3px 5px;}
.filter-price button {border:0; background:transparent;}

/* ListStyle */
.list-table {padding:0; border-top:2px solid #b8b6b6; list-style:none; margin:20px 0; font-size:14px; color:#777;}
.list-table li {border-bottom:1px solid #e9e8e8; padding:20px 0;}
.col-table {display:table; width:100%; table-layout: fixed;}
.col-table>* {display:table-cell; vertical-align:middle; padding:0 8px;}
.col-table label {width:55px; margin-right:5px;}
.col-table h5 {color:#333; width:600px; white-space: nowrap; text-overflow:ellipsis; overflow:hidden; padding-right:30px; position:relative; height:25px;}
/*.col-table .badge {background:#333; width:22px; height:22px; line-height:22px; padding:0; font-weight:normal; border-radius:30px; margin-top:-1px;}*/

.col-table b {color:#333;}
.list-table .content {word-break:break-all; padding-left:65px; padding-right:30px; margin:10px 0 0;}

.li-list {overflow:hidden;}
.li-list li {border-bottom:1px solid #ddd; padding:10px 0;}

.no-list {text-align:center; font-size:18px; color:#444444; padding:100px 0 !important;}
.no-list p {text-align:center !important;}

.file-list {border:1px solid #ddd; padding:10px 15px; border-radius:3px; font-size:15px; color:#666; min-height:100px}
.file-list ul {margin:0;}
.file-list li {padding:3px 0;}

/** dl-table **/
.w90 {width:90px}
.w100 {width:100px}
.w150 {width:150px}
.dl-table {margin:10px 0;}
.dl-table dl{margin:0; display:table; table-layout:fixed; width:100%; border-bottom:1px solid #ddd; font-size:14px;}
.dl-table dt, .dl-table dd {display:table-cell; padding:15px 5px; vertical-align:middle; position:relative;}
.dl-table p {margin:0;}
.dl-table dt {width:180px}
.dl-table dd {font-weight:normal;}
.dl-table dd h4{word-break: keep-all;}
.dl-table h4{word-break: break-all;}
/*.dl-table h5 {margin:0;}*/
.dl-table label {margin:0;}
.dl-table .vtop label{font-size:10px; padding:2px 4px; vertical-align:top; margin-top:2px;}
.dl-table .price {margin-top:5px;}
.dl-table .price b {font-size:20px;}
.dl-table .price strike {color:gray; font-weight:normal;}
.dl-table .price small {color:gray; font-weight:normal; font-size:14px;}
.dl-table.w15 dt {width:15px;}
.dl-table.w90 dt {width:90px;}
.dl-table.w120 dt {width:120px;}
.dl-table.w150 dt {width:150px;}
.dl-table.w160 dt {width:160px;}
.dl-table.w170 dt {width:170px;}
.dl-table.w180 dt {width:180px;}
.dl-table.w200 dt {width:200px;}
.dl-table .nowrap{width:calc(100% - 23px)}
.dl-table .thumb-circle{width:115px; height:115px;}
/*
.dl-table dt img {border:1px solid #ddd;}
.dl-table dt img.radius {border-radius:100%; overflow:hidden; border:1px solid #ddd;}
*/
.dl-table.dl-sm dl {font-size:13px;}
.dl-table.dl-sm dt {width:50px;}
.dl-table.dl-sm dt .maskimg{width:40px; height:40px;}
.dl-table.dl-xs dt {width:35px;}
table .dl-table {margin:0;}
table .dl-table dl {border:0;}
table .dl-table dt {padding-left:0;}
.dl-table .b-label dt{margin:3px 0; width:85px;}
.dl-table .b-label dl{margin-bottom:10px}
.dl-table .b-label dt, .dl-table .b-label dd{padding:0 5px;}
.dl-table .maskimg{position:relative; padding-bottom:75%;}
.dl-table .maskimg img{position:absolute; top:0; left:0; width:100%; min-height:100%}
.dl-table .thumb-pop-search{padding-bottom:100%}

.talk-list {border-top:2px solid #b8b6b6; margin:20px 0;}
.talk-list dl a{display:table; table-layout:fixed; width:100%;}
.talk-list dt, .talk-list dd {display:table-cell; vertical-align:middle; padding:20px 0;}
.talk-list dt {width:auto; padding-right:20px;}
.talk-list dt h5 {margin:0; width:inherit; white-space: nowrap; text-overflow:ellipsis; overflow:hidden; width:100%;}
.talk-list dt label {margin:0; min-width:60px;}
.talk-list dd {text-align:left; width:410px}
.talk-list dd span {display:inline-block; vertical-align:middle; color:#777; width:31%; padding-left:10px}
.talk-list dd span:nth-child(2){width:33%;}
.talk-list dd span:nth-child(3){width:21%;}
.talk-list .comment-count {color:#333; margin-top:-5px; width:15%; text-align:right;}
.talk-list .comment-count i{vertical-align:top;}

/** table **/
.table{margin-bottom:20px; table-layout:fixed; width:auto !important; min-width:100%}
.table + .table{margin-bottom:0;}
.table>tbody>tr>td, .table>tbody>tr>th {border:0;}
.table-list>tbody>tr>td, .table-list>tbody>tr>th,
.table-add>tbody>tr>td, .table-add>tbody>tr>th{
    border-top:1px solid #ddd; border-bottom:1px solid #ddd;
    vertical-align:middle; padding:15px 15px; position:relative;
}
.table>tbody>tr>th {padding-left:0}
.table>tbody>tr>td {padding-right:0; padding-left:0;}
.table-list h5 {color:#444; }
.table-list img.radius {border-radius:100%; }
.table-list h5, .table-list p{margin:0}
.table-list + .table-add{margin-top:-21px}
.table-add{border-top:2px solid #4e4f51}
.th-colspan {border-bottom:0 !important;}
.td-colspan {border-top:0 !important; padding-top:0 !important;}
.table.text-center>tbody>tr>th, .table.text-center>tbody>tr>td {text-align:center; padding:15px 5px;}
.table.text-center>tbody>tr>td.text-left {text-align:left;}

.table .dl-table dt{padding:0}
.table .dl-table dd{padding:0 0 0 15px}

.tbl-border0 > *{border:0 !important}

table .row {margin-left:-2px; margin-right:-2px;}
table .row>div {padding:0 2px;}

.table-fixed {table-layout: fixed;}
.table-nowrap {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.table-nowrap3 {display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-wrap: break-word; text-overflow: ellipsis; overflow: hidden; height: 60px;}

.top-line2 {border-top:2px solid #999;}
.table-top-noline>tbody>tr>td, .table-top-noline>tbody>tr>th {border-top:0;}
.table-v-noline>tbody>tr>td, .table-v-noline>tbody>tr>th {border-top:0;}
.table-v-noline>tbody>tr:last-child>td, .table-v-noline>tbody>tr:last-child>th {border:0;}
.th-normal th{font-weight:normal}
.noti-star{position:relative; padding-left:12px}
.noti-star::before{content:'*'; position:absolute; top:0; left:0}

table .checkbox {margin:0;}

.pcol-w10 {width:10px;}
.pcol-w80 {width:80px;}
.pcol-w100 {width:100px;}
.pcol-w110 {width:110px;}
.pcol-w150 {width:150px;}
.pcol-w160 {width:160px;}
.pcol-w170 {width:170px;}
.pcol-w180 {width:180px;}
.pcol-w190 {width:190px;}


/** pageing **/
.pagination{display:block; text-align:center; margin:50px 0;}
.pagination>li {padding:0 5px; display:inline-block; cursor:pointer}
.pagination>li>a, .pagination a{color:#333; border:0; border-radius:50%; width:35px; height:25px; line-height:25px; text-align:center; padding:0; display:inline-block}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover,
.pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover, .pagination>li>a:hover,
.pagination a:hover, .pagination a.active{background:#cecfd0; color:#333;}
.pagination>li:first-child>a, .pagination>li:last-child>a {border-radius:50%;;}
.pagination>li i {font-size:20px;}

/* 아이콘 */
.icn-comment {display:inline-block; background:url("../../image/ssam/icn-comment.png") no-repeat; width:21px; height:21px; background-size:100%;}
.icn-clip {display:inline-block; background:url("../../image/ssam/icn-clip.png") no-repeat; width:21px; height:21px; vertical-align:middle; margin-bottom:-1px; background-size:100%;}
.icn-del {display:inline-block; background:url("../../image/ssam/icn-del.png") no-repeat; width:20px; height:20px; vertical-align:middle; margin-bottom:-1px; cursor:pointer; background-size:100%;}
.icn-del-blue {display:inline-block; background:url("../../image/ssam/icn-del-blue.png") no-repeat; width:12px; height:12px; vertical-align:middle; margin-bottom:2px; cursor:pointer; background-size:100%;}
.icn-trash {display:inline-block; background:url("../../image/ssam/icn-trash.png") no-repeat; width:15px; height:14px; vertical-align:middle; margin-bottom:-1px; cursor:pointer; background-size:100%;}
.icn-download {display:inline-block; background:url("../../image/ssam/icn-download.png") no-repeat; width:15px; height:14px; vertical-align:middle; margin-bottom:-1px; cursor:pointer; background-size:100%;}
.icn-download-lg {display:inline-block; background:url("../../image/ssam/icn-download-lg.png") no-repeat; width:20px; height:20px; vertical-align:middle; cursor:pointer; margin:0 10px; margin-top:-1px;  background-size:100%;}
.icn-file {display:inline-block; background:url("../../image/ssam/icn-file.png") no-repeat; width:20px; height:20px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.icn-play {display:inline-block; background:url("../../image/ssam/icn-play.png") no-repeat; width:20px; height:20px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.icn-microphone {display:inline-block; background:url("../../image/ssam/icn-microphone.png") no-repeat; width:20px; height:20px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.icn-img {display:inline-block; background:url("../../image/ssam/icn-img.png") no-repeat; width:20px; height:20px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.icn-attachm {display:inline-block; background:url("../../image/ssam/icn-attachm.png") no-repeat; width:20px; height:20px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.icn-del-circle {display:inline-block; background:url("../../image/ssam/icn-del-circle.png") no-repeat; width:20px; height:20px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.icn-share {display:inline-block; background:url("../../image/ssam/icn-share.png") no-repeat; width:23px; height:23px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.icn-ellipsis {display:inline-block; background:url("../../image/ssam/renewal/icn-ellipsis.png") no-repeat center; width:20px; height:23px; vertical-align:middle; margin-bottom:-1px;  background-size:contain;}
.icn-smile {display:inline-block; background:url("../../image/ssam/icn-smile.png") no-repeat; width:20px; height:20px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.icn-image {display:inline-block; background:url("../../image/ssam/icn-image.png") no-repeat; width:20px; height:20px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.icn-calendar-s {display:inline-block; background:url("../../image/ssam/icn-calendar-s.png") no-repeat; width:16px; height:14px; vertical-align:middle; margin-bottom:2px;  background-size:100%;}
.icn-tv {display:inline-block; background:url("../../image/ssam/icn-tv.png") no-repeat; width:16px; height:14px; vertical-align:middle; margin-bottom:2px;  background-size:100%;}
.icn-print {display:inline-block; background:url("../../image/ssam/icn-print.png") no-repeat; width:16px; height:14px; vertical-align:middle; margin-bottom:2px;  background-size:100%;}
.icn-report {display:inline-block; background:url("../../image/ssam/icn-report.png") no-repeat; width:16px; height:14px; vertical-align:middle; margin-bottom:2px;  background-size:100%;}
.icn-lock {display:inline-block; background:url("../../image/ssam/icn-lock.png") no-repeat; width:12px; height:15px; vertical-align:middle; margin-bottom:3px;  background-size:100%;}
.icn-crown {display:inline-block; background:url("../../image/ssam/icn-crown.png") no-repeat; width:17px; height:18px; vertical-align:middle; margin-bottom:5px;  background-size:100%;}

.sns-f {display:inline-block; background:url("../../image/ssam/sns-f.png") no-repeat; width:27px; height:26px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.sns-k {display:inline-block; background:url("../../image/ssam/sns-k.png") no-repeat; width:27px; height:26px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.sns-kt {display:inline-block; background:url("../../image/ssam/t-kakao.png") no-repeat; width:27px; height:26px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.sns-b {display:inline-block; background:url("../../image/ssam/sns-b.png") no-repeat; width:27px; height:26px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.sns-t {display:inline-block; background:url("../../image/ssam/sns-t.png") no-repeat; width:27px; height:26px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.sns-u {display:inline-block; background:url("../../image/ssam/sns-u.png") no-repeat; width:27px; height:26px; vertical-align:middle; margin-bottom:-1px;  background-size:100%;}
.t-kakao {display:inline-block; background:url("../../image/ssam/t-kakao.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-kakaostory {display:inline-block; background:url("../../image/ssam/t-kakaostory.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-blog {display:inline-block; background:url("../../image/ssam/t-blog.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-facebook {display:inline-block; background:url("../../image/ssam/t-facebook.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-instar {display:inline-block; background:url("../../image/ssam/t-instar.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-youtube {display:inline-block; background:url("../../image/ssam/t-youtube.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-band {display:inline-block; background:url("../../image/ssam/t-band.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-etc {display:inline-block; background:url("../../image/ssam/t-etc.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-tssam {display:inline-block; background:url("../../image/ssam/t-tssam.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-tistory {display:inline-block; background:url("../../image/ssam/t-tistory.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-twitter {display:inline-block; background:url("../../image/ssam/t-twitter.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-url {display:inline-block; background:url("../../image/ssam/t-url.png") no-repeat; width:33px; height:32px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}
.t-ssam {display:inline-block; background:url("../../image/ssam/ssam.png") no-repeat; background-size:100%; width:70px; height:20px; vertical-align:middle; cursor:pointer; margin:0 3px; margin-top:-1px;  background-size:100%;}



/* searchStyle */
.search-box{border:1px solid #ccc; border-radius:3px}
.search-box input {background:#fff; border:none; height:32px;}
.search-box button {border:none; background:#fff; color:#727070; min-width:auto;}
.search-box button i {font-size:17px;}
.items-search .search-box , .items-search .search-radius{width: 250px}


.search-radius input {border-radius:30px 0 0 30px; background:#f9f9f9;}
.search-radius button {border-radius:0 30px 30px 0; border:1px solid #ccc; border-left:0; background:#f9f9f9; color:#727070; min-width:auto; padding:5px 12px; }
.search-radius button i {font-size:17px;}


/* layer-pop */
.layer-pop-wrap {
    position:absolute; right:0; width:430px; border:1px solid #cdd4d8; border-radius:5px;
    padding:20px; background:#fff; z-index:1000; text-align:left; display:none; overflow:auto;
}
.layer-pop-wrap.active {display:block;}
.layer-pop-wrap h4 {margin:0;}
.layer-pop-wrap ul {margin:0;}
.layer-pop-wrap ul li span{width:90%; display:inline-block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.layer-pop-sm {width:300px;}
.layer-pop-wrap .no-list img {width:80px; height:80px;}
.layer-pop-wrap .no-list {font-size:14px; color:#888; padding:30px 0 !important;}

.modify-layer-wrap {position:absolute; right:10px; top:5px; z-index:9;}
.modify-layer-wrap i {cursor:pointer;}
.modify-layer-wrap .layer-modify {display:none;}
.modify-layer-wrap.active .layer-modify {display:block; position:absolute; right:-10px; top:30px;}
.modify-layer-wrap a i{transform: rotate(0)}

/* modal */
.modal{padding:0 !important}
.modal-sm {width:400px}
.modal-rg {width:510px}
.modal-md {width:620px}
.modal-lg {width:750px}
.modal-xl {width:950px}
.modal-header {border:0; padding:0;}
.modal-header .close {position:absolute; top:20px; right:20px; opacity:1; z-index:3;}
.modal-body {padding:20px 30px 50px; color:#222;}

.modal h4 {color:#000; margin:0 0 20px}
.modal span.btn {cursor:default;}
.modal .qna-content-wrap {background:#f5f5f5; padding:10px; min-height:100px;}

.fc-col-header, .fc-scrollgrid-sync-table, .fc-daygrid-body{width:100% !important}
.fc-view-harness-active{}


input.datepick {display:inline-block; vertical-align:middle; border-radius:3px 0 0 3px;}
input.datepick.disable{background:#f5f5f5; color:#999}
input.datepick.disable + .ui-datepicker-trigger{background:#f5f5f5}
.ui-datepicker-trigger {font-size:0; border-radius:0 3px 3px 0; border:1px solid #ccc; height:34px; padding:5px; margin-left:-1px; background:#fff; border-left:0;}


.board-view-wrap, .talk-view-wrap {border-top:2px solid #b8b6b6;}
.board-view-wrap dl, .talk-view-wrap dl {border:0;}
.board-view-wrap dd span , .talk-view-wrap dd span {display:inline-block; margin-right:15px; color:#888;}
.board-view-wrap .layer-pop-wrap, .talk-view-wrap .layer-pop-wrap {padding:10px;}
.talk-view-wrap .dl-table{margin:10px 0}
.talk-view-wrap dl{table-layout:auto;}
.talk-view-wrap dt{width:90px;}
.btn-file-attach.active {color:#3770c1;}
.layer-file-attach {color:#888;}
.layer-file-attach li:hover {color:#000; cursor:pointer}
.layer-file-attach li:hover i {color:#3770c1 ;}


/*** 메인페이지 ***/
.main-swiper-wrap {overflow:hidden; background:#efefef}
.main-swiper {background:#1d73bb; padding:10px 0; position:relative; margin-bottom:50px;}
.main-swiper>div {margin-bottom:-50px; overflow: visible;}
.main-swiper .swiper-slide {border-radius:20px; overflow:hidden; margin-top:35px;}
.main-swiper .swiper-slide a:after {content:''; display:block; border-radius:10px; position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.6);}
.main-swiper .swiper-slide-active  {display:block; box-shadow:0px -15px 15px -10px rgba(0,0,0,0.3);}
.main-swiper .swiper-slide-active a:after {display:none;}
.main-swiper .swiper-nav {position: absolute; top: 35px; height: 100%; left: 0; right: 0; width:93%;}
.main-swiper .swiper-nav>div {background-color: rgba(255,255,255,1); border-radius: 100%; width: 35px; height: 35px; background-size: 31%; opacity: 0.5;}

.main-sub-banner {border-radius:10px;overflow:hidden;padding:0 22px;margin: 60px auto 40px auto;}

/* .goods-swiper .goods-swiper-nav {position: absolute; top: -20px; right: 0; width: 45px;} */
.goods-swiper .goods-swiper-nav>div {position:absolute; top:35%; width:30px; height:30px; background-color:rgba(0,0,0,0.4); z-index:2; opacity:1; background-size:50% 50%}
.goods-swiper .goods-swiper-nav .latelySwPrev {left:-15px}
.goods-swiper .goods-swiper-nav .latelySwNext {right:-15px}
.goods-swiper .goods-swiper-nav>div.swiper-button-disabled {opacity:0.3;}

.main_curation .title-area{background: linear-gradient(90deg, #ffff 10%, #1d73bb 10%);  border: 3px solid #1d73bb;  border-radius: 20px; overflow: hidden; display: table; width: 100%; display: none; table-layout: fixed;}
.main_curation .goods-swiper{display: none !important;}
.main_curation .title-area.active{display:table !important;}
.main_curation .goods-swiper.active{display: block !important;}
.main_curation .left-div{display: table-cell; border-radius: 0 100px 100px 0; background: #fff; padding:0 25px; vertical-align: middle}
.main_curation .left-div > *{display: inline-block}
.main_curation .left-div .month{color: #aaa; font-size: 22px; font-weight: bold; padding-right:31px; margin-right: 30px; position:relative}
.main_curation .left-div .month::before{content: ''; position: absolute; height: 60px; right: 0; width: 1px; top: 50%; transform: translateY(-50%); background: #cecece}
.main_curation .left-div .month span{color: #1d73bb}
.main_curation .left-div .month strong{font-size: 70px; line-height: 1}
.main_curation .left-div .tit{font-size: 32px; font-weight: bold}
.main_curation .left-div .text{font-size: 20px; color: #1d73bb; margin-top: 5px}
.main_curation .right-div{display:table-cell; padding: 10px 20px; width:315px}
.main_curation .right-div button{width: 275px; height: 36px; border-radius: 100px; font-size: 18px; font-weight: 500; color:#333; background: linear-gradient(90deg, #fed000, #fe9b00)}
.main_curation .right-div button i{display: inline-block; width: 12px; height: 12px; background: url('//tvcache.teacherville.co.kr/teacherville2/image/web/icon/list_arrow.png') no-repeat center}
.main_curation .right-div button.curr{background: linear-gradient(90deg, #ededed, #b4b4b4)}
.main_curation .right-div button.curr i{transform: rotate(180deg)}
.main_curation .right-div .tit{color: #fff; font-size: 20px; margin-top: 10px; line-height: 1}
.main_curation .right-div .text{color: #b1ddff; font-size: 18px; line-height: 1}
.main_curation .goods-swiper .goods-swiper-nav{position: initial}
.main_curation .goods-swiper .goods-swiper-nav .swiper-button-next, .main_curation .goods-swiper .goods-swiper-nav .swiper-button-prev{
    position:absolute; right:-5px; top:34%; width:30px; height:30px;
    background:url('https://www.teacherville.co.kr/assets/images/icon/main_banner_arrow.png') no-repeat center rgba(0, 0, 0, 0.3);
}
.main_curation .goods-swiper .goods-swiper-nav .swiper-button-prev{left:-5px; transform:rotate(-180deg)}

/*** 알림페이지 ***/
.notifications-table .icn-del {margin-top:-5px;}
.layer-my-bell .dl-table{height:300px; overflow-y:auto}
/*** 검색페이지 ***/
.search-list-wrap .items li {margin:0;}
.search-list-wrap .tab-content-wrap>div {display:none;}
.search-list-wrap .tab-content-wrap>div.active {display:block;}


/*** 콘텐츠유료등록 ***/
.upload-progress-wrap {position: relative; border:1px solid #ccc; border-radius:3px; text-align:center; padding:10px 10px; font-size: 14px; color:#000; background:#fff;   height:180px; display: -webkit-box; display: -ms-flexbox; display: flex;  -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; /*top:0; left:0; right:0; margin:15px 10px; position:absolute; display:none;*/}
.upload-progress-wrap>div {width:100%;}
.upload-progress-wrap .icn-del{position:absolute; top:10px; right:10px}
#myProgress {width: 300px; margin:10px auto; background-color: #e2e2e2; border-radius:20px;}
#myBar {width: 0%; height: 12px; background-color: #e8c62a; border-radius:20px;}


.img-attach dt{width:150px;}
.img-attachm-box .btn-profile-thumb{right:10px; bottom:15px; margin-right:0; line-height:38px;}
.img-attachm-box {border:1px solid #ccc; height:200px; text-align:center; font-size:14px; border-radius:3px; overflow:hidden;}
.img-attachm-box .maskimg {width:100%; height:100%;}
.img-attachm-upload {position:relative; text-align:left;}
.img-attachm-upload .icn-del-circle {position:absolute; top:5px; right:5px; z-index:1}
.img-attachm-upload .maskimg {height:130px; width:100%;}
.img-attachm-upload .caption {padding:5px 10px}

.thubm-edit-wrap {font-size:0;}
.thubm-edit-wrap li {display:inline-block; vertical-align:top;  padding-right:20px; position:relative; width:25%}
.thubm-edit-wrap li i{position:absolute; top:5px; right:25px; z-index:1;}
.thubm-edit-wrap #myProgress {width:130px;}
.thubm-edit-wrap .price{border-radius:0}

/* .review-edit{display:flex}
.review-edit li{width:100%} */
.review-edit{overflow:hidden;}
.review-edit li{padding:0 !important}
.review-edit .swiper-button-next, .review-edit .swiper-button-prev{position:absolute; top:44%; width:30px; height:30px; background-color:rgba(0,0,0,.4); background-size:50% 50%; z-index:1}
.review-edit .swiper-button-prev{left:-15px}
.review-edit .swiper-button-next{right:-15px}
.tbl_w{width:100% !important}
.review-edit .swiper-button-disabled{opacity:0}
@media (max-width: 767px) {
    .review-edit{width:100vw; margin:0 -10px !important; padding:0 10px}
    .tbl_w{width:auto !important}
    .review-edit .swiper-button-next, .review-edit .swiper-button-prev{display:none}
}

.newblt{width:41px; height:46px; background:url('../../image/ssam/newblt.png') no-repeat center; position:absolute; top:-30px; left:-15px}

.m-contents-cate-wrap li>ul {display:block !important;}
.upload-list-wrap{width:100%; border:1px solid #ccc; min-height:180px; display:inline-block; position:relative}
.upload-list-wrap.none::before{content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:2}
.upload-list{width:100%;}
.upload-list tr > *{text-align:center; padding:0 5px; height:33px; line-height:33px;}
.upload-list th{font-size:13px; font-weight:normal;}
.upload-list th{border-bottom:1px solid #ddd; background:#f0f2f3}
.upload-list td{font-size:15px}
.upload-list td input[type="radio"]{display:none;}
.upload-list td label{
    text-indent:-9999px; border:1px solid #767676; width:13px; height:13px;
    border-radius:100%; cursor:pointer; vertical-align:middle; margin:0;
}
.upload-list td input:checked + label{
    text-indent:0; padding:4px 8px; background:#636465;
    font-size:12px; font-weight:normal; color:#fff; line-height:100%;
    border-radius:100px; width:auto; height:auto; margin-top:0;
}
.upload-list td.tal{text-align:left;}
.upload-list td #myProgress{width:100%;}

/* 콘텐츠유료등록 추가 */
.my-con-list4{}
.my-con-list4 li{margin-bottom:30px;}
.my-con-list4 li .maskimg{position:absolute; height:calc(100% - 139px); width:100%;}
.my-con-list4 li .caption{padding-top:75%;}
.my-con-list4 li h5{
    margin-bottom:20px; height:36px; display:-webkit-box;
    -webkit-line-clamp:2; -webkit-box-orient:vertical;
    word-wrap:break-word; text-overflow:ellipsis; overflow:hidden;
}
.toggle-con > *{margin-bottom:30px; display:none;}
.toggle-con audio{width:100%;}

/*** 콘텐츠상세 ***/
.veiw-wrap {margin-left:-10px; margin-right:-10px;}
.veiw-wrap>div {padding:0 10px;}

.thumb-wrap{height:100%; position:relative;}
.thumb-big{position:relative; padding-bottom:75%; width:100%; overflow:hidden; margin-top:12px;}
.thumb-img{position:relative; padding-bottom:75%; width:100%; overflow:hidden; margin-top:12px;}
.thumb-img img, .thumb-big img{position:absolute; width:100%; min-height:100%}
.thumb-small{position:relative; padding-bottom:75%; width:100%; overflow:hidden}
.thumb-small img{position:absolute; top:0; left:0; right:0; min-height:100%;}
.avatar-sthumb{width:95px; height:95px;}
.avatar-thumb{width:138px; height:138px;}
/* .regist-thumb > dt{width:33.33333333%} */
.thumb-pop-search .btn-profile-thumb{right:10px; bottom:15px; margin-right:0; line-height:40px;}
.ssamtalk-thumb{width:80px; height:80px;}

.goods-slide .caption .price{bottom:84px; right:9px; margin-right:0;}

#scroll {
    position:absolute; right:0px; z-index:999; padding:10px; margin-top:10px;
    border:1px solid #ccc; border-radius:5px; background:#f9f9f9;
}
#back-top {text-align:center; border:1px solid #ddd; margin:2px 0;}
#back-top a {display:block; padding:5px;}
.view-quick .box {border:1px solid #ccc; background:#fff; border-radius:5px; padding:15px 10px; text-align:center;}
.view-quick h4 {font-size:18px; position:relative;}
.view-quick p {margin:0;}
.view-quick h4 .maskimg{height: 134px; overflow:hidden; width:134px; margin-bottom:10px;}
.view-quick .thumb{overflow:hidden; width:134px; height:101px; margin-bottom:10px;}
.view-quick ul li {border-bottom:1px solid #ddd; padding:15px 0;}
.view-quick ul li:first-child {padding-top:0;}
.view-quick ul li:last-child {padding-bottom:0; border:0;}
#scroll.scroll-fix{position:fixed; top:31px; left:50%; margin-left:362px; right:auto; width:156px;}


.fa-heart, .fa-star {color:#bbb; position:relative}
.fa-heart.active, .active .fa-heart {color:#db0909;}
.fa-star.active, .active .fa-star {color:#f2b229;}
.big-star i {font-size:40px; padding:0 10px;}
.md-star i{font-size:30px; padding:0 4px}
.modal .big-star i {padding:0 5px;}
.fa-star.half::after{content:"\f089"; position:absolute; top:0; left:10px; color:#f2b229}

.modal .big-star .btn-pop-star {background:#bbb; color:#fff; border-radius:100%; width:24px; height:24px; text-align:center; line-height:24px; font-size:17px; margin:0 10px; cursor:pointer;}
.modal .btn-pop-star.active {background:#666;}
.modal .btn-pop-star.active:before {content:"\f107"; }
.modal .active.layer-pop-star {display:block;}
.modal .layer-pop-star {position:absolute; right:0; top:50px; background:#fff; z-index:2; border:1px solid #ddd; padding:5px 10px; border-radius:5px; width:160px; text-align:left; display:none;}
.modal .layer-pop-star i {font-size:18px; padding:0 3px;}


.filebox {border:1px solid #ccc; border-radius:1px; text-align:center; padding:45px 10px; font-size: 14px; color:#888;}
.file-wrap {font-size: 14px; color:#888; text-align:center;}
.text-left .file-wrap, .file-wrap.text-left {text-align:left;}
.file-wrap i {font-size:18px; vertical-align:middle; margin-bottom:-1px;}
.filebox label, .file-wrap label, .review-btn, .review-btn:hover{display: inline-block; color: #3770c1 ;  cursor: pointer; border-bottom:1px solid #3770c1; margin-bottom:0;}
.filebox input[type="file"], .file-wrap input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; }

.view-icn-wrap {position:relative;}
.layer-share.active, .layer-ellipsis.active {display:block;}
.layer-share {position:absolute; top:30px; right:0; background:#fff; width:170px; padding:5px; padding-right:0; text-align:center; border:1px solid #ccc; border-radius:5px; display:none;}
.layer-ellipsis {position:absolute; top:30px; right:0; background:#fff; padding:8px; text-align:center; font-size:14px; border:1px solid #ccc; border-radius:5px; display:none;}

.view-contents {word-break:break-all; font-size:18px; color:#333; line-height:32px; border-top:1px solid #ccc; border-bottom:2px solid #555; padding:30px 0; margin:10px 0;}
.view-contents img, .view-contents * {max-width:100%;}
.view-contents a{color:#1d73bc; text-decoration:underline;}
.view-contents iframe, .view-tab-content-wrap iframe, .talk-view-wrap iframe{width:100%; height:483px;}

.hashtag-wrap {font-size:16px;}
.hashtag-wrap>a {padding-right:10px;}
.hashtag-wrap>a:hover {color:#1d73bc;}
.hashtag-wrap>a:before {content:'#'; display:inline-block;}

.m-dl-goods h5 {
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
    max-height:40px; line-height:20px; overflow:hidden; text-overflow:ellipsis;
}
/* .m-dl-goods .m-pos-bottom p {white-space: nowrap; text-overflow:ellipsis; overflow:hidden;} */
.m-dl-goods .m-pos-bottom p.table-nowrap3 {white-space:normal; -webkit-line-clamp:2; height:auto;}

.owl-carousel{background:#eee; padding:30px 0; border-radius:5px;}
.owl-carousel .owl-item img{border:1px solid #ccc;}
.owl-carousel .owl-item span{
    position:absolute; top:10px; right:10px; background:#000; color:#fff; border-radius:100%;
    display:inline-block; width:25px; height:25px; line-height:25px; font-size:15px; text-align:center;

}
.owl-carousel .owl-stage-outer{padding:42px 0}
.owl-carousel .active.center { transform: scale(1.2); -webkit-filter: grayscale(0); filter: grayscale(0);}
.owl-carousel.row-carousel .active.center{transform: scale(1.4);}
.owl-carousel.row-carousel  .owl-item span{transform: scale(.86);}
.owl-carousel .active {transform: scale(.5); transition: .6s ease; -webkit-filter: grayscale(100%); filter: grayscale(100%);}
.owl-theme .owl-controls{margin:0 !important}
.owl-theme .owl-controls .owl-nav [class*='owl-']{
    position:absolute; top:50%; margin-top:-17px !important; text-indent:-9999px; border-radius:100% !important;
    width:35px; height:35px; background-size:31% !important; opacity:0.5;
}
.owl-prev{left:5px; background:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E") no-repeat center #000 !important;}
.owl-next{right:5px; background:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E") no-repeat center #000 !important;}

.attach_list_wrap > li{padding:15px 0}
.attach_list_wrap > li + li{border-top:1px solid #ddd}
.d_table{display:table; width:100%}
.d_table > *{display:table-cell; vertical-align:middle}
.attach_list{padding:10px 0 20px 175px;}
.attach_list > li + li{margin-top:20px; padding-top:20px; border-top:1px solid #ddd}
.attach_list .attach_file{background:#f5f5f5; border:1px solid #ddd; padding:20px; margin-bottom:20px; display:block}
.attach_list .attach_file li{display:flex; justify-content:space-between; align-items:center;}
.attach_list .attach_file li:hover .text-primary{text-decoration:underline}
.attach_list .attach_file li + li{margin-top:10px}
.attach_list .attach_file i{display:inline-block; width:24px; height:24px}
.attach_list .attach_file li div{width:calc(100% - 34px)}
.attach_list .attach_file li .text-primary{display:inline-block; max-width:calc(100% - 110px); overflow:hidden; white-space:nowrap; text-overflow:ellipsis; vertical-align:middle}
.attach_list .attach_file .download{background:url('../../image/ssam/download_i.png') no-repeat center}
.attach_list .attach_file .play{background:url('../../image/ssam/play_i.png') no-repeat center}
.attach_list .video{position:relative; padding-bottom:56%}
.attach_list .video iframe, .attach_list .video video{position:absolute; top:0; left:0; width:100%; height:100%}

/* 무료콘텐츠등록 */
.free-thumb-box {border:1px solid #ccc; border-radius:3px; text-align:center; height:220px; margin-left:20px;}
.reservation-date {display:none;}
.reservation-date.active {display:inline-block;}
.date-select-wrap {font-size:16px;}
.date-select-wrap>a {height:34px; line-height:28px; display:inline-block;}
.date-select-wrap>a.active {font-weight:bold;}

/** 상세정보영역  **/
.product-info {position:relative}
.product-info .goodnm {border-bottom:2px solid #333; padding:0 100px 15px 0; margin-bottom:15px; line-height:1.3;}
.product-info .view-icn-wrap {position:absolute; right:0; top:-2px; z-index:2;}
.product-info dl {font-size:0; margin:0;}
.product-info dl + dl{padding-top:13px}
.product-info dt, .product-info dd {display:inline-block; position:relative; vertical-align:top; }
.product-info dt {width:100px; font-weight:500}
.product-info dd {width:calc(100% - 100px); color:#888;}
.product-info h2 {font-size:26px; color:#000; margin:0; font-weight:bold;}
.product-info .border-top{border-top:1px solid #ddd; margin-top:10px}
.product-info .t-field {width:87%;}
.product-info .price{margin:15px 0; border-bottom:2px solid #333; padding-bottom:15px; text-align:right}
.product-info .num_input{display:flex; align-items:center; font-size:20px; font-weight:bold; color:#000; margin-top:10px}
.product-info .num_input .form-control{font-size:17px; margin-right:10px; height:43px; width:50%}

.user-info{padding:20px; border:1px solid #ddd; border-radius:3px; position:relative}
/* .user-info + .user-info{margin-top:10px; padding:10px 20px} */
.user-info > div + div{margin-top:15px; padding-top:15px; border-top:1px solid #ddd}
.user-info .name{
    font-weight:500; width:calc(100% - 50px); display:inline-block;
    overflow:hidden; white-space:nowrap; text-overflow:ellipsis;
    vertical-align:middle; margin-left:5px; color:#3770c1
}
.user-info .grid{display:grid; grid-template-columns:31% auto; column-gap:20px; align-items:center; margin-bottom:20px}
.user-info .avatar{border-radius:100%; border:1px solid #ddd; overflow:hidden; width:100%; padding-bottom:calc(100% - 2px); height:auto; position:relative}
.user-info .avatar img{position:absolute; top:0; left:0}
.user-info h5{font-size:20px; font-weight:500; margin:0}
.user-info .info{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; height:40px; line-height:20px; color:#888; margin:10px 0 0 0}
.user-info .btnbox{display:flex}
.user-info .btnbox > *{width:100%}
.user-info .btnbox > * + *{margin-left:10px}
.user-info .toggle_box{padding:15px 20px 0}
.toggle_box .toggle_btn{display:flex; justify-content:space-between; align-items:center; cursor:pointer}
.toggle_box i{top:0; right:0; position:relative}
.toggle_con{margin-top:15px; display:none}
.info_li{margin-bottom:0}
.info_li > *{position:relative; color:#888; line-height:1.5; text-align:left}
.info_pop{position:absolute; top:100%; left:-1px; right:-1px; background:#fff; z-index:1; margin:0 !important; border:1px solid #ddd; padding:20px; width:auto !important; border-radius:3px; display:none}
.user-info .pop_close{text-indent:-9999px; width:15px; height:15px; background:url('https://tvcache.teacherville.co.kr/ssam/img/240627_colse.png') no-repeat center; position:absolute; top:20px; right:20px}

.channel_info{margin:30px 0 50px; text-align:center}
.channel_info .toggle_btn{display:inline-flex; padding:10px 20px; border-radius:100px; border:1px solid #6a6f78}
.channel_info .toggle_btn h5{margin:0}
.toggle_btn button{width:16px; height:8px; background:url('https://tvcache.teacherville.co.kr/ssam/img/240627_arrow.png'); text-indent:-9999px; margin-left:10px; transition:transform 0.3s}
.toggle_btn button.active{transform:rotate(180deg)}
.channel_info .info_li{display:inline-block}

.view-quick .info_pop{top:200px; left:-265px !important; width:260px !important; text-align:left}
.view-quick .info_pop li{padding:0 0 0 10px; border:0}

.program-list{border:1px solid #ddd; border-radius:3px; padding:0 5px 0 10px; margin-top:20px}
.program-list ul{height:201px; overflow-y:scroll; padding:0 5px 10px 0; margin-bottom:0}
.program-list ul::-webkit-scrollbar{background:none; width:8px}
.program-list ul::-webkit-scrollbar-thumb{background:#ccc; width:8px; background-clip:content-box; border-radius:100px}
.program-list ul::-webkit-scrollbar-track{background:none}
.program-list ul li{
    padding:15px 20px; margin-top:10px;
    background:#f5f5f5; border:1px solid #ddd; border-radius:3px
}
.program-list .tit{font-size:18px; font-weight:500}

.t-field span+span:before {content:"|"; font-size:14px; display:inline-block; vertical-align:middle; margin-top:-5px; padding:0 8px;}
.t-field2{font-size:0 !important; display:flex; align-items:center}
.t-field2 span{display:inline-block; text-align:center; position:relative; width:100%; font-size:14px}
.t-field2 span + span::before{position:absolute; left:-2px; top:50%; transform:translateY(-50%); padding:0}
h5 + .t-field2{margin-top:10px}
.t-field2 i{display:block; width:10px; height:1px; background:#ddd; margin:3px auto}
/*.t-field span:first-child:before {display:none;}*/
.t-step span+span:before {content:"\f105"; font-family:"FontAwesome"; font-size:14px; display:inline-block; vertical-align:middle; margin-top:-2px; padding:0 3px; color:gray;}
.t-step span {color:gray;}
.t-step span.active {color:#333;}

/** 상품상세정보탭 **/
.view-tab-content-wrap {font-size:16px;}
.view-tab-content-wrap h2{margin:0; padding:70px 0 10px 0}
.fixed .view-tab-navigation>div {position:fixed; top:0px; z-index:99; background: #fff;}
/*.fixed .view-tab-content-wrap {padding-top:45px;}*/

.view-tab-navigation ul{display:flex}
.view-tab-navigation ul, .tabs-header-border {padding: 0; margin: 0; font-size:0; border-bottom:1px solid #ccc;}
.view-tab-navigation li, .tabs-header-border li {min-width:170px; line-height: 40px; text-align: center; list-style: none; display: inline-block; font-size:18px;  margin-bottom:-1px;}
.view-tab-navigation li.active, .tabs-header-border li.active {border:1px solid #333; border-bottom:1px solid #fff;}
.view-tab-navigation li a, .tabs-header-border li a {display: inline-block; width: 100%; padding:0 10px}

/** 유료상품정보 **/
.ul-group-image {margin:5px auto; padding:0; text-align:center;}
.ul-group-image img {width:100%; min-height:100%; cursor:pointer;}
.ul-group-image li {display:inline-block; width:24%; height:53px; overflow:hidden; border:1px solid #ccc;}

.review-box {border:1px solid #ddd; border-radius:5px; padding:25px 40px; margin:10px 0;}
.view-review .review-progress {display:inline-block; float:right; vertical-align:middle; width:60%; height:8px; border-radius:30px; background:#d6d4d4; margin:9px 0 0; position:relative; overflow:hidden;}
.view-review .review-bar {height:100%; background-color: #e8c62a;}
.view-tab-wrap .view-contents {border:0;}
.view-tab-content-wrap .items li {margin:0;}


/*** 결제 ***/
.step-wrap {font-size:0px; color:#666; margin-top:10px;}
.step-wrap span {font-size:14px; display:inline-block; vertical-align:middle; }
.step-wrap span:before {content:"\f105"; display:inline-block; vertical-align:middle; font-family:FontAwesome; padding:0 8px; font-size:19px; color:#999; margin-top:-3px; font-weight:normal;}
.step-wrap span:first-child:before {color:transparent;}
.step-wrap span.active {color:#222; font-weight:bold;}

.pay-wrap h3 {border-bottom:6px solid #333; padding-bottom:15px; margin-bottom:20px;}
.pay-wrap table th, .pay-wrap table td {border-top:0 !important;}
.pay-wrap table th {color:#888; font-weight:normal;}
.pay-wrap .price b {font-size:26px;}

/** 문의하기 **/
.list-qna li {border-bottom:1px solid #ddd; padding:20px 0; position:relative;}
.list-qna h5 {margin:0; padding-right:30px;}
.list-qna h5 small {font-size:13px; color:#999;}
.list-qna .qna-content {color:#777; margin:10px 0;}
.list-qna .btn-reply {font-size:15px;}
/*.list-qna .no-list {background:#f2f2f3; padding:10px !important; border:0; margin:20px 0;}*/

.list-comment li {border-bottom:1px solid #ddd; padding:0; margin:0;}
.list-comment dl {border:0;}
.list-comment dt, .list-comment dd {padding-top:20px; padding-bottom:20px;}
.list-comment dt {width:60px; vertical-align:top; padding-top:20px;}
.list-comment h5 {margin:0; padding-right:30px;}
.list-comment h5 small {font-size:13px; color:#999;}
.list-comment .comment-content {color:#777; font-size:15px; margin:10px 0;}

.list-comment .replay-icn:after {content:'댓글';}
.list-comment .replay-icn:before {top:15px;}
.list-comment .replay-icn:after {top:20px;}

.list-comment .maskimg{width:50px; height:50px;}

.replay-icn {position:relative; padding:10px 0; padding-left:60px; margin-left:20px;}
.replay-icn:before {content:'└'; position:absolute; color:#777; top:5px; left:0px; font-size:18px;}
.replay-icn:after {content:'답변'; background:#737171; padding:1px 6px; border-radius:3px; font-size:12px; color:#fff; position:absolute; top:10px; left:20px;}

.list-qna .comment-reply .qna-content, .list-comment .comment-reply .comment-content {margin-top:8px; margin-bottom:0;}
.comment-reply dt, .comment-reply dd {padding-top:10px;}
.comment-reply, .comment-reply dd {padding-bottom:0;}

.list-qna .no-list, .list-comment .no-list {border:0;}

/*** 쌤모임 ***/
.meet-tnb-icn {padding-right:30px;}

.external-chk-hide{display:none !important;}
.external-chk-hide.on{display:inline-block !important;}
.pay-chk-hide{display:none !important;}
.pay-chk-hide.on{display:table-row !important;}
.ssam-online, .online, .offline{display:none}
.ssam-online.on, .online.on, .offline.on{display:block}

.meet-edit-table .radio-inline {margin-top:7px !important; margin-bottom:7px;}

.meetingList.items li .maskimg{padding-bottom:75%}

/*** 쌤찾자 ***/
.agree-chk-wrap {border-bottom:1px solid #ccc; padding-bottom:10px;}
.agree-chk-wrap .btn-agree-chk {border-radius:30px; font-size:13px; width:80px; }
.agree-chk-wrap ul {display:none;}
.agree-chk-wrap.active ul {display:block;}
.teacher-thumb{padding-bottom:75%; position:relative}
.teacher-thumb img{position:absolute; top:0; left:0; width:100%; height:auto !important}
.t-dl-ssam dt{width:180px; height:180px;}
.profile-image-pos-center::after{content:'사이즈 420 X 320'; position:absolute; bottom:10px; right:10px; font-size:12px;}

.fileDownload{overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}

/*** 쌤톡톡 ***/
.talk-label-group {margin-bottom:20px;}
.talk-label-group button {border:0; background:transparent; margin-right:5px;}
.talk-label-group button:before {content:''; width:15px; height:15px; border-radius:50%; display:inline-block; vertical-align:middle; margin-top:-1px; margin-right:8px;}
.talk-label-default:before {background:#9a45c1;}
.talk-label-pink:before {background:#f76a81;}
.talk-label-warning:before {background:#fe761c;}
.talk-label-success:before {background:#58832a;}

.comment-wrap .imageWrap { display: inline-block; margin: 0 5px; vertical-align: middle; }
.comment-wrap .imageWrap .modifyImageWrap { display: inline-block; position: relative; margin: 0; width: 40px; height: 40px; overflow: hidden; }
.comment-wrap .imageWrap .modifyImageWrap img { max-width: 40px; min-height: 40px; }
.comment-wrap .imageWrap .modifyImageWrap button { position: absolute; left: 0; bottom: -40px; width: 40px; height: 40px; transition: all 0.2s ease-in-out; }
.comment-wrap .imageWrap .modifyImageWrap:hover button { bottom: 0; }

#emoticonLayer { display: none; position: absolute; top: 0; left: 0; width:100%; max-width:500px; background: #fff; border: solid 1px #ccc; }
#emoticonLayer .header { height: 40px; border-bottom: solid 1px #dfdfdf; }
#emoticonLayer .header h3 { display: inline-block; position: relative; top: -20px; left: 10px; padding: 10px 0 0 5px; font-size: 17px; font-weight: normal; }
#emoticonLayer .header .pull-right button { position: relative; top: 5px; }
#emoticonLayer .emoticonWrap {padding:20px; height:350px; overflow:auto; }
#emoticonLayer .emoticonWrap img {padding:10px; width:25%; float:left; border:solid 2px #fff; cursor: pointer; }
#emoticonLayer .emoticonWrap img:hover { border: dotted 2px #ccc; }

/*** 채널 ***/
.channel-thumb {width:190px; height:190px; border-radius:100%; margin:auto; margin-top:-95px; z-index:9; position:relative; overflow:hidden;}
.btn-profile-thumb {display:inline-block; border-radius:100%; width:44px; height:44px; line-height:44px; text-align:center; color:#fff; background:#444; font-size:20px; position:absolute; bottom:0; right:50%; margin-right:-90px;; z-index:10; cursor:pointer;}
.btn-profile-thumb:hover, .btn-profile-thumb:focus {color:#fff;}
.btn-profile-thumb label {cursor:pointer;}
.btn-profile-thumb input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; }

/* 채널상단 */
.channel-bg {height:280px; overflow:hidden; position:relative; top:0; left:0; bottom:0; right:0; background-repeat:no-repeat; background-size:cover; background-position:center;}
.channel-bg:after {content:''; position:absolute; top:0; left:0; bottom:0; right:0; background:rgba(0,0,0,0.4);}

.btn-channel-setting {position:absolute; top:-40px; right:0; color:#fff; z-index:9;}
.btn-channel-setting:hover, .btn-channel-setting:focus {color:#fff;}
.btn-channel-setting i {width:20px; height:20px; border-radius:100%; background:#fff; color:#222; text-align:center; line-height:20px;}
.layer-channel-setting {width:150px; color:#888; top:-10px;}
.layer-channel-setting li:hover {color:#222;}
.layer-channel-setting hr {margin:10px 0; border-color:#ccc;}

.layer-contents-upload {width:160px; color:#888; padding:10px; top:0; right:-170px;}
.layer-contents-upload li {padding:2px 0;}
.layer-contents-upload li:hover {color:#222;}

.sort-list ul {font-size:0;}
.sort-list li {color:#888; font-size:14px; padding:0;}
.sort-list li.active {color:#3770c1; font-weight:bold;}
.sort-list li:before {content:'|'; display:inline-block; padding:0 10px; color:#888;}
.sort-list li:first-child:before {display:none;}

.contents-move-wrap {display:none;}
.contents-move-wrap.active {display:inline-block;}

/* 채널 */
.btn-cate-setting {display:inline-block; vertical-align:middle; margin-top:-10px; }
.btn-cate-setting i {width:24px; height:24px; line-height:24px; text-align:center; border-radius:100%; background:#3770c1; color:#fff; font-size:17px; cursor:pointer; }


/*** 마이페이지 ***/
.mypage-guide { margin:20px 0;}
.mypage-guide>ul {font-size:0; margin:0; border-bottom:1px solid #ddd; position:relative; z-index:2;}
.mypage-guide>ul>li {display:inline-block; border:1px solid #ddd; background:#f0f2f3; width:135px; text-align:center; margin-right:-1px; margin-bottom:-1px;}
.mypage-guide>ul>li a {display:block; padding:10px 25px; text-align:center;}
.mypage-guide li.active {background:#fff; font-weight:bold; border-bottom-color:#fff;}
.guide-info {border:1px solid #ddd; padding:20px 30px; margin-top:-1px; font-size:14px; position:relative;}
.guide-info ul {margin:0;}
.guide-info .icn-del {position:absolute; top:30px; right:30px; cursor:pointer;}
.mypage-guide .contab li{width:20%; max-width:150px; background:none; border:none; position:relative}
.mypage-guide .contab li.active{color:#1479cc; font-weight:500}
.mypage-guide .contab li.active::before{content:''; position:absolute; bottom:1px; left:0; width:100%; height:2px; background:#1479cc}
.mypage-guide .connoti li{padding-left:7px; position:relative}
.mypage-guide .connoti li::before{content:''; position:absolute; top:10px; left:0; width:2px; height:2px; background:#999; border-radius:100%}
.icn-arrow{position:absolute; top:30px; right:30px; cursor:pointer; width:20px; height:20px; background:url(../../image/ssam/noti_arrow.png) no-repeat center; transition:transform 0.3s}
.icn-arrow.active{transform:rotate(180deg)}

.term-search-wrap {border-top:2px solid #777; border-bottom:2px solid #777; padding-top:10px; padding-bottom:10px; margin-bottom:15px}
.term-search-wrap{display:flex; justify-content:space-between; align-items:center; gap:10px;}
.term-search-wrap .form-inline{flex-shrink:0;}
.term-search-wrap .form-inline input{width:100px}
.term-search {font-size:0; display:flex; width:100%}
.term-search button {width:100%; min-width:(100% / 8); font-size:14px; text-align:center; position:relative; padding:5px 0; border:1px solid #ddd; background:#f0f2f3}
.term-search button + button{border-left:0}
.term-search button.on{background:#818181; border:1px solid #818181; color:#fff; font-weight:500}

.date-tlt {text-align:center; border-bottom:1px solid #ccc; height:40px; margin-top:-20px; margin-bottom:30px;}
.date-tlt b {display:inline-block; border:1px solid #ccc; background:#fff; border-radius:30px; padding:7px 10px; font-size:18px; min-width:120px; margin-top:20px; }

.text-state {text-align:center; font-size:15px; padding:10px 0; vertical-align:middle; font-weight:500}
.btn-box.btn-border {border-color:#777; color:#222;}
.btn-box {border-radius:0; padding:10px 0; font-size:15px;}
.btn-box small {font-size:14px; color:#777;}
.btn-box.disabled {background:#f0f2f3; color:#7c7c7c; border-color:#c3c4c5; opacity:.9;}

.leave-box {background:#f5f5f5; padding:30px 5px; text-align:center; margin:50px -30px -50px; border-radius:0 0 6px 6px; color:#666; font-size:15px}

.comment-box {background:#f3f4f5; padding:10px; margin:10px 0;}

.tooltip {word-break:break-all;}

.sort-wrap{width:100%;}
.sort-wrap, .sort-list{display:inline-block;}
.sort-list{float:right;}

.m-profile-table .dl-table > dt{vertical-align:middle; width:180px; height:151px;}
.m-profile-table .dl-table > dt, .m-profile-table .dl-table > dd{padding:0;}

.meet-detail{}
.meet-detail > li{
    display:table; table-layout:fixed; width:100%; position:relative;
    border:1px solid #ddd; padding:15px 20px; border-radius:3px;
}
.meet-detail > li > *{display:table-cell; vertical-align:bottom}
.meet-detail > li + li{margin-top:10px}
.meet-detail .tit{font-weight:500}
.meet-detail dl{margin-bottom:5px}
.meet-detail dl > *{display:inline-block; vertical-align:top}
.meet-detail dl dt{font-weight:500}
.meet-detail dl dd{color:#777; margin-left:5px}
.meet-detail .zoombtn{width:129px}
.meet-detail > li .btn-xs{min-width:50px}
.view-icn-zoom{position:absolute; top:12px; right:10px}
.zoom-file{margin-top:5px}
.zoom-file li{display:inline-block}
.zoom-file li a{color:#1d73bc; text-decoration:underline}
.zoom-file li + li{margin-left:10px}

.cont_detail li > div{border:1px solid #ddd; padding:15px 20px; border-radius:3px}
.cont_detail li + li{margin-top:10px}
.cont_detail .date{font-size:18px; font-weight:500; margin-top:20px}
.cont_detail .tit{overflow:hidden}
.cont_detail .tit p{font-weight:500; display:inline-block; width:calc(100% - 100px); overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.cont_detail .tit p span{font-weight:normal}
.cont_detail a{float:right; color:#1479cc; font-weight:500; text-decoration:underline; font-size:14px}
.cont_detail .t-field{margin-bottom:0}

/*** 장바구니 ***/
.cart-wrap .dl-table .checkbox {position:absolute; top:15px; left:15px; z-index:2;}
.cart-wrap .dl-table dt {vertical-align:top;}
.cart-wrap .dl-table.active {background:#f5f5f5;}
.cart-wrap .total-price {background:#f4f4f4; padding:10px; text-align:center; color:#6b6b6b; margin-top:-20px;}
.cart-wrap .total-price b {font-size:24px; color:#222;}


/*** 정산관리 ***/
.my-channerl-list {margin:30px 0;}
.my-channerl-list ul {border-top:2px solid #aaa; padding:15px 0; margin:0;}
.my-channerl-list li {vertical-align:top; padding:20px 10px; cursor:pointer; position:relative;}
.my-channerl-list li:hover, .my-channerl-list li.active {background:#f0f1f1;}
.my-channerl-list li .maskimg {padding-bottom:100%; margin-bottom:10px;}
.my-channerl-detail {padding:10px 0; display:none; border-top:1px solid #ddd;}
.my-channerl-detail.active {display:block;}
.my-channerl-detail hr {border-color:#ddd;}

.detail-box {background:#f0f1f1; font-size:0; margin-bottom:10px;}
.detail-box>div {font-size:14px; padding:0px 20px; display:inline-block; vertical-align:top; position:relative;}
.detail-box>div+div:before {content:''; width:1px; height:50px; background:#ccc; position:absolute; left:0; top:30px;}
.detail-box dl {margin:0; border:0;}
.detail-box dl a{display:inline-block; width:auto;}
.detail-box h5 {margin:5px 0 5px;}
.detail-box p {margin:2px 0;}
.detail-box dt i {display:block; background:#fff;  width:90px; margin:auto; border-radius:100%; padding:20px;}
.detail-box dt img {border:0;}
.detail-box .dl-table dt, .detail-box .dl-table dd {vertical-align:top;}
.detail-box .dl-table dt{width:auto}

/*** 쌤찾자관리자 프로필영역 ***/
.profile-registe-wrap>div {margin:20px 0;}
.profile-registe-wrap .profile-registe-no {background:#f1f1f3; border:1px solid #d1d8dc; text-align:center; padding:40px 10px;}
.profile-registe-wrap .profile-registe .dl-table {margin:0;}
.profile-registe-wrap .profile-registe .dl-table dl {border:0;}
.profile-registe-wrap .profile-registe .dl-table dt, .profile-registe .dl-table dd {padding:5px;}
.profile-registe-wrap .profile-registe .profile-thumb {height:270px; overflow:hidden;}
.profile-registe-wrap .profile-registe .btn-profile-thumb {top:10px; bottom:auto; right:30px; margin:0;}
.avatar-wrap{position: relative;}
.avatar-wrap .maskimg{position:absolute; width:100%; height:calc(100% - 62px);}
.avatar-wrap h5{padding-top:calc(100% + 10px); margin-top:0;}

.profile-type li + li{margin-left:40px}

/*** 프로필관리 ***/
.t-words {color:#555; height:45px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; text-overflow: ellipsis; overflow: hidden;}

.profile-wrap {margin-top:50px; margin-bottom:50px;}
.profile-step {font-size:0; margin:20px 0; display:table; table-layout:fixed; width:100%;}
.profile-step span {display:table-cell; vertical-align:middle; font-size:18px; text-align:center; padding:15px 5px; width:33.333%; background:#f5f5f5; border:1px solid #d1d8dc;}
.profile-step span+span {border-left:0;}
.profile-step span.active {background:#3770c1; color:#fff;}
.profile-step span.active:after {content:"\f105"; display: inline-block; font-family:"FontAwesome"; font-size:22px; height:20px; line-height:20px; padding-left:10px;}

.profile-teacher-list .btn-more {margin-top:-50px;}

.btn-record-all {color:#555;}
.btn-record-all i {font-size:20px;}
.btn-record-all.active i:before {content:"\f056";}
.t-record-list li {padding-bottom:3px;}
.t-record-list li.hide.active {display:block !important;}

.label-pos-right {position:absolute; top:20px; right:20px; z-index:2; font-size:14px;}
.imgae-type {height:295px; overflow:hidden;}
.imgae-type img {height:100%;}

.seq-icon i {padding: 5px; background: #e8e9ec; border-radius: 5px; cursor:pointer;}

.profile-wrap .tabs-header li {border-top:1px solid #333; border-bottom:1px solid #333; padding:5px;}


/* 검색개선 */
header .srhbar-list{
    position:absolute; background:#fff; z-index:10;
    left: 15px; right: 15px; box-sizing:border-box; padding:15px;
    border:2px solid #1479cc; border-top:none; display:none;
    text-align: left; top: 33px;
}
header .srhbar-list > .tit{font-size:15px; color:#333; font-weight:bold;}
header .srhbar-list ol{overflow:hidden;width: 50%;padding:0;}
header .srhbar-list ol li{display:inline-block; margin-top:10px; overflow:hidden; width:100%;}
header .srhbar-list ol li *{font-size:14px;}
header .srhbar-list ol li .num{
    width:25px; font-weight:bold; color:#1479cc; display:inline-block; text-align:center;
}
header .srhbar-list ol li a{
    width: calc(100% - 35px); overflow:hidden; white-space: nowrap; text-overflow: ellipsis;
    display:inline-block; vertical-align:top;
}
header .srhbar-list ol li .ranking{
    float:right; font-weight:bold; color:#aaa; width:8px; height:10px; display:inline-block;
}
header .srhbar-list ol li .plus{
    text-indent:-9999px; margin-top:6px;
    background:url("//tvcache.teacherville.co.kr/teacherville2/image/web/test/etc/up1.png")no-repeat;
}
header .srhbar-list ol li .minus{
    text-indent:-9999px; margin-top:6px;
    background:url("//tvcache.teacherville.co.kr/teacherville2/image/web/test/etc/down1.png")no-repeat;
}
header .radius0{border-radius:0;}

header .srhbar-list ul{}
header .srhbar-list ul li{overflow:hidden; margin-top:12px;}
header .srhbar-list ul li:first-child{margin-top:0;}
header .srhbar-list ul li img{width:90px; float:left;}
header .srhbar-list ul li .info{/* float:left; */ margin-left:100px;}
header .srhbar-list ul li .info .tit{
    font-weight:bold; color:#333; font-size:14px;
    width:250px; display:-webkit-box; -webkit-line-clamp:2;
    -webkit-box-orient:vertical; height:44px; line-height:22px;
    overflow:hidden; text-overflow:ellipsis;
}
header .srhbar-list ul li .info dl{overflow:hidden; margin-top:5px;}
header .srhbar-list ul li .info dl *{float:left; font-size:12px;}
header .srhbar-list ul li .info dl dd{
    margin:0 15px 0 7px; padding-left:7px;
    background:url("//tvcache.teacherville.co.kr/teacherville2/image/mobile/test/renewal/smallbar.png") no-repeat 0 50%;
}

header .srhbar-list ul.text1 li{margin-top:15px; padding-top:15px; border-top:1px solid #ddd;}
header .srhbar-list ul.text1 li:first-child{margin-top:0; padding-top:0; border-top:none;}
header .srhbar-list ul li .info1 .tit{font-weight:bold; color:#333; font-size:14px;}
header .srhbar-list ul li .info1 dl{overflow:hidden; margin-top:5px;}
header .srhbar-list ul li .info1 dl *{float:left; font-size:12px;}
header .srhbar-list ul li .info1 dl dd{
    margin:0 15px 0 7px; padding-left:7px;
    background:url("//tvcache.teacherville.co.kr/teacherville2/image/mobile/test/renewal/smallbar.png") no-repeat 0 50%;
}

.ssamgu_btn1{position:absolute; top:-18px; right:200px}
.ssamgu_btn2{position:absolute; top:-18px; right:230px}
.ssamgu_btn3{position:absolute; top:-18px; right:90px}

@media (max-width: 767px) {
    img{
        image-rendering:-webkit-optimize-contrast;
        transform:translateZ(0);
        backface-visibility:hidden
    }

    .header-edit {width: 100%;}
    .container{padding:0 10px;}
    aside {display:none;}
    .aside-container {width:100%; float:none; margin-top:0 !important;}

    input {-webkit-appearance: none; }
    hr {border-color:#ddd; margin:10px 0;}
    h2 {font-size:20px;}
    h3 {font-size:17px;}
    h3 span{display:inline-block; word-break:keep-all;}
    h3 small {font-size:15px;}
    h4 {font-size:16px; line-height:1.4;}
    h5 {font-size:15px; line-height:1.4;}

    .checkbox, .radio {margin-top:5px; margin-bottom:5px;}

    .font-15 {font-size:14px !important;}
    .font-16, .font-17, .font-18 {font-size:15px !important;}
    .m-font-0 {font-size:0px;}
    .m-font-11 {font-size:11px !important;}
    .m-font-12 {font-size:12px !important;}
    .m-font-13 {font-size:13px !important;}
    .m-font-14 {font-size:14px !important;}
    .m-font-15 {font-size:15px !important;}
    .m-font-16 {font-size:16px !important;}
    .m-font-18 {font-size:18px !important;}
    .m-font-20 {font-size:20px !important;}

    .m-m0 {margin:0 !important;}
    .m-mt0 {margin-top:0 !important;}
    .m-mt5 {margin-top:5px !important;}
    .m-mt10 {margin-top:10px !important;}
    .m-mt15 {margin-top:15px !important;}
    .m-mt20 {margin-top:20px !important;}
    .m-mt30 {margin-top:30px !important;}
    .m-mb10 {margin-bottom:10px !important;}
    .m-mb0 {margin-bottom:0 !important;}
    .m-mb20 {margin-bottom:20px !important;}
    .m-ml0 {margin-left:0 !important;}
    .m-mr0 {margin-right:0 !important;}
    .m-mr5 {margin-right:5px !important;}
    .m-mt-20{margin-top:-20px !important;}

    .m-pd0{padding:0 !important}
    .m-pt0 {padding-top:0 !important;}
    .m-pb0 {padding-bottom:0 !important;}
    .m-p05 {padding:5px !important;}
    .m-pl5 {padding-left:5px !important;}
    .m-pl15 {padding-left:15px !important;}

    .row {margin-left:-2px; margin-right:-2px;}
    .row>*, table .row>*, .product-info .col-sm-5 {padding-left:2px; padding-right:2px;}

    .form-inline .form-control {display:inline-block; vertical-align: middle;}
    .form-inline .input-group {display: inline-table; vertical-align: middle;}
    .input-group .form-control {display:table-cell;}
    .form-inline .input-group .input-group-btn {width: auto;}
    .form-inline .input-group .input-group-btn .btn {font-size:16px;}
    .input-group-btn .btn{height:34px; line-height:31px; padding-top:0}

    .btn {font-size:14px; position:relative; z-index:1;}
    .m-btn-sm {font-size:13px; padding:2px 8px 3px; min-width:50px;}

    .items .blt{font-size:12px; width:70px; height:24px; line-height:24px;}
    .items .blt08{font-size:11px;}
    .touch_blt{font-size:13px; width:90px; left:12px; top:-3px; height:28px; line-height:28px}
    .product-info .touch_blt{left:10px}
    .new-label{font-size:12px; width:40px; height:20px; line-height:18px;}

    .ssamgu_btn1{position:relative; display:block; top:0; right:0; margin:-20px auto 0 auto}
    .ssamgu_btn2{position:relative; display:block; top:0; right:0; margin:0 auto}
    .ssamgu_btn3{position:relative; display:block; top:0; right:0; margin:-20px auto 0 auto}

    .flexnone{display:block}
    .m_flex{display:flex; justify-content:space-between}
    .xs_hidden{display:none !important}
    .xs_block{display:block !important}
    .m-w100{width:100% !important}
}

/*** ============================
Editor 영역
============================  ***/

ul.compo-editor li { list-style: none; margin-top: 30px; }

li div.edit-element .weblink-box {
    position: relative;
    width: 100%;
    height: 130px;
    padding: 15px;
    margin: 3px 0 10px 0;
    border: solid 1px #dfdfdf;
    text-align: left;
    background: #efefef;
    overflow: hidden;
}
li div.edit-element .weblink-box a { color: #23527c; }
/*** ============================
Editor 영역
============================  ***/


/*** 연관 추천 ***/
.ssam-reco{background:#e1fae7; padding:20px 22px 30px 22px; margin:50px 0;}
.ssam-reco h3{margin:20px 10px;}
.ssam-reco h3 strong{color:#6a03ba}


.pop-tempbody .insidecont {
    padding: 10px 10px 30px 10px;
}

.pop-tempbody .tmp-footer {
    height: 30px;
}

.pop-tempbody .button-img {
    overflow: hidden;
    text-indent: -9999px;
    background: url(../../image/common/icon.png) !important;
    cursor: pointer;
    opacity: 1;
}

.pop-tempbody .button-img.close {
    width: 12px;
    height: 11px;
    background-position: -6px -25px !important;
}

/* 크리에이터 추가 */
.creator label, .creator i{display:inline-block; vertical-align:middle}
.creator_con h4, .creator_con h5{margin-top:0}
.bk_red{background:#e22727}
.bk_blue{background:#273de2}
.creator .container{padding:30px 0 100px 0}
.creator_con + .creator_con{margin-top:20px}
.creator_con > *{background:#fff; box-shadow:4px 8px 16px rgba(0,0,0,0.1); padding:20px; border-radius:10px; width:100%; position:relative}
.creator_con > * + *{margin-top:10px}
.creator_icon1{width:24px; height:24px; background:url('../../image/ssam/creator/creator_icon1.png'); margin:-4px 10px 0 0}
.creator_icon2{width:23px; height:23px; background:url('../../image/ssam/creator/creator_icon2.png'); margin:-3px 10px 0 0}
.creator_icon3{width:23px; height:22px; background:url('../../image/ssam/creator/creator_icon3.png'); margin:-4px 10px 0 0}
.creator_icon4{width:30px; height:22px; background:url('../../image/ssam/creator/creator_icon4.png'); margin:-3px 10px 0 0}
.creator_icon5{width:28px; height:21px; background:url('../../image/ssam/creator/creator_icon5.png'); margin:-3px 10px 0 0}
.creator_icon6{width:24px; height:23px; background:url('../../image/ssam/creator/creator_icon6.png'); margin:-3px 10px 0 0}
.creator_icon9{width:24px; height:16px; background:url('../../image/ssam/creator_icon9.png'); margin:-3px 10px 0 0}
.creator .term-search-wrap{border:0; margin-bottom:0; padding-bottom:0}
.creator input, .creator button, .creator select, .creator .btn{border-radius:0}
.creator .term-search{width:calc(100% - 425px)}
.creator .term-search button{height:34px; line-height:34px; padding:0}
.creator .btn-md{width:135px}
.creator_list ul{font-size:0; margin:-10px}
.creator_list li{width:calc(25% - 20px); display:inline-block; margin:10px}
.creator_list .img{padding-bottom:73%}
.creator_rank{position:absolute; top:10px; left:10px; width:28px; height:28px; line-height:28px; color:#fff; background:#0074c8; font-weight:500; font-size:14px; border-radius:100%; text-align:center}
.creator_list p{font-weight:500; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; max-height:2.8em; height: 2.8em; margin:10px 0 0 0; word-break:break-word}
.creator_list h4{margin-left:20px}
.creator_con .no-list p{margin:10px 0 0 0; color:#999}
.creator_con .cart_tit{font-size:18px; font-weight:500}
.flex{display:flex}
.flex > *{width:100%}
.flexbox{display:flex; justify-content:space-between; align-items:center}
.creator .selectbox select{background:url('../../image/ssam/creator/selec_arrow.png') no-repeat right 10px center; padding-right:25px; max-width:210px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.creator_con .mypage-guide{margin:0 0 20px 0}
.creator_con .mypage-guide .contab li{background:#f0f2f3; border:1px solid #ddd}
.creator_con .mypage-guide .contab li.active{background:#fff; color:#000}
.creator_con .mypage-guide .contab li.active::before{background:#fff; bottom:-1px; height:1px}
.creator_con .content_list .dl-table li{border:1px solid #ddd; padding-right:15px}
.creator_con .content_list .dl-table li + li{margin-top:10px}
.creator_con .content_list .table{margin-bottom:0}
.nowrap1{display:-webkit-box !important; -webkit-line-clamp:1; -webkit-box-orient:vertical; line-height:17px; overflow:hidden; text-overflow:ellipsis;}
.creator_con .content_list .nowrap2{height:auto; max-height:42px}

.publish_list{background:#f0f2f3; padding:20px; margin-top:20px; display:flex; justify-content:space-between; align-items:center}
.publish_list > *{display:inline-block; margin:0}
.publish_list ul{width:calc(100% - 60px); font-size:0}
.publish_list li{display:inline-block; width:calc(100% / 7); text-align:center; position:relative}
.publish_list li > span{font-weight:500; color:#1479cc; width:22px; height:22px; line-height:20px; text-align:center; display:inline-block; border:1px solid transparent; border-radius:100%; font-size:14px; cursor:pointer}
.publish_list li:hover > span{border:1px solid #1479cc}
.publish_list .list_tip{position:absolute; top:32px; left:50%; margin-left:-127px; border:1px solid #ddd; border-radius:10px; padding:10px; background:#fff; width:255px; text-align:left; z-index:2; display:none}
.publish_list li:hover > span + .list_tip{display:block}
.publish_list .list_tip::before{content:''; position:absolute; top:-10px; left:50%; margin-left:-7px; width:0; height:0; border-left:7px solid transparent; border-right:7px solid transparent; border-bottom:10px solid #ddd}
.publish_list .list_tip::after{content:''; position:absolute; top:-9px; left:50%; margin-left:-7px; width:0; height:0; border-left:7px solid transparent; border-right:7px solid transparent; border-bottom:11px solid #fff}
.publish_list li dl{margin-bottom:0}
.publish_list li dl p{margin-bottom:5px}
.publish_list li dl > *{display:inline-block; vertical-align:top}
.publish_list li dt label{font-size:12px; font-weight:500; color:#fff; width:22px; height:22px; line-height:20px; text-align:center; border-radius:100%}
.publish_list li dd{width:calc(100% - 35px); font-size:14px; margin-left:10px}

.text_chart{margin:20px 0}
.text_chart ul{font-size:0; margin:-5px -10px}
.text_chart li{margin:5px 10px; width:calc(50% - 20px); display:inline-flex; padding:10px 20px; border-radius:10px}
.text_chart li:nth-child(1){background:#49d3ce}
.text_chart li:nth-child(2){background:#f39f45}
.text_chart li:nth-child(3){background:#4994d3}
.text_chart li:nth-child(4){background:#f45081}
.text_chart li *{color:#fff}
.text_chart .tit{width:200px}
.text_chart .tit span{font-size:15px; vertical-align:middle; margin-left:10px}
.text_chart i{width:40px; height:40px}
.text_chart01{background:url('../../image/ssam/creator/text_chart01.png') no-repeat center}
.text_chart02{background:url('../../image/ssam/creator/text_chart02.png') no-repeat center}
.text_chart03{background:url('../../image/ssam/creator/text_chart03.png') no-repeat center}
.text_chart04{background:url('../../image/ssam/creator/text_chart04.png') no-repeat center}
.text_chart .info{font-size:14px; font-weight:500}
.text_chart .info strong{font-size:18px; margin-right:5px}

.creator_con.con2{margin:-10px; font-size:0; display:flex}
.creator_con.con2 > *{width:calc(50% - 20px); margin:10px}
.creator_con.con2 a{margin-bottom:10px; color:#777; font-size:14px}

.term-search2 > div:first-child{width:calc(100% - 143px)}
.term-search2 .term-search{width:calc(100% - 282px) !important}
.term-search2 > button{margin-top:10px; height:78px}
.apexcharts-toolbar, #chart02 .apexcharts-legend{display:none !important}

/* 211108 추가 */
.review-box .row + .row{border-top:1px solid #ddd; margin:0 -40px; padding:25px 40px 0 40px}
.meet_review{padding:0 30px 0 0}
.meet_review + .meet_review{padding:0 0 0 30px}
.meet_review + .meet_review::before{content:''; position:absolute; bottom:5px; left:0; width:1px ; height:75px; background:#ddd}
.meet_review .tit{border:1px solid #ddd; border-radius:10px; display:inline-block; color:#1d73bc; width:80px; height:26px; line-height:24px; text-align:center; margin:10px 0 20px 0}
.meet_review .flexbox + .flexbox{margin-top:10px}
.graph_tit{margin-bottom:0}
.graph_meet{display:inline-block; width:55%; max-width:calc(100% - 130px); height:8px; border-radius:30px; background:#d6d4d4; position:relative; overflow:hidden}
.graph_meet div{height:100%; background:#1d73bc}
.modal-body .meet_review{padding:0 30px 0 15px}
.modal-body .meet_review + .meet_review{padding:0 15px 0 30px}
.meet_review .checkbox{padding-left:20px}
.modal-body .meet_review + .meet_review::before{height:85px}
.meet_relist{width:60%}
.meet_relist .flexbox + .flexbox{margin-top:5px}
.meet_list{margin-top:40px}
.dl-table.meet_list dt{width:100px}
.meet_list dl:first-child > *{font-weight:500; font-size:16px}
.meetpop_admin .meet_review .tit{margin:0}
.meetpop_admin .meet_review{padding:0 !important; justify-content:space-between}
.meetpop_admin .meet_review > div{width:calc(100% - 100px)}
.meetpop_admin .meet_review + .meet_review{margin-top:10px}

/* 구성원 추가 */
.member-list li{align-items:center; font-size:0}
.member-list li + li{margin-top:10px; padding-top:10px; border-top:1px solid #ddd}
.member-list li > div{width:calc(100% - 90px); display:inline-block}
.member-list li > div > * + *{margin-left:5px}
.member-list b{width:30px; text-align:center; display:inline-block; font-size:16px}
.mem_edit input{max-width:210px}
.add_btn{padding-right:30px; background:url('../../image/ssam/add_btn.png') no-repeat 99% center}
.pb100{padding-bottom:100% !important}

/* 엠블럼 추가 */
.emblem-lg{
    max-width:200px; width:80%; height:48px; line-height:48px; text-align:center;
    display:inline-block; border-radius:100px; font-size:22px; font-weight:500; color:#666
}
.emblem-off{background:#d1d1d1}
.emblem-on{background:#189bb7; color:#fff}
.emblem-date{border:1px solid #d1d1d1}
.emblem-date small{font-size:14px; margin-left:5px}
.emblem-list{overflow:hidden; margin:30px auto; max-width:650px; width:85%}
.emblem-next{position:absolute; right:4%; top:45%; width:20px; height:37px; background:url('../../image/ssam/creator/emblem-next.png') no-repeat}
.emblem-prev{position:absolute; left:4%; top:45%; width:20px; height:37px; background:url('../../image/ssam/creator/emblem-prev.png') no-repeat}
.emblem-noti{
    text-indent:-9999px; display:inline-block; width:30px; height:30px;
    background:url('../../image/ssam/creator/noti-icon.png') no-repeat; vertical-align:middle; margin:-3px 0 0 3px
}
.emblem{display:inline-block; height:24px; vertical-align:middle; margin:-1px 0 0 3px; width:18px; background:url('../../image/ssam/creator/emblem01.png') no-repeat center}

.coach_mark{display:none}
.coach_mark > div{position:fixed; top:50%; left:50%; transform:translate(-50.1%, -50.1%); z-index:1052}
.coach_mark::before{content:''; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.5; z-index:1051}
.coach_mark button{position:absolute; top:0; right:0}

.layer_pop{position:absolute; top:0; left:50%; margin-left:550px; z-index:1; width:140px}
.main-warp .layer_pop{top:20px}
.layer_pop .pop_close{position:absolute; top:0; right:0}
.layer_pop.fix{position:fixed; top:120px}

.chat{display:table-row}
.chat *{vertical-align:top; line-height:1.7}
.chat > *{padding:0}
.chat .toggle{display:none}
.chat td{padding:0 !important; border:1px solid #ddd !important}
.chat_tit{padding:15px 20px; background:#ededed}
.chat_tit .icn-arrow{position:relative; top:0; right:0}
.chat_tit p{font-weight:500}
.chat_tit .label{width:20px; height:20px; line-height:20px; margin:-4px 0 0; vertical-align:middle; padding:0}
.chat_list{background:#f0f2f3; padding:30px 20px; border-bottom:1px solid #ddd; border-top:1px solid #ddd; max-height:300px; overflow-y:auto}
.chat_list .img{width:40px; height:40px; border:1px solid #ddd; border-radius:100%; overflow:hidden}
.chat_list > *{position:relative; overflow:hidden}
.chat_list > * + *{margin-top:15px}
.chat_list .left > *{float:left}
.chat_list .right > *{float:right}
.chat_list .text{padding:10px 20px; background:#c8e7f7; border-radius:0 25px 25px; max-width:70%; margin:0 10px; position:relative}
.chat_list .right .text{background:#fff; border-radius:25px 0 25px 25px}
.chat_list .time{color:#777; position:absolute; bottom:11px; right:-80px; font-size:14px}
.chat_list .right .time{left:-80px}
.chat_text{padding:20px}
.chat_text textarea{padding:0; border:0; width:100%; outline:none; height:36px; max-height:150px; overflow-y:auto}
.chat_text > div{text-align:right}


/* 221012_쌤찾자 수정 */
.m-btn-group.flex > * + *{margin:0 0 0 10px}
.m-btn-group.flex > *{padding:15px 0; position:relative}

.teacher-list{display:grid; grid-auto-rows:1fr; height:256px; margin-top:20px; padding:5px 10px; border:1px solid #ddd; border-radius:3px}
.teacher-list > div{padding:15px 20px; background:#f5f5f5; border:1px solid #ddd; border-radius:3px; margin:5px 0;}
.teacher-list > div::-webkit-scrollbar{background:none; width:12px}
.teacher-list > div::-webkit-scrollbar-thumb{background:#ccc; width:12px; background-clip:content-box; border-radius:100px; border:4px solid transparent}
.teacher-list > div::-webkit-scrollbar-track{background:none}
.teacher-list .tit{font-size:18px; font-weight:500}
.teacher-list li{position:relative; color:#888; padding-left:10px}
.teacher-list li::before{content:'-'; position:absolute; top:0; left:0}
.teacher-list li + li{margin-top:5px}

.teacher_tab{display:flex}
.teacher_tab li{width:100%; border:1px solid #ddd}
.teacher_tab li + li{border-left:0; position:relative}
.teacher_tab li + li::before{content:''; position:absolute; left:-19px; width:39px; height:39px; top:50%; margin-top:-19px; background:url('https://tvcache.teacherville.co.kr/ssam/img/icon_arrow_left.png')}
.teacher_tab a{display:block; text-align:center; padding:10px; background:#f0f2f3; color:#666}
.teacher_tab p{margin-bottom:5px; font-size:18px; line-height:1}
.teacher_tab span{font-size:20px; line-height:1}
.teacher_tab li.on{border:1px solid #818181}
.teacher_tab li.on a{background:#818181; color:#fff; font-weight:500}

/* footer 추가 */
footer .isms{position:relative; left:0; margin:15px 0px 15px 0px; width: 100%; display:flex; align-items:center}
footer .isms img{width:40px}
footer .isms p{margin:0 0 0 10px; flex-shrink:0}
footer .isms span{color: #aaa; display: block; margin:0; line-height:1.4;}
footer .flex{align-items:center}
footer .flex > *{width:auto}
footer .f_sns{display:inline-flex; margin:0 0 0 20px; filter:grayscale(); opacity:.6;}
footer .f_sns li + li{margin-left:10px}

@media (max-width: 1200px) {
    footer .isms{position:relative; left:0; margin-top:10px}
    footer .isms img{width:40px}
}

@media (max-width: 991px) {
    .teacher_tab li + li::before{width:30px; height:30px; background-size:100%; left:-15px; margin-top:-15px}
    footer .f_sns{display:flex; margin:15px 0; justify-content:center}
    footer .f_sns li{width:30px}
}


/* 행정실결제 추가 */
.contab_sub ul{padding:20px 0; display:flex; border-bottom:1px solid #ddd}
.contab_sub li{position:relative; cursor:pointer}
.contab_sub li + li{margin-left:40px}
.contab_sub li.on{padding-left:20px}
.contab_sub li.on::before{content:''; position:absolute; top:7px; left:0; width:14px; height:10px; background:url('/image/ssam/contab_arrow.png') center no-repeat}

.admin_list{margin-top:30px}
.admin_list > * + *{margin-top:10px !important}
.admin_list .title{border:1px solid #ddd; border-bottom:0; padding:10px 15px; display:flex; justify-content:space-between; align-items:center; background:#f0f2f3}
.admin_list h5{height:40px}
.admin_list .m-pos-bottom p{font-size:16px;}
.admin_list .m-pos-bottom p + p{margin-top:5px}
.blt_admin{font-size:14px !important; color:#888; background:#fff; margin-right:10px; border:1px solid #ddd; border-radius:3px; width:70px; display:inline-block; text-align:center; height:26px; line-height:23px; font-weight:normal}
.admin_list .table{margin:0; border-left:1px solid #ddd; border-right:1px solid #ddd}
.admin_list .table th{padding:15px}
.admin_list .table td{padding:15px 15px 15px 0}
.admin_btn{display:block; width:100px; margin:-15px auto 0; height:30px; background:#fff; border:1px solid #ddd; border-radius:100px; position:relative; z-index:1}
.admin_detail{border:1px solid #ddd; border-top:0; margin-top:-15px; padding:30px 15px; background:#f9f9f9; display:none}
.admin_detail > div{text-align:center; font-size:0}
.admin_detail > div + div{border-top:1px dashed #ddd; margin-top:30px; padding-top:30px}
.admin_detail dl{display:inline-flex; margin:0}
.admin_detail dd{width:calc(100% - 80px); text-align:left}
.dl_w25{width:25%}
.dl_w30{width:30%}
.dl_w35{width:35%}
.dl_w90{width:90%}
.admin_detail .dl_w90{margin-top:10px}
.bottom_blt{position:absolute; bottom:0; left:0; width:100%; padding:5px 10px; background:rgba(0,0,0,0.6); font-weight:500}

.pop_tbl{margin-top:30px}
.pop_tbl > div + div{border-top:1px solid #eee; padding-top:20px; margin-top:20px}
.pop_tbl h5{font-size:18px; margin:0 0 20px}
.pop_dl{display:flex}
.pop_dl > *{font-size:16px}
.pop_dl dt{font-weight:normal; color:#888; width:140px}
.pop_tbl .dl-table > *{padding:0}
.btnarea{display:flex}
.btnarea .btn{font-size:18px; border-radius:5px; height:48px; line-height:46px; padding:0}
.btnarea > *{width:100%}
.btnarea > * + *{margin-left:10px}

.admin_member{display:flex}
.admin_member > * + *{margin-left:5px}
.admin_member input[type="text"]{width:300px}
hr{border-top:1px solid #ddd}

@media (max-width: 991px) {
    .admin_list{margin-top:20px}
    .admin_list .title{padding:10px; display:block}
    .admin_list .title.flexbox{display:flex}
    .admin_list .title.flexbox *{margin-top:0}
    .admin_list .title > * + *{display:block; margin-top:5px}
    .admin_list .table th{padding:10px !important}
    .admin_list .table td{padding:0 10px 20px 10px !important; border-bottom:1px solid #ddd !important}
    .blt_admin{font-size:12px !important; width:55px; height:24px; line-height:21px; margin-right:5px}
    .admin_btn{width:85px; font-size:13px; height:26px; margin:-13px auto 0}
    .admin_detail{padding:20px 10px; margin-top:-13px}
    .admin_detail > div{text-align:left}
    .admin_detail > div + div{margin-top:20px; padding-top:15px}
    .admin_detail dl{width:50% !important; margin-top:5px !important}
    .admin_detail .dl_w35, .admin_detail .dl_w90{width:100% !important}
    .admin_detail dd{font-size:14px; width:calc(100% - 70px)}

    .pop_tbl > div + div{margin-top:1px; padding-top:10px}
    .pop_tbl h5{font-size:16px; margin:0 0 10px}
    .pop_tbl .admin_list{margin-top:0}
    .pop_dl > *{font-size:15px}
    .pop_dl dt{width:90px}
    .btnarea .btn{height:40px; line-height:38px; font-size:16px}
}

/*
//아이콘 기호
.content-tabs {white-space: normal; padding:0;}
.tabs-header li a{height:28px; line-height:28px}
.content-tabs li, .content-tabs li.active {display:inline-block !important; border:0; width:15%; text-align:center; padding:5px 0}
.content-tabs li.active{font-weight:500}
.content-tabs li a:before {
	content:''; display:block; margin:0 auto; background-repeat:no-repeat; 
	background-size:200% 100%; background-position:0 0; width:28px; height:28px; 
}
.content-tabs li:nth-child(1) a:before {background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon01.png);}
.content-tabs li:nth-child(2) a:before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon06.png);}
.content-tabs li:nth-child(3) a:before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon07.png);}
.content-tabs li:nth-child(4) a:before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon08.png);}
.content-tabs li:nth-child(5) a:before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon09.png);}
.content-tabs li:nth-child(6) a:before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon10.png);}
.content-tabs li:nth-child(7) a:before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon11.png);}
.content-tabs li:nth-child(8) a:before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon12.png);}
.content-tabs li:nth-child(9) a:before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon13.png);}
.meet-tabs li:nth-child(2) a::before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon06.png);}
.meet-tabs li:nth-child(3) a::before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon08.png);}
.meet-tabs li:nth-child(4) a::before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon10.png);}
.meet-tabs li:nth-child(5) a::before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon03.png);}
.meet-tabs li:nth-child(6) a::before{background-image:url(//tvcache.teacherville.co.kr/ssam/img/cate-icon04.png);}
.content-tabs li.active a:before {background-position:-28px 0;} 
.view-tab-content-wrap h2{padding:50px 0 10px 0}
*/


/* 쌤모임 신청현황 */
.meet_bar{width:calc(100% - 100px); background:#dcdcdc; height:18px; border-radius:3px; position:relative; overflow:hidden}
.meet_bar .bar{position:absolute; top:0; left:0; height:100%; background:#00ae76}
.meet_limit{width:calc(100% - 100px)}
.meet_limit span{border:1px solid #333; font-size:14px; color:#333; width:90px; white-space:nowrap; text-align:center; display:inline-block; margin-top:10px; position:relative; margin-left:-45px}
.meet_limit span::before{content:''; position:absolute; width:1px; height:32px; left:50%; background:#333; top:-32px}

@media (max-width: 767px) {
    .meet_bar, .meet_limit{width:calc(100% - 85px)}
    .meet_limit span::before{top:-30px; height:30px}
}


/* 쌤모임 캘린더 */
.cal_banner{position:absolute; top:135px; left:50%; margin-left:540px; z-index:100; width:104px; padding:0}
.cal_banner.fix{position:fixed; top:110px}
.calendar_wrap{display:none}
.calendar_wrap.on{display:block}
.calendar_wrap.on::before{content:''; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:1000}
.calendar_pop{position:fixed; z-index:1001; max-width:1036px; width:calc(100% - 40px); background:#fff; border-radius:20px; padding:20px; max-height:calc(100vh - 20px); overflow-y:auto}
@font-face {
    font-family: 'Gmarket Sans';
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff") format("woff");
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Gmarket Sans';
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Gmarket Sans';
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
}
.calendar_pop h3{margin:0}
.calendar_pop .pop_close{text-indent:-9999px; width:20px; height:20px; background:url('https://ssam.teacherville.co.kr/image/ssam/icn-del.png') no-repeat center}
.ctr-box{display:flex; justify-content:center; align-items:center; margin-bottom:30px}
.ctr-box span{font-size:30px; font-weight:bold; color:#333}
.ctr-box .btn-cal{text-indent:-9999px; width:39px; height:39px; margin:0 20px}
.btn-cal.prev{background:url('//tvcache.teacherville.co.kr/teacherville2/image/web/icon/220902_arrow_prev.png')}
.btn-cal.next{background:url('//tvcache.teacherville.co.kr/teacherville2/image/web/icon/220902_arrow_next.png')}
.my-calendar{display:grid; width:100%; grid-template-columns:65% 35%; border:1px solid #ddd; border-radius:20px; overflow:hidden}
.my-calendar .cal-table{width:100%; table-layout:fixed; border-style:hidden}
.cal-table *{font-family:'Gmarket Sans'}
.cal-table tr > *{font-weight:normal; font-size:20px; color:#777; border:1px solid #ddd; height:80px}
.cal-table th{background:#f4f4f4; height:60px; text-align:center}
.cal-table td{vertical-align:top; position:relative; cursor:pointer; padding:10px 8px}
.cal-table tr > *:first-child{color:#ff5d96}
.cal-table tr > *:last-child{color:#3aa5ff}
.cal-body .day-active::after{content:''; position:absolute; top:-1px; bottom:-1px; left:-1px; right:-1px; border:3px solid #f36c65}
.cal-body .today::before{content:''; position:absolute; top:3px; left:3px; width:36px; height:36px; border:3px solid #333; border-radius:100%}
.clicked-date{border-left:1px solid #ddd}
.click-tit{height:60px; border-bottom:1px solid #ddd; background:#f4f4f4; color:#777; font-size:20px; text-align:center; font-family:'Gmarket Sans'; line-height:60px}
.click-cal{border-bottom:1px solid #ddd; display:flex; height:80px; align-items:center; justify-content:center; font-size:24px; font-weight:bold}
.live_list{padding:20px; max-height:390px; overflow:auto}
.live_list li + li{margin-top:20px; padding-top:20px; border-top:1px solid #ddd}
.my-calendar .label1{width:115px; height:24px; line-height:27px; color:#fff; font-family:'Gmarket Sans'; border-radius:100px; display:inline-block; text-align:center; margin-bottom:0; cursor:default; font-weight:normal; font-size:16px}
.my-calendar .label1.online{background:#3aa5ff}
.my-calendar .label1.offline{background:#666}
.cal-table td label{width:calc(100% - 20px); font-size:15px; font-weight:500; margin-bottom:0; position:absolute; bottom:10px; left:10px; z-index:-1; text-align:center; background:#f36c65; color:#fff; border-radius:100px; height:24px; line-height:27px}
.cal-table td label.end{background:#dcdcdc; color:#333; width:10px; height:10px; left:50%; margin-left:-5px; text-indent:-9999px; bottom:15px}
.cal-table td label span{background:#fff; border-radius:100%; display:inline-block; width:16px; height:16px; text-align:center; line-height:16px; color:#f36c65; vertical-align:middle; margin:-5px 0 0 3px}
.live_list .img{position:relative; width:70px; height:50px; overflow:hidden}
.live_list .img img{position:absolute; top:0; left:0; width:100%; min-height:100%}
.live_list .tit{font-size:18px; width:calc(100% - 80px); margin-bottom:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; height:48px; line-height:24px}
.live_list .flexbox{margin:10px 0}
.live_list .info{display:flex}
.live_list .label2{width:70px; height:24px; line-height:24px; color:#fff; text-align:center; font-weight:normal; margin:0}
.live_list .label2.pay{background:#ff2929}
.live_list .label2.free{background:#1d73bc}
.live_list .label2.finish{background:#ff8542}
.live_list .label2.end{background:#b1b1b1}
.live_list .time{color:#999; margin:0 0 0 10px}
.cal-tooltip{position:absolute; top:75px; left:50%; transform:translateX(-50%); width:165px; padding:10px; background:#fff; z-index:1; box-shadow:1px 1px 6px rgb(0 0 0 / 20%); border-radius:10px; display:none}
.cal-tooltip::before{content:''; position:absolute; top:-8px; left:50%; transform:translateX(-50%); width:0; height:0; border-bottom:8px solid #fff; border-right:6px solid transparent;  border-left:6px solid transparent;filter: drop-shadow(0 -2px 2px rgba(0,0,0,.2))}
.cal-tooltip p{color:#333; display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.cal-tooltip p + p{margin-top:5px}
.cal-table td:hover .cal-tooltip{display:block}


/* 선불카드 */
.creator_icon7{width:28px; height:22px; background:url("https://tvcache.teacherville.co.kr/ssam/img/creator_icon7.png"); margin:-2px 10px 0 0}
.creator_icon8{width:23px; height:22px; background:url("https://tvcache.teacherville.co.kr/ssam/img/creator_icon8.png"); margin:-2px 10px 0 0}
.prepay{margin-top:20px}
.prepay *{font-size:16px}
.prepay li{border:1px solid #ddd; padding:20px; display:flex; justify-content:space-between; align-items:center; min-height:96px}
.prepay li + li{margin-top:10px}
.prepay .tit p, .prepay .tit strong{font-weight:500}
.prepay .tit span{display:block}
.prepay .tit small{font-size:14px}
.prepay .info{flex-shrink:0; margin-left:20px}
.prepay .info strong{font-size:18px; min-width:140px}
/* .prepay .m-btn-group{margin-left:30px; width:100px} */
.prepay .btn{width:100%}

.point_info{margin:20px -10px; display:flex}
.point_info *{color:#fff}
.point_info li{display:inline-flex; justify-content:space-between; width:calc(50% - 20px); margin:0 10px; padding:0 20px; border-radius:10px; height:50px; line-height:50px; box-shadow:4px 8px 16px rgb(0 0 0 / 10%)}
.point_info li:nth-child(1){background:#f7aa0f}
.point_info li:nth-child(2){background:#ec4a4a}
.point_info span{font-size:17px}
.point_info strong{font-size:18px}
.creator_btn{text-align:right; margin-top:20px}
.creator_btn .btn{min-width:180px}

.prepay_obj{display:flex; align-items:center; margin-top:20px}
.prepay_obj *{font-weight:500}
.prepay_obj > div + div{margin-left:20px}
.prepay_obj dl{margin-bottom:0}
.prepay_obj dl *{display:inline-block}
.prepay_obj dl + dl{margin-top:10px}
.prepay_obj dt{width:100px}

/* 
기관쌤모임이전적용css
.prepay_con{display:flex}
.prepay_price{position:absolute; bottom:15px; right:15px}
*/
.prepay_con{display:grid; grid-template-columns:40% auto; column-gap:40px}
.prepay_price{position:absolute; bottom:15px; right:15px}
.product-info .prepay_total{display:flex; align-items:center; border-top:1px solid #ddd; margin:20px 0 30px; padding-top:20px}
.prepay_total dd{text-align:right}

.depth2{margin-top:3px}
.depth2 li{position:relative; padding-left:10px; margin-left:5px}
.depth2 li::before{content:'-'; position:absolute; top:3px; left:0}

.toggle_banner{position:relative; margin-bottom:30px}
.toggle_banner img{max-width:100%}
.toggle_banner a{position:absolute}
.toggle_banner .btn1{right:19%; top:10%; max-width:159px; width:16%}
.toggle_banner .btn2{right:19%; bottom:10%; max-width:159px; width:16%}
.toggle_banner .btn3{right:1.5%; bottom:10.5%; max-width:179px; width:16.5%}
.toggle_banner .close{position:absolute; top:20px; right:20px; width:30px; height:30px; text-indent:-9999px; background:url('https://tvcache.teacherville.co.kr/teacherville2/image/web/banner/sub/trainapply/230321_banner_close.png'); background-size:100% 100% !important; opacity:1}

.fixbanner{background:url('http://tvcache.teacherville.co.kr/ssam/banner/fixbanner_back.png'); padding:20px 0; width:100%}
/* .fixbanner.top{position:fixed; top:0; left:0; z-index:999} */
.fixbanner *{font-family:'Gmarket Sans'; margin-bottom:0}
.fixbanner > div{max-width:1080px; padding:0 62px 0 22px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; position:relative}
.fixbanner .tit{color:#fff; font-size:18px}
.fixbanner .tit strong{font-weight:bold; font-size:22px; color:#fff44a; display:block; font-family:'Gmarket Sans'}
.fixbanner li{position:relative; display:inline-block}
.fixbanner li + li{margin-left:30px; padding-left:30px}
.fixbanner li + li::before{content:''; position:absolute; left:0; width:1px; background:#4f5359; height:100%}
.fixbanner li label{color:rgba(255,255,255,0.5); font-weight:normal; display:block; text-align:left}
.fixbanner li span{display:inline-block; font-size:22px; color:#fff; padding:0 10px; height:35px; line-height:35px; border-radius:5px; border:1px solid #4f5359; background:rgba(115,198,169,0.1)}
.fixbanner li span em{font-weight:normal; font-size:22px; font-style:normal; color:#fff}
.fixbanner .fixclose{width:25px; height:25px; background:url('//tvcache.teacherville.co.kr/ssam/banner/220622_layerpop_close.png'); background-size:100% 100%; font-size:0; position:absolute; top:0; right:22px}
.ani_btn{animation:bounce 1.1s infinite; position:relative}
.ani_btn:hover{animation:none}
@keyframes bounce {
    0%, 100%, 20%, 53%, 80% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        -webkit-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    40%,
    43% {
        -webkit-transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        -webkit-transform: translate3d(0, -18px, 0);
        -ms-transform: translate3d(0, -18px, 0);
        transform: translate3d(0, -18px, 0)
    }
    70% {
        -webkit-transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        -webkit-transform: translate3d(0, -10px, 0);
        -ms-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -2px, 0);
        -ms-transform: translate3d(0, -2px, 0);
        transform: translate3d(0, -2px, 0)
    }
}

@media (max-width: 1240px) {
    .toggle_banner .close{top:10px; right:10px; width:25px; height:25px}

    .fixbanner > div{display:block; text-align:center; padding:0 22px}
    .fixbanner .tit{margin-bottom:10px}
    .fixbanner .tit strong{display:inline-block; font-size:18px; margin-left:5px}
}

@media (max-width: 767px) {
    .toggle_banner img{width:100%; max-width:auto}
    .toggle_banner .close{width:20px; height:20px}
    .toggle_banner .btn1{right:32%; top:41%; width:23%}
    .toggle_banner .btn2{right:32%; bottom:9%; width:23%}
    .toggle_banner .btn3{right:7.5%; bottom:9%; width:23%;}

    .fixbanner{display:none}
    .fixbanner > div{padding:0 5px}
    .fixbanner .tit, .fixbanner .tit strong{font-size:15px}
    .fixbanner ul{font-size:0}
    .fixbanner li span, .fixbanner li span em{font-size:14px}
    .fixbanner li + li{padding-left:5px; margin-left:5px}
    .fixbanner .fixclose{width:23px; height:23px; top:-3px; right:10px}
    .fixbanner li label{font-size:13px; text-align:center}
    .fixbanner li span{padding:0 5px; height:30px; line-height:30px}
}


/* 230718 메인 개편 */
img{max-width:100%}
.main_banner2{display:flex}
.main_banner2 > *{width:100%; border-radius:20px; overflow:hidden; display:block}
.main_banner2 > * + *{margin-left:20px}
.main_banner2 p{margin:0}

.rank_list h5{padding-left:55px; position:relative}
.topnum{position:absolute; bottom:21px; left:0; font-style:normal; font-family:"Gmarket Sans"; font-size:70px; font-weight:700; text-shadow:-4px -4px 0 #fff, 4px -4px 0 #fff, -4px 4px 0 #fff, 4px 4px 0 #fff}
.main_border{padding-top:35px}
.main_border::before{content:''; position:absolute; top:0; left:-9999px; right:-9999px; height:1px; background:#ddd; display:block}

.main_tab{display:flex; margin-bottom:30px}
.main_tab button{min-width:105px; height:38px; border-radius:100px; background:#fff; color:#888; padding:0 20px; font-size:16px}
.main_tab button + button{margin-left:10px}
.main_tab button.on{background:linear-gradient(146deg, #72ca6e 15%, #56c9e6); color:#fff}

.basket_box{display:grid; grid-template-columns:auto 245px; align-items:center; margin-top:30px; background:linear-gradient(to right, #1d1d1d 90%, transparent); border-radius:100px}
.basket_box .download_btn{position:absolute; top:35px; right:22px; width:245px}
.download_btn{font-size:18px}
.basket_box .cart_btn{width:100%; height:80px; border-radius:100px; font-size:24px; font-weight:bold; background:url('https://tvcache.teacherville.co.kr/ssam/img/main/cart_btn_back.png'); background-size:100% 100%; color:#000}
.basket_box .cart_btn i{display:inline-block; width:40px; height:31px; background:url('https://tvcache.teacherville.co.kr/ssam/img/main/ic_cart.png') no-repeat; vertical-align:middle; margin:-4px 10px 0 0}
.bk_green{background:#71ca72; border:0; color:#fff !important}
.ic_download{display:inline-block; width:20px; height:16px; background:url('https://tvcache.teacherville.co.kr/ssam/img/main/ic_download.png') no-repeat center; vertical-align:middle; margin:-4px 0 0 10px}
.basket_box .price_list{display:flex; justify-content:center; align-items:center}
.basket_box .line-through{text-decoration:line-through; color:#c3c3c3; font-size:24px; padding:0 100px 0 40px; background:url('https://tvcache.teacherville.co.kr/ssam/img/main/ic_cartbox.png') no-repeat left center, url('https://tvcache.teacherville.co.kr/ssam/img/main/cart_arrow.png') no-repeat right 35px center}
.basket_box .price_list img{vertical-align:top; margin-top:2px}
.basket_box .price{color:#ffd055; font-weight:bold; font-size:28px; margin-left:30px}
.main_coupon{display:flex}
.main_coupon > div{width:100%; background:#fff; border-radius:20px; overflow:hidden; text-align:center; padding-top:30px}
.main_coupon > div + div{margin-left:20px}
.main_coupon .subtit{font-size:18px; color:#71ca72; font-family:'Gmarket Sans'}
@font-face {
    font-family: 'yg-jalnan';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
.main_coupon .tit{font-family:'yg-jalnan'; font-size:26px; font-style:italic; margin:0; line-height:1.2}
.main_coupon button{margin-top:25px; width:100%; height:57px}
.main_noti{margin:20px 0 0 0; text-align:right}
.main_noti p{position:relative; padding-left:20px; color:#666; display:inline-block; margin:0}
.main_noti p::before{content:'※'; position:absolute; top:0; left:0}
.tabcont{display:none}
.tabcont.on{display:block}
.back-img01{background:url('https://tvcache.teacherville.co.kr/ssam/event/2023/230807_black.png')}
.back-img01 *, .back-img01 .caption h5{color:#fff}
.goods-swiper .swiper-slide:nth-last-child(-n+3) .topnum + h5{margin-left:30px}
.meet_blt{position:absolute; bottom:0; right:0; color:#fff; font-size:13px; background:rgba(0,0,0,0.5); margin:0; height:26px; line-height:26px; padding:0 15px; border-radius:10px 0 0 0}

.content-tab{display:flex; justify-content:space-between; padding-bottom:15px; margin-bottom:15px; position:relative}
.content-tab::before{content:''; position:absolute; bottom:0; left:-9999px; right:-9999px; height:1px; background:#ddd}
.content-tab > li{position:relative}
.content-tab > li.active > a, .location li strong, .sorting li.active a,
.content-tab .depth2 li.active a, .content-tab .depth2 li:hover a{color:#1479cc; font-weight:500}
.content-tab li i{display:inline-block; position:relative; width:10px; height:10px; vertical-align:middle; margin:3px 0 0 10px}
.content-tab li i::before{content:''; width:6px; height:1px; background:#333; position:absolute; top:0; left:0; transform:rotate(45deg);}
.content-tab li i::after{content:''; width:6px; height:1px; background:#333; position:absolute; top:0; right:0; transform:rotate(-45deg);}
.content-tab .depth2{position:absolute; top:30px; left:50%; margin-left:-80px; background:#fff; width:180px; height:150px; border-radius:10px; box-shadow:2px 4px 8px rgba(0,0,0,0.2); z-index:2; display:none}
.content-tab .depth2::before{content:'';  position:absolute; top:-7px; left:50%; margin-left:-9px; width:0; height:0; border-bottom:9px solid #fff; border-right:9px solid transparent; border-left:9px solid transparent; filter:drop-shadow(0 -2px 2px rgba(0,0,0,0.1)); z-index:1}
.content-tab .depth2 ul{overflow-y:auto; height:100%; padding:20px}
.content-tab .depth2 ul::-webkit-scrollbar{width:20px}
.content-tab .depth2 ul::-webkit-scrollbar-thumb {background-color:#c5c5c5; border-radius:100px; border: 7px solid #fff}
.content-tab .depth2 ul::-webkit-scrollbar-track {background-color:transparent; border-radius:100px}
.content-tab .depth2 li{margin:0; padding:0}
.content-tab .depth2 li::before{content:none}
.content-tab .depth2 li + li{margin-top:10px}
.location{margin:30px 0 15px; text-align:right}
.location li{display:inline-block; position:relative}
.location li + li{margin-left:7px; padding-left:15px}
.location li + li::before{content:''; width:6px; height:1px; background:#aaa; position:absolute; top:9px; left:0; transform:rotate(45deg)}
.location li + li::after{content:''; width:6px; height:1px; background:#aaa; position:absolute; top:13px; left:0; transform:rotate(-45deg)}
.tab_radio{border-top:1px solid #333; background:#f9f9f9; padding:20px}
.tab_radio .price-radio{position:relative; left:0; margin:0}
.tab_radio .price-radio li, .tab_radio .price-radio label{margin:0; border-radius:5px}
.tab_radio .price-radio li + li{margin-left:5px}
.tab_radio .price-radio label{border:1px solid #ddd; background:#fff}
.tab_radio .price-radio input:checked + label{border:0}
.sorting{margin:15px 0 0; display:flex; justify-content:space-between; align-items:center}
.sorting ul{display:flex; margin:0}
.sorting li + li{margin-left:10px; padding-left:10px; position:relative}
.sorting li + li::before{content:''; position:absolute; top:8px; left:0; width:1px; height:11px; background:#aaa}
.sorting li a{font-size:14px; color:#999}
.sorting button{min-width:100px}
.sorting button i{margin-left:5px}
.publish_radio{display:inline-block; display:none}
.publish_radio.active{display:inline-block}
.border-red{border:1px solid rgba(219, 9, 9, 0.3)}

/* 행정실결제 */
.admin_page{margin:50px auto 100px}
.admin_page > div + div{margin-top:50px}
.admin_page .dl-table .vtop label{padding-left:20px}
.admin_chk{width:20px; height:20px; vertical-align:middle; display:inline-block}
.admin_chk input[type="checkbox"]{display:inline-block; -webkit-appearance:none; -moz-appearance:none; appearance:none; width:20px; height:20px; border:1px solid #ccc; border-radius:0; background:#fff; margin:0 !important; position:relative}
.admin_chk input[type="checkbox"]:checked:before{content: ''; position: absolute; width:14px; height:9px; background: transparent; top:3px; left:2px; border:3px solid #1d73bc; border-top: none; border-right: none;  transform: rotate(-45deg); border-radius:2px; outline:none;}
.admin_btnarea{display:flex; justify-content:space-between; align-items:center}
.admin_btnarea .flex{display:flex; align-items:center}
.admin_btnarea .flex > *{width:auto}
.admin_btnarea .flex > * + *{margin-left:10px}
.admin_page .admin_list{margin-top:15px}
.email-send{border:1px solid #ddd; padding:20px 10px; margin-top:20px}
.email-send .form-inline{display:flex; justify-content:center}
.email-send .form-inline .btn{margin-left:10px}
.admin_page .admin_list h5{height:auto}

.select_search{display:flex; margin:15px 0}
.select_search > * + *{margin-left:10px}
.chk_select{position:relative; width:100%}
.chk_select .chk_slt{padding:0 10px; height:34px; line-height:34px; margin:0; border:1px solid #ccc; border-radius:3px; background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAABlBMVEX///8AAABVwtN+AAAAG0lEQVQYlWNgoBtghAF0EXQ16LrQzaGdExkYAA7LABpOJul5AAAAAElFTkSuQmCC") no-repeat right 10px center; cursor:pointer}
.chk_select ul{position:absolute; top:33px; left:0; background:#fff; border:1px solid #ccc; width:100%; padding:15px; z-index:2; display:none}
.chk_select li + li{padding-top:10px; margin-top:10px; border-top:1px dashed #ddd}

.admin_login{margin:50px auto 100px; max-width:500px}
.admin_login .text{margin:20px 0 30px; font-size:16px}
.admin_login .login_box{border:1px solid #ddd; padding:20px}
.admin_login .login_box > div{display:grid; grid-template-columns:auto 100px; column-gap:5px}
.admin_login .login_box > div + div{margin-top:10px}
.admin_login .login_box input{border:1px solid #b7b7b7; padding:0 15px; height:37px; width:100%; font-size:15px; border-radius:3px}
.admin_login .login_box p{margin-top:20px; color:#ff5c5c; text-align:center}
.w-full{width:100%}

/* 쿠폰시스템 추가 */
.table_box tr > *{border:1px solid #ddd; padding:10px}
.table_box thead th{background:#f0f2f3; text-align:center; font-weight:500}
.table_box .point_box{display:grid; grid-template-columns:95px 15px auto; column-gap:5px; align-items:center; margin-top:10px}
.table_box .point_box span{font-size:15px}

.coupon_list ul + ul{margin-top:20px; padding-top:20px; border-top:1px solid #ddd}
.coupon_list li + li{margin-top:10px}
.coupon_list li{display:grid; grid-template-columns:auto 100px; filter:drop-shadow(0 5px 2px rgba(0,0,0,.05))}
.coupon_list li > div{border:1px solid #ddd; border-radius:10px; padding:20px; position:relative; background:#fff; min-width:0; overflow:hidden}
.coupon_list .tit{font-size:30px; color:#ff486c; font-weight:bold; margin:0}
.coupon_list .text{max-width:100%; overflow:hidden; margin-bottom:15px}
.coupon_list .text span{font-weight:500; color:#000; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; display:block}
.coupon_list button{border-radius:10px}
.coupon_list button i{display:block; width:36px; height:36px; background:url('../../image/ssam/coupon_download.png'); margin:0 auto 10px}
.coupon_list label{position:absolute; top:15px; right:20px; margin:0; border-radius:100px; color:#fff; background:#6a6f78; width:120px; text-align:center; padding:0 15px; height:28px; line-height:26px; font-weight:500}
.coupon_list .swiper-pagination{width:100%; margin-top:10px}
.coupon_list .swiper-pagination-bullet{background:#ddd; margin:0 3px}
.coupon_list .swiper-pagination-bullet-active{background:#3770c1}
.channel-header .coupon_list{margin-bottom:50px; padding-bottom:50px; position:relative}
.channel-header .coupon_list::before{content:''; position:absolute; bottom:0; left:-9999px; right:-9999px; height:1px; background:#ddd}
.channel-header .coupon_list ul{margin:0}
.channel-header .coupon_list li{margin:0}
.coupon_list li.soldout div::before{content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:url('https://tvcache.teacherville.co.kr/ssam/event/2024/240530_soldout.png') no-repeat center rgba(255,255,255,0.5); z-index:2; background-size:55% auto}
.coupon_list li.soldout button{background:#939393 !important; cursor:default}

.coupon_info{display:grid; grid-template-columns:135px auto 95px 145px; align-items:center; column-gap:10px; margin:0}
.coupon_info + .coupon_info{margin-top:10px}
.coupon_info dt{font-weight:500; padding:0 15px; height:30px; line-height:28px; text-align:center; border:1px solid #ddd; border-radius:100px}
.coupon_info dd{font-weight:normal}
.creator_con .guide-info{padding:10px 0 0; border:0}

.coupon_box{padding:15px; border:1px solid #ddd}
.coupon_box .noti{text-align:right; margin-bottom:15px}
.coupon_box > div{display:flex}
.coupon_box dl{width:100%; border-radius:10px; border:1px solid #ebebeb; margin:0; display:inline-grid; grid-template-rows:50px auto; text-align:center; overflow:hidden; align-items:center}
.coupon_box dl + dl{margin-left:10px}
.coupon_box dt{background:#7f7f7f; height:100%; line-height:50px; color:#fff}
.coupon_box dd{font-weight:bold; padding:10px}
.coupon_box dd p{line-height:1.2; margin-top:5px}
.coupon_box strong{display:block; font-size:18px; line-height:1}

.coupon_add{display:grid; grid-template-columns:100px auto 135px; column-gap:20px; align-items:center}
.coupon_add p{font-size:20px; font-weight:500; margin-bottom:0; text-align:center}

.coupon_my{margin:10px -10px -10px; display:flex; flex-wrap:wrap}
.coupon_my li{margin:10px; width:calc(50% - 20px); display:inline-block; border:1px solid #ddd; border-radius:15px; padding:10px 20px; position:relative}
.coupon_my label{width:100px; color:#fff; height:28px; line-height:26px; position:absolute; left:-1px; top:17px; border-radius:0 100px 100px 0; padding-left:20px}
.coupon_my .flexbox{padding-left:95px}
.coupon_my .flexbox p{font-size:26px; font-weight:bold; margin-bottom:0}
.coupon_my .nowrap2{ font-weight:500; margin:20px 0}
.coupon_my label i{width:24px; height:13px; background:url('../../image/ssam/240416_unlimit.png'); display:inline-block; vertical-align:middle; margin:-2px 3px 0 0}

.main-channel{overflow:hidden;}
.channel-content{display:flex;}
.channel-items{animation:flow-right-to-left 90s linear infinite; display:flex; flex-wrap:nowrap; width:fit-content;}
@keyframes flow-right-to-left{0%{transform:translateX(0%);} 100%{transform:translateX(-50%);}}
.main-channel:hover .channel-items{animation-play-state:paused;}
.channel-items .channel{margin-right:20px; width:137px; flex-shrink:0; position:relative;}
.channel-items .channel:hover img{transform:scale(1.1); transition:all 0.5s ease-in-out;}
.channel-items .maskimg{padding-bottom:100%; border-radius:100%; border:1px solid #ddd}
.channel-items .ch_blt{display:inline-block; max-width:49px; width:18%; height:70px; background:url('../../image/ssam/renewal/channel_blt.svg') no-repeat top; position:absolute; top:10px; left:10px; background-size:100% auto}
.channel-items .tit{background:url('../../image/ssam/renewal/channel_arrow.svg') no-repeat right 10px center #7dd6f6; background-size:4px 8px; color:#217a9a; position:relative; margin:-13px 0 0; height:25px; line-height:25px; padding:0 20px 0 10px; border-radius:100px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:12px;}
.channel-items .no-img{background-position:55% center;}

.maskimg label + label.gradient_blue{left:63px}
.maskimg label.gradient_blue span{animation:blink1 0.6s infinite}
@keyframes blink1{0%,100%{opacity:0.1} 50%{opacity:1}}


@media (max-width: 991px) {
    .admin_page .admin_list .table{border-bottom:1px solid #ddd}
    .admin_page .admin_list .table td{padding:0 10px 10px 10px !important; border-bottom:0 !important}
    .admin_page .table .text-state{padding:0 0 10px}
}

@media (max-width: 767px) {
    .admin_page > div + div{margin-top:30px}
    .admin_btnarea .flex > * + *{margin-left:5px}
    .admin_btnarea .flex .btn{padding:4px 8px 6px; min-width:auto}
    .admin_btnarea .selectbox{margin-left:5px; min-width:auto; width:100%}
    .email-send .form-inline{display:block;}
    .email-send .form-inline .btn{margin:10px 0 0 0; width:100%}
    .admin_login{padding:0 10px}
    .admin_login .text{margin:10px 0 20px; font-size:14px}
    .admin_login .login_box p{font-size:14px}
    .admin_login .login_box{padding:20px 10px}
    .admin_login .login_box input{padding:0 10px}

    .items li .maskimg label + label.gradient_blue{left:55px}
}


/* 기관쌤모임 */
:root{
    --font-16:16px
}

.table01{border:1px solid #ddd; border-top:1px solid #474747; width:100%}
.table01 tr > *{padding:15px; border-bottom:1px solid #ddd; color:#666; font-size:var(--font-16)}
.table01 thead th{font-weight:normal}
.table01 tbody th{background:#f8f8f8; font-weight:500}
.table01 th{width:20%}
.table01 td{width:32%}
.table01.col2 th{width:25%}
.table01.col2 td{width:75%}
.table01 .flexbox > * + *{margin-left:10px; flex-shrink:0}
.table01 .form-control{font-size:var(--font-16)}
.table01.fixed{table-layout:fixed}
.table01.fixed tr > *{width:auto}

.radio01{font-weight:normal; cursor:pointer}
.radio01 input{display:inline-block; vertical-align:middle; -webkit-appearance:none; -moz-appearance:none; appearance:none; width:20px; height:20px; border:1px solid #929292; border-radius:100%; background:#fff; margin:-1px 10px 0 0; position:relative}
.radio01 + .radio01{margin-left:40px}
.radio01 input[type="radio"]:checked:before{content:''; position:absolute; top:4px; left:3px; width:11px; height:11px; background:#474747; border-radius:100%}
.radioText{display:none}
.radioText.active{display:block}

.payCont{margin:30px auto 100px}
.newPayment{margin-top:50px; font-size:var(--font-16)}
.newPayment{display:grid; grid-template-columns:66% auto; column-gap:20px; align-items:flex-start;}
.newPayment h4{margin:0 0 15px}
.newPayment .leftBox > div:not(:first-child){margin-top:40px}
.newPayment .bold{color:#000; font-weight:500}
.checkPay{border-top:1px solid #474747; padding-top:20px}
.checkPay .method{display:table; width:100%; table-layout:fixed; border-collapse:collapse; margin-bottom:15px}
.checkPay .method > *{display:table-cell; text-align:center; border:1px solid #929292}
.payRadio{margin-bottom:0; cursor:pointer; padding:25px; font-size:var(--font-16); font-weight:normal; background:#f8f8f8; position:relative}
.payRadio input[type="radio"]{position:absolute; top:-1px; left:-1px; right:-1px; bottom:-1px; border:0; border-radius:0; -webkit-appearance:none; -moz-appearance:none; appearance:none; margin:0; cursor:pointer}
.payRadio input[type="radio"]:checked:before{content:''; position:absolute; top:0; left:0; width:100%; height:100%; border:2px solid #1f75bb}
.payRadio i{display:inline-block; margin-right:10px; vertical-align:middle}
.payRadio .card{background:url('//tvcache.teacherville.co.kr/ssam/img/ic_payment_card_visa.png') no-repeat center; width:44px; height:31px}
.payRadio .payco{background:url('//tvcache.teacherville.co.kr/ssam/img/ic_payment_card_payco.png') no-repeat center; width:33px; height:32px}
.payRadio .samsung{background:url('//tvcache.teacherville.co.kr/ssam/img/ic_payment_card_samsung.png') no-repeat center; width:36px; height:36px}
.payRadio .bank{background:url('//tvcache.teacherville.co.kr/ssam/img/ic_payment_bank.png') no-repeat center; width:44px; height:31px}
.payTotal .info{padding:20px; border:1px solid #ddd; font-size:var(--font-16); background:#fff; border-bottom:0}
.payTotal .bold{font-weight:bold !important; font-size:18px}
.payTotal .info dl{display:flex; justify-content:space-between; align-items:center}
.payTotal .info .total{margin:15px 0 0; padding-top:10px; border-top:1px solid #474747}
.payTotal .info .total dt{font-size:20px}
.payTotal .info .total dd{font-size:28px}
.payTotal .info p{font-size:var(--font-16); color:#666; margin:15px 0}
.payTotal .pay_btn{border:1px solid #ddd; border-top:0; padding:0 20px 20px}
.payTotal .pay_btn p{color:#666; margin-bottom:15px}
.payTotal{position:sticky; top:20px; z-index:10}
.pay_agree{border:1px solid #ddd; border-top:0; background:#f8f8f8; color:#666}
.pay_agree > div{padding:20px}
.pay_agree > div + div{border-top:1px solid #ddd}
.pay_agree p{margin-bottom:0; font-weight:500}
.through{text-decoration:line-through !important}
.dc_box{display:grid; grid-template-columns:40% 90px auto; align-items:center; column-gap:10px}
.inputbox{border:1px solid #ddd; display:inline-block; padding:0 10px; height:34px; line-height:32px; overflow:hidden; font-weight:500; color:#333; display:flex; background:#fff}
.inputbox input{border:0; padding:0; text-align:right; width:calc(100% - 15px); margin-right: 5px;}

.ssam_tit{border:1px solid #ddd; border-radius:10px; padding:20px; margin-top:20px; display:flex; align-items:center}
.ssam_tit > * + *{margin-left:10px}
.ssam_tit h3{margin:0}
.ssam_tit i{display:inline-block; margin:-3px 10px 0 0; width:28px; height:28px}
.ssam_tit span{font-size:var(--font-16)}
.ssam_tit .icon01{background:url('//tvcache.teacherville.co.kr/ssam/img/tit_icon01.png') no-repeat center; vertical-align:middle}
.ssam_tit .icon02{background:url('//tvcache.teacherville.co.kr/ssam/img/tit_icon02.png') no-repeat center; vertical-align:middle}
.ssam_tit .icon03{background:url('//tvcache.teacherville.co.kr/ssam/img/tit_icon03.png') no-repeat center; vertical-align:middle}

.ssam_point{display:grid; grid-template-columns:60% 40%; margin:20px 0; border:1px solid #ddd}
.ssam_point > div{padding:20px}
.ssam_point.box2{display:block; border:0; padding:0}
.ssam_point *, .point_list_wrap{font-size:var(--font-16)}
.ssam_point dl, .ssam_point.box2 dl{display:grid; grid-template-columns:85px auto; align-items:center; margin-bottom:0}
.ssam_point .infobox dd .btn{flex-shrink:0}
.my_point dl{display:flex !important; justify-content:space-between}
.ssam_point dl + dl{margin-top:10px; padding-top:10px}
.ssam_point .my_point{border-left:1px solid #ddd; padding:15px 20px; background:#f8f8f8; display:grid}
.ssam_point .my_point dl + dl{border-top:1px solid #ddd; margin-top:15px; padding-top:15px}
.my_point dd{font-size:20px; font-weight:bold; color:#1d73bc}
.border0{border:0 !important}
.term-search-wrap.border0{padding:0}
.ssam_point.box2 .my_point{margin:20px 0; border-left:0; display:flex; padding:0; background:0}
.ssam_point.box2 .my_point dl{width:100%; border:1px solid #ddd; border-radius:10px; padding:15px 20px; background:#f8f8f8}
.ssam_point.box2 .my_point dl + dl{margin:0 0 0 20px}
.point_term{margin:50px 0 30px}
.point_term .tit{text-align:center; font-size:18px}
.point_term ul{display:flex; margin:25px -5px -5px}
.point_term li{font-size:var(--font-16); width:100%; margin:5px; text-align:center; border:1px solid #ddd; border-radius:10px; display:flex; justify-content:space-between; padding:10px}
.ssam_point .kakaobox{margin:20px -20px -20px; padding:20px; border-top:1px solid #ddd; display:flex}
.ssam_point .kakaobox .btn{background:#fff200; border:1px solid #fff200; color:#381e1e; flex-shrink:0; margin-right:10px; font-weight:500; display:flex; justify-content:center; align-items:center}
.ssam_point .kakaobox small{font-size:14px; line-height:1.3}

.point_list_wrap{border:1px solid #ddd; padding:20px}
.point_input{border-bottom:1px solid #ddd; padding-bottom:20px; margin-bottom:20px}
.point_input .flexbox .btn{flex-shrink:0}
.point_input .flexbox > * + *{margin-left:10px}
.lg_chk{vertical-align:middle; display:inline-block; margin:0; font-weight:normal}
.lg_chk input[type="checkbox"]{display:inline-block; -webkit-appearance:none; -moz-appearance:none; appearance:none; width:20px; height:20px; border:1px solid #999; border-radius:0; background:#fff; margin:0 10px 0 0!important; position:relative; vertical-align:middle}
.lg_chk input[type="checkbox"]:checked:before{content: ''; position: absolute; width:14px; height:9px; background: transparent; top:3px; left:2px; border:3px solid #1d73bc; border-top: none; border-right: none;  transform: rotate(-45deg); border-radius:2px; outline:none}
.point_list{margin-top:20px}
.point_list li{padding:20px; display:grid; grid-template-columns:20px auto 20px; align-items:flex-start; border:1px solid #ddd; background:#f8f8f8}
.point_list li + li{margin-top:10px}
.point_list .inputarea{margin:0 40px 0 20px}
.point_list .grid{display:grid; grid-template-columns:100px repeat(3, 1fr); align-items:center; column-gap:20px; margin:10px 0 0}
.point_list .grid .form-control{border:1px solid #ddd; border-radius:0; width:calc(100% - 30px) !important}
.point_list .grid .ui-datepicker-trigger{border:1px solid #ddd; border-radius:0; border-left:0}
.point_list .icn-del{text-indent:-9999px; margin-top:5px}
.point_list .wave{position:relative}
.point_list .wave::before{content:'~'; position:absolute; top:50%; transform:translateY(-50%); left:-15px}
.ssam_list li{display:grid; grid-template-columns:auto 140px}
.ssam_list dl{display:grid; grid-template-columns:100px auto; margin:0}
.ssam_list dl + dl{margin-top:20px}
.ssam_list .btn + .btn{margin-top:20px}
li.no-list{border:0 !important; display:block !important; text-align:center; width:100% !important}

.lg_tab{display:flex; margin-bottom:30px}
.lg_tab > *{width:100%; border:1px solid #ddd; background:#f8f8f8; font-size:18px; height:60px}
.lg_tab > * + *{margin-left:20px}
.lg_tab .on{background:#1d73bb; border:0; color:#fff}

.ssam_buy{display:flex; flex-wrap:wrap; margin:-10px; font-size:var(--font-16)}
.ssam_buy li{margin:10px; width:calc(25% - 20px); border:1px solid #ddd; padding:20px}
.ssam_buy .tit{margin:10px 0; font-weight:500; color:#000}
.ssam_buy .price{font-size:20px; font-weight:bold; color:#000; display:flex; height:34px; line-height:34px}
.ssam_buy .price > * + *{margin-left:10px}
.ssam_buy dl{margin-bottom:5px}
.ssam_buy dl *{font-weight:normal; color:#999}
.ssam_buy .btn{margin:15px -20px -20px; width:calc(100% + 40px); height:50px; border-radius:0}

.pop_box{border-top:1px solid #ddd; padding-top:20px}
.pop_box *{font-size:16px}
.pop_box h5{font-size:18px; margin:0 0 20px}
.pop_box li + li{margin-top:10px}
.price_box{border:1px solid #ddd; padding:20px 10px; display:flex; align-items:center; margin-top:20px}
.price_box > div{width:100%; text-align:center; position:relative}
.price_box .tit{margin-bottom:5px}
.price_box .price{font-size:20px; font-weight:bold; margin-bottom:0}
.price_box .minus::before{content:''; width:12px; height:2px; background:#000; position:absolute; top:50%; transform:translateY(-50%); left:-6px}
.price_box .total::before{content:''; width:12px; height:8px; border-top:2px solid #000; border-bottom:2px solid #000; position:absolute; top:50%; transform:translateY(-50%); left:-6px}
.price_box .line::before{content:''; width:1px; height:42px; background:#ddd; position:absolute; top:50%; transform:translateY(-50%); left:-6px}

.items li .maskimg label + label.gradient_blue{left:55px}
.member_tb tr > *{padding:10px; border:1px solid #ddd}
.member_tb th{background:#f1f1f1}
.couponModal{padding-right: 0px !important;}
.view-contents ul{list-style: revert-layer; padding: revert;}

.meet_swiper .swiper-wrapper{position:absolute}
.meet_swiper .swiper-slide{position:inherit}
.meet_swiper .meet_dim{position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(69,69,69,0.8); z-index:2; display:flex; justify-content:center; align-items:center; display:none}
.meetingList li:hover .meet_dim{display:flex}
.meet_swiper .meet_dim > div{width:calc(100% - 40px); text-align:center}
.meet_swiper .meet_dim .tit{font-size:22px; color:#fff; font-weight:bold; margin-bottom:15px}
.meet_swiper .meet_dim .bar{width:100%; height:30px; border-radius:100px; overflow:hidden; position:relative; background:#fff; border:0}
.meet_swiper .meet_dim span{position:absolute; top:0; left:0; height:100%; border-radius:100px; background:url('https://tvcache.teacherville.co.kr/ssam/event/2024/240911_bar.png'); background-size:auto 100% !important; border:0; filter:drop-shadow(2px 0 5px rgba(0,172,255,0.2))}
.meet_swiper .meet_dim.end span{background:url('https://tvcache.teacherville.co.kr/ssam/event/2024/240911_bar_end.png')}
.meet_swiper .swiper-pagination{display:none}

.view-contents ul{list-style:revert-layer; padding:revert-layer}

.upload_btn{position:relative; display:inline-block}
.upload_layer{position:absolute; top:45px; left:0; padding:20px; border-radius:5px; border:1px solid #ddd; background:#fff; z-index:2; display:none}
.upload_layer li + li{margin-top:10px; padding-top:10px; border-top:1px solid #ddd}
.upload_layer li a{white-space:nowrap; color:#888}
.upload_layer li a:hover{color:#222}

.fixbanner_b{position:fixed; bottom:0; left:0; width:100%; z-index:3; background:#474747; font-family:'Gmarket Sans'; padding:20px 0; font-size:20px; transition:bottom .2s}
.fixbanner_b.bottom{bottom:-80px}
.fixbanner_b .inner{display:grid; grid-template-columns:1fr 2.2fr 2.2fr 1fr; gap:20px; align-items:center; justify-content:center; max-width:1080px;}
.fixbanner_b .title{font-family:'Gmarket Sans'; color:#fff; font-size:25px; margin:0 20px 0 0}
.fixbanner_b .f_box{display:flex; align-items:center;}
.fixbanner_b .f_box > *{width:100%; height:40px; line-height:45px}
.fixbanner_b .f_box .tit{background:url('https://tvcache.teacherville.co.kr/ssam/img/main/fix_tit01.png') no-repeat left 10px center #fff; border-radius:10px 0 0 10px; padding:0 30px 0 45px; display:flex; justify-content:space-between}
.fixbanner_b .f_box .tit a{text-decoration:underline; text-underline-offset:3px; color:#1d73bb}
.fixbanner_b .f_box .tit1{background-image:url('https://tvcache.teacherville.co.kr/ssam/img/main/fix_tit02.png')}
.fixbanner_b .c_box{background:url('../../image/ssam/renewal/channel_arrow.svg') no-repeat right 10px center #7dd6f6; background-size:auto 14px; border-radius:0 10px 10px 0; text-align:center; color:#217a9a;}
.fixbanner_b .b_box{background:url('../../image/ssam/renewal/arrow_white_r.svg') no-repeat right 10px center #797ef6; background-size:auto 14px; border-radius:10px; text-align:center; color:#fff; height:40px; line-height:45px;}


/* 쌤찾자무료화 */
.like_btn{text-indent:-9999px; width:29px; height:26px; position:absolute; top:20px; left:20px; background:url('https://tvcache.teacherville.co.kr/ssam/img/like_btn_off.png') no-repeat left top; z-index:1}
.like_btn.active{background:url('https://tvcache.teacherville.co.kr/ssam/img/like_btn_on.png') no-repeat left top}
.mw0{min-width:0 !important}
.chk_btn{border:1px solid #ccc; border-radius:6px; font-size:14px; font-weight:500; color:#000; letter-spacing:-1px; padding:6px 12px; margin:0 0 0 20px}
.chk_btn i{display:inline-block; width:20px; height:20px; vertical-align:middle; margin:-3px 0 0 10px; border:1px solid #ccc; background:#fff; position:relative}
.chk_btn.active i::before{content:''; position:absolute; width:11px; height:8px; background:transparent; top:3px; left:3px; border:3px solid #999; border-top:none; border-right:none;  transform:rotate(-45deg); border-radius:2px; outline:none}
.goodnm .touch_blt{position:relative; top:0; left:0; margin:-5px 0 0 10px; vertical-align:middle}
.product-info .ssam_info dl{overflow:hidden}
.product-info .ssam_info dt{width:130px}
.product-info .ssam_info dd{width:calc(100% - 130px); padding-left:30px}
.product-info .ssam_info dd::before{content:''; position:absolute; top:-20px; bottom:-20px; width:1px; left:0; background:#ddd}
.tabs-content .teacher-list{border:0; padding:0; height:auto}
.teacher_chat{display:flex; align-items:baseline; justify-content:space-between}
.teacher_chat > div{display:flex; align-items:baseline}
.teacher_chat > div > *{font-size:15px; font-weight:normal}
.teacher_chat p{font-weight:normal; min-width:0; margin-left:15px; color:#666}

.meet_swiper .swiper-wrapper{position:absolute}
.meet_swiper .swiper-slide{position:inherit}
.meet_swiper .meet_dim{position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(69,69,69,0.8); z-index:2; display:flex; justify-content:center; align-items:center; display:none}
.meetingList li:hover .meet_dim{display:flex}
.meet_swiper .meet_dim > div{width:calc(100% - 40px); text-align:center}
.meet_swiper .meet_dim .tit{font-size:22px; color:#fff; font-weight:bold; margin-bottom:15px}
.meet_swiper .meet_dim .bar{width:100%; height:30px; border-radius:100px; overflow:hidden; position:relative; background:#fff; border:0}
.meet_swiper .meet_dim span{position:absolute; top:0; left:0; height:100%; border-radius:100px; background:url('https://tvcache.teacherville.co.kr/ssam/event/2024/240911_bar.png'); background-size:auto 100% !important; border:0; filter:drop-shadow(2px 0 5px rgba(0,172,255,0.2))}
.meet_swiper .meet_dim.end span{background:url('https://tvcache.teacherville.co.kr/ssam/event/2024/240911_bar_end.png')}
.meet_swiper .swiper-pagination{display:none}


/* 쌤찾자 추가 */
.right_banner{position:fixed; bottom:20px; left:50%; margin-left:538px; width:163px}
.badge0{position:absolute; right:250px; animation:badge0 .7s infinite}
@keyframes badge0{0%, 100%{right:250px} 50%{right:260px}}