@charset "utf-8";
@import url("./admin.reset.css");
@import url("./admin.root.css");
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100&family=Roboto:wght@100;300;400;500;700;900&display=swap');

/** Login **/
.login-box{width:100%; min-height: 100vh; display: flex; align-items: center; justify-content: center;}
.login-bg {flex:1; height:100vh; background:linear-gradient(317deg, var(--main-color), var(--sub-main-color)); display: flex; justify-content: center; align-items: center; color:#FFF;}
.login-bg img {width:33rem;}
.login-cont {display: flex; align-items: center; flex:1; justify-content:space-between;flex-direction: column; height:520px;}
.login-cont footer { font-size: 14px; color: #AAA; }
.login-form { max-width: 100%; width: 420px;transition: all 0.2s;}
.login-form h1 {font-size:3.2rem; color:#000; text-align:center; margin-bottom:60px; font-weight:normal; font-family:'Roboto',sans-serif;}
.login-form h1 span { font-family:'Roboto',sans-serif; color:var(--main-color);}
.input-area {width:100%; position:relative; margin-top:20px;}
.input-area:first-child {margin-top:0;}
.input-area #id {background: url(/_asset/images/admin/adm_user.svg) no-repeat 12px 48px ;background-size: 24px 21px;}
.input-area #pw { background: url(/_asset/images/admin/adm_pass.svg) no-repeat 12px 48px; ;background-size: 21px 21px;}
.input-area input {width:100%;padding:50px 10px 14px 46px;border-bottom:1px solid #CCC;font-size:1.4rem; color:#444; outline:none; font-weight:400;}
.input-area input::placeholder {color:#CCC;}
.input-area label {font-family:'Roboto',sans-serif; position:absolute; left:10px; top:15px; font-size:1.7rem; color:var(--sub-color); transition: all .5s ease;}
.input-area label.warning {color:#ff1717 !important; animation:warning .4s ease; animation-iteration-count:4; -webkit-animation:warning .4s ease; -moz-animation:warning .4s ease;}
@keyframes warning{
  0%	{transform: translateX(-.8rem);}
  12.5%	{transform: translateX(.4rem);}
  25% {transform: translateX(-.8rem);}
  37.5%	{transform: translateX(.8rem);}
  50% {transform: translateX(-.4rem);}
  62.5%	{transform: translateX(.8rem);}
  75% {transform: translateX(-.4rem);}
  87.5%	{transform: translateX(.8rem);}
}
.input-area input:focus + label, .input-area input:valid + label { top:-2; font-size:1.5rem; color:var(--main-color);}
.input-area input:focus, .input-area input:valid {border-bottom-color:var(--login-input-line-color);}
.btn-area {margin-top:5rem;}
.btn-area button {width:100%;height:50px;background:var(--login-btn-color); color:#fff; border:none; border-radius:1rem; font-size:1.6rem; transition:all ease .2s;-webkit-transition:all ease .2s; font-weight:500;    display: flex;justify-content: center;align-items: center;line-height: 2;}
.btn-area button:hover {background-color:var(--login-btn-hover-color);}
.caption-box {display: flex; align-items: center; gap:1.4rem; padding-left:1rem;}
.caption { margin-top:2rem; display:flex; justify-content: center; align-items: center;}
.caption label { font-size:1.3rem; color:#CCC; text-decoration:none;transition:all ease .2s;-webkit-transition:all ease .2s; margin-right:.6rem; font-weight:300; position:relative; cursor:pointer; padding-left:2.6rem;}
.caption label:hover { color:#000; }
.caption input[type='checkbox']:hover + label, .caption input[type='checkbox']:checked + label { color:#000;}
.caption input[type='checkbox'] {display:none;}
.caption input[type='checkbox']+label::before {background:url(/_asset/images/admin/checkbox-off.svg) no-repeat 0px 1px;background-size: 20px 21px; content:"";width:20px;height:22px;position:absolute;left:0; top:-3px; transition:all ease .2s;}
.caption input[type='checkbox']:checked+label::before {background:url(/_asset/images/admin/checkbox-on.svg) no-repeat 0px 1px;background-size: 20px 21px; border:none;}
@media screen and (max-width: 1200px) {
  .login-bg {display:none;}
}
@media screen and (max-width: 500px) {
.login-form {width:360px;}
.login-form h1 {font-size:2.8rem;}
}
@media screen and (max-width: 360px) {
.login-form {width:280px;}

}


/** Dashboard **/

.home_body{min-width:1450px;}
.side-bar{ position:fixed; top:0; left:0; height:100%; width: 25rem; background:var(--color-white); transition: all 0.5s ease; z-index:99; }
.side-bar.close { width:78px;    height: 100%; }
.side-bar .logo-details { height:60px; width:100%; display:flex; align-items: center; background: var(--main-color);}
.side-bar .logo-details i { font-size:2rem; color:var(--color-white); height:50px; min-width: 78px; text-align: center; line-height: 50px; }
.side-bar .logo-details .logo_name { font-size:1.6rem; transition: 0.3s ease; transition-delay:0.1s; color:white;  font-family: 'Roboto', sans-serif;}
.side-bar.close .logo-details .logo_name { transition-delay:0s; opacity: 0; pointer-events:none; }
.side-bar .nav-links { background: var(--color-white); height:100%; padding :10px 0 150px 0; overflow:auto; }
.side-bar.close .nav-links { overflow: visible; }
.side-bar .nav-links::-webkit-scrollbar{ display:none; }
.side-bar .nav-links li { position: relative; list-style: none; transition:all 0.5s ease; color:var(--color-black); }
.side-bar .nav-links li:hover div,.side-bar .nav-links li:hover .sub-menu { background: #F6F6F6; }
.side-bar .nav-links li.profile:hover div {background: var(--color-black) !important;}
.side-bar .nav-links li.profile:hover .logout-watch {background: var(--main-color) !important;}
.side-bar .nav-links li .icon-link { display:flex; align-items: center; justify-content: space-between; }
.side-bar.close .nav-links li .icon-link { display:block }
.side-bar .nav-links li i:not(.profile > .logout-watch > i) { height:5rem; line-height:5rem; min-width: 78px; text-align: center; color:var(--color-black); opacity:.6;font-size:2.4rem; cursor:pointer; transition: all 0.5s ease; }
.side-bar .nav-links li i.bx-log-out { color:var(--color-white) !important;}
.side-bar .nav-links li i.arrow {color:var(--color-black);}
.side-bar .nav-links li:hover i{opacity:1;}
.side-bar .nav-links li.show-menu i.arrow { transform:rotate(-180deg); }
.side-bar.close .nav-links i.arrow { display: none; }
.side-bar .nav-links li a,.side-bar .nav-links li b { display:flex; align-items: center; text-decoration: none; }
.side-bar .nav-links li a .link_name { font-size:1.65rem; ; color:#525252; white-space: nowrap; /* word-break: keep-all; */ opacity: 1; transition: all 0.3s ease; font-weight:500; }
.side-bar.close .nav-links li a .link_name { opacity: 0; pointer-events:none; }
.side-bar .nav-links li .sub-menu { padding:1rem 0.6rem 0.9rem 7.8rem; margin-top:-10px; display:none; }
.side-bar .nav-links li.show-menu .sub-menu { display: block; }
.side-bar .nav-links li .sub-menu a { color:var(--color-black); font-size:1.5rem; padding:.4rem 0; white-space:nowrap; opacity: 0.6; transition: all 0.5s ease; ; }
.side-bar .nav-links li .sub-menu a.sel {opacity: 1;}
.side-bar .nav-links li .sub-menu a:hover { opacity: 1; }
.side-bar .nav-links li .sub-menu b { color:var(--color-black); font-size:1.5rem; padding:.5rem 0; white-space:nowrap; font-weight:400; }
.side-bar.close .nav-links li .sub-menu { position: absolute; left:100%; top:-10px; margin-top:0; padding: 10px 20px; border-radius: 0 6px 6px 0; opacity:0; display:block; pointer-events:none; transition: 0s; box-shadow: 2px 2px 2px #b1b1b1; }
.side-bar.close .nav-links li:hover .sub-menu,.side-bar.close .nav-links li.on .sub-menu { top:0; opacity: 1; pointer-events:auto; transition: all 0.5s ease; }
.side-bar .nav-links li .sub-menu .link_name { display:none; }
.side-bar.close .nav-links li .sub-menu .link_name { font-size:1.55rem; opacity: 1; display: block; }
.side-bar.close .nav-links li .sub-menu.blank { pointer-events: auto; padding: 3px 20px 6px 16px; opacity: 0; pointer-events: none; }
.side-bar.close .nav-links li:hover .sub-menu.blank { top:50%; transform:translateY(-50%); opacity: 1; }
/* .side-bar .profile-details { position:fixed; bottom:0; width: 25rem; background: var(--main-color); display: flex; align-items: center; justify-content: space-between;  padding:6px 0; transition: all 0.5s ease; height:6.4rem; } */
.side-bar .profile-details { position:fixed; bottom:0; width: 25rem; background: var(--footer-bg-color); display: flex; align-items: center; justify-content: space-between;  padding:6px 0; transition: all 0.5s ease; height:6.4rem; }
.side-bar.close .profile-details  { width: 78px; }
.side-bar .profile-details .profile-content { display: flex; align-items: center; transition: all .5s ease; }
/* .side-bar .profile-details img { height:52px; width:52px; background: var(--main-color); object-fit:cover; border-radius: 16px; margin: 0 14px 0 12px;  transition: all 0.5s ease; } */
.side-bar .profile-details img { height:52px; width:52px; background: var(--footer-bg-color); object-fit:cover; border-radius: 16px; margin: 0 14px 0 12px;  transition: all 0.5s ease; }
.side-bar.close .profile-details img { padding:10px; }
.side-bar .profile-details .profile_name,
.side-bar .profile-details .job { color:var(--footer-text-color); font-size:1.4rem; white-space:nowrap; }
.side-bar.close .profile-details i,
.side-bar.close .profile-details .profile_name,
.side-bar.close .profile-details .job{ display: none; }
.side-bar .profile-details .job { font-size:1.5rem; }
.home-section { position: relative; background:var(--section-bg-color); height:100vh; left:25rem; width:calc(100% - 25rem); transition: all 0.5s ease;  }
.side-bar.close ~ .home-section {left:78px; width:calc(100% - 78px);}
.home-section .home-content { padding-bottom: 3rem; min-height: calc(100vh - 6.4rem); background: var(--section-bg-color); }
/* .home-section .footer { bottom:0; width:100%; background:var(--main-color); text-align:center; height:64px; display: flex; align-items: center; justify-content: center;transition: all 0.5s ease; } */
.home-section .footer { bottom:0; width:100%; background:var(--footer-bg-color); text-align:center; height:64px; display: flex; align-items: center; justify-content: center;transition: all 0.5s ease; }
.home-section .footer p { color:var(--footer-text-color); font-size:1.5rem; }
.side-bar.close ~ .home-section .footer { width:100%; }

.card-wrapper  { margin: 0 auto; padding:20px;}
.card-container{ display:flex; flex-wrap: wrap; gap:1.5rem;}
.card-container .card-box {position:relative; flex-basis: 300px; flex-grow:1; }
@media screen and (max-width: 800px) {
  .card-container .card-box.flex1 {flex:auto !important;}
  .card-container .card-box.flex2 {flex:auto !important;}
  .card-container .card-box.flex3 {flex:auto !important;}
  .card-container .card-box.flex4 {flex:auto !important;}
  .card-container .card-box.flex5 {flex:auto !important;}
  .card-container .card-box.flex6 {flex:auto !important;}
  .card-container .card-box.flex7 {flex:auto !important;}
  .card-container .card-box.flex8 {flex:auto !important;}
  .card-container .card-box.flex9 {flex:auto !important;}
  .card-container .card-box.flex10 {flex:auto !important;}
}

.card-container .card-box .card-content { min-height:80px; }
.card-container .card-box h3, h3.card-header { font-size:1.8rem; margin-bottom: 0.7rem; display: flex; align-items: center; font-weight: 500;}
.card-container .card-box h3 i, h3.card-header i {font-size:2.3rem; margin-right:0.5rem; background:linear-gradient(to right bottom, var(--main-color), var(--sub-main-color)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;}
.card-container .card-box h3 > span { margin-left:2rem;display: flex; gap:1rem;}
.card-container .card-box h3 > span > label { display: flex; align-items: center; gap:0.5rem; font-size:1.55rem; font-weight:400;}
.card-container .card-box h3 > span > button { background: #444; color: white; border-radius: 6px; padding: 0.5rem 1rem; font-size:1.5rem; font-weight: 500; }
.card-container .img-view-box { border: 1px solid #CCC; max-height:400px; display: flex; flex-direction: column; justify-content: center; align-items: center; font-size:1.55rem; font-weight: 300; }
.card-container .img-view-box a {width: 100%;height:100%;text-align:center;}
.card-container .img-view-box a img {margin: 0 auto; max-width: 100%; object-fit: cover; max-height:100%;}
.card-container p.sub-info {padding:0.5rem 0rem; font-size:1.5rem; color:#909090; ; display:flex; align-items:center;letter-spacing: -0.06rem;}
.card-container p.sub-info i {font-size:2.3rem; color:var(--help-icon-bg-color); margin-right:0.5rem; margin-left:.4rem;}
.card-container p.sub-info s {font-size:1.5rem; margin:0px 5px;}
.card-container .caption {display:flex; justify-content:space-between; width:100%; align-items: center; flex-wrap:wrap; gap:1.3rem; color:#444;}
.card-container .caption div:first-child {text-align: left; font-size:1.5rem; display: flex; align-items: center; gap: .6rem; font-weight: 500; letter-spacing: -0.05rem;}
.card-container .caption div:last-child {text-align: right; font-size:1.5rem; display: flex; align-items: center; gap: .6rem;}

.card-container .help-info {padding:0.5rem 0rem; font-size:1.5rem; color:#909090; ; display:flex; align-items:start; letter-spacing: -0.06rem;}
.card-container .help-info i {font-size:2.3rem; color:var(--help-icon-bg-color); margin-right:.6rem; margin-left:.4rem;}
.card-container .help-info .info-txt {flex:1; font-size:1.5rem; line-height: 1.6; }





.card-wrapper footer { display:flex; margin-top:6rem; justify-content:center; gap:1.3rem 1.5rem; align-items:center; flex-wrap:wrap; }
.card-wrapper footer button { display:inline-block; background: #444; color:var(--color-white); font-size:1.7rem;  padding:1.4rem; min-width:16rem; border-radius:1rem; box-shadow:0 5px 16px rgb(0 0 0 / 20%); transition: all 0.5s ease;}
.card-wrapper footer button:hover{ background:var(--color-black); }
.card-wrapper footer button.red { background:var(--color-red); }
.card-wrapper footer button.red:hover{ background:#990000; }
.card-wrapper footer button.gray { background:#A9A9A9; }
.card-wrapper footer button.gray:hover { background:#8A8A8A; }
.card-wrapper footer button.blue { background:#007cd3;  color:var(--color-white) !important; }
.card-wrapper footer button.blue:hover { background:#005ea0; }
.card-wrapper footer button.green { background:#36ac6a; }
.card-wrapper footer button.green:hover { background:#00652c; }

.card-content  { background: var(--color-white); position:relative; border-radius: 12px; flex-basis: 400px; flex-grow:1; box-shadow: 3px 2px 10px 2px var(--card-content-shadow-color); padding:15px 10px;}
.card-content.chart-card { width:49%;flex-basis:500px; }
.card-content h2 { font-size: 1.8rem; font-weight: 400; color: #222; padding: 0rem 1rem 1rem 1rem; margin-bottom: 1.5rem; letter-spacing: -0.05rem; border-bottom: 1px solid #ECECEC; display: flex; justify-content: space-between; align-items: center;}
.card-content h2 > a { font-size:1.5rem; color: #888; }
.card-content h2 > a > i { font-size: 1.65rem; color: #ff6cca; position: relative; top: 0.15rem; transition: all .3s ease;}
.card-content h2 > a:hover > i { color:#ff00a3;}
.card-content h2.input-label { font-size:1.8rem; padding: 0rem 1rem 1rem .5rem; margin-bottom:.5rem;}
.card-content hr {border: 1px solid #e8e8ff; margin: 1rem auto;}
.card-content ul.main-card { list-style: none; margin:0px 10px 76px; }
.card-content ul.order {margin: 0px 10px 120px;}
.card-content ul.main-card li {display: flex; justify-content: space-around; align-items: center; border-bottom: 0.01rem dotted #cccccc; padding-bottom: .6rem; margin-bottom: .6rem;}
.card-content ul.main-card li:last-child {margin-bottom:0; border-bottom:unset;}
.card-content ul.main-card li span {flex:2; font-size:1.5rem; }
.card-content ul.main-card li span.overHidden {overflow-x: hidden; white-space: nowrap; width: 10px; padding-right: 10px; text-overflow: ellipsis;}
.card-content ul.main-card li span.level{ flex:1.5; color:#777777; }
.card-content ul.main-card li span.short {flex:1; font-size:1rem;color:#444;}
.card-content ul.main-card li span.head {font-size:1.5rem; color:#444; font-weight:600;}
.card-content ul.main-card li span.center {text-align:center;}
.card-content ul.main-card li span.right {text-align:right;padding-right:1rem;}
.card-content ul.main-card li span.right b { font-size: 1.35rem; color: #6059a9; }
.card-content ul.main-card li span.category { flex:1; font-weight: 500; color: #444; font-size:1.5rem; }
.card-content ul.main-card li span.subject { flex:5; overflow-x: hidden; white-space: nowrap; width: 10px; padding-right: 10px; text-overflow: ellipsis;}
.card-content ul.main-card li span.subject a { font-size:1.5rem; ;}
.card-content ul.main-card li span.subject a:hover {font-weight:400;}
.card-content ul.main-card li span.subject strong {background: black; color:var(--color-white); border-radius: 0.03rem; background: #434cb9; color: var(--color-white); padding: 3px 5px; font-size: 1rem; border-radius: 5px; font-weight: 300; display: inline-block;}
.card-content ul.main-card li span.orderid { flex:2; white-space: nowrap; width: 10px; text-overflow: ellipsis; overflow-x: hidden; }
.card-content ul.main-card li span.orderid a { font-size:1.5rem; color:#8A8A8A; }
.card-content ul.main-card li span.orderid a:hover { color:#333; }
.card-content div.empty-card { font-size:1.5rem; font-weight: 300; color: #8d8d8d; flex-direction: column; justify-content: center; gap: 1rem; position: absolute; width: calc(100% - 20px); display: flex; align-items: center; height: calc(100% - 152px); }
.card-content div.empty-card.order {height: calc(100% - 216px);}
.card-content div.empty-card i { font-size: 3rem; color: #a0a0ff; }
.card-content .card-footer { position:absolute; bottom:0; width:100%; background: #1d1b30; left:0; display:flex; justify-content:space-around; align-items:center; border-bottom-left-radius: 12px;border-bottom-right-radius: 12px;}
.card-content .card-footer div { text-align: center; padding:1.6rem 0;}
.card-content .card-footer div p { font-size:1.5rem; font-weight: 400; color: #b5b5b5; margin-bottom: 0.2rem;}
.card-content .card-footer div span {font-size:1.26rem; ;color:var(--color-white)FFF;}
.card-content .card-footer div span strong {font-size:1.8rem;font-weight:600;color:#CACAFF;}
.card-content .order-footer { flex-wrap: wrap;}
.card-content .order-footer div { flex-basis:180px; padding:10px 0px; }
.card-content .sbtn-box { display:flex; padding:.5rem; align-items: flex-end;}

.card-content > .row-box + .input-box,
.card-content > .row-box + .row-box,
.card-content > .input-box + .input-box,
.card-content > .input-box + .row-box { margin-top:.6rem; }

.card-box > .card-content + .card-content {margin-top:1.5rem;}

.page-title { height:6rem; padding:0 1.5rem; background:var(--color-white); display: flex; align-items: center;box-shadow:0px 0px 3px 0px #929292; }
.page-title h1 { font-size:2rem; letter-spacing: -0.05rem; flex-shrink:0; font-weight:400; padding-left: 1.4rem; width: calc(100% - 60px);overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.page-title i { font-size:1.8rem; color:#444; font-weight:600; margin-right:0.5rem;}
.page-title i.mainicon {color:var(--main-color); font-size:2.4rem;transform: translateY(3px);}
.page-title h1 small { font-size:1.5rem; margin-left:1.6rem; ;color:#999; letter-spacing: -0.02rem;}

.row-box { display: flex; flex-wrap: wrap; flex:auto; gap:.6rem 1.2rem; }
.input-box {position:relative; display:flex; flex-direction: column; padding:0.5rem;    flex: auto;}
.input-box > label {display:block; font-size:1.5rem; font-weight:500; letter-spacing: -0.05rem; margin-bottom:0.5rem; color:var(--main-color);}
.input-box input[type=text], .input-box input[type=number], .input-box input[type=date], .input-box input[type=time], .input-box input[type=email], .input-box input[type=tel], .input-box input[type=url],
.input-box input[type=password], .input-box select { font-size:1.5rem; ; padding:.8rem;border:1px solid #d1d1d1; background-color:var(--color-white); color:var(--color-basic-text); border-radius:4px; /*box-shadow:0 1px 4px rgb(210 210 210);*/ }
.input-box textarea { font-size:1.5rem; padding: .8rem; border: 1px solid #d1d1d1; background-color: var(--color-white); color: var(--color-basic-text); border-radius: 4px; flex: auto; resize: none; line-height: 1.5; /*box-shadow:0 1px 4px rgb(210 210 210);*/ }
.input-box input[type=file] {display:none;}
.input-box input[type=date] {padding:.7rem;}
.input-box input[type=time] {padding:.5rem;}
/*.input-box input:focus, .input-box select:focus, .input-box textarea:focus {box-shadow:0 13px 34px rgb(233,233,233);}*/
.input-box input:focus, .input-box select:focus, .input-box textarea:focus {border:1px solid var(--main-color);}
.input-box input:disabled, .input-box input:read-only, .input-box input.readonly {cursor:default;}
.input-box input[type=text]:required, .input-box input[type=number]:required, .input-box input[type=date]:required, .input-box input[type=time]:required, .input-box input[type=email]:required, .input-box input[type=tel]:required, .input-box input[type=url]:required,
.input-box input[type=password]:required, .input-box textarea:required {position: relative; background-image: url(/_asset/images/admin/required.png) !important; background-repeat: no-repeat !important; background-position: calc(100% - .2rem) calc(0% + .2rem) !important; }
.input-box select:required{background-image: url(/_asset/images/admin/select_arrow.png), url(/_asset/images/admin/required.png) !important;background-repeat: no-repeat !important;background-position: right 1rem center, calc(100% - .2rem) calc(0% + .2rem) !important;}



.file-box input[type=text]:required {background-position: calc(100% - 5.9rem) calc(0% + .2rem) !important;}

.input-box input.post {max-width:9rem; cursor:pointer;}
.input-box input[type=text].readonly,.input-box input[type=number].readonly,.input-box input[type=email].readonly,.input-box input[type=tel].readonly,.input-box input[type=date].readonly,.input-box input[type=time].readonly, .input-box textarea.readonly,
.input-box .chk-box input[type='checkbox']:disabled + label,
.input-box .chk-box input[type='radio']:disabled + label {background: var(--color-light-gray); cursor:default;}
.input-box > .content-box, .input-box > .row-box > .content-box,.input-box > .row > .content-box,.input-box > .row-rsv > .content-box,.input-box > .col > .content-box,.input-box > .col-rsv > .content-box {
  border: 1px solid #D3D3D3; border-radius: 0.3rem; padding: 0.8rem 1rem; background: var(--color-white); font-size:1.5rem;
}
h2.input-label select { font-size: 1.1rem; ; padding:.4rem .8rem; border:1px solid #d1d1d1; background-color:var(--color-white); color:#6b6b6b; border-radius:4px; /*box-shadow:0 1px 4px rgb(210 210 210);*/ }

input.price, input.money {text-align: right;}
input::placeholder,textarea::placeholder { color:#CDCDCD; font-size:1.3rem; }
.input-box select { color:var(--color-gray); }
.input-box select.on {color:var(--color-basic-text);}
.input-box select {padding:.8rem;padding-right:2.6rem;min-width:6rem;}
.input-box select.small {padding:.6rem;padding-right:2.6rem;font-size:1.4rem;}

/* PA - 입금대기 #6C6C6C, PB - 결제완료 #2664b4, CA - 환불요청 var(--color-red), CB - 환불완료 #CDCDCD, */
.pay-PA {color:#6C6C6C !important; border:1px solid #6C6C6C !important;}
.pay-PB {color:#2664b4 !important; border:1px solid #2664b4 !important;}
.pay-CA {color:var(--color-red) !important; border:1px solid var(--color-red) !important;}
.pay-CB {color:#CDCDCD !important; border:1px solid #E7E7E7 !important;}

/* wait - 대기, ing - 진행중, rest - 휴식중, end - 종료 */
.cst-wait {color:#6C6C6C !important; border:1px solid #6C6C6C !important;}
.cst-ing  {color:var(--main-color) !important; border:1px solid var(--main-color) !important;}
.cst-rest {color:var(--color-orange) !important; border:1px solid var(--color-orange) !important;}
.cst-end  {color:#CDCDCD !important; border:1px solid #E7E7E7 !important;}

.sel-blue  {color: #2664b4 !important;border: 1px solid #2664b4 !important;}
.sel-green {color: var(--main-color) !important;border: 1px solid var(--main-color) !important;}
.sel-red   {color: var(--color-red) !important;border: 1px solid var(--color-red) !important;}





/* .li-PA {border:1px solid #F3F3F3 !important;}
.li-PB {border:1px solid #aaddc1 !important;}
.li-CA {border:1px solid var(--color-red) !important;}
.li-CB {border:1px solid #F6F6F6 !important; background: #E7E7E7} */

p.empty { text-align: center; font-size:1.5rem; height:3rem; color:#CCC;}



/* .input-box .chk-box {display:flex; flex-wrap:wrap; gap:1.3rem; margin-top: 0.4rem;}
.input-box .chk-box label { display: flex; align-items: center; font-size:1.5rem; cursor:default; ;}
.input-box .chk-box input[type=checkbox],
.input-box .chk-box input[type=radio] { width: 1.2rem; height: 1.2rem; margin-right: 0.5rem;} */

.input-box .chk-box {display:flex; flex-wrap:wrap; gap:.7rem;}
.input-box .chk-box input[type='checkbox'], .input-box .chk-box input[type='radio'] {display:none;}
.input-box .chk-box input[type='checkbox'] + label, .input-box .chk-box input[type='radio'] + label { border-radius:4px; border:1px solid #b6b6b6; background:var(--color-white); /*box-shadow:0 1px 4px rgb(210 210 210);*/ text-align:center;cursor:pointer; font-size:1.5rem;
transition:all .3s ease; padding:.8rem; color: var(--color-basic-text) ; min-width:6.5rem;  }
.input-box .chk-box input[type='checkbox']:checked + label, .input-box .chk-box input[type='radio']:checked + label { background:var(--main-color);border-color:var(--main-color);color:var(--color-white); font-weight:400;/*box-shadow:0 13px 34px rgb(233,233,233);*/ }
.input-box .chk-box input[type='checkbox'] + label > img, .input-box .chk-box input[type='radio'] + label > img { width: 2.2rem; height: 2.2rem; object-fit: contain; }
.input-box .btn-box input[type=text], .input-box .btn-box input[type=number], .input-box .btn-box input[type=date], .input-box .btn-box input[type=time], .input-box .btn-box input[type=email], .input-box .btn-box input[type=tel], .input-box .btn-box input[type=url],
.input-box .btn-box input[type=password] {font-size: 1.5rem; padding:1rem;border:1px solid #d1d1d1; background:var(--color-white); color:#6b6b6b; border-radius:4px; flex:auto;}

.input-box label.del {display: flex; align-items: center; font-size:1.5rem;}
.input-box label.del input[type=checkbox] { width: 1.4rem; height: 1.4rem; margin-right: 0.3rem;}

.input-box .opt-table {border-spacing:0; width: max-content;background:#ECECEC;; border-radius:4px; padding:0.5rem;}
.input-box .opt-table thead tr th { text-align: left; }
.input-box .opt-table thead tr th input { width:100%; }
.input-box .opt-table tr td, .input-box .opt-table tr th {padding:0.5rem;}
.input-box .opt-table td > input[type='tel']{max-width:80px;min-width:20px;}

.input-box .inner-table { padding-bottom:1rem;overflow:auto; overflow-x:scroll; width:calc(100vw - 360px);}
.inner-table::-webkit-scrollbar { height:6px; }
.inner-table::-webkit-scrollbar-thumb { background-color: #CCC; border-radius: 3px; }
.inner-table::-webkit-scrollbar-track { background-color: transparent; }

.input-box i.bxs-plus-square,
.input-box i.bxs-minus-square { font-size:3rem; cursor:pointer; transition:all 0.3s ease;}
.input-box i.bxs-plus-square:hover,
.input-box i.bxs-minus-square:hover { color:#444;}
.input-box .down i { font-size:3rem; cursor:pointer; transition:all 0.3s ease;}
.input-box .down i:hover {color: #444;}

.input-box .row-box { display: flex; align-items:center; }
.input-box .row-box span { font-size:1.4rem; }

.input-box > label.std {color:#777;}
.input-box > label.fri {color:#5aabff;}
.input-box > label.sat {color:#218ada;}
.input-box > label.sun {color:#ff6f6f;}
.input-box > label.holy {color:#dc2424;}
.input-box > label.bf-holy {color:#b60000;}

.icon-box {display:inline-block; white-space:nowrap; font-size:1.5rem; overflow: hidden; align-items: center; text-overflow: ellipsis; width:calc(100% - 14.5rem);}
.icon-box > .icon { width:2rem; height:2rem; object-fit: contain; margin-right:.6rem;  }

.price-box.other-price {padding-top:3.8rem;}
.price-box + .price-box {margin-top:1.8rem; border-top:1px solid #CCC;}
.price-box { display:flex; flex-flow:row wrap; justify-content: space-between; position: relative;}
.price-box > .row-box {align-items: center; gap:0rem 1.2rem;}
.price-box .prcdel {position: absolute; top:1.8rem; right:.5rem;}
.price-box .month, .price-box .day, .price-box .prccode {padding-right:3rem; flex:auto;}

.row-box .half {max-width: calc(50% - 1.2rem);}
.row-box.prd-box {padding:1rem;border:1px solid #CCC;}
.row-box.prd-box img {width: 5.5rem; object-fit: cover; height: 5.5rem; border-radius: 1rem; border: 1px solid #EEE; background: var(--color-white);}
.row-box.prd-box p {font-size:1.5rem;}
.row-box.prd-box div p + p {margin-top:.6rem;}

.row-box.answer { background: #f2f2f2; padding: 1rem 1.2rem; margin-top: 0.8rem; border-bottom-left-radius: 1rem; border-bottom-right-radius: 1rem; border-top-right-radius: 1rem; align-items: flex-start;}
.row-box.answer .a {font-weight:bold; color:red; width:20px;}
.row-box.answer .ac {width:calc(100% - 40px);}

.cal-head {width:100%;margin-bottom:30px; position:relative; display: flex; justify-content: space-between; padding: 0px 16px; align-items: center;}
.cal-head button {width:10px; height:18px; border:none;}
.cal-head button + button {margin-left:20px;}
.cal-head button.left {background:url(/_asset/images/admin/prev_arrow.png) no-repeat center;}
.cal-head button.right {background:url(/_asset/images/admin/next_arrow.png) no-repeat center;}

.cal-head span {font-size:13px;}
.cal-week, .cal-days { display:flex; justify-content: space-between; }
.cal-week p,.cal-days .day-box {font-size:1.6rem; flex:1; position:relative; text-align: center; width:calc(100% / 7);}
.cal-week p {color:#242424;}
.cal-days .day-box {background:var(--color-white); border:1px solid var(--color-white);padding:0.6rem;min-height: 12.25rem;}
.cal-week p:first-child{color:var(--color-red);}
.cal-week p:nth-child(7){color:var(--color-blue);}
.cal-week {margin-bottom:.4rem;background: #f8f8f8; height: 4rem; display:flex; align-items: center; justify-content: center;}
/* .cal-days .day-box.holy, .cal-days .day-box span.holy {color:#FC4C4E;} */
.cal-days .day-box.off, .cal-days .day-box span.off {color:#E7E7E7;}
.cal-days .day-box.holi > p {color:#FC4C4E;}
.cal-days .day-box.today { background:var(--color-white)1ee;border:1px solid #ffe0d9; }
.cal-days .day-box.on {cursor:pointer;}
.cal-days .day-box.on.chk {border:1px solid var(--main-color);}
.cal-days .day-box .date-marker {width:100%; text-align:left;display:flex;align-items:baseline;font-size:1.3rem;}
.cal-days .day-box .date-schedule {width:100%;display:inline-flex;justify-content:space-between;font-size:1.3rem;padding:.4rem 0rem;}
.date-schedule + .date-schedule {border-top:1px solid #ECECEC;}
.day-box.on .date-schedule span:first-child {color:#6C6C6C;}
.day-box.on .date-schedule span:last-child.on {color:var(--main-color);font-weight:600;}

.light-gray  {color:var(--color-light-gray);}
.gray        {color:var(--color-gray);}
.dark-gray   {color:var(--color-dark-gray);}
.blue        {color:var(--color-blue);}
.sky-blue    {color:var(--color-sky-blue);}
.red         {color:var(--color-red);}
.green       {color:var(--color-green);}
.hotpink     {color:var(--color-hotpink);}
.orange      {color:var(--color-orange);}
.main-color  {color:var(--main-color);}
.sub-main-color  {color:var(--sub-main-color);}
.sub-color  {color:var(--sub-color);}
.white       {color:var(--color-white);}
.black       {color:var(--color-black);}

.light-gray-imp  {color:var(--color-light-gray) !important;}
.gray-imp        {color:var(--color-gray) !important;}
.dark-gray-imp   {color:var(--color-dark-gray) !important;}
.blue-imp        {color:var(--color-blue) !important;}
.sky-blue-imp    {color:var(--color-sky-blue) !important;}
.red-imp         {color:var(--color-red) !important;}
.green-imp       {color:var(--color-green) !important;}
.hotpink-imp     {color:var(--color-hotpink) !important;}
.orange-imp      {color:var(--color-orange) !important;}
.main-color-imp  {color:var(--main-color) !important;}
.sub-main-color-imp  {color:var(--sub-main-color) !important;}
.sub-color-imp  {color:var(--sub-color) !important;}
.white-imp       {color:var(--color-white) !important;}
.black-imp       {color:var(--color-black) !important;}


.input-box .light-gray  {color:var(--color-light-gray) !important;}
.input-box .gray        {color:var(--color-gray) !important;}
.input-box .dark-gray   {color:var(--color-dark-gray) !important;}
.input-box .blue        {color:var(--color-blue) !important;}
.input-box .sky-blue    {color:var(--color-sky-blue) !important;}
.input-box .red         {color:var(--color-red) !important;}
.input-box .green       {color:var(--color-green) !important;}
.input-box .hotpink     {color:var(--color-hotpink) !important;}
.input-box .orange      {color:var(--color-orange) !important;}
.input-box .main-color  {color:var(--main-color) !important;}


.switch-box { position: relative; }
.switch-box > input[type='checkbox'] { position: absolute; appearance: none; -webkit-appearance: none; -moz-appearance: none; display: none;}
.switch-box > input[type='checkbox'] + label { position: relative; cursor: pointer; display: inline-block; width: 4rem; height: 2rem; background: #d1d1d1; border: 1px solid #d1d1d1; border-radius: 1.5rem; transition: 0.2s; /*box-shadow: 1px 2px 3px #00000020;*/ }
.switch-box .onoff { position: absolute; top: 50%; left: 0.2rem; display: inline-block; width: 1.2rem; height: 1.2rem; border-radius: 20px; background: var(--color-white); transition: 0.2s; transform: translateY(-50%); }
/* checking style */
.switch-box > input[type='checkbox']:checked + label { background: var(--main-color); border: 1px solid var(--main-color); }
/* move */
.switch-box > input[type='checkbox']:checked + label .onoff { left: 2.3rem; }

.input-box .input-btn-chk-box {display: inline-flex; position:absolute; right:0; top:0;}
.input-box .input-btn-chk-box input[type='checkbox'], .input-box .input-btn-chk-box input[type='radio'] {display:none;}
.input-box .input-btn-chk-box input[type='checkbox'] + label, .input-box .input-btn-chk-box input[type='radio'] + label {border-radius: 4px;border: 1px solid #b6b6b6;background: var(--color-white);text-align: center;cursor: pointer;font-size: 1.5rem;transition: all .3s ease;padding: .8rem;color: #6b6b6b; min-width:3.4rem;}
.input-box .input-btn-chk-box input[type='checkbox']:checked + label, .input-box .input-btn-chk-box input[type='radio']:checked + label {background: var(--main-color);border-color: var(--main-color);color: var(--color-white);font-weight: 400;}


.box-shadow {box-shadow: 3px 2px 10px 2px var(--card-content-shadow-color);}
.id-check-msg {display:flex; align-items: baseline;justify-content:center; padding:4rem 2.5rem; gap:1.5rem;}
.id-check-msg span {font-size:1.6rem;letter-spacing: -0.08rem; display:flex;align-items: baseline;}
.id-check-msg span b {font-size:1.8rem; margin-right:1rem;}
.id-check-msg span b.ok {color:var(--color-green);}
.id-check-msg span b.no {color:var(--color-red);}
.id-check-msg button {background:#00af76; color:var(--color-white); font-weight: 600;font-size: 1.5rem; padding: 0.5rem 2.5rem; box-shadow:1px 1px 2px 1px #dadada;transition: all 0.5s ease;letter-spacing: 0rem; border-radius:.6rem;}
.id-check-msg button:hover {background:#00865a;}





.exlSample {text-align: center; padding:1rem;}
.exlSample a { font-size:1.55rem; color: white; font-weight: 500; background: #38a741; padding: 1rem 2rem; display: inline-block; transition: all 0.3s ease; box-shadow: 1px 1px 3px 0px #c6c9e6;    border-radius: 12px; }
.exlSample a:hover {background:#00860b;}

.complete-wrap {width:100vw;height:100vh;position:relative;background: #F5F6FA;; display:flex; align-items:center; justify-content:center; flex-direction: column;}
.complete-wrap .complete-box { min-width: 30rem; min-height: 20rem; margin: 0 auto; background: var(--color-white); border-radius: 1.3rem; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem 3rem; box-shadow: 0px 5px 11px 0px #d5d5d5; }
.complete-wrap .complete-box i {font-size: 7.7rem; color: #6f66f7; margin-bottom: 0.8rem;}
.complete-wrap p.title {font-size:1.8rem; margin: 5rem 0rem 2rem 0rem; font-weight:500;color:#278af1;}
.complete-wrap p.msg {font-size:1.55rem; ; color:#444;margin-bottom:1rem;}

.error-wrap {width:100vw;height:100vh;position:relative;background: #F4F4F4; display:flex; align-items:center; justify-content:center; flex-direction: column;}
/* .error-wrap .error-box { min-width: 300px; min-height: 200px; margin: 0 auto; background: var(--color-white); border: 1px solid #d7d7d7; border-radius: 13px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding:2rem 3rem;} */
.error-wrap .error-box { min-width: 30rem; min-height: 20rem; margin: 0 auto; background: var(--color-white); border-radius: 1.3rem; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem 3rem; box-shadow: 0px 5px 11px 0px #d5d5d5; }
.error-wrap .error-box i {font-size: 7.7rem; color: #f76666; margin-bottom: 0.8rem;}
.error-wrap .error-box p {font-size:1.4rem; ; margin-top:0.2rem; color: #959595;}
.error-wrap .error-box p strong {font-size:1.8rem; font-weight:500; color: #585858;}
.error-wrap p.title {font-size:1.8rem; margin: 5rem 0rem 2rem 0rem; font-weight:500;color:#f76666;}
.error-wrap p.msg {font-size:1.55rem; ; color:#444; margin-bottom:1rem;}


.table-box { background: var(--color-white); border-radius: 1.2rem; padding:1.3rem 1rem; width: 100%; box-shadow: 3px 2px 10px 2px #dfdfec; position:relative;}
.table-box .rwd-table { background: var(--color-white); color: #3e3e3e; border-radius: 0.4rem; overflow: hidden; font-weight: 300; margin: 1rem 0; margin: 1rem; width:calc(100% - 2rem); }
.table-box .rwd-table th,
.table-box .rwd-table td { margin: 1rem 2rem; }
.table-box .rwd-table td { border-bottom:1px dotted #CCCCCC; }
.table-box .rwd-table th { display: none; }
.table-box .rwd-table td { display: block; }
.table-box .rwd-table td:first-child { padding-top: .5rem; }
.table-box .rwd-table td:last-child { padding-bottom: .5rem; }
.table-box .rwd-table td:before { content: attr(data-th) " "; font-weight:500; width: 10.5rem; display: inline-block;font-size:1.55rem; }
.table-box .rwd-table td.empty:before {display:none;}
.table-box .rwd-table th,
.table-box .rwd-table td { text-align: center; font-size:1.55rem; }
.table-box .rwd-table th a,
.table-box .rwd-table td a { font-size:1.55rem; }
.table-box .rwd-table.font12 th,
.table-box .rwd-table.font12 td { font-size:1.5rem; }

.table-box .rwd-table thead { background:#E1E2FF; }
.table-box .rwd-table thead th { font-weight:500; }
.table-box .rwd-table td:before { color: #444; }
.table-box .rwd-table td button { border: 1px solid #5b67ec; background: var(--color-white); padding: 0.5rem 1rem; border-radius: 0.5rem; margin-right: 0.5rem; transition:all 0.3s ease;font-size:1.55rem; color: #5b67ec; }
.table-box .rwd-table td button:hover { background:#5b67ec; color:var(--color-white); font-weight:600;  }
.table-box .rwd-table td button i.bx { font-size:1.55rem; }

.table-box .rwd-table td img { position:relative; width:auto; height:auto; object-fit: contain; max-width:50px; max-height:50px; }

.table-box div.sub-info { display:flex; justify-content:space-between; width:100%; padding:0rem 1rem; align-items: center; flex-wrap:wrap; gap:1.3rem;}
.table-box div.sub-info div:first-child {text-align: left; font-size:1.55rem; display: flex; align-items: center; gap: 1rem;}
.table-box div.sub-info div:last-child {text-align: right; font-size:1.55rem; display: flex; align-items: center; gap: 1rem;}
.table-box div.sub-info div:last-child b {font-size:1.55rem;}
.table-box div.sub-info div:last-child button { font-size:1.55rem; background:#9299e8; padding: 0.5rem 1.3rem; border-radius: 0.4rem; color: var(--color-white); font-weight:400; transition: all 0.3s ease;box-shadow:1px 1px 3px 0px #c6c9e6;}
.table-box div.sub-info div:last-child button:hover {background: #444;}
.table-box div.sub-info div:last-child button.excel {background: #38a741;}
.table-box div.sub-info div:last-child button.excel:hover {background:#00860b;}
.table-box div.sub-info div:last-child button.delete {background: #FF5151;}
.table-box div.sub-info div:last-child button.delete:hover {background:#CF0000;}

.table-box .rwd-table td a i.bxs-download {font-size:2rem;color:#444; transition:all 0.3s ease;}
.table-box .rwd-table td a i.bxs-download:hover {font-size:2.5rem;color:#3C45BB;}

.table-box .rwd-table td a i.bxs-up-arrow,
.table-box .rwd-table td a i.bxs-down-arrow {font-size:1.5rem;color:#444; transition:all 0.3s ease;}
.table-box .rwd-table td a i.bxs-up-arrow:hover {font-size:2rem;color:#3C45BB;}
.table-box .rwd-table td a i.bxs-down-arrow:hover {font-size:2rem;color:#3C45BB;}

.table-box .rwd-table td.estyle { font-size:1.55rem; color: #444; font-weight: 400; letter-spacing: -0.028rem; }

.input-box .orderbtn-box { display: flex; flex-wrap:wrap; align-items: center; justify-content: flex-start; min-height: 4rem; font-size:1.55rem; gap: 1rem; padding: 0; }
.input-box .orderbtn-box button { border: 1px solid #35c6ff; background: var(--color-white); padding: 1.2rem 1rem; width:10rem; border-radius: 0.5rem; transition: all 0.3s ease; font-size:1.5rem; color: #009fff; box-shadow: none; font-weight:bold; }
.input-box .orderbtn-box button.on, .input-box .orderbtn-box button:hover { background:#35c6ff; color:var(--color-white); font-weight:600; }
.table-box .rwd-table td a { font-weight:400; transition: all 0.3s ease;}
.table-box .rwd-table td a:hover {color:#444;}
.table-box .rwd-table td select { font-size:1.55rem; padding:0.5rem; border:1px solid #d1d1d1; background:var(--color-white); color:#6b6b6b;border-radius:4px; max-width:110px; }
.table-box .rwd-table td select.OY, .table-box .rwd-table td select.CI { border:3px solid #6DCFF6; padding:0.3rem; }
.table-box .rwd-table td select.DC, .table-box .rwd-table td select.CC { border:3px solid #BD8CBF; padding:0.3rem; }
.table-box .rwd-table td select.OC, .table-box .rwd-table td select.RC,.table-box .rwd-table td select.RD, .table-box .rwd-table td select.CA { border:3px solid #ED1C24; padding:0.3rem; }
.table-box .rwd-table tbody tr td i { font-size:1.5rem; border: 1px solid #CCC; padding: 0.2rem; border-radius: 5px; box-shadow: 1px 1px 3px 0px #DDD; }

@media (max-width: 800px) {
  .table-box .rwd-table {border:1px solid #CCC;box-shadow:1px 1px 5px 0px #c6c9e6;}
  .table-box .rwd-table td {border-bottom:none;}
  .table-box .rwd-table td:last-child {border-bottom:1px dotted #DDD; padding-bottom:2rem;}
  .table-box .rwd-table tr:last-child td:last-child {border-bottom:none; padding-bottom:1rem;}
  .table-box .rwd-table th,
  .table-box .rwd-table td { text-align: left; }
  .table-box .rwd-table td.empty { text-align: center; }
  .table-box .rwd-table td.chk-box{ text-align: right; }
}

@media (min-width: 800px) {
  .table-box .rwd-table td:before { display: none; }
  .table-box .rwd-table th,
  .table-box .rwd-table td { display: table-cell; padding: .25rem .5rem; }
  .table-box .rwd-table th:first-child,
  .table-box .rwd-table td:first-child { padding-left: 0; }
  .table-box .rwd-table th:last-child,
  .table-box .rwd-table td:last-child { padding-right: 0; }
  .table-box .rwd-table th,
  .table-box .rwd-table td { padding: 1rem 2rem !important; }
}

.empty-box { width: 100%; height:7rem; display: flex; justify-content: center; align-items: center; font-size:1.55rem; color:#999;}
.doc-box {padding:1rem;}
.doc-box + .doc-box {border-top : 1px solid #EFEFEF;}
.doc-box p {font-size:1.5rem; color:#6b6b6b; line-height:1.5;}
.doc-img {width: 4rem;height: 4rem;border-radius: 2rem;border: 0.1rem solid #EEE; object-fit: cover;}


.flag { height:2.5rem; }
.flag-small {height:2rem;}
.flag-box {display:flex; gap:0rem .3rem; flex-wrap:wrap;}


.chat-box { max-width: 700px; margin: 0 auto; padding:2rem 1rem;}
.chat-grp-re { display:flex; width:100%; margin-bottom:2rem; }
.chat-grp-re > div:first-child { margin-top:auto; margin-right:0.5rem; }
.chat-grp-re > div:last-child { flex-grow:1; display:flex; flex-direction:column; gap:0.5rem; }
.chat-grp-re > div:first-child > img { border-radius:50%; height:3rem; width:3rem; }
.chat-re { width:100%; display:flex; }
.chat-re:first-child > .chat-re-text { border-top-left-radius:1rem; border-top-right-radius:1rem; }
.chat-re:last-child > .chat-re-text { border-bottom-left-radius:1rem; border-bottom-right-radius:1rem; position:relative; }
.chat-re > a > img { width:15rem; height:15rem; object-fit: cover; border-radius:0.4rem; }
.chat-re-text { max-width:75%;padding: 1rem; min-height: 2rem; background: #a2a9ff; border-radius: 0.4rem; font-size: 1.4rem; font-weight: 300; color: var(--color-white); box-shadow: 1px 1px 1px 1px #d9d9eb; margin-right:1rem; }
.chat-re-text.system { background:#F1F1F1; color:#212121; }
.chat-grp-se { width:100%; margin-bottom:2rem; }
.chat-grp-se > div:first-child {display:flex; flex-direction:column; gap:0.5rem;}
.chat-se { width:100%; display:flex; justify-content:flex-end; }
.chat-seText { max-width:75%; padding:1rem; min-height:2rem; border-radius: 0.4rem; font-size: 1.4rem; font-weight: 300; color: var(--color-white); box-shadow: 1px 1px 1px 1px #d9d9eb; background: #444; margin-left:1rem; }
.chat-se:first-child > .chat-seText { border-top-left-radius:1rem; border-top-right-radius:1rem; }
.chat-se:last-child > .chat-seText { border-bottom-left-radius:1rem; border-bottom-right-radius:1rem; }
.chat-se-stat { width:2.5rem; display:flex; margin-left:0.5rem; color:rgba(134,142,153,0.5); }
.chat-se-stat > i { margin-top:auto; font-size:2.5rem; }
.chat-time {display:flex;align-items:flex-end;}
.sys-msg { width: 100%; text-align: center; margin: 3rem 0rem; font-size:1.5rem; color: #545454; display:flex;align-items: center; }
.sys-msg::before,.sys-msg::after { content:""; flex-grow:1; margin:0rem 1.6rem; background:#CCCCCC; height:0.1rem; font-size:0rem; line-height:0rem; }
.chat-input-container {position: fixed; bottom:0; background: #F1F1F1; width:100%; display: flex;flex-direction: column;justify-content: space-between;}
.chat-input-box { width: 100%; height: 95px; padding:10px; background: var(--color-white); border-top: 1px #CCC solid; display:flex; justify-content: space-between;}
.chat-input-box textarea {width: calc(100% - 100px); resize: none; height: 100%; font-size: 1.35rem; border: none; line-height: 1.5rem; font-weight: 400; color: #333; }
.chat-input-box.off {background: rgb(239 239 239 / 30%);}
.chat-input-box textarea::-webkit-scrollbar { width:6px; }
.chat-input-box textarea::-webkit-scrollbar-thumb { background-color: #CCC; border-radius: 3px; }
.chat-input-box textarea::-webkit-scrollbar-track { background-color: transparent; }
.chat-input-box textarea:focus {outline:none;}
.chat-input-box button {width:80px; height:75px; background: #EEE; color:#CCC; border: 1px solid #DDD; border-radius: 4px; font-size:1.4rem; cursor: default; transition: all 0.3s ease;}
.chat-input-box button.on {color:var(--color-white);background:#444;border:1px solid #a2a9ff; cursor: pointer;font-weight:500;}
.chat-btn-box {width:100%; display:flex; padding:5px 10px; align-items: center; justify-content:space-between; }
.chat-btn-box button { font-size: 1.4rem; color: var(--color-white); background: red; padding: 0.5rem 1.5rem; border-radius: 4px; font-weight: 500; transition:all 0.3s ease; }
.chat-btn-box button:hover {background: #ff7070;}
.chat-btn-box span { font-size:1.4rem; color:#777;}
.chat-btn-box i { font-size: 3rem; color: #585858; border: 1px solid #bfbfbf; background: #e5e5e5; border-radius: 4px; cursor: pointer; transition: all 0.3s ease; }
.chat-btn-box i:hover { background: #CCC; }
.chat-se-text img, .chat-re-text img { width:15rem; height:15rem; object-fit: cover; border-radius:0.4rem;}


.input-box > span {font-size:1.4rem;}
.input-box .tag {font-size:1.4rem; background-color:#444; padding:0.3rem 1rem; color:var(--color-white); border-radius: 0.8rem;}

.input-box > span > a {font-size: 1.4rem; transition: all 0.3s ease;}
.input-box > span > a:hover {color:#444;}

/* paging */
.pagination{ display: table; margin: 0 auto; margin-top:40px; text-align:center;}
.pagination .page_btn{ float: left;}
.pagination .page_btn > a{ font-size:0; text-indent:-9999px;}
.pagination .page_btn > a+a{ margin-left:3px;}
.pagination .page_btn > a.prev{ background:var(--color-white)fff url('/_asset/images/admin/prev_double.png') no-repeat center center;}
.pagination .page_btn > a.prev_one{ background:var(--color-white)fff url('/_asset/images/admin/prev_arrow.png') no-repeat center center;}
.pagination .page_btn > a.next{ background:var(--color-white)fff url('/_asset/images/admin/next_arrow.png') no-repeat center center;}
.pagination .page_btn > a.next_one{ background:var(--color-white)fff url('/_asset/images/admin/next_double.png') no-repeat center center;}
.pagination .page_btn > a, .pagination .page_wrap > a,
.pagination .page_wrap > strong{ float: left; vertical-align:middle; min-width:39px; padding:0rem 1rem; height:39px; line-height:38px;  text-align:center; border:1px solid #CCCCCC; font-size:15px; background-color:var(--color-white); color:#444; transition:all 0.3s ease; border-radius:0.3rem; }
.pagination .page_wrap{ float: left;}
.pagination .page_wrap > strong{ background-color: #444; border-color: #444; color: var(--color-white); font-weight: 600; margin: 0px 3px;}
.pagination .page_wrap > a{ font-weight:400; }
.pagination .page_wrap > a+a{ margin-left:3px;}
.pagination .page_wrap > a:hover{ color: #000977;}
.pagination .page_wrap > a:hover,
.pagination .page_btn > a:hover{ background-color:#E5E7ff;}
.pagination .page_btn.prev_group{margin-right:9px;}
.pagination .page_btn.next_group{margin-left:9px;}

.page_area {margin-top:5rem;display:flex;align-items:center;justify-content:center;}
.page_arr {width:2rem;height:2.2rem;}
.page_first {background:url(/_asset/images/admin/prev_double.png) no-repeat center;margin-right:.2rem;}
.page_prev {background:url(/_asset/images/admin/prev_arrow.png) no-repeat center;}
.page_next {background:url(/_asset/images/admin/next_arrow.png) no-repeat center;margin-right:.2rem;}
.page_end {background:url(/_asset/images/admin/next_double.png) no-repeat center;}
.page_first:hover {background:url(/_asset/images/admin/prev_double.png) no-repeat center #eaeaea;}
.page_prev:hover {background:url(/_asset/images/admin/prev_arrow.png) no-repeat center #eaeaea;}
.page_next:hover {background:url(/_asset/images/admin/next_arrow.png) no-repeat center #eaeaea;}
.page_end:hover {background:url(/_asset/images/admin/next_double.png) no-repeat center #eaeaea;}
.page_number {margin:0 2.8rem;display:flex;align-items:center;}
.page_number li {font-size:1.45rem; margin-right:1.5rem; ;}
.page_number li:last-child {margin-right:0;}
.page_number a { color:#CCC; }
.page_number a:hover {color:#444;}
.page_number .act {color:#444; font-weight:400;}


.comment li + li {margin-top:1.2rem;}
.comment li { padding: 1rem 1.4rem 1.4rem 1.4rem; font-size:1.5rem; border-radius: 0.6rem; border:1px solid #D3D3D3; }
.comment li > .head a { font-weight:bold; color:var(--main-color); transition: all .2s ease;}
.comment li > .body {margin-top:.7rem;}
.comment li .img > a > img { width: 100px; height: 100px; object-fit: cover; border-radius: 4px; margin-top: 10px; }
.comment li.empty {text-align: center; padding: 4rem 2rem; color: #888;}
.comment li.recomment {padding-left: 4.5rem; background: url(/_asset/images/admin/comment_arr.png) no-repeat 15px 12px; }

#rc-name {padding: 0.8rem; color: #888; font-size:1.5rem; border-radius: .6rem; display: inline-flex;}
#rc-name strong { font-weight: bold;color: var(--main-color); }

.push-label {font-size:1.55rem; background: var(--color-white); border: 0.2rem solid var(--main-color); border-radius: 1rem; text-align: center; display: inline-flex; gap:.8rem; padding:.6rem 1rem; align-items: center; /*box-shadow: 0 1px 4px rgb(210 210 210);*/}
.push-label button {border: none; background: none; }
.push-label button img {width:1rem; height:1rem;}



.table_list > li, .main_table_list > li {display:flex;align-items:center;text-align:center; font-size:1.5rem; justify-content:space-around;}
.th_li {line-height:1.1;font-weight:400; margin-bottom:1.2rem;}
.th_li .th.img-box { text-align:left; padding-left:8rem; }
.th_li > .th {color:var(--sub-main-color); font-weight: 500;}
.td_li {line-height:1.5; border:1px solid #D3D3D3; border-radius:.3rem; padding:.8rem 0rem; justify-content: space-around; margin-bottom:1rem; background: var(--color-white); ;}
.td_li:last-child {margin-bottom:0;}
.td_li.pink { background: #ffeff5; }
.td_li.pink2 { background: var(--color-white)6f9; }
.td_li.red-li {background: #ffeff5;color:#d88888;}
.td_li.blue-li {background: #eff3ff;color:#88a8d8;}
.td_li.gray-li {background: #F3F3F3;color:#A9A9A9;}
.empty_li {line-height:1.5; border:1px solid #D3D3D3; border-radius:.3rem; padding:.8rem 0rem; justify-content: space-around;margin-bottom:1.5rem;}
.td { padding:0 .3rem;}
.td .btn_box {display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;}
.td_btn {display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;}
.td_tit {display:none;}
.td_li .td_info {display:flex;align-items:center;text-align:left;padding-left:1rem;}
.td_li .td_info img { width: 5.5rem; object-fit: cover;}
.td_li .td_info p { width:calc(100% - 5.5rem);padding-left:1.5rem; word-break:keep-all; }
.td_li .td_txt.img-box { display: flex; align-items: center; gap:.5rem 1.8rem; }
.td_li .td_txt img.thumb { width:5.5rem; object-fit: cover; height:5.5rem; border-radius:1rem; border: 1px solid #EEE; background: var(--color-white);}
.td_li .td_txt img.icon { width: 2.4rem; height: 2.4rem;  object-fit: contain; }
.td_li .td_txt .sold-out { font-size: 1rem; color: var(--color-white); width: 5.5rem; height: 5.5rem; background: #00000096; display: inline-flex; align-items: center; justify-content: center; position: absolute; border-radius: 1rem; }
.td_li .td_txt .sold-out.sold-out-ban {width:16rem;}
.td_li .td_txt .sold-out.sold-out-ytb {width:12rem;height:6.85rem;}
.td_li .td_txt.img-box .txt {text-align:left;}
.td_li .td_txt a {transition: .2s all ease;}
.td_li .td_txt a:hover { color:var(--main-color); }
.hc-span + .hc-span {margin-left:.8rem;border-left:1px solid #DDD; padding-left:.8rem;}

.ytb-img{ width:12rem;height:6.85rem; object-fit: contain; border: 1px solid #CCC;}

.file-box {position:relative;}
.file-box .thumb {position:absolute;top:calc(100% - 5px);left:0;z-index:10;display:none;max-width:100%;border:1px solid var(--color-black);background:var(--color-white);text-align:center;}
.file-box .thumb img {max-width:100%;}
.file-box p {width:100%; position: relative;}
.file-box p button { position: absolute; right: 7rem; top: 50%; transform: translateY(-50%); display: none; }
.file-box input {cursor:default; width:100%;}
.file-box label { cursor:pointer; display: block; font-size:1.5rem; text-align: center; border-radius: .4rem; border: 1px solid #8d8d8d; background: var(--color-white); position: absolute; top: 0; right: 0; padding:.8rem; transition: all .3s ease;}
.file-box label:hover {background: var(--section-bg-color);}
.file-box:hover .thumb {display:block;}
.file-box .download {font-size:1.5rem;}
.file-box .up-del { position: absolute; right: 7rem; top: 50%; transform: translateY(-50%); }

.main_ul > li { display:flex; align-items: center; width:100%; font-size:1.22rem; justify-content: space-around; border-bottom:1px solid #CCC; padding-bottom:.5rem; min-height: 2.6rem;  }
.main_ul > li + li { margin-top:.5rem; }
.main_ul > li > p { text-align: center;white-space: nowrap; overflow:hidden;text-overflow: ellipsis; }
.main_ul > li > p > a {  transition:.4s ease all;}
.main_ul > li > p > a:hover { color:var(--color-black); }
.main_ul > li > p.left {text-align: left; padding-left:.4rem;}
.main_ul > li.empty {height: 18rem; border-bottom: none; color: #BBB; font-size: 1.4rem; }

/* .btn { background: var(--color-white); padding: 0.5rem 1.2rem; min-width: 4rem; border: 2px solid #76ABD3; border-radius: 0.6rem; font-size:1.4rem; color: #444; ; transition:all .3s ease; box-shadow: 0 1px 4px rgb(210 210 210); } */
/* .btn + .btn {margin-left:.6rem;} */
/* .btn:hover {box-shadow:0 13px 34px rgb(233,233,233);} */
.btn { background: var(--main-color); padding: 0.6rem 1.2rem; min-width: 4rem; border-radius: 0.6rem; font-size:1.5rem; font-weight: 500; color: var(--color-white); transition:all .3s ease; }
.btn:hover {background: var(--login-btn-hover-color);}

.btn.search { background: #444; }
.btn.search:hover {background: #000;}
.btn.add { background: #76ABD3; }
.btn.add:hover {background: #5292c2;}
.btn.del { background: #ff5757; }
.btn.del:hover {background: #e13737;}
.btn.mod { background: #7e7e7e; }
.btn.mod:hover { background: #5e5e5e; }
.btn.off { background: var(--section-bg-color); cursor:default; color: #AAA;}
.btn.excel { background: #6ccd8f; }
.btn.excel:hover { background: #6ccd8f; }
.btn.small { padding: 0.5rem; font-size:1.1rem;}
.btn.pd    {padding:0.95rem 1.3rem;}

.big-btn { width: 100%; height: 17rem; border: 1px solid #d1d1d1; border-radius: 4px; /*box-shadow: 0 1px 4px rgb(210 210 210);*/ background: #EFEFEF; color: #AAA; font-size: 1.2rem;}
.big-btn > p > i { font-size: 4.2rem; margin-bottom: 0.8rem; color: #878787; }
.big-btn > p {font-size:2rem;}

body.pop {background:var(--pop-bg-color);}
.pop_footer { position:fixed; bottom: 0; width: 100%; background: var(--pop-footer-bg-color); color: var(--pop-footer-text-color); height: 50px; display: flex; justify-content: center; align-items: center; font-size:1.5rem; }

span.keyword {background: var(--color-hotpink);padding: 0.4rem 0.6rem;border-radius: 0.6rem;color: var(--color-white)fff;font-size: 1.1rem;word-break: keep-all;}
span.keyword.untact {background:var(--main-color);}
span.keyword.rtime {background:#cbcbcb;}

/* span.keyword+span.keyword {margin-left:.4rem;} */

@media (max-width: 1100px) {
  .card-wrapper footer {max-width:100vw;}
  .mh100 {min-height:unset !important;}
  .mh200 {min-height:unset !important;}
  .mh300 {min-height:unset !important;}
  .mh400 {min-height:unset !important;}
  .mh500 {min-height:unset !important;}
  .mh600 {min-height:unset !important;}
  .mh700 {min-height:unset !important;}
  .mh800 {min-height:unset !important;}
}
@media (max-width: 750px) {
  .card-wrapper footer button { width:100%; }
  .card-wrapper footer.small button {width:48%;}
  .table_list > .th_li {display:none;}
	.table_list > .td_li {display:block; padding:15px;}
	.table_list > .td_li > .td {display:flex;align-items:center;width:100%;text-align:left;padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid #D3D3D3;}
	.table_list > .td_li > .td:last-child {padding-bottom:0;margin-bottom:0;border-bottom:0;}
  .table_list > .td_li > .td .td_tit { display: block; width: 135px; font-weight: 500; color: var(--color-blue); }
  .td_li .td_info { padding:0; }
  .td_li .td_info {display:block;margin-top:10px;}
  .td_li .td_info p {width:100%;padding:1rem 0 0;}
  .main_ul > li {font-size:1.5rem;}
  .rw1,.rw2,.rw3,.rw4,.rw5,.rw6,.rw7,.rw8,.rw9,.rw10,
  .rw11,.rw12,.rw13,.rw14,.rw15,.rw16,.rw17,.rw18,.rw19,.rw20,
  .rw21,.rw22,.rw23,.rw24,.rw25,.rw26,.rw27,.rw28,.rw29,.rw30,
  .rw31,.rw32,.rw33,.rw34,.rw35,.rw36,.rw37,.rw38,.rw39,.rw40,
  .rw41,.rw42,.rw43,.rw44,.rw45,.rw46,.rw47,.rw48,.rw49,.rw50,
  .rw51,.rw52,.rw53,.rw54,.rw55,.rw56,.rw57,.rw58,.rw59,.rw60,
  .rw61,.rw62,.rw63,.rw64,.rw65,.rw66,.rw67,.rw68,.rw69,.rw70,
  .rw71,.rw72,.rw73,.rw74,.rw75,.rw76,.rw77,.rw78,.rw79,.rw80,
  .rw81,.rw82,.rw83,.rw84,.rw85,.rw86,.rw87,.rw88,.rw89,.rw90,
  .rw91,.rw92,.rw93,.rw94,.rw95,.rw96,.rw97,.rw98,.rw99,.rw100,
  .mxrw1,.mxrw2,.mxrw3,.mxrw4,.mxrw5,.mxrw6,.mxrw7,.mxrw8,.mxrw9,.mxrw10,
  .mxrw11,.mxrw12,.mxrw13,.mxrw14,.mxrw15,.mxrw16,.mxrw17,.mxrw18,.mxrw19,.mxrw20,
  .mxrw21,.mxrw22,.mxrw23,.mxrw24,.mxrw25,.mxrw26,.mxrw27,.mxrw28,.mxrw29,.mxrw30,
  .mxrw31,.mxrw32,.mxrw33,.mxrw34,.mxrw35,.mxrw36,.mxrw37,.mxrw38,.mxrw39,.mxrw40,
  .mxrw41,.mxrw42,.mxrw43,.mxrw44,.mxrw45,.mxrw46,.mxrw47,.mxrw48,.mxrw49,.mxrw50,
  .mxrw51,.mxrw52,.mxrw53,.mxrw54,.mxrw55,.mxrw56,.mxrw57,.mxrw58,.mxrw59,.mxrw60,
  .mxrw61,.mxrw62,.mxrw63,.mxrw64,.mxrw65,.mxrw66,.mxrw67,.mxrw68,.mxrw69,.mxrw70,
  .mxrw71,.mxrw72,.mxrw73,.mxrw74,.mxrw75,.mxrw76,.mxrw77,.mxrw78,.mxrw79,.mxrw80,
  .mxrw81,.mxrw82,.mxrw83,.mxrw84,.mxrw85,.mxrw86,.mxrw87,.mxrw88,.mxrw89,.mxrw90,
  .mxrw91,.mxrw92,.mxrw93,.mxrw94,.mxrw95,.mxrw96,.mxrw97,.mxrw98,.mxrw99,.mxrw100 { width:100%; }
}

@media screen and (max-width: 500px) {
  .page-title { position: fixed; z-index: 1; width: 100%; top:0; }
  body.pop {padding-top:6rem;}
  .side-bar{ position:fixed; left:unset; right:0; width:25rem; background: transparent; box-shadow: -2px 0px 5px -2px #00000024;}
  .side-bar.close { width:60px; box-shadow: none; height:60px;}

  .side-bar.close .logo-details {background: transparent; }
  .side-bar .logo-details i { min-width: 60px; position:fixed; top: 5px; right: 0px; color:var(--color-white); }
  .side-bar.close .logo-details i { color:#49457a;}
  .side-bar .logo-details .logo_name { margin-left:3rem; }
  .side-bar .nav-links {  height:100%; padding :10px 0 150px 0; overflow:auto; }
  .side-bar.close .nav-links { display:none; }
  .side-bar .nav-links::-webkit-scrollbar{ display:none; }
  .side-bar .nav-links li { position: relative; list-style: none; transition:all 0.5s ease; }

  .side-bar .nav-links li .icon-link { display:flex; align-items: center; justify-content: space-between; }
  .side-bar.close .nav-links li .icon-link { display:block }
  .side-bar .nav-links li i:not(.profile > .logout-watch > i) { height:4rem; min-width: 78px; text-align: center; line-height:4rem; opacity:.6;font-size:2rem; cursor:pointer; transition: all 0.3s ease; }
  .side-bar .nav-links li:hover i{opacity:1;}
  .side-bar .nav-links li.show-menu i.arrow { transform:rotate(-180deg); }

  .side-bar.close .nav-links i.arrow { display: none; }
  .side-bar .nav-links li a,.side-bar .nav-links li b { display:flex; align-items: center; text-decoration: none; }
  .side-bar .nav-links li a .link_name { font-size:1.65rem; font-weight:500; white-space: nowrap; /* word-break: keep-all; */ opacity: 1; transition: all 0.3s ease; color:#525252; }
  .side-bar.close .nav-links li a .link_name { opacity: 0; pointer-events:none; }
  .side-bar .nav-links li .sub-menu { padding:1rem 0.6rem 0.9rem 7.8rem; margin-top:-10px; display:none; }
  .side-bar .nav-links li.show-menu .sub-menu { display: block; }
  .side-bar .nav-links li .sub-menu a { font-size:1.5rem; padding:4px 0; white-space:nowrap; opacity: 0.6; transition: all 0.5s ease; }
  .side-bar .nav-links li .sub-menu a:hover { opacity: 1; }
  .side-bar .nav-links li .sub-menu b { font-size:1.5rem; padding:.5rem 0; white-space:nowrap; }
  .side-bar.close .nav-links li .sub-menu { position: absolute; left:100%; top:-10px; margin-top:0; padding: 10px 20px; border-radius: 0 6px 6px 0; opacity:0; display:block; pointer-events:none; transition: 0s; }
  .side-bar.close .nav-links li:hover .sub-menu,.side-bar.close .nav-links li.on .sub-menu { top:0; opacity: 1; pointer-events:auto; transition: all 0.5s ease; }
  .side-bar .nav-links li .sub-menu .link_name { display:none; }
  .side-bar.close .nav-links li .sub-menu .link_name { font-size:1.55rem; opacity: 1; display: block; }
  .side-bar.close .nav-links li .sub-menu.blank { pointer-events: auto; padding: 3px 20px 6px 16px; opacity: 0; pointer-events: none; }
  .side-bar.close .nav-links li:hover .sub-menu.blank { top:50%; transform:translateY(-50%); opacity: 1; }
  .side-bar .profile-details { width: 25rem; }
  .side-bar.close .profile-details  { width: 78px; background: none; }
  .side-bar .profile-details .profile-content { display: flex; align-items: center; }
  .side-bar .profile-details img { height:52px; width:52px; object-fit:cover; border-radius: 16px; margin: 0 14px 0 12px; background: #1d1b31; transition: all 0.5s ease; }
  .side-bar.close .profile-details img { padding:10px; }
  .side-bar .profile-details .profile_name,
  .side-bar .profile-details .job { color:var(--color-white); font-size:1.4rem; white-space:nowrap; }
  .side-bar.close .profile-details i,
  .side-bar.close .profile-details .profile_name,
  .side-bar.close .profile-details .job{ display: none; }
  .side-bar .profile-details .job { font-size:1.5rem; }
  .home-section { left:0; width:100%;  }
  .side-bar.close ~ .home-section { left:0; width:100%; }
  .home-section .home-content { padding-bottom:24px; padding-top: 56px; }
  .home-section .footer { position: relative; width:calc(100%); }
  .home-section .footer p { color:var(--color-white); font-size:1.5rem; }
  .side-bar.close ~ .home-section .footer { width:100%; }
  .card-wrapper footer.small button {width:100%;}
  .td_li .td_txt img.thumb, .td_li .td_txt img.evt-icon, .td_li .td_txt .sold-out {display: none;}
  .td_txt.img-box .relative {display:none;}
  .td_li .td_txt.img-box { max-width: calc(100% - 95px); }
}
@media screen and (max-width:350px) {
  .table_list > .td_li > .td { display:block; }
  .table_list > .td_li > .td .td_txt { width:100%; margin-top:.4rem; }
  .table_list > .td_li > .td .work_info { display:block;margin-top:10px; }
	.td_li .td_tit {width:85px;}
	.td_li .td_txt {width:calc(100% - 85px);}
}
.evt-icon {position: absolute;width: 2.2rem;height: 2.2rem;object-fit: contain;top: -.7rem;left: -0.5rem;}
.prime-logo {height:2rem; width:auto; object-fit: contain;}
.popup-img {width:16rem;height:auto;}

.tb-box {background: #eff8ff; padding:1rem; }
.t-h-r, .t-d-r {display:flex; justify-content: space-evenly; align-items: center;}
.t-h-r {color:var(--main-color); padding-bottom:.6rem;}
.t-d-r {background: var(--color-white); border: 1px solid var(--color-light-gray); padding: .6rem 0; color:var(--color-basic-text);}
.t-h, .t-d {flex:1; text-align: center; font-size:1.5rem;}
.t-d-r > .t-h {color:var(--color-black);}
.t-h{font-weight:600;}
.t-d-r + .t-d-r {margin-top:.4rem;}