﻿@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumbarungothic.css);

/* Common */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin:0; outline:0; border:0; padding:0; font-size:100%; vertical-align:baseline; text-align:left;}
html, body {height:100%;}
html, body {font-family:nanumgothic, Malgun Gothic, Dotum, Arial; font-size:14px; color:#4b4b4b; background:#fff;}
ul {list-style:none;}
ol {padding-left:22px;}
blockquote, q {quotes:none;}
:active, :focus {outline:0;}
a {color:#4b4b4b; text-decoration:none;}
a:hover {color:#36c; text-decoration:underline;}
a, li, input {-webkit-tap-highlight-color:rgba(0,0,0,0) !important;}
a img {border:0; padding:0; vertical-align:middle;}
ins {text-decoration:none;}
del {text-decoration:line-through;}
table {border-collapse:collapse;}
input[type=text], input[type=password] {font-family:nanumgothic, Malgun Gothic, Dotum, Arial; font-size:14px; background:#fff; color:#4b4b4b; border:1px solid #ccc; padding:4px 5px; height:16px; vertical-align:middle;}
select {height:26px; margin:0; vertical-align:middle; border:1px solid #ccc; outline:none; background:#fff; font-family:nanumgothic, Malgun Gothic, Dotum, Arial; font-size:14px; color:#4b4b4b;}
input[type=checkbox] {vertical-align:middle; margin:1px;}
input[type=radio] {vertical-align:middle; margin:0;}
input[type=file] {font-family:nanumgothic, Malgun Gothic, Dotum, Arial; font-size:14px; color:#4b4b4b; background:#fff; color:#4b4b4b; border:1px solid #ccc; padding:1px;}
input[type=image] {display: inline-block; *zoom:1; *display:inline; vertical-align: middle;}
input[type=button] {display: inline-block; *zoom:1; *display:inline; vertical-align: middle; cursor:pointer; margin-left:-1px;}
textarea {padding:5px; border:1px solid #ccc; font-family:nanumgothic, Malgun Gothic, Dotum, Arial; font-size:14px; color:#4b4b4b; line-height:140%;}

caption {visibility:hidden; height:1px;}
img {vertical-align:middle;}
p {margin-bottom:10px;}

/* 레이아웃 */
#wrap {position:relative; width:100%;}
#headerWrap {position:fixed; top:0; width:100%; height:73px; background:url(../images/bg_top.png) repeat-x; z-index:2;}
#header {position:relative; overflow:hidden;  width:980px; height:73px; margin:0 auto; text-align:right;}
#header h1 {float:left; width:194px; height:36px; margin-top:18px; background:url(../images/logo_top.png) no-repeat; text-indent:-9999px;}
#header .menu {margin:10px 0 0 260px;}
#header .menu li {display:inline-block; *zoom:1; *display:inline; _display:inline; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial; font-size:16px; font-weight:bold;}
#header .menu li a {display:block; padding:16px 14px; color:#fff;}
#header .topmenu {position:absolute; top:13px; right:0;}
#header .topmenu li {display:inline-block; *zoom:1; *display:inline; _display:inline; margin:0 4px; font-size:12px;}
#header .topmenu li a {display:block; padding:30px 5px 5px; color:#a5bcde;}
#header .topmenu li a.login {background:url(../images/icon_top_login.png) no-repeat center 0;}
#header .topmenu li a.join {background:url(../images/icon_top_join.png) no-repeat center 0;}
#header .topmenu li a.login:hover {background-position:center -60px; color:#fff;}
#header .topmenu li a.join:hover {background-position:center -60px; color:#fff;}
#header .topmenu li a.logout {background:url(../images/icon_top_logout.png) no-repeat center 0;}
#header .topmenu li a.logout:hover {background-position:center -60px; color:#fff;}
#header .topmenu .info {width:100px; padding-top:4px; color:#a5bcde; line-height:160%; vertical-align:top;}
#header .topmenu .info strong {display:inline-block; width:100px; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

#visual {width:100%; height:430px; background:url(../images/bg_visual.png) no-repeat center; background-size:cover;}
#visual .featureWrap {overflow:hidden; width:980px; margin:0 auto; padding-top:150px;}
#visual .featureWrap p {color:#fff; font-size:17px; font-weight:; text-align:center; line-height:150%;}
#visual .feature01 {float:left; width:194px; padding-top:154px; background:url(../images/icon_feature_01.png) no-repeat top center;}
#visual .feature02 {float:left; width:194px; padding-top:154px; margin-left:68px; background:url(../images/icon_feature_02.png) no-repeat top center;}
#visual .feature03 {float:left; width:194px; padding-top:154px; margin-left:68px; background:url(../images/icon_feature_03.png) no-repeat top center;}
#visual .feature04 {float:left; width:194px; padding-top:154px; margin-left:68px; background:url(../images/icon_feature_04.png) no-repeat top center;}

#mainCont {line-height:140%;}
#mainCont h2 {padding-bottom:30px; color:#333; font-size:26px; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial; text-align:center; line-height:110%;}
#mainCont h3 {padding:0 0 10px 10px; background:url(../images/bul_h4.png) no-repeat 0 4px; color:#333; font-size:18px; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial; line-height:120%;}
#mainCont .tableList td {padding:6px 10px !important;}

/* 080 수신거부 서비스란? */
.main01Wrap {padding:50px 0;}
.main01 {overflow:hidden; width:980px; margin:0 auto;}
.main01 .cont {float:left; width:400px;}
.main01 .cont .cont01 {margin-bottom:20px;}
.main01 .cont .cont02 h3 {font-size:16px !important;}
.main01 .main01_guide {float:right; width:560px; height:510px; background:url(../images/img_01.png) no-repeat;}
.main01 .main01_guide p {display:none;}

/* 당사 서비스의 특징 */
.main02Wrap {padding:50px 0; background-color:#f5f5f5;}
.main02Wrap .main02 {position:relative; width:980px; margin:0 auto;}
.main02Wrap .main02 .btnWrap {position:absolute; bottom:30px; right:0px;}

/* 서비스 이용 방법 */
.main03Wrap {padding:50px 0;}
.main03Wrap .main03 {position:relative; width:980px; margin:0 auto;}
.main03Wrap .main03 .contWrap {overflow:hidden; padding-top:14px;}
.main03Wrap .main03 .contWrap .cont01 {float:left; width:740px;}
.main03Wrap .main03 .contWrap .cont02 {float:right; width:210px;}
.main03Wrap .main03 .contWrap .cont02 .btnL {width:100%; margin:0 0 6px 0; padding:17px 0; text-align:center; line-height: 80%;}

/* 실시간 데이터 연동 */
.main04Wrap {padding:50px 0; background-color:#f5f5f5;}
.main04Wrap .main04 {position:relative; width:980px; min-height:140px; margin:0 auto; background:url(../images/icon_main04.png) no-repeat right;}

/* Q&A */
.main05Wrap {padding:50px 0;}
.main05Wrap .main05 {position:relative; width:980px; margin:0 auto;}
.qna {border-top:1px solid #ddd;}
.qna dl {display:block; line-height:150%;}
.qna dl dd {display:none;}
.qna dl.on dd {display:block;}
.qna dl dd p {line-height:150%;}
.qna dl dt {display:block; border-bottom:1px solid #ddd; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial; font-size:16px; font-weight:bold;}
.qna dl dt  {display:block; background:url(../images/icon_q.png) no-repeat 23px 8px;}
.qna dl dt  span {display:block; padding:17px 40px 17px 74px; background:url(../images/arrow_qna_off.png) no-repeat 940px 22px;}
.qna dl.on dt a {}
.qna dl.on dt span {background:url(../images/arrow_qna_on.png) no-repeat 940px 22px;}
.qna dl dd {padding:20px 20px 20px 74px; border-bottom:1px solid #ddd; background:#F8F8F8 url(../images/icon_a.png) no-repeat 23px 13px;}

/* 센더스 소개 */
.main06Wrap {padding:50px 0; background-color:#f5f5f5;}
.main06Wrap .main06 {position:relative; width:980px; min-height:140px; margin:0 auto;}
.main06Wrap .main06 ul {width:760px;}
.btnSenders {display:inline-block; *zoom:1; *display:inline; position:absolute; top:54px; right:0; width:200px; height:80px; background:url(../images/btn_senders.png) no-repeat; text-indent:-9999px;}
.btnSenders:hover{background-position:0 -80px;}

/* Sub Pages */
#subContWrap {}
#subContWrap .subCont {width:980px; margin:0 auto; padding:150px 0 140px 0; line-height:140%;}
#subContWrap h2 {padding-bottom:40px; color:#333; font-size:26px; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial;}
#subContWrap h3 {position:relative; padding:0 0 10px 14px; color:#333; font-size:18px; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial; background:url(../images/bul_h3.png) no-repeat;}
#subContWrap h3 .tRight {position:absolute; top:0; right:0; color:#4b4b4b; font-family:nanumgothic, Malgun Gothic, Dotum, Arial; font-size:14px;}
#subContWrap h4 {display:inline-block; _display:inline; padding-bottom:5px; color:#333; font-size:15px; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial;}

/* 페이지 설명글 */
.intro {margin-bottom:50px; border:1px solid #d8d9e3;}
.introJoin {height:130px; padding-left:240px; background:url(../images/icon_join.png) no-repeat 74px 20px #edeff5;}
.introJoin ul {margin-top:22px;}
.introJoin li {padding:4px 0 4px 8px; background:url(../images/bul_li.png) no-repeat 0 10px;}
.introJoininfo {height:50px; padding:40px 20px 40px 240px; background:url(../images/icon_joininfo.png) no-repeat 74px 20px #edeff5; line-height:180%;}
.introIdpw {height:70px; padding:30px 20px 30px 240px; background:url(../images/icon_idpw.png) no-repeat 74px 20px #edeff5; line-height:180%;}

/* 회원 */
.boxMem {padding:30px 0; background-color:#f9f9f9; border:1px solid #dbdbdb; border-top:3px solid #8a95c6;}
.boxMem table {margin:0 auto;}
.boxMem table th {padding-right:30px;}
.boxMem table td {padding:4px;}
.boxMem .bottom {padding-top:30px; margin:30px 30px 0; border-top:1px solid #E0E0E0; text-align:center;}
.boxMem table p.comment {margin-top:4px; color:#4b4b4b; font-size:13px;}
.boxMem .btnGray {margin-left:4px;}
.boxIdFind {padding:30px 0 30px 220px; background-color:#f9f9f9; border:1px solid #dbdbdb; border-top:3px solid #8a95c6;}

.boxLogin {margin:60px auto; width:410px;}
.boxLogin li {margin:10px 0;}
.boxLogin strong {display:inline-block; *zoom:1; *display:inline; _display:inline; width:80px; font-size:16px; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial;}
.boxLogin input[type=text],input[type=password] {width:190px; height:18px; padding:6px 8px; font-size:16px;}
.boxLogin p {padding-left:84px;}
.btnLogin {float:right; width:110px; height:74px; color:#fff; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial; font-size:16px; font-weight:bold; background-color:#6f7cb3; border:1px solid #626d9e; cursor:pointer;}
.btnLogin:hover {}

.boxTerms {height:270px; padding:15px; border:1px solid #dbdbdb; border-top:3px solid #8a95c6; overflow-y:auto;}
.checkWrap {padding-top:10px; text-align:right;}

.idFind {padding: 5px 0 5px 160px; height:80px; font-size:14px; font-weight:bold; color:#4b4b4b; background:url(../images/icon_idpw.png) no-repeat;}
.idFind p {margin:8px;}
.pwFind {padding: 0px 50px 0px 160px; background:url(../images/icon_idpw.png) no-repeat 0 50%;}
.pwFind li {padding:4px 0 4px 8px; background:url(../images/bul_li.png) no-repeat 0 12px;font-weight:bold; line-height:150%;}
.pwFind p {margin:8px;}

/* 회색Box */
.boxGray {overflow:hidden; padding:14px; margin-bottom:10px; background-color:#f9f9f9; border:1px solid #dbdbdb;}

/* 검색Box */
.boxSearch {overflow:hidden; padding:10px; margin-bottom:10px; background-color:#f9f9f9; border:1px solid #dbdbdb; text-align:center;}
.boxSearch dt {font-weight:bold; color:#666; margin:0 2px 0 8px;}
.boxSearch dt:first-child {margin:0 2px 0 0;}

/* 정렬Box */
.boxArray {overflow:hidden; margin-bottom:10px; text-align:right;}
.boxArray h4 {display:inline-block; *zoom:1; *display:inline; _display:inline; float:left; margin-bottom:0 !important; margin-top:3px;}
.boxArray dt {font-weight:bold; color:#666; margin:0 2px 0 8px;}
.boxArray dt:first-child {margin:0 2px 0 0;}
.boxArray .inline {vertical-align:middle;}

/* 테이블 */
.tableList {width:100%;}
.tableList thead th {padding:10px 2px; background-color:#92a5b9; border:1px solid #758ca3; color:#fff; text-align:center;}
.tableList thead th.thBtn {padding:5px 2px;}
.tableList tbody th {padding:10px 2px; background-color:#fff; border:1px solid #d5d5d5; text-align:center; word-break:break-all; vertical-align:middle;}
.tableList tbody td {padding:10px; background-color:#fff; border:1px solid #d5d5d5; text-align:center; line-height:160%; word-break:break-all; vertical-align:middle;}
.tableList tbody td.tdBtn {padding:8px 10px;}

/* 테이블 - 입력 */
.tableWrite {width:100%; border-top:2px solid #8d949c; border-bottom:1px solid #8d949c;}
.tableWrite thead th {padding:10px 14px; background-color:#f7f8fa; border-top:1px solid #d8dde5;}
.tableWrite tbody th {padding:11px 14px 8px 20px; background-color:#f7f8fa; border-top:1px solid #d8dde5; vertical-align:top;}
.tableWrite tbody td {padding:8px; border-top:1px solid #e8e8e8;}
.tableWrite tbody td .view {padding:10px; line-height:140%; min-height:240px;}
.tableWrite input.msgTitle {font-family:'돋움',Dotum,Arial; font-size:12px;}
.tableWrite textarea.msgCont {font-family:'돋움',Dotum,Arial; font-size:12px;}

/* 버튼 */
.btnGray {display:inline-block; *display:inline; height:16px; padding:4px 10px; background-color:#808A9A; border:1px solid #717A8A; font-size:13px; font-weight:bold; color:#fff; text-align:center; line-height:120% !important; vertical-align:middle;}
.btnGray:hover {background-color:#6C7687; border:1px solid #5D6676; text-decoration:none; color:#fff;}

.btnTh {display:inline-block; *display:inline; height:16px; padding:4px 10px; background-color:#6e8297; border:1px solid #5f7082; font-size:13px; font-weight:bold; color:#fff; text-align:center; line-height:120% !important; vertical-align:middle;}
.btnTh:hover {background-color:#677a8f; border:1px solid #5c6f82; text-decoration:none; color:#fff;}

.btnRed {display:inline-block; *display:inline; height:16px; padding:4px 10px; background-color:#da6351; border:1px solid #c95f4f; font-size:13px; font-weight:bold; color:#fff; text-align:center; line-height:120% !important; vertical-align:middle;}
.btnRed:hover {background-color:#cc5745; border:1px solid #bd4d3c; text-decoration:none; color:#fff;}

.btnSearch {display:inline-block; *display:inline; height:16px; padding:4px 10px 4px 24px; margin:0 1px; background:#da6351 url(../images/icon_search.png) 7px 6px no-repeat; border:1px solid #c95f4f; font-size:13px; font-weight:bold; color:#fff; line-height:120% !important; vertical-align:middle;}
.btnSearch:hover {background-color:#cc5745; border:1px solid #bd4d3c; text-decoration:none; color:#fff;}
.boxSearch strong {margin-right:8px;}
.btnAdd {padding:4px 9px 4px 20px; background-image:url(../images/icon_add.png); background-position:8px 7px; background-repeat:no-repeat;}

.btnCheck {padding:4px 9px 4px 22px; background-image: url(../images/icon_check.png); background-position:7px 7px; background-repeat:no-repeat;}

.btnList {display:inline-block; *display:inline; height:16px; padding:4px 8px; margin:0; background-color:#fafafa; border:1px solid #cfcfcf; font-size:13px; font-weight:bold; color:#666; line-height:120% !important;}
.btnList:hover {background-color:#f1f1f1; border:1px solid #b2b2b2; text-decoration:none !important; color:#444;}

a.btnL {display:inline-block; *zoom:1; *display:inline; _display:inline; margin:0 2px; padding:17px 47px; color:#fff; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial; font-size:16px; font-weight:bold; background-color:#6f7cb3; border-radius:5px;}
a.btnL:hover {background-color:#5f6ba3; text-decoration:none;}

a.btnLGray {display:inline-block; *zoom:1; *display:inline; _display:inline; margin:0 2px; padding:17px 47px; color:#fff; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial; font-size:16px; font-weight:bold; background-color:#7d7f85; border-radius:5px;}
a.btnLGray:hover {background-color:#717378; text-decoration:none;}

.btnLWrap {margin-top:30px; text-align:center;}

.btnBottom {display:inline-block; *zoom:1; *display:inline; padding:7px 18px; background-color:#5b6270; border:1px solid #4d5161; font-size:14px; font-weight:bold; color:#fff;}
.btnBottom:hover {background-color:#4c5360; border:1px solid #343847; text-decoration:none; color:#fff;}
.btnBottomWrap {margin-top:20px; text-align:right;}
.btnBottomWrap .fl {margin-right:3px;}

.icon_down {padding-left:26px; background:url(../images/icon_btn_down.png) no-repeat left;}
.icon_arrow {padding-left:20px; background:url(../images/icon_btn_arrow.png) no-repeat left;}

/* Pager */
.pagerWrap {margin-top:10px; text-align:center;}
.pager {display:inline-block; *zoom:1; *display:inline; _display:inline; overflow:hidden; font-size:12px; font-family:Tahoma !important; line-height:100%;}
.pager a {display:inline-block; *zoom:1; *display:inline; _display:inline; float:left; height:13px; padding:4px 6px; margin:0 2px; color:#999;}
.pager a:hover {color:#666; background-color:#f7f7f7; text-decoration:none;}
.pager strong {display:inline-block; *zoom:1; *display:inline; _display:inline; float:left; padding:4px 6px; color:#f60;}

.pager .btnPager {display:inline-block; *zoom:1; *display:inline; _display:inline; width:21px; height:21px; padding:0 !important; background:url(../images/btn_pager.png) no-repeat; vertical-align:top;}
.pager span.btnPager {text-indent:-9999px; float:left; margin:0 2px;}
.pager a.btnPager span {display:none;}

.pager a.btnFirst {background-position:0 0;}
.pager a.btnFirst:hover {background-position:0 -30px;}
.pager span.btnFirst {background-position:0 -60px;}

.pager a.btnPrev {background-position:-30px 0;}
.pager a.btnPrev:hover {background-position:-30px -30px;}
.pager span.btnPrev {background-position:-30px -60px;}

.pager a.btnNext {background-position:-60px 0;}
.pager a.btnNext:hover {background-position:-60px -30px;}
.pager span.btnNext {background-position:-60px -60px;}

.pager a.btnLast {background-position:-90px 0;}
.pager a.btnLast:hover {background-position:-90px -30px;}
.pager span.btnLast {background-position:-90px -60px;}

/* List */
.list li {padding-left:11px; margin:6px 0; background:url(../images/bul_li.png) no-repeat 2px 8px;}
ol li {margin:5px 0;}

/* Footer */
#footerWrap {background-color:#797e83;}
#footer {width:980px; padding:35px 0; margin:0 auto; color:#fff; font-size:12px; line-height:140%;}
#footer .footMenu {margin-bottom:20px;}
#footer .footMenu li {display:inline-block; *zoom:1; *display:inline; padding:0 16px; border-left:1px solid #a4a7aa; font-size:14px; font-weight:bold;}
#footer .footMenu li:first-child {padding-left:0; border-left:none;}
#footer .footMenu li a {color:#fff;}
#footer p {margin-bottom:0;}
#footer .name {font-size:14px; margin-bottom:8px;}
#footer a {color:#fff;}
#footer .bar {color:#a4a7aa; padding:0 8px;}

/* 정렬 */
.tLeft {text-align:left !important;}
.tCenter {text-align:center !important;}
.tRight {text-align:right !important;}
.fl {float:left;}
.fr {float:right;}
.inline {display:inline-block; *zoom:1; *display:inline; _display:inline;}

/* margin */
.mt05 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt20 {margin-top:20px !important;}
.mt30 {margin-top:30px !important;}

.mr05 {margin-right:5px !important;}
.mr10 {margin-right:10px !important;}
.mr15 {margin-right:15px !important;}
.mr20 {margin-right:20px !important;}

.ml05 {margin-left:5px !important;}
.ml10 {margin-left:10px !important;}

.mb0 {margin-bottom:0px !important;}
.mb05 {margin-bottom:05px !important;}
.mb10 {margin-bottom:10px !important;}
.mb15 {margin-bottom:15px !important;}
.mb20 {margin-bottom:20px !important;}
.mb30 {margin-bottom:30px !important;}
.mb50 {margin-bottom:50px !important;}
.mb70 {margin-bottom:70px !important;}

.imgCom {height:160px; margin-bottom:50px; background:url(../images/img_company.png) no-repeat; text-indent:-9999px;}
.noemail {padding:70px 0 70px 330px; margin-bottom:150px; background:url(../images/icon_noemail.png) no-repeat 90px 74px #f9f9f9; border:1px solid #dbdbdb; font-size:16px; line-height:190%;}

/* 텍스트 */
.f12 {font-size:12px !important;}
.f13 {font-size:13px !important;}
.fb {font-weight:bold;}
.cb {color:#06c !important;}
.cr {color:#c33 !important;}

/* Popup */
#popHead {position:relative; height:54px; background-color:#55658d;}
#popHead h2 {display:inline-block; *zoom:1; *display:inline; margin:14px 0 0 20px; font-size:20px; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial; color:#fff;}
#popHead a.close {display:block; position:absolute; top:0; right:0; width:54px; height:54px; background:url(../images/btn_pop_close.png) no-repeat 19px 19px; text-indent:-9999px;}
#popHead a.close:hover {background-color:#405276;}
#popBody {padding:30px; overflow-y:hidden; line-height:140%;}

#popBody h3 {padding-left:14px; margin-bottom:16px; background:url(../images/bul_h3.png) no-repeat; color:#333; font-size:18px; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial; line-height:120%;}
#popBody h4 {display:inline-block; *zoom:1; *display:inline; _display:inline; margin-bottom:8px; color:#333; font-size:15px; font-family:nanumbarungothic, Malgun Gothic, Dotum, Arial;}
#popBody .btnL {padding:13px 40px;}
#popBody .btnLGray {padding:13px 40px;}

.screen {position:fixed; top:0; left:0; width:100%; height:100%; background:url(../images/bg_screen.png); z-index:1000;}

.layerSending {position:fixed; top:50%; left:50%; width:400px; height:160px; margin-left:-200px; margin-top:-80px; background-color:#fff; cursor:wait; z-index:1001;}
.layerSending p {margin-top:54px; color:#333; font-size:20px; font-weight:bold; text-align:center;}
.layerSending span {margin-left:20px;}
