﻿@charset "UTF-8";

/* Default */
* { padding:0; margin:0; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; word-break:keep-all; }
*[data-anchor] { position:absolute; visibility:hidden; margin-top:-60px; }

html * { font-family:'Noto Sans Korean', san-serif; }
html,
body { height:100%; }
body { color:#222; background-color:#fafafa; }
img { vertical-align:middle; }
em { font-style:normal; }
form fieldset { border:none; }
a[data-href] { color:#080; text-decoration:none; }
button[disabled] { opacity:.2; }
label[data-disabled="true"] { opacity:.2; }
label[data-disabled="true"] input { opacity:0; }
pre { white-space:pre-wrap; word-break:break-all; }

#ly-Body.active { overflow:hidden; }

#ly-Mask { width:100vw; height:100vh; background-color:rgba(0, 0, 0, .9); position:fixed; top:0; left:0; z-index:5; display:none; }

#ly-Layout { width:100%; min-width:300px; min-height:100%; position:relative; }

#ly-Header { width:100%; height:70px; position:fixed; top:0; left:0; z-index:3; background-color:#fff; display:flex; align-items:center; }

#ly-System-Title { height:70px; padding:20px; background-color:#fff; flex:1; display:flex; align-items:center; border-bottom:1px solid #dadada; }
#ly-System-Title h1 { font-size:1.5em; }

#ly-System-Member { width:230px; height:70px; display:flex; align-items:center; background-color:#2A2A30; padding-left:15px; padding-right:15px; border-bottom:1px solid #556; }
#ly-System-Member div { width:45px; height:45px; font-size:1.6em; font-weight:700; display:flex; align-items:center; justify-content:center; line-height:1; border-radius:200px; }
#ly-System-Member div.color.red { background-color:#f33; color:#000; }
#ly-System-Member dl { color:#fff; margin-left:10px; }
#ly-System-Member dt { font-weight:600; }
#ly-System-Member dd { margin-top:2px; color:#aaa; font-size:.75em; }

#ly-System-Function { height:70px; padding:20px; border-bottom:1px solid #dadada; }
#ly-System-Function button { border:none; background-color:transparent; }

#ly-Side { padding-top:70px; background-color:#2A2A30; }
#ly-Side { min-height:100%; top:0; left:0; z-index:2; }

#ly-Navi a.parent-link { padding:24px 15px 24px 56px; display:block; font-weight:700; text-decoration:none; color:#ccc; position:relative; transition:all ease .5s; transition-property:background, color; line-height:1; outline:none; }
#ly-Navi a.parent-link.focus,
#ly-Navi a.parent-link:focus,
#ly-Navi a.parent-link:hover { color:#fff; background-color:rgba(0, 0, 0, .2); }
#ly-Navi a.parent-link.active { background:url('../../img/common/img-navi-active.svg') right center rgba(35, 125, 200, .75) no-repeat; color:#fff; }
#ly-Navi a.parent-link:after { width:100%; height:100%; content:''; position:absolute; top:0; left:0; opacity:.3; background-position:20px center; background-repeat:no-repeat; transition:all ease .5s; transition-property:background, opacity; filter:brightness(0) invert(1); }
#ly-Navi a.parent-link.navi-1:after { background-image:url('../../img/common/img-navi-dashboard.svg'); }
#ly-Navi a.parent-link.navi-101:after { background-image:url('../../img/common/img-navi-menu.svg'); }
#ly-Navi a.parent-link.navi-1001:after { background-image:url('../../img/common/img-navi-member.svg'); }
#ly-Navi a.parent-link.navi-2001:after { background-image:url('../../img/common/img-navi-board.svg'); }
#ly-Navi a.parent-link.navi-3001:after { background-image:url('../../img/common/img-navi-popup.svg'); }
#ly-Navi a.parent-link.navi-997001:after { background-image:url('../../img/common/img-navi-statistics.svg'); }
#ly-Navi a.parent-link.navi-998001:after { background-image:url('../../img/common/img-navi-admin.svg'); }
#ly-Navi a.parent-link.navi-999001:after { background-image:url('../../img/common/img-navi-setting.svg'); }
#ly-Navi a.parent-link:focus:after,
#ly-Navi a.parent-link:hover:after,
#ly-Navi a.parent-link.active:after { opacity:.75; }
#ly-Navi a.parent-link span { line-height:1; }
#ly-Navi a.parent-link:not(.active) + ul.child { display:none; }
#ly-Navi ul.child { background-color:rgba(255, 255, 255, .05); }
#ly-Navi li.child-li:first-of-type { padding-top:15px; }
#ly-Navi li.child-li:last-of-type { padding-bottom:15px; }
#ly-Navi a.child-link { padding:6px 20px; text-decoration:none; font-size:.9em; color:#ccc; display:block; border-left:1px solid transparent; outline:none; }
#ly-Navi a.child-link:focus,
#ly-Navi a.child-link:hover { color:#fff; }
#ly-Navi a.child-link.active { color:#fff; }

#ly-Sections { min-height:100%; position:relative; padding-top:70px; padding-left:230px; }
#ly-Sections section.frame { padding:20px 20px 70px 20px; }

#ly-Footer { width:100%; }

/* Mobile */
@media screen and (min-width:1px) and (max-width:799.99px) {
	#ly-Navi { width:230px; margin-top:40px; position:fixed; overflow-y:scroll; }
}

/* Mobile & Tablet */
@media screen and (min-width:1px) and (max-width:1219.99px) {
}

/* Tablet */
@media screen and (min-width:800px) and (max-width:1219.99px) {
}

/* Tablet & Desktop */
@media screen and (min-width:800px) {
	#ly-Side { width:230px; position:absolute; }
}

/* Desktop */
@media screen and (min-width:1220px) {
}

/* Loading */
#ly-Loading { width:100vw; height:100vh; display:none; position:fixed; top:0; left:0; z-index:1000; }
#ly-Loading .frame { width:100%; height:100%; display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; -ms-flex-pack:center; justify-content:center; . }
#ly-Loading .obj-loading { position:relative; }
#ly-Loading .obj-loading > div { width:200px; height:200px; position:absolute; top:0; left:0; border-radius:50%; border:20px solid #000; border-color:#e53c2e transparent #e53c2e transparent; -webkit-animation:loading 2s linear infinite; animation:loading 2s linear infinite; }
#ly-Loading .obj-loading > div:nth-child(2),
#ly-Loading .obj-loading > div:nth-child(4) { width:156px; height:156px; top:22px; left:22px; -webkit-animation:loading-reverse 1s linear infinite; animation:loading-reverse 1s linear infinite; }
#ly-Loading .obj-loading > div:nth-child(2) { border-color:transparent #ccc transparent #ccc; }
#ly-Loading .obj-loading > div:nth-child(3) { border-color:transparent; }
#ly-Loading .obj-loading > div:nth-child(3) div { width:100%; height:100%; position:absolute; -webkit-transform:rotate(45deg); transform:rotate(45deg); }
#ly-Loading .obj-loading > div:nth-child(3) div:before,
#ly-Loading .obj-loading > div:nth-child(3) div:after { width:20px; height:20px; content:''; display:block; position:absolute; top:-20px; left:70px; background:#e53c2e; border-radius:50%; box-shadow:0 180px 0 0 #e53c2e; }
#ly-Loading .obj-loading > div:nth-child(3) div:after { left:-20px; top:70px; box-shadow:180px 0 0 0 #e53c2e; }
#ly-Loading .obj-loading > div:nth-child(4) { border-color:transparent; }
#ly-Loading .obj-loading > div:nth-child(4) div { width:100%; height:100%; position:absolute; -webkit-transform:rotate(45deg); transform:rotate(45deg); }
#ly-Loading .obj-loading > div:nth-child(4) div:before,
#ly-Loading .obj-loading > div:nth-child(4) div:after { width:20px; height:20px; content:''; display:block; position:absolute; top:-20px; left:48px; background:#ccc; border-radius:50%; box-shadow:0 136px 0 0 #ccc; }
#ly-Loading .obj-loading > div:nth-child(4) div:after { left:-20px; top:48px; box-shadow:136px 0 0 0 #ccc; }
#ly-Loading .obj-loading { width:120px !important; height:120px !important; -webkit-transform:translate(-60px, -60px) scale(0.6) translate(60px, 60px); transform:translate(-60px, -60px) scale(0.6) translate(60px, 60px); }

@keyframes loading {
	0% {
		-webkit-transform:rotate(0);
		transform:rotate(0);
	}
	100% {
		-webkit-transform:rotate(360deg);
		transform:rotate(360deg);
	}
}

@-webkit-keyframes loading {
	0% {
		-webkit-transform:rotate(0);
		transform:rotate(0);
	}
	100% {
		-webkit-transform:rotate(360deg);
		transform:rotate(360deg);
	}
}

@keyframes loading-reverse {
	0% {
		-webkit-transform:rotate(0);
		transform:rotate(0);
	}
	100% {
		-webkit-transform:rotate(-360deg);
		transform:rotate(-360deg);
	}
}

@-webkit-keyframes loading-reverse {
	0% {
		-webkit-transform:rotate(0);
		transform:rotate(0);
	}
	100% {
		-webkit-transform:rotate(-360deg);
		transform:rotate(-360deg);
	}
}