html{height:100%;}
body{position:relative;height:100%;margin:0;padding:0;font-size:1rem;word-break:keep-all; color:#1F1F21;;font-family:"Pretendard";}  
@media (max-width: 420px) {
    html{font-size: clamp(0.95rem, 2.5vw, 14px);}
}
@media (max-width: 360px) { 
    html{font-size: clamp(0.9rem, 2.5vw, 14px);}
}
@media (max-width: 320px) {
    html{font-size: clamp(0.8rem, 2.5vw, 14px);}
}
dl, ol, ul, h1, h2, h3, h4, h5, h6, p, dd,.form-group{margin:0;padding:0;}
h1, h2, h3, h4, h5, h6{font-size:0.9rem;font-weight:700;}
a{color:#333;cursor:pointer;text-decoration:none;}
a:hover{color:inherit;}
a.unline:hover{color:#000 !important;text-decoration:underline;}
a:focus{outline:none;}
a,span{display:inline-block;}
em,i{font-style:normal;}
ul{list-style:none;}
ul li{display:block;}
.dik{display:block;}

/*테마컬러*/
.colb{color:#6D2A85;}
.colbr{border-color:#6D2A85;}
.colbtn{color:#fff !important;
background: #6D2A85;  
background: -webkit-linear-gradient(to right, #cc5333, #6D2A85); 
background: linear-gradient(to right, #cc5333, #6D2A85);  
}
.colbtn:active,.colbtn:hover{color:#fff;}
.subDepth1 ul li.on{background-color:#6D2A85;border:1px solid #6D2A85;}
.PhotoMsg .dz-button{border:1px solid #6D2A85;color:#6D2A85;}   

/*방송내역-기간검색*/
.offcanvas-bottom .BtnWrap .btn-check:checked+.checkBtn.btn{background-color:#fff;color:#6D2A85;border:1px solid #6D2A85;}
.offcanvas-bottom .BtnWrap .btn-check:checked+.checkBtn.btn::after{color:#6D2A85;}
/*녹음내역-기간검색*/
.setRecord .BtnWrap .btn-check:checked+.checkBtn.btn{background-color:#fff;color:#6D2A85;border:1px solid #6D2A85;}
.setRecord .BtnWrap .btn-check:checked+.checkBtn.btn::after{color:#6D2A85;}
/*방송 진행 바*/
#progressbar li.active:before, #progressbar li.active:after {background:#6D2A85;}
.progress-bar{background-color:#6D2A85;}
#progressbar .active{color:#6D2A85;}
/*TTS player*/
.jp-audio-pink{background-color:rgba(202,82,52,0.05);border-color:#6D2A85;}
.jp-type-single1 .jp-controls button{color:#6D2A85;}
.jp-type-single1 .jp-progress, .jp-seek-bar{background-color:rgba(202,82,52,0.08);}
.jp-type-single1 .jp-play-bar{background-color:#6D2A85;}

.recordResult ul li::before{background-color:#6D2A85;}
.recordResult ul li strong{color:#6D2A85;}
.ttsResult ul li::before{background-color:#6D2A85;}
.ttsResult ul li strong{color:#6D2A85;}

/*방송대상 탭*/
.nav{border-color:#6D2A85;}
.nav li .nav-link{color:#6D2A85;}
.nav li .active{background-color:#6D2A85;border-color:#6D2A85;} 
.nav li .btn-check:checked +.checkBtn.btn::after{color:#993CBD;} 
.nav li .btn-check:checked +.checkBtn.btn::after{color:#993CBD;} 

/*badge*/
.badge{display:inline-block;border-radius:3px;font-size:0.8rem;font-weight:600;padding:5px;margin-right:0.3rem;}
.badge.blue{background-color:#e1f0ff;color:#6384ea;}
.badge.orange{background-color:#FEF2EF;color:#F57252;}
.badge.green{background-color:#E0F5E2;color:#07B419;}
.badge.gray{background-color:#F2F5F7;color:#829CAE;}
.badge.red{background-color:#ffe2e5;color:#f1376e;}
.badge.red2{background-color:#E95247;color: #fff;}
.badge.run{background-color:#FFF5E3;color:#F48A44;}
.badge.purple{background-color:#E9EBFC;color: #8184C7;} 

/*폰트색상*/
.white{color:#fff;} 
.green{color:#07b419;}
.blue{color:#16AAFF;}
.darkblue{color:#39AFD1;} 
.purple{color:#7072CF;} 
.yellow{color:#F7B924;} 
.gray{color:#ccc;}
.lightgray{color:#BDBDBD;}
.darkgray{color:#8B8B8B;}
.orange{color:#F57252;}
.red{color:#f1376e}
.black{color:#000}
.deepgray{color:#333}
.navy{color:#59546D;}
/*버튼*/
.ListBottomBtn{position:fixed;bottom:0;left:0;right:0;display:flex;background-color:#fff;padding:0 1.2rem 1.2rem;}
.ListBottomBtn .linebtn{flex-grow:1;margin:0 0.2rem;text-align:center;font-size:1.1rem;font-weight:700;padding:1.05rem 0;border-radius:0.6rem;display:block;border:1px solid;}
.ListBottomBtn .fillbtn{flex-grow:1;margin:0 0.2rem;text-align:center;font-size:1.1rem;font-weight:700;padding:1.05rem 0;border-radius:0.6rem;display:block;border:0;}
.ListBottomBtn::before{content: "";position:absolute;top:-16px;right:0;bottom:0;left:0;z-index: -1;background: linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, #FFFFFF 19.79%);-webkit-backdrop-filter: blur(2px);backdrop-filter: blur(2px);}
.ListBottomBtn .basicbtn{flex-grow:1;margin:0 0.2rem;text-align:center;font-size:1.1rem;font-weight:700;padding:1.05rem 0;border-radius:0.6rem;display:block;background-color:#F6F7FB;color:#777;}

.saveBtnWrap a{flex-grow:1;margin:0 0.2rem;text-align:center;font-size:1.15rem;font-weight:600;padding:1.05rem 0;border-radius:0.6rem;display:block;}

.saveBtnWrap{display:flex;margin:1.5rem 0;}
.saveBtnWrap a{flex-grow:1;margin:0 0.2rem;text-align:center;font-size:1.15rem;font-weight:600;padding:1.05rem 0;border-radius:0.6rem;display:block;}

.saveBtnWrap a.basicbtn{background-color:#F6F7FB;color:#777;}
.saveBtnWrap .savebtn{text-align:center;font-size:1.1rem;font-weight:700;padding:1.05rem 0;border-radius:0.6rem;display:inline-block;border:0;width:55%;}

.twoBtnWrap{display:flex;margin:1.5rem 0;}
.twoBtnWrap a{flex-grow:1;margin:0 0.2rem;text-align:center;font-size:1rem;font-weight:600;padding:1.05rem 0;border-radius:0.6rem;display:block;}
.twoBtnWrap a.basicbtn{background-color:#F6F7FB;color:#777;}
.twoBtnWrap a.linebtn{background-color:transparent;border:1px solid;}

.oneBtnWrap{display:flex;margin:1.5rem 0;}
.oneBtnWrap a{flex-grow:1;text-align:center;font-size:1.15rem;font-weight:600;padding:1.05rem 0;border-radius:0.6rem;display:block;}

.btnMore{display:block;text-align:center;margin-top:0.7rem;}
.btnMore a{color:#767678;padding:0.5rem;}
.btn-close{opacity:1;}
.btn-close.bottomBtn{position:absolute;bottom:1rem;left:50%;background-color:rgba(0,0,0,0.1);width:40px;height:40px;margin-left:-20px;border-radius:50%;color:#fff;opacity:0.5;font-size:0.7rem;}

.BtnWrap{display:flex;}
.BtnWrap.fdr{flex-direction:row-reverse;}

.btn{display:inline-block;user-select:none;cursor:pointer;background-color:#F6F7FB;border:0;color:#777;border-radius:4px;vertical-align:inherit;font-weight:600;}
.btn.btn-md{padding:0.8rem 2rem !important;}
.btn.btn-sx{padding:0.5rem 1rem;font-size:0.9rem;}
.btn.btn-sxx{padding:0.3rem 0.6rem;font-size:0.85rem;}
.btn.lightgray{background-color:#EEF2F7;border-color:#E0E7EF;color:#313a46;}
.btn.lightgray:hover{background-color:#99A0A8;border-color:#8E969D;color:#fff;}
.btn.gray{background-color:#99A0A8;border-color:#99A0A8;color:#fff;}
.btn.gray:hover{background-color:#7E8892;border-color:#7A848D;color:#fff;}
.btn.darkgray{background-color:#758499;border-color:#758499;color:#fff;}
.btn.darkgray:hover{background-color:#627186;color:#fff;}
.btn.black{background-color:#59546D;border-color:#59546D;color:#fff;}
.btn.black:hover{background-color:#373443;}
.btn.navy{background-color:#3F6AD8;border-color:#3F6AD8;color:#fff;}
.btn.navy:hover{border-color:#3F6AD8;background-color:#2B59D5;}
.btn.green{border-color:#07B419;background-color:#07B419;color:#fff;}
.btn.green:hover{background-color:#06A616;color:#fff;}
.btn.red{border-color:#FF5252;background-color:#FF5252;color:#fff;}
.btn.disabled, .btn:disabled{cursor:not-allowed;opacity:.4;box-shadow:none;}

/*폼*/
input {
    pointer-events: auto; 
  }
  
.form-control{background-color:#F9F9FB;border:1px solid #eee;padding:.8rem;}
input[type=date],input[type=time]{border-radius:0;background-color:#fff;border:0;border-bottom:1px solid #ddd;padding: 0.6rem .05rem;} 
.form-check-input{height:1.5em;border-color:#bbb;}
.form-switch .form-check-input{width:3em;}
.form-check-input{width:1.5em;}

.form-select{padding:.8rem 2.25rem .8rem .75rem;}

/*테이블*/
table{width:100% !important;border-spacing:0;border:0;word-break: keep-all;white-space: nowrap;}
table.tltl th{text-align:left !important;}
table.tltl td{text-align:left !important;}
table.tctl th{text-align:center !important;}
table.tctl td{text-align:left !important;}
th.tltl {text-align:left;}
td.tltl {text-align:left;}
th.tctl {text-align:center;}
td.tctl {text-align:left !important;;}


/*기본*/
.offcanvas-body{padding-top:5px;}
.offcanvas.offcanvas-start{width:100%;}
.content{position:relative;padding:4.5rem 1.2rem 7rem;}
.contentView{position:relative;padding:4.5rem 1.2rem 1rem;height:100%;}
.poi{font-weight:700;}
.hidden{display:none !important;}

/*모달*/
#success-alert-modal .bi-check-lg{font-size:3rem;color:#07B419;} 
#success-alert-modal h4{margin-top:0.5rem;font-size:1.5rem;}
#success-alert-modal p{margin:1rem 0;}
#success-alert-modal .btn{/*padding-left:2rem;padding-right:2rem;*/padding: 0.5rem 2rem;}
#success-alert-modal .headerCloseBtn{position:absolute;top:1.5rem;right:1.5rem;}

#warning-alert-modal .modal-content .bi{font-size:2.7rem;color:#FF5252;}
#warning-alert-modal h4{margin-top:1rem;font-size:1.7rem;color:#000;}
#warning-alert-modal p{margin:1rem 0;}
#warning-alert-modal .btn.red{padding-left:1rem;padding-right:1rem;}

/*nodata*/
li.nodata{position:relative;text-align:center;color:#777;padding:6rem 0 4rem !important;}
li.nodata::before{display:none;}
li.nodata::after{content:"\F32B";position:absolute;top:35%;left:50%;margin-left:-10px;display:inline-block;font-family: bootstrap-icons !important;font-style:normal;font-weight:400 !important;font-size:1.2rem;color:#A1A1A1;}


div.nodata{position:relative;text-align:center;color:#777;padding:6rem 0 4rem !important;}
div.nodata::before{display:none;}
div.nodata::after{content:"\F32B";position:absolute;top:35%;left:50%;margin-left:-10px;display:inline-block;font-family: bootstrap-icons !important;font-style:normal;font-weight:400 !important;font-size:1.2rem;color:#A1A1A1;}

/*여백*/
.m0{margin:0 !important}
.mt0{margin-top:0px !important;}
.mt1{margin-top:1px !important;}
.mt2{margin-top:2px !important;}
.mt3{margin-top:3px !important;}
.mt4{margin-top:4px !important;}
.mt5{margin-top:5px !important;}
.mt6{margin-top:6px !important;}
.mt7{margin-top:7px !important;}
.mt10{margin-top:10px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}
.mt25{margin-top:25px !important;}
.mt30{margin-top:30px !important;}
.mt35{margin-top:35px !important;}
.mt40{margin-top:40px !important;}
.mt45{margin-top:45px !important;}
.mt50{margin-top:50px !important;}

.mb0{margin-bottom:0 !important;}
.mb1{margin-bottom:1px !important;}
.mb2{margin-bottom:2px !important;}
.mb3{margin-bottom:3px !important;}
.mb4{margin-bottom:4px !important;}
.mb5{margin-bottom:5px !important;}
.mb7{margin-bottom:7px !important;}
.mb10{margin-bottom:10px !important;}
.mb15{margin-bottom:15px !important;}
.mb20{margin-bottom:20px !important;}
.mb25{margin-bottom:25px !important;}
.mb30{margin-bottom:30px !important;}
.mb35{margin-bottom:35px !important;}
.mb40{margin-bottom:40px !important;}

.mr0{margin-right:0 !important;}
.mr1{margin-right:1px !important;}
.mr2{margin-right:2px !important;}
.mr3{margin-right:3px !important;}
.mr4{margin-right:4px !important;}
.mr5{margin-right:5px !important;}
.mr10{margin-right:10px !important;}
.mr15{margin-right:15px !important;}
.mr20{margin-right:20px !important;}
.mr25{margin-right:25px !important;}
.mr30{margin-right:30px !important;}
.mr35{margin-right:35px !important;}
.mr40{margin-right:40px !important;}

.ml0{margin-left:0 !important;}
.ml1{margin-left:1px !important;}
.ml2{margin-left:2px !important;}
.ml3{margin-left:3px !important;}
.ml4{margin-left:4px !important;}
.ml5{margin-left:5px !important;}
.ml8{margin-left:8px !important;}
.ml9{margin-left:9px !important;}
.ml10{margin-left:10px !important;}
.ml15{margin-left:15px !important;}
.ml20{margin-left:20px !important;}
.ml25{margin-left:25px !important;}
.ml30{margin-left:30px !important;}
.ml35{margin-left:35px !important;}
.ml40{margin-left:40px !important;}

.p0{padding:0 !important;}
.p1{padding:1px !important;}
.p5{padding:5px !important;}
.p10{padding:10px !important;}
.p15{padding:15px !important;}
.pl0{padding-left:0 !important;}
.pt0{padding-top:0 !important;}
.pt5{padding-top:5px !important;}
.pt10{padding-top:10px !important;}
.pt15{padding-top:15px !important;}
.pt20{padding-top:20px !important;}
.pl10{padding-left:10px !important;}
.pl15{padding-left:15px !important;}
.pr15{padding-right:15px !important;}
.pb0{padding-bottom:0 !important;}
.pb5{padding-bottom:5px !important;}
.pb10{padding-bottom:10px !important;}
.pb15{padding-bottom:15px !important;}
.pb20{padding-bottom:20px !important;}




@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), url(/theme/app/assets/font/Pretendard-Black.woff2) format('woff2'), url(/theme/app/assets/font/Pretendard-Black.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), url(/theme/app/assets/font/Pretendard-ExtraBold.woff2) format('woff2'), url(/theme/app/assets/font/Pretendard-ExtraBold.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), url(/theme/app/assets/font/Pretendard-Bold.woff2) format('woff2'), url(/theme/app/assets/font/Pretendard-Bold.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), url(/theme/app/assets/font/Pretendard-SemiBold.woff2) format('woff2'), url(/theme/app/assets/font/Pretendard-SemiBold.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), url(/theme/app/assets/font/Pretendard-Medium.woff2) format('woff2'), url(/theme/app/assets/font/Pretendard-Medium.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), url(/theme/app/assets/font/Pretendard-Regular.woff2) format('woff2'), url(/theme/app/assets/font/Pretendard-Regular.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), url(/theme/app/assets/font/Pretendard-Light.woff2) format('woff2'), url(/theme/app/assets/font/Pretendard-Light.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), url(/theme/app/assets/font/Pretendard-ExtraLight.woff2) format('woff2'), url(/theme/app/assets/font/Pretendard-ExtraLight.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), url(/theme/app/assets/font/Pretendard-Thin.woff2) format('woff2'), url(/theme/app/assets/font/Pretendard-Thin.woff) format('woff');
}

@font-face {
    font-family: 'Montserrat';
    src: url('/theme/app/assets/font/Montserrat-SemiBold.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}