@charset "utf-8";

/**
* =================================================================================
* INFORMATION
* ---------------------------------------------------------------------------------
* @Author : Kim, Kyu, Jung (kyujung83@naver.com)
* @File Name : common.css
* @Description : Style Sheet
* @Version : 1.0
* @Create Date : 2015-04-23
* @Update Date : N/A
* @History : N/A
* =================================================================================
*/


/* drag color Reset
----------------------------------------------------------------------------------------------------*/

/*
::selection {
    background:#7bdad4;
    color: #FFF;
    text-shadow: none;
}
::-moz-selection {
    background:#7bdad4;
    color: #FFF;
    text-shadow: none;
}
::-webkit-selection {
    background:#7bdad4;
    color: #FFF;
    text-shadow: none;
}
*/

/* `XHTML, HTML4, HTML5 Reset
----------------------------------------------------------------------------------------------------*/

a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
dialog,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
font,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
hr,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
meter,
nav,
object,
ol,
output,
p,
pre,
progress,
q,
rp,
rt,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
textarea,
u,
ul,
var,
video,
xmp {
    border: 0;
    margin: 0;
    padding: 0;
    font-size: 100%;
    font-family: "NanumSquare", "Nanum gothic",arial, dotum, "돋움";
}

body, * {
    -webkit-text-size-adjust: none;
    font-size: 12px;
}

html,
body {
    height: 100%;
}

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

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
/*
  Override the default (display: inline) for
  browsers that do not recognize HTML5 tags.

  IE8 (and lower) requires a shiv:
  http://ejohn.org/blog/html5-shiv
*/
    display: block;
}

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

b,
strong {
/*
  Makes browsers agree.
  IE + Opera = font-weight: bold.
  Gecko + WebKit = font-weight: bolder.
*/
    font-weight: bold;
}

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

img {
    color: transparent;
    font-size: 0;
    vertical-align: middle;
    /*
    For IE.
    http://css-tricks.com/ie-fix-bicubic-scaling-for-images
    */
    -ms-interpolation-mode: bicubic;
}

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

li {
/*
  For IE6 + IE7.
*/
    display: list-item;
    list-style: none;
}

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

table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}

th,
td,
caption {
    font-weight: normal;
    text-align: left;
}

caption {
    /*display: none;*/
}

q {
    quotes: none;
}

q:before,
q:after {
    content: '';
    content: none;
}

sub,
sup,
small {
    font-size: 75%;
}

