/* 로그인 페이지 CSS DIR / account/login_set */
.login_wrap{height: 100%; background: #f8fafc; position: absolute; overflow-x: hidden;}
.login_wrap .backImg{ position : absolute; right: 0;}
.login_wrap > div { position : absolute; top: 160px; left: 50%; transform: translate(-50%,0); width : 605px; min-height : 615px; float:left; }

.login_wrap .loginFrmWrap { width:100%; float:left;  box-shadow: 5px 5px 30px 10px #9bcef1; padding : 85px 90px; background-color: #ffffff; }

.login_wrap form { width:100%; float:left; }
.login_wrap .copy_write{ width: 100%; float: left; border-top: 1px solid #e1e1e1; font-size:12px; color:#ccc; text-align:center; margin-top:50px; padding-top:20px; }
.login_wrap .copy_write * { color:inherit; font-size:inherit; }

.login_wrap .logo_txt{padding-top: 10px;}
.login_wrap .login_content{ margin-top: 20px; border-top: 1px solid #e1e1e1; padding-top: 45px;}
.login_wrap .login_content .txtBox{ margin-top: 10px; border : 1px solid #e1e1e1; padding: 17px 20px;}
.login_wrap .loginBtn{margin-top: 45px; height: 50px;}

/* 발신번호 요청 페이지 CSS DIR /sub/careset/callbackW */
.certBtn { width: 100px; height: 40px; float: left; margin-left: 10px; background: #fff; font-size: 14px; font-weight: bold; cursor: pointer; }
.resetBtn { width: 100px; height: 40px; float: left; margin-left: 10px; background: #fff; font-size: 14px; font-weight: bold; cursor: pointer; }



/* index */
.main_index{display: inline-block; width: 1400px; padding-top: 50px; padding-bottom: 90px;}
.main_index .main_care{ width: 480px; height: 555px; padding : 35px 40px 0 30px;}
.main_index .main_gudok{ width: 480px; /*height: 550px; */}
.main_index .main_kakao{ width: 480px; height: 260px; padding : 20px 40px 0 30px;}
.main_index .main_sms{ width: 480px; height: 260px; padding : 35px 40px 0 30px;}
.main_index .my_info{width: 580px; height: 550px; padding-left: 25px;}
.main_index .my_info > div{padding : 20px 40px 0 30px;}


/* 발신번호 설정 페이지 CSS DIR /sub/careset/callbackL */
.listCon thead th > span{font-size: 10px; color: #999999;}
.listCon tbody td{border-right: 0; position: relative;}
/*.listCon tbody td .del_btn{position: absolute; top: 50%; right: 50%; transform: translate(185%, -51%); font-size: 17px;}*/
.listCon tbody td .del_btn > i{color: #ccc; cursor: pointer;}
.listCon thead tr:first-of-type th {border-right: 0;} 
label.toggle2 { cursor: pointer; background-color: #EEE; width: 30px; height: 20px; display:inline-block; vertical-align: middle; transition: all 0.5s; padding: 3px 8px; border-radius: 25px; }
label.toggle2 > div { width: 14px; height: 14px; background-color: #FFF; border-radius: 100%; float: left; transition: all 0.5s; left: -4px; }
input.toggle2 { display: none; }
input.toggle2:checked + label.toggle2 { background-color: #2790FF; }
input.toggle2:checked + label.toggle2 > div { left: 5px; }


/* sms 구독관리 페이지 CSS DIR /sub/careset/smsGudokL */
.gray_i{color: #cccccc !important; font-size: 15px !important; float: left; height: 18px; line-height: 18px !important;}
.date_icon{float: left; margin-left: -30px; height: 40px; line-height: 40px;}
.date_icon > i{color : #666666;}
.gb_span{float: left; font-size: 13px; margin-left: 3px; color: #666666;}

.listBox .txtBox { width:130px; height:34px; color: #999999; padding-left: 14px; font-size: 13px; border: 1px solid #ededed;}
.lh40{line-height: 40px;}
.listBox .left .txtBox{margin-left: 35px;}



/* sms 구독회차관리 페이지 CSS DIR /sub/careset/smsGudokSet */
.sms_btn{background-color: #464646; text-align: center; margin-top: 33px; border-radius: 10px 10px 0 0;}
.sms_wrap{background-color: #ebebeb; padding:15px 20px; border-radius: 0 0 10px 10px;}
.sms_wrap_in{border-bottom: 1px solid #e1e1e1; padding-bottom: 10px; margin-bottom: 10px;}
.sms_wrap textarea{ overflow:hidden; resize: none; border-color: #ececec; border-radius: 10px; padding: 25px; line-height: 20px !important; font-size: 13px;}
.sms_wrap textarea::placeholder{color: #cccccc;}
.sms_wrap > div {font-size: 12px;}
.sms_wrap > div span { font-size:inherit; }
.sms_wrap input{border: 1px solid #cccccc; padding-left: 14px; font-size: 14px;}
.sms_wrap select{border: 1px solid #cccccc; padding:0 10px; font-weight: 500; font-size: 14px; color: #666666;}
.sms_wrap p{color : #666666; font-weight: 500;}
.select_wrap select{border: 1px solid #cccccc; padding:0 10px; font-weight: 500; font-size: 14px; color: #666666;}
.select_wrap input{border: 1px solid #cccccc; padding-left: 14px;  font-size: 14px;}
.select_wrap .fileBtn{ background-color: #707070; border : 1px solid #707070; color: #fff; text-align: center; font-weight: 900; font-size: 13px;}
.save_wrap{border-top: 1px solid #ebebeb;}
.notice_wrap{border-radius: 10px; background-color: #f4f4f4; padding: 20px 20px; line-height: 15px;}
.notice_wrap p{color: #cc3333; font-weight: 900; }

.notice_wrap p:first-of-type { color: blue; margin-bottom:5px; }
.notice_wrap p:not(:first-child){font-size: 11px; color: #666; font-weight: 500;}
.notice_wrap span{font-weight: 900; font-size: 10px; color: #cc3333; margin-top: 10px; display: inline-block}
.round_wrap{ margin-top: 35px; /*width: 1100px; */ width: 100%; float: left; border-left: 1px solid #e6e6e6; padding-left: 42px;}
.round_wrap .send_info{ /*width: 1055px; */ width: 100%; border : 1px solid #cccccc; border-radius: 10px; position: relative; padding : 60px 20px 30px 30px;}
.round_wrap .send_info.active{border: 2px solid #2598e7;}
.round_wrap .send_info:not(:last-child){}
.send_info .send_div{ font-weight: 100; color: #999999; }
.send_div > span{ font-weight: 900; color: #999999; font-size: 13px;}
.send_div > span:nth-child(2){ font-weight: 100; }
.send_div > i{color : #999999;}

.send_info .send_txt{padding: 23px 28px; min-height: 108px; overflow:hidden; resize: none; border-color: #e1e1e1; border-radius: 10px;}
.send_info.active .send_txt{ border-color: #2598e7; box-shadow: 3px 3px 5px 0px #ccc;}
.send_info .drag_icon{position: absolute; font-size: 18px; cursor: pointer; top : 40px; right : 35px;}
.send_info .side_round{position: absolute; top: -5px; left: -115px; font-weight: 900; height: 19px; line-height: 19px; text-align: right; width: 45px;}
.send_info .side_round > div{ position: absolute; right: -35px; top : 0; width: 18px; height: 18px; border-radius: 50%; border: 3px solid #999; background-color: #fff; }
.send_info.active .side_round > div{ border: 3px solid #2598e7;}
.send_info .side_ad{position: absolute; top: 70px; left : 28px;}
.send_info .side_noAd{position: absolute; bottom: 73px; left: 28px;}
.send_info .send_wrap{ min-height: 150px; }
.send_info textarea.sms_txt { resize : none; overflow : hidden; min-height:120px; font-size:13px; line-height:20px; }
.send_info .noAd_txt { font-size:12px; margin-top:20px; margin-bottom: 5px; font-weight: 500; color:#333; }
.send_info .noAd_txt span { font-size:inherit; color:inherit; }


.add_wrap{width: 100%; margin-top: 40px; position: relative; }
.add_wrap .add_btn{position: absolute; padding: 0 25px; color: #acacac; top: -10px; background-color: #fff; text-align: center; right: 50%; transform: translate(50%,0);}
.add_wrap .add_btn i{color: #acacac; font-size: 17px;}
.add_wrap .add_btn span{font-size: 15px; color: #acacac; display: inline-block;}
.add_wrap .add_con{  border-radius: 10px; margin-top: 30px; text-align: center;}
.add_wrap .add_con > *{display: inline-block;}
.add_wrap .add_con button{width: 400px;}
.add_wrap .add_con input{border : 1px solid #e1e1e1; margin-left: 60px;}
.add_wrap .add_con select{border : 1px solid #e1e1e1}
#sortable .ui-state-default{background-color: #fff !important;  }
.ad_select > span{ cursor: pointer; }
.ad_select > span > i{color : #cccccc}
.noAd_select > span{cursor: pointer;}
.noAd_select > span > i{color : #cccccc}
.ad_p{opacity: 0;}
.ad_p.active{ opacity: 1; color: #333333 !important;}
.noAd_p{opacity: 0; font-size: 12px;}
.noAd_p.active{ opacity: 1; color: #333333 !important;}
.add_sms{ background-color: #e2eff7; overflow: hidden; padding : 12.5px 20px; border-bottom: 0 !important;}
#sms_con{background-color: rgba(0,0,0,0); z-index: 1; min-height: 180px; border : 0; padding-top: 0; margin-top : 50px; margin-bottom: 80px; padding-bottom: 0;}


/* 카카오톡 구독관리 페이지 CSS DIR /sub/careset/kakaoGudokSet */
.send_info .save_con{ display: none; }
.send_info.active .save_con{ display: block; }
.send_info.active .write_con{ display: none; }


/* 카카오톡 구독템플릿관리 페이지 CSS DIR /sub/careset/kakaoTemplate */

.temp_wrap{ border-top: 1px solid #ccc; }
.temp_wrap .temp_con{background-color : #ebebeb; border-radius: 10px; /*margin-left: 55px;*/ margin-left: 5%; margin-top: 50px; padding: 30px 20px;}
.temp_wrap .temp_con:nth-child(3n-2){ margin-left: 0px;}
.temp_wrap .temp_con:first-child{ margin-top: 0; }
.temp_wrap .temp_con:nth-child(2){ margin-top: 0; }
.temp_wrap .temp_con:nth-child(3){ margin-top: 0; }
.temp_wrap .temp_text{width: 100%; height: 255px; background-color: #fff; border-radius: 10px;  border:1px solid #e1e1e1; padding : 15px;}
.button_wrap select{border: 1px solid #cccccc; padding:0 10px; font-weight: 500; font-size: 14px; color: #666666;}
.button_wrap input{border: 1px solid #cccccc; padding-left: 14px;  font-size: 14px;}
.button_wrap .fileBtn{ background-color: #707070; border : 1px solid #707070; color: #fff; text-align: center; font-weight: 900; font-size: 13px;}




/* 카카오톡 컨텐츠 페이지 CSS DIR /sub/careset/kakaoContentL, V, W*/
.bbs_table th{height: 75px !important;}
.bbs_table th:first-child{padding-top: 5px;}
.bbs_table td{height: 80px !important;}
.bbs_table td:first-child{padding-top: 10px;}
.bbs_table td:nth-child(4){text-align: left;}
#communityViewWrap .viewCont { width: 100%; float: left; }
#communityViewWrap .viewCont .titleWrap { width: 100%; float: left; margin-top: 50px; /*border-top: 2px solid #8c8c8c; */padding: 20px; padding-bottom: 0; }
#communityViewWrap .viewCont .titleWrap .title { font-size: 30px; font-weight: 500; color: #333; }
#communityViewWrap .viewCont .dateWrap { width: 100%; float: left; padding: 30px 30px 10px 30px; border-bottom: 1px solid #ccc; }
#communityViewWrap .viewCont .dateWrap li { float: right; font-size: 16px; color: #ccc; }
#communityViewWrap .viewCont .contentWrap { width: 100%; float: left; padding: 20px; min-height: 500px; }
#communityViewWrap .viewCont .contentWrap .content { width: 100%; float: left; font-size: 20px; font-weight: 400; color: #333; line-height: 30px; }
#communityViewWrap .viewCont .contentWrap .content p img { max-width: 100%; }
#communityViewWrap .viewCont .contentWrap img { max-width:100%; }
#communityViewWrap .viewCont .fileUploadWrap { width: 100%; float: left; }
#communityViewWrap .viewCont .fileUploadWrap ul { width: 100%; float: left; background: #f2f2f2; padding: 10px 30px; }
#communityViewWrap .viewCont .fileUploadWrap ul li { font-size: 17px; }
#communityViewWrap .viewCont .fileUploadWrap ul li:nth-child(1) { width: 8%; float: left; }
#communityViewWrap .viewCont .fileUploadWrap ul li:nth-child(2) { width: 92%; float: left; color: #666; }
#communityViewWrap .viewCont .fileUploadWrap ul li a { width: 100%; float: left; }
#communityViewWrap .viewCont .prevBtnWrap { width: 100%; float: left; margin-top: 20px; }
#communityViewWrap .viewCont .prevBtnWrap a { height: 40px; width: 100px; text-align: center; font-size: 18px; border: 1px solid #ccc; padding: 7px 20px; color: #666; border-radius: 3px; float: right; }
.infoTableWrap { width: 100%; float: left; }
.infoTableWrap .tit { width: 100%; float: left; font-size: 20px; font-weight: bold; color: #7f6f60; margin-bottom: 5px; margin-top: 30px; }
.infoTableWrap .tit:first-of-type { margin-top: 0; }
.infoTableWrap table { width: 100%; float: left; border-top: 2px solid #7f6f60; border-bottom: 1px solid #7f6f60; table-layout: fixed; }
.infoTableWrap table tr > * { border-bottom: 1px solid #E8E8E8; border-right: 1px solid #E8E8E8; }
.infoTableWrap table tr:last-of-type > * { border-bottom: 0; }
.infoTableWrap table tr > *:last-child { border-right: 0; }
.infoTableWrap table tr > th { background-color: #F7F7F7; vertical-align: top; text-align: left; font-size: 17px; font-weight: 400; padding: 20px; }
.infoTableWrap table tr > td { height: 49px; font-size: 13px; font-weight: 400; padding: 15px 10px; }
.infoTableWrap > form > table tr > th.important::after { content: "*"; color: #DC3333; margin-right: 3px; font-weight: bold; }
.infoTableWrap > form > table tr > td { height: 49px; padding: 10px; }
.infoTableWrap > form > table tr > td .warning { font-weight: 500; font-size: 12px; color: #CCC; }
.infoTableWrap table tr > td input { padding:10px; border: 1px solid #ccc; width: 200px; }
.writeBtnWrap { width: 100%; float: left; margin-top: 20px; }
.writeBtnWrap button { height: 40px; width: 100px; background: #7f6f60; text-align: center; font-size: 18px; border: 1px solid #ccc; padding: 7px 20px; color: #fff; border-radius: 3px; float: right; }
.writeBtnWrap .listBtn { height: 40px; width: 100px; background: #fff; text-align: center; font-size: 18px; border: 1px solid #ccc; padding: 7px 20px; color: #666; border-radius: 3px; float: left; }
.typeBtn { width: 150px; height: 34px; line-height: 34px; float: left; font-weight: bold; font-size: 14px; border: 1px solid #666; background-color: #666; color: #FFF; text-align: center; -ms-user-select: none; -moz-user-select: -moz-none; -webkit-user-select: none; -khtml-user-select: none; user-select: none; cursor: pointer; }
.typeBtn > i { margin-right: 6px; color: inherit;}
.btnOrange02 { border: 1px solid #FF7818; background-color: #FFF; color: #FF7818;}
/*.se2Plugin > iframe { height: 359px !important;}*/



/* 문자전송관리  CSS DIR /sub/smsset/smsSend */
.setting_wrap .btn_wrap * { border : 1px solid #cccccc; }
.setting_wrap .sms_table{width: 100%;}

.listCon.sms_table{border-top: 1px solid #000; border-bottom: 1px solid #ebebeb;}
.listCon.sms_table:last-child{border-top: 0; border-bottom: 0;}


.listCon.sms_table thead th:first-child{padding-top: 10px;}
.listCon.sms_table tbody td:first-child{padding-top: 10px;}
.listCon.sms_table thead th{background-color: #fff; border-bottom: 1px solid #ebebeb;}
.res_wrap{ border-top: 1px solid #ebebeb; padding-top: 25px; }
.res_wrap input{padding: 0 15px; border : 1px solid #e1e1e1;}
.res_wrap select{padding: 0 15px; border : 1px solid #e1e1e1;}


/* 문자 로그 */
.listWrap { width: 100%; float: left; }
.listWrap img { max-width: 100%; }
.listWrap > .info { width: 100%; float: left; font-size: 15px; color: #AAA; margin-top: 40px; margin-bottom: 15px; border: 3px solid #CCC; font-weight: 500; text-align: center; padding: 15px; }
.listWrap > .info:first-of-type { margin-top: 0; }
.listWrap > .info > span { letter-spacing: -0.5px; font-weight: bold; }
.listWrap > table { width: 100%; float: left; border-top: 1px solid #666; }
.listWrap > .tit { width: 100%; float: left; font-size: 16px; font-weight: bold; color: #000; padding-bottom: 6px; margin-top: 60px; }
.listWrap > .tit:first-of-type { margin-top: 0; }
.listWrap > table > thead > tr > th {font-size: 14px;font-weight: bold;color: #333;border-right: 1px solid #FFF;text-align: center;vertical-align: middle;height: 50px;}
.listWrap > table > thead > tr > th:last-of-type { border-right: 0; }
.listWrap > table > thead > tr:nth-of-type(1) > th { background-color: #F3F3F3; }
.listWrap > table > thead > tr:nth-of-type(2) > th {background-color: #EAEAEA;border-top: 1px solid #FFF;height: 45px;}

.listWrap > table > tbody > tr.rowMove { cursor: pointer; }
.listWrap > table > tbody > tr.rowMove:hover > td { background-color: #FBFBFB; }
.listWrap > table > tbody > tr > td { font-size: 13px; font-weight: 400; color: #666; border-bottom: 1px solid #EFEFEF; border-right: 1px solid #EEE; text-align: center; padding: 0 7px; height: 60px; word-break: break-all; }
.listWrap > table > tbody > tr:last-of-type > * { border-bottom: 1px solid #E3E3E3; }
.listWrap > table > tbody > tr > td.no { color: #CCC; }
.listWrap > table > tbody > tr > td.tl { text-align: left; }
.listWrap > table > tbody > tr > td:last-of-type { border-right: 0; }
.listWrap > table > tbody > tr > td .recommender{ color:#CD3333; font-weight:500; }
.listWrap > table td i.none { color: #E9E9E9; }
.listWrap > table td i.click { opacity: 0.8; }
.listWrap > table td i.click:hover { opacity: 1; }
.listWrap > table td i.dbCsBtnY { color: #CCC; }
.listWrap > table td.stopProgram { cursor: default; }
.listEtcWrap { width: 100%; float: left; margin-bottom: 7px; }
.listEtcWrap > .right > * { margin-left: 10px; }
.listEtcWrap > .left > .cnt { height: 35px; line-height: 35px; float: left; color: #333; font-weight: bold; font-size: 14px; }




/* 체크박스 커스텀 */
input[type="checkbox"] { display: none; }
label.ch { font-size: 18px; -ms-user-select: none; -moz-user-select: -moz-none; -webkit-user-select: none; -khtml-user-select: none; user-select: none; }
label.ch > .on { display: none; color: /*#3366CC;*/ #999999; }
label.ch > .off { display: inline-block; color: #CCC; }

input[type="checkbox"]:checked + label.ch > .on { display: inline-block; }
input[type="checkbox"]:checked + label.ch > .off { display: none; }


.tabTitle{font-size: 17px; font-weight: 500; color: #333; line-height: 50px;}
.tabGuide{font-size: 13px; color: #666666; margin-left: 10px; line-height: 50px;}
.tabSquare{display: inline-block; width: 12px; height: 12px; margin-right: 8px; border-radius: 3px; }

.write_wrap .auto_replace{display: inline-block; vertical-align: middle; min-width: 90px; line-height: 30px; border: 1px solid #D5D5D5; background-color: #F8F8F8; border-radius: 50px; text-align: center; font-weight: bold; margin-bottom: 3px; padding: 0 15px; color: #999999; font-size: 14px; margin-right: 5px; cursor: pointer;}


.popTopBox{width: 100%; float: left; margin-bottom: 20px; background-color:#EDEDED; min-height:80px; border-radius: 10px;}
.popTopTit{float: left; font-size: 18px; font-weight: 500; color: #333; line-height: 80px; margin-left: 30px;}
.popTopTit i{font-size: 20px; margin-right: 10px;}
.popTopInfoWrap{float: right; padding-left: 20px; padding-right: 20px; background-color: #fff; border-radius: 50px; padding: 10px; min-height:45px; width:650px; margin:18px;}
.popTopInfoList li{float: left}
.popTopInfoTit{font-size: 14px; font-weight: bold; color: #333333; line-height: 25px; margin-left:20px; margin-right:10px;}
.popTopInfoCont{font-size: 14px; color: #666666; line-height: 25px;}

.listTitIcon{position: absolute; right: 20px;}
.listTitIcon i{font-size: 15px; color: #CCCCCC;}

.lineTop{border-top:1px solid #e7e7e7; padding-top:15px;}

.gudokDelBtn{border:1px solid #cccccc !important; background-color: #ffffff !important; color: #cccccc !important; font-size: 14px; cursor:pointer; width:120px !important;}
.divBar{display: inline-block; width: 1px; height: 30px; background-color: #E4E4E4; margin: 0 20px; vertical-align: middle;}

/* gudokNumFriend 링크 버튼 css */
.link_plus, .link_minus { float: left !important; margin-top: 10px; height: 45px !important; line-height: 45px !important; margin-left: 10px; cursor: pointer; }
.link_btn_name { float: left !important; margin-top: 10px; padding-left: 15px; padding-right: 15px; height: 45px; border: 1px solid #e1e1e1; border-radius: 5px; width: 25%; }
.link_btn_url { float: left !important; margin-top: 10px; margin-left: 10px; padding-left: 15px; padding-right: 15px; height: 45px; border: 1px solid #e1e1e1; border-radius: 5px; width: 60%; }