@charset "utf-8";


html, body {position:relative; width:100%; height:100%; margin:0; padding:0; background:#101010; vertical-align:top;  word-break:keep-all; scroll-behavior: smooth; }
body {max-width:100%; min-width:280px; margin:0 auto; font-family:'Pretendard', sans-serif; font-size:15px; line-height:1.6; color:#ccc; font-weight:300; letter-spacing:0.5px; -webkit-text-size-adjust:100%; overflow-x:hidden;}
*,::after,::before { box-sizing:border-box;}


div, dl,dt,dd,ul,ol,li,pre,form,fieldset,input,button,select,textarea,p,blockquote,address,th,td {margin:0; padding:0; vertical-align:top; font-size:15px;  }

@media (max-width: 801px) {  
	div, dl,dt,dd,ul,ol,li,pre,form,fieldset,input,button,select,textarea,p,blockquote,address,th,td {margin:0; padding:0; vertical-align:top;}
}


html,body, header,nav,section,article,footer, aside, address, div, dl, dt, dd, ul, ol, li, pre, form, fieldset, input, button, select, textarea, p, blockquote, address, table, tbody, thead, th, td, 
details, figcaption, figure, hgroup, h1,h2,h3,h4,h5,h6,a, span, strong,b, i,em {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}


/*------------------------------------------------------------------------------
Reset
------------------------------------------------------------------------------*/

div, p, th, td, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, button, select, textarea, blockquote{ padding:0; margin:0;}
form, fieldset, button	{ border:none;}
button { cursor:pointer; background:transparent;}
hr, button img	{ display:none;}
ul, dl, ol, li, dt, dd { list-style:none}
ul:after, dl:after, ol::after { content:""; clear:both; display:block;}
caption	{ display:none}
img {border:0;}
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section { display:block}
address, em	{ font-weight:400; font-style:normal}
hr { display:none;height:0; border:0; margin:0; padding:0;}
blockquote, q{ quotes:none;}
blockquote::before, blockquote::after, q::before, q::after{ content:''; content:none;}
legend, caption, .invisible{ width:0; height:0; padding:0; font-size:0; line-height:0; overflow:hidden; position:absolute; visibility:hidden}
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); white-space:nowrap; border:0;}
.sr-only-focusable:active, .sr-only-focusable:focus { position:static; width:auto; height:auto; overflow:visible; clip:auto; white-space:normal;}

h1, h2, h3, h4, h5, h6, strong	{ line-height:1; font-weight:500}