sub,
sup {
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

svg {
/*
  For IE9.
*/
    overflow: hidden;
}


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

a:link, a:visited {
    color: #2f2e2e;
    text-decoration: none;
}

a:active, a:hover {
    color: #2f2e2e;
    text-decoration: none;
}

input[type="button"], input[type="submit"], input[type="reset"] {
    -webkit-appearance: none;
    cursor:pointer;
}

/* *:focus { outline:none;}*/

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

form {
    margin: 0px;
    padding: 0px;
}

legend {
    display: none;
}

fieldset {
    border: 0 none;
    margin: 0px;
    padding: 0px;
}

input {
    font-size: 100%;
    vertical-align: middle;
}

select {
    font-size: 100%;
    vertical-align: middle;
    border: 1px solid #e4e4e4;
    padding: 1px 0;
    font-family: "NanumSquare","Nanum gothic" arial, dotum, "돋움";
}

textarea {
    font-size: 100%;
    padding: 0;
    border: 1px solid #696969;
}


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

address, caption, cite, code, dfn, em, th, var {
    font-style : normal;
    font-weight : normal;
}
.cursor{cursor:pointer;}

.txtcolor_blue {color: blue !important;}
.txtcolor_red {color: red !important;}
.txtcolor_white {color:#ffffff !important;}

.txtc { text-align:center !important;}
.txtl { text-align:left !important;}
.txtr { text-align:right !important;}

.vtaTop { vertical-align:top !important;}

.mg0    { margin: 0 !important;}
.mg5    { margin-left: 5px !important;}

.mgl20  { margin-left: 20px !important;}

.mgt-5  { margin-top: -5px !important;}
.mgt-10 { margin-top: -10px !important;}
.mgt0   { margin-top: 0px !important;}
.mgt10  { margin-top: 10px !important;}

.mgb8   { margin-bottom: 8px !important;}
.mgb20  { margin-bottom: 20px !important;}
.mgb23  { margin-bottom: 23px !important;}
.mgb50  { margin-bottom: 50px !important;}

.pdb0 {padding-bottom: 0px !important;}
.pdb10 {padding-bottom: 10px !important;} 
.pdb20 {padding-bottom: 20px !important;}
.pdb30 {padding-bottom: 30px !important;}
.pdl0 {padding-left: 0px !important;}
.pdl20 {padding-left: 20px !important;}
.pdt0 {padding-top: 0px !important;}
.pdt10 {padding-top: 10px !important;}
.pdt20 {padding-top: 20px !important;}

.pdtb0{padding: 0 !important;}
.pdtb5{padding: 5px !important;}
.pdtb7{padding: 7px 0 !important;}
.pdtb11{padding: 11px 0 !important;}

.w15 {width:15px !important;}
.w50 {width:50px !important;}
.w60 {width:60px !important;}
.w70 {width:70px !important;}
.w80 {width:80px !important;}
.w90 {width:90px !important;}
.w100 {width:100px !important;}
.w110 {width:110px !important;}
.w120 {width:120px !important;}
.w136 {width:136px !important;}
.w150 {width:150px !important;}
.w185 {width:185px !important;}
.w450 {width:450px !important;}
.w33p {width:33% !important;}
.w48p {width:48% !important;}
.w50p {width:50% !important;}
.w87p {width:87% !important;}
.w95p {width:95% !important;}
.w100p {width:100% !important;}

.h35 {height:35px !important;}
.h45 {height:45px !important;}
.lh20 {line-height:20px !important;}
.lh30 {line-height:30px !important;}


.clear_left {clear:left !important;}
.clear_right {clear:right !important;}
.clear_both {clear:both !important;}

.float_left {float:left !important;}
.float_right {float:right !important;}

span.midline {text-decoration:line-through;}
span.red {color:red;}

.lineH13{line-height:1.3 !important;}

.sat{color:#143d8d !important; font-weight:600}
.sun{color:#e87a04 !important; font-weight:600}

/* table tab */
.adminTableTab {clear:both; width:100%; padding-top:10px;}
.adminTableTab li {float:left; margin-right:3px;}
.adminTableTab li a {display:inline-block; font-size:11pt; background:#dbdbdb; padding:13px 40px 5px 40px; border-radius:8px 8px 0 0; color:#303030;}
.adminTableTab li.on a {display:inline-block; font-size:11pt; background:#8f8f8f; padding:13px 40px 5px 40px; border-radius:8px 8px 0 0; color:#fff;}
.adminTableTab li a:hover {display:inline-block; font-size:11pt; background:#8f8f8f; padding:13px 40px 5px 40px; border-radius:8px 8px 0 0; color:#fff;}


.previewContainer { clear: both; margin: 0 auto; padding: 0;  }
.previewContainer .left_side { float:left; width: 20%; }
.previewContainer .mediaFrame { float:right; width: 80%;  }

.opacity07{opacity:0.7 !important;}
.borderTop1{border-top:1px #cccccc solid !important;}
.borderbottom1{border-bottom:0 !important;}
.select_option{padding:7px;width:150px;border:1px solid #e4e4e4;}


.layerPopup{
  position: fixed;
    width: 32%;
    height: 13%;
    left: 54%;
    margin-left: -20%; /* half of width */
    height: 270px;
    top: 35%;
    margin-top: -40px; /* half of height */
    overflow: auto;
    font-size: 13px;
    border: 2px solid #4a8fe4;
    background-color: #FFFFFF;
    padding: 1em;
    box-sizing: border-box;
}

.layerPopup button{
  cursor:pointer;
  z-index: 999;
}

.styled {
    border: 0;
    line-height: 1.5;
    padding: 5px 15px 25px;
    font-size: 0.8rem;
    text-align: center;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    border-radius: 10px;
/*     background-color: rgba(219, 199, 199, 1); */
    background-color: rgba(65, 105, 225, 1);
    background-image: linear-gradient(to top left,
                                      rgba(0, 0, 0, .2),
                                      rgba(0, 0, 0, .2) 30%,
                                      rgba(0, 0, 0, 0));
    box-shadow: inset 2px 2px 3px rgba(255, 255, 255, .6),
                inset -2px -2px 3px rgba(0, 0, 0, .6);
}

.styled:hover {
    background-color: rgba(211, 160, 211, 1);
}

.styled:active {
    box-shadow: inset -2px -2px 3px rgba(255, 255, 255, .6),
                inset 2px 2px 3px rgba(0, 0, 0, .6);
}

.keyboardcss {
	float: right; 
	font-size: 13px; 
	margin-top: 10px; 	
}