@charset "utf-8";
@import url('http://fonts.googleapis.com/earlyaccess/notosanskr.css');
@import url('http://fonts.googleapis.com/earlyaccess/hanna.css');
@import url('https://cdn.rawgit.com/innks/NanumSquareRound/master/nanumsquareround.min.css');
.nanumSquare{font-family: 'NanumSquareRound', sans-serif;}

/*──────────────── Reset ────────────────*/
html {margin:0; padding:0;}
body {margin:0;padding:0;font-size:12px; font-family: 'NanumSquareRound', 'Nanum Gothic', sans-serif;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img, input, button {margin:0;padding:0;border:0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
button {cursor:pointer;outline:0;}
textarea, select {font-size:1em}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
hr {width:100%; height:1px; background-color:rgba(0,0,0,0.12); border:none;}
pre{margin:0;padding:0;font-size:13px;font-family:inherit; display:inline-block; overflow:auto;}
pre.code, .txtBox{
	font-family:inherit;
	display:inline-block;
	overflow:auto;
	border:1px dashed rgba(0,0,0,0.2);
	font-size:12px;
	font-weight:normal;
	margin:5px 0;
	padding:20px 35px 20px 30px;
	color:#3f3f3f;
	background:rgba(0,0,0,0.01);
	margin-right:10px;
	max-width:100%;
	line-height:1.5em;
	vertical-align:top;
	}
pre .tit{font-weight:bold; font-size:12px;}
table {border-collapse: collapse; border-spacing:0;}
ol,ul,li {list-style:none; margin:0; padding:0}
.inline-block{display:inline-block !important; vertical-align:middle;}
img{max-width:100%;}
.fontAnti{ -webkit-font-smoothing:none !important; -webkit-transform:none !important; transform:none !important;}
.fontAnti *{ -webkit-font-smoothing:none !important; -webkit-transform:none !important; transform:none !important;}
.gray-bg{background:rgba(53,57,69,0.02);}

[class^="holdImg"] img{height:auto;}

*{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
*:before{ vertical-align:middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box }

/* Window Drag */
::-moz-selection{background:rgba(255,244,182,0.9); color:rgba(0,0,0,0.9);}
::selection{background:rgba(255,244,182,0.9); color:rgba(0,0,0,0.9);}

a{color:#404040; text-decoration:none; outline:0; }
a:link, a:visited {text-decoration:none}
a:hover, a:focus, a:active {text-decoration:none;}
a[href^="tel:"]:link {color: #7a7a7a;}

a.skip{display:block;z-index:10;position:absolute;top:0;right:0;width:80px;height:24px;border:1px solid #2aa8cb;border-width:0 0 1px;background-color:#9fdaea;font-weight:bold;color:#000;line-height:24px;text-align:center;text-decoration:none}
a.skip{opacity:0;filter: alpha(opacity=0);right: auto;background-color: #e4ebef;width: 110px;}
a.skip:focus{opacity:1;filter: alpha(opacity=100);}

a.underline{}
a.underline:hover{text-decoration:underline;}
a.no-underline, a.no-underline:hover{text-decoration:none !important;}


/* Etc. */
b, .bold{font-weight: bold;}
.normal{font-weight:normal;}
.landmark{position: absolute;left: -5000px;top: -5000px; display:none;}
.no_borderb{border-bottom:none !important;}
.clear{clear:both; display:block;}
.none {display:none !important;}
.hidden{visibility:hidden !important;}
.noborder{border:none !important;}
.bored{border:1px solid red;}


/*──────────────── Font ────────────────*/
h1, h2, h3, h4, h5, h6{ font-family: 'NanumSquareRound', 'Nanum Gothic', sans-serif; line-height:1.5em; font-weight:300;}
h1{font-size:50px; font-weight:100;}
h2{font-size:20px;}
h3{font-size:17px; font-weight:400;}
h4{font-size:15px;}
h5{font-size:14px;}
h5{font-size:13px;}
h6{font-size:12px;}

.fs9{font-size:9px;} .fs10{font-size:10px;} .fs11{font-size:11px;} .fs12{font-size:12px;} .fs13{font-size:13px;} .fs14{font-size:14px;} .fs15{font-size:15px;}
.fs16{font-size:16px;} .fs17{font-size:17px;} .fs18{font-size:18px;} .fs19{font-size:19px;} .fs20{font-size:20px;}

[class^="noto"], [class*="noto"]{font-family: 'Noto Sans KR', sans-serif !important;}
.noto100{font-weight:100;} .noto200{font-weight:200;} .noto300{font-weight:300;} .noto400{font-weight:400;} .noto500{font-weight:500;} .noto600{font-weight:600;} .noto700{font-weight:700;}

[class^="nanumsq"], [class*="naq"]{font-family: 'NanumSquareRound', sans-serif;}
.naq300{font-weight:300;} .naq400{font-weight:400;} .naq700{font-weight:700;} .naq800{font-weight:800;}

[class^="nanum"]{font-family: 'Nanum Gothic', sans-serif;}
.nanum{font-weight:normal;} .nanumB{font-weight:bold;}

.mont{font-family:'Montserrat', sans-serif; font-weight:400;}

.help-block{color:#8da2a8; line-height:1.3em;}
.help-block a{color:#8da2a8; text-decoration:underline !important;}
.help-block a:hover{color:#6d8288; }
p.help-block{margin-top:7px; margin-bottom:-4px; }
span.help-block{margin-left:8px;}

.clearfix:after{ content: ""; display: block; clear: both; visibility: hidden; font-size: 0; height: 0; }
.clearfix{ *display: inline-block; _height: 1%;}

/*──────────────── Text ────────────────*/
.ellipsis{ overflow : hidden; white-space: nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; -ms-text-overflow:ellipsis; -moz-text-overflow:ellipsis; }

/* 정렬 */
.tcenter{text-align: center !important;} .tleft{text-align:left !important;} .tright{text-align: right !important;} .fcenter{margin:0 auto;} .fleft{float:left !important;} .fright{float:right !important;}
.divCenter{width:100%; height:100%; display:flex; align-items:center; position:absolute; top:0; left:0;}

/* flexd */
.fixed{position:fixed !important;}
.block{display:block !important;}
.absolute{display:absolute !important; top:0; right:0;}
.absolute.fright{float:none; top:0; right:0;}
.flexCenter{display: flex;align-items: center;}

.clear{clear:both;}
.none {display:none !important;}
.fleft{float:left;}
.fright{float:right;}
.fcenter{margin:0 auto;}
.tcenter{text-align:center; margin-left:auto; margin-right:auto;}
.center{text-align:center; margin-left:auto; margin-right:auto;}
.tleft{text-align:left;}
.tright{text-align:right;}
.justify{text-align:justify;}/*페이지 폭에 꽉차게 */
.table-cell{display:table-cell; vertical-align:middle;}
.hidden{visibility:hidden !important;}
.intaeFont:before{font-family:'intaeFont' !important; font-weight:normal;}
.hlelp-block{display:block; line-height:1.4em; margin-top:5px;}
.vertical-top{vertical-align:top;}

/* color */
.color-red{color:#ff4d4d;}
.color-green{color:#1bc8a6;}
.color-yellow{color:#fff5bd;}


/*──────────────── Margin ────────────────*/
.mt5{margin-top:5px !important;} .mt10{margin-top:10px !important;} .mt15{margin-top:15px !important;} .mt20{margin-top:20px !important;} .mt25{margin-top:25px !important;} .mt30{margin-top:30px !important;}
.mt35{margin-top:35px !important;} .mt40{margin-top:40px !important;} .mt45{margin-top:45px !important;} .mt50{margin-top:50px !important;} .mt55{margin-top:55px !important;} .mt60{margin-top:60px !important;}
.mt65{margin-top:65px !important;} .mt70{margin-top:70px !important;} .mt75{margin-top:75px !important;} .mt80{margin-top:80px !important;}
.mt85{margin-top:85px !important;} .mt90{margin-top:90px !important;} .mt95{margin-top:95px !important;} .mt100{margin-top:100px !important;}
.mr5{margin-right:5px !important;} .mr10{margin-right:10px !important;} .mr15{margin-right:15px !important;} .mr20{margin-right:20px !important;} .mr25{margin-right:25px !important;} .mr30{margin-right:30px !important;}
.mr35{margin-right:35px !important;} .mr40{margin-right:40px !important;} .mr45{margin-right:45px !important;} .mr50{margin-right:50px !important;} .mr55{margin-right:55px !important;} .mr60{margin-right:60px !important;}
.mr65{margin-right:65px !important;} .mr70{margin-right:70px !important;} .mr75{margin-right:75px !important;} .mr80{margin-right:80px !important;} .mr85{margin-right:85px !important;}
.mr90{margin-right:90px !important;} .mr95{margin-right:95px !important;} .mr100{margin-right:100px !important;}
.ml5{margin-left:5px !important;} .ml10{margin-left:10px !important;} .ml15{margin-left:15px !important;} .ml20{margin-left:20px !important;} .ml25{margin-left:25px !important;} .ml30{margin-left:30px !important;}
.ml35{margin-left:35px !important;} .ml40{margin-left:40px !important;} .ml45{margin-left:45px !important;} .ml50{margin-left:50px !important;} .ml55{margin-left:55px !important;} .ml60{margin-left:60px !important;}
.ml65{margin-left:65px !important;} .ml70{margin-left:70px !important;} .ml75{margin-left:75px !important;} .ml80{margin-left:80px !important;} .ml85{margin-left:85px !important;}
.ml90{margin-left:90px !important;} .ml95{margin-left:95px !important;} .ml100{margin-left:100px !important;}
.mb5{margin-bottom:5px !important;} .mb10{margin-bottom:10px !important;} .mb15{margin-bottom:15px !important;} .mb20{margin-bottom:20px !important;} .mb25{margin-bottom:25px !important;} .mb30{margin-bottom:30px !important;}
.mb35{margin-bottom:35px !important;} .mb40{margin-bottom:40px !important;} .mb45{margin-bottom:45px !important;} .mb50{margin-bottom:50px !important;} .mb55{margin-bottom:55px !important;} .mb60{margin-bottom:60px !important;}
.mb65{margin-bottom:65px !important;} .mb70{margin-bottom:70px !important;} .mb75{margin-bottom:75px !important;} .mb80{margin-bottom:80px !important;} .mb85{margin-bottom:85px !important;}
.mb90{margin-bottom:90px !important;} .mb95{margin-bottom:95px !important;} .mb100{margin-bottom:100px !important;}

/*──────────────── Padding ────────────────*/
.padding5{padding:5px;}
.padding10{padding:10px;}
.padding15{padding:15px;}
.padding20{padding:20px;}
.padding25{padding:25px;}
.padding30{padding:30px;}
.padding35{padding:35px;}
.padding40{padding:40px;}
.padding45{padding:45px;}
.padding50{padding:50px;}
.padding55{padding:55px;}
.padding60{padding:60px;}

/*──────────────── rotate ────────────────*/
.rotate90 { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }
.rotate180 { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }
.rotate270 { -webkit-transform: rotate(270deg); -moz-transform: rotate(270deg); -o-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg); }

/*──────────────── horizon-group ────────────────*/
.horizon-group{position:relative; margin-bottom:10px;}
.horizon-group:last-child{margin-bottom:0;}
.horizon-group > *{vertical-align:top;}
.horizon-group .horizon-label{cursor:default; display:inline-block; line-height:1.6em; }
.horizon-group .horizon-con{display:inline-block; line-height:1.6em; padding-left:1.6em;}



/*____________________________ input & btn Size ____________________________*/
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"], input[type="url"], .btn, input[type="submit"].btn{height:32px; font-size:13px;}
.btn, input[type="submit"].btn {line-height:32px; padding:0 15px; font-weight: 700;}
input[type="text"].mini, input[type="password"].mini, input[type="email"].mini, input[type="tel"].mini, input[type="number"].mini, input[type="url"].mini, .btn.mini, input[type="submit"].btn.mini{height:25px; font-size:11px;}
.btn.mini, input[type="submit"].btn.mini {line-height:26px; padding:0 5px;}
input[type="text"].small, input[type="password"].small, input[type="email"].small, input[type="tel"].small, input[type="number"].small, input[type="url"].small, .btn.small, input[type="submit"].btn.small{height:28px; font-size:12px; padding:0px 8px;}
.btn.small, input[type="submit"].btn.small {line-height:28px; padding:0 10px;}
input[type="text"].large, input[type="password"].large, input[type="email"].large, input[type="tel"].large, input[type="number"].large, input[type="url"].large, .btn.large, input[type="submit"].btn.large{height:42px; font-size:13px; font-weight:700;}
.btn.large, input[type="submit"].btn.large {line-height:42px; padding:0 19px;}
.btn.short, input[type="submit"].btn.short {font-size:11px; padding:0 8px;}
/* select size */
.bootstrap-select .dropdown-toggle{height:32px;line-height:32px;padding-left:12px;font-size:13px;}
@media screen and (-webkit-min-device-pixel-ratio:0){.bootstrap-select .dropdown-toggle{line-height:33px;}} /* 크롬핵 */
.bootstrap-select.mini .dropdown-toggle{height:25px;line-height:25px;padding-left:12px;font-size:11px;}
@media screen and (-webkit-min-device-pixel-ratio:0){.bootstrap-select.mini .dropdown-toggle{line-height:25px;}} /* 크롬핵 */
.bootstrap-select.small .dropdown-toggle{height:28px;line-height:28px;padding-left:12px;font-size:12px;}
@media screen and (-webkit-min-device-pixel-ratio:0){.bootstrap-select.small .dropdown-toggle{line-height:28px;}} /* 크롬핵 */
.bootstrap-select.large .dropdown-toggle{height:42px;line-height:42px;padding-left:12px;font-size:13px;}
@media screen and (-webkit-min-device-pixel-ratio:0){.bootstrap-select.large .dropdown-toggle{line-height:43px;}} /* 크롬핵 */




/*____________________________ FORM ____________________________*/
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"], input[type="url"], .btn, textarea{font-family: 'NanumSquareRound', 'Nanum Gothic', sans-serif; border-radius:2px;}

input{vertical-align:middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;box-sizing: border-box;}
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"], input[type="url"], textarea {
	font-size:12px;
	font-weight:normal;
	padding:0 10px;
	color:#2d2d2d;
	background:#fff;
	border:1px solid rgba(0,0,0,0.2);
	position:relative;
	z-index:3;
	outline: none;
	}
textarea{width:100%; line-height:16px; padding:15px; display: block; overflow-y:auto !important; }
textarea.txtBox{background:#fff;}
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="number"]:focus, input[type="url"]:focus, textarea:focus{border-color:rgba(0,0,0,0.65); box-shadow:0 4px 4px rgba(0,0,0,0.05);}
input[type="url"] {color:#20366d;}

input:-moz-placeholder, textarea:-moz-placeholder {color:#999; font-weight:normal;}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {color:#999; font-weight:normal;}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color:#999; font-weight:normal;}
input::-moz-focus-inner,
button::-moz-focus-inner{border: 0;padding: 0;}

.inputLabel{display:inline-block; height:30px; line-height:30px; padding:0 9px; font-size:12px; font-weight:bold; color:rgba(53,57,69,0.8); text-align:center; border:1px solid rgba(0,0,0,0.2); border-radius:2px; vertical-align:middle; position:relative; z-index:2; }
.inputLabel.gray{background:rgba(53,57,69,0.02);}
.inputLabel.yellow{color:#614531 !important; background:#fff8a5;}
.inputLabel.blue{border:0; color:#e5f8ff !important; background:#2a8eff;}
.inputLabel.green{border:0; color:#fff !important; background:#1abc9c;}
.inputLabel.black{border:0; color:#fff !important; background:#202020;}

.inputLabel.jscolor{width:30px !important; position:relative; background:url('img/colorBtn.jpg')no-repeat; background-size:cover; }






/*──────────────── btn ────────────────*/
.btn, input[type="submit"].btn{ display:inline-block; vertical-align:middle;color:#fff; text-align:center; background:rgba(53,57,69,0.8); border-radius:2px; transition: all .2s ease-in-out; cursor:pointer; }
.btn:hover, input[type="submit"].btn:hover{background:rgba(53,57,69,0.9); text-decoration:none !important;}

.btn.green, input[type="submit"].btn.green{background-color:#1bc8a6; color:#fff;}
.btn.green:hover, input[type="submit"].btn.green:hover{background-color:#13a98b;}


.html-tip{display:inline-block;vertical-align:middle;color:#fff;text-align:center;font-size:0;width:24px;height:24px;line-height:25px;text-align:center;background:rgba(53,57,69,0.8);border-radius:1px;transition: all .2s ease-in-out;cursor:pointer;}
.html-tip:after{
	content: "\e11e";
	font-family: 'intaeFont'; 
	font-size:16px;
	font-weight:normal;
	color:#b5e9ff;
	}


/*
.btn.blue, input[type="submit"].btn.blue{background-color:#377eff; color:#fff;}
.btn.blue:hover, input[type="submit"].btn.blue:hover{background-color:#1f68ed;}
.btn.vivid-blue, input[type="submit"].btn.vivid-blue{background-color:#4aa2d1; color:#fff;}
.btn.vivid-blue:hover, input[type="submit"].btn.vivid-blue:hover{background-color:#3c91be;}

.btn.yellow, input[type="submit"].btn.yellow{background-color:#faa732; color:#fff;}
.btn.yellow:hover, input[type="submit"].btn.yellow:hover{background-color:#ef8616;}
.btn.red, input[type="submit"].btn.red{background-color:#da4f49; color:#fff;}
.btn.red:hover, input[type="submit"].btn.red:hover{background-color:#d7261e;}
.btn.black, input[type="submit"].btn.black{background-color:#363636; color:#fff;}
.btn.black:hover, input[type="submit"].btn.black:hover{background-color:#181818;}
.btn.darkgray, input[type="submit"].btn.darkgray{background-color:#525252; color:#fff;}
.btn.darkgray:hover, input[type="submit"].btn.darkgray:hover{background-color:#434343;}
.btn.pink, input[type="submit"].btn.pink{background-color:#f0516a; color:#fff;}
.btn.pink:hover, input[type="submit"].btn.pink:hover{background-color:#e94862;}
.btn.vivid-orange, input[type="submit"].btn.vivid-orange{background-color:#db582f; color:#fff;}
.btn.vivid-orange:hover, input[type="submit"].btn.vivid-orange:hover{background-color:#d35129;}
.btn.popup, input[type="submit"].btn.popup{background-color:#ff6600; color:#fff;}
.btn.popup:hover, input[type="submit"].btn.popup:hover{background-color:#ff5533;}

.btn.inverse, input[type="submit"].inverse{
	background-color:rgba(255,255,255,0);
	color:rgba(0,0,0,0.8);
	border:1px solid rgba(255,255,255,0.3);
	}
.btn.blue.inverse, input[type="submit"].btn.blue.inverse{border-color:#27b9f1; color:#27b9f1 !important;}
.btn.vivid-blue.inverse, input[type="submit"].btn.vivid-blue.inverse{border-color:#49afcd; color:#49afcd !important;}
.btn.green.inverse, input[type="submit"].btn.green.inverse{border-color:#5bb75b; color:#5bb75b !important;}
.btn.yellow.inverse, input[type="submit"].btn.yellow.inverse{border-color:#faa732; color:#faa732 !important;}
.btn.red.inverse, input[type="submit"].btn.red.inverse{border-color:#da4f49; color:#da4f49 !important;}
.btn.black.inverse, input[type="submit"].btn.black.inverse{border-color:#363636; color:#363636 !important;}
.btn.darkgray.inverse, input[type="submit"].btn.darkgray.inverse{border-color:#6d6d6d; color:#525252 !important;}
.btn.inverse:hover, input[type="submit"].btn.inverse:hover{background:rgba(255,255,255,0.85); color:rgba(0,0,0,1); border:1px solid rgba(255,255,255,0.85 );}

.btn:first-child{margin-left:0;}
.btn:last-child{margin-right:0;}


.btn.reverse, input[type="submit"].btn.reverse{background-color:transparent; color:#fff; border-color:#fff; border-width:2px;}
*/





/*──────────────── Icon ────────────────*/
[class*="icon_"]:before{content: ""; font-family: 'intaeFont'; font-size:13px; font-weight:normal !important; font-style: normal !important; vertical-align:middle; display:inline-block !important;}

[class*="fileIcon_"]{font-size:15px; margin-top:1px; margin-right:5px; display:inline-block; }
[class*="fileIcon_"]:before{font-family: 'intaeFont'; content:'\e0e8'; color:#676767;  font-weight:normal !important; margin-top:-2px; vertical-align:middle; display:inline-block;}
span[class*="fileIcon_"].file + span[class*="fileIcon_"].file{display:none;}
.fileIcon_jpg:before, .fileIcon_png:before, .fileIcon_gif:before{content:'\e0f7'; font-size:16px; margin-top:1px;}
span.icon_new{
	position:relative;
	font-family:Arial, sans-serif;
	font-size:10px;
	padding:0 4px;
	height:15px;
	line-height:15px;
	border-radius:3px;
	text-align:center;
	color:#fff;
	background:#ff6464;
	display:inline-block;
	vertical-align:middle;
	margin-top:-1px;
	margin-left:12px !important;
	}
.icon_new:before{content: "\e043"; font-family: 'intaeFont'; font-size:12px; color:#ff6464; position:absolute; top:50%; left:-7px;  margin-top:-6px; display:inline-block; vertical-align:middle; line-height:12px;}






/*──────────────── Tag ────────────────*/
.tag, .data-tag{vertical-align:middle; display:inline-block; padding:0 8px; height:24px; line-height:24px; font-size:11px; font-weight: 400; color:#fff; text-align:center; border-radius:2px; background:rgba(71,78,103,0.85);}
.tag.bold, .tag .bold{font-weight:600;}
.tag.light, .tag .light{color:#fff5bd;}
.tag.skinOption.mob{
	font-size:11px;
	padding:0 5px;
	margin:2px 0;
	height:20px;
	line-height:17px;
	font-weight: 300;
	color:#354c0c;
	background:#3091ff;
	border-color:rgba(101,149,26,0.4);
	border-radius:1px;
	-webkit-transition: all .05s ease-in-out;
	transition: all .05s ease-in-out;
	cursor:pointer;
	}
.tag.skinOption.mob:hover{background:#c5ee73;}
.tag.skinOption.mob:focus, .tag.skinOption.mob:active{background:#fff5bd; border-color:#eee4aa; color:#151411 !important;}

.tagOn:after, .tagOff:after{content:'';display:inline-block;vertical-align:middle;margin-top:-1px;margin-left:8px; font-size:10px;font-weight:400;color:#fff;padding:0 5px;height:16px;line-height:17px;text-align:center;border-radius:9px;}
.tagOn:after{ content:'ON'; background:#1bc8a6;}
.tagOff:after{ content:'OFF'; background:rgba(71,78,103,0.3);}
.tagOff{color:#7a7a7a;}

.yellowTag{ display:inline-block; height:22px; line-height:20px; font-size:11px; font-weight:400; color:#8f5e2c; background:url('img/sprite_yellowTag.png') repeat-x; background-position: 0 -44px; position:relative; top:-20px; left:0; }
.yellowTag:before{ content:''; background:url('img/sprite_yellowTag.png') no-repeat; background-position: 0 -22px; width:10px; height:22px; display:inline-block; position:absolute; top:0; left:-10px; }
.yellowTag:after{ content:''; background:url('img/sprite_yellowTag.png') no-repeat; background-position: right -22px; width:20px; height:22px; line-height:22px; display:inline-block; position:absolute; top:0; right:-20px; }

.tagNum{
	vertical-align:middle;
	display:inline-block;
	width:17px;
	height:17px;
	line-height:16px;
	font-size:10px;
	font-weight: 500;
	color:#fff;
	text-align:center;
	background:rgba(0,0,0,0.65);
	border-radius:3px;
	margin-top:-1px;
	margin-left:3px;
	}





/*──────────────── myTip ────────────────*/
.myTip{position:relative; cursor:pointer; vertical-align:middle; font-size:0;}
.myTip:before{
	content:""attr(data-tip)"";
	font-size:12px;
	line-height:1.5em;
	color:#fff;
	display:inline-block;
	width:auto;
	padding:3px 1em;
	position:absolute;
	top:50%;
	right:100%;
	margin-top:-11px;
	margin-right:6px;
	background:rgba(0,0,0,0.65);
	border-radius:4px;
	white-space: pre;
	transition: all .2s ease-in-out;
	opacity:0;
	visibility: hidden;
	z-index:39;
	}
.myTip:after{
	content:'';
	width:0;
	height:0;
	font-size:12px;
	border-left: 4px solid rgba(0,0,0,0.65);
	border-right: 4px solid transparent;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	position:absolute;
	top:50%;
	right:100%;
	margin-top:-4px;
	transition: all .2s ease-in-out;
	opacity:0;
	visibility: hidden;
	z-index:39;
	}
.myTip:hover:before, .myTip:hover:after{opacity:1; visibility: visible;}

.myTip.mini:before{font-size:10px;}
.myTip.mini:after{border-width:3px;}

.myTip.top:before{top:-28px; left:-1em; right:auto; margin:0; }
.myTip.top:after{
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 4px solid rgba(0,0,0,0.65);
	border-bottom: 4px solid transparent;
	position:absolute;
	top:-3px;
	left:50%;
	right:auto;
	margin-left:-6px;
	}
.myTip.top.mini:before{top:-28px;}

.myTip.right:before{ right:auto; left:100%; margin-left:8px; }
.myTip.right:after{ border-left: 4px solid transparent; border-right: 4px solid rgba(0,0,0,0.55); border-top: 4px solid transparent; border-bottom: 4px solid transparent; right:auto; left:100%; margin-left:-2px; }
.myTip.mini.right:before{ margin-left:6px; }
.myTip.mini.right:after{ border-width: 4px; margin-right:3px; }

.myTip.includeOn:before{color:#212121; background:rgba(255,231,71,0.9); font-weight:bold;}
.myTip.includeOn:after{border-left-color:rgba(255,231,71,0.9);}
.myTip.includeOn.top:after{border-color:transparent; border-top-color:rgba(255,231,71,0.9);}
.myTip.includeOn.right:after{border-color:transparent; border-right-color:rgba(255,231,71,0.9);}



















/*──────────────── span : Width ────────────────*/

[class*="span"], [class^="span"]{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display:inline-block; position:relative; vertical-align:middle; }
.span9{width:600px;}
.span8{width:530px;}
.span7{width:310px;}
.span6{width:250px;}
.span5{width:190px;}
.span4{width:130px;}
.span3{width:90px;}
.span2{width:53px;}
.span1{width:43px;}
.span{width:100%;}

.bootstrap-select.span9{min-width:430px;}
.bootstrap-select.span8{min-width:370px;}
.bootstrap-select.span7{min-width:310px;}
.bootstrap-select.span6{min-width:250px;}
.bootstrap-select.span5{min-width:190px;}
.bootstrap-select.span4{min-width:130px;}
.bootstrap-select.span3{min-width:90px;}
.bootstrap-select.span2{min-width:53px;}
.bootstrap-select.span1{min-width:43px;}
.bootstrap-select.span{width:100%; overflow:visible;}

.spanGroup{width:100%; position:relative; overflow:hidden;}
.span2n{width:calc(50% - 5px); margin-right:10px; float:left;}
.span2n:nth-child(2n+2){margin-right:0;}
.span3n{width:calc(33.33% - 6px); margin-right:9px; float:left;}
.span3n:nth-child(3n+3){margin-right:0;}
.span4n{width:calc(25% - 7px); margin-right:9px; float:left;}
.span4n:nth-child(4n+4){margin-left:1px; margin-right:0;}

.span90{width:calc(90% - 4px); margin-right:8px; float:left;}
.span80{width:calc(80% - 4px); margin-right:8px; float:left;}
.span70{width:calc(70% - 4px); margin-right:8px; float:left;}
.span60{width:calc(60% - 4px); margin-right:8px; float:left;}
.span50{width:calc(50% - 4px); margin-right:8px; float:left;}
.span40{width:calc(40% - 4px); margin-right:8px; float:left;}
.span30{width:calc(30% - 4px); margin-right:8px; float:left;}
.span20{width:calc(20% - 4px); margin-right:8px; float:left;}
.span10{width:calc(10% - 4px); margin-right:8px; float:left;}
[class*="span"]:last-child{margin-right:0;}
.spanPrice{width:160px; margin-right:10px; float:left;}
.spanPrice + .span{width:calc(100% - 170px); float:left;}










input[type="file"]{
	vertical-align:middle;
	*overflow:visible;
	height:30px;
	font-size:12px;
	width:350px;
	color:#3d3d3d;
	display: block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}


/*파일 만들기 버튼*/
.fileMake{cursor:pointer;}
.fileMake:before{
	content:"파일 만들기";
	font-family:'Nanum Gothic', sans-serif;
	font-size:10px;
	width:auto;
	padding:0 7px;
	height:20px;
	line-height:20px;
	color:#fff;
	display:inline-block;
	position:absolute;
	top:-21px;
	left:1.6em;
	margin:0;
	margin-right:8px;
	background:#567eff;
	border-radius:4px;
	white-space: nowrap;
	transition: all .2s ease-in-out;
	opacity:0;
	visibility: hidden;
	z-index:39;
	}

.fileMake:after{
	content:'';
	width:0;
	height:0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #567eff;
	border-bottom: 5px solid transparent;
	position:absolute;
	top:-2px;
	left:40%;
	margin-left:-6px;
	transition: all .2s ease-in-out;
	opacity:0;
	visibility: hidden;
	z-index:39;	
	}
.fileMake:hover:before,
.fileMake:hover:after{opacity:1; visibility: visible;}









/*설명 요정*/
.fairy-wrap{position:relative; display:inline-block;}
.fairy{cursor:pointer;}
.fairy:before{
	content: "\f111";
	font-family: 'fontAwesome';
	font-size:14px;
	color:#ff5252;
	}
.help{
	z-index:9999 !important;
	position:relative;
	overflow:hidden;
	width:100%;
	padding:20px;
	margin-top:2px;
	line-height:1.6em;
	background:rgba(255,255,255,1);
	border:1px solid rgba(0,0,0,0.35);
	box-shadow: -2px 3px 3px rgba(0, 0, 0, 0.15);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}
.help.top{bottom:10px;}
.help.bottom{top:18px;}
.help.left{right:13px;}
.help.right{left:18px;}
.help h4{margin-bottom:5px;}
.help .info{display:block; margin-top:5px; font-size:11px; color:#666666;}
.help span{line-height:1.5em;}




.tbl_amin {width:100%; border-collapse:collapse; border-spacing:0; font-size:11px; font-weight:normal;}
.tbl_amin th {width:80px; padding:7px 10px;border:1px solid #e5e5e5; border-left:0; border-right:0;text-align:left; font-weight:normal;}
.tbl_amin td {padding:7px 10px;border-top:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;background:transparent}
.tbl_amin td input[type="text"]{
	height:26px;
	padding:0 6px;
	font-size:11px;
	color:#3d3d3d;
	border:1px solid #ced9de;
	background:#f6f9fa;
	}
.tbl01 th {width:80px; padding:7px 10px;border:1px solid #e5e5e5; border-left:0; border-right:0;text-align:left; font-weight:normal;}
.tbl01 td {line-height:14px;padding:7px 10px;border-top:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;background:transparent}
.tbl01 td .select2-container .select2-choice span{line-height:30px !important;}









/* 구조 설명 박스 */
.structureBox{position:relative;}
.structureBox .horizon{position:relative; font-size:0;}
.structureBox .horizon .text{display:block; margin:0; padding:0; color:#919191; position:absolute; top:-1px; left:100px; min-width:400px; height:100%; font-size:11px; line-height:1em; display:flex; align-items: center;}
.structureBox .horizon .active + .text{color:#287df1;}
.structureBox .horizon a{color:inherit;}
.structureBox .horizon .fileDelete{font-size:0; position:relative; top:-3px; left:2px;}
.structureBox .horizon .fileDelete:before{ content:'\e038'; font-family:'intaeFont'; font-size:14px; display:inline-block; color:rgba(0,0,0,0.3); cursor:pointer; transition: all .2s ease-in-out; }
.structureBox .horizon .fileDelete:hover:before{color:#ff5f5f;}
.structureBox [class^='box']{margin-right:8px; margin-bottom:6px; display:inline-block; height:8px; border-radius:4px;}
.structureBox .horizon:last-child [class^='box']{margin-bottom:0;}
.structureBox [class^='box']:last-child{margin-right:0;}
.structureBox .box{width:100%;}
.structureBox .box2n{width:calc(50% - 3px);}
.structureBox .box3n{width:calc(33.33% - 4px);}
.structureBox [class*='box']{background:rgba(0,0,0,0.17); font-size:10px; display:flex; align-items: center; justify-content: center; color:#fff;}
.structureBox [class*='box'].active{background:#6dabff;}
	.structureBox.height3 [class^='box']{height:3px;}
	.structureBox.height4 [class^='box']{height:4px;}
	.structureBox.height5 [class^='box']{height:5px;}
	.structureBox.height6 [class^='box']{height:6px;}
	.structureBox.height7 [class^='box']{height:7px;}
	.structureBox.height8 [class^='box']{height:8px;}
	.structureBox.height9 [class^='box']{height:9px;}
	.structureBox.height10 [class^='box']{height:10px;}
	.structureBox.height11 [class^='box']{height:11px;}
	.structureBox.height12 [class^='box']{height:12px;}
	.structureBox.height13 [class^='box']{height:13px;}
	.structureBox.height14 [class^='box']{height:14px;}
	.structureBox.height15 [class^='box']{height:15px;}
	.structureBox.height16 [class^='box']{height:16px;}
	.structureBox.height17 [class^='box']{height:17px;}
	.structureBox.height18 [class^='box']{height:18px;}
	.structureBox.height19 [class^='box']{height:19px;}
	.structureBox.height20 [class^='box']{height:20px;}
	.structureBox.height21 [class^='box']{height:21px;}
	.structureBox.height22 [class^='box']{height:22px;}
	.structureBox.height23 [class^='box']{height:23px;}
	.structureBox.height24 [class^='box']{height:24px;}
	.structureBox.height25 [class^='box']{height:25px;}
	.structureBox.height16 [class^='box']{height:26px;}
	.structureBox.height27 [class^='box']{height:27px;}
	.structureBox.height28 [class^='box']{height:28px;}
	.structureBox.height29 [class^='box']{height:29px;}
	.structureBox.height30 [class^='box']{height:30px;}
	.structureBox [class^='box'].height3{height:3px;}
	.structureBox [class^='box'].height4{height:4px;}
	.structureBox [class^='box'].height5{height:5px;}
	.structureBox [class^='box'].height6{height:6px;}
	.structureBox [class^='box'].height7{height:7px;}
	.structureBox [class^='box'].height8{height:8px;}
	.structureBox [class^='box'].height9{height:9px;}
	.structureBox [class^='box'].height10{height:10px;}
	.structureBox [class^='box'].height11{height:11px;}
	.structureBox [class^='box'].height12{height:12px;}
	.structureBox [class^='box'].height13{height:13px;}
	.structureBox [class^='box'].height14{height:14px;}
	.structureBox [class^='box'].height15{height:15px;}
	.structureBox [class^='box'].height16{height:16px;}
	.structureBox [class^='box'].height17{height:17px;}
	.structureBox [class^='box'].height18{height:18px;}
	.structureBox [class^='box'].height19{height:19px;}
	.structureBox [class^='box'].height20{height:20px;}
	.structureBox [class^='box'].height21{height:21px;}
	.structureBox [class^='box'].height22{height:22px;}
	.structureBox [class^='box'].height23{height:23px;}
	.structureBox [class^='box'].height24{height:24px;}
	.structureBox [class^='box'].height25{height:25px;}
	.structureBox [class^='box'].height16{height:26px;}
	.structureBox [class^='box'].height27{height:27px;}
	.structureBox [class^='box'].height28{height:28px;}
	.structureBox [class^='box'].height29{height:29px;}
	.structureBox [class^='box'].height30{height:30px;}





















/*──────────────── Uploader ────────────────*/
div.uploader input { opacity: 0; filter: alpha(opacity:0); position: absolute; top: 0; right: 0; bottom: 0; float: right; width:220px; height: 26px; border: none; cursor:pointer; }
div.uploader span.filename, div.uploader span.action, div.button, div.button span {-webkit-font-smoothing: antialiased;}
div.uploader{
	width: 340px;
	height: 26px;
	line-height:26px;
	padding:0;
	margin:5px 0;
	font-size:12px;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	cursor: default;
	}
div.uploader span.filename {
	width: calc(100% - 80px);
	height: inherit;
	font-size: 11px;
	color: #777;
	margin: 0px;
	padding:0 5px 0 10px;
	border: 1px solid #bbb;
	border: 1px solid rgba(0,0,0,0.25);
	border-right: 0;
	border-top-left-radius:4px;
	border-bottom-left-radius:4px;
	float: left;
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	cursor: default;
	position:relative;
	background:#fff;
	box-shadow:0 4px 4px rgba(0,0,0,0.03) inset;
	}
div.uploader span.action{
	width: 80px;
	height: inherit;
	padding:0;
	margin:0;
	text-align: center;
	font-weight: 600;
	float: left;
	display: inline-block;
	border:1px solid rgba(0,0,0,0.25);
	background:rgba(71,78,103,0.03);
	border-top-right-radius:4px;
	border-bottom-right-radius:4px;
	overflow: hidden;
	cursor: pointer;
	}
div.uploader.disabled span.action{border-color: #ddd;  color: #aaa; }
div.uploader.disabled span.filename {border-color: #ddd; color: #aaa; background:rgba(0,0,0,0.01); box-shadow:none;} 




/*.uploadSet */
.uploadSet{position:relative; overflow:hidden;}
.uploadSet .btnCamera, .uploadSet .btnFile, .uploadSet .btnMovie{
	float:left;
	padding:0 15px;
	width:130px;
	height:55px;
	line-height:55px;
	font-weight:bold;
	text-align:center;
	color:#1d81f1;
	border:1px solid #1d81f1;
	border-radius:1px;
	background:#fff;
	transition: all .25s ease-in-out;
	margin:0;
	}
.uploadSet .btnCamera:hover, .uploadSet .btnFile:hover, .uploadSet .btnMovie:hover{background:#1d81f1; color:#fff;}
.uploadSet .btnCamera:before{
	content:'\e094';
	font-family:'intaeFont';
	font-size:20px;
	vertical-align:middle;
	font-weight:normal;
	display:inline-block;
	margin-top:-1px;
	margin-right:4px;
	}
.uploadSet .btnFile:before{
	content:'\e0e8';
	font-family:'intaeFont';
	font-size:21px;
	vertical-align:middle;
	display:inline-block;
	margin-top:-1px;
	margin-right:4px;
	}
.uploadSet .btnMovie:before{
	content:'\e0a8';
	font-family:'intaeFont';
	font-size:21px;
	vertical-align:middle;
	display:inline-block;
	margin-top:-2px;
	margin-right:6px;
	}
.uploadSet .btnCamera .info{font-size:0.85em; letter-spacing:-0.03em; font-weight:300; color:#626262; transition: all .25s ease-in-out;}
.uploadSet .btnCamera:hover .info{color:#bde8ff;}
.uploadSet .holdImg{float:left;}
.uploadSet .holdImg img{width:auto; height:150px; margin-left:10px;}
.uploadSet div.uploader span.filename,
.uploadSet div.uploader span.action,
.uploadSet div.button,
.uploadSet div.button span {display:none !important;}





/*──────────────── Radio & Checkbox ────────────────*/
input[type="checkbox"] {margin-right:10px; display:none;}
input[type="radio"] {margin-right:10px; display:none;}
label{cursor:pointer;}

input[type="checkbox"] + span { display:inline-block; vertical-align:middle; width:19px; height:19px; line-height:20px; /*margin-right:8px;*/ background:#cacaca; border-radius:5px; cursor:pointer; text-align:center; color:rgba(255,255,255,0); }
input[type="checkbox"].large + span{width:24px; height:24px; line-height:24px; border-radius:7px;}
input[type="checkbox"] + span:before{content:'\e306'; font-family:'intaeFont'; font-size:15px; font-weight:bold;}
input[type="checkbox"]:hover + span{color:rgba(255,255,255,1);}
input[type="checkbox"]:checked + span{color:rgba(255,255,255,1); background:#1abc9c;}

input[type="checkbox"] + span.num{font-size:14px; font-weight:400; line-height:17px;}
label input[type="checkbox"] + span.num:after{content: attr(data-num);}
label:hover input[type="checkbox"] + span.num:after,
input[type="checkbox"]:checked + span.num:after{display:none;}



input[type="radio"] + span{
	position:relative;
	display:inline-block;
	vertical-align:middle;
	width:18px;
	height:18px;
	margin-right:6px;
    background:#cacaca;
	border-radius:50%;
    cursor:pointer;
	text-align:center;
	}
input[type="radio"] + span:before{content:'';display:inline-block;position:absolute;top:50%;left:50%;margin-top:-3px;margin-left:-3px;width:6px;height:6px;background:rgba(255,255,255,0);border-radius:50%;}
label:hover input[type="radio"] + span{background:#c2c2c2;}
label:hover input[type="radio"] + span:before{background:rgba(255,255,255,0.75);}
input[type="radio"]:checked + span, label:hover input[type="radio"]:checked + span{background:#1abc9c;}
input[type="radio"]:checked + span:before, label:hover input[type="radio"]:checked + span:before{background:rgba(255,255,255,0.9);}







/*──────────────── Checkbox 토글버튼 디자인 ──────────────── */
[type="checkbox"],
[type="checkbox"]:after,
[type="checkbox"]:before,
[type="checkbox"] *,
[type="checkbox"] *:after,
[type="checkbox"] *:before,
[type="checkbox"] + [class^="toggle-"] {box-sizing: border-box;}

[type="checkbox"]::-moz-selection,
[type="checkbox"]:after::-moz-selection,
[type="checkbox"]:before::-moz-selection,
[type="checkbox"] *::-moz-selection,
[type="checkbox"] *:after::-moz-selection,
[type="checkbox"] *:before::-moz-selection,
[type="checkbox"] + span::-moz-selection,
[type="checkbox"]::selection,
[type="checkbox"]:after::selection,
[type="checkbox"]:before::selection,
[type="checkbox"] *::selection,
[type="checkbox"] *:after::selection,
[type="checkbox"] *:before::selection,
[type="checkbox"] + [class^="toggle-"]::selection{background: none;}
[type="checkbox"] + [class^="toggle-"]{
	outline: 0;
	display: block;
	margin:0;
	padding:0;
	width: 60px;
	height: 30px;
	position: relative;
	cursor: pointer;
	border-radius:0px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	}
[type="checkbox"] + [class^="toggle-"]:after, [type="checkbox"] + [class^="toggle-"]:before {
	content: "";
	position: relative;
	display: block;
	width: 50%;
	height: 100%;
	font-family:'Nanum Gothic', sans-serif !important;
	font-size:12px;
	}
[type="checkbox"] + [class^="toggle-"]:after{left: 0;}
[type="checkbox"] + [class^="toggle-"]:before {display: none;}
[type="checkbox"]:checked + [class^="toggle-"]:after {left: 50%;}
[type="checkbox"] + .toggle-light{ background: rgba(0,0,0,0.1); border-radius: 2em; padding: 2px; transition: all .4s ease; }
[type="checkbox"] + .toggle-light:after { border-radius: 50%; background: #fff; transition: all .2s ease; }
[type="checkbox"]:checked + .toggle-light{background: #3883ff;}
[type="checkbox"] + .toggle-light:before,
[type="checkbox"] + .toggle-light:hover:before{}
[type="checkbox"]:checked  + .toggle-light:before { content: "ON"; position: absolute; top:5px; left:2px; display: block; width: 50%; height: 100%; font-size:11px; font-weight:bold; }
[type="checkbox"] + .toggle-ios{ background: rgba(0,0,0,0.1); border-radius: 2em; padding: 2px; transition: all .3s ease; }
[type="checkbox"] + .toggle-ios:after{
	border-radius: 2em;
	background: #fbfbfb;
	-webkit-transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease;
	transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), 0 4px 0 rgba(0, 0, 0, 0.08);
	}
[type="checkbox"] + .toggle-ios:hover:after {will-change: padding;}
[type="checkbox"] + .toggle-ios:active {box-shadow: inset 0 0 0 2em #e8eae9;}
[type="checkbox"] + .toggle-ios:active:after {padding-right: .8em;}
[type="checkbox"]:checked + .toggle-ios{background: #3883ff; border:0 solid #e8eae9;}
[type="checkbox"]:checked + .toggle-ios:active {box-shadow: none;}
[type="checkbox"]:checked + .toggle-ios:active:after {margin-left: -.8em;}
[type="checkbox"] + .toggle-skewed{
	overflow: hidden;
	-webkit-transform: skew(-10deg);
	transform: skew(-10deg);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transition: all .2s ease;
	font-family: sans-serif;
	background: #888;
	}
[type="checkbox"] + .toggle-skewed:after,
[type="checkbox"] + .toggle-skewed:before{
	-webkit-transform: skew(10deg);
	transform: skew(10deg);
	display: inline-block;
	transition: all .2s ease;
	width: 100%;
	text-align: center;
	position: absolute;
	line-height: 29px;
	font-weight: bold;
	color: #fff;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
	}
[type="checkbox"] + .toggle-skewed:after {left: 100%; content: attr(data-tg-on);}
[type="checkbox"] + .toggle-skewed:before, [type="checkbox"] + .toggle-skewed:before {left: 0; content: attr(data-tg-off) !important;}
[type="checkbox"] + .toggle-skewed:active {background: #888;}
[type="checkbox"] + .toggle-skewed:active:before {left: -10%;}
[type="checkbox"]:checked + .toggle-skewed{background: #1abc9c;}
[type="checkbox"]:checked + .toggle-skewed:before {left: -100%;}
[type="checkbox"]:checked + .toggle-skewed:after {left: 0;}
[type="checkbox"]:checked + .toggle-skewed:active:after {left: 10%;}
[type="checkbox"] + .toggle-flat{ padding: 2px; transition: all .2s ease; background: #fff; border: 4px solid rgba(0,0,0,0.1); border-radius: 2em; }
[type="checkbox"] + .toggle-flat:after { transition: all .2s ease; background: rgba(0,0,0,0.1); content: ""; border-radius: 1em; }
[type="checkbox"]:checked + .toggle-flat{border: 4px solid #1abc9c; background: transparent;}
[type="checkbox"]:checked + .toggle-flat:after {left: 50%; background: #1abc9c;}
[type="checkbox"] + .toggle-flip{ width:120px; padding: 2px; transition: all .2s ease; font-family: sans-serif; -webkit-perspective: 100px; perspective: 100px; background: transparent; }
[type="checkbox"] + .toggle-flip:after,
[type="checkbox"] + .toggle-flip:before {
	display: inline-block;
	transition: all .4s ease;
	width: 100%;
	text-align: center;
	position: absolute;
	line-height: 30px ;
	font-weight: bold;
	color: #fff;
	background: transparent;
	position: absolute;
	top: 0;
	left: 0;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	border-radius: 4px;
	}
[type="checkbox"] + .toggle-flip:after {content: attr(data-tg-on) !important; background: #02C66F; -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg);}
[type="checkbox"] + .toggle-flip:before {background: #FF3A19; content: attr(data-tg-off)  !important;}
[type="checkbox"] + .toggle-flip:active:before {-webkit-transform: rotateY(-20deg); transform: rotateY(-20deg); }
[type="checkbox"]:checked + .toggle-flip{ background: transparent;}
[type="checkbox"]:checked + .toggle-flip:before {-webkit-transform: rotateY(180deg); transform: rotateY(180deg);}
[type="checkbox"]:checked + .toggle-flip:after {-webkit-transform: rotateY(0); transform: rotateY(0);left: 0;background: #1abc9c;}
[type="checkbox"]:checked + .toggle-flip:active:after {-webkit-transform: rotateY(20deg); transform: rotateY(20deg);}*/