@charset "utf-8";
@font-face {
    font-family: 'Nanum Gothic';
    font-style: normal;
    font-weight: 400;
    src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot);
    src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
         url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff2) format('woff2'),
         url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff) format('woff'),
         url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.ttf) format('truetype');
}

.removeFixed{position: relative!important;}
.tooltip { white-space:nowrap; }
html,body { height:100%;}
body {
	margin:0;
	padding:0;
    font-size:13px;
    font-family: 'Open sans','Nanum Gothic', 'Tahoma', 'Verdana', 'Arial', 'Trebuchet MS';
	line-height: 180%;
	color:#3f3f3f;
	height:100%;
	width:100%;
	overflow: hidden;
	outline: 0;
    -webkit-font-smoothing: antialiased;
    -webkit-animation-delay: 0.1s;
    -webkit-animation-name: fontfix;
    -webkit-animation-duration: 0.1s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-touch-callout: none !important;	
}
body.overflow {
    overflow: auto;
}
body.overflow-hidden { 
    overflow: hidden;
}
body.view-mode {
    overflow: auto;
}
@-webkit-keyframes fontfix {
    from { opacity: 1; }
    to   { opacity: 1; }
}
*:focus {
    outline: 0 !important;
}
.blank { font-weight: bold; color:#4789E7; margin:0px 5px;}
span.normal { font-weight: 400; }
#kcaptcha { cursor:pointer; }
label.error { display:block; clear:both; color:#FF0000; font-size:12px; font-weight: 400; } /* jvalid */
.ed { border:1px solid #CCCCCC; padding:5px; background:#fff; } /* input */
.txt { border:1px solid #CCCCCC; padding:5px; width:120px;} /* input */
.tx { border:1px solid #CCCCCC; padding:5px; font-size:12px; } /* textarea */
.tleft { text-align:left; }
.tright { text-align:right; }
.tcenter { text-align:center; }
.hide { display:none; }
.border { border:1px solid #DDDDDD; }
.border-top { border-top:1px solid #DDDDDD; }
.b { font-weight:bold; }
.red { color:#CC0000; }
a.white, a.white:hover { color:#fff; }
.clear { clear:both } 
.ee { background:#eee;}
.f8 { background:#f0f0f0;}
.b-cc { background:#D4D4D4;}
.b-99 { background:#999; }
.small {font-size:11px; color:#5D5D5D; font-weight:normal;}
.normal { font-weight:normal; }
.f-left { float:left }
.f-right { float:right }
.grey { color:silver; }
.hidden { display:none; }
.b-black { background:#000; }
.m2t { margin-top:2px; }
.m3b { margin-bottom:3px; }
.m3l { margin-left:3px; }
.m3r { margin-right:3px; }
.m3t { margin-top:3px; }
.m5b { margin-bottom:5px; }
.m5l { margin-left:5px; }
.m5r { margin-right:5px; }
.m5t { margin-top:5px; }
.m10 { margin:10px; }
.m10t { margin-top:10px; }
.m15t { margin-top:15px; }
.m20t { margin-top:20px; }
.m50t { margin-top:50px; }
.m10b { margin-bottom:10px; }
.m20b { margin-bottom:20px; }
.m50b { margin-bottom:50px; }
.m10l { margin-left:10px; }
.m10r { margin-right:10px; }
.m15l { margin-left:15px; }
.hand { cursor:pointer; }
.p0 { padding:0px;}
.p5 { padding:5px; }
.p10 { padding:10px; }
.p15 { padding:15px; }
.p10l { padding-left:10px; }
.p10r { padding-right:10px; }
.p10t { padding-top:10px; }
.p20 { padding:20px; }
.w50 { width:50px; }
.w100 { width:100px; }
.w150 { width:150px; }
.w170 { width:170px; overflow:hidden;}
.w200 { width:200px; }
.normal { font-size:11px; }
.fff { color:#fff; }
.h64 { height:60px; }
.margin0 { margin:0px; }
.padding0 { padding:0px; }
a .text-error { color:#D9534F;}
.inline { display:inline-block;}
.relative { position:relative;}
.absolute { position:absolute;}
.error { color:#ee445f !important; }
.num {
	font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:22px;font-weight:bold;text-align:center;line-height:40px;text-shadow:0px 1px 0px #ffffff;color:#a6a6a6
}
.num2 {
	font-family:Tahoma,Arial,"Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:13px;font-weight:bold;text-align:center;text-shadow:0px 1px 0px #ffffff;color:#969696
}
.num3 {
	font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:16px;font-weight:bold;text-align:center;text-shadow:0px 1px 0px #ffffff;color:#969696
}
.blue { color:blue; }
.alpha { 
	opacity: 0.50;
	filter: alpha(opacity=50);
}
.z10000 { z-index:10000; }
.line-small { line-height:120%; }
.dotted { width:auto; margin:10px 20px; border-top:1px dotted #ddd }

/* sideview */
.member { font-weight:bold; color:#3B5998; }
.guest  { font-weight:normal; color:#666; }
#sideview { margin:5px 0 0 0; width:90px; border:1px solid #E0E0E0; background-color:#F9FBFB; }
#sideview ul li span { color:#A0A0A0; font-family:"돋움"; font-size:11px; }

/* ajax */
#loading { display:none; position:absolute; width:50px; height:50px; top:50%; left:50%; margin:-16px; margin-left:-15px; z-index:100000000; background:url(https://storage.googleapis.com/i.addblock.net/preloader2.gif) center center no-repeat; background-color: #fff;border-radius: 10px;}

.err p { color:#ff0000; }

input[type=text]::-ms-clear { display:none; }

#css-form { overflow:auto; }
#css-form li { clear:both; overflow:auto;  }
#css-form label { width:210px; display:block; text-align:right; float:left; font-weight:bold;} 
#css-form .add { color:#999; display:block; font-size:11px; font-family:dotum; font-weight:normal; text-align:right; width:210px; letter-spacing:-1px;margin-right:3px; }
#css-form .date { color:#999; display:block; font-size:12px; font-family:dotum; font-weight:normal; text-align:left; width:210px; margin-right:3px; }
#css-form input[type=text] { float:left; width:200px;	margin:2px 0 20px 14px;}
#css-form select { float:left; margin:2px 0 20px 14px; }
#css-form p { float:left; margin:-1px 0 20px 14px; width:auto; }
#css-form li div.upload { float:left; margin:2px 0 20px 26px; }
#css-form textarea { float:left; margin:2px 0 20px 14px; width:400px; height:200px; }
#css-form #button { padding-left:215px; }
#css-form #msg { clear:both; margin-left:205px;margin-top:-10px;padding-bottom:10px; }
#css-form .btn { margin-top:2px; }
#css-form .group { overflow:auto; }
#css-form .group li { float:left; padding:10px; }
#css-form .w-date { width:85px; }

.rounds {
	border:1px solid #e0e0e0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.07);
	-moz-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.07);
	box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.07);
}
.round-top {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.07);
}
.round-bottom {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.07);
}

a.logo-txt {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 23px;
}

.sample {background:url(https://storage.googleapis.com/i.addblock.net/back.jpg) center 0 no-repeat #000; margin-top:200px;}
ul { list-style-type: none; margin:0px; padding:0px;}

.fileinput-button {
  position: relative;
  /*overflow: hidden;*/
}
.fileinput-button input {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  opacity: 0;
  left:0;
  bottom:0;
  -ms-filter: 'alpha(opacity=0)';
  font-size: 20px;
  direction: ltr;
  cursor: pointer;
  width:167px;
}
.fileinput-button input.music-upload-button {
  width:87px;
}

/* Fixes for IE < 8 */
@media screen\9 {
  .fileinput-button input {
    filter: alpha(opacity=0);
    font-size: 100%;
    height: 100%;
  }
}
.white {
color: #FFF !important;
}

h1.gallery { margin-top:0px; margin-bottom: 20px;}
.gallery.breadcrumb { background-color: transparent; margin-bottom:0px; }
.gallery.breadcrumb a:hover{ text-decoration: none; }
.gallery.breadcrumb > li + li:before {
	padding: 0 10px;
	color: #cccccc;
	content: "\f105";
	font-family: 'FontAwesome';
}
iframe.tpl-video { max-width:100%;}
iframe .html5-video-player { outline: 0;}
embed,
object {
  outline: 0;
  overflow: hidden
}
* [class*="no-gutter"] { padding-left:3px;padding-right:3px; }
* [class*="no-padding"] { padding:0px; }
.temp-template { text-align:center; line-height:500px;}
.g-img.img-zoom,
img.img-zoom { 
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
}
.g-img.img-zoom:hover,
img.img-zoom:hover {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
	filter: none;
	-webkit-filter:none;
  -webkit-transition: scale .3s ease-in-out;
  -moz-transition: scale .3s ease-in-out;
  -ms-transition: scale .3s ease-in-out;
  -o-transition: scale .3s ease-in-out;
	transition: scale .3s ease-in-out;
  -webkit-transform: scale(1.03,1.03);
  -moz--transform: scale(1.03,1.03);
  -ms-transform: scale(1.03,1.03);
  -o-transform: scale(1.03,1.03);
  transform: scale(1.03,1.03);
}
img[data-img-original="ON"] {
  cursor: pointer;
}
a.btn { text-decoration: none !important;}
a.btn-outline-inverse {
    color: #fff;
    background-color: transparent !important;
    border-color: #fff;
}
a.btn-outline-inverse:hover, a.btn-outline-inverse:focus, a.btn-outline-inverse:active {
    color: #fff;
    background-color: #fff;
    border-color: #fff;
}

a.btn-outline {
    color: #333;
    background-color: transparent !important;
    border:2px solid #333;
}
a.btn-outline:hover, a.btn-outline:focus, a.btn-outline:active {
    background-color: #333;
    border-color: #333;
}

a.btn-outline.white {
    color: #fff;
    background-color: transparent;
    border:2px solid #fff!important;
}
a.btn-outline.white:hover, a.btn-outline.white:focus, a.btn-outline.white:active {
    border-color: #fff;
    background:#fff;
    color:#333 !important;
}
a.btn-outline.bg-white { background-color:#fff !important;}
a.btn-outline.black {
    color: #fff;
    background-color: #222;
    border:2px solid #222;
}
a.btn-outline.black:hover, a.btn-outline.black:focus, a.btn-outline.black:active {
    border-color: #222;
    background:#222;
    color:#fff !important;
}

.dsgn-body.loading { cursor:progress !important;}
.dsgn-body > div.header { position:relative; z-index: 20; }
.dsgn-body > div.header.sidebar { position: initial;}
header.transparent { 
	width:100%;
	position:absolute;
	z-index:10;
}
header.transparent,
header.transparent ul.navbar-nav > li > a, 
header.transparent ul.navbar-nav > li > a:focus,
header.transparent ul.navbar-nav > li > a:hover, 
header.transparent ul.navbar-nav > li:hover > a,
header.transparent ul.navbar-nav > li.active > a,
header.transparent ul.navbar-nav > li.active > a:focus, 
header.transparent ul.navbar-nav > li.active > a:hover {
  background-color:transparent!important;
}

#tpl-menu > li.loginout,
#tpl-menu > li.loginout:hover,
#tpl-menu > li.loginout:focus,
#tpl-menu > li.loginout a,
#tpl-menu > li.loginout a:hover,
#tpl-menu > li.loginout a:focus { border: none; text-decoration: none; background-color: inherit; }
#tpl-menu > li.loginout:hover:after,
#tpl-menu > li.loginout:focus:after,
#tpl-menu > li.loginout:hover:before,
#tpl-menu > li.loginout:focus:before { display: none; background-color: inherit; }

#nav.default-nav .header .header_user .nav .lang-box { line-height: 53px !important; margin: 0 0 0 20px; }

@media only screen and (max-width:768px){
  #nav { position: static; background: none; padding: 0 !important; margin: 0 !important;}
  #nav.intro .navbar-header { width: 100%; padding: 0 !important; }
  #nav.intro .navbar-brand { display: block; width: 100%; text-align: center; background: #fff; }
  #nav.intro .navbar-brand .logo-img { display: inline-block; margin: 0 auto; }
  #nav.intro .main-menu .main-menubox { display: none; } 
  #nav.intro .main-menu { display: block; width: 100%; padding: 0; margin: -1px 0 0 !important; }
  #nav.intro .main-menu > ul { width: 100%; margin: 0 !important; }
  #nav.intro .main-menu > ul > li { float: left; width: 33.33%; border-top: 1px solid #e6e6e6 !important; border-bottom: 1px solid #e6e6e6; background: #f2f2f2; padding: 0; margin: 0 !important; }
  #nav.intro .main-menu > ul > li > a { min-width: auto !important; padding: 0 !important; }
  #nav.intro .main-menu > ul > li > a > .caret { margin-left: 0; }
  #nav.intro .lang-box .dropdown-menu { display: none; position: absolute; min-width: 100% !important; border: 1px solid #e6e6e6 !important; border-top: none; background: #fff !important; }
  #nav.intro .lang-box.open .dropdown-menu { display: block; }
  #nav.default-nav .header .header_user .btn-group.dash-lang .dropdown-menu { /* display: none;  */}
}

@media only screen and (min-width:769px) {
  header.transparent .navbar-nav#tpl-menu {
    background-color:transparent;
  }

  header.transparent ul.navbar-nav > li > .dropdown-menu {
    -webkit-box-shadow: none;
    box-shadow: none;
  }
  header.transparent ul.navbar-nav > li > .dropdown-menu,
  header.transparent ul.navbar-nav > li > .dropdown-menu > li  > a, 
  header.transparent ul.navbar-nav > li > .dropdown-menu > li  > a:focus,
  header.transparent ul.navbar-nav > li > .dropdown-menu > li  > a:hover, 
  header.transparent ul.navbar-nav > li > .dropdown-menu > li :hover > a,
  header.transparent ul.navbar-nav > li > .dropdown-menu > li .active > a,
  header.transparent ul.navbar-nav > li > .dropdown-menu > li .active > a:focus, 
  header.transparent ul.navbar-nav > li > .dropdown-menu > li .active > a:hover {
    background-color:transparent!important;
  }
}


/*header.transparent #tpl-menu > li > a { color:#fff !important; }*/

.header.el-menu .navbar .navbar-header { vertical-align: top; }

a.square { border-radius: 0; }
a.square.lg { padding: 12px 24px; letter-spacing: 2px;}
.forum-top-container.full-width,
.forum-bottom-container.full-width,
.container.full-width { width:100% !important; padding-left:0px; padding-right:0px; box-sizing:border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box!important; }
.container.full-width .navbar-header, .container.full-width .navbar-collapse { margin-left:0px; margin-right:0px;}
.container.full-width .row { margin:0px; }
.google-map {}
.scrollFix {     
    overflow: hidden;
    white-space: nowrap;
    color:#333;
}

.dropdown-menu .sub-menu {
    left: 100%;
    position: absolute;
    top: 0;
    visibility: hidden;
    margin-top: -1px;
}

.dropdown-menu li:hover .sub-menu {
    visibility: visible;
}

.navbar-toggle { border:0px; margin-top:19px; margin-bottom:19px; }
@media only screen and (min-width:768px) {
    .dropdown:not(.bootstrap-select):hover .dropdown-menu { display: block; }
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background-color:transparent;}
.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
    margin-top: 0;
}

.navbar .sub-menu:before {
    border-bottom: 7px solid transparent;
    border-left: none;
    border-right: 7px solid rgba(0, 0, 0, 0.2);
    border-top: 7px solid transparent;
    left: -7px;
    top: 10px;
}
.navbar .sub-menu:after {
    border-top: 6px solid transparent;
    border-left: none;
    border-right: 6px solid #fff;
    border-bottom: 6px solid transparent;
    left: 10px;
    top: 11px;
    left: -6px;
}

.blur { 
    -webkit-filter: blur(20px);
    -moz-filter: blur(20px);
    -o-filter: blur(20px);
    -ms-filter: blur(20px);
    filter: blur(20px);
    opacity: 0.4;
}
.carousel-control .fa-angle-left {
    font-size:42px;
    left: 50%;
    position: absolute;
    top: 50%;
    z-index: 5;
    display: inline-block;    
}

.carousel-control .fa-angle-right {
    font-size:42px;
    right: 50%;
    position: absolute;
    top: 50%;
    z-index: 5;
    display: inline-block;    
}

video.bgvid-gabia {
  width:100%;
}

video.bgvid {
    display: block;
    background-position: center;
    -webkit-background-size: cover;
    background-size: cover;

    pointer-events: none;
    min-width: 100%;
    min-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.pagination-sm > li > a, .pagination-sm > li > span { font-size:11px; padding:5px 7px;font-weight: 600;}
.gallery-loadmore {
    margin: 15px auto;
    padding: 8px 20px;
    width: 210px;
    max-width: 100%;
    text-align: center;
    color: #aaa;
    background-color: #E5E5E5;
    /*border-radius: 5px;*/
    cursor: pointer;
}
.gallery-loadmore:hover {
    color: #fff;
    background-color: #000;
}

/*.dsgn-body .btn-default { border:2px solid #ccc;}*/
.goto-top { 
  z-index:9; 
  position: fixed; 
  bottom:50px;
  right:50px;
  width:34px; height:34px; 
  background:rgba(0,0,0,0.1); 
  -webkit-border-radius: 5px; 
  -moz-border-radius: 5px; 
  border-radius: 5px; 
  font-size:24px; 
  line-height:31px; 
  text-align: center; 
  color:#aaa; 
  /* visibility: hidden; */
  cursor:pointer; 
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
.goto-top i.fa {margin:0;}
.goto-top.moved { 
  bottom: 90px; 
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
.goto-top:hover { background:rgba(0, 0, 0, 0.7); color:#fff; }
.dsgn-body .text-bg a, .dsgn-body .text-bg a:hover, .dsgn-body .text-bg a:visited { color:#fff !important;}
.dsgn-body .text-bg a.btn-outline:hover, .dsgn-body .text-bg a.btn-outline:visited { background-color: transparent;}

/*social block - feed comment*/
.empty-feed { position: relative; }
.empty-feed ~ div .data-feed-load-more { display: none; }
.empty-feed > .social-feed-element { opacity: 0; }
.recomm-socialfeed-text { padding-top: 2vw; padding-bottom: 2vw; text-align: center; font-size: 12px; }

a.carousel-control.right, a.carousel-control.right:hover,
a.carousel-control.left, a.carousel-control.left:hover { 
    color:#fff;
}

/*.navbar-nav { margin:0px -15px;}*/
.dropdown-menu > li > a { padding:10px 30px; }
.fa.fa-caret-down { margin-left: 5px; vertical-align: text-bottom; }
.caret { margin-left:5px; }
.dsgn-body a.navbar-brand:hover { text-decoration:none; }
.navbar-default.transparent .navbar-nav > .dropdown > a:hover .caret, .navbar-default.transparent .navbar-nav > .dropdown > a:focus .caret {
	border-top-color:#fff;
	border-bottom-color:#fff;
}
.navbar-default.transparent .navbar-nav > .dropdown > a .caret {
	border-top-color:#eee;
	border-bottom-color:#eee;
}
@keyframes showDown {
 from {
  top: 54%;
  filter: alpha(opacity=0);
  opacity: 0;
 } to {
  top: 50%;
  filter: alpha(opacity=100);
  opacity: 1;
 }
}
@-webkit-keyframes showDown {
 from {
  top: 54%;
  filter: alpha(opacity=0);
  opacity: 0;
 } to {
  top: 50%;
  filter: alpha(opacity=100);
  opacity: 1;
 }
}
@-moz-keyframes showDown {
 from {
  top: 54%;
  filter: alpha(opacity=0);
  opacity: 0;
 } to {
  top: 50%;
  filter: alpha(opacity=100);
  opacity: 1;
 }
}
@-ms-keyframes showDown {
 from {
  top: 54%;
  filter: alpha(opacity=0);
  opacity: 0;
 } to {
  top: 50%;
  filter: alpha(opacity=100);
  opacity: 1;
 }
}

@keyframes showUp {
 from {
  top: 20%;
  opacity: 0;
 } to {
  top:50%;
  opacity: 1;
 }
}
@-webkit-keyframes showUp {
 from {
  top: 20%;
  opacity: 0;
 } to {
  top: 50%;
  opacity: 1;
 }
}
@-moz-keyframes showUp {
 from {
  top: 20%;
  opacity: 0;
 } to {
  top:50%;
  opacity: 1;
 }
}
@-ms-keyframes showUp {
 from {
  top:20%;
  opacity: 0;
 } to {
  top: 50%;
  opacity: 1;
 }
}

@keyframes showDown2 {
 from {
  top: 70%;
  filter: alpha(opacity=0);
  opacity: 0;
 } to {
  top: 65%;
  filter: alpha(opacity=100);
  opacity: 1;
 }
}
@-webkit-keyframes showDown2 {
 from {
  top: 70%;
  filter: alpha(opacity=0);
  opacity: 0;
 } to {
  top: 65%;
  filter: alpha(opacity=100);
  opacity: 1;
 }
}
@-moz-keyframes showDown2 {
 from {
  top: 70%;
  filter: alpha(opacity=0);
  opacity: 0;
 } to {
  top: 65%;
  filter: alpha(opacity=100);
  opacity: 1;
 }
}
@-ms-keyframes showDown2 {
 from {
  top: 70%;
  filter: alpha(opacity=0);
  opacity: 0;
 } to {
  top: 65%;
  filter: alpha(opacity=100);
  opacity: 1;
 }
}
.uppercase { text-transform: uppercase;}
.sign-image { padding:20px 0px;}
.img-responsive-max { width:100%;}
.checkbox-block { display:block; vertical-align:middle; }
.label-checkbox { width:auto !important; cursor:pointer; margin-bottom:0px;}
.option-title { font-size:13px; margin-top:5px; font-weight:bold;}
.option-title:after { clear:both; }
span.input-group-addon { display:table-cell !important;}
header.sidebar { 
  position:fixed;
  top:0;
  left:0;
  bottom: 0;
  height: 100%;
  z-index: 10;
  display:block;
  overflow:hidden;
  -webkit-overflow-scrolling:touch;  
}

.dsgn-body.sidebar { padding-left:260px; }
.data-back { cursor: pointer;}
@media (max-width:768px) {
  .dsgn-body.sidebar { padding-left:0px;}
  .fixed { top:0px !important; right:0px !important;}
  header.sidebar { 
      position:relative !important;
      width:100%;
      overflow: initial;
  }
  .editor-navbar { display:none;}
  header:not(.navbar-simple) .navbar-nav a:not([data-submenu='true']) ~ .dropdown-menu {
      display:block;
      position: static;
      float: none;
      width: auto;
      margin-top: 0;
      border: 0;
      box-shadow: none; 
  }
}
.dsgn-body .ellist-content .forum-top-container,
.dsgn-body .ellist-content .forum-bottom-container,
.dsgn-body .ellist-content .container { max-width: 100%; }
@media (min-width: 769px) {
  .dsgn-body.sidebar .forum-top-container,
  .dsgn-body.sidebar .forum-bottom-container,
  .dsgn-body.sidebar .container {
    width:480px;
  }

  .dsgn-body .ellist-content .forum-top-container,
  .dsgn-body .ellist-content .forum-bottom-container,
  .dsgn-body .ellist-content .container {
    width:460px;
    min-width:320px;
  }

  .creatorlink-header + .header header.sidebar,
  .creatorlink-header + .popover + .header header.sidebar { 
    top: 55px! important;
  }

  .creatorlink-header + .popover + .header header.sidebar + .element.el_0 { margin-top: 55px; }
}

@media (min-width: 992px) {
  .dsgn-body.sidebar .forum-top-container,
  .dsgn-body.sidebar .forum-bottom-container,
  .dsgn-body.sidebar .container {
    width:700px;
  }
  .dsgn-body .ellist-content .forum-top-container,
  .dsgn-body .ellist-content .forum-bottom-container,
  .dsgn-body .ellist-content .container {
    width:680px;
  }
}

@media (min-width: 1200px) {
  .dsgn-body.sidebar .forum-top-container,
  .dsgn-body.sidebar .forum-bottom-container,
  .dsgn-body.sidebar .container {
    width:920px;
  }
  .dsgn-body .ellist-content .forum-top-container,
  .dsgn-body .ellist-content .forum-bottom-container,
  .dsgn-body .ellist-content .container {
    width:900px;
  }
}

@media (min-width: 1440px) {
  .dsgn-body.sidebar .forum-top-container,
  .dsgn-body.sidebar .forum-bottom-container,
  .dsgn-body.sidebar .container {
    width:1120px;
  }
  .dsgn-body .ellist-content .forum-top-container,
  .dsgn-body .ellist-content .forum-bottom-container,
  .dsgn-body .ellist-content .container {
    width:1100px;
  }
}

@media (min-width: 1200px) {
  .dsgn-body.tiny .forum-top-container,
  .dsgn-body.sidebar.tiny .forum-top-container,
  .dsgn-body.tiny .forum-bottom-container,
  .dsgn-body.sidebar.tiny .forum-bottom-container,
  .dsgn-body.tiny .container,
  .dsgn-body.sidebar.tiny .container {
    width:940px;
  }
}

.pageIsEmpty {
  margin: 100px auto;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 100px;
  background-color: #fefefe;  
}

.pageIsEmpty h1 {
  font-weight: 300;
  text-transform: uppercase;
  font-size:25px;
  letter-spacing: 3px;
}
#config-mode-view {
  position: fixed;
  right: 2px;
  top: 2px;
  color: rgb(255, 255, 255);
  font-size: 18px;
  padding: 5px 9px;
  cursor: pointer;
  border-radius: 20px;
  background-color: rgb(85, 98, 115);
  z-index:2000;
}

@media (max-width: 768px) {
  /*
  #config-mode-view {
    top:60px;
    right:20px;
  }
  */
}

.multi-columns-row .first-in-row {
  clear: left;
}

.multi-columns-row .col-xs-6:nth-child(2n + 3) { clear: left; }
.multi-columns-row .col-xs-4:nth-child(3n + 4) { clear: left; }
.multi-columns-row .col-xs-3:nth-child(4n + 5) { clear: left; }
.multi-columns-row .col-xs-15:nth-child(5n + 6) { clear: left; }
.multi-columns-row .col-xs-2:nth-child(6n + 7) { clear: left; }
.multi-columns-row .col-xs-1:nth-child(12n + 13) { clear: left; }
@media (min-width: 768px) {
  .multi-columns-row .col-xs-6:nth-child(2n + 3) { clear: none; }
  .multi-columns-row .col-xs-4:nth-child(3n + 4) { clear: none; }
  .multi-columns-row .col-xs-3:nth-child(4n + 5) { clear: none; }
  .multi-columns-row .col-xs-15:nth-child(5n + 6) { clear: none; }
  .multi-columns-row .col-xs-2:nth-child(6n + 7) { clear: none; }
  .multi-columns-row .col-xs-1:nth-child(12n + 13) { clear: none; }

  .multi-columns-row .col-sm-6:nth-child(2n + 3) { clear: left; }
  .multi-columns-row .col-sm-4:nth-child(3n + 4) { clear: left; }
  .multi-columns-row .col-sm-3:nth-child(4n + 5) { clear: left; }
  .multi-columns-row .col-sm-15:nth-child(5n + 6) { clear: left; }
  .multi-columns-row .col-sm-2:nth-child(6n + 7) { clear: left; }
  .multi-columns-row .col-sm-1:nth-child(12n + 13) { clear: left; }
}
@media (min-width: 992px) {
  .multi-columns-row .col-sm-6:nth-child(2n + 3) { clear: none; }
  .multi-columns-row .col-sm-4:nth-child(3n + 4) { clear: none; }
  .multi-columns-row .col-sm-3:nth-child(4n + 5) { clear: none; }
  .multi-columns-row .col-sm-15:nth-child(5n + 6) { clear: none; }
  .multi-columns-row .col-sm-2:nth-child(6n + 7) { clear: none; }
  .multi-columns-row .col-sm-1:nth-child(12n + 13) { clear: none; }

  .multi-columns-row .col-md-6:nth-child(2n + 3) { clear: left; }
  .multi-columns-row .col-md-4:nth-child(3n + 4) { clear: left; }
  .multi-columns-row .col-md-3:nth-child(4n + 5) { clear: left; }
  .multi-columns-row .col-md-15:nth-child(5n + 6) { clear: left; }
  .multi-columns-row .col-md-2:nth-child(6n + 7) { clear: left; }
  .multi-columns-row .col-md-1:nth-child(12n + 13) { clear: left; }
}

.tpl-project-toolbar-button { margin-left: 30px; }
.tpl-project-toolbar-button.next,
.tpl-project-toolbar-button.prev { font-size: 18px; }
.tpl-page-footer-wrap .tpl-page-toolbar { background-color: transparent; padding: 0 10px; }
.tpl-page-footer-wrap .tpl-forum-toolbar-button, 
.tpl-page-footer-wrap .tpl-project-toolbar-button { padding: 5px; } 

.tpl-page-footer-wrap .tpl-project-toolbar-button { opacity: 0.2; }
.tpl-page-footer-wrap .tpl-project-toolbar-button.data-page-back,
.tpl-page-footer-wrap .tpl-project-toolbar-button.active { opacity: 1; cursor: pointer; font-size: 18px; }
.tpl-page-footer-wrap .tpl-project-toolbar-button.data-page-prev,
.tpl-page-footer-wrap .tpl-project-toolbar-button.data-page-next { font-size: 1.9em; max-height: 33px; }

.tpl-page-footer-wrap .tpl-forum-toolbar-button.share { font-size: 18px; }
.tpl-page-footer-wrap .tpl-forum-toolbar-button.share,
.data-page-back,
.data-page-prev.active,
.data-page-next.active { cursor: pointer; }

@media (max-width: 767px) {
 .tpl-page-footer-wrap .tpl-page-toolbar { padding: 0; }
 .tpl-project-toolbar-button { margin-left: 15px; }
}



.fixed { position:fixed !important; top:0; left:0; right:17px; z-index:26 !important; }
.fixed:not(.el-menu) { background-color:#fff; }
.mode-config .fixed { top: 35px; }
.creatorlink-header + .popover + .fixed-position.top-zero,
.fixed-position { top:0px !important; z-index:1;}
.creatorlink-header + .fixed-position,
.creatorlink-header + .popover + .fixed-position.fixed.top-zero,
.creatorlink-header + .popover + .fixed-position { top:55px !important;}
.creatorlink-header + div + div + .forum-view { margin-top: 55px; }
.fsize9 { font-size:9px !important; }
.fsize10 { font-size:10px !important; }
.fsize11 { font-size:11px !important; }
.fsize12 { font-size:12px !important; }
.fsize13 { font-size:13px !important; }
.fsize14 { font-size:14px !important; }
.fsize15 { font-size:15px !important; }
.fsize16 { font-size:16px !important; }
.fsize17 { font-size:17px !important; }
.fsize18 { font-size:18px !important; }
.fsize19 { font-size:19px !important; }
.fsize20 { font-size:20px !important; }
.fsize21 { font-size:21px !important; }
.fsize22 { font-size:22px !important; }
.fsize23 { font-size:23px !important; }
.fsize24 { font-size:24px !important; }
.fsize25 { font-size:25px !important; }
.fsize26 { font-size:26px !important; }
.fsize27 { font-size:27px !important; }
.fsize28 { font-size:28px !important; }
.fsize29 { font-size:29px !important; }
.fsize30 { font-size:30px !important; }
.fsize31 { font-size:31px !important; }
.fsize32 { font-size:32px !important; }
.fsize33 { font-size:33px !important; }
.fsize34 { font-size:34px !important; }
.fsize35 { font-size:35px !important; }
.fsize36 { font-size:36px !important; }
.fsize37 { font-size:37px !important; }
.fsize38 { font-size:38px !important; }
.fsize39 { font-size:39px !important; }
.fsize40 { font-size:40px !important; }
.fsize41 { font-size:41px !important; }
.fsize42 { font-size:42px !important; }
.fsize43 { font-size:43px !important; }
.fsize44 { font-size:44px !important; }
.fsize45 { font-size:45px !important; }
.fsize46 { font-size:46px !important; }
.fsize47 { font-size:47px !important; }
.fsize48 { font-size:48px !important; }
.fsize49 { font-size:49px !important; }
.fsize50 { font-size:50px !important; }
.fsize51 { font-size:51px !important; }
.fsize52 { font-size:52px !important; }
.fsize53 { font-size:53px !important; }
.fsize54 { font-size:54px !important; }
.fsize55 { font-size:55px !important; }
.fsize56 { font-size:56px !important; }
.fsize57 { font-size:57px !important; }
.fsize58 { font-size:58px !important; }
.fsize59 { font-size:59px !important; }
.fsize60 { font-size:60px !important; }
.fsize61 { font-size:61px !important; }
.fsize62 { font-size:62px !important; }
.fsize63 { font-size:63px !important; }
.fsize64 { font-size:64px !important; }
.fsize65 { font-size:65px !important; }
.fsize66 { font-size:66px !important; }
.fsize67 { font-size:67px !important; }
.fsize68 { font-size:68px !important; }
.fsize69 { font-size:69px !important; }
.fsize70 { font-size:70px !important; }
.fsize71 { font-size:71px !important; }
.fsize72 { font-size:72px !important; }
.fsize73 { font-size:73px !important; }
.fsize74 { font-size:74px !important; }
.fsize75 { font-size:75px !important; }
.fsize76 { font-size:76px !important; }
.fsize77 { font-size:77px !important; }
.fsize78 { font-size:78px !important; }
.fsize79 { font-size:79px !important; }
.fsize80 { font-size:80px !important; }
.fsize81 { font-size:81px !important; }
.fsize82 { font-size:82px !important; }
.fsize83 { font-size:83px !important; }
.fsize84 { font-size:84px !important; }
.fsize85 { font-size:85px !important; }
.fsize86 { font-size:86px !important; }
.fsize87 { font-size:87px !important; }
.fsize88 { font-size:88px !important; }
.fsize89 { font-size:89px !important; }
.fsize90 { font-size:90px !important; }
.fsize91 { font-size:91px !important; }
.fsize92 { font-size:92px !important; }
.fsize93 { font-size:93px !important; }
.fsize94 { font-size:94px !important; }
.fsize95 { font-size:95px !important; }
.fsize96 { font-size:96px !important; }
.fsize97 { font-size:97px !important; }
.fsize98 { font-size:98px !important; }
.fsize99 { font-size:99px !important; }
.fsize100 { font-size:100px !important; }

.fsize110 { font-size:110px !important; }
.fsize150 { font-size:150px !important; }



/*ko:: Korean*/
.ffamilyKoPub-Batang { font-family: 'KoPub Batang' !important; font-weight: normal; }
.ffamilyGodo { font-family: 'Godo' !important; font-weight: normal; }
.ffamilyKukdetopokki { font-family: 'Kukdetopokki' !important; font-weight: normal; }
.ffamilyNanum-Gothic { font-family: 'Nanum Gothic' !important; font-weight: normal; }
.ffamilyNanum-Gothic-Coding { font-family: 'Nanum Gothic Coding' !important; font-weight: normal; }
.ffamilyNanum-Myeongjo { font-family: 'Nanum Myeongjo' !important; font-weight: normal; }
.ffamilyNanum-Barun-Gothic { font-family: 'Nanum Barun Gothic' !important; font-weight: normal; }
.ffamilyNanumBarunGothicLight { font-family: 'NanumBarunGothicLight' !important; font-weight: normal; }
.ffamilyNanum-Pen-Script { font-family: 'Nanum Pen Script' !important; font-weight: normal; }
.ffamilyNanum-Brush-Script { font-family: 'Nanum Brush Script' !important; font-weight: normal; }
.ffamilyNanum-Square { font-family: 'Nanum Square' !important; font-weight: normal; } 
.ffamilyNanum-Square-Round { font-family: 'Nanum Square Round' !important; font-weight: normal; } 
.ffamilyDaraehand { font-family: 'Daraehand' !important; font-weight: normal; }
.ffamilyMonsori { font-family: 'Monsori' !important; font-weight: normal; }
.ffamilyDohyeon { font-family: 'Dohyeon' !important; font-weight: normal; }
.ffamilyNoto-Sans-KR { font-family: 'Noto Sans KR' !important; font-weight: normal; }
.ffamilyNoto-Serif-CJK-KR { font-family: 'Noto Serif CJK KR' !important; font-weight: normal; }
.ffamilyBB-Tree-Gothic { font-family: 'BB Tree Gothic' !important; font-weight: normal; }
.ffamilyBB-Tree-Namu { font-family: 'BB Tree Namu' !important; font-weight: normal; }
.ffamilyBB-Tree-Hand { font-family: 'BB Tree Hand' !important; font-weight: normal; }
.ffamilySangSangTitle { font-family: 'SangSangTitle' !important; font-weight: normal; }
.ffamilySeoul-Namsan { font-family: 'Seoul Namsan' !important; font-weight: normal; }
.ffamilySeoul-Hangang { font-family: 'Seoul Hangang' !important; font-weight: normal; }
.ffamilySpoqa-Han-Sans { font-family: 'Spoqa Han Sans' !important; font-weight: normal; }
.ffamilyS-CoreDream { font-family: 'S CoreDream' !important; font-weight: normal; }
.ffamilyYeonsung { font-family: 'Yeonsung' !important; font-weight: normal; }
.ffamilyOseong-and-HanEum { font-family: 'Oseong and HanEum' !important; font-weight: normal; }
.ffamilyIropke-Batang { font-family: 'Iropke Batang' !important; font-weight: normal; }
.ffamilyJeju-Gothic { font-family: 'Jeju Gothic' !important; font-weight: normal; }
.ffamilyJeju-Myeongjo { font-family: 'Jeju Myeongjo' !important; font-weight: normal; }
.ffamilyJeju-Hallasan { font-family: 'Jeju Hallasan' !important; font-weight: normal; }
.ffamilyJua { font-family: 'Jua' !important; font-weight: normal; }
.ffamilyYouth { font-family: 'Youth' !important; font-weight: normal; }
.ffamilyHangyule { font-family: 'Hangyule' !important; font-weight: normal; }
.ffamilyHanna { font-family: 'Hanna' !important; font-weight: normal; }

.ffamilyOseong-and-HanEum + br ,
.ffamilyffamilyKukdetopokki + br,
.ffamilyOseong-and-HanEum br,
.ffamilyffamilyKukdetopokki br { font-family: 'Open Sans' !important; }

/*en:: English*/
.ffamilyAbel { font-family: 'Abel' ! important; }
.ffamilyAbril-Fatface { font-family: 'Abril Fatface' ! important; }
.ffamilyAlegreya { font-family: 'Alegreya' !important; }
.ffamilyAliquam { font-family: 'Aliquam' !important; font-weight: normal; }
.ffamilyArial { font-family: 'Arial' !important; font-weight: normal; } 
.ffamilyBlackHanSans { font-family: 'Black Han Sans' !important; font-weight: normal; } 
.ffamilyCardo { font-family: 'Cardo' !important; }
.ffamilyCookie { font-family: 'Cookie' !important; }
.ffamilyDancing-Script { font-family: 'Dancing Script' !important; font-weight: normal; }
.ffamilyDosis { font-family: 'Dosis' !important; }
.ffamilyDroid-Sans { font-family: 'Droid Sans' !important; }
.ffamilyDroid-Serif { font-family: 'Droid Serif' !important; }
.ffamilyGeorgia { font-family: 'Georgia' !important; font-weight: normal; }
.ffamilyGreat-Vibes { font-family: 'Great Vibes' !important; font-weight: normal; }
.ffamilyLato { font-family: 'Lato' !important; }
.ffamilyLibre-Baskerville { font-family: 'Libre Baskerville' !important; }
.ffamilyLora { font-family: 'Lora' !important; }
.ffamilyMontserrat { font-family: 'Montserrat' !important; font-weight: normal; }
.ffamilyMuli { font-family: 'Muli' !important; }
.ffamilyNew-Waltograph { font-family: 'New Waltograph' !important; font-weight: normal; }
.ffamilyNixie-One { font-family: 'Nixie One' !important; }
.ffamilyNoto-Sans { font-family: 'Noto Sans' ! important; }
.ffamilyOpen-sans { font-family: 'Open sans' !important; }
.ffamilyOswald { font-family: 'Oswald' !important; }
.ffamilyPlayball { font-family: 'Playball' !important; font-weight: normal; }
.ffamilyPlayfair-Display { font-family: 'Playfair Display' !important; }
.ffamilyPT-Sans { font-family: 'PT Sans' !important; }
.ffamilyPT-Serif { font-family: 'PT Serif' !important; }
.ffamilyQuestrial { font-family: 'Questrial' ! important; }
.ffamilyQuicksand { font-family: 'Quicksand' ! important; }
.ffamilyRaleway { font-family: 'Raleway' !important; }
.ffamilyRoboto { font-family: 'Roboto' !important; }
.ffamilySans-serif { font-family: 'Sans serif' !important; }
.ffamilyStaatliches { font-family: 'Staatliches' !important; }
.ffamilyStalemate { font-family: 'Stalemate' !important; font-weight: normal; }
.ffamilyStar-Jedi { font-family: 'Star Jedi' !important; font-weight: normal; }
.ffamilyTimes-New-Roman { font-family: 'Times New Roman' !important; font-weight: normal; }
.ffamilyTrench { font-family: 'Trench' !important; font-weight: normal; }

/*??*/
.ffamilyCinzel { font-family: 'Cinzel' !important; }
.ffamilyLobster { font-family: 'Lobster' !important; }
.ffamilyUbuntu { font-family: 'Ubuntu' !important; }
.ffamilyHelvetica-Neue { font-family: 'Helvetica-Neue' !important; }
.ffamilyHelvetica { font-family: 'Helvetica' !important;}

/*ja:: Japanese*/
.ffamilyHannari { font-family: 'Hannari' !important; font-weight: normal; }
.ffamilyHokkori { font-family: 'Hokkori' !important; font-weight: normal; }
.ffamilyIoEI { font-family: 'IoEI' !important; font-weight: normal; }
.ffamilyJKG { font-family: 'JKG' !important; font-weight: normal; }
.ffamilyMS-Gothic { font-family: 'MS Gothic' !important; font-weight: normal; }
.ffamilyMS-Mincho { font-family: 'MS Mincho' !important; font-weight: normal; } 
/*th:: Thai*/
.ffamilyCyclin { font-family: 'Cyclin' !important; font-weight: normal; }
.ffamilyHai-Heritage-Pro { font-family: 'Hai Heritage Pro' !important; font-weight: normal; }
.ffamilyHFF-Thai-Dye { font-family: 'HFF Thai Dye' !important; font-weight: normal; }
.ffamilyOwah-Tagu-Siam-NF { font-family: 'Owah Tagu Siam NF' !important; font-weight: normal; }
/*ar:: Arabic*/
.ffamilyAceh-Darusalam { font-family: 'Aceh Darusalam' !important; font-weight: normal; }
.ffamilyAmiri { font-family: 'Amiri' !important; font-weight: normal; }
.ffamilyArabDances { font-family: 'ArabDances' !important; font-weight: normal; }
.ffamilyBoecklins-Universe { font-family: 'Boecklins Universe' !important; font-weight: normal; }
.ffamilyCatharsis-Bedouin { font-family: 'Catharsis Bedouin' !important; font-weight: normal; }
.ffamilyHimchuli { font-family: 'Himchuli' !important; font-weight: normal; }
.ffamilyKanisah { font-family: 'Kanisah' !important; font-weight: normal; }
.ffamilySatyajit { font-family: 'Satyajit' !important; font-weight: normal; }
/*cr:: Cyrillic*/
.ffamily20db { font-family: '20db' !important; font-weight: normal; }
.ffamilyAlpha-Echo { font-family: 'Alpha Echo' !important; font-weight: normal; }
.ffamilyAnonymous-Pro { font-family: 'Anonymous Pro' !important; font-weight: normal; }
.ffamilyArsenal { font-family: 'Arsenal' !important; font-weight: normal; }
.ffamilyBebas-Neue { font-family: 'Bebas Neue' !important; font-weight: normal; }
.ffamilyBitter { font-family: 'Bitter' !important; font-weight: normal; }
.ffamilyCharis-SIL { font-family: 'Charis SIL' !important; font-weight: normal; }
.ffamilyFira-Mono { font-family: 'Fira Mono' !important; font-weight: normal; }
.ffamilyLato-CR { font-family: 'Lato CR' !important; font-weight: normal; }
/*he:: Hebrew*/
.ffamilyAlef { font-family: 'Alef' !important; font-weight: normal; }
.ffamilyEzra-SIL { font-family: 'Ezra SIL' !important; font-weight: normal; }
.ffamilyMendelSiddurMW { font-family: 'MendelSiddurMW' !important; font-weight: normal; }
/*ch:: Chinese*/
.ffamilycwTeXHei { font-family: 'cwTeXHei' !important; font-weight: normal; }
.ffamilycwTeXKai { font-family: 'cwTeXKai' !important; font-weight: normal; }
.ffamilycwTeXMing { font-family: 'cwTeXMing' !important; font-weight: normal; }
.ffamilycwTeXYen { font-family: 'cwTeXYen' !important; font-weight: normal; }
.ffamilyNoto-Sans-SC { font-family: 'Noto Sans SC' !important; font-weight: normal;}
/*vi:: Vietnamese*/
.ffamilyHan-Nom-Gothic { font-family: 'Han Nom Gothic' !important; font-weight: normal; }



/*traffic limit modal*/
.traffic-limit-modal { 
  font-family: 'Open Sans', 'Nanum Gothic', 'Dotum';
  font-size: 12px;
  position: fixed; 
  left: 0; right: 0; bottom :0; 
  width: 100%; 
  background-color: rgba(34,34,34,0.93); 
  z-index: 99; 
}
.traffic-limit-modal .inner-box { position: relative; }
.traffic-limit-modal .inner-box a { color: #fff; text-decoration: none; line-height: 20px; vertical-align: middle; } 
.traffic-limit-modal .inner-box p { text-align: center; color: #9fa8b1; margin-top: 12px; margin-bottom: 15px; }
.traffic-limit-modal .inner-box p + p a { text-align: right; font-size: 11px; color: #888f97; padding-right: 20px; }
.traffic-limit-modal .inner-box p + p a .fa { color: #fff; }
.traffic-limit-modal .inner-box p img { max-width: 103px; margin-right: 15px; }
.traffic-limit-modal.creatorlink-gabia .inner-box p img { margin-right: 0; }
.traffic-limit-modal.creatorlink-gabia .inner-box p .gabia-logo { margin-right: 8px; }
.traffic-limit-modal.creatorlink-gabia .inner-box p .logo-and { margin-right: 6px; }
.traffic-limit-modal.creatorlink-gabia .inner-box p .limit-txt { margin-left: 25px; }

.cursor { cursor:pointer;}
.element .image-wrap,
.render .image-wrap { display:block; margin:0 auto; float:none;}
.element .image-wrap:after,
.render .image-wrap:after { clear:both; }
#generic-modal.modal { overflow-y:hidden; }
.btn a { text-decoration: none;}


.config-image-view {
    position: absolute;
    display: none;
    top: 20px;
    left: 0;
    z-index: 5;
    color: #fff;
    background-color: rgba(0,0,0,0.5);
    padding: 1px 4px;
    -moz-border-radius: 0;
    border-radius: 0;
    font-size: 14px;
    cursor: pointer;
    min-width: 25px;
    text-align: center;
}
.config-image-view + .tooltip .tooltip-arrow { margin-bottom: 1px; }

.modal-default .container { padding-top:5%; padding-left:0px; padding-right: 5px;}
.modal-default .container .modal-body { padding:0px; font-size:15px;}
.modal-default .container .modal-footer { padding:0px;}
.forum-modal .modal.fade .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
}

.flat-modal .modal-dialog { max-width: 385px; }
.flat-modal .modal-body { font-family: 'Open Sans','Nanum gothic'; color:#25272b; text-align: center; padding-top:0;}
.flat-modal .modal-title { margin-bottom: 10px; font-size:15px; letter-spacing: 0.1em; padding:40px 40px 0 40px;}
.flat-modal .modal-content { 
  border-radius: 0;
  color:#37383B;
  font-size: 13px;
  line-height: 1.6; 
  letter-spacing: -0.05em;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.flat-modal .modal-footer {
  padding: 0 40px 40px 40px;
  text-align: center;
  border:none;
}
.flat-modal .modal.in .modal-dialog { 
  -webkit-transform: translate(0, 50%);
  -ms-transform: translate(0, 50%);
  transform: translate(0, 50%);
}
.flat-modal .modal.fade .modal-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);  
}
.flat-modal .modal .modal-dialog.modal-portfolio-link {
  -webkit-transform: translate(0, 12%);
  -ms-transform: translate(0, 12%);
  transform: translate(0, 12%);
}
.flat-modal + .modal-backdrop {
  background-color: #eeeff3;
}
.flat-modal + .modal-backdrop.fade.in {
  opacity: 0.9;
}

.flat-modal .btn,
.galleryController .btn:not(.gallery-category-config) {
  width: 140px;
  color: #fff;
  padding: 11px 30px;
  border: none;
  -webkit-border-radius: 3px; 
  -moz-border-radius: 3px; 
  border-radius: 3px;
}

.flat-modal .btn.btn-primary,
.config-modal .btn.btn-primary,
.galleryController .btn.btn-primary {
  background-color:#2d343e !important;
  border: none;
}
.flat-modal .btn.btn-primary:hover,
.config-modal .btn.btn-primary:hover,
.galleryController .btn.btn-primary:hover {
  background-color:#3c4451 !important;
}
.flat-modal .btn.btn-default,
.flat-modal .btn.btn-default:hover,
.config-modal .btn.btn-default,
.config-modal .btn.btn-default:hover,
.galleryController .btn.btn-default,
.galleryController .btn.btn-default:hover
{
  background-color: #9B9EA5 !important;
}
.modal-footer .btn + .btn { margin-left: 15px; }
.config-modal .btn,
.modal-dialog .btn {
  width: auto;
  color: #fff;
  border: none;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  padding: 16px 48px;
  min-width: 145px;
  line-height: 22px;
  font-size: 13px;
}
.modal-dialog .btn.btn-primary
 {
  background-color:#2d343e;
  border:none;
}
.modal-dialog .btn.btn-primary:hover,
.modal-dialog .btn.btn-primary:focus {
 background-color: #3c4451;
}
.modal-dialog .btn.btn-default,
.modal-dialog .btn.btn-default:hover
{
  background-color: #9B9EA5;
}

.flat-site-spacelimit-modal .btn.btn-box { background-color: #fff; padding: 10px 25px; }
.modal-default.flat-site-spacelimit-modal .modal-content { background-color: rgba( 33, 35, 39, 0.9 ); width:410px;}
.modal-default.flat-site-spacelimit-modal .modal-content .modal-body {padding: 20px 30px 40px 30px;}
.modal-default.flat-site-spacelimit-modal .modal-content button.close { z-index: 999; position:relative; color:#848685;}
.modal.modal-default.flat-site-spacelimit-modal h3.modal-title {  font-size:20px; color:#fff; display:inline-block; text-align:center; padding:0!important; margin-left:35px;}
.modal-default.flat-site-spacelimit-modal .site-space-icon { color: #518de5; font-size: 29px; opacity: 1; position: absolute; left: 9%; }
.flat-site-spacelimit-modal .site-space-disk p {color:#fff; font-size:13px; line-height: 1.7; letter-spacing: -0.4px;}
.flat-site-spacelimit-modal .btn-diskspace-limit {color: #2d343e; display:block;}

#el-fileupload .modal-close {
  position: absolute;
  font-size: 28px;
  top: 3px;
  right: 6px;
}

#recognition { min-height: 100px !important; }

/* 15-07-31 footer 추가 - 정상훈 */
/*
footer { overflow: hidden; clear: both; background-color: #fbfbfb; font-size: 12px; padding: 20px; text-align: right; }
.footer .footer_info .logo-wrap .navbar-brand img{ width: 180px; }
.footer .footer_info .panel { border: none !important; box-shadow: none;  background: none; padding: 0 !important; margin: 0 !important; }
#fheading01, #fheading02, #fheading03{ padding-top:0; border: none; }
.footer .footer_info > div > .panel-group .panel > .panel-heading  + .panel-collapse .panel-body { border: none !important; }
.footer .panel-heading { display: none; border: none; text-align: left;  padding: 0; margin: 0; }
.footer .footer_info > div > .panel-group .panel:nth-of-type(4) > .panel-heading { display: block; }
.footer .footer_info > div > .panel-group .panel:nth-of-type(4) > .panel-heading a {font-size: 13px; color: #2a6496;}
.footer .footer_info > div > .panel-group .panel:nth-of-type(4) .socialiconbox { display: none; }
.footer .panel-collapse { display: block; text-align: left; border: none; }
.footer .footer_info > div > .panel-group .panel .panel-body > li > a { font-size: 11px;padding-top:0px;  color: #a8aaac; }
.footer .socialiconbox { overflow: hidden;  margin-top: 15px;}
.footer .socialiconbox li { float: left; }
.footer .footer_logo { text-align: center; }
.footer .footer_logo address, .footer .footer_logo .company { font-size: 11px; color: #a4a4a4}
.footer .footer_logo address, .footer .footer_logo .company span{position: relative; padding: 0px 13px; line-height: 1.5; display: inline-block;}
.footer .footer_logo .company span + span:before { content: ''; display: inline-block; position: absolute; top: 3px;left: 0; width: 2px; height: 10px; background-color: #dde1e2;}

@media only screen and (max-width: 992px){
  .footer .footer_info > div > .panel-group { overflow: hidden; width: 100%; padding: 15px 0 0; }
  .footer .footer_info > div,
  .footer .footer_info > div > .panel-group .panel { padding: 0; }
  .footer .footer_info > div > .panel-group .panel { float: left; }
  .footer .footer_info > div > .panel-group .panel:nth-of-type(2) { margin-bottom:15px !important;  }
  .footer .footer_info > div > .panel-group .panel:nth-of-type(3) { position: absolute; right: 0; width: 50%; }
  .footer .footer_info > div > .panel-group .panel:nth-of-type(4) { position: relative; width: 100%; border-radius: 0 !important; background: #f2f2f2; }
  .footer .footer_info > div > .panel-group .panel > .panel-heading { padding-top: 0; padding-bottom:; }
  .footer .footer_info > div > .panel-group .collapse { display: block !important; }
  .footer .footer_info > div > .panel-group .panel:nth-of-type(4) > .panel-heading { border: none !important; background: #f2f2f2; padding: 15px 0 15px 15px !important; }
  .footer .footer_info > div > .panel-group .panel:nth-of-type(4) .socialiconbox { position: absolute; top: 0; right: 15px; display: block; margin: 13px 0 0; }
  .footer .footer_info > div > .panel-group .panel:nth-of-type(4) .socialiconbox i { font-size: 15px; margin: 0 10px; }
  .footer .footer_info > div > .panel-group .panel-body { padding: 0 20px 10px; }
  .footer .footer_info > .logo-wrap { display: none; text-align: center; padding-top: 40px; padding-bottom: 25px;}
  .footer .footer_info > .logo-wrap > .navbar-brand { float: inherit; }
  .footer .footer_info > .lang-wrap { display: none; }
  .footer .footer_info > .soical-wrap { display: none; }
  .footer .footer_logo .company { text-align: left; padding: 0 15px 0; }
  .footer .footer_logo .company span { display: block; padding: 0 5px 0 0; }
  .footer .footer_logo .company span + span:before { display: none; }
  .footer .footer_logo .company span:nth-of-type(4),
  .footer .footer_logo .company span:nth-of-type(5) { display: inline; }
  .footer .footer_logo address { width: 100%; text-align: left; margin: 5px 0 15px; }
}

@media only screen and (max-width: 767px){
  #about { padding-top: 90px; }
  .footer .footer_info > div > .panel-group .panel:nth-of-type(4) { border: none !important; padding: 0 !important; margin: 0 !important; }
}
*/

/*modal 공통 CSS*/
.modal-content { border-radius: 0; }
.modal-header { padding: 40px 40px 0; border-bottom: none; }
.modal-header .close { margin-top: -15px; margin-right: -15px; }
.modal-footer { padding:  0 40px 40px; border-top: none;}
.modal-footer .btn { line-height: 1.4; padding: 10px 48px; }

.-browser-list { margin-top:20px;margin-bottom:5px;}
.-browser-list li { display:inline-block;padding:0px 10px; font-family: Raleway; cursor:pointer; }
.-browser-list li a { color:#333; text-decoration: none;}
.td-cell { display:table-cell !important;}

.-browser-chrome-optimized { font-family: 'Noto Sans KR', 'Open sans'; position: relative; margin-top: 60px; }
.-browser-chrome-optimized > li > img { max-width: 100%; }
.-browser-chrome-optimized > li > h1 { font-size: 30px; color: #25272b; font-weight: lighter; margin-top: 40px; margin-bottom: 15px; }
.-browser-chrome-optimized > li > p { font-size: 15px!important; color: #9b9ea5; font-weight: 300; line-height: 1.6; }
.-browser-chrome-optimized li a,
.-browser-chrome-optimized li a:hover,
.-browser-chrome-optimized li a:focus { 
  font-size: 15px;
  color: #ffffff; 
  background-color: #4789e7;
  display: inline-block; margin: 0 auto; 
  -webkit-border-radius: 5px; 
  -moz-border-radius: 5px; 
  border-radius: 5px; 
  min-width: 210px;
  padding: 15px;
  margin-top: 30px;
  margin-bottom: 50px;
 }


/*menu: mini-home*/
#mini-home { position: absolute; top:0; left:30px; display: none; font-size: 22px; cursor: pointer; }


/*180822 add*/
/*footer: creatorlink box & footer (before)*/
*[data-type="footer"] .creatorlink-box,
*[data-type="footer"] .creatorlink-footer { display: none; }

/*made it with creatorlink*/
.made-with-creatorlink {
  z-index: 1020;
  position: fixed! important;
  bottom: 15px; right: 20px; 
  height: 62px;
  padding: 18px 23px;
  font-family: 'Noto Sans KR', 'Open Sans';
  font-size: 12px;
  font-weight: normal;
  background-color: rgba(34,34,34,0.93);
  line-height: 1;
  vertical-align: middle;
}
.made-with-creatorlink * {
    font-size:12px;  
}    
.made-with-creatorlink .made-with-creatorlink-close {
  position: absolute;
  cursor: pointer;
  top: 5px; right: 5px;
  float: unset;
  background-color: transparent;
  border: none;
  margin: 0;
  padding: 0;
  height: auto;
  line-height: 1;
}
.made-with-creatorlink a.made-creatorlink-link,
.made-with-creatorlink a.made-creatorlink-link:hover,
.made-with-creatorlink a.made-creatorlink-link:focus,
.made-with-creatorlink a.made-creatorlink-link:active {
  color: #919191;
  text-decoration: none;
  display: inline-block;
}
.made-with-creatorlink a.made-creatorlink-link > img { display: inline-block;}
.made-with-creatorlink a.made-creatorlink-link > span { 
    margin: 0 0 0 10px;
    vertical-align: middle;
    line-height: 1.4;
    display: inherit;
}
.made-with-creatorlink a.made-creatorlink-link > span > strong { color: #ffffff; font-weight: normal; }

@media only screen and (min-width: 481px) {
  .made-with-creatorlink { padding-top: 16px; }
  .made-with-creatorlink .made-with-creatorlink-close > p { margin-bottom: 9px; }
  .made-with-creatorlink .made-with-creatorlink-close img { width: 9px; }
  .made-with-creatorlink a.made-creatorlink-link > img.icon-logo { margin-top: 1px; }
}
@media only screen and (max-width: 480px) {
  .made-with-creatorlink { padding: 10px 23px; right: 0; bottom: 0; left: 0; width: 100%; height: auto; text-align: center; }
  .made-with-creatorlink .made-with-creatorlink-close { top: 14px; right: 15px; }
  .made-with-creatorlink > p {margin-bottom:0;}
  .made-with-creatorlink a.made-creatorlink-link img.icon-logo { max-width: 19px; }
}
@media only screen and (max-width: 480px) and (min-width: 341px) {
  .made-with-creatorlink a.made-creatorlink-link > img,
  .made-with-creatorlink a.made-creatorlink-link > span { float: none; }
  .made-with-creatorlink a.made-creatorlink-link > span > br { display: none; }
}
@media only screen and (max-width: 340px) {
  .made-with-creatorlink { padding: 14px 20px 5px 0; }
  .made-with-creatorlink a.made-creatorlink-link > img.icon-logo { margin-top: 5px; }
}

/*footer: creatorlink footer*/
/*180822 delete - powered by Creatorlink 
*[data-type="footer"].el-footer  { display: block! important; }
*[data-type="footer"] .creatorlink-footer { 
  text-align: right; 
  clear: both; 
  margin-top: 5px;
  padding: 0 15px;
  width: 100%;
  float: left;
}
*[data-type="footer"] .creatorlink-footer:before,
*[data-type="footer"] .creatorlink-footer:after {
  display: table;
  content: " ";
  clear: both;
}
*[data-type="footer"] .creatorlink-footer a,
*[data-type="footer"] .creatorlink-footer a:hover,
*[data-type="footer"] .creatorlink-footer a:focus { text-decoration: none; }
*[data-type="footer"] .creatorlink-footer span { 
  font-family: 'Dotum'! important; 
  font-size: 13px! important;
  color: #666666! important; 
  padding: 5px 13px! important; 
  border-width: 1px! important;
  border-style: solid! important;
  border-color: #000000! important;
  background-color: #ffffff! important;
  -moz-border-radius:3px! important; 
  border-radius:3px! important; 
  display: inline-block;
  line-height: 1.1;
  box-shadow: 1px 1px #000000! important;
  letter-spacing: 0.009em;
}
*[data-type="footer"] .creatorlink-footer span > b {
  font-size: 15px! important;
  color: #000000! important; 
}
*/


/*footer: creatorlink footer, before*/
/*180822 delete - powered by Creatorlink 
*[data-type="footer"] .creatorlink-box { text-align: right; padding-left:0; white-space: nowrap;}
.header.el-menu.sidebar ~ *[data-type="footer"] .creatorlink-box { padding-right: 0; }
*[data-type="footer"] .creatorlink-box a,
*[data-type="footer"] .creatorlink-box a:hover,
*[data-type="footer"] .creatorlink-box a:focus { text-decoration: none; }
*[data-type="footer"] .creatorlink-box span { 
  font-family: 'Dotum'! important; 
  font-size: 12px; 
  padding: 3px 5px; 
  border-width: 1px;
  border-style: solid;
  -moz-border-radius:3px; 
  border-radius:3px; 
  display: inline-block;
  line-height: 1.2;
}

@media only screen and (min-width: 992px) and (max-width: 1200px) {
  *[data-type="footer"] .col-md-10,
  *[data-type="footer"] .col-md-2 { width: 100%!important;}
}

@media only screen and (max-width:1200px) {
    *[data-type="footer"],
    *[data-type="footer"] .creatorlink-box { text-align: center; }
}
*/



@media only screen and (max-width: 1440px) {
  .traffic-limit-modal .inner-box p { width: 100%; margin-top: 10px; margin-left: 0; margin-bottom: 0;}
  .traffic-limit-modal .inner-box p + p { width: 100%; margin-top: 0; margin-bottom: 10px; text-align: center; }
  .traffic-limit-modal .inner-box p img { margin-right: 8px; }

  .traffic-limit-modal.creatorlink-gabia  .inner-box p { margin-bottom: 10px; }
}
@media only screen and (min-width: 769px) {
  .fixed #mini-home {
    display: inline-block;
  }
}

/*mobile-pcWeb*/
.product.mall-product-detail-wrap ~ .mobilepc_ch { display: none; }
.mobilepc_ch[data-desktop-option="mobile_pc"] ~ *[data-type="footer"].el-footer:after { 
  content: ' ';
  display: inline-block;
  height:180px;  width: 100%;
  clear: both;
  position: relative;
}
.mobilepc_ch {
  background-color : #373737;
  padding : 15px 0;
  text-align : center;
  position: fixed;
  width: 100%;
  bottom:0px;
  z-index:19;
}

.mobilepc_ch p {
  display: inline-block;
  margin:0;
  font-size:16px;
  color:#fff;
  vertical-align: middle;
}

.mobilepc_ch .mpc-name {
  font-family: 'Open Sans', 'Nanum Gothic';
}

.mobilepc_ch[data-desktop-option="mobile_web"] i.mpc_icon {
  font-size:22px;
  margin-right:9px;
}

.mobilepc_ch i.mpc_icon {
  font-size: 100px;
  color: #fff;
  margin-right: 20px;
  vertical-align: middle;
} 
.mobilepc_ch[data-desktop-option="mobile_pc"] {
  padding:20px 0;
  bottom: 0;
  width: 100%;
  left: 0;
}
.mobilepc_ch[data-desktop-option="mobile_pc"] p {
  font-size:27px;
}
.mobilepc_ch[data-desktop-option="mobile_pc"] i.mpc_icon {
  font-size: 45px;
}
.dsgn-body .element.mobilePc_height {
  min-height: auto;
  height:40%;
}
*[data-type="footer"].el-footer.mpcwebheight:after{ 
  content: ' ';
  display: inline-block;
  height: 75px;  width: 100%;
  clear: both;
  position: relative;
}
.goto-top.moveMpc { bottom: 160px; }
#cl-music-player-icon.moveMpc, .goto-top.gotoMpc,
#cl-music-player-icon.show.moveMpc + #cl-music-player + #cl-music-container { bottom: 120px; }

.goto-top.movepc,
#cl-music-player-icon.movepc,
#cl-music-player-icon.show.movepc + #cl-music-player + #cl-music-container { bottom: 160px; }

.goto-top.movedOne { bottom: 110px;}
#cl-music-player-icon.movedOne,
#cl-music-player-icon.show.movedOne + #cl-music-player + #cl-music-container { bottom: 70px; }


/*mobile-fnav*/
.product.mall-product-detail-wrap ~ .fnav { display: none; }
.fnav[class*=fnav] {
  display: table;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  background-color: #000000;
  color: #ffffff;
  font-size: 16px;
  line-height: 1.2;
  z-index: 19;
}
.fnav[class*=fnav-] > .fnav-item {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  padding: 0 4.5px;
  width: 1%;
  -webkit-transition: width .3s ease-in-out;
  -moz-transition: width .3s ease-in-out;
  -ms-transition: width .3s ease-in-out;
  -o-transition: width .3s ease-in-out;
  transition: width .3s ease-in-out;
}
.fnav[class*=fnav-] > .fnav-item > a {
  display: block;
  padding: 17px 0px;
  cursor: pointer;
}
.fnav[class*=fnav-] > .fnav-item > a,
.fnav[class*=fnav-] > .fnav-item > a:hover,
.fnav[class*=fnav-] > .fnav-item > a:focus,
.fnav[class*=fnav-] > .fnav-item > a:active {
  text-decoration: none;
  color: #fff;
}
.fnav[class*=fnav-] > .fnav-item .fa {
  font-size: 18px;
  vertical-align: middle;
  width: 18px; height: 18px;
}
.ellist-content .fnav[class*=fnav] {
  position: absolute;
}

@media only screen and (min-width: 481px) {
  .fnav + *[data-type="footer"].el-footer { margin-bottom: 0; }
  .fnav[class*=fnav] { display: none; }
  .ellist-content .fnav[class*=fnav] { display: block; }
}
@media only screen and (max-width: 480px) {
  .fnav ~ *[data-type="footer"].el-footer:after { 
    content: ' ';
    display: inline-block;
    height: 55px;  width: 100%;
    clear: both;
    position: relative;
  }
}






.btn.btn-round { height:37px; line-height: 37px; color:#aaa; border:1px solid #ccc; background-color:#fff; padding:0px 20px; border-radius: 20px; min-width:120px; text-align:center; font-size:13px; }
.btn.btn-round:hover { color:#666; border-color:#666;}

.page-comments { font-family: 'Nanum Gothic'; padding-top: 50px; background-color: transparent; position: relative; }
.tpl-comment-form {font-size:12px; padding:15px 15px 15px 10px; border:1px solid #E8E8E8; background-color:#fff;box-shadow: 0px 0px 1px #E8E8E8; margin:0 auto;}
.forum-view.w740 ~ .page-comments .tpl-comment-form,
.forum-view.w740 ~ .page-comments .comment-list { max-width:740px;}
.comment-addform.password { width:85%; margin:0 auto;}
.tpl-comment-form.reply-form,
.tpl-comment-form.update-form { margin-top:10px; position: relative;}
.tpl-comment-form .cm-cancel { font-size:15px; color:#aaa; cursor: pointer; position: absolute; right: 10px; top: 5px;}
.comment-addform .form-control,
.tpl-comment-form .form-control { border-radius: 0px;}
.comment-addform.form-inline { margin-bottom:5px; text-align: left;}
.comment-addform.form-inline > .form-group { width:100%;}
.comment-addform input { margin-bottom:5px;}
.tpl-comment-form .comment-textarea { width:100%; }
.tpl-comment-form .comment-textarea td.form-profile,
.comment-list td.form-profile { width:51px; text-align:center; vertical-align: top;}
.tpl-comment-form .comment-textarea td.form-submit { width:130px; text-align:right;}
.tpl-comment-form .comment-textarea td,
.comment-list td { text-align:left; vertical-align: top;}
.tpl-comment-form .comment-textarea .checkbox input[type="checkbox"] { margin-left: -19px; }
.tpl-comment-form #update-secret,
.tpl-comment-form #reply-secret,
.tpl-comment-form #comm-secret { opacity: 0; }
.tpl-comment-form #update-secret + #update-secret-icon,
.tpl-comment-form #reply-secret + #reply-secret-icon,
.tpl-comment-form #comm-secret + #comm-secret-icon { float: left; margin-left: -22px; margin-top: 2px; font-size: 20px; color: #ddd; }
.tpl-comment-form #update-secret:checked + #update-secret-icon,
.tpl-comment-form #reply-secret:checked + #reply-secret-icon,
.tpl-comment-form #comm-secret:checked + #comm-secret-icon { color: #666; }
.tpl-comment-form .comment-textarea .tooltip .tooltip-inner { max-width: none; }
.tpl-comment-form .comment-textarea .btn-mobile { display:none;}
.tpl-comment-form .comment-textarea .btn-submit { color:#4789E7; border:1px solid #4789E7;min-width: 125px;}
.tpl-comment-form .comment-textarea .btn-submit .fa { margin-right: 1px; margin-top: 1px; }
.tpl-comment-form .comment-textarea textarea {font-size:12px; border:none; box-shadow: none; padding:10px; resize: none;}
.tpl-comment-form ::-webkit-input-placeholder { font-size:13px; text-transform: uppercase;}
.tpl-comment-form input:-moz-placeholder { font-size:13px; text-transform: uppercase;}
.comment-addform.kcaptcha-box { margin-top:10px; overflow: auto; }
.comment-addform.kcaptcha-box #write_option { margin-bottom:0px;}
.comment-addform.kcaptcha-box #wr_key {  font-size: 11px; }
.tpl-comment-form .comment-textarea .checkbox {
    padding-left: 25px;
    margin-top: 0px;
    margin-bottom: 0px;
    border-top: none;
    height: auto;
}
.tpl-comment-form .comment-textarea .checkbox > label { line-height: 24px; color:#666;}
#cl-music-player-icon { 
  position: fixed; 
  display: block; 
  bottom:50px; 
  right: 95px; 
  background-color: rgba(0,0,0,0.1); 
  border-radius: 25px; 
  font-size: 18px; 
  width: 34px; 
  height: 34px; 
  line-height: 34px; 
  text-align: center; 
  color: #aaa; 
  cursor: pointer; 
  z-index: 1020;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
 }
#cl-music-player-icon.moved,
#cl-music-player-icon.show.moved + #cl-music-player + #cl-music-container { 
  bottom: 90px;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
#cl-music-player-icon + #cl-music-player + #cl-music-container { display:none;}
#cl-music-player-icon.show + #cl-music-player + #cl-music-container { display:block;}
#cl-music-container {
  position:fixed; 
  display: block; 
  bottom:50px; 
  right:140px; 
  width:270px; 
  z-index:1090;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}

.comment-list { width:100%; padding:20px 0; margin:0 auto;}
.comment-list > table { width:100%; font-size: 12px;}
.comment-list > table td { text-align:left; }
.comment-list > table td.text-right { text-align:right; white-space: nowrap;}
.comment-list .cm-name { padding-left:5px; color:#333; font-weight: 100;}
.comment-list .cm-name.disabled { color:#ccc;}
.comment-list .cm-time { padding-left:10px; color:#aaa; font-size:11px; font-weight: 100; line-height: 17px;}
.comment-list .cm-controls,
.comment-list .cm-hide { color:#aaa; font-size:11px; display:none;white-space: nowrap; cursor: pointer; padding-left:10px; font-weight: 100;}
.comment-list .cm-content { color:#666; clear:both; padding-top:5px; padding-left:5px; line-height: 180%;white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */  white-space: -webkit-pre-wrap; /*Chrome & Safari */  white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */  white-space: pre-wrap; /* css-3 */  word-wrap: break-word; /* Internet Explorer 5.5+ */  word-break: break-all;  white-space: normal;}
.comment-list .cm-row.line { margin-left:50px; /*background-image:url('https://storage.googleapis.com/i.addblock.net/icon/icon-reply.gif');*/ background-position: 20px 25px; background-repeat: no-repeat;}
.comment-list .cm-row.line.deleted { background-position: 20px 15px;}
.comment-list .user-reply { font-weight: bold; padding-right:5px; color:#333;}

.tpl-comment-form .user-profile-img,
.comment-list .user-profile-img { border-radius: 18px; width: 36px; height: 36px;}
.comment-list .user-profile-img.disabled { display: none;}
.comment-list li { cursor: pointer;}
.comment-list li.cm-row { list-style: none;  padding:20px; border:1px solid #E8E8E8; background-color:#fff;box-shadow: 0px 0px 1px #E8E8E8; margin-bottom: 20px; }
.comment-list li.cm-row:hover, li.cm-row.active { background-color: #FCFCFC;}
.comment-list li.cm-row.add-form:hover { background-color:initial;}
.comment-list dl { position: relative; padding-left:51px; font-size:12px; margin-top:0px; margin-bottom:0px;}
.comment-list dl.disabled { padding-left:10px; margin-bottom:8px; }
.comment-list dl dt { text-align:left;}
.comment-list dl dt.form-profile { width:51px; position:absolute; top:0; left:0; text-align: center; margin:0 auto;}
.comment-list dl dd { text-align: left;}
.flat-modal .modal-body.comment { width:370px; margin:0 auto; max-width: 100%;}
.comment-list .cm-controls.disabled { display:none !important;}
.comment-signForm { display: table; width: 100%; table-layout: fixed; margin-bottom:30px;}
.comment-signForm .signType { display:table-cell; float:none; text-align: center; width:50%; cursor:pointer; vertical-align: bottom; }
.comment-signForm .signType > a,
.comment-signForm .signType > a:hover,
.comment-signForm .signType > a:active { background-color:#fff; border:none; border-bottom: 3px solid #DADBDF; color:#363749; margin:0px; border-radius: none;}
.comment-signForm .signType.active > a, 
.comment-signForm .signType.active > a:hover,
.comment-signForm .signType.active > a:active,
.comment-signForm .signType.active > a:focus { border:none;border-bottom: 3px solid #363749;}
.comment-signForm.nonmember-mode { display: inline-block; margin-bottom: 0; border: none; text-align: right; margin-top: 10px;}
.comment-signForm.nonmember-mode .signType { display: inline-block;  width: auto; }
.comment-signForm.nonmember-mode .signType.active { display: none; }
.comment-signForm.nonmember-mode .signType > a { background-color: transparent; padding: 0; }
.comment-signForm.nonmember-mode .signType > a[aria-controls="anonymous"] { margin-bottom: 30px; }
.comment-signForm.nonmember-mode .signType > a,
.comment-signForm.nonmember-mode .signType > a:hover,
.comment-signForm.nonmember-mode .signType > a:active { border:none; border-bottom: 1px solid #363749; }
.comment-signForm.nonmember-mode .signType.active > a, 
.comment-signForm.nonmember-mode .signType.active > a:hover,
.comment-signForm.nonmember-mode .signType.active > a:active,
.comment-signForm.nonmember-mode .signType.active > a:focus { border:none; border-bottom: 1px solid #363749; }
.comment-signForm.nonmember-mode .signType > a > .fa.fa-user { float: right; margin-top: 3px; margin-left: 2px; }
.comment-signForm.nonmember-mode .signType > a > .fa.fa-user:before { content: '→'; }
.comment-signForm.default-mode + .tab-content .tab-pane .btn-wrap { margin-top: 30px; margin-bottom: 15px; }



@media only screen and (min-width:768px) {
    .tpl-comment-form .comment-textarea .checkbox .fa { 
      font-size: 20px;
      -webkit-transform: translateY(3px); 
      -moz-transform: translateY(3px); 
      -ms-transform: translateY(3px); 
      -o-transform: translateY(3px); 
      transform: translateY(3px); 
    }
}

@media only screen and (max-width:767px) {
    .flat-modal + .modal-backdrop {
      background-color: #000;
    }
    .flat-modal + .modal-backdrop.fade.in {
      opacity: 0.8;
    }
    .tpl-comment-form.update-form,
    .tpl-comment-form.reply-form { padding: 8px 10px 6px; }
    .tpl-comment-form .cm-cancel { top: 5px; right: 9px; }
    .tpl-comment-form.update-form .comment-textarea textarea { padding-left: 0; padding-top: 0; }
    .tpl-comment-form .comment-textarea td.form-submit { display:none;}
    .tpl-comment-form .comment-textarea,
    .tpl-comment-form .comment-textarea .btn { font-size: 16px; line-height: 24px; }
    .tpl-comment-form .comment-textarea .checkbox { margin-right: 15px; }
    .tpl-comment-form .comment-textarea .checkbox > label { line-height: 24px; font-size: 16px; }
    .tpl-comment-form .comment-textarea .btn-mobile-wrap { float: right; }
    .tpl-comment-form .comment-textarea .checkbox,
    .tpl-comment-form .comment-textarea .btn-mobile { float: left; display:block; /* text-align: right; margin-top: 10px; margin-bottom: 15px; */}
    .tpl-comment-form .comment-textarea .btn-mobile { line-height: 1; }
    .tpl-comment-form .comment-textarea .btn-submit { border: none; padding: 0px; height: auto; min-width: 0; margin-bottom: 0; -moz-box-shadow: none; box-shadow: none;}
    .tpl-comment-form .comment-textarea .btn-submit .fa.fa-paper-plane { font-size: 14px; }
    
    .comment-list li.cm-row { padding: 15px 15px 15px 10px; }

    .traffic-limit-modal .inner-box p { line-height: 1.4; padding: 0 15px; }
    .traffic-limit-modal:not(.creatorlink-gabia) .inner-box p img { display: none;  margin: 15px auto 0; max-width: 85px; }
    .traffic-limit-modal .inner-box p span { display: none; }
    .traffic-limit-modal.creatorlink-gabia .inner-box p .limit-txt { display: block; clear: both; margin: 5px 0; line-height: 1.4; }
    .goto-top { right: 20px; }
    #cl-music-container { right:110px; }
    #cl-music-player-icon { right:65px; }
    
    .page-comments { padding-top: 30px; }


    .comment-addform #wr_key.form-control { margin-top: 10px; }
}
@media only screen and (max-width:480px) {
    .projectPage-comment { padding-left:0px !important; padding-right:0px !important; }
    .comment-list .cm-time { display: block; }
    .comment-list .cm-section { clear: both; float: left !important; padding-top: 5px; }
    .flat-modal .modal-body.comment { width:auto !important; }

    .goto-top { bottom: 70px; font-size: 20px; padding: 0px 6px 6px; width: 34px; }
    .goto-top.moved { bottom: 100px; }
    #cl-music-container { bottom:25px; width:240px; right:60px; }
    #cl-music-player-icon { bottom:25px; right: 20px; }
    #cl-music-player-icon.moved,
    #cl-music-player-icon.show.moved + #cl-music-player + #cl-music-container { bottom: 60px; }
    .music-playlist-wrap { width:240px !important; }
}


.flat-modal .login.form-group input {
    box-shadow: none;
    -webkit-box-shadow: none;
    height: auto;
    padding: 9px 12px;
    margin-bottom: 5px;
    -moz-border-radius: 0;
    border-radius: 0;
}

.flat-modal .login.form-group label.forget a {
    text-decoration: underline;
    padding-left: 18px;
    color: #797a7d;
    text-align: right;
    letter-spacing: 0.01em;
    float: right;  
}
.flat-modal .login.form-group { text-align: left;}
.flat-modal .bottom-box { margin-top:17px; margin-bottom:25px;}
.flat-modal .bottom-box.ko { font-size: 12px; }
.menu-logo-top { float:none;}

.config-modal.config .container { padding-right:0px; max-width:800px;}
.config-modal.config .modal-content { padding:0px;}

.config-modal .tab-content { height: 530px; overflow: auto; display:table-cell; background-color: #FCFCFC;}
.config-modal .nav-tabs { border:none;}
.config-modal .nav-tabs > li > a, 
.config-modal .nav-tabs > li > a:hover, 
.config-modal .nav-tabs > li > a:focus,
.config-modal .nav-tabs > li.active > a, 
.config-modal .nav-tabs > li.active > a:hover, 
.config-modal .nav-tabs > li.active > a:focus {
  font-family: 'Open sans';
  color: #9299a0;
  line-height: 40px;
  height: 40px;
  padding:0px 0px 0px 30px;
  margin:0px;
  font-size: 13px;
  font-weight: 600;
  cursor:pointer;
  background-color: transparent;
  border:none;
}
.config-modal .nav-tabs > li.active > a:after {
  position: absolute;
  right: 25px;
  content: '\f105';
  font-family: 'FontAwesome';
  color: #fff;
  font-weight: normal;
  font-size: 16px;
}
.config-modal .nav-tabs > li.active > a, 
.config-modal .nav-tabs > li.active > a > .fa, 
.config-modal .nav-tabs > li.active > a:hover, 
.config-modal .nav-tabs > li.active > a:focus { color:#fff; }

.config-modal .config-wrap { display: table; width: 100%;}
.config-modal .forum-settings { padding: 10px 50px 0px; }
.config-modal .forum-settings li { clear: both; padding:13px 15px; border-bottom:1px solid #F4F4F4; font-size: 13px;line-height: 39px;}
.config-modal .forum-settings li > .title { float: left; width: 130px; text-align: left; font-weight: bold;}
.config-modal .forum-settings li > .content {  padding-left: 130px;}
.config-modal .forum-settings li > .content .desc { font-family: 'Raleway', 'Nanum barun gothic'; font-size: 12px; color: #999; line-height: 1.8; padding-top: 5px;}
.config-modal .forum-settings select::-ms-expand { display: none;}
.config-modal .config-input {
  font-family: 'Open sans','Nanum barun gothic';
  padding: 0px 15px;
  background-color: #EEEEEE;
  border: none;
  width: 150px;
  margin-right: 6px; 
}
.config-modal .tab-pane { height:450px; overflow-y:auto;background-color: #fff;}
.config-modal .config-footer { text-align: right; padding-right: 20px; padding-top: 20px; }
.config-modal .btn-forum-config {
  color: #333;
  background-color: #EEEEEE;
  width: auto;
  text-align: center;
  min-width: 40px;
  padding: 10px 10px 9px;
  margin-top: -2px;
  margin-right: 5px;
}
.config-modal .forum-confirm { line-height: 1.5;}
.config-modal .config-error { color: #cc0000; font-size: 12px; font-weight: bold;}
.config-modal .memberPage .config-error,
.config-modal .memberPage { text-align:center; padding: 0px 50px;}
.config-modal .memberPage .member { width:100%; overflow: auto;font-size: 13px;}
.config-modal .memberPage .member li:hover.none { background-color:transparent;}
.config-modal .memberPage .member li.none { width:100%; text-align: center;border-bottom:none;}
.config-modal .memberPage .member li { width:50%; float:left; text-align: left; overflow: auto;border-bottom:1px solid #EEEEEE; padding: 15px 0px; position: relative;}
.config-modal .memberPage .member li:nth-child(2n):after { clear:both;}
.config-modal .memberPage .member li:hover { background-color: #F5F5F5;}
.config-modal .memberPage .member li .userimg img { width:32px;  border-radius: 16px;}
.config-modal .memberPage .member li .userimg { width: 60px; text-align: center;}
.config-modal .memberPage .member li .userimg,
.config-modal .memberPage .member li .user-info { float: left;}
.config-modal .memberPage .member li .user-info .user-name {vertical-align: middle; font-family: 'Raleway','Nanum Gothic'; font-size: 12px; font-weight: bold; line-height: 18px;}
.config-modal .memberPage .member li .user-info .user-id { font-size:12px; font-family: 'Open sans'; color: #999; font-weight: normal; line-height: 1.4;}
.config-modal .memberPage .member li .userdel { display:none; position: absolute; top:20px; right:10px; color: #999; cursor: pointer; font-size:14px; }
.config-modal .memberPage .member li:hover .userdel { display:block;}
.config-modal .memberPagination { list-style: none; padding-top: 12px; float:left;}
.config-modal .memberPagination li { float:left;}
.config-modal .memberPagination .forum-group-member-pagination.active a { font-weight: bold; color:#333;}
.config-modal .memberPagination .forum-group-member-pagination a {
  padding: 10px 8px;
  text-decoration: none;
  font-family: 'Open sans';
  font-size: 12px;
  color:#999;
}
.config-modal .memberPagination .forum-group-member-pagination a:hover { background-color:#eee; }
.config-modal .forum-member-search {
  float: right;
  line-height: 39px;
  height: 39px;
  font-size: 13px;
}
.config-modal .forum-config-cancel { margin-right: 10px; }
#forum-attach { z-index:1050; }
#forum-attach .modal-body { padding:30px 25px 10px;}
#forum-attach .form-group { text-align:left;}
#forum-attach .modal-footer { margin-top:10px;}
#forum-attach .resource-info { font-weight: normal; letter-spacing: -0.5px;}
#forum-attach #uploadFile { font-size:12px; }
input.form-control.cl-style {
  font-size: 13px;  
  box-shadow: none;
  -webkit-box-shadow: none;
  height: auto;
  padding: 9px 12px;
  margin-bottom: 5px;
  -moz-border-radius: 0;
  border-radius: 0;  
}
.img-forum-responsive { max-width:100%; }
.ModalPlugin svg,
.processModal svg,
.listprogress svg {
  animation: spin 1s linear infinite;
  margin: auto;
  position: absolute;
  height: 40px;
  width: 40px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;  
}
.listprogress svg { position: relative;}
.listprogress svg p { font-size:13px; font-family: Questrial; color:#333;}
.processModal svg circle,
.ModalPlugin svg circle,
.listprogress svg circle {
  fill: transparent;
  stroke: #fff;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-dasharray: 83;
  stroke-dashoffset: 13;
}

.processModal svg circle,
.listprogress svg circle { stroke:#00baff; }
.ModalPlugin svg circle { stroke: #00baff; }

.ModalPlugin > p,
.processModal > p {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  bottom: 0;
  color: #fff;
  margin-top: 30px;  
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

div.data-project-image-bg { position: relative; }
div.data-project-image-bg:before { 
  content: '';
  position: absolute;
  top:0; left:0; right:0; bottom:0;
  width: 100%; height: 100%;
  background-color: rgba(0,0,0,0.3);
}

/*menu lock block*/
.menu-lock-block { 
  position: relative; 
  padding: 20px 0 50px; 
  background-color: #f0f0f0; 
  height: 600px; 
  min-height: 90%; 
  color: #797f86;
  font-size: 14px; 
  font-family: 'Nanum Gothic', 'Open Sans'; 
}
.menu-lock-block .inner-box { 
  position: relative; 
  width: 100%; 
  height: 100%; 
}
.menu-lock-block .form-inline { 
  position: absolute; 
  top: 50%; 
  left: 0; 
  width: 100%; 
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%); 
  -ms-transform: translateY(-50%); 
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.menu-lock-block .form-inline .error-text { 
  display: block; 
  clear: both; 
  color: #FF0000; 
  font-size: 12px;
  letter-spacing: 0.05em; 
  vertical-align: bottom; 
}
.menu-lock-block .text { margin-bottom: 30px; line-height: 1.6; }
.menu-lock-block .form-group { display: block; }
.menu-lock-block .form-control { 
  -moz-border-radius: 3px; 
  border-radius: 3px; 
  max-width: 310px; 
  margin: 0 auto; 
  padding: 10px 12px; 
  height: 42px;
}
              

/*loginout header*/
.creatorlink-header { 
  position: fixed; 
  top:0; left: 0;
  height: 55px;
  max-height: 55px;
  width: 100%;
  background-color: #3c4451; 
  color: #fff; 
  z-index: 26; 
}
.creatorlink-header * { line-height: 55px; }
.creatorlink-header .data-site,
.creatorlink-header .data-user { height: 55px; }
.creatorlink-header .data-user ul { cursor: pointer;}
.creatorlink-header .data-site ul li,
.creatorlink-header .data-user ul li { display: inline-block; float: left; }
.creatorlink-header .data-site ul li span.text { margin-left: 10px; }
.creatorlink-header .data-user ul li span.caret { margin-right: 10px; border-top: 4px solid #fff;}
.creatorlink-header .data-user ul.open li span.caret { border-top: 0px dotted; border-bottom: 4px solid #fff;}
.creatorlink-header .data-user .message ul.sub-menu { margin: 0 5px; position: relative;}
/* about creatorlink header divider__
.creatorlink-header .data-user .message ul.sub-menu:after {
  display: inline-block; 
  content: '' ; 
  position: absolute; 
  right: -15px; top: 16px; 
  width: 2px; 
  height: 24px; 
  border-right: 1px solid #282f39; 
  background-color: #727d8f; 
}*/
.creatorlink-header .data-user .message .newCount { position: relative; }
.creatorlink-header .data-user .message .newCount a,
.creatorlink-header .data-user .message .newCount a:hover,
.creatorlink-header .data-user .message .newCount a:focus { color: #fff; }
.creatorlink-header .data-user .message .newCount .fa { font-size: 16px; }
.creatorlink-header .data-user .message .newCount .badge { 
  position: absolute;
  top: 14px; right: 3px;
  min-width: 20px; 
  background-color: #00a0fe; color:#fff; 
  -moz-border-radius: 2px; 
  border-radius: 2px; 
  padding: 2px 3px;
  font-size: 10px; 
  font-weight: 100; 
  line-height: 1;
}
.creatorlink-header .profile-img { padding-top: 10px; line-height: 1; max-height: 55px;}
.creatorlink-header .profile-img .hexagon { height: 32px; }
.creatorlink-header .profile-img .hexagon svg { width: 32px; height: 32px; }
.creatorlink-header + .popover {
  display: none;
  position: fixed;
  top: 53px; left: inherit; right: 30px;
  min-width: 180px;
  padding: 10px 0 15px;
  -moz-border-radius: 0;
  border-radius: 0;
  border: 1px solid #dad9de;
  background-color: #fff;  
}
.creatorlink-header + .popover .arrow,
.creatorlink-header + .popover .arrow:after { border-width: 8px; }
.creatorlink-header + .popover.bottom > .arrow {
  left: inherit; right: 20px;
  border-bottom-color: #dad9de;
  border-bottom-color: rgba(218,217,222,0.9);
  top:-16px;
  margin-left: -8px;
}
.creatorlink-header + .popover.bottom .arrow:after { top: -6px; margin-left:-8px; }
.creatorlink-header + .popover .popover-content { padding: 0;}
.creatorlink-header + .popover .popover-content a {
  font-family: 'Raleway', 'Nanum Gothic';
  color: #3c4451; text-decoration: none;
}
.creatorlink-header + .popover .popover-content a:hover,
.creatorlink-header + .popover .popover-content div:hover a { 
  color: #ffffff;
}
.creatorlink-header + .popover .popover-content div { position: relative; }
.creatorlink-header + .popover .popover-content div a { padding: 4px 22px; width: 100%; display: block;}
.creatorlink-header + .popover .popover-content div.item { cursor: pointer; }
.creatorlink-header + .popover .popover-content div.item:hover { background-color: #4789e7; }
.creatorlink-header + .popover .popover-content div.user-name { padding: 10px 22px; color: #000000; background-color: #fff;}
.creatorlink-header + .popover .popover-content div > a > img { margin-right: 10px; }
.creatorlink-header + .popover .popover-content div > a > img.active { display: none; }
.creatorlink-header + .popover .popover-content div:hover > a > img { display: none; }
.creatorlink-header + .popover .popover-content div:hover > a > img.active { display: inline-block; }

@media only screen and (min-width: 992px) {
  .creatorlink-header .data-site { text-align: center; }
  .creatorlink-header .data-site ul { display: inline-block; width: auto;  }
  .creatorlink-header .data-user ul { margin-right: 5px; margin-left: 20px; }
}
@media only screen and (max-width: 991px) {
  .creatorlink-header + .popover { right: 20px; }
  .creatorlink-header .logo-text { display: none; }
  .creatorlink-header .data-site { padding-right: 0; }
  .creatorlink-header .data-user { padding-left: 0; }
  .creatorlink-header .data-user ul li span.caret { margin-right: 4px; }
  .creatorlink-header .data-user .message .newCount .fa { margin-right: 10px; }
  .creatorlink-header .data-user .message .newCount .badge { right: -2px; }
}


/*loginout modal*/
.main-login.modal .modal-dialog {
  max-width:510px;
  margin-top:100px;
}
.main-login.modal .modal-dialog .modal-body { padding:20px 59px 50px;}
.main-login.modal .modal-header { 
  border:none;
}
.main-login.modal .modal-dialog .modal-content {
  -moz-border-radius: 0;
  border-radius: 0;
  min-height: 460px;
}
.main-login.modal .login {
  margin-top:20px;
}
.main-login.modal .login .form-control[readonly] {
  background-color: #fff;
}
.main-login.modal .login .form-control,
.modal-default.modal .re-login .form-control {
  box-shadow: none;
  -webkit-box-shadow:none;
  height:auto;
  padding: 9px 12px;
  margin-bottom: 10px;
  -moz-border-radius: 0;
  border-radius: 0;
  border:1px solid #ccc;
}
.main-login.modal .login label,
.modal-default.modal .re-login label { 
  display: inline-block; 
  font-family: 'Raleway', 'Nanum Gothic';
  font-size: 12px; 
  letter-spacing: 0.05em; 
  vertical-align: bottom;
}
.main-login.modal .login label.remember,
.main-login.modal .login label.remember span, 
.modal-default.modal .re-login label.remember,
.modal-default.modal .re-login label.remember span {
  color:#2d343e;
  font-weight: 400; 
  display: none;/*keep login*/
}
.main-login.modal .login label.forget,
.main-login.modal .login label.forget a,
.modal-default.modal .re-login label.forget,
.modal-default.modal .re-login label.forget a { 
  color: #2d343e; 
  text-decoration: underline;  
  padding-left:18px;
  color:#797a7d;
  text-align: right;
  letter-spacing: 0.01em;
  float: right;/*keep login*/
}
.main-login.modal .btn-primary,
.modal-default.modal .btn-wrap.re .btn-primary {
  font-family: 'Raleway', 'Nanum Gothic';
  background-color: #2d343e;
  border:none;
  padding: 13px 0px;
  font-weight: 500;
  font-size: 13px;
  -moz-border-radius: 0;
  border-radius: 0;
  width: 100%;
}
.main-login.modal .btn-primary:hover,
.main-login.modal .btn-primary:focus,
.modal-default.modal .btn-wrap.re .btn-primary:hover,
.modal-default.modal .btn-wrap.re .btn-primary:focus {
  background-color: #3c4451;
}
.main-login.modal .btn-info {
  font-family: 'Raleway', 'Nanum Gothic';
  background-color: #46505d;
  border: none;
  padding: 18px 0px;
  font-weight: 500;
  font-size: 13px;
}

.main-login.modal .btn-wrap,
.modal-default.modal .btn-wrap.re { margin:20px 0;}
.flat-modal .btn-wrap .btn-fblogin,
.main-login.modal .btn-wrap .btn-fblogin,
.modal-default.modal .btn-wrap.re .btn-fblogin { background-color: #3b5999; padding:0; line-height: 48px;}
.flat-modal .btn-wrap .btn-fblogin:hover,
.flat-modal .btn-wrap .btn-fblogin:focus,
.main-login.modal .btn-wrap .btn-fblogin:hover, 
.main-login.modal .btn-wrap .btn-fblogin:focus,
.modal-default.modal .btn-wrap.re .btn-fblogin:hover, 
.modal-default.modal .btn-wrap.re .btn-fblogin:focus { background-color: #4866a6; }
.flat-modal .btn-wrap .btn-fblogin i.fa,
.main-login.modal .btn-wrap .btn-fblogin i.fa,
.modal-default.modal .btn-wrap.re .btn-fblogin i.fa { margin-right: 10px ; font-size: 26px; position: relative; top: 4px;}
.flat-modal .btn-wrap .hr-box,
.main-login.modal .btn-wrap .hr-box,
.modal-default.modal .btn-wrap.re .hr-box { position:relative; }
.main-login.modal .btn-wrap hr { margin-top: 20px; margin-bottom: 20px; border: 0;}
.flat-modal .btn-wrap hr,
.main-login.modal .btn-wrap hr,
.modal-default.modal .btn-wrap.re hr { border-top: 1px solid #dadbde; }
.flat-modal .btn-wrap hr:before,
.main-login.modal .btn-wrap hr:before,
.modal-default.modal .btn-wrap.re hr:before { content: 'or'; color: #bfc0c5; display: inline-block; position: absolute; top:-12px; left:50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); background-color:#ffffff; padding:0 4px; }

.main-login.modal .bottom-box { text-align: center; font-family: 'Raleway', 'Nanum Gothic'; font-size: 12px; letter-spacing: 0.01em; color:#797a7d; margin: 40px 0 0; }
.main-login.modal .bottom-box a { font-size: 14px; font-weight: bold; color: rgb(238, 68, 95); text-decoration: underline; margin-left: 4px; }

.main-login.modal input[type="checkbox"],
.modal-default.modal .re-login input[type="checkbox"] { display:inline-block; width:20px; height: 20px;-webkit-appearance:none; vertical-align: middle; -moz-border-radius: 0;border-radius: 0; border:0; background:url(https://storage.googleapis.com/i.addblock.net/checkbox-off.png) no-repeat 0 0; margin-top:0;}
.main-login.modal input[type="checkbox"]:checked,
.modal-default.modal .re-login input[type="checkbox"]:checked { background:url(https://storage.googleapis.com/i.addblock.net/checkbox-on.png) no-repeat 0 0; }

/* facebook button disabled */
.flat-modal .btn-wrap .btn-fblogin.btn-warning,
.flat-modal .btn-wrap .btn-fblogin.btn-warning:hover,
.flat-modal .btn-wrap .btn-fblogin.btn-warning:focus,
.pf-login-form .submit .btn-fblogin.btn-warning,
.pf-login-form .submit .btn-fblogin.btn-warning:hover,
.pf-login-form .submit .btn-fblogin.btn-warning:focus,
.main-login.modal .btn-wrap .btn-fblogin.btn-warning,
.main-login.modal .btn-wrap .btn-fblogin.btn-warning:hover, 
.main-login.modal .btn-wrap .btn-fblogin.btn-warning:focus,
.modal-default.modal .btn-wrap.re .btn-fblogin.btn-warning,
.modal-default.modal .btn-wrap.re .btn-fblogin.btn-warning:hover, 
.modal-default.modal .btn-wrap.re .btn-fblogin.btn-warning:focus { 
  background-color: #e6e8ec!important; 
  color: #b0b4bb!important; 
  cursor: default; 
}

@media only screen and (max-width: 479px) {
.main-login.modal .modal-dialog .modal-content { min-height: 400px; }
.main-login.modal .modal-header .close { margin-top:0; margin-right: 0; }
.main-login.modal .modal-dialog { margin-top: 0; }
.main-login.modal .modal-header { padding:20px 20px 0; }
.main-login.modal .modal-dialog .modal-body { padding: 0 20px 20px 20px; }
.main-login.modal .login { margin-top: 20px;  }
.main-login.modal .login .col-xs-6 { width: 100%; }
.main-login.modal .btn-wrap,
.main-login.modal .btn-wrap.re { margin: 0; }
.main-login.modal .bottom-box { margin-top: 10px; }
.main-login.modal .btn-primary,
.main-login.modal .btn-wrap.re .btn-primary { padding: 10px 0; }
.main-login.modal .btn-wrap .btn-fblogin
.main-login.modal .btn-wrap.re .btn-fblogin { line-height: 42px; }
}

li.loginout { display: none; }

.tpl-share-sns { text-align: left;margin-left: 30px;margin-bottom:30px;}
.tpl-share-sns li { display:inline-block; font-size:25px; padding:10px; color:#aaa; cursor:pointer; text-align: left; }
.tpl-share-sns li .fa { width:25px; }
.tpl-share-sns li span.tpl-share-sns-name { text-transform: uppercase; font-family: 'Open sans'; position: relative; top:-3px; font-size:15px;width: 100px;display: inline-block;}
.tpl-share-sns li { color:#333;}
.tpl-share-sns li .fa-facebook-official { color: #46629E;}
.tpl-share-sns li .fa-twitter-square { color: #31B5E5;}
.tpl-share-sns li .fa-google-plus-square { color: #E25641;}
.tpl-share-sns li .fa-pinterest-square { color: #D2242C;}
.tpl-share-sns li .fa-tumblr-square { color: #305175;}

.tpl-project-page-footer { }
.modal-dialog.w575.sub-page .modal-body { text-align:left !important; padding-bottom:40px !important; }
.modal-dialog.w575.sub-page .modal-title { text-align:left !important; padding-left:0px !important; font-size:26px !important; letter-spacing: -1px  !important; font-weight: 400  !important;}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
.loading-dots {
    display: block;
    background: black;
    height: 8px;
    width: 8px;
    border-radius: 12px;
    position: relative;
    animation: flash 2000ms infinite;
    margin:0 auto;
}
.loading-dots:before, .loading-dots:after {
    content: '';
    position: absolute;
    left: 16px;
    background: #CCC;
    height: 8px;
    width: 8px;
    border-radius: 12px;
    animation: flash 2000ms 500ms infinite; /* 500ms is the delay */
}
.loading-dots:after {
    left: 32px;
    animation-delay: 1000ms;
}
@keyframes flash {
    from  {
        background: black;
    }
    to {
        background: #CCC;
    }
}
.gallery-loading-status { margin-top:10px; margin-left:-30px; margin-bottom:10px; }
.forum-loading-status { margin-top: 20px; margin-left:-30px; margin-bottom: 10px; }
.fr-toolbar { padding:0 !important; border-top: 2px solid #666 !important;}
.fr-popup { border-top: 2px solid #666 !important;}
.fr-toolbar.fr-inline .fr-arrow,.fr-popup .fr-arrow { border:none !important;}
.fr-toolbar.fr-inline .fr-command.fr-btn { float:left !important; width:45px; border-left:1px solid #eee;}
.fr-popup .fr-buttons .fr-btn {  width:45px !important; border-left:1px solid #eee; }
.fr-toolbar .fr-command.fr-btn, .fr-popup .fr-command.fr-btn { margin:0 !important; color:#555 !important;}
.fr-toolbar .fr-command.fr-btn i, .fr-popup .fr-command.fr-btn i { margin:12px 15px !important; color:#555;}
.fr-toolbar .fr-command.fr-btn.fr-dropdown::after, .fr-popup .fr-command.fr-btn.fr-dropdown::after { right: 3.75px !important; border-color:#888;}
button[data-cmd="linkList"]::after { right: 2px !important; border-color:#888;}
.fr-link-insert-layer input[name="text"], .fr-link-insert-layer input[name="text"] + label { display: none;}
.link-empty-info.image-link { padding-top:3px; padding-left:0px;}
*[data-edit="true"] *[contenteditable="true"] { cursor: text !important;}
img.fr-dib.forum-item-wrap { max-width: initial !important; }
.fr-file:before { content:'\f0c6' !important; font-family:'FontAwesome'; margin-right:5px;}
.fr-file:after { content:'' !important; font-family:'FontAwesome';}

#flat-modal .element .container { width:initial;}
.flat-modal .form-horizontal .form-group { margin-left:0; margin-right:0px; }
.flat-modal #flat-modal.event .modal-dialog { max-width:850px; width:850px;}
@media only screen and (max-width:768px) {
.flat-modal #flat-modal.event .modal-dialog { width:90%;}
}

.flat-modal #flat-modal.event .modal-dialog .modal-body { text-align: left;}
.flat-modal #flat-modal.event .modal-dialog .modal-content { padding:0px; }
.flat-modal #flat-modal.event .modal-dialog .modal-body > button,
.flat-modal #flat-modal.event .modal-dialog .modal-body > .modal-title { display:none; }
.flat-modal .modal { -webkit-overflow-scrolling: auto;z-index: 1042; }
.modal-open { overflow: hidden;}

.modal-open {
  /*position: fixed;*/
  width: 100%;
  overflow: hidden;
}
.element-disabled { display: none;}
.mode-config .element-disabled { display: block;}
.flat-modal .element-disabled { display: block;}

.invisible { visibility: hidden;}
.loading { background-image:url(https://storage.googleapis.com/i.addblock.net/working.gif); background-position: center center; background-repeat: no-repeat; background-size: initial;}
/*.no-fixed { position:absolute;}*/

.preloading { 
  position: relative;
  height:50px !important;
  overflow: hidden !important;
}
.preloading > * { display:none !important;}
.preloading:before {
  content: '';
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:1;
}
.preloading:after {
    content: '';
    position: absolute;
    top: 32px;
    left: 0px;
    right: 0;
    bottom: 0;
    /*background: url(https://storage.googleapis.com/i.addblock.net/working.gif) center center no-repeat;*/
    z-index: 1;
    width: 36px;
    height: 36px;
    text-align: center;
    margin: 0 auto;
    background-color: transparent;
    border-radius: 18px;
}
iframe[name="google_conversion_frame"] { display:none !important;}
.pace {
  -webkit-pointer-events: none;
  pointer-events: none;

  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.pace-inactive {
  display: none;
}
.pace-disable .pace .pace-progress { top:-2px;}
.pace .pace-progress {
  background: #29d;
  position: fixed;
  z-index: 2000;
  top: 0px;
  right: 100%;
  width: 100%;
  height: 2px;
}

.jp-controls {
    display: block;
    position: relative;
    height: 34px;
    background: rgba(0,0,0,0.1);
    color: #969696;
    padding: 5px 0px;
    border-radius: 5px;
    z-index: 996;
}
.music-player-controls {
    position: absolute;
    left: 15px;
}
.music-player-controls span { font-size:10px; padding:7px; cursor: pointer; color:#aaa;}
.music-player-controls span:hover { color:#888;}
.music-player-progress {
position: relative;
    display: block;
    margin: 0 60px 0 95px;
    text-align: left;
}
.jp-progress {
    display: block;
    height: 1px;
    background-color: #3C3C3C;
    background: rgba(0,0,0,0.2);
    margin: 12px 0;  
    cursor: pointer;
}
.jp-play-bar {  
    position: relative;
    display: block;
    height: 1px;
    background: rgba(255,255,255,0.7); 
}
.jp-volume-controls { 
    position: absolute;
    right: 10px;
    width: 50px;
    top: 5px;
}
.jp-volume-bar {
display: block;
    position: absolute;
    height: 2px;
    background-color: #3C3C3C;
    background: rgba(0,0,0,0.2);
    width: 35px;
    top: 12px;
    left: 15px;
    cursor: pointer;
}
.jp-mute { 
    display: inline-block;
    margin-top: 2px;
}
.jp-current-time {
    font-size: 11px;
    position: absolute;
    top: 17px;
    left: 25px;  
}
.jp-duration {
    font-size: 11px;
    position: absolute;
    top: 17px;
    right: 70px;  
}
.jp-details { position:absolute; top:0; left:25px;}
.jp-lists {
    position: absolute;
    top: 6px;
    right: 20px;
    font-family: 'Open sans';
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
    color:#aaa;
}
.music-playlist-wrap {
    display:none;
    background-color: rgba(0,0,0,0.5);
    border-radius: 5px;
    position: absolute;
    bottom: 37px;
    width: 270px;
    color: #bbb;
    font-size: 11px;
    font-family: 'Raleway','Noto sns kr';
    padding:10px;
}
.music-playlist { 
    padding: 0px 15px 0px 25px;
    max-height: 210px;
    overflow: auto;
}
.music-playlist li { position: relative; }
.music-playlist li a {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;  
}
.music-playlist li a,
.music-playlist li a:hover { color:#aaa;}
.music-playlist li.jp-playlist-current,
.music-playlist li a.jp-playlist-current,
.music-playlist li a.jp-playlist-current:hover { color:#fff}
.music-playlist li.jp-playlist-current:before {
    font-family: 'FontAwesome';
    content: "\f028";
    display: block;
    position: absolute;
    top: 0px;
    left: -18px;
    color: #fff;
    font-size: 13px;
}
.music-playlist::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 6px;
  height: 6px;
}

.music-playlist::-webkit-scrollbar-thumb {
  border-radius: 6px;
  background-color: rgba(0,0,0,0.2);
}

.element .row[data-loop="true"] { 
  overflow: visible!important;
  margin-left: 0;
  margin-right: 0;
  width: auto;
}

/*gallery category*/
.element[data-type="gallery"][data-category="ON"] .empty .empty-txt {
  text-align: center;
  padding-top: 50px;
  padding-bottom: 70px;
}
.gallery-category-wrap { 
  padding-top: 30px;
  padding-bottom: 20px;
  margin-left: -15px; 
  margin-right: -15px;
  max-width: 100%;
}
#element-display > div > .gallery-category-wrap { padding-left: 30px; padding-right: 30px; }
.gallery-category-nav {
  padding-left: 15px;
  padding-right: 15px;
}

.element[data-msny="true"] .container { position: relative; }
.element[data-msny="true"] .container .row { position: relative; }
/*.element[data-msny="true"] .gallery-category-wrap { position: absolute; top: 0; left: 0; right: 0; width: 100%; }*/
.element[data-msny="true"] .gallery-category-wrap:before,
.element[data-msny="true"] .gallery-category-wrap:after { display: table; content: ''; clear: both; }
.gallery-category-wrap .gallery-category-nav li { display: inline-block; margin-bottom: 5px;} 
/*.gallery-category-nav li + li { margin-left: 15px; }*/
.gallery-category-nav li a {
    display: inline-block; 
    text-decoration: none; 
    color: #afafaf;
    padding-left: 7px;
    padding-right: 7px;
}
.gallery-category-nav .active a,
.gallery-category-nav a:hover,
.gallery-category-nav a:focus {
  color: #878787;
}

ul[data-category-color="black"] li a {
    display: inline-block; 
    text-decoration: none; 
    color: #bbbbbb;
}
ul[data-category-color="black"] .active a,
ul[data-category-color="black"] a:hover,
ul[data-category-color="black"] a:focus {
  color: #111111;
}
ul[data-category-color="gray"] li a {
    display: inline-block; 
    text-decoration: none; 
    color: #cccccc;
}
ul[data-category-color="gray"] .active a,
ul[data-category-color="gray"] a:hover,
ul[data-category-color="gray"] a:focus {
  color: #777777;
}
ul[data-category-color="white"] li a {
    display: inline-block; 
    text-decoration: none; 
    color: #777777;
}
ul[data-category-color="white"] .active a,
ul[data-category-color="white"] a:hover,
ul[data-category-color="white"] a:focus {
  color: #eeeeee;
}

[data-type="form"] .form-group h3.require:after {
    content: '*';
    right: -5px;
    color: #CC0000;
    position: relative;
    vertical-align: middle;
    font-size:18px;
    line-height: 11px !important;
    font-family: sans-serif;    
}

[data-type="form"] .form-group .checkbox-inline,
[data-type="form"] .form-group .radio-inline { padding-left:20px; padding-right:10px; margin-left: 0px; margin-right: 10px;}
[data-type="form"] .form-group .checkbox-inline > input,
[data-type="form"] .form-group .radio-inline > input { position: relative; top:1px; margin-right:5px;}
[data-type="form"] .form-group .form-date { display:inline-block; }
[data-type="form"] .form-group .form-date.date-yyyy { width:80px; }
[data-type="form"] .form-group .form-date.date-mm,
[data-type="form"] .form-group .form-date.date-dd,
[data-type="form"] .form-group .form-date.date-hh,
[data-type="form"] .form-group .form-date.date-ii { width:52px; padding:0px; text-align: center; }
[data-type="form"] .form-group .date-divider { font-size:20px; vertical-align: middle; padding:0 5px; }
@media only screen and (max-width:480px) {
  [data-type="form"] .form-group .date-divider.clear { display:block; margin-bottom:10px;}
}
.form-data-delete, .form-delete { font-size:14px; }
@keyframes fadein {
    from { opacity:0; }
    to { opacity:1; }
}
@-moz-keyframes fadein { /* Firefox */
    from { opacity:0; }
    to { opacity:1; }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from { opacity:0; }
    to { opacity:1; }
}
@-o-keyframes fadein { /* Opera */
    from { opacity:0; }
    to { opacity: 1; }
}
.page-comments.black { background-color: #000;}
.page-comments.black .tpl-comment-form { background-color:inherit; border-color:#333;}
.page-comments.black .tpl-comment-form textarea { background-color:#333; color:#fff;}
.page-comments.black .tpl-comment-form .comment-textarea .btn-submit { color: #fff; border: 1px solid #333; min-width: 125px; background-color: #191919;}
.page-comments.black .comment-list .cm-row { background-color: #000; border-color:#333;}
.page-comments.black .comment-list .cm-row .cm-name { color : #ccc;}
.page-comments.black .comment-list .cm-row .cm-content { color : #ddd;}
.progressModal .progress-bar-success { background-color: #4888e9; }
.label-country { display: inline-block; min-width:21px; text-transform: uppercase; padding:4px; }
.mng-panel-label .tooltip .tooltip-inner { text-align: left; padding:10px 10px 12px; }
#no-fouc { opacity: 1; }

.dd-list{ display: block; position: relative; margin: 0; padding: 0; list-style: none; }
#el-fileupload .modal-content { border-radius: 0; min-height: 670px;}
#el-fileupload .modal-body { text-align:left; padding:0; margin:30px 40px 40px;}
#el-fileupload .modal-dialog .btn {
    width: auto;
    height: 33px;
    line-height: 33px;
    padding: 0 15px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    min-width: 98px;
}
#el-fileupload .modal-dialog .upload-max-size { line-height: 33px; margin-right: 5px; }
#el-fileupload .modal-dialog .btn.resource-useit.active { background-color: #4789E7 }
#el-fileupload .modal-dialog .btn.resource-useit,
#el-fileupload .modal-dialog .btn.btn-default { font-size: 13px; }
.modal-upload-button{ width: 124px; }
.resource-selectAll { font-size: 11px; font-weight: 600;text-transform: uppercase; margin-bottom:0px;}
.resource-selectAll input { margin-top:6px; }

#resource-files { margin: 0px; padding: 0px; overflow: auto; text-align: left; height:400px;}
/*.ui-selectable-helper { position: absolute; z-index: 9999; border:1px dotted black; }*/
.resource-tooltip {
    pointer-events: none;
    display:none;
    width: 50px; height: 50px;
    z-index: 9999;
    position: fixed;
    top: 10px; left: -20px;
}
.resource-tooltip.multiple:before { z-index: 9900; content: ''; display: inline-block; position: absolute; top: -3px; left: 3px; width: 50px; height: 50px; border: 1px solid #d2d2d2; background-color: #ffffff;}
.resource-tooltip > img { position: relative; display: inline-block; z-index: 9999; width: 100%; height: auto; border: 1px solid #d2d2d2; }
.resource-tooltip > .count { z-index: 10000; display: inline-block; width: 20px; height: 20px; line-height:20px; content: '10'; position: absolute; top: -10px; right: -10px; background-color: #EE445F; color: #fff; -moz-border-radius: 50%; border-radius: 50%; text-align:center;}

#resource-files { 
    margin: 0px; 
    padding: 10px 10px 0 10px; 
    overflow: auto; 
    text-align: left; 
    width: 100%; height: 420px;
}

#resource-files .resource-image img {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

#resource-files.empty { position: relative;}
#resource-files.empty .resource-empty-area { width: 100%; height: 100%; }
#resource-files .resource-empty { 
    text-align: center;
    position: absolute;
    display: inline-block;
    top: 50%; left: 0; right: 0;
    width: 100%;
    margin:0 auto;
    padding: 50px 30px;
    color: #43484f;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}
#resource-files .resource-empty .img-wrap { margin-bottom: 30px; }
#resource-files .resource-empty p { font-size: 18px; letter-spacing: -0.025em; line-height: 1.6;}
#resource-files .resource-empty p + p { font-size: 12px; font-weight: 400; }
#resource-files .resource-empty .fa { color:#ec445d;}
#resource-files li { z-index:0; position:relative; display: inline-block; text-align:center; padding: 10px 0px 0px; margin-left: 4px; margin-bottom: 0px; vertical-align: middle; width:155px;}
#resource-files li .fitem { 
	overflow: hidden;
	position: relative; 
	min-height: 105px;
	margin-bottom: 10px; 
	animation: fadein 1s;
	-moz-animation: fadein 1s; /* Firefox */
	-webkit-animation: fadein 1s; /* Safari and Chrome */
	-o-animation: fadein 1s; /* Opera */
}
#resource-files li .resource-image { position: relative; display: inline-block; width: 140px; min-width: 100%; border: 0px solid #eeeeee; }
.fr-storage .imgs.ui-selected,
#resource-files li .ui-selected { background: #4789E7; border: 0px solid #4789E7; outline: 3px solid #4789E7; z-index:10; }
.fr-storage .imgs.ui-selected .user-name,
.fr-storage .imgs.ui-selected .user-name a,
#resource-files li .ui-selected .resource-file-name { color:#fff; }
#resource-files li span.resource-file-delete { 
    z-index: 1;
    position: absolute;
    top: 11px;
    right: 5px;
    display: none;
    width: 20px;
    height: 20px;
    text-align: center;
    color: #CC0000;
    font-size: 22px;
}
#resource-files li span.resource-file-delete:hover { color:#CC0000;}
#resource-files li img{ max-width: 100%; }
.resource-file-name { 
    text-align: center;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    line-height: 1.6;
    font-size: 11px;
    margin-right: 5px;
    margin-left: 5px;
    margin-bottom: 0;
    padding-top:5px;
}
.resource-file-size {
    font-size: 11px;
    font-weight: 300;
    line-height: 1.4;
    color: #a1a7af;
    margin-bottom: 0;
}
.resource-file-size:after {
    content: 'KB';
    display: inline-block;
    position: relative;
}
.resource-files-content .btn-sm { font-size:14px;}
.dsgn-body .modal-dialog.modal-lg { padding-top:50px;}
.resource-info { font-size:12px; text-transform: uppercase;}


/*storagebox box(file resource box)*/
.modal .modal-dialog.modal-storagebox.w1210 { width: 1230px; max-width: 1230px; font-family: 'Noto sans kr','Open sans';}
.modal-storagebox .modal-header { 
    color: #ffffff;
    background-color: #2d343e; 
    text-align: center;
    padding: 30px 40px 24px;
}
.modal-storagebox .modal-header h4 {
    font-size: 16px;
    letter-spacing: -0.05em;
    text-transform: uppercase;
    margin: 0;
}
.modal-storagebox .modal-header .close {
    margin-top: -25px;
}
#el-fileupload .modal-storagebox .modal-body {
    margin: 0;
}
.modal-storagebox .nav-tabs {
    background-color: #f3f4f6;
    border-bottom: 1px solid #d1dbdd;
}
.modal-storagebox .nav-tabs > li > a {
    font-size: 13px;
    letter-spacing: -0.05em;
    color: #2d343e;
    text-align: center;
    min-width: 147px;
    padding:15px 20px;
    -moz-border-radius: 0;
    border-radius: 0;
    text-transform: uppercase;
}
.modal-storagebox .nav-tabs > li:nth-child(2) a {
    /*pointer-events: none; cursor: default;*/
}
.modal-storagebox .nav-tabs > li.active > a, 
.modal-storagebox .nav-tabs > li.active > a:hover, 
.modal-storagebox .nav-tabs > li.active > a:focus {
    border-top-color: #ffffff;
    border-right-color: #d1dbdd;
}

.modal-storagebox .resource-heading:before,
.modal-storagebox .resource-heading:after {
    content: '';
    display: table;
    clear: both;
}
.modal-storagebox .resource-heading {
    overflow: auto;
    padding: 14px 25px 11px 17px;
    border-bottom: 1px solid #d1dbdd;
}
.modal-storagebox .resource-heading .info {
    font-size: 12px;
    letter-spacing: -0.03em;
    color: #3f3f3f;
    line-height: 33px;
}
.modal-storagebox #resource-delete { 
    font-size: 12px;
    text-align: center;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #e3e3e3;
    color: #556274;
    min-width: 55px;
    padding: 0px 7px;
    font-weight: normal;
    margin-top: 4px;
    margin-left: 0;
}
.modal-storagebox .resource-selected-str {
    margin-top: 0; margin-bottom: 0;
}
.modal-storagebox .resource-body {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.modal-storagebox .resource-body .resource-filelist {
    float: left;
    width: 220px; 
    height: 528px;
    max-width: 220px;
    overflow-x: hidden;
    overflow-y: auto; 
    border-right: 1px solid #d1dbdd;
    vertical-align: top;
}
.modal-storagebox .resource-body .resource-container {
    width: calc(100% - 220px);
    float: left;
}

.modal-storagebox #nestableFolder {
    margin-bottom: 5px;
    max-height: 480px;
    overflow-x: hidden;
    overflow-y: auto;
}
.modal-storagebox #nestableFolder .dd {
    max-width: 470px;
}
.modal-storagebox .dd-list.fll {
    background-color: #ffffff;
}
.modal-storagebox .fli > .dd-list.fll {
    border-bottom: none;
    padding-left: 0;
}
.dd-item.fli, .fli {
    position: relative;
    padding-top: 12px; padding-bottom: 12px;
}
.modal-storagebox .fli.active {
    background-color: #616b79;
    color: #ffffff;
    z-index: 1;
}
.modal-storagebox .fli { width: 100%; }
.modal-storagebox .fli > span {
    color: #2d343e;
    vertical-align: middle;
    font-weight: 500;
}
.modal-storagebox .fli.active > span,
.modal-storagebox .fli.active > .fa {
    color: #ffffff;
}
.modal-storagebox .fli > .dd-list.fll > .dd-item.fli {
    padding-left: 30px;
    z-index: 2;
}
.modal-storagebox .fli > button[data-action=collapse],
.modal-storagebox .fli > button[data-action=expand] {
    display: none! important;
}
.modal-storagebox .fli[data-id=all] > .fa-fl,
.modal-storagebox .fli[data-id=all] > .dd-fln,
.modal-storagebox .fli[data-id=all] > .dd-fld,
.modal-storagebox .fli > .dd-flc,
.modal-storagebox .fli > .dd-fls {
    cursor: default;
    pointer-events: none;
}
.fa-fl.dd-handle, .fa-fl.dd-handle-first {
    padding: 0 6px 0 17px;
    display: inline-block;
    border-bottom: none;
    height: auto;
    background-color: transparent;
}
.fli[data-id="clEmptyFolder"] .fa-fl.dd-handle {
    pointer-events: none! important;
}
.fli > button {
    margin: 2px 0 2px 12px;
}
.fli > button + div > .fa-fl.dd-handle,
.fli > button + div > .fa-fl.dd-handle-first {
    padding: 0 6px 0 10px;
}
.dd-fln {
    font-size: 11px;
    max-width: 120px;
    vertical-align: middle;
    text-overflow:ellipsis; 
    white-space:nowrap; 
    overflow:hidden; 
    display: inline-block;
}
.dd-fln > input {
    width: 170px;
    position: absolute;
    top: 10px; left: 40px;
    max-height: 28px;
    background-color: #fff;
    line-height: 1;
    z-index: 3;
}
.modal-storagebox .fli[data-id=all]  > .dd-fln {
    text-transform: uppercase;
}
.dd-flc:before {
    content: '(';
    display: inline-block;
    position: relative;
}
.dd-flc:after {
    content: ')';
    display: inline-block;
    position: relative;
}
.dd-fls {
    float: right;
    font-weight: 300;
    font-size: 9px;
    margin-right: 10px;
    max-width: 44px;
    opacity: 0.6;
    line-height: 26px;
    color: #a1a7af;
    display: none;
}
.modal-storagebox .fli[data-id=all]  > .dd-fls { display: inline-block; }
.dd-fls:after {
    content: 'MB';
    display: inline-block;
    position: relative;
}
.dd-fls[attr-size-unit="KB"]:after {
    content: 'KB';
}
.dd-fld {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    margin-right: 10px;
    font-weight: 300;
    font-size: 14px;
    color: #a1a7af;
    opacity: 0.6;
    cursor: pointer;
}
.modal-storagebox .fli[data-id=all] > .dd-fld,
.modal-storagebox .fli:not(.active) > .dd-fld {
    display: none;
}
.modal-storagebox .fli > .dd-fld > img {
    padding-top: 0; padding-right: 0; padding-bottom: 3px;
}

.modal-storagebox .popover {
    position: absolute;
    display: inline-block;
    background-color: #ffffff;
    left: 218px!important;
    font-size: 11px;
    border: 1px solid #dddddd;
    line-height: 20px;
    z-index: 3;
}
.modal-storagebox .popover .arrow {
    left: -15px;
    margin-top: -7px;
    border-width: 7px;
}
.popover.right .arrow:after {
    left: -6px;
    bottom: -7px;
    border-width: 7px;
}
.modal-storagebox .popover .popover-content {
    padding: 5px 10px;
}
.modal-storagebox .add-folder {
    line-height: 1;
    letter-spacing: -0.025em;
    cursor: pointer;
    clear: both;
}
.modal-storagebox .add-folder > .fa {
    padding: 10px 5px 10px 17px;
    font-size: 14px;
}

.modal-storagebox #resource-files li {
    padding: 5px; 
    margin-left: 0;
    width: 16.666%;
    vertical-align: top;
}

.modal-storagebox .resource-selectAll {
    margin-top: 0;
    margin-right: 15px;
}
.modal-storagebox .selected-files {
    /*display: none;*/
    max-height: 56px;
    overflow-y: auto;
}
.modal-storagebox .modal-footer {
    margin-top: 0;
    padding: 20px 18px;
    border-top: 1px solid #d1dbdd;
}



#resource-files li .fitem .control-area,
.fr-storage .imgs .control-area {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    width: 100%;
    height: 0px;
    font-size: 12px;
    background-color: rgba(0,0,0,0.6);
    color: #fff;
    -webkit-transition: all 0.15s ease-in-out;
    -moz-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
}
.fr-storage .imgs .control-area { text-align: center; bottom:0px;}
.fr-storage .imgs .control-area ul { display: inline-block; cursor: pointer;}
.fr-storage .imgs .control-area li { display:inline-block; width: auto; padding: 8px 20px;}
.fr-storage .imgs:hover .control-area { bottom:0px; height: 37px;}
.photo-popup { position:fixed; top:0; left:0; right:0; bottom:0px; background:red; z-index:10000; -webkit-animation: expand .35s; overflow-y: scroll;}
@-webkit-keyframes expand{
    0%{top:100%}
    100%{top:0px}
}
.photo-popup.down { top:100%; -webkit-animation: reduce .35s;}
@-webkit-keyframes reduce{
    0%{top:0px}
    100%{top:100%}
}
.photo-popup img { max-width:100%;}
.photo-popup::-webkit-scrollbar { 
    display: none; 
}

#resource-files li .fitem:hover .control-area,
#resource-files li .fitem:focus .control-area {
    height:37px;
}
#resource-files li .fitem .control-area a {
    color: #fff;
}

#resource-files li .fitem .control-area > ul {
    margin: 0;
    padding: 0;
}
#resource-files li .fitem .control-area > ul > li {
    width: auto;
    padding: 8px 13px;
}
#resource-files li .fitem .control-area > ul > li >  i.fa {
    cursor: pointer;
}
#resourceImgView {z-index: 1042;}
#resourceImgView .modal-dialog {
    position: relative;
    width: 1px;
    height: 1px;
    margin-top: 26%;
}
#resourceImgView.modal.fade .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
}
#resourceImgView .img-wrapper {
    position: absolute;
    top: 50%; left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
#resourceImgView button.close {
    position: absolute;
    top:0; right: 0;
    -webkit-transform: translate(10px, -10px);
    -moz-transform: translate(10px, -10px);
    -ms-transform: translate(10px, -10px);
    -o-transform: translate(10px, -10px);
    transform: translate(10px, -10px);
    opacity: 1;
}
#resourceImgView .img-wrapper > .img-responsive {
    max-width: 735px;
    max-height: 490px;
}
.fr-storage { height:420px; overflow: auto; padding: 10px 10px 0 10px;}
.fr-storage .fr-row { display:inline-block; vertical-align: top; width: 25%; padding: 5px;}
.fr-storage .fr-row .imgs { position: relative; margin-bottom: 10px;}
.fr-storage .fr-row .imgs img { max-width:100%; }
.fr-storage .fr-row .imgs .fitem { position: relative; overflow: hidden;}
.copyright-unsplash { font-family: -apple-system,BlinkMacSystemFont,San Francisco,Helvetica Neue,Helvetica,Ubuntu,Roboto,Noto,Segoe UI,Arial,sans-serif; padding:10px 20px; }
.fr-storage-list {
    padding:0px;
}
.fr-storage-list li { padding:12px 15px; font-family: 'Noto sans kr','Raleway'; cursor:pointer;}
.fr-storage-list li.active { 
    background-color: #616b79;
    color: #ffffff;
}
.fr-storage .fr-row .user-name { font-family: Rotobo; color:#999; position: relative; }
.fr-storage .fr-row .user-name a { color:#000; text-decoration: underline;}
.free-search-icon { position: absolute; color: #98A2AC; top: 0px; left: 19px; font-size: 18px;}
.free-search-result { position: absolute; color: #98A2AC; top: 0px; right: 70px; font-size: 14px; font-family: 'Noto sans';}
.free-search {
    min-width: 600px;
    box-shadow: none;
    background-color: #F1F1F1;
    border-radius: 20px;
    padding-left: 50px;
    border: none;
    font-family: 'Noto sans kr','Open sans','Raleway';
    font-size: 13px;
}
.free-search:focus,
.free-search:active { box-shadow: none;}
.fr-storage .result-none { 
    text-align: center;
    font-size: 17px;
    font-family: 'Noto sans kr';
    font-weight: 300;
    padding-top:25px;
}
.modal-storagebox .resource-controls { min-height: 32px;}
.modal-storagebox .resource-controls:before,
.modal-storagebox .resource-controls:after {
    content: '';
    display: table;
    clear: both;
}
.modal-storagebox .resource-controls > .resource-paging {
    padding-left: 20px;
}
.modal-storagebox .resource-controls > .resource-paging > ul > li {
    display: inline-block;
}
.modal-storagebox .resource-controls > .control-wrap {
    padding-right: 20px;
}
.modal-storagebox .resource-controls > .control-wrap > div {
    display: inline-block;
}

/* ReorderModal CSS */
.reorderModal h1.fixed-btn-wrap {
    -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
/***********************/
.selected-files, .fr-selected-files { margin:0 20px 20px 12px; padding:0px; background: #f5f5f5; border-radius: 2px; min-height: 56px; text-align: left;}
.selected-files li,
.fr-selected-files li { position:relative;display:inline-block; width:56px; padding:1px;}
.selected-files li img,
.fr-selected-files li img { width:100%; }
.selected-files li p.selected-file-name,
.selected-files li p.selected-file-size,
.fr-selected-files li p.selected-file-name,
.fr-selected-files li p.selected-file-size,
.fr-selected-files li p.tmp-image { display:none;}
.selected-files li .selected-hover,
.fr-selected-files li .selected-hover { position:absolute;width:56px;height:56px;color:#fff;font-size:32px;background:rgba(0,0,0,0.5);top:0;left:0;display:none;cursor: pointer; text-align: center; line-height: 56px;}
.fr-selected-files { margin-top: 10px; margin-bottom: 0px; margin-left: 14px;}
.photo-close { position: fixed; display:none;
    top: 10px;
    right: 10px;
    background-color: rgba(0,0,0,0.5);
    padding: 5px;
    z-index: 10001;
    cursor:pointer;
}
.fli.drag-selected,
.dd-item.fli.active.drag-selected,
.dd-item.fli.drag-selected { background-color:#c3c3c3 !important;}
.uploadModal .uploadModal-message { position: relative; top:21%; color:#fff;}
button.navbar-toggle { visibility:hidden; }

footer#cl-footer { 
  padding-top: 40px;
  padding-bottom: 60px;  
  background-color: #fff;
}
footer#cl-footer,
footer#cl-footer *:not(.fa):not(.cl-icon) {
  font-family: 'Noto Sans KR', 'Noto Sans',sans-serif; 
  font-weight: 300;
}
footer#cl-footer > .cl-f.container-fluid { 
    width: 100%;
    max-width: 945px;
    margin: 0 auto;
    position: relative;
}
footer#cl-footer > .cl-f.container-fluid > .row { 
  margin-left: 0; 
  margin-right: 0; 
}
footer#cl-footer > .cl-f .cl-f-logo .navbar-brand { 
  padding: 0;
  line-height: 1;
}
footer#cl-footer > .cl-f .cl-f-logo .navbar-brand .logo-img { width: 170px; }
footer#cl-footer > .cl-f .cl-f-social { 
    text-align: right;
    float: right;
}
footer#cl-footer > .cl-f .cl-f-social > ul {
  display: inline-block;
}
footer#cl-footer > .cl-f .cl-f-social > ul > li {
  display: inline-block;
  float: left;
  margin-top: 4px;
}
footer#cl-footer > .cl-f .cl-f-social > ul > li + li { margin-left: 14px; }
footer#cl-footer > .cl-f .cl-f-social > ul > li > a {
  line-height: 1.2;
  vertical-align: middle;
  color: #2d343e;
}
footer#cl-footer > .cl-f .cl-f-social > ul > li > a img {
  width:22px;
}
footer#cl-footer > .cl-f .cl-f-menu { padding-top: 5px; }
footer#cl-footer > .cl-f .cl-f-menu > ul > li { display: inline-block;position: relative; }
footer#cl-footer > .cl-f .cl-f-menu[data-lang="en"] > ul > li > a {font-size:11px;}
footer#cl-footer > .cl-f .cl-f-menu > ul > li:first-child > a {padding:0 5px 0 0;}
footer#cl-footer > .cl-f .cl-f-menu > ul > li > a {
    color: #696c71;
    font-size: 13px;
    padding: 0 10px;
}
footer#cl-footer > .cl-f .cl-f-menu > ul > li:last-child > a {padding-right: 0;}
footer#cl-footer > .cl-f .cl-f-text,
footer#cl-footer > .cl-f .cl-f-copyright {
  color: #a3a6ac;
  font-size: 11px;
  line-height: 1.6;
  display: block;
}
footer#cl-footer > .cl-f .cl-f-text { clear: both; padding-top: 40px; }
footer#cl-footer > .cl-f .cl-f-copyright {
  text-transform: uppercase;
  margin-top: 5px;
}
footer#cl-footer > .cl-f .cl-f-text > span + span {
  letter-spacing: -0.5px;
}
.visible577hide {display: inline-block;}
@media only screen and (min-width: 481px) {
  footer#cl-footer > .cl-f .cl-f-text > span + span { margin-left: 1px;}
}
@media only screen and (min-width: 541px) {
  footer#cl-footer > .cl-f .cl-f-text br.visible-xxs { display: none; }
  footer#cl-footer > .cl-f .cl-f-text br.visible-xxs + span { margin-left: 10px; }
}
@media only screen and (min-width: 769px) {
  footer#cl-footer > .cl-f .cl-f-menu > ul > li + li:before {
    content: ' ';
    width: 1px;
    background-color: #dbdcdf;
    position: absolute;
    height: 15px;
    top: 52%;
    transform: translateY(-52%);
  }
  footer#cl-footer > .cl-f .cl-f-text br.visible-xs + span { margin-left: 10px; }
}
@media only screen and (min-width: 769px) and (max-width: 991px) {
  footer#cl-footer > .cl-f .cl-f-text br.visible-xxs { display: block; }
  footer#cl-footer > .cl-f .cl-f-text br.visible-xxs + span { margin-left: 0; }
}
@media only screen and (min-width: 992px) {
  footer#cl-footer > .cl-f.container-fluid { /* margin-left: 2%; margin-right: 2%; */ }
  footer#cl-footer > .cl-f .cl-f-menu { text-align: right; }
}
@media only screen and (min-width: 1200px) {
 /*  footer#cl-footer > .cl-f.container-fluid { margin-left: 5%; margin-right: 5%; } */
}
@media only screen and (min-width: 1310px) {
  /*footer#cl-footer > .cl-f.container-fluid { width: 1270px! important; margin: 0 auto; }*/
}
@media only screen and (max-width: 991px) {
  footer#cl-footer {padding-left: 30px; padding-right: 30px;}
  footer#cl-footer > .cl-f .cl-f-menu { clear: both; padding-top: 30px;}
  footer#cl-footer > .cl-f .cl-f-social { float: left; text-align: left; margin-top: 30px;}
}
@media only screen and (min-width: 578px) {
  /* footer#cl-footer > .cl-f .cl-f-menu > ul > li + li:nth-child(6):before {
    display: inline-block;
  }
  footer#cl-footer > .cl-f .cl-f-menu > ul > li:nth-child(5),
  footer#cl-footer > .cl-f .cl-f-text > span:nth-child(3),
  footer#cl-footer > .cl-f .cl-f-text > span:nth-child(5),
   footer#cl-footer > .cl-f .cl-f-text > span:nth-child(7) {width:auto;} */
}
@media only screen and (min-width: 510px) and (max-width: 577px) { 
  /* footer#cl-footer > .cl-f .cl-f-menu[data-lang="en"] > ul > li + li:nth-child(6):before {
    display: inline-block;
  } */
}
@media only screen and (max-width: 577px) {
  /* footer#cl-footer > .cl-f .cl-f-menu > ul > li + li:nth-child(6):before {
    display: none;
  } */
  /* footer#cl-footer > .cl-f .cl-f-menu[data-lang="ko"] > ul > li:nth-child(5) {width: calc(100% - 217px);}
  footer#cl-footer > .cl-f .cl-f-menu[data-lang="en"] > ul > li:nth-child(5) {width: auto;} */
  /* footer#cl-footer > .cl-f .cl-f-text > span {display: inline-block;} */
  /* footer#cl-footer > .cl-f .cl-f-text > span:nth-child(3) {width: calc(100% - 157px);}
  footer#cl-footer > .cl-f .cl-f-text > span:nth-child(5) {width: calc(100% - 164px);}
  footer#cl-footer > .cl-f .cl-f-text > span:nth-child(6) {width: calc(100% - 165px);} */
}
@media only screen and (max-width: 767px) {
  footer#cl-footer {padding-left: 15px; padding-right: 15px;}
  .mng-body.mng-uadmin ~ footer#cl-footer{
    display: none;
  }
  footer#cl-footer > .cl-f .cl-f-menu > ul > li > a:focus {font-weight:bold;}
  footer#cl-footer > .cl-f .cl-f-menu > ul > li { width:auto; }
  footer#cl-footer > .cl-f .cl-f-menu > ul > li + li:before{
    content: ' ';
    width: 1px;
    background-color: #dbdcdf;
    position: absolute;
    height: 15px;
    top: 52%;
    transform: translateY(-52%);
  }
  footer#cl-footer > .cl-f .cl-f-social {text-align: left;margin-top: 30px;}
  footer#cl-footer > .cl-f .cl-f-menu {padding-top:30px;}
  footer#cl-footer > .cl-f .cl-f-text,
  footer#cl-footer > .cl-f .cl-f-copyright { line-height: 1.3; }
}
@media only screen and (max-width: 540px) {
  /* footer#cl-footer { padding-bottom: 40px; } */
}
@media only screen and (max-width: 480px) {
  /* footer#cl-footer .cl-f-logo {padding-left: 5px;}
  footer#cl-footer {padding-top:20px; padding-bottom:20px;}
  footer#cl-footer > .cl-f .cl-f-menu > ul > li:nth-child(3n-1) { width:42%; }
  footer#cl-footer > .cl-f .cl-f-menu > ul > li:nth-child(3n) { width:22%; } 
  footer#cl-footer > .cl-f .cl-f-text { line-height: 1.6;padding-left: 5px; padding-right: 5px; }
  footer#cl-footer > .cl-f .cl-f-text > span {display: inline-block; margin-right:4px;}
  footer#cl-footer > .cl-f .cl-f-text > br { display: none!important; } 
  footer#cl-footer > .cl-f .cl-f-social > ul > li > a .fa {font-size:22px;}
  footer#cl-footer > .cl-f .cl-f-menu {padding: 10px 5px;}
  footer#cl-footer > .cl-f .cl-f-copyright {padding:0 10px 0 5px;}*/
  .visible577hide {display: none;}
}

.uploadModal, .progressModal {
  display: none;
  position: fixed;
  z-index: 99999999;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  height: 100%;
  background-color : rgba(215,215,215,0.75);
  text-align: center;
  font-family: 'Noto sans KR';
  color:#000;
  overflow: auto;
}
.progressModal { display: block; }
.uploadModal h1, .progressModal h1 {
  position: relative;
  color:#000;
  font-size: 24px;
  text-align: center;
  font-weight: 400;
  margin-bottom: 50px;
}
.uploadModal .upload-wrap, .progressModal .progress-wrap {
  background-color:#fbfbfb;
  max-width: 700px;
  min-height:100%;
  margin:0 auto;
}
.uploadModal .upload-header, .progressModal .progress-header {
  background-color: #fff;
  padding:86px 100px 40px;
  font-weight: 300;
}
.uploadModal .upload-header .info1, .progressModal .progress-header .info1 { float:left; }
.uploadModal .upload-header .info2, .progressModal .progress-header .info2 { float:right; }

.uploadModal #file-upload-progress, .progressModal #file-upload-progress { 
  height:2px;
  background-color:#50BAF6;
  margin-bottom:3px;
}

.uploadModal .upload-content, .progressModal .progress-content { padding:50px 100px; }
.progressModal .info1 i { font-size:13px; color:#50BAF6; }

.uploadModal .upload-content .file { font-weight:300; color:#000;  position: relative; background: linear-gradient(to right, lightblue 50%, transparent 50%); background-size: 200% 100%; background-position: right bottom; transition:all 1s ease; padding:15px 0px 15px 100px; text-align: left;}
.uploadModal .upload-content .file.done { }
.uploadModal .upload-content .file a { position: relative; padding: 0px; color: black; white-space: nowrap; max-width: 300px; overflow: hidden; display: inline-block; text-overflow:ellipsis; top:6px; }
.progressModal .progress-content .file .progress,
.uploadModal .upload-content .file .progress { box-shadow:none !important; -webkit-box-shadow:none !important; height:2px !important; border-radius:0px !important; margin-top:5px; margin-bottom:5px; }
.progressModal .progress-bar,
.uploadModal .progress-bar { box-shadow:none !important; -webkit-box-shadow:none !important; background-color:#50BAF6 !important; }
.uploadModal .upload-content .file .file-size { padding-left:20px; font-size:12px; font-weight:300px; color:#999; }
.uploadModal .upload-content .file .progress-info { font-size:12px; color:#666; }
.uploadModal .upload-content .file .ing { float:left; }
.uploadModal .upload-content .file .rate { float:right; }
.uploadModal .upload-content .file .loading { padding-right:3px; }
.uploadModal .upload-content .file .loading i { font-size:13px; color:#50BAF6; }
.uploadModal .upload-content .file .preview { position: absolute; top: 15px; left: 0px; right: 0px; width: 90px; height: 60px; background-repeat:no-repeat; background-position: center center; background-size: contain; text-align: center; }
.uploadModal .upload-content .file .preview:before { position: absolute; content: "\f03e"; font-family: 'FontAwesome'; color:#ddd; top:0; left:0; right:0; bottom:0; z-index: 1; line-height: 60px; font-size: 26px; }
.uploadModal .upload-content .file .preview.not_image:before { content:"\f016";}
.uploadModal .upload-content .file .preview img { position:relative; max-width: 100%; max-height: 100%; margin:0 auto; border-radius: 3px; z-index: 2;}
.uploadModal .upload-content .file .loading { background-image:none;}
.uploadModal .upload-content .progress, .progressModal .progress-content .progress { background-color: #D9D9D9;}
.uploadModal .upload-content .upload-cancel,.progressModal .progress-content .progress-cancel  { padding-top: 50px; }
.uploadModal .upload-content .upload-cancel .btn, .progressModal .progress-content .progress-cancel .btn { width: 160px; height: 47px; line-height: 47px; padding: 0px; border-color: #458AE8; color: #458AE8; font-weight: 300; font-size: 14px; }

/* addr search modal */
.addr-modal-backdrop {
  position: fixed;
  top: 0; right: 0; bottom: 0; left: 0;
  background-color: #000000;
  opacity: 0;
  -webkit-transition: opacity 0.15s linear;
  -moz-transition: opacity 0.15s linear;
  -ms-transition: opacity 0.15s linear;
  -o-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear;
  z-index: 9999;
}
.addr-modal-backdrop.in {
  opacity: 0.5;
  filter: alpha(opacity=50);
  -webkit-transition: opacity 0.15s linear;
  -moz-transition: opacity 0.15s linear;
  -ms-transition: opacity 0.15s linear;
  -o-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear;
}
#addr-modal {
  width: 505px;
  height: 490px;
  max-width: 100%;
  max-height: 100%;
  display: inline-block;
  background-color: #fff;
  overflow: hidden;
  position: fixed;
  top: 40%; left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 9999;
}
#addr-modal > .close {
  position: absolute;
  font-size: 13px;
  font-weight: normal;
  vertical-align: middle;
  line-height: 1.8;
  top: 1px; right: 0; left: 0;
  display: inline-block;
  width: 100%; height: 40px;
  text-align: center;
  padding: 5px 10px 10px;
  background-color: #fff;
  opacity: 1;
  z-index: 1051;
  cursor: default;
}
#addr-modal > .close > #btn-addr-close {
  cursor: pointer;
  display: inline-block;
  float: right;
}
#addr-body { 
  padding-top: 40px;
  margin-left: 1px;
  width: auto; height: 100%; 
}

/*mobileToggleMenu*/
.mobile-detail-popup {
    font-family: 'Noto Sans KR',sans-serif; 
    width:100%;
    height:100%;
    position:fixed;
    top:0px;
    overflow:hidden;
    background-color:#eeeff3;
    z-index:200;
    display:none;
}
.mobile-detail-popup.mobilemng-uadmin {height:auto;}
#eventNotice.forms {display: none;}
.m-headerClose {display: none;}


/*********************** 공통 event modal css START ************************/
/***************************************************************************/
#eventNotice { 
    position: absolute;
    top: 150px; left: 20px;
    text-align: center;
    display: inline-block;
    max-width: 130px;
    min-height: 90px;
    z-index: 1;
    width: 130px;
}
#eventNotice.en {display: none;}
#eventNotice .ev-content {
    padding:5px 10px 13px 10px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #dbdbdb;
    background-color:#fff;
}
#eCommerceBeta .ev-content *,
#eCommerceOpen .ev-content *,
#eventNotice .ev-content * {
    font-family: 'Noto Sans', 'Noto Sans KR';
    font-size: 15px;
    font-weight: 300;
    letter-spacing: -0.02em;
    color: #878791;
}
#eCommerceBeta .ev-content .btn-box,
#eCommerceOpen .ev-content .btn-box,
#eventNotice .ev-content .btn-box {
    z-index : 99;
    text-align: right;
    line-height: 1;
}
#eCommerceBeta .ev-content .btn-box .btn-en-close,
#eCommerceOpen .ev-content .btn-box .btn-en-close,
#eventNotice .ev-content .btn-box .btn-en-close { cursor: pointer; }
#eventNotice .ev-content .text-box a { text-decoration: none; color: inherit; line-height: 1.3; }
#eventNotice .ev-content .text-box a span {  font-weight: 600; color: #212327;}
#eventNotice  .ev-content.shoppingEv .text-box .shoppingOp_banner span.banner_smtext { color:#fff; font-weight: 500;}
#eCommerceBeta .ev-content .btn-box .btn-en-close.big-close,
#eCommerceOpen .ev-content .btn-box .btn-en-close.big-close,
#eventNotice .ev-content .btn-box .btn-en-close.big-close,
#eventNotice .ev-content .text-box .big-arrow { display: none; }
#eventNotice.en .ev-content.cs { display: none; }
#eventNotice .ev-content.cs {
    border-top: 1px solid #dbdbdb;
    padding-top: 15px;
    padding-bottom: 15px;
    background-color: #ecf7fe;
}
#eventNotice .ev-content.cs .text-box > a > .line:nth-child(3) { font-size: 13px; margin-top: 7px;}
#eventNotice .ev-content.cs .text-box > a > .line:nth-child(3) > .fa { font-family: 'FontAwesome'! important; font-size: 12px; margin-left: 4px;}
#eCommerceBeta .ev-content.betasm,
#eventNotice .ev-content.betasm {
    background-color: #f02fc2; /* Old browsers */
    background-image: -webkit-linear-gradient(left, #f02fc2, #6094ea);  /* Safari 5.1 ~ 6.0, chrome 10.0~25 */
    background-image: -moz-linear-gradient(left, #f02fc2, #6094ea); /* Firefox 3.6 ~ 15 */
    background-image: -o-linear-gradient(left, #f02fc2, #6094ea); /* Opera 11.1~ 12.0 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f02fc2', endColorstr='#6094ea', GradientType=1); /*IE6~8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#f02fc2', endColorstr='#6094ea')"; /*IE8+*/
    background-image: linear-gradient(to left, #f02fc2, #6094ea);
    color: #fff;
}
#eCommerceBeta .ev-content.betasm .text-box .betasm-txt,
#eventNotice .ev-content.betasm .text-box .betasm-txt { color: #fff; vertical-align: text-bottom; }
#eCommerceBeta .ev-content.betasm .text-box .betasm-txt img,
#eventNotice .ev-content.betasm .text-box .betasm-txt img { margin: 0 14px 0 7px; display: inline-block; }
#eventNotice .ev-content.betasm { display: none; }
#eventNotice .ev-content.betasm .btn-box > span { display: none; }
#eventNotice .ev-content.betasm .text-box .betasm-txt img { max-width: 40px; }
#eCommerceBeta { text-align: center; }
#eCommerceBeta .ev-content.betasm { padding: 31px 15px 29px; }
#eCommerceBeta .ev-content.betasm .eventpage-ban { position: relative; }
#eCommerceBeta .ev-content.betasm .btn-box { position: absolute; top: 4px; right: 33px; }
#eCommerceBeta .ev-content.betasm .btn-box > span { 
    color: #fff; 
    margin-right: 9px; 
    cursor: pointer;
    font-size: 14px;
}
#eCommerceBeta .ev-content.betasm .text-box { margin: 0 24%; width: auto; position: relative; }
#eCommerceBeta .ev-content.betasm .text-box .betasm-txt { 
    font-family: 'Noto Sans KR';
    font-size: 21px; 
    letter-spacing: -0.53px; 
    line-height: 1.02; 
}
#eCommerceBeta .ev-content.betasm .text-box .betasm-txt img { margin-top: -6px; }
#eCommerceBeta .ev-content.betasm .text-box .btn-more {
    position: absolute;
    top: -7px; right: 15px;
    display: inline-block;
    min-width: 143px;
    line-height: 1.2;
    padding: 10px 15px;
    font-size: 14px;
    color: #fff;
    border: 1px solid #fff;
    cursor: pointer;
    display: none;
}
#eCommerceBeta .ev-content.betasm .text-box .btn-more > img { margin-top: -1px; margin-left: 12px; }

/*eCommerceOpen*/
#eCommerceOpen .ev-content.shoppingEv,
#eventNotice .ev-content.shoppingEv {
    background-color: #f02fc2; /* Old browsers */
    background-image: -webkit-linear-gradient(left, #f02fc2, #6094ea);  /* Safari 5.1 ~ 6.0, chrome 10.0~25 */
    background-image: -moz-linear-gradient(left, #f02fc2, #6094ea); /* Firefox 3.6 ~ 15 */
    background-image: -o-linear-gradient(left, #f02fc2, #6094ea); /* Opera 11.1~ 12.0 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f02fc2', endColorstr='#6094ea', GradientType=1); /*IE6~8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#f02fc2', endColorstr='#6094ea')"; /*IE8+*/
    background-image: linear-gradient(to left, #f02fc2, #6094ea);
    color: #fff;
}
#eCommerceOpen .ev-content.shoppingEv .text-box .shoppingOp_banner,
#eventNotice .ev-content.shoppingEv .text-box .shoppingOp_banner { color: #fff; vertical-align: text-bottom; }
#eCommerceOpen .ev-content.shoppingEv .text-box .shoppingOp_banner img {margin: 0;}
#eventNotice .ev-content.shoppingEv .text-box .shoppingOp_banner img {margin: 0 14px 0 7px;}
#eCommerceOpen .ev-content.shoppingEv .text-box .shoppingOp_banner img,
#eventNotice .ev-content.shoppingEv .text-box .shoppingOp_banner img {  display: inline-block; }
#eventNotice .ev-content.shoppingEv { display: none; }
#eventNotice .ev-content.shoppingEv .btn-box > span { display: none; }
#eventNotice .ev-content.shoppingEv .text-box .shoppingOp_banner img { max-width: 40px; }
#eCommerceOpen { text-align: center; }
#eCommerceOpen .ev-content.shoppingEv { position: relative; }
#eCommerceOpen .ev-content.shoppingEv .eventpage-ban { position: relative; }
#eCommerceOpen .ev-content.shoppingEv .btn-box { 
    position: absolute; 
    top:50%; 
    right: 2%; 
    transform: translateY(-50%);
}
#eCommerceOpen .ev-content.shoppingEv .btn-box > span { 
  color: #fff; 
  margin-right: 9px; 
  cursor: pointer;
  font-size: 14px;
}
#eCommerceOpen .ev-content.shoppingEv .text-box {
    width: auto;
    position: relative;
    height: 80px; 
    padding-top: 1px;
}
#eCommerceOpen .ev-content.shoppingEv .text-box .shoppingOp_banner span { color:#fff; font-size:21px; letter-spacing: -0.53px;}
#eCommerceOpen .ev-content.shoppingEv .text-box .btn-more {
    position: absolute;
    top: -7px; right: 15px;
    display: inline-block;
    min-width: 143px;
    line-height: 1.2;
    padding: 10px 15px;
    font-size: 14px;
    color: #fff;
    border: 1px solid #fff;
    cursor: pointer;
    display: none;
}
#eCommerceOpen .ev-content.betasm .text-box .btn-more > img { margin-top: -1px; margin-left: 12px; }
#eventNotice .hmCreate-video {
    padding:5px 10px 13px 10px;
    margin-top: 10px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #dbdbdb;
    background-color: #ffffff;
}
#eventNotice .hmCreate-video *,
#eventNotice .hmCreate-popup-gabia *,
#eventNotice .hmCreate-popup * {
    font-family: 'Noto Sans', 'Noto Sans KR';
    font-size: 15px;
    letter-spacing: -0.02em;
    color:#212327;
}
#eventNotice .hmCreate-video .btn-box {text-align: right; line-height: 0;  margin: 4px 0;}
#eventNotice .hmCreate-video .btn-box .btn-en-close { cursor: pointer; }
#eventNotice .hmCreate-video .hmCreate-popup a,
#eventNotice .hmCreate-video .hmCreate-popup-gabia a { text-decoration: none; color: inherit; line-height: 1.3; }
#eventNotice .hmCreate-video .hmCreate-popup a span,
#eventNotice .hmCreate-video .hmCreate-popup-gabia a span{ font-weight: 600; color: #212327;}
#eventNotice .hmCreate-video .btn-box .btn-en-close.big-close,
#eventNotice .hmCreate-video .hmCreate-popup .big-arrow { display: none;}
#eventNotice .hmCreate-video .hmCreate-popup .line {
    margin-left:3px;
    line-height: 1.3;
    padding:2px 0px 0px 0px;
    font-weight: 600;
}
#eventNotice .hmCreate-video.hmpopup { border-top: 1px solid #dbdbdb; padding-top: 15px; padding-bottom: 15px;}
#eventNotice .hmCreate-video {margin-top:10px;}

/*gabia 홈페이지 팝업*/
.modal-default .modal-dialog.videobox-gabia h3.modal-title { font-size: 30px; margin: 25px 0 40px 0; letter-spacing: -0.5px;}
.modal-default .modal-dialog.videobox-gabia .modal-content .modal-body{ padding: 0 50px 50px 50px;}

@media only screen and (min-width:1441px) and (max-width:1620px) {
    #eventNotice { min-width: inherit; max-width: 120px; }
}
@media only screen and  (min-width:1024px) and (max-width:1600px) {
    .homep-creatediv .tab-content .step-info {  display:none !important;}
}
@media only screen and (max-width:1440px) {
    .navigation { top: 26%! important; }
    #eventNotice { 
        z-index: 101;
        overflow: hidden;
        vertical-align: top;
        position: relative; 
        display: block; 
        top:0; left:0; right:0; 
        width: 100%;
        max-width: 100%;
        min-height: 0;
        height: 50px;
        padding: 15px 0;
        -webkit-border-radius: 0;
        border-radius: 0;
        border: none;
        /* border-bottom: 1px solid #dbdbdb; */
    }
    #eventNotice ul {
        position: absolute;
        top: 0;
        width: 100%;
        height:150px;
    }
    #eventNotice li {
        padding: 15px 0;
        width: 100%;
        height:50px;
        display:block;
    }
    #eventNotice .ev-content *,
    #eventNotice .hmCreate-popup * ,
    #eventNotice .hmCreate-popup-gabia * { font-size: 16px; line-height: 1.2; }
    #eventNotice .ev-content {
        padding: 15px 0;
        -webkit-border-radius: 0px;
        border-radius: 0px;
        border:none;
    }
    #eventNotice .ev-content .btn-box { 
        position: absolute;
        right: 35px;
        display: inline-block; 
    }
    #eventNotice .ev-content .text-box a .line { display: inline-block; }
    #eventNotice .ev-content .btn-box .btn-en-close.small-close,
    #eventNotice .ev-content .text-box .small-arrow { display: none; }
    #eventNotice .ev-content .btn-box .btn-en-close.big-close,
    #eventNotice .ev-content .text-box .big-arrow { display: inline-block;}
    #eventNotice .ev-content .text-box .big-arrow { margin-bottom: 3px; }
    #eventNotice .ev-content.cs { display: none; }
    #eventNotice .ev-content.betasm { display: block; }
    #eventNotice .ev-content.betasm .text-box .betasm-txt { cursor: pointer; display: inline-block; }
    #eventNotice .ev-content.betasm .text-box .btn-more { display: none; }
    #eCommerceBeta { display: none; }
    #eventNotice .ev-content.shoppingEv { display: block; padding:0;}
    #eventNotice .ev-content.shoppingEv .text-box .shoppingOp_banner img {
        margin: 0 auto;
        max-width: 100%;
        height:50px;
    }
    #eventNotice .ev-content.shoppingEv .btn-box .btn-en-close.big-close, #eventNotice .ev-content.shoppingEv .text-box .big-arrow {margin-top:18px;}
    #eventNotice .ev-content.shoppingEv .text-box .shoppingOp_banner { 
        cursor: pointer; 
        display: inline-block; 
        line-height: 1;
        height: 100%;
    }
    #eventNotice .ev-content.shoppingEv .text-box .btn-more { display: none; }
    #eCommerceOpen { display: none; }
    #eventNotice .hmCreate-video {
        padding:15px 0;
        position: relative;
        margin-top: 0px;
        -webkit-border-radius: 0px;
        border-radius: 0px;
        border:none;
    }
    #eventNotice .hmCreate-video * { font-size: 16px; line-height: 1.2; }
    #eventNotice .hmCreate-video .btn-box { position: absolute;top: 15px; right: 35px;display: inline-block;}
    #eventNotice .hmCreate-video .hmCreate-popup .line {
        display: inline-block;
    }
    #eventNotice .hmCreate-video .btn-box .btn-en-close.small-close,
    #eventNotice .hmCreate-video .hmCreate-popup .small-arrow { display: none;}
    #eventNotice .hmCreate-video .btn-box .btn-en-close.big-close,
    #eventNotice .hmCreate-video .hmCreate-popup .big-arrow { display: inline-block;}
    #eventNotice .hmCreate-video .hmCreate-popup .big-arrow { margin-bottom: 3px; }
    #eventNotice br.visible-pc {display : none;}
    #eventNotice .hmCreate-video .btn-box {margin-top: 0px; margin-bottom: 0px;}
    #eventNotice .hmCreate-video .hmCreate-popup .line { color:#212327; font-weight:600; } 
}

@media only screen and (max-width:1024px) {
    #eventNotice .hmCreate-video .hmCreate-popup .line {padding:0px;}
}

@media only screen and (max-width:768px) {
    #eventNotice .ev-content *,
    #eventNotice .hmCreate-popup *,
    #eventNotice .hmCreate-popup-gabia * { font-size: 14px; }
    #eventNotice .ev-content .btn-box { padding-top: 0; right: 21px; padding-bottom: 0; }
    #eventNotice .ev-content .btn-box img { max-width: 14px; }
    #eventNotice .ev-content .text-box { /* max-width: 76%;  */margin: 0 auto; line-height: 1.6;}
    #eventNotice .ev-content .text-box .big-arrow { max-width: 15px; }
    #eventNotice .ev-content.shoppingEv .text-box .shoppingOp_banner img {display: inline-block;}
    #eventNotice .ev-content.shoppingEv .text-box .shoppingOp_banner .shopping_evlink {display: none;}
    #eventNotice.ev-intro { padding-bottom: 10px;}
    #eventNotice .hmCreate-video * { font-size: 14px; }
    #eventNotice .hmCreate-video .btn-box { padding-top:2px; right: 25px; padding-bottom: 0; }
    #eventNotice .hmCreate-video .btn-box img { max-width: 14px; }
    #eventNotice .hmCreate-video .hmCreate-popup,
    #eventNotice .hmCreate-video .hmCreate-popup-gabia { max-width: 76%; margin: 0 auto; line-height: 1.6;}
    #eventNotice .hmCreate-video .hmCreate-popup .big-arrow { max-width: 15px; }
    #eventNotice .ev-content.shoppingEv .text-box .shoppingOp_banner span.banner_smtext {
        font-size:13px;
        color:#fff;
        font-weight: 500;
        margin-left: -4px;
        margin-top: 19px;
        display: inline-block;
    }  
    .modal-default .modal-dialog.videobox-gabia h3.modal-title {     
        font-size: 20px;
        margin: 25px 0;
    }
    .modal-default .modal-dialog.videobox-gabia .modal-content .modal-body { padding: 0 15px 15px 15px; }
}
@media only screen and (max-width:390px) {
    #eventNotice .ev-content.shoppingEv .text-box .shoppingOp_banner img {max-width:76%;margin-top: 2px;height: auto;}
    #eventNotice .ev-content .btn-box {right: 21px;}
    #eventNotice .ev-content.shoppingEv .btn-box .btn-en-close.big-close, 
    #eventNotice .ev-content.shoppingEv .text-box .big-arrow {margin-top: 20px;}

}
/*********************** 공통 event modal css END ************************/
/*************************************************************************/


/*********************** 공통 checkbox/radio css START *******************/
/*************************************************************************/
.newcheckbox {  
    display: block;
    position: relative;
    min-height: 20px;
    padding-left: 20px;
    margin-top: 3px; 
    margin-bottom: 2px;
    vertical-align: middle;
}
.newcheckbox label {
    cursor: pointer;
    position: absolute;
    left: 0;
    display: inline;
    margin-bottom: 0;
    font-weight: normal;
    line-height: 1;
    color: #8c8c8c;
    vertical-align: middle;
}
.newcheckbox input[type="checkbox"],
.newcheckbox input[type="radio"] {
    width: 16px;
    height: 16px;
    position: absolute;
    float: left;
    left: 0;
    margin: 0;
    line-height: normal;
    opacity: 0.00000001;
}
.newcheckbox input[type="checkbox"] ~ svg .st6,
.newcheckbox input[type="checkbox"].disabledCheckbox ~ svg.active .st6 {fill: #fff;}
.newcheckbox input[type="checkbox"].disabledCheckbox ~ svg .st19,
.newcheckbox input[type="checkbox"] ~ svg:not(.active) .st19 {fill: #dbdcdf;}
.newcheckbox input[type="checkbox"].disabledCheckbox ~ svg .st6 {fill: #f3f4f5;}

.newcheckbox svg {
    display: block;
    cursor: pointer;
    fill: #dbdcdf;
    position: absolute;
    top: 0;
    left: 0px;
    -webkit-transition: opacity 0.18s ease;
    -moz-transition: opacity 0.18s ease;
    -ms-transition: opacity 0.18s ease;
    -o-transition: opacity 0.18s ease;
    transition: opacity 0.18s ease;
}
.newcheckbox svg.active { opacity: 0; fill: #4789e7; }
.newcheckbox input:checked ~ svg:not(.active) { opacity: 0; }
.newcheckbox input:checked ~ svg.active { opacity: 1; }
.newcheckbox input[type="checkbox"].error:not(:checked) ~ svg:not(.active) { fill: #ee445f; }
.newcheckbox.disabled {opacity: 0.3;}


.bootstrap-select .btn.btn-default.dropdown-toggle.disabled { background-color:#F3F4F5 !important; border:1px solid #DBDCDF !important; opacity: 1;}

/************************* 공통 selectbox css START **********************/
/*************************************************************************/
.common-selectbox { 
    position: relative;
    text-align: left;
    float: left;
    width: 100%;
}
.common-selectbox > .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) { width: 100%; max-width: 150px; height: 48px;}
.common-selectbox.nonplace-holder > .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {height: 40px;}
.common-selectbox > .bootstrap-select .dropdown-toggle .bs-caret { display: none; }
.common-selectbox > .bootstrap-select .btn.btn-default,
.common-selectbox.point-holder > .bootstrap-select .btn.btn-default,
.common-selectbox.nonplace-holder > .bootstrap-select .btn.btn-default {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.common-selectbox > .bootstrap-select .btn.btn-default,
.common-selectbox > .bootstrap-select .btn.btn-default:hover,
.common-selectbox > .bootstrap-select .btn.btn-default:active,
.common-selectbox > .bootstrap-select .btn.btn-default.active {
    border:1px solid #dbdcdf;
    background-color: #ffffff !important;
    color: #696c71;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none!important;
    max-width: 150px;
    width: 100%;
    height: 50px;
    padding: 11px 19px;
    font-size: 14px;
}

.common-selectbox.point-holder > .bootstrap-select .btn.btn-default,
.common-selectbox.point-holder > .bootstrap-select .btn.btn-default:hover,
.common-selectbox.point-holder > .bootstrap-select .btn.btn-default:active,
.common-selectbox.point-holder > .bootstrap-select .btn.btn-default.active,
.common-selectbox.nonplace-holder > .bootstrap-select .btn.btn-default,
.common-selectbox.nonplace-holder > .bootstrap-select .btn.btn-default:hover,
.common-selectbox.nonplace-holder > .bootstrap-select .btn.btn-default:active,
.common-selectbox.nonplace-holder > .bootstrap-select .btn.btn-default.active {
    height: 40px;
    padding: 9px 15px;
    font-size: 13px;
}
.common-selectbox > .bootstrap-select.open .btn.btn-default,
.common-selectbox > .bootstrap-select.open > .dropdown-menu {
    border-color: #4789e7;
}
.common-selectbox > .bootstrap-select > .dropdown-menu {
    padding: 0;
    margin: 0;
    height: auto;
    max-height: 240px;
    border: 1px solid #dbdcdf;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.common-selectbox > .bootstrap-select .dropdown-menu > li > a {
    color: #222228;
    font-size: 14px;
    font-weight: 300;
    line-height: 1.5;
    padding: 5px 18px;
    width: 100%;
    height:auto;
    cursor: pointer;
    overflow: hidden;

} 
.common-selectbox > .bootstrap-select .dropdown-menu > .active > a,
.common-selectbox > .bootstrap-select .dropdown-menu > .active > a:hover, 
.common-selectbox > .bootstrap-select .dropdown-menu > .active > a:focus {
    border-color: #d6d7d8;
    background-color: #f7f7f7;
}
.common-selectbox > svg { 
    position: absolute;
    top: 50%;
    left: 122px;
    fill: #696c71;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}
/* .common-selectbox .common-value-box {
    width:260px;
    height:48px;
    background-color: #f3f4f5;
    border: solid 1px #dbdcdf;
    border-radius: 3px;
    margin-left: 7px;
    box-sizing: border-box;
} */
/************************ 공통 selectbox css END *************************/
/*************************************************************************/

/* 2.4 .dashboard subMenu [공통] **********************************************************************/
/*****************************************************************************************************/
.dashbottom-wrap {
    width:100%;
    background-color:#eff0f4;
    padding:20px 0px 100px 0px;
    font-family: 'Noto Sans KR','Noto sans','Open sans', 'Arial', sans-serif;
}
.dashbottom-container {
    width:100%;
    max-width:945px;
    margin:0 auto;
    position:relative;
}

#section-top-menu {width:100%; overflow: hidden; background-color: #fff;}
.nav-container {
    margin-bottom:0;
    width:100%;
    padding-left:0;
    padding: 10px 0 0 0;
    border-bottom:1px solid #eff4fb;
    height: 44px;
}
.sub-navbar { overflow: hidden; }
.sub-navbar > li { float:left; position:relative; padding:0 41px 11px;}
.sub-navbar > li.active > a {color:#3c4450;}
.sub-navbar > li > a {display:inline-block; color:#9ca3a9;font-size:13px;}
.sub-navbar > li.active:after {
    content: ' ';
    display:inline-block;
    position:absolute;
    right:0;
    bottom:-1px;
    left:0;
    background-color:#3c4450;
    background-clip:content-box;
    height: 3px;
    width: 100%;
}
.sub-navbar > li > a > div { width:auto; display:inline-block; position:relative;}

.submenu_navWrap {
    width:100%;
    max-width:947px;
    position:relative;
    z-index:1;
    left:0%;
    transform:translateX(0%);
    margin:0px;
    padding:30px 0px;
    background-color: #fff;
}
.submenu_nav {overflow: hidden;}
.submenu_nav .title {
    float:left;
    padding-left:41px;
    padding-right:58px; 
    color: #3c4450; 
    font-size:22px;
}
.submenu_nav ul {float: left;width:auto; display: block;}
.submenu_nav li {float: left;margin-right:28px;}
.submenu_nav .sub-menu {position: relative;color: #9ca3a9; font-size: 14px;}
.submenu_nav ul li:last-child {margin-right: 0;}
.submenu_nav .sub-menu:after {
    content: ' ';
    width:1px;
    height:12px;
    background-color: #82888d;
    position: absolute;
    top: 5px;
    margin: 0 14px;
}
.submenu_nav li:last-child .sub-menu:after {display: none;}
.submenu_nav .sub-menu-bar {
    float:left;
    width:1px;
    height:12px;
    background-color:#3c4450;
    position:relative;
    top:16px;
    margin-left:15px;
}
.submenu_nav .sub-menu.active {color:#3c4450;}
.mobile-first-cover {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    background-color: #fff;
}
.mobile-title {
    width:100%;
    padding:12px 0px;
    font-size:24px;
    position:relative;
    background-color:rgb(255,255,255);
    overflow:hidden;
    display:none;
    color: #222428;
}
.top-nav {
    position:absolute;
    bottom:-80px;
    margin:0px;
    border:0px;
}
.top-nav > ul > li {
    width:120px;
    height:45px;
    text-align:center;
    font-weight:normal;
}

/* 2.5 .dashboard setting-box [공통] ******************************************************************/
/*****************************************************************************************************/
.setting-box {
    width:100%;
    padding:50px 40px 0 40px;
    float:left;
    background-color: #fff;
    border-top: 1px solid #eeeef0;  
    border-bottom: 1px solid #eeeef0;
}
.setting-sub-box {width:100%;min-height:100px;/* display:inline-block; */}
.setting-sub-box .setting-subInfoBox:last-child {margin-bottom: 0;border-bottom: 0;}
.setting-sub-box .setting-subInfoBox {
    margin-bottom: 50px;
    padding-bottom: 27px;
    float: left;
    width: 100%;
    border-bottom: 1px solid #eeeef0;
}
.setting-sub-title {
    width: 100%;
    max-width: 160px;
    font-size: 18px;
    float: left;
    color: #222428;
    font-weight: 400;
    margin-right: 138px;
    letter-spacing: -0.5px;
}
/* .setting-sub-contentWrap {
    width: calc(100% - 293px);
    max-width: calc(100% - 293px);
    float: left;
} */
.setting-sub-content {
    width: 100%;
    max-width: 440px;
    word-break: keep-all;
    float:left;
    display:inline-block;
    position:relative;
}
.setting-text-box {
    float:left;
    width:100%;
    position:relative;
    margin-bottom: 30px;
}
.setting-sub-content-title {
    font-size:13px;
    margin-bottom:10px;
    width:100%;
    float:left;
    color: #222428;
    font-weight: 400;
    position: relative;
}

@media only screen and (max-width: 767px) {
    .mobilemng-member {
      height: initial;
    }
    #addr-modal { height: 515px; max-width: 90%; max-height: 80%; top: 50%; }
    #addr-body > div {position: relative;}
    .flat-modal.cl-common-modal {
        z-index: 9999;
        position: fixed;
        left: 0px;
        top: 0px;
    }

    /*** mobileMenu ***/
    #eventNotice.shoppingevent,#eventNotice.forms {display: none;}
    .dashbottom-wrap {
        position: fixed;
        width: 100%;
        height: 100%;
        overflow-y: auto;
        overflow-x: hidden;
        left: 0px;
        top: 0px;
        padding: 0px;
        z-index: 1010;
    }
    .dashbottom-wrap.mng-dashboardWrap {background-color: #fff;}
    .submenu_nav ul {width: 100%;}
    .navbermenu-wrap { position: relative; float:left; margin-right: 14px;}
    .navbermenu-wrap a.navbar-toggle {margin:0; padding:7px 0 0px 0;}
    #popup-title {
        float: left;
        margin: 2px 0 0 0;
        padding: 0;
        border:none;
        width:auto;
        background-color:#fff;
    }
    .dashbottom-wrap .mobile-title {display:block; position: fixed; z-index: 9999;}
    #section-top-menu, .submenu_nav .title, .dot-menu {display:none;}
    .dashbottom-wrap .submenu_navWrap {
        font-size:16px;
        position:fixed;
        background-color:#eff0f4;
        padding:5px 15px 0px;
        overflow-x:auto;
        overflow-y:hidden;
        margin-top: 54px;
    }   
    .dashbottom-wrap .submenu_navWrap {
        -ms-overflow-style: none;
    }
    .dashbottom-wrap .submenu_navWrap::-webkit-scrollbar {
        display:none;
    }
    .submenu_nav .sub-menu {
        padding:8px 6px; 
        font-size: 16px;
        display:inline-block;
        color:#b1b3b7; 
        font-weight: 400;
    }
    .submenu_nav .sub-menu:after {
        display: none;
        content: ' ';
        width:1px;
        height:12px;
        background-color: transparent;
        position: absolute;
        top: 0px;
        margin: 0 14px;
    }
    .submenu_nav .sub-menu.active {border-bottom: 3px solid #4888e9;}
    .setting-box {padding: 0;}    
    .setting-sub-title {
        padding: 0px;
        margin: 0 0 40px 0;
        max-width: 100%;
        position: relative;
        width: 100%;
    }
    .setting-sub-box .setting-subInfoBox:first-child .setting-sub-title {margin-top: 35px;}
    .setting-sub-box {padding:30px 15px 15px 15px;}
    .setting-sub-content {width:100%;max-width: 100%;}
    

    /*mypage mobile*/
    .help_page.container-fluid {padding-top: 100px;}
    .navbar_right .header_user {display: none;}
    .mobile-detail-popup {display:block;} 
    .mobile-detail-popup > .title {
        width: 100%;
        padding: 13px 0px;
        font-size: 20pt;
        position: relative;
        background-color: rgb(255,255,255);
        overflow: hidden;
        margin-top: 0;
        margin-bottom: 0px;
    }
    .mobile-detail-popup.messagehead,
    .mobile-detail-popup.helphead {height:auto;}
    .mobile-detail-popup.mypagehead .mobile-popup-nav {height:47px;}
    .mobile-detail-popup .cl_icon_back {font-size:18px;}
    .mobile-title {
        width: 100%;
        padding: 12px 0px;
        font-size: 24px;
        position: relative;
        background-color: rgb(255,255,255);
        overflow: hidden;
        display: none;
        color: #222428;
    }
    .mobile-title span {position:relative;display:inline-block;padding-left:0;}
    .mobile-title span.cl_icon_menu {color:#222428; font-size:18px; float:left; cursor: pointer;}
    .mobile-title .m-menu-btn {fill:#222428;float: left; margin: 0 6px 0 20px;}
  
    .mobile-popup-nav {padding:0px 15px; height: 40px; }
    .mobile-popup-nav > .mpopupsub-nav {display:inline-block;height:100%;font-size:13px;}
    .mobile-popup-nav > .mpopupsub-nav > li {float:left;position:relative;}
    .mobile-popup-nav > .mpopupsub-nav > li > a {padding:8px 11px; display:inline-block;color:#82888d; font-weight: 500;letter-spacing: -0.5px;}
    .mobile-popup-nav > .mpopupsub-nav > li:last-child > a { padding-left: 6px; padding-right: 6px;}
    .mobile-popup-nav > .mpopupsub-nav > li.mpopup-menu > a {font-size:14px;}
    .mobile-popup-nav > .mpopupsub-nav > li.active > a {color:#222228;}
    .mobile-popup-nav > .mpopupsub-nav > li.active:after {content: ' ';display:inline-block;position:absolute;right:0;bottom:-1px;left:0;background-color:#4888e9;background-clip:content-box;height: 3px;width: 100%;}
    .mobile-popup-nav > .mpopupsub-nav > li > a > div {width:auto;display:inline-block;position:relative;left:50%;transform:translateX(-50%); cursor: pointer;}
    .mobile-popup-nav > .mpopupsub-nav > li > a > div > .order-number {display:inline-block;margin-left:10px;color:#4888e9;font-weight:500;}

    .mobile-back-menu {position:relative;cursor:pointer;float:left;position:relative;top:11px; font-size:18px;}
    .mobile-detail-back-menu {position:relative;padding-left:15px;cursor:pointer;float:left;}
    .mobile-detail-popup > form {width:100%;height:100%;}
    .mobile-detail-popup > form > .title {width:100%;padding:15px 0px;font-size:20pt;position:relative;background-color:rgb(255,255,255);font-weight:bold;overflow: hidden;}
    .mobile-detail-popup > form > .title span {float:left;position:relative;display:inline-block;padding-left:15px;font-weight: 500;}
    .mobile-detail-popup > form > .title span.cl_icon_menu {
        color: #222428;
        font-size: 14px;
        float: left;
    }
    .mobile-detail-box {padding:15px;width:100%;background-color:rgb(255,255,255);float:left;}
    .mobile-detail-box > p {margin:0px;font-size:16px;}
    .mobile-detail-box select {width:100%;height:37px;}
    .mobile-detail-box input {width:100%;height:37px;border:1px solid #eaeaea;padding-left:10px;}

    .mobile-detail-box > div > span:nth-child(2) {display:inline-block;float:right;}
    .mobile-detail-popup .navbermenu-wrap {
        position: relative;
        float:left;
    }
    .mobile-detail-popup > .title span.cl_icon_menu {
        color: #222428;
        font-size: 18px;
        float: left;
        cursor: pointer;
    }
    .mobile-detail-popup > .title span {
        position: relative;
        display: inline-block;
        padding-left: 15px;
    }
    .mobile-detail-popup .navbermenu-wrap a.navbar-toggle {margin:0; padding:9px 0 0px 0;}
    .mobile-detail-popup #popup-title {
        float: left;
        margin: 5px 0 0 0;
        padding: 0;
        border:none;
        /*width:auto;
        width:calc(100% - 46px);*/
        background-color:#fff;
    }
    .mobile-detail-popup #popup-title span {padding-left:0; font-weight: 500;font-size:24px; color:#222428;}

    .mobile-popup-contents {width:100%;position:relative;top:0;display:inline-block;height:calc(100% - 94px);overflow-y:auto;overflow-x:hidden;z-index:101;background-color: #fff;}
    .mobile-popup-contents.m-setinfo,
    .mobile-popup-contents.m-setlog {
        height: auto;
        overflow: inherit;
    }
    .mobile-popup-contents.m-setlog .cl_icon_del03 {font-size:14px;}
    .mobile-popup-contents.m-setlog .mlogval {color: #82888d; padding-right: 12px;}
    .mobile-popup-contents.m-setlog .mlogval + .cl_icon_del03 {color: #f03f60;}

    .mobile-popup-contents > .mobile-contents-box {width:100%;padding:15px;background-color:rgb(255,255,255);display:inline-block;float:left;}
    .mobile-popup-contents > .mobile-contents-box > div {float:left;}
    .mobile-popup-contents > .mobile-contents-box > div > img {width:50px;height:50px;}
    .mobile-popup-contents > .mobile-contents-box > div:nth-child(2) > p {margin:-4px 0px 8px 0;font-size:14px; color:#222428;  font-weight: 500;}
    .mobile-popup-contents > .mobile-contents-box > div:nth-child(2) > p > span {font-size:18px;font-weight:bold;}
    .mobile-popup-contents > .mobile-contents-box > .admin-status-box {margin-top:20px;width:100%;padding-left:80px;}
  
    .mobile-popup-contents .setting-box {padding:28px;}    
    .mobile-popup-contents ul.maccount li {
        font-size: 16px;
        color: #42464c;
        letter-spacing: 0.05em;
        margin-bottom: 10px;
        padding-bottom: 0px;
    }
    .mobile-popup-contents ul.maccount li p {
        display: inline-block;
        color:#222428;
    }
    .mobile-popup-contents ul.maccount li span {
        color:#82888d;
    }
    .mobile-popup-contents ul.maccount li span.changepwd {
        color:#4789e7;  
    }
    .mobile-popup-contents ul.maccount li .pwd_changenotice {display: none;}

    /*new*/
    .m-header_user .btn-group.dash-lang .dropdown-menu {  display: none; }
    .m-header_user { 
        position:fixed; 
        top:0; 
        left:-100%; 
        right:0; 
        width:86%; 
        padding:0; 
        margin-left:0; 
        border-top: none; 
        z-index:1040; 
        height: 100%;        
        overflow-x: hidden;
        -webkit-transition: all 0.3s cubic-bezier(0.23, 0.21, 0.31, 1.01);
        -moz-transition: all 0.3s cubic-bezier(0.23, 0.21, 0.31, 1.01);
        -ms-transition: all 0.3s cubic-bezier(0.23, 0.21, 0.31, 1.01);
        -o-transition: all 0.3s cubic-bezier(0.23, 0.21, 0.31, 1.01);
        transition: all 0.3s cubic-bezier(0.23, 0.21, 0.31, 1.01);
    }
    .m-header_user {          
        width:312px; 
        height: 100%;
        border-top: none;
        z-index:1012;        
    }
    .m-header_user .mlogout a {font-size:14px; color:#222228;line-height: 32px;}
    .m-header_user * {
        font-family: 'Noto Sans', 'Noto Sans KR',sans-serif;
        color:#222428;
    }
    .m-header_user .nav { background:#fff; position: relative; top:0; left:0; width: 100%; height: 100%; }
    .m-header_user a { line-height:34px; width:100%; padding:0; }
    .m-header_user .mlogin-text {line-height: 34px;font-size: 14px;color: #fff;}
    .m-header_user .navbar-right li.m-support-box { text-align: left; padding:23px 19px; position: absolute; bottom: 0;width: 100%;  background-color: #3c4451;}
    .m-header_user .navbar-right li.m-support-box * { color:#fff;}
    .m-header_user .navbar-right li.m-support-box ul {}
    .m-header_user .navbar-right li.m-support-box ul li { display: inline-block; margin-right:32px; }
    .m-header_user .navbar-right li.m-support-box ul li:last-child {margin-right:0;float:right;}
    .m-header_user .navbar-right li.m-support-box ul li span {font-size: 16px;}
    .m-header_user .navbar-right li.m-support-box ul li span.cl-icon {margin-right: 6px;}
      
    .m-header_user .dropdown-menu a {font-size:16px;box-shadow: none;padding: 0;}
    .m-header_user .dropdown-menu > li > a.mdash-home svg {margin-right: 13px;}
    .m-header_user .dropdown-menu > li > a:hover, .m-header_user .dropdown-menu > li > a:focus {background-color:#eeeff3;}
    .m-header_user .dropdown-menu > li {line-height:34px; width:100%; overflow: hidden; }
    .m-header_user .mMymenu-wrap {
        float: left;
        width: 100%;
        text-align: center;  
        padding:24px 0 13px 0px;
        border-bottom: 1px solid #e7e8e9;
        border-top: 1px solid #e7e8e9;
    }
    .m-header_user .myhome-icon svg {
        fill: #222428;
        margin-right: 12px;
    }
    .m-header_user .mMymenu {display: inline-block;text-align: center;}
    .m-header_user .mMymenu li {    
        float: left;
        width: 58px;
        height: 46px;
        margin-right: 26px;
        position: relative;
    }
    .m-header_user .mMymenu li:last-child { margin-right: 0px; line-height: 34px; cursor: pointer; }
    .m-header_user .mMymenu a {
        display: block;
        width: 100%;
        height: 100%;
    }
    .m-header_user .mMymenu svg {
        left: 50%;
        transform: translateX(-50%);
        float: left;
        position: absolute;
    }
    .m-header_user .mMymenu .cl-icon { display: block;}
    .m-header_user .mMymenu .m-mypage .menu-title {letter-spacing: -1px;}
    .m-header_user .mMymenu .menu-title {font-size:12px;display: inline-block;margin-top: 18px;}
    .m-header_user .dropdown-menu > li > a { padding:4px 18px;display: block;}
    .m-header_user .dropdown-menu > li:nth-child(2) > a {margin-top:8px;}
    .m-header_user .signinwrap .dropdown-menu > li:nth-child(2) > a {margin-top:0px;}
    .m-header_user .dropdown-menu .mshoppingtab {position: relative;}
    .m-header_user .dropdown-menu .mshoppingtab svg,
    .m-header_user .dropdown-menu .mshoppingtab span.cl_icon_dropdown02 {
      color:#222228;
      top: 50%;
      position: absolute;
      right:8%;
      transform: translatey(-50%);
      font-size: 10px;
      fill: #222428;
    }
    .m-header_user .dropdown-menu .mshopping_menu li {padding:4px 0;}
    .m-header_user .dropdown-menu .mshopping_menu li a {padding-left: 50px;display: block;line-height: 30px;}
    .m-header_user .dropdown-menu .mshopping_menu li:hover {background-color:#eeeff3;}
    .m-header_user .dropdown-menu .mshopping_menu li:hover a { }
    .m-header_user .dropdown-menu > li:first-child span {font-size:19px;}
    .m-header_user .dropdown-menu > li:first-child span.cl_icon_home {margin-right:10px;font-size:18px;color:#37374a;} 
   
    .m-header_user .mMymenu .newCount a, 
    .m-header_user .mMymenu .newCount a:hover, 
    .m-header_user .mMymenu .newCount a:focus{ color:#fff; }
    .m-header_user .mMymenu .newCount i.fa { font-size:13px; margin:0; }
    .m-header_user .mMymenu .newCount span.badge { font-size: 8px; padding:3px; background-color: #ee445f; position: absolute; top:-8px; right: -14px; color: #fff;line-height: 1;text-align: center;min-width: 16px;}
    .m-header_user .mMymenu .newCount span.badge:empty {
        min-width: 5px;
        max-width: 5px;
        display: block;
        border-radius: 50%;
        max-height: 5px;
        min-height: 5px;
        padding: 0;
        top: -1px;
        right: 15px;
    }
    .m-header_user .signinwrap .mobile-menu .dropdown-menu {
        padding-top: 18px;
    }
    .m-header_user .signinwrap .mobile-menu .mchange-lang {
      position: absolute;
      bottom: 0;
      padding: 15px 17px;
    }
    .m-header_user .signinwrap .mobile-menu .mchange-lang img {
      width: 34px;
      height:34px;
      border: 1px solid #d1d1d1;
      border-radius: 50%;
    }
    .m-header_user .mobile-menu .dropdown-menu { overflow-y : auto; text-align: left; margin: 0;display: block; clear: both; background-color:#fff;border: none;padding:14px 0;box-shadow: none;}
    .m-header_user .m-myinfo {
        width: 100%;
        position: relative;
        float: left;
        background-color: #ffffff;
        padding: 12px 18px;
        overflow: hidden;
    }
    .m-header_user .signinwrap .m-myinfo {
        padding-left: 16px;
    }

    .m-header_user .m-myinfo .profile_right { float: left;position: absolute; right: 22px; }  
    .m-header_user .m-myinfo .profile_right.msignin {
        right: 16px;
    }
    .m-header_user .m-myinfo .profile_right.msignin .mlogin-text {
        background-color: #4886e3; 
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        border: none;
        padding: 1px 23px;
    }
    .m-header_user .m-myinfo .profile_left {    
        float: left;
        width:62%;
        margin-right: 10px;
    }
    .m-header_user .m-myinfo .profile_left label.m-profile {
        width: 28px;
        height: 28px;
        float: left;
        margin-bottom: 0;
        margin-top:2px;
    }
    .m-header_user .m-myinfo .inner-box { 
        float: left;  
        padding:4px 0 0 10px; 
        width: 79%;
        text-overflow: ellipsis;
        white-space: nowrap;
        word-wrap: normal;
        overflow: hidden;
    }
    .m-header_user .signinwrap .m-myinfo .inner-box {
        width: 100%;
        padding-left: 0;
        padding-top: 0;
    }
    .m-header_user .signinwrap .m-myinfo .inner-box > a { line-height: 31px; }
    .m-header_user .m-myinfo .inner-box span { color:#222428;font-family: 'Noto Sans', 'Noto Sans KR'; font-size: 20px; }
    .m-header_user .m-myinfo .inner-box span.m-text-size { font-size: 16px; } 
    #nav.default-nav ~ .m-headerClose { padding:3px 0 !important; display: block; cursor: pointer;}
    .m-headerClose {
        display: block;
        z-index: -10;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        position: fixed;
        background-color: rgba(0, 0, 0, 0.7);
        -webkit-transition: all 0.25s linear;
        -moz-transition: all 0.25s linear;
        -o-transition: all 0.25s linear;
        transition: all 0.25s linear;
        opacity: 0;
    }
    .m-headerClose.in {
        -webkit-transition: all 0.3s linear;
        -moz-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        transition: all 0.3s linear;
        opacity: 1;
        z-index: 1011;
    }
    .m-headerClose svg {
        fill:#fff; 
        position: absolute;
        margin-top: 3%;
        left: 328px;
    }
 
    .m-header_user .btn-group .dropdown-toggle,
    .m-header_user .btn-group.open .dropdown-menu { display: block;  text-align: center;  max-width:100%;}
    .m-header_user .btn-group .dropdown-toggle .name-text { padding:0; }
    .m-header_user .btn-group.open .dropdown-menu li a { padding: 0 18px; }
    .m-header_user .btn-group .dropdown-toggle span.caret { display: none; }
    .m-header_user .nav .lang-box .dropdown-toggle {padding: 5px 0; background-color: #fff;}
    .m-header_user .nav .lang-box .dropdown-toggle .caret { display: inline-block; }
    .m-header_user .nav .lang-box.open .dropdown-menu { display: block; width: 100%; padding: 0; margin: 0; }
    .navbar-nav .dash-lang { border-top: 1px solid #4b5565; }
    .m-header_user .btn-group {display: block;}
    .m-header_user .btn-group .dropdown-toggle { text-align: right; }
    .m-header_user .btn-group .dropdown-toggle .name-text { padding: 5px 0 5px 10px; margin:0; border: none; max-width: 65px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; display: inline-block;  }
    .m-header_user .btn-group .dropdown-toggle span.caret { border-top:4px solid #ee445f; border-right:3px solid transparent; border-left:3px solid transparent; margin-bottom: 0;}
    .m-header_user .nav .lang-box { line-height: 53px; margin: 0 0 0 20px; cursor:pointer; width:100%;border-top: 0; box-shadow: none;}
    .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { background:transparent; }
    .navbar-collapse { max-height: none; }
    .dash-lang { float: right !important; }
    .m-header_user .btn-group.dash-lang .dropdown-menu { display: none; }
    .m-header_user .btn-group.dash-lang.open .dropdown-menu { 
        display: block;
        width: 100%;
        top: 52px; 
        float: left; 
        min-width: 100px; 
        line-height: 20px; 
        padding: 0; 
        margin: 2px 0 0; 
        list-style: none; 
        background-color: #fff;
        border: 1px solid #ccc; 
        border: 1px solid rgba(0,0,0,.15); 
        -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175); 
        box-shadow: 0 6px 12px rgba(0,0,0,.175); 
        background-clip: padding-box; 
    }
    .m-header_user .btn-group.dash-lang.open .dropdown-menu li a { line-height: 20px; font-size: 12px; background-color:#ffffff; color:#37374a; width: 100%; padding: 8px 10px;}
    .m-header_user .btn-group.dash-lang.open .dropdown-menu li a:hover { background-color: #f5f5f5; } 

    /*mobile toggle*/
    .mobile-detail-popup .m-header_user .btn-group.dash-lang .dropdown-menu {  display: none; }
    .mobile-detail-popup .m-header_user { position:relative; top:0; left:0; right:0; width:100%; padding:0; margin-left:0; border-top: none; z-index: 110;}
    .mobile-detail-popup .m-header_user * {
        font-family: 'Noto Sans', 'Noto Sans KR';
        color:#222428;
    }
    .mobile-detail-popup .navbar_right {
        position: absolute;
        top: 0;
        left: 0;
        right: auto;
        z-index: 102;
        width: 88%;
    }
    .mobile-detail-popup .m-header_user .nav { background:#f7f7f7; position: relative; top:0; left:0; width: 100%; }
    .mobile-detail-popup .m-header_user a { line-height:34px; width:100%; padding:0; }
    .mobile-detail-popup .m-header_user .navbar-right li.m-support-box { text-align: left; padding:23px 19px; position: absolute; bottom: 0;width: 100%;  background-color: #3c4451;}
    .mobile-detail-popup .m-header_user .navbar-right li.m-support-box * { color:#fff;}
    .mobile-detail-popup .m-header_user .navbar-right li.m-support-box ul {}
    .mobile-detail-popup .m-header_user .navbar-right li.m-support-box ul li { display: inline-block; margin-right:32px; }
    .mobile-detail-popup .m-header_user .navbar-right li.m-support-box ul li:last-child {margin-right:0;float:right;}
    .mobile-detail-popup .m-header_user .navbar-right li.m-support-box ul li span {font-size: 16px;padding:0;}
    .mobile-detail-popup .m-header_user .navbar-right li.m-support-box ul li span.cl-icon {padding-right:15px;}

    .mobile-detail-popup .m-header_user .dropdown-menu a {font-size:16px;box-shadow: none;}
    .mobile-detail-popup .m-header_user .dropdown-menu li {padding:10px 18px; line-height:34px; width:100%; display: inline-block; }
    .mobile-detail-popup .m-header_user .dropdown-menu .mshoppingtab {position: relative;}
    .mobile-detail-popup .m-header_user .dropdown-menu .mshoppingtab .cl_icon_arrow03,
    .mobile-detail-popup .m-header_user .dropdown-menu .mshoppingtab .cl_icon_dropdown02 {
        color:#222228;
        top: 50%;
        position: absolute;
        right: 0;
        transform: translatey(-50%);
        font-size: 7px;
    }
    .mobile-detail-popup .m-header_user .dropdown-menu .mshopping_menu {}
    .mobile-detail-popup .m-header_user .dropdown-menu .mshopping_menu li {padding:4px 0;}
    .mobile-detail-popup .m-header_user .dropdown-menu .mshopping_menu li a {padding-left: 50px;}
    .mobile-detail-popup .m-header_user .dropdown-menu .mshopping_menu li:hover {background-color:#eaeef5;}
    .mobile-detail-popup .m-header_user .dropdown-menu .mshopping_menu li:hover a {color:#4191f0; }
    .mobile-detail-popup .m-header_user .dropdown-menu li:first-child {padding-top:0px;}
    .mobile-detail-popup .m-header_user .dropdown-menu li:first-child span {font-size:19px;}
    .mobile-detail-popup .m-header_user .dropdown-menu li:first-child span.cl_icon_home {margin-right:10px;font-size:18px;color:#37374a; margin-top: 9px;}
  
    #nav.default-nav .header .navbar_right .m-header_user .m-myinfo .newCount span.badge,
    .mobile-detail-popup .m-header_user .m-myinfo .newCount span.badge {     
        font-size: 9px;
        padding: 3px 4px 2px;
        background-color: #ee445f;
        position: absolute;
        top: 6px;
        right: 22%;
        color: #fff;
        line-height: 1;
        text-align: left;
        min-width: 16px; 
    } 
    .mobile-detail-popup .m-header_user .dropdown-menu { text-align: left; margin: 0;display: block; clear: both; background-color:#f7f7f7;border: none;padding:18px 0;box-shadow: none;}
    .mobile-detail-popup .m-header_user .m-myinfo {
        width: 100%;
        position: relative;
        float: left;
        background-color: #ffffff;
        padding: 13px 22px;
    }
    .mobile-detail-popup .m-header_user .m-myinfo .profile_left {    
        float: left;
        width: 66%;
    }
    .mobile-detail-popup .m-header_user .m-myinfo .profile_left label.m-profile {
        width: 28px;
        height: 28px;
        float: left;
        margin-bottom: 0;
    }
    .mobile-detail-popup .m-header_user .m-myinfo .inner-box { float: left;  padding:0 0 0 10px; width: 84%; }
    .mobile-detail-popup .m-header_user .m-myinfo .inner-box span { color:#222428;font-family: 'Noto Sans', 'Noto Sans KR'; font-size: 20px;}
    .mobile-detail-popup .m-header_user .m-myinfo .profile_right { float: right; }
    .mobile-detail-popup .m-header_user .m-myinfo .profile_right .prorightmenu {display: inline-block; margin-right:10px; }
    .mobile-detail-popup .m-header_user .m-myinfo .profile_right .newCount{ position: inherit; right:auto; left:auto;}
    .mobile-detail-popup .m-header_user .m-myinfo .profile_right .newCount a {
        padding: 0;
        text-align: inherit;
        line-height: inherit;
    }
    .mobile-detail-popup .m-header_user .m-myinfo .profile_right .cl-icon {color:#222428;font-weight: 500;padding-left: 0;}
    .mobile-detail-popup .m-header_user .m-myinfo .profile_right .newCount .cl_icon_alarm { font-size:16px; margin-right: 0;}
    .mobile-detail-popup .m-header_user .m-myinfo .profile_right .m-mypage { display: inline-block; margin-top: 3px;}
    .mobile-detail-popup .m-header_user .m-myinfo .profile_right .cl_icon_profile02,
    .mobile-detail-popup .m-header_user .m-myinfo .profile_right .cl_icon_globe {font-size:18px; }
    /* .mobile-detail-popup .m-headerClose {
        position: absolute;
        right: 5%;
        top: 23%;
        color:#fff;
        z-index: 115;
        font-size:15px;
    } */
    .mobile-detail-popup .navbar_right .modal-backdrop.m-headermenu.in {z-index: 80; opacity: 0.8;}

    .mobile-detail-popup .m-header_user .btn-group .dropdown-toggle,
    .mobile-detail-popup .m-header_user .btn-group.open .dropdown-menu { display: block;  text-align: center;  max-width:100%;}
    .mobile-detail-popup .m-header_user .btn-group .dropdown-toggle .name-text { padding:0; }
    .mobile-detail-popup .m-header_user .btn-group.open .dropdown-menu li a { padding: 0 18px; }
    .mobile-detail-popup .m-header_user .btn-group .dropdown-toggle span.caret { display: none; }
    .mobile-detail-popup .m-header_user .nav .lang-box .dropdown-toggle {padding: 5px 0; background-color: #f7f7f7;}
    .mobile-detail-popup .m-header_user .nav .lang-box .dropdown-toggle .caret { display: inline-block; }
    .mobile-detail-popup .m-header_user .nav .lang-box.open .dropdown-menu { display: block; width: 100%; padding: 0; margin: 0; }
    .navbar-nav .dash-lang { border-top: 1px solid #4b5565; }
    .mobile-detail-popup .m-header_user .btn-group {display: block;}
    .mobile-detail-popup .m-header_user .btn-group .dropdown-toggle { text-align: right; }
    .mobile-detail-popup .m-header_user .btn-group .dropdown-toggle .name-text { padding: 5px 0 5px 10px; margin:0; border: none; /*max-width: 65px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;*/ display: inline-block;  }
    .mobile-detail-popup .m-header_user .btn-group .dropdown-toggle span.caret { border-top:4px solid #ee445f; border-right:3px solid transparent; border-left:3px solid transparent; margin-bottom: 0;}
    .mobile-detail-popup .m-header_user .nav .lang-box { line-height: 53px; margin: 0 0 0 20px; cursor:pointer; width:100%;border-top: 0; box-shadow: none;}
    .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { background:transparent; }
    .navbar-collapse { max-height: none; }
    .dash-lang { float: right !important; }
    .mobile-detail-popup .m-header_user .btn-group.dash-lang .dropdown-menu { display: none; }
    .mobile-detail-popup .m-header_user .btn-group.dash-lang.open .dropdown-menu { 
        display: block;
        width: 100%;
        top: 52px; 
        float: left; 
        min-width: 100px; 
        line-height: 20px; 
        padding: 0; 
        margin: 2px 0 0; 
        list-style: none; 
        background-color: #fff;
        border: 1px solid #ccc; 
        border: 1px solid rgba(0,0,0,.15); 
        -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175); 
        box-shadow: 0 6px 12px rgba(0,0,0,.175); 
        background-clip: padding-box; 
    }
    .mobile-detail-popup .m-header_user .btn-group.dash-lang.open .dropdown-menu li a { line-height: 20px; font-size: 12px; background-color:#ffffff; color:#37374a; width: 100%; padding: 8px 10px;}
    .mobile-detail-popup .m-header_user .btn-group.dash-lang.open .dropdown-menu li a:hover { background-color: #f5f5f5; }
    
    .flat-modal .modal-default .modal-dialog.changelang {padding-left:26px; padding-right:26px; transform: translate(0, 61%); -webkit-transform: translate(0, 61%); -ms-transform: translate(0, 61%);}
    .flat-modal .modal-default .modal-dialog.changelang button.close {display: none;}
    .flat-modal .modal-default .modal-dialog.changelang .modal-content {border-radius: 10px;}
    .flat-modal .modal-default .modal-dialog.changelang .dashlang-wrap .dashlang-select {display: inline-block; width:100%;padding: 15px;border-bottom: 1px solid #d9d9d9;}
    .flat-modal .modal-default .modal-dialog.changelang .dashlang-wrap .dashlang-select:first-child {padding-top:0;}
    .flat-modal .modal-default .modal-dialog.changelang .dashlang-wrap .dashlang-select:last-child {border-bottom:none;}
    .flat-modal .modal-default .modal-dialog.changelang .dashlang-wrap .mdash-lang {float:left; font-size: 19px; }
    .flat-modal .modal-default .modal-dialog.changelang .dashlang-wrap .cl-check-lang {font-size:20px;float: right; margin-top: 5px;}
    .flat-modal .modal-default .modal-dialog.changelang .dashlang-wrap .cl_icon_checked04 {color:#4888e9;}
    .flat-modal .modal-default .modal-dialog.changelang .dashlang-wrap .cl_icon_unchecked04 {color:#a1a7af;}
  
    /*m-dashboard-settings*/
    .m-dashboard-setting .m-popupcontents{height:100%;background-color: #fff;}
    .mobile-detail-popup .m-popupcontents .setting-box {padding:30px 15px;}
    .mobile-detail-popup .m-popupcontents .medit-nickcancel {
        position: absolute;
        top: 50%;
        right: 65px;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        cursor: pointer;
    }
    .mobile-detail-popup .m-popupcontents li span.cl_icon_arrow03 {font-size:12px;margin-left: 9px;}
    .mobile-detail-popup .m-popupcontents li span.cl_icon_edit05 {font-size:14px;margin-left: 3px;}
    .mobile-detail-popup .m-popupcontents li {font-size:16px; color:#222428; padding-bottom: 25px; position: relative;}
    .mobile-detail-popup .m-popupcontents li:last-child {margin-bottom: 0;}
    .mobile-detail-popup .m-popupcontents li .popover {z-index: 99;}
    .mobile-detail-popup .m-popupcontents li * {
        font-weight:400;
    }
    .mobile-detail-popup .m-popupcontents li .detaildata {color:#4191f0;}
    .mobile-detail-popup .m-popupcontents .fl-right {float:right;}
    
    .mobile-detail-popup .m-popupcontents .detailnick-right {
        position: relative;
         display: none;
        width: 100%;
        bottom: 0px;
        margin: 10px 0 20px 0;
        font-size: 12px;
    } 
  
    .mobile-detail-popup .m-popupcontents .m-setlog li.google-rg span .google-editBox,
    .mobile-detail-popup .m-popupcontents .m-setlog li.facebook-rg span .facebook-editBox,
    .mobile-detail-popup .m-popupcontents .m-setlog li.naver-r-rg span .naver-editBox {
        width: 100%;
        position: relative;
        display: none;
    }
    .mobile-detail-popup .m-popupcontents .edit-nicktext {
        position: absolute;
        top:3px;
        width: 68%;
        bottom: 0px;
        right: 0;
    }
    .mobile-detail-popup .m-popupcontents .google-editBox .register-googlesave,
    .mobile-detail-popup .m-popupcontents .facebook-editBox .register-facebooksave,
    .mobile-detail-popup .m-popupcontents .naver-editBox .register-naversave,
    .mobile-detail-popup .m-popupcontents .edit-nicktext .edit-nicksave {
        padding: 3px 9px;
        height: 35px;
        width: 50px;
        border-radius: 0px;
    }
    .mobile-detail-popup .m-popupcontents .google-editBox .google-editcancel,
    .mobile-detail-popup .m-popupcontents .facebook-editBox .facebook-editcancel,
    .mobile-detail-popup .m-popupcontents .naver-editBox .naver-editcancel,
    .mobile-detail-popup .m-popupcontents .edit-nicktext .edit-nickcancel {
        position: absolute;
        cursor: pointer;
        top: 3px;
        right: 60px;
    }
    .mobile-detail-popup .m-popupcontents .google-editBox .register-googlesave > i,
    .mobile-detail-popup .m-popupcontents .facebook-editBox .register-facebooksave > i,
    .mobile-detail-popup .m-popupcontents .naver-editBox .register-naversave > i,
    .mobile-detail-popup .m-popupcontents .edit-nicktext .edit-nicksave > i {
        color: #fff;
        margin-left: 0px;
    }

    .mobile-detail-popup .m-popupcontents .google-editBox > div > input,
    .mobile-detail-popup .m-popupcontents .facebook-editBox > div > input,
    .mobile-detail-popup .m-popupcontents .naver-editBox > div  > input,
    .mobile-detail-popup .m-popupcontents .edit-nicktext > div > input {
        font-size: 12px;
        padding: 3px 9px;
        height: 35px;
        border-radius:4px 0 0 4px;
        box-shadow: none;
    }
    .forms .forms-list .pc:not(.formregdate) {display: none;}
     .mobile-first-cover {display: block;}
}

/******************* 공통 common modal form/input css ********************/
/*************************************************************************/
.cl-common-form-wrap {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #dbdcdf;
    margin-bottom: 8px;
    /* overflow: hidden; */
    float: left;
    width: 100%;
}
.cl-common-form-wrap.empty { border-color: #ee445f; }
.cl-common-form-wrap.active { border-color: #4789e7; }
.cl-common-form-wrap.error { border-color: #ee445f; }
.cl-common-modal .modal .btn {box-shadow: none;}
.cl-common-modal .modal .popup-primary-btn {margin-bottom: 10px; margin-top: 50px; font-size: 14px;}
.cl-common-modal .modal .btn.btn-sm.cancel-btn.close-button-dialog {color:#696c71; font-size: 14px;}
/* input style1(.cl-common-form-group) */
.cl-common-form-group { 
    padding: 23px 20px 7px 20px;
    margin-bottom: 0;
    position: relative;
    margin-bottom: 0;
    background-color:#fff;
    text-align: left;
    float: left;
    width: 100%;
}
.cl-common-form-wrap.nonplace-holder.setting-text-box/* ,
.cl-common-form-wrap.point-holder.setting-text-box */ {margin-bottom: 30px;}
.cl-common-form-wrap.nonplace-holder {margin-bottom: 0px;}
/* .cl-common-form-wrap.point-holder {margin-bottom: 0px;} */
.cl-common-form-wrap.nonplace-holder .cl-common-form-group {height: 38px; padding: 12px 15px;}
/*.cl-common-form-wrap.point-holder .cl-common-form-group {height: 38px; padding: 12px 10px;}*/
.cl-common-form-wrap.nonplace-holder .cl-common-form-group input {margin-top: -3px; color:#676767;}
.cl-common-form-wrap.nonplace-holder .cl-common-form-group input[readonly] {pointer-events: none;}
/* .cl-common-form-wrap.point-holder .cl-common-form-group input {margin-top: -3px;} */
.cl-common-form-group .cl-common-control-label {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-bottom: 0;
    pointer-events: none;
    padding-left: 0px;
    z-index: 1;
    color: transparent;
    font-size: 14px;
    font-weight: normal;
    letter-spacing: -0.42px;
    -webkit-transition: all 0.28s ease-in-out;
    -moz-transition: all 0.28s ease-in-out;
    -ms-transition: all 0.28s ease-in-out;
    -o-transition: all 0.28s ease-in-out;
    transition: all 0.28s ease-in-out;
    line-height: initial;
}
.cl-common-form-group.input-label-hide textarea + .cl-common-control-label {
    top: 13px;
    transform: translateY(0);
}
.cl-common-form-group textarea + .cl-common-control-label {
    top: 15%;
}
.cl-common-form-group .cl-common-control-label.error { color: #ee445f!important; background-color: #fff; }
.cl-common-form-group input {height: 18px;}
.cl-common-form-group input,
.cl-common-form-group textarea {
    display: block;
    background: none;
    padding: 1px;
    font-size: 14px;
    border-width: 0;
    border-color: transparent;
    border: none;
    line-height: 1.3;
    font-weight: 300;
    width: 100%;
    color: #676767;
    -webkit-transition: all 0.28s ease;
    -moz-transition: all 0.28s ease;
    -ms-transition: all 0.28s ease;
    -o-transition: all 0.28s ease;
    transition: all 0.28s ease;
    box-shadow: none;
}
.cl-common-form-wrap.point-holder.readOnly .cl-common-form-group,
.cl-common-form-wrap.point-holder .cl-common-form-group input:-moz-read-only,
.cl-common-form-wrap.nonplace-holder.readOnly .cl-common-form-group,
.cl-common-form-wrap.nonplace-holder .cl-common-form-group input:-moz-read-only {background-color: #f3f4f5;} 

.cl-common-form-wrap.point-holder.readOnly .cl-common-form-group,
.cl-common-form-wrap.point-holder .cl-common-form-group input:read-only,
.cl-common-form-wrap.nonplace-holder.readOnly .cl-common-form-group,
.cl-common-form-wrap.nonplace-holder .cl-common-form-group input:read-only {background-color: #f3f4f5; color: #696c71;}  

.cl-common-form-wrap.nonplace-holder .cl-common-form-group input:-moz-placeholder,
.cl-common-form-wrap.nonplace-holder .cl-common-form-group textarea:empty,
.cl-common-form-wrap.nonplace-holder .cl-common-form-group input:disabled {
    color:#676767;
}

.cl-common-form-group input:empty,
.cl-common-form-group textarea:empty {
    color: transparent;
}
.cl-common-form-group input:empty ~ .cl-common-control-label,
.cl-common-form-group textarea:empty ~ .cl-common-control-label {
    color: #b1b3b7;
}
.cl-common-form-group input[type="file"] { line-height: 1; }
.cl-common-form-group select, 
.cl-common-form-group input:focus, 
.cl-common-form-group input:valid, 
.cl-common-form-group input.form-file, 
.cl-common-form-group input.has-value, 
.cl-common-form-group textarea:focus, 
.cl-common-form-group textarea:valid, 
.cl-common-form-group textarea.form-file, 
.cl-common-form-group textarea.has-value { color: #696c71; }
.cl-common-form-group select ~ .cl-common-control-label, 
.cl-common-form-group input:focus ~ .cl-common-control-label,
.cl-common-form-group input:valid ~ .cl-common-control-label,
.cl-common-form-group input.form-file ~ .cl-common-control-label, 
.cl-common-form-group input.has-value ~ .cl-common-control-label, 
.cl-common-form-group textarea:focus ~ .cl-common-control-label, 
.cl-common-form-group textarea:valid ~ .cl-common-control-label, 
.cl-common-form-group textarea.form-file ~ .cl-common-control-label, 
.cl-common-form-group textarea.has-value ~ .cl-common-control-label {
    font-size: 12px;
    letter-spacing: -0.36px;
    color: #b1b3b7;
    top: 11px;
    left: 20px;
    -webkit-transition: all 0.28s ease-in-out;
    -moz-transition: all 0.28s ease-in-out;
    -ms-transition: all 0.28s ease-in-out;
    -o-transition: all 0.28s ease-in-out;
    transition: all 0.28s ease-in-out;
 }
.cl-common-form-group select:focus,
.cl-common-form-group input:focus,
.cl-common-form-group textarea:focus { outline:none; }
.cl-common-form-group select:focus ~ .cl-common-control-label,
.cl-common-form-group input:focus ~ .cl-common-control-label,
.cl-common-form-group textarea:focus ~ .cl-common-control-label { color: #4789e7; }

.cl-common-form-group.input-label-hide { padding: 0 0 0 20px; }
.cl-common-form-group.input-label-hide textarea { 
    height: 104px; 
    padding: 15px 11px 0 0;
    -ms-scrollbar-width: 8px;
    -ms-scrollbar-face-color: #d1d3d5;
    -ms-scrollbar-track-color: #f3f4f5;
    -ms-scrollbar-highlight-color: #d1d3d5;
    -ms-scrollbar-shadow-color: #d1d3d5;
    scrollbar-width: 8px;
    scrollbar-face-color: #d1d3d5;
    scrollbar-track-color: #f3f4f5;
    scrollbar-highlight-color: #d1d3d5;
    scrollbar-shadow-color: #d1d3d5;
}
.cl-common-form-wrap.error .cl-s-form-group.input-label-hide textarea { padding-top: 22px; }
.cl-common-form-group.input-label-hide textarea::-webkit-scrollbar { width: 8px; }
.cl-common-form-group.input-label-hide textarea::-webkit-scrollbar-track-piece { background-color: #f3f4f5; }
.cl-common-form-group.input-label-hide textarea::-webkit-scrollbar-thumb { 
    cursor: pointer; 
    border-radius: 8px; 
    background-color: #d1d3d5; 
}
.cl-common-form-group.input-label-hide textarea::-webkit-scrollbar-button:start { display: none; }
.cl-common-form-group.input-label-hide textarea::-webkit-scrollbar-button:end { display: none; }
.cl-common-form-group.input-label-hide textarea:valid ~ .cl-s-control-label,
.cl-common-form-group.input-label-hide textarea:focus ~ .cl-s-control-label { color: transparent; }



.cl-common-form-wrap.error .cl-common-form-group select ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error), 
.cl-common-form-wrap.error .cl-common-form-group input:focus ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error),
.cl-common-form-wrap.error .cl-common-form-group input:valid ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error), 
.cl-common-form-wrap.error .cl-common-form-group input.form-file ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error), 
.cl-common-form-wrap.error .cl-common-form-group input.has-value ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error), 
.cl-common-form-wrap.error .cl-common-form-group textarea:focus ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error), 
.cl-common-form-wrap.error .cl-common-form-group textarea:valid ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error), 
.cl-common-form-wrap.error .cl-common-form-group textarea:invalid ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error), 
.cl-common-form-wrap.error .cl-common-form-group textarea.form-file ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error), 
.cl-common-form-wrap.error .cl-common-form-group textarea.has-value ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error),
.cl-common-form-wrap.error .cl-common-form-group select:focus ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error),
.cl-common-form-wrap.error .cl-common-form-group input:focus ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error),
.cl-common-form-wrap.error .cl-common-form-group textarea:focus ~ .cl-common-control-label.error ~ .cl-common-control-label:not(.error) { color: transparent; }

.cl-common-form-group select {
  width: 100%;
  font-size: 14px;
  height: 34px;
  padding: 0.125rem 0.125rem 0.0625rem;
  background: none;
  border: none;
  line-height: 1.6;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

.cl-common-form-group.input-label-hide textarea:valid ~ .cl-common-control-label,
.cl-common-form-group.input-label-hide textarea:focus ~ .cl-common-control-label,
.cl-common-form-group.input-label-hide input:valid ~ .cl-common-control-label,
.cl-common-form-group.input-label-hide input:focus ~ .cl-common-control-label {color:transparent;}
.cl-common-form-group.input-label-hide.cl-exf-form-group {padding: 6px 20px 6px 20px; height: 48px;}
.cl-common-form-group.input-label-hide.cl-exf-form-group input {height: 35px;} 


.email-add-box {
  width: 100%;
  height: auto;
  padding: 0 10px;
  background-color: #f3f4f5;
}

.email-add-box textarea#email-add-input {
  border: none;
  resize: none;
  height: 30px;
  font-size: 13px;
  width: 100%;
  background-color: transparent;
  overflow: hidden;
  margin: 5px 0px;
}

.email-add-box .email-box {
  padding: 0px 5px;
  border: 1px solid #6ea2ed;
  border-radius: 3px;
  background-color: #e6eef9;
  color: #6ea2ed;
  float: left;
  margin: 5px 0px;
  margin-right: 5px;
  height: 30px;
  line-height: 30px;
  position: relative;
}
.email-add-box .email-box.none {
  border: 1px solid #f17a8d;
  background-color: #fae6ea;
  color: #f17a8d;
}
.email-add-box .email-box span {
  display: inline-block;
  position: relative;
  margin-left: 10px;
  cursor: pointer;
}
.email-add-box .email-box span svg {
  fill: #4789e7;
  width: 8px;
  height: 8px;
  position: relative;
  top: -2px;
}
.email-add-box .email-box.none span svg {
  fill: #ee445f;
  width: 8px;
  height: 8px;
  position: relative;
  top: -2px;
} 
@media only screen and (max-width:818px) and (min-width: 768px) {
    .setting-sub-title {
        width: calc(100% - 518px);
        margin-right: 78px;
    }
}