@charset "utf-8";

/* 레이아웃 */
#header {overflow: hidden; line-height: 70px;}

.container {width: 1200px !important; min-width: 1200px; padding: 0 !important;}
.btn_area {text-align: center; margin: 10px 0; height: 30px;}
.btn_right {text-align: right; margin: 10px 0; height: 30px;}

/* 헤더 */
.header div {float: right;}
.header div:first-child {float: left;}

@keyframes fadeIn{
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}

/* 메뉴 */
.globalnavi {height: 50px; background: #136bbd; position: relative;}
.globalnavi > ul {padding-left: 0; margin-bottom: 0; overflow: hidden;}
.globalnavi > ul > li {float: left; display: block; line-height: 50px; width: 171px; text-align: center; color: #fff; font-size: 1.3em; cursor: pointer;}
.globalnavi > ul > li:hover .globalnavi_sub {visibility: visible; opacity:1; transform: translateY(0);}
.globalnavi .globalnavi_sub {opacity:0; transition:.2s ease-in-out; transform:translateY(-20px); visibility: hidden; background: #003d75; overflow: hidden; padding: 10px 0; z-index: 2; position: absolute; left: 0;}
.globalnavi .globalnavi_sub > ul {float: left; padding-left: 0; display: block; width: 171px;}
.globalnavi .globalnavi_sub > ul > li > a {color: #fff; display: block; line-height: 30px; text-align: center; font-size: 0.9em;}

/* 모달 */
.modalWindow {z-index : 2;position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color : rgba(0,0,0,0.4);}
.modalBox {display: none; position: relative; width: 950px; height: 690px;left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: white;}
.closeBtn {position: absolute; right: 5px; top: 5px; display: block; width: 30px; height: 30px; background-color: rgb(255, 255, 255); border-width: 0px;}
.closeBtn::before, .closeBtn::after {content: ""; position: absolute; top: 50%; left: 50%; width: 2px; height: 30px; background: #333;}
.closeBtn::before {transform: translate(-50%,-50%) rotate(45deg);}
.closeBtn::after {transform: translate(-50%,-50%) rotate(-45deg);}
.btnBox {height: 40px;}
.contentsBox {width: 850px; height:600px; justify-content: center;}
.monthSales {margin-left:15px; font-size: 45;}
.daySales {margin-left:15px; font-size: 45;}
.listBox {margin-top: 10px; height:450px; overflow-y: auto;}
.modalBottom {display: flex; justify-content: space-between;}
.modalBtn {height:30px;}


/* 메인컨텐츠 */
.main_sect {margin-top: 20px;}
.main_sect i {font-weight: bold; font-size: 16px; color: #003d75;}
.main_sect > article {float: left; width: 590px; position: relative;}
.main_sect > article:last-child {float: right;}
.main_sect > article > div {border: 1px solid #003d75;}
.main_sect > article > a > img {position: absolute; right: 10px; top: 8px;}
.main_sect .box {border: 1px solid #003d75;}

/* 푸터 */
.footer {padding: 20px 0; height: 100px;}
.footer > div {float: left;}
.footer > div:last-child {margin-left: 50px;}

/* 타이틀 및 네비게이션 */
.navigator {padding: 10px 0; position: relative;}
.navigator > div:last-child {position: absolute; right: 10px; top: 17px;}

/* 홈피리스트 */
.contents .search {margin-bottom: 20px;}
.contents .search > legend {font-weight: bold;}
.contents .search > label {font-weight: bold;}

/* 홈피상세정보 */
.pay_info {height: 290px; position: relative;}
.pay_info table {border-collapse : collapse; width: 100%;}
.pay_info th {background: #f4f0f0; height: 40px; font-size: 14px}
.pay_info tr {height: 40px; border-bottom: 1px solid #ccc; box-sizing: border-box;}
.pay_info tbody {position: absolute; overflow-y: auto; height: 200px; width: 100%;}

.scroll_article {height: 330px;}
.scroll_article .scroll_div {position: absolute; overflow-y: auto; height: 280px; width: 100%;}

.status_table tr {border: 1px solid #ccc;}
.status_table th {background: #f4f0f0; padding: 10px; width: 150px;}
.status_table td {padding: 10px; width: 150px; text-align: right;}

/* 1:1문의/상담요청 */
.inquiry_view {border: 1px solid #ccc; padding: 20px;}
.inquiry_view > div:nth-child(2) > span {display: inline-block; width: 150px; margin: 5px 0 20px 0;}
.inquiry_view .cont > img {width: 100%}
.inquiry_table {width: 100%;}
.inquiry_table tr {border: 1px solid #ccc;}
.inquiry_table th {background: #f4f0f0; padding: 10px; width: 150px;}
.inquiry_table td {padding: 10px;}

/* 매출내역 */
.calendar th {text-align: center; font-weight: bold;}
.calendar td {text-align: right; width: 171.4px; height: 80px; position: relative;}
.calendar td span {display: block;}
.calendar td span:last-child {position: absolute; right: 10px; top: 50px;}

.canvas {margin-bottom: 20px;}

.domain_box {height: 388px; position: absolute; overflow-y: auto; width: 100%;}

/* 문자발송 */
.sms_form {margin: 20px; padding: 20px; border: 3px solid #34515e; border-radius: 10px;}
.sms_form textarea {width: 260px; height: 150px;}
.felx_container {width: 800px; height:350px; margin: 20px; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-content: space-between;}
.felx_container > div {width: 200px; height: 150px; border: 1px solid #ccc; padding: 10px; border-radius: 10px; margin: 0 10px; cursor: pointer;}

/* 회원목록 */
.dialog_mber {width: 700px; padding: 20px; background: #fff; display: none;}

/* 로그인ID변경 */
.dialog_loginid {width: 400px; padding: 20px; background: #fff; display: none;}

/* 관리자변경 */
.dialog_admin {width: 500px; padding: 20px; background: #fff; display: none;}

/* 용량관리 */
.dialog_cpcty, .dialog_vod {width: 500px; padding: 20px; background: #fff; display: none;}

/* 카테고리변경 */
.dialog_category {width: 500px; padding: 20px; background: #fff; display: none;}
.dialog_category .dialog_container {width: 450px; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-content: space-between;}
.dialog_category .dialog_container > label {width: 100px; margin-bottom: 10px;}

/* 문자발송, 연장안내메일송신, 연장안내문자송신 */
.dialog_sms,
.dialog_mail, 
.dialog_receipt, 
.dialog_trans {width: 400px; padding: 20px; background: #fff; display: none;}

.dialog_preview {display: none; background: #fff; z-index: 1; position: relative;}
.dialog_preview .close {position: absolute; right: 10px; top: 6px;}
.dialog_preview > h3 {background: #1B519B; color: #fff; padding: 5px 10px;}
.dialog_preview .text {padding: 10px;}
/*.dialog_sms .sms_container {width: 490px; height:350px; margin: 20px 0; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-content: space-between;}
.dialog_sms .sms_container > div {width: 160px; height: 150px; border: 1px solid #ccc; padding: 10px; border-radius: 10px; cursor: pointer;}*/

/** 동영상업로드 팝업 **/
.video {padding: 0 20px;}
.video div {line-height: 20px;}
.video div span {padding-left: 40px; display: block; margin-top: -22px;}
.video div iframe {border: 1px solid #ccc;}
.video div:first-child {line-height: 50px; font-size: 16px; font-weight: 600;}
.video div:first-child em {padding-left: 20px; font-size: 13px; color: #ff0000;}
.video div:nth-child(6) {margin-top: 10px;}
.video div:last-child {text-align: center; margin-top: 10px;}

/** 업로드 팝업 **/
.innods {padding: 0 20px;}
.innods .btn {width: 90px; height: 40px; background: #666; color: #fff; font-weight: 400; transition: all 1.0s ease;}
.innods .btn:hover {box-shadow: 0 80px 0 0 rgba(0,0,0,0.5) inset, 0 -80px 0 0 rgba(0,0,0,0.5) inset; color:#fff;}
.innods > div > span {padding-left: 40px; display: block; margin-top: -18px;}
.innods > div:first-child {line-height: 50px; font-size: 16px;}
.innods > div:first-child em {padding-left: 20px; font-size: 13px; color: #ff0000; font-weight: 600;}
.innods > div:nth-child(3) {padding: 10px 0; text-align: center;}
.innods > div:last-child {padding: 10px 0; text-align: center;}

.eye::after {
  font-family: 'FontAwesome';
  content: "\f070";
  padding-right: 10px;
}
.eye-slash::after {
  font-family: 'FontAwesome';
  content: "\f06e";
  padding-right: 10px;
}
.input-icon {
  position: relative;
  float: right;
  margin-top: -25px;
}