@charset "utf-8";
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/variable/pretendardvariable.css');

/* reset */
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, 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,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; /* font: inherit; */ vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul, li {list-style: none;}
a, address {text-decoration: none;color: inherit; font-style: normal;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}

/* 공통 */
html, body {height: 100%; font-family: 'Noto Sans KR', sans-serif;}
body {overflow-y: scroll;}
.wrap {height: 100%;}
table tr td {vertical-align: middle;}
table tr td a {width: 100%; display: block;}
input:active, input:focus, a:active, a:focus, button:focus, button:active, select:active, select:focus, textarea:active, textarea:focus {outline: none;}
button, input, textarea, pre, select {font-family: 'Noto Sans KR', sans-serif;}
button {cursor: pointer;}

/* 숨기기 */
.hidden {display: none!important; opacity: 0!important;}
.scrolllock {overflow: hidden;}

.wd-100 {width: 100%!important;}
.wd-90 {width: 90%!important;}
.wd-80 {width: 80%!important;}
.wd-70 {width: 70%!important;}
.wd-60 {width: 60%!important;}
.wd-50 {width: 50%!important;}
.wd-40 {width: 40%!important;}
.wd-30 {width: 30%!important;}
.wd-20 {width: 20%!important;}
.wd-10 {width: 10%!important;}

/* 정렬 */
.con {max-width: 1350px; margin: 0 auto;}
.align-left {text-align: left!important;}
.align-right {text-align: right!important;}
.align-center {text-align: center!important;}

.f-left {float: left!important;}
.f-right {float: right!important;}
.clear::after {content: ''; display: block; clear: both;}

.v-top {vertical-align: top!important;}
.v-mid {vertical-align: middle!important;}
.v-bot {vertical-align: bottom!important;}

.pr {position: relative!important;}
.pa {position: absolute!important;}
.pf {position: fixed!important}

.overflow-hid {overflow: hidden!important;}
.overflow-auto {overflow: auto!important;}

/* 텍스트 굵기 */
.bold {font-weight: bold!important;}
.normal {font-weight: normal;}
.fw3 {font-weight: 300!important;}
.fw5 {font-weight: 500!important;}

.star {color: #f70303; vertical-align: text-top; display: inline-block; margin-right: 4px;}

/* 미리보기 */
.phone-con-area { position: relative; width: calc(100% + 10px); padding-right: 7px; max-height: calc(100% - 110px); box-sizing: border-box; overflow-y: auto; }
.ad-title { padding-bottom: 10px; }
.free-url { padding-top: 5px; }
.free-reject { padding-top: 10px; }
.preview-con .none-text { color: #999; font-weight: 300; font-size: 13px;}
.preview-con { position: relative; width: 100%; background-color: #f2f2f2; border-radius: 10px; padding: 20px; box-sizing: border-box; line-height: 1.5; font-size: 15px; font-weight: 400; letter-spacing: -0.5px; margin: 0 0 20px 0; word-break: break-all; color: #555;}
.preview-con pre { white-space: pre-wrap; word-wrap: break-word;}
.preview-con p { word-break: break-all; }

/* 테스트 발송 미리보기 */
.test-phone-con-area { position: relative; width: calc(100% + 10px); padding-right: 7px; max-height: calc(100% - 110px); box-sizing: border-box; overflow-y: auto; margin-left: 13px;}
.test-ad-title { padding-bottom: 10px; }
.test-free-reject { padding-top: 10px; }
.test-preview-con .none-text { color: #999; font-weight: 300; font-size: 13px;}
.test-preview-con { position: relative; width: 100%; background-color: #f2f2f2; border-radius: 10px; padding: 20px; box-sizing: border-box; line-height: 1.5; font-size: 15px; font-weight: 400; letter-spacing: -0.5px; margin: 0 0 20px 0; word-break: break-all; color: #555; }
.test-preview-con pre { white-space: pre-wrap; word-wrap: break-word;}
.test-preview-con p { word-break: break-all; }

@media all and (max-width:1024px) {
    /* 정렬 */
    .con {max-width: 960px;}
}

@media all and (max-width:768px) {
    
}

@media all and (max-width:568px) {
    
}

@media all and (max-width:320px) {
    
}