@charset "utf-8";


html{opacity:0}


.login-theme-top{position: absolute;top: 0;left: 0;right: 0;height: 60%;background:var(--gradient);max-height: 480px;} 
.login-theme-top::before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;background:url(/resources/images/name/mng/layout/login-theme-top.png) no-repeat 50% 0 / cover;mix-blend-mode:color-burn}
.login-wrapper{z-index:1;position: relative;max-width:550px;min-height: 800px;height:100%;padding:0 25px;margin:0 auto;padding-top: 100px}
.login-container{flex:1;text-align:center}
.login-logo img{max-width:none;height:inherit}
.login-summary{line-height:140%;margin-top: 15px}
.login-input{position:relative;padding: 55px 80px;margin-top: 50px;border-radius:12px;box-shadow:0 5px 20px rgba(0, 0, 0, 0.2);background-color:#fff}
.login-title{letter-spacing:-2px;font-size:32px;font-weight: 700}
.login-title span{display:inline-block;background: var(--gradient);-webkit-background-clip: text;-webkit-text-fill-color: transparent}
.login-fields{position:relative;margin-top: 25px}
.login-fields .dynamic-field ~ .dynamic-field{margin-top: 15px;}
.login-fields .form-selectbox{width:100%}
.login-fields .form-selectbox::before{top:22px}
.login-fields .form-selectbox .form-select-searchbox{height:50px}
.login-fields .form-selectbox .form-select-searchbox-toggle{text-align:left;line-height:50px}
.login-fields .form-selectbox .form-select-searchbox-option{text-align:left}
.login-fields .form-selectbox input{height:50px;border-radius:5px}
.login-fields .dynamic-field input{height:50px;border-radius:5px;width: 100%;}

.login-button{display:flex;margin-top:25px}
.login-button button{width:100%;height:55px;font-weight:700;font-size:18px;background-color:var(--primary);border-radius:5px;color:#fff}
.login-util{display:flex;justify-content:center;align-items:center;margin-top: 20px;}
.login-util button{font-weight:500;}
.login-util button span{display:inline-block;padding:0 0 3px;border-bottom:1px solid #666;transition:padding 300ms ease-out}
.login-util button:hover span{display:inline-block;padding:0 10px 3px;border-bottom:1px solid var(--primary)}
.login-util .div{height:10px;margin:0 15px;border-left:1px solid var(--border)}
.login-util button:hover{color:var(--primary)}
.login-copyright{margin-top:75px;color:#9a9a9a}
.login-capseLook{z-index:10;position:absolute;border:1px solid var(--primary);border-radius:5px;font-size:14px;padding: 17px 17px 0 41px;box-shadow:2px 2px 10px rgba(0, 0, 0, 0.2);background:#fff url(/resources/images/name/mng/layout/warning.png) no-repeat 15px 50%}
.login-capseLook::before{content:'';position:absolute;top:50%;left: -5px;width:10px;height:10px;background-color:#fff;border:solid var(--primary);border-width:1px 0 0 1px;transform-origin:50% 50%;transform:translateY(-50%) rotate(-45deg)}

.login-saving {text-align:initial;margin-top: 15px;}
.login-saving  label{display:flex;font-weight:400;align-items:center;line-height:110%;}

@media screen and (max-width:480px) {
	.login-input{padding:40px 30px}
}


/* 컴포넌트 에디터  ifrmae */
.cms-editor{position:relative;height:535px;margin:15px 0;border:1px solid #ddd}
.cms-editor .cms-editor-gradient{
	content:'';
	position:absolute;bottom:0;left:0;
	width:100%;height:300px;
	background:rgb(255,255,255);
	background:linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
.cms-editor-iframe{width:100%;height:600px;border:0}
.cms-editor-cover{z-index:100000;position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.5);cursor:pointer;opacity:0;transition:opacity 200ms ease-out}
.cms-editor-cover span{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);font-weight:500;font-size:40px;color:#fff}

.cms-editor:hover .cms-editor-cover{opacity:1}

/*********************************************************/

.mt5{margin-top:5px !important}
.mt10{margin-top:10px !important}
.mt20{margin-top:20px !important}
.mt30{margin-top:30px !important}
.mt40{margin-top:40px !important}
.mt50{margin-top:50px !important}


.cms-flag-qna{display:inline-block;vertical-align:1px;padding:5px 10px 7px;font-weight:400;margin-right:5px;line-height:100%;font-size:0.8571rem;background-color:var(--primary);color:#fff}
.cms-img-new{vertical-align:-1px}
.cms-img-notice{vertical-align:-1px}
.cms-list-empty{position:relative;top:50%;text-align:center;-ms-transform:translateY(-50%);transform:translateY(-50%)}

.error-message{
	position:relative;
	display:block;
	width:100%;
	line-height: 130%;
	margin-top: 5px;
	padding-left: 20px;
	font-size: 15px;
	color:#000;
	flex: 1 1 100% !important;
	text-align:left;
	background: url(/resources/images/name/mng/layout/message-error.png) no-repeat 0 1.5px;
	color:#f10000;
}
.warning-message{
	position:relative;
	display:block;
	width:100%;
	line-height: 130%;
	margin-top: 5px;
	padding-left: 20px;
	font-size: 15px;
	color:#000;
	flex: 1 1 100% !important;
	text-align:left;
	background:url(/resources/images/name/mng/layout/message-warning.png) no-repeat 0 1.5px;
}
.success-message{
	position:relative;
	display:block;
	width:100%;
	line-height: 130%;
	margin-top: 5px;
	padding-left: 20px;
	font-size: 15px;
	color:#000;
	flex: 1 1 100% !important;
	text-align:left;
	background:url(/resources/images/name/mng/layout/message-success.png) no-repeat 0 1.5px;
	color:#1a6dff;
}
.info-message{
	position:relative;
	display:block;
	width:100%;
	line-height: 135%;
	margin-top: 5px;
	padding-left: 20px;
	font-size: 15px;
	color:#000;
	flex: 1 1 100% !important;
	text-align:left;
	background: url(/resources/images/name/mng/layout/message-info.png) no-repeat 0 1px;
}
.color-red{color:#f10000}
.color-blue{color:var(--primary)}

.cms{position:relative}
.cms:after{content:'';display:block;clear:both}

.cms .hide{position:fixed;top:-1px;left:-1px;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden;visibility:hidden}
.cms .center{text-align:center}
.cms .left{text-align:left}
.cms .right{text-align:right}

.cms [lang=en]{font-family:'Roboto', sans-serif}

.cms-curtain{display:none;z-index: 1000;position:fixed;top:0;left:0;width:100%;height:100vh;background-color:rgba(0, 0, 0, 0.7)}

.cms-gap{margin:25px}
.cms-gap-vertical{margin:25px 0}
.cms-gap-horizontal{padding:0 25px}
.cms-gap-top{margin-top:25px}
.cms-gap-right{padding-right:25px}
.cms-gap-bottom{margin-bottom:25px}
.cms-gap-left{padding-left:25px}

.cms-gap-vertical-small{margin:10px 0}
.cms-gap-horizontal-small{margin:0 10px}

.cms-border-top{padding-top:25px;border-top:1px solid #ddd}
.cms-border-bottom{padding-bottom:25px;border-bottom:1px solid #ddd}
.cms-border-dashed{margin:10px 0;border-top:1px dashed #ddd}

.cms-nav-open{display:none;width: 50px;height: 50px;background:url(/resources/images/name/mng/layout/mo-nav.svg) no-repeat 50% 50%}





/* 로고 */
.cms-logo{z-index: 1200;overflow:hidden;position:fixed;top:0;left:0;width:300px;height:70px;background-color: #262a35;border-bottom:1px solid rgba(255, 255, 255, 0.05)}
.cms-logo h1{height:inherit}
.cms-logo a{display:flex;padding:0 15px;align-items:center;height:inherit;color:#fff;font-size:20px}
.cms-logo a img{width: 40px;margin-right:15px}
.cms-logo a span{line-height: 110%;word-break:keep-all}

.cms-head{z-index: 1200;overflow:hidden;position:fixed;top:70px;left:0;width:300px;height:calc(100% - 70px);padding: 0 0 50px;background-color: #23262e}
.cms-head .head-container{width:300px;height:100%}
.cms-head .head-container .mCSB_scrollTools{width:15px}

.cms-head .cms-alert{padding-top:30px}
.cms-head .cms-alert img{display:block;margin:0 auto;opacity:0.5}
.cms-head .cms-alert p{font-weight:300;width:100%;text-align:center;margin-top:20px;font-size:16px;color:#fff}
.cms-head .cms-alert p ~ p{margin-top:10px}

.cms-head .cms-nav{position:relative;overflow:hidden;padding-top: 10px;height: 100%}
.cms-head .cms-nav [class*=cms-icon]{display:inline-block;margin-right:10px;height: 10px;overflow: hidden}
.cms-head .cms-nav [class*=cms-icon]:before{color:rgba(255, 255, 255, 0.5);transition:color 100ms ease-out}
.cms-head .cms-nav .cms-icon-Arrow-down-1{position:absolute;top:50%;right:20px;margin-right:0;transform-origin:0 8px;transform:translateY(-50%) rotateX(0deg)}
.cms-head .cms-nav .cms-icon-Arrow-down-1:before{font-size: 10px;vertical-align: 10px}
.cms-head .cms-nav .nav-list{position:relative;font-size: 17px;transition:top 100ms ease-out}
.cms-head .cms-nav .nav-list .icon{margin-right:10px;display:none}
.cms-head .cms-nav .nav-list .icon img{vertical-align: -2px}
.cms-head .cms-nav .nav-list a{display:block;position:relative;padding: 20px 40px 20px 25px;color:var(--text-gray)}
.cms-head .cms-nav .nav-list ul ul a{padding:15px 40px 15px 35px;font-size:16px}
.cms-head .cms-nav .nav-list ul ul ul a{padding: 12px 40px 12px 50px;font-size:15px}
.cms-head .cms-nav .nav-list ul ul{background-color:rgba(0, 0, 0, 0.3)}
.cms-head .cms-nav .nav-list ul ul ul{background-color:rgba(0, 0, 0, 0.3)}
.cms-head .cms-nav .nav-list .is-selected{color:var(--text-white)}
.cms-head .cms-nav .nav-list [data-depth="1"].is-selected{background-color:var(--primary)}

.cms-head .cms-nav .nav-list a img{filter: invert(0.5)}
.cms-head .cms-nav .nav-list a.is-selected img{filter: invert(0)}

.cms-version{  z-index: 1100; position: fixed; bottom: 0; left: 0; width: 300px; height: 50px; border-top: 1px solid rgba(255, 255, 255, 0.1); padding: 20px 0 0; text-align: center; font-size: 12px; color: rgba(255, 255, 255, 0.7); font-weight: 400 }

.cms-body{position: relative;min-height: 100vh;margin-left:300px}

.cms-title{z-index: 1000;position:sticky;top:0;display:flex;background-color: #fff;align-items:center;height:70px;padding: 0 20px;padding-left: 60px;box-shadow: 0 0 5px rgba(0, 0, 0, 0.2)}
.cms-title-nav{display:flex;align-items:center;flex:1}
.cms-title-util{display:flex;align-items:center;height: inherit}
.cms-title-util>*~*{margin-left:10px}
.cms-title-logo{display:none;height:70px}
.cms-title-logo a{display:block;width:180px;height:inherit;background:url(/resources/images/name/mng/layout/logo.svg) no-repeat 0 50%}

.cms-contents{padding:20px}

.cms-dashboard{padding:20px;background-color:var(--dashboard)}

.cms-member{display:none;padding:10px 10px 0;color:#dfdfdf;text-align:center}
.cms-member .member-name, .cms-member .member-util{display:block;padding:10px 0;color:inherit}
.cms-member .member-name{font-size:16px;font-weight:300}
.cms-member .member-name b{color:#fff}
.cms-member .member-util{margin-top:5px;border:1px solid #4f4f4f;background-color:rgba(0, 0, 0, 0.2)}
.cms-member .member-util ::before{margin-right:3px;color:inherit}


/* 차트 */
.amchart{height:300px}

/* 메뉴 축소/확대 */
.cms-cutback{cursor: pointer;z-index: 1300;position:fixed;top: 15px;left: 310px;width:40px;height: 40px;perspective: 60px}
.cms-cutback [class*=cms-icon]::before{color:#fff}
.cms-cutback.show-front .cube { transform: translateZ(-20px) rotateY(   0deg); }
.cms-cutback.show-right .cube { transform: translateZ(-20px) rotateY( -90deg); }
.cms-cutback .cube { width: 40px; height: 40px; position: relative; transform-style: preserve-3d; transform: translateZ(-20px); transition: transform 200ms ease-out 0ms }
.cms-cutback .cube__face {position:absolute;display:flex;align-items:center;justify-content:center;width:40px;height: 40px;background:linear-gradient(90deg, #262a35 0%, #262a35 100%);transition:background 200ms ease-out 0ms;border:solid rgba(255, 255, 255, 0.2);border-width:0 1px 0 0}
.cms-cutback:hover .cube__face{border:solid rgba(255, 255, 255, 0.2);border-width:0 1px 0 0;background:var(--gradient)}
.cms-cutback .cube__face--front{transform: rotateY(  0deg) translateZ(20px)}
.cms-cutback .cube__face--right{transform: rotateY( 90deg) translateZ(20px)}

/* 메뉴 축소 */ 
.set-isCutback .cms-cutback{left:70px} 
.set-isCutback .cms-logo{width:80px;background-color:#fff;}
.set-isCutback .cms-head{width:0px}
.set-isCutback .cms-body{margin-left:0}
.set-isCutback .cms-title{padding-left:120px} 
.set-isCutback .cms-version{display:none}


.set-unCutback .cms-cutback{left: 310px}

@media screen and (max-width:1400px) {
	.cms-cutback{display:none;transition:none}
	.cms-head{left:-300px;transition:none}
	.cms-logo{left:-300px;transition:none}
	.cms-body{margin-left:0;transition:none}
	.cms-title{padding-left:0;transition:none}
	.cms-nav-open{display:block;transition:none}
	.cms-version{display:none;transition:none}
}

@media screen and (max-width:1000px) {
	.cms-title{display:block;height:100px}
	.cms-title-select{position:absolute;top: 8px;left: 48px}
	
	.cms-title-nav{justify-content:center;padding-top:13px;border-top:1px solid var(--border)}
	.cms-title-nav .component-navigation{padding-left:30px;background:url(/resources/images/name/mng/layout/nav-home.png) no-repeat 0 50%}

	.cms-title-util{position:absolute;top:0;right:0;height:50px}
	.cms-title-util .component-profile{height:49px}
	.cms-title-util .component-profile .profile-function{top:45px;left:auto;right:10px}
	.cms-title-util .component-profile .profile-account .account-img{width:35px;height:35px}
}



.cms-auth-list{display:flex;flex-wrap:wrap;border-radius:5px;border:1px solid var(--border);padding:20px}
.cms-auth-list div{padding:15px;margin:2px;border-radius:5px;background-color:var(--primary);color:var(--text-white);font-weight:500}


 

.tempalte-selector{display:flex;width:100%}
.tempalte-selector .item{flex:1;padding:10px;} 
.tempalte-selector .item .item-radio{overflow:hidden;position:relative;width:100%;padding-top:100%;background-color:var(--background-lightgray);border-radius:10px;border:1px solid var(--border)}
.tempalte-selector .item .item-radio img{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);max-width:200px;max-height:80%;border-radius:5px;box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2)} 
.tempalte-selector .item .item-radio:hover{outline:3px solid var(--primary)}
.tempalte-selector .item .item-radio.is-checked{border-color:var(--primary);background-color:var(--primary)}
.tempalte-selector .item .item-text{padding:10px 0;text-align:center}
.tempalte-selector .item .item-text b{font-weight:600;color:#000}
.tempalte-selector .item .item-preview{text-align:center;margin-top:10px;padding-top:10px;border-top:1px dotted var(--border)}
 
.tempalte-selector .enabled-true .item-radio:hover{outline:none}
.tempalte-selector .disabled-true{opacity:0.3}
.tempalte-selector .disabled-true .item-radio:hover{outline:none}
 
@media screen and (max-width:800px) {
	.tempalte-selector{flex-wrap:wrap}
	.tempalte-selector .item{flex:0 1 50%} 
}



.amchart-wrapper{padding-top:30px}