table { width:100%;  border-collapse:collapse; border-spacing:0;}
i{ font-style:normal;}
a {display:inline-block;color:#ccc;}
a:link, a:visited { text-decoration:none; }
a:hover {cursor:pointer; color:#fff;}
a:hover, a:focus, a:active { text-decoration:none;}
a:focus, img:focus, input:focus, button:focus { outline:0;}

form {width:100%;}
input, select { -webkit-appearance:none; -moz-appearance:none; -o-appearance:none; appearance:none; -webkit-border-radius:0; -moz-border-radius:0; -o-border-radius:0; border-radius:0; -webkit-box-shadow:none; -moz-box-shadow:none; -o-box-shadow:none}
select::-ms-expand { display:none}
textarea { -webkit-border-radius:0; -moz-border-radius:0; -o-border-radius:0; border-radius:0; -webkit-box-shadow:none; -moz-box-shadow:none; -o-box-shadow:none}

input, textarea, select {}
input[type=radio],input[type=checkbox],input[type=image]{ padding:0; height:auto;}
input[type=file]{ height:28px; background-color:#FFFFFF;}
input[type=button]{ }
input[type=checkbox], input[type=radio], input[type=text]	{ vertical-align:middle}

input[type=password]::-ms-clear, 
input[type=password]::-ms-reveal, 
input[type=text]::-ms-clear, 
input[type=text]::-ms-reveal { display:none; width:0; height:0}


.placeholder { color:#999;}
input::placeholder {color:#999; font-weight:400; opacity: 1}
input::-webkit-input-placeholder{color:#999; font-weight:400;} 
input:-ms-input-placeholder {color:#999; font-weight:400;}
input:-mos-input-placeholder {color:#999; font-weight:400;}

textarea {overflow:auto; vertical-align:top; resize:vertical;  }
textarea::placeholder {color:#999 !important; font-weight:400; opacity: 1}
textarea::-webkit-input-placeholder {color:#999 !important; font-weight:400;} 
textarea:-ms-input-placeholder {color:#999 !important; font-weight:400;}
textarea:-mos-input-placeholder{color:#999 !important; font-weight:400;}


/* input */
.input {width:100%; display:block; line-height:59px; height:60px; border:1px solid #dbdbdb; color:#1e1e1e; padding:0 20px; border-radius: 8px;}
.editToken .input { border:1px solid #999;}
input[type=email]:focus,
input[type=text]:focus,
input[type=password]:focus , .input:focus ,.editToken .input:focus {border:1px solid #2936d6 ;animation:opac_one 0.5s;  }
.input1 {width:100%; display:block; line-height:55px; height:56px; border:1px solid #dbdbdb; border-radius: 8px; color:#1e1e1e; padding:0 20px; }
.input1:focus {border:1px solid #2936d6 ; animation:opac_one 0.5s;  }
input.off {background:#ededed !important;border:1px solid #999 !important;}
input.off:focus {background:#ededed !important; border:1px solid #2936d6  !important; animation:opac_one 0s;  } 
.txt_on {border:1px solid #999 !important;}

@media all and (max-width:991px){
.input {line-height:55px; height:56px;}
}

@media all and (max-width:767px){
.input,.input1 {line-height:49px; height:50px;}
}


.filebox {position:relative; width:100%;max-width:100%;   }
.filebox input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;  } 
.filebox label {position:absolute; top:0; right:0;width:60px; line-height:59px; height:60px; display: inline-block; padding:0; color: #999; font-size: inherit; line-height: normal; vertical-align: middle; cursor: pointer; border: 1px solid #999; background:#fafafa url(/assets/img/contents/icon_file_plus.svg) no-repeat center 50%; background-size:17.5px; }
.filebox label:hover { border: 1px solid #2936d6 ; background:#fafafa url(/assets/img/contents/icon_file_plus_on.svg) no-repeat center 50%; background-size:17.5px; }
.filebox label span {font-size:0;}

/* named upload */ 
.filebox input.upload-name { width:100%; max-width:100%;  display: inline-block; line-height:59px; height:60px; padding:0 60px 0 20px; font-size: inherit; font-family: inherit; line-height: normal; vertical-align: middle; border: 1px solid #dbdbdb; border-right:none;  -webkit-appearance: none; -moz-appearance: none; appearance: none; color:#1e1e1e; background:#fff;}
.editToken .filebox input.upload-name {border: 1px solid #999; border-right:none;} 

@media all and (max-width:991px){
	.filebox label{width:55px; line-height:55px; height:56px;}
	.filebox input.upload-name {line-height:55px; height:56px;}
}

@media all and (max-width:767px){
	.filebox label {width:50px; min-width:50px;line-height:49px; height:50px;}
	.filebox input.upload-name {line-height:49px; height:50px;}
}


.textarea {width:100%;height:137px; border: solid 1px #dbdbdb; padding:20px; border-radius:0;}
.textarea:hover,
.textarea:focus,
.textarea:active {border-radius:0; border: solid 1px #2936d6 ;}


/*------------------------------------------------------------------------------
Common
------------------------------------------------------------------------------*/

.bb1 { margin:0 10px 0 0 !important;}
.bb2 {margin:0 0 0 10px !important;}

@media all and (max-width:400px){
    .bb1{ margin:0 7px 0 0 !important;}
	.bb2 {margin:0 0 0 7px !important;}
}


/* Font-Family */
.roboto { font-family:'Roboto' !important;}


/* Font-Weight */
.bold4 { font-weight:400 !important;}
.bold5 { font-weight:500 !important;}
.bold6 { font-weight:600 !important;}
.bold7 { font-weight:700 !important;}
.bold8 { font-weight:800 !important;}
.bold9 { font-weight:900 !important;}
.normal { font-weight:normal !important;}

.wbb {word-break:break-all !important;}
.wbk {word-break:keep-all !important;}

/* 좌우 */
.f-left { float:left !important;}
.f-right { float:right !important;}
.f-none { float:none !important;}
.clear { clear:both !important;}
.clearfix::after { display:block; clear:both; content:""}
.t-left { text-align:left !important;}
.t-center { text-align:center !important;}
.t-right { text-align:right !important;}
.v-middle { vertical-align:middle !important;}

.hand { cursor:pointer}
.underline { text-decoration:underline !important;}


/* Position  */
.p-rel { position:relative !important;}
.fixed { position:fixed !important;}


/* Display */
.d-none { display:none !important;}
.d-block { display:block !important;}
.d-inline { display:inline !important;}
.d-inblock { display:inline-block !important;}
.d-tr { display:table-row !important;}


/* Flex */
.d-flex { display:flex !important;}
.ai-center { align-items:center !important;}
.jc-center { justify-content:center !important;}
.flex1 { flex:1}


/* Line-Height */
.lh18 { line-height:18px !important;}
.lh20 { line-height:20px !important;}
.lh24 { line-height:24px !important;}
.lh30 { line-height:30px !important;}


/* Letter-Spacing */
.ls-0 { letter-spacing:0 !important;}
.ls--05 { letter-spacing:-0.5px !important;}
.ls--1 { letter-spacing:-1px !important;}
.ls--2 { letter-spacing:-2px !important;}


/* font-size */
.fs11	{ font-size:11px !important;}
.fs12	{ font-size:12px !important;}
.fs13	{ font-size:13px !important;}
.fs14	{ font-size:14px !important;}
.fs15	{ font-size:15px !important;}
.fs16	{ font-size:16px !important;}
.fs17	{ font-size:17px !important;}
.fs18	{ font-size:18px !important;}
.fs19	{ font-size:19px !important;}
.fs20	{ font-size:20px !important;}
.fs22	{ font-size:22px !important;}
.fs24	{ font-size:24px !important;}

/* border */
.bl-0 { border-left:0 !important;}
.br-0 { border-right:0 !important;}

/* Color */
.co_b  { color:#3471ff !important;}
.co_dg { color:#0a0a0a !important;}
.co_g { color:#1e1e1e !important;}
.co_r { color:#f16840  !important;}
.dis, .dis:hover { color:#dbdbdb !important;}


/* Width */
.w-auto { width:auto !important;}
.w15p { width:15% !important;}
.w20p { width:20% !important;}
.w25p { width:25% !important;}
.w30p { width:30% !important;}
.w40p { width:40% !important;}
.w48p { width:48% !important;}
.w49p { width:49% !important;}
.w50p { width:50% !important;}
.w52p { width:52% !important;}
.w55p { width:55% !important;}
.w56p { width:56% !important;}
.w57p { width:57% !important;}
.w60p { width:60% !important;}
.w70p { width:70% !important;}
.w80p { width:80% !important;}
.w85p { width:85% !important;}
.w86p { width:86% !important;}
.w87p { width:87% !important;}
.w90p { width:90% !important;}
.w91p { width:91% !important;}
.w92p { width:92% !important;}
.w93p { width:93% !important;}
.w95p { width:95% !important;}
.w96p { width:96% !important;}
.w97p { width:97% !important;}
.w98p { width:98% !important;}
.w99p { width:99% !important;}
.w100p { width:100% !important;}
.w440 { width:440px !important;}
.w500 { width:500px !important;}
.w1300 { width:1300px !important;}

 /* Height */
.h-auto { height:auto !important;}
.h100p { height:100% !important;}
.h100v { height:100vh !important;}

/* Padding */
.p0{ padding:0 !important;}
.p3{ padding:3px !important;}
.p5{ padding:5px !important;}
.p10{ padding:10px !important;}
.p15{ padding:15px !important;}
.p20{ padding:20px !important;}
.p30{ padding:30px !important;}
.p40{ padding:40px !important;}
.p50{ padding:50px !important;}

.pt0{ padding-top:0 !important;}
.pt3{ padding-top:3px !important;}
.pt5{ padding-top:5px !important;}
.pt7{ padding-top:7px !important;}
.pt10{ padding-top:10px !important;}
.pt15{ padding-top:15px !important;}
.pt20{ padding-top:20px !important;}
.pt25{ padding-top:25px !important;}
.pt30{ padding-top:30px !important;}
.pt40{ padding-top:40px !important;}
.pt50{ padding-top:50px !important;}

.pr0{ padding-right:0 !important;}
.pr3{ padding-right:3px !important;}
.pr5{ padding-right:5px !important;}
.pr7{ padding-right:7px !important;}
.pr10{ padding-right:10px !important;}
.pr15{ padding-right:15px !important;}
.pr20{ padding-right:20px !important;}
.pr30{ padding-right:30px !important;}
.pr40{ padding-right:40px !important;}
.pr45{ padding-right:45px !important;}
.pr50{ padding-right:50px !important;}

.pb0{ padding-bottom:0 !important;}
.pb3{ padding-bottom:3px !important;}
.pb5{ padding-bottom:5px !important;}
.pb7{ padding-bottom:7px !important;}
.pb10{ padding-bottom:10px !important;}
.pb15{ padding-bottom:15px !important;}
.pb20{ padding-bottom:20px !important;}
.pb25{ padding-bottom:25px !important;}
.pb30{ padding-bottom:30px !important;}
.pb40{ padding-bottom:40px !important;}
.pb50{ padding-bottom:50px !important;}

.pl0{ padding-left:0 !important;}
.pl3{ padding-left:3px !important;}
.pl5{ padding-left:5px !important;}
.pl7{ padding-left:7px !important;}
.pl10{ padding-left:10px !important;}
.pl15{ padding-left:15px !important;}
.pl20{ padding-left:20px !important;}
.pl30{ padding-left:30px !important;}
.pl40{ padding-left:40px !important;}
.pl50{ padding-left:50px !important;}


/* Margin */
.m-auto { margin-left:auto; margin-right:auto}
.m0{ margin:0 !important;}
.m3{ margin:3px !important;}
.m5{ margin:5px !important;}
.m10{ margin:10px !important;}
.m20{ margin:20px !important;}
.m30{ margin:30px !important;}
.m40{ margin:40px !important;}
.m50{ margin:50px !important;}

.mt0 { margin-top:0px !important;}
.mt1 { margin-top:1px !important;}
.mt2 { margin-top:2px !important;}
.mt3 { margin-top:3px !important;}
.mt5 { margin-top:5px !important;}
.mt8 { margin-top:8px !important;}
.mt10 { margin-top:10px !important;}
.mt12 { margin-top:12px !important;}
.mt15 { margin-top:15px !important;}
.mt20 { margin-top:20px !important;}
.mt22 { margin-top:22px !important;}
.mt23 { margin-top:23px !important;}
.mt25 { margin-top:25px !important;}
.mt30 { margin-top:30px !important;}
.mt35 { margin-top:35px !important;}
.mt40 { margin-top:40px !important;}
.mt50 { margin-top:50px !important;}

.ml-auto { margin-left:auto !important;}
.ml0{ margin-left:0 !important;}
.ml2{ margin-left:2px !important;}
.ml3{ margin-left:3px !important;}
.ml5{ margin-left:5px !important;}
.ml7{ margin-left:7px !important;}
.ml10{ margin-left:10px !important;}
.ml15{ margin-left:15px !important;}
.ml20{ margin-left:20px !important;}
.ml30{ margin-left:30px !important;}
.ml33{ margin-left:33px !important;}
.ml40{ margin-left:40px !important;}
.ml50{ margin-left:50px !important;}
.ml55{ margin-left:55px !important;}
.ml60{ margin-left:60px !important;}
.ml80{ margin-left:80px !important;}
.ml100{ margin-left:100px !important;}
.ml150{ margin-left:150px !important;}
.ml190{ margin-left:190px !important;}

.mr0{ margin-right:0 !important;}
.mr1{ margin-right:1px !important;}
.mr3{ margin-right:3px !important;}
.mr5{ margin-right:5px !important;}
.mr6{ margin-right:6px !important;}
.mr7{ margin-right:7px !important;}
.mr8{ margin-right:8px !important;}
.mr10{ margin-right:10px !important;}
.mr15{ margin-right:15px !important;}
.mr27{ margin-right:27px !important;}
.mr20{ margin-right:20px !important;}
.mr30{ margin-right:30px !important;}
.mr40{ margin-right:40px !important;}
.mr50{ margin-right:50px !important;}
.mr60{ margin-right:60px !important;}
.mr43{ margin-right:43px !important;}

.mb0{ margin-bottom:0 !important;}
.mb3{ margin-bottom:3px !important;}
.mb5{ margin-bottom:5px !important;}
.mb7{ margin-bottom:7px !important;}
.mb10{ margin-bottom:10px !important;}
.mb12{ margin-bottom:12px !important;}
.mb13{ margin-bottom:13px !important;}
.mb15{ margin-bottom:15px !important;}
.mb17{ margin-bottom:17px !important;}
.mb20{ margin-bottom:20px !important;}
.mb25{ margin-bottom:25px !important;}
.mb30{ margin-bottom:30px !important;}
.mb40{ margin-bottom:40px !important;}
.mb50{ margin-bottom:50px !important;}
.mb60{ margin-bottom:60px !important;}
.mb70{ margin-bottom:70px !important;}
.mb80{ margin-bottom:80px !important;}
.mb100{ margin-bottom:100px !important;}



.block_max1100 {display:none !important;}
.block_max1000 {display:none !important;}
.block_max600 {display:none !important;}
.block_max400 {display:none !important;}

@media all and (max-width:1100px){
	.block_max1100 {display:block !important;}
}

@media all and (max-width:1000px){
	.block_max1000 {display:block !important;}
}

@media all and (max-width:600px){
	.block_max600 {display:block !important;}
}


@media all and (max-width:400px){
	.block_max400 {display:block !important;}
}
