@charset "utf-8";
/* -----------------------------------------------
	* 사이트 전체 기본 스타일 정의
--------------------------------------------------
	- 최초 작성일 :2021.08.15
	- 최초 작성자 :아보카도
	- 최종 수정일 :
	- 최종 수정자 :
--------------------------------------------------*/


/*********************************
	기본 스타일
**********************************/

html,
body {height:100%;}

body  {line-height:1.5; font-size:13px;}
caption {display:none;}
html.single:before {content:""; display:block; position:fixed; top:0; left:0; right:0; bottom:0; z-index:-10;}


/*********************************
	폼 요소 스타일
**********************************/

button {font-size:12px;}
.form-input {display:block; line-height:30px !important;}
input[type="file"] {padding-left:0 !important;}

.form-input,
input[type="text"],
input[type="password"],
input[type="file"],
select {box-sizing:border-box; height:30px; border-width:1px; border-style:solid; padding:0 10px; max-width:100%; font-size:12px; line-height:1.2;}

.form-input,
input[type="text"].full,
input[type="password"].full,
input[type="file"].full,
select.full {width:100%;}

textarea {box-sizing:border-box; border-width:1px; border-style:solid; padding:5px; width:100%; min-height:80px; font-size:12px;}
.wr_content #wr_content {min-height:300px}
.txt-light {color:#999;}

/*********************************
	Ajax 검색 리스트
**********************************/

.ajax-list-box {height:100px; overflow-y:auto; margin-top:10px; padding:5px;}
.ajax-list-box ul,
.ajax-list-box li {display:block; margin:0; padding:0; position:relative;}
.ajax-list-box li {margin-bottom:5px;}
.ajax-list-box li a {display:block; position:relative; padding:10px; border-radius:3px; text-decoration:none; font-size:12px;}
.ajax-list-box li a .ui-thumb {position:absolute; top:10px; left:10px; width:30px; height:30px; line-height:30px; overflow:hidden; text-align:center;}
.ajax-list-box li a .ui-thumb img {max-width:100%;}
.ajax-list-box li a .ui-info {margin-left:40px;}
.ajax-list-box .no-data {line-height:50px; text-align:center; margin-top:10px;}


/*********************************
	기본 라인 스타일
**********************************/

hr.line {display:block; position:relative; clear:both; margin:10px 0; border:none; padding:0; height:1px;}
hr.line.dot {background:none;border-top:1px dotted #c2ae7c;}
hr.padding {display:block; clear:both; margin:0; padding:0; border:none; height:30px;}
hr.padding.small {height:5px;}

#bo_v_img img {height:auto !important;}


/********************
	TWITTER
*********************/

.timeline-Body {border:none; font-size:12px; }
.timeline-Widget {background:none; opacity:.8;}
.timeline-Body-notification,
.timeline-Tweet-actions,
.timeline-Header {display:none;}
.timeline-Viewport {height:100%; overflow:auto;}
.timeline-TweetList {display:block; list-style:none; margin:0; padding:0;}

.timeline-Tweet {position:relative; padding:20px 5px 20px 0;}
.timeline-Tweet:before	{content:""; display:block; position:absolute; bottom:0; left:0; right:0; height:1px; border-top-width:1px; border-top-style:dashed;}
.timeline-TweetList li:first-child .timeline-Tweet	{padding-top:0;}
.timeline-Tweet .timeline-Tweet-text {padding:0 10px;}

.timeline-Tweet-inReplyTo {display:none;}
.TweetAuthor-link {display:block; position:relative; margin-bottom:10px; font-size:13px; font-weight:400; padding:2px 5px;}
.TweetAuthor-avatar {display:none;}
.TweetAuthor-screenName {font-size:11px; opacity:.5;}
.Interstitial-cookieConsentButton {display:none;}
.Interstitial-link {display:inline-block; vertical-align:middle; padding:2px 10px; margin:3px 0;}

.timeline-Tweet-metadata		{display:block; position:relative; font-size:11px; text-align:right; padding-right:10px;} 

.MediaCard-mediaContainer	{ padding-bottom:20px !important; }

.timeline-LoadMore { display:none; }
.Emoji { width:15px; vertical-align:middle; }
.NaturalImage-image,
.CroppedImage-image {height:auto !important;}
.u-floatLeft, .u-floatRight {display:none;}


/**************************************************************
	버튼
***************************************************************/

.ui-btn {display:inline-block; position:relative; text-align:center; border-width:1px; border-style:solid; vertical-align:middle; height:28px; padding:0 15px; box-sizing:border-box; cursor:pointer;border-radius:2px; font-size:12px;}
a.ui-btn {line-height:26px;}
.ui-btn.small {height:25px; line-height:23px;}
.ui-btn.full {width:100%;}

.ui-btn.admin {background:#8c1e1e; color:#fff; border-color:#691010;}
.ui-btn.disable {opacity:.3;}

.ui-btn.ico {width:15px; height:15px; text-align:left; line-height:15px; padding:0; font-size:11px; overflow:hidden; text-indent:-999px;}
.ui-btn.ico.default {width:28px; height:28px; line-height:28px;}
.ui-btn.ico:before {display:block; position:absolute; top:0; left:0; right:0; bottom:0; text-align:center; text-indent:0; font-family:'icon';}
.ui-btn.ico.big {width:40px; height:40px; line-height:40px; font-size:18px;}
.ui-btn.ico.circle {border-radius:9.0em;}

.ui-btn.ico.del {background:#a40000; color:#fff; border:none; border-radius:2px; margin-left:5px;}
.ui-btn.ico.del:before {content:"\e9ac";}
.ui-btn.ico.camera:before {content:"\e90f";}
.ui-btn.ico.search:before {content:"\e986";}
.ui-btn.ico.exp:before {content:"\e923";}
.ui-btn.ico.search:before {content:"\e986";}

.ico.big {display:flex; flex-direction:column;justify-content:center;align-items: center; width:130px;height:130px; background:url('https://i.imgur.com/O3f1mqY.png') center no-repeat;border:0 none; }
.ico.big::before {content:"";display:block;position:absolute; width:50px;height:50px;background:#c2ae7c;transform:rotate(45deg);box-shadow:0 0 1px rgba(0,0,0,.5);}
.ico.big span {display:block; position:relative;padding-top:22px;padding-bottom:4px;color:#000;font-size:11px;font-weight:bold;line-height:1;word-spacing:-2px}
.ico.big span::after {content:"";display:block;position:absolute;top:0;left:50%;margin-left:-12px;width:24px;height:18px;background:url('../img/util.png') no-repeat;}

.ico.big.area span::after {background-position: -110px -106px ;}
.ico.big.closet span::after {background-position: -112px -24px ;}
.ico.big.mod span::after {background:none;content:"\e989";font-family:'icon';font-size:18px; font-weight:normal;}
.ico.big.view span::after {background:none;content:"\e986";font-family:'icon';font-size:18px; font-weight:normal;}

.map_zoom .ui-btn {padding:0; width:28px;}
.map_zoom .ui-btn:disabled {background:#666; cursor:default;}

@media all and (max-width:640px) {
	.ico.big {right:-10px;width:70px;height:70px;background:none;}
	.ico.big::before{width:45px;height:45px;border:1px solid transparent;border-image:linear-gradient(135deg,#c2ae7c88,#c2ae7c99) 1 / 1px / 3px;}
	.ico.big span {padding-bottom:6px;}
}

/**************************************************************
	기본박스
***************************************************************/

.toggle-ui {position:relative;padding-top:15px;width:60px;margin:0 auto;}
.ui-btn.ico.ui-badge {
	position:absolute;bottom:30px;right:10px;
	width:18px;height:18px;line-height:16px;text-indent:0;text-align:center;pointer-events: none;}

.board-notice p {word-break:keep-all; font-size:13px;}
.board-notice b, .board-notice strong {color:#c2ae7c;}
.theme-box {display:block; position:relative; padding:10px; box-sizing:border-box;}
.theme-box .theme-box ,.aside-content .theme-box{color:#ccc;}
.border1 {border:1px solid #c2ae7c;}
.round20 {border-radius:20px;}
.round15 {border-radius:15px; padding: 20px;}
.round10 {border-radius:10px;}
.round5 {border-radius:5px;}
.round3 {border-radius:3px;}

.outer-big,.outer-med {position:relative;padding:19px 23px;}
.outer-med.notice-head {max-width:400px; margin: 0 auto;}
.outer-med.notice-head.small {padding:67px 19px 23px;background:url('https://i.imgur.com/JxSRnA5.png')top center no-repeat;background-size:136px auto;filter:brightness(.9);}
.box-big,.box-banner {position:relative;border:1px solid #c2ae7c;box-shadow:0 0 2px black,inset 0 0 2px black;}
.outer-big .box-big {border-left:1px solid rgba(0,0,0,0.5);border-right:1px solid rgba(0,0,0,0.5);}
.box-big::before,.box-big::after {content:"";display:block;position:absolute;left:50%;margin-left:-32px;width:64px;height:28px;background:url('../img/util.png') no-repeat;z-index:2;}
.box-big::before {top:-13px;}
.box-big::after {bottom:-13px;background-position:0 -30px;}
.box-big > .inner {border:1px solid transparent;border-image:url('https://i.imgur.com/Ge408l3.png') 23 40 / 23px 40px / 7px 23px;}
.outer-big .box-big.grad > .inner {margin:-1px;border-image-outset: 6px 22px;}
.outer-big::after {content:"";display:block;position:absolute;top:0;left:31px;width:210px;height:46px;background:url('https://i.imgur.com/VpqQQVT.png') no-repeat;z-index:2;}

.outer-banner {padding:15px 10px;}
.box-banner::before,.box-banner::after {content:"";display:block;position:absolute;top:50%;margin-top:-24px;width:22px;height:48px;background:url('../img/util.png') no-repeat;z-index:2;}
.box-banner::before {left:-11px;background-position:0 -76px;}
.box-banner::after {right:-11px;background-position:-24px -76px;}
.box-banner > .inner {position:relative;}
.box-banner > .inner::after {content:"";display:block;position:absolute;top:0;left:0;right:0;bottom:0;border:1px solid transparent;border-image:url('https://i.imgur.com/rAHRvmz.png') 26 15/ 26px 15px /15px 5px}

.box-mini {position:relative;border:1px solid #c2ae7c;box-sizing: border-box;border-radius:5px;}
.box-mini::after {content:"";position:absolute;display:block;top:0;left:0;right:0;bottom:0;border:1px solid transparent;border-image:url('../img/corner.png') 16/16px/2px;z-index: 4; }


.content-header {position:relative;padding:15px 10px 10px; text-align:center;z-index:10;}
.content-header .outer-sub {display:inline-block;min-width:50%}
.content-header .outer-sub .inner {flex-direction:row;justify-content: space-evenly;}
.content-header a {font-size:14px; font-weight:bold;} 

.header-wrap.abs {position:absolute;top:0;left:0;right:0;overflow: hidden;} 
.title-header{margin:0 auto; font-family:'Chosunilbo_myungjo',serif;font-size:24px; text-align:center;} 
.title-header.blank img {filter:brightness(0.85);}
.title-header p {position:relative;display:inline-block;}
.title-header p::after {content:"";display:block;position: absolute;top:26px;right:-166px;width:330px;height:188px;background:url('https://i.imgur.com/7eNegIR.png')no-repeat;transform:rotate(-9deg);filter:brightness(0.9) contrast(1.2);}
.title-header.blank p::after {right:-270px;}
.title-header p img {position: relative;z-index: 2;}
.title-header.small {max-width:300px;height:240px;background:url('https://i.imgur.com/ZXMTpBk.png')top center no-repeat;background-size:contain;}
.title-header span{display:none;}

.outer-sub {position:relative;padding:51px 48px 16px;background:url('https://i.imgur.com/BXIwMyl.png')top center no-repeat;}
.outer-sub.big {padding:51px 48px 52px; background:url('https://i.imgur.com/JxSRnA5.png')top center no-repeat; }
.sub-mini {display:inline-block;position:relative;padding:18px 48px 16px;}
.box-sub {font-weight:normal;}
.box-sub::before,.box-sub::after {content:"";display:block;position:absolute;top:0;width:48px;height:96px;background:url('https://i.imgur.com/BWMt3PC.png') no-repeat;}
.outer-sub .box-sub::before,.outer-sub .box-sub::after {top:33px;}
.box-sub::before {left:0;background-position:left top;}
.box-sub::after {right:0;background-position:right top;}
.box-sub > .inner {position:relative;display:flex;flex-direction:column; padding:10px 0;justify-content:center;align-items:center;min-width:100px;height:66px;border-top:1px solid #f1e9b2;border-bottom:1px solid #f1e9b2;background:rgba(0,0,0,0.7);box-sizing: border-box;}
.box-sub > .inner::before,.box-sub > .inner::after {content:"";display:block;position:absolute;left:50%;margin-left:-17px;width:32px;height:14px;background:url('../img/util.png') no-repeat;}
.box-sub > .inner::before {top:-7px;background-position:0 -60px;}
.box-sub > .inner::after {bottom:-7px;background-position:-32px -60px;}

.p-title {position:relative;padding-left:34px;margin:0;height:40px;line-height:40px;font-family:'Chosunilbo_myungjo',serif;font-weight:normal;font-size:1.25em;text-shadow:0 0 2px black;}
.p-title::before {content:"";display:block;position:absolute;top:7px;left:4px;width:26px;height:26px;background:url('../img/util.png') -110px -50px no-repeat;}


.outer-med.no-cont {height:100vh;box-sizing: border-box;display: flex;flex-direction: column;justify-content: center;}
.no-cont .box-big {min-height:50vh;}
.no-cont .inner {height:100%;display: flex;justify-content: center;align-items: center;}
#aside .no-cont .box-big::before,#aside .no-cont .box-big::after {display:none;}
#aside .no-cont .box-big .inner {border:1px solid #c2ae7c;border-image:none;border-radius:15px;}

.alert-header {position:absolute;top:100px;right:0px;padding:12px;border:4px solid yellow;background:magenta;color:greenyellow;font-size:20px;font-family: 'gungsuh',serif;z-index:9999; }
.alert-header a {display:block;}
@media all and (max-width:720px) {
	.outer-big, .outer-med {padding:5px 8px;}
	.box-big > .inner {border-image:url('https://i.imgur.com/Ge408l3.png') 23 40 / 14px 24px / 4px 14px;}
	.outer-big .box-big.grad > .inner {margin:-1px;border-image-outset: 5px 13px;}
	.box-big::before,.box-big::after {transform:scale(0.66);}
	.box-big::before {top:-14px;}
	.box-big::after {bottom:-14px;}
	.outer-big::after {display:none;} 
	.title-header p::after {display: none;}
}

/**************************************************************
	테이블
***************************************************************/

table {width:100%; padding:0; border-spacing:0px; border:0; border-collapse:collapse; table-layout:fixed;}
th, td {border:none;}
/*
.theme-form { }*/
.theme-form td {padding:5px; height:30px;}
.theme-form th {padding:5px 10px;}
.theme-form .frm_info {display:block; font-size:12px; padding:0 0 8px 0;}

.theme-list {table-layout:fixed;}
.theme-list thead th {height:30px;}
.theme-list td {padding:5px; height:30px;}
.theme-list td.no-data {padding:5px; text-align:center; line-height:200px;}


/**************************************************************
	도움말 정보
**************************************************************/

.frm_info {display:block; font-size:12px; padding:0 0 8px 0; opacity:.7;}
.status-bar .frm_info {padding:0;}


/**************************************************************
	Status Bar
***************************************************************/

.status-bar {display:block;}
.status-bar dl,
.status-bar dd,
.status-bar dt {margin:0; padding:0;}
.status-bar dl {display:block; position:relative; margin:1px 0; padding-left:100px; line-height:28px;}
.status-bar dt {position:absolute; top:0; left:0;}
.status-bar dd p {position:relative;}
.status-bar dd p span {display:block; position:absolute; top:0; left:0; bottom:0; z-index:0;}
.status-bar dd p sup {display:block; position:absolute; top:0; left:0; bottom:0; z-index:0;}
.status-bar dd p i {display:block; position:relative; padding-left:5px; font-size:11px; z-index:1;}

/** Bar Control 추가 **/
.status-bar dl.ui-control {padding-right:60px;}
.status-bar dl dd.control {display:block; position:absolute; top:0; bottom:0; right:0; width:60px;}
.status-bar dl dd.control a {display:block; position:relative; width:50%; float:left; margin:0; padding:0; text-indent:-999px; overflow:hidden;}
.status-bar dl dd.control a:before  {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; text-indent:0; text-align:center; font-family:'icon';}
.status-bar dl dd.control a + a {border-left-width:0;}
.status-bar dl dd.control a[data-function="plus"]:before {content:'\ea0a';}
.status-bar dl dd.control a[data-function="minus"]:before {content:'\ea0b';}


/**************************************************************
	배경음악 이퀄라이저 효과
***************************************************************/

html.single .bgm-player {display:none !important;}

.bgm-player {padding:15px 0 0;text-align:center;}
.bgm-player .title {display:inline-block; vertical-align:middle; line-height:30px; font-size:13px;}
.bgm-player ul {display:inline-block; vertical-align:middle;}
.bar-equalizer {display:inline-block; vertical-align:middle; position:relative; width:90px; height:25px; margin:0 auto; overflow:hidden; text-align:center; box-sizing:border-box; margin-left:15px;}
.bar-equalizer i {display:block; float:left; width:1px; margin-right:2px; border-radius:5px; margin-top:15px; transform:translateY(-50%); transition:height 0.3s linear; -webkit-transition:height 0.3s linear;}
.bgm-player li {display:inline-block;}
.bgm-player li a {display:block; position:relative; width:14px; height:100%; line-height:27px; text-align:left; text-indent:-999px; overflow:hidden;}
.bgm-player li a:before {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; text-indent:0; text-align:center; font-family:'icon'; font-size:12px;}
.bgm-player li a.play:before {content:"\ea1c";}
.bgm-player li a.stop:before {content:"\ea1e";}


#canv {display:block;position: fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;overflow:hidden;z-index:-9;background: rgba(0,0,0,0.3);transition: none;pointer-events: none;}
/*******************************************
	헤더 레이아웃
********************************************/

#header {z-index:9990;}
#header::-webkit-scrollbar {
	display: none;
	}

#header .fix-layout {padding:0;height:100%;}
#logo img {max-width:225px;}

#gnb::-webkit-scrollbar{display:none;}


#login_toggle {display:block;width:35px;height:65px;margin:0 auto;box-sizing:content-box;background:url('https://i.imgur.com/Jpr3AVY.png')no-repeat; border:0 none;}
#util {display:none;position:fixed;left:110px;bottom:45px; width:400px;background:url('https://i.imgur.com/BXIwMyl.png') top center no-repeat;box-sizing:border-box;padding:51px 24px 9px;z-index:10;}
#util .box-big {padding-bottom:38px;}
#util .box-big .inner {border-image-outset:7px 23px 45px;}
#util .inner {padding:25px 20px 15px;}
#util .inner::before {content:"";display:block;position:absolute;left:0;bottom:-38px;width:100%;height:38px;background:rgba(189,167,114,.7);z-index:-1;}
#util.on {display:block;}

#util .expgold {display:grid;position:absolute;right:0;left:0;bottom:-38px;height:38px;padding:0 25px; align-items: center; grid-template-columns: auto auto;box-sizing:border-box;}
#util .expgold p {position:relative;padding-left:50px;color:#000;}
#util .exp::after ,#util .gold::after {content:"";position:absolute;display:block;width:18px;height:18px;top:50%;left:24px;margin-top:-9px;background:url('../img/util.png') no-repeat;}
#util .exp::after {background-position: -70px -106px;}
#util .gold::after {background-position: -50px -106px;}

/** 디자인 설정 안할 시 */
#no_design_gnb {text-align:center;}
#no_design_gnb::before {content:"";display:block;position:fixed;top:0;left:0;width:223px;height:300px;background:url('https://i.imgur.com/mueuTHo.png');pointer-events: none;}
#no_design_gnb .menu {display:flex;justify-content:center;align-items:center;height:56px;text-align:center;} 
#no_design_gnb .menu.main { position:fixed;top:0;z-index:99;height:235px;}
#no_design_gnb .menu.world {padding-top:235px;}
#no_design_gnb .menu.shop {background:#c2ae7c;}
#no_design_gnb .menu a{display:block;color:#888;}
#no_design_gnb .menu.main a {width:100px;height:235px;}
#no_design_gnb .menu.shop a {color:#333;}
#no_design_gnb .menu i {display:block;margin:0 auto;width:30px;height:30px;background:url('../img/menu.png');}
#no_design_gnb .menu.main i {background:none;}
#no_design_gnb .menu.world i {background-position:0 -30px;}
#no_design_gnb .menu.member i {background-position:0 -60px;}
#no_design_gnb .menu.load i {background-position:0 -90px;}
#no_design_gnb .menu.story i {background-position:0 -120px;}
#no_design_gnb .menu.bbs i {background-position:0 -150px;}
#no_design_gnb .menu.library i {background-position:0 -180px;}
#no_design_gnb .menu.qna i {background-position:0 -210px;}
#no_design_gnb .menu.history i {background-position:0 -240px;}
#no_design_gnb .menu.shop i {background-position:0 -270px;}
#no_design_gnb .menu span{ display:block;line-height:1.1;font-size:11px;font-weight:bold;}
#no_design_gnb .menu.main span {display:none;}

.close-header #header {width:0px !important;}
.close-header #body {margin-left:0 !important;}
.close-header body {min-width:0;}

#end {display:block;position:absolute;bottom:0;}

@media all and (min-width:1025px) {
	#header .fix-layout {height:100%;}
	#gnb {min-height:100%;width:75px;}
}

@media all and (max-width:1024px)  {
	.toggle-ui  {display:none;}
	#util {display:block;position:relative;width:100%;height:auto;left:auto;bottom:auto;background:none;padding:0 0 30px;}
	#util .box-big {border:0 none;box-shadow:none;}
	#util .box-big::before,#util .box-big::after {display:none;}
	#util .box-big .inner {margin:0 auto;padding:10px;border:0 none;}
	#util .inner::before {background:#c2ae7c;}
	#util .inner::after {display:none;}
	.close-header #header {width:auto !important;}
	#no_design_gnb {padding-top:60px;}
	#no_design_gnb::before {display:none;}
	#no_design_gnb .menu {height:50px;color:#888;}
	#no_design_gnb .menu.main {position:relative;height:50px;}
	#no_design_gnb .menu.main a {width:auto;height:auto;}
	#no_design_gnb .menu.main i{background:url('../img/menu.png');background-position:0 0;}
	#no_design_gnb .menu.world {padding-top:0;}
	#no_design_gnb .menu i, #no_design_gnb .menu span {display:inline-block;vertical-align: middle;}
	#no_design_gnb .menu span {padding-left:6px;font-size:14px;}
	#no_design_gnb .menu.main span {display:inline-block;}

	body {width:100%;}
	#logo {padding:0; z-index:0; top:auto; left:auto; transform:translateX(0) translateY(0); position:relative; text-align:center;}
	#body {margin-left:0px;}
	
	/* 헤더 위치 */
	#header .fix-layout {padding:0;}
	#header {position:fixed; top:0; left:0; right:0; bottom:auto; width:auto; height:50px; overflow:visible;}

	/* 메인메뉴 */
	#gnb {position:fixed; top:0; right:-280px; bottom:0; width:280px; z-index:999; overflow-y:auto;}
	#gnb_control_box {position:absolute; top:50%; margin-top:-20px; right:10px; width:40px; height:40px; text-align:center;}
	#gnb_control_box:before {content:""; display:inline-block; width:0; height:100%; vertical-align:middle;}
	#gnb_control_box img {display:inline-block; max-width:50%; max-height:50%; vertical-align:middle; margin-left:-12%; opacity:1;}

	/* 메뉴 열고 닫기 */
	#gnb_control_box,
	#gnb_control_box *  {transition:all 0s ease; -webkit-transition:all 0s ease; -ms-transition:all 0s ease;}

	/* 메뉴 열렸을 시 */
	.open-gnb #gnb {right:0;}
	.open-gnb #gnb_control_box {position:fixed; top:0; left:0; right:0; bottom:0; z-index:99; background:rgba(0, 0, 0, 0.5); border-radius:0; width:auto; height:auto;}
	.open-gnb #gnb_control_box img {opacity:0;}
}

#aside{
    position:fixed; 
	display:flex;
	align-items: center;
	top:0;
    right: -400px; 
	bottom:0;
    height:100vh;
    width:400px;
	z-index:9000;
}

#aside.on {
	right:0;
}
#aside .aside_toggle {
	margin-left:-84px;
	width:84px;height:162px;
	background:url('https://i.imgur.com/x5CikCN.png') no-repeat;
	border:0 none;
}
#aside.on .aside_toggle {
	background:url('https://i.imgur.com/eBzH7Og.png') no-repeat;
}
.aside-content {
	position:relative;
	width:100%;
	box-sizing: border-box;
	height:100vh;
	background:url('https://i.imgur.com/GaINE6w.png') center -110px no-repeat,linear-gradient(90deg, rgba(0,0,0,0.6), rgba(0,0,0,0.75));
}
.aside-content::before, .aside-content::after{content:"";display:block; position:absolute;}
.aside-content::before {left:0;top:0;bottom:0;width:3px;background:linear-gradient(90deg,#5b4f2c,#c2ae7c,#5b4f2c);box-shadow:0 0 1px black;}
.aside-content::after{top:0;left:-22px;width:46px;height:138px;background:url('https://i.imgur.com/V5gfPJE.png') no-repeat;}
.aside-content .aside-inner {position:absolute;top:3px;left:0;right:0; padding:0 24px;height:100%;overflow-y:auto;}
.aside-content h2 {margin:0;padding:0;height:102px;line-height:102px;}


@media all and (min-width:641px) and (max-width:1024px){
	.aside-content h2 {padding-top:30px;}
}
@media all and (max-width:640px){
	#aside {
		flex-direction:column;
		top:auto;
		left:0;
		right:0;
		bottom:-75%;
		width:100%;
		height:75%;
	}
	#aside.on{
		right:0;
		bottom:0;
	}
	#aside .aside_toggle {
		margin-left:0;
		margin-top:-64px;
		width:124px;height:64px;min-height:64px;
		background:url('https://i.imgur.com/YIVirlx.png') bottom center no-repeat;
		background-size:contain;
	}
	#aside.on .aside_toggle {
		margin-left:0;
		width:124px;height:64px;min-height:64px;
		background:url('https://i.imgur.com/aMps9t1.png') bottom center no-repeat;
		background-size:contain;
	} 
	.aside-content::before {top:0;left:0;right:0;bottom:auto;width:100%;height:3px;background:linear-gradient(180deg,#5b4f2c,#c2ae7c,#5b4f2c);box-shadow:0 0 1px black;}
	.aside-content::after{display:none;}
	.aside-content .aside-inner {padding:0 10px 10px;box-sizing: border-box;}
	.aside-content h2 {height:84px;line-height:84px;}
	.content-header .outer-sub {display:block;width:100%;box-sizing: border-box;}
}


@media all and (max-width:480px) {
	.box-big .box-big > .inner {border-image:none;}
}

/**************************************************************
	탭 설정
***************************************************************/

#tab_list {display:block; position:relative; overflow:hidden; border-bottom-width:2px; border-bottom-style:solid;}
#tab_list li {display:block; position:relative; float:left;}
#tab_list li a {display:block; position:relative; border-bottom-width:0;}
#tab_list li + li a {border-left-width:0px;}


/**************************************************************
	페이지 설정
***************************************************************/

.pg_wrap {display:block; position:relative; text-align:center; padding:20px 0;}
.pg_wrap .pg_page {display:inline-block; position:relative; height:28px; line-height:26px; min-width:26px; box-sizing:border-box; padding:0 5px; font-size:12px; text-align:center; vertical-align:middle; border-width:1px; border-style:solid;}
.pg_wrap .pg_control {overflow:hidden; text-align:left; text-indent:-999px;}
.pg_wrap .pg_control:before {font-family:'icon'; display:block; position:absolute; top:0; left:0; right:0; bottom:0; text-indent:0; text-align:center; font-size:14px;}
.pg_wrap .pg_start,
.pg_wrap .pg_end {display:none;}
.pg_wrap .pg_prev:before {content:"\ea23";}
.pg_wrap .pg_next:before {content:"\ea24";}


/****************************************************
	Search Box
****************************************************/

.searc-sub-box {position:relative; clear:both; padding:30px 0px;}
.ui-search-box {position:relative; padding-left:100px; padding-right:80px; margin-top:5px;}
.ui-search-box .sch_category {position:absolute; top:0; left:0; width:95px; line-height:30px;}
.ui-search-box .sch_button {position:absolute; top:0; right:0; width:75px;}
.ui-search-box span {display:block; padding:0 15px;}
.ui-search-box select,
.ui-search-box input[type="text"],
.ui-search-box button {display:block; width:100%;}


/****************************************************
	인벤토리 팝업 뷰
****************************************************/

.inven-popup-viewer,
.inven-popup-viewer * {transition:none; font-family:'Dotum';}
.inven-popup-viewer .ajax-list-box {height:auto; padding:5px; font-size:11px; word-break:keep-all; line-height:1.5;}
.inven-popup-viewer {display:none; position:fixed; top:50%; left:50%; width:300px; height:420px; margin-left:-150px; margin-top:-210px;z-index:9000; padding:25px 35px; box-sizing:border-box;}
.inven-item-box {position:relative; margin-right:25px; padding-left:25px;  border-right-width:0px;}
.inven_popup_viewer_close {display:none;}
.inven-popup-on .inven_popup_viewer_close, .image-popup-on .inven_popup_viewer_close {display:block; position:fixed; top:0; left:0; right:0; bottom:0; z-index:8900; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);}
.inven_popup_viewer_close a {display:block; position:absolute; top:0; left:0; right:0; bottom:0; OVERFLOW:hidden; text-indent:-999px;}

.inven-popup-viewer.default-form .inner-content {position:relative; height:100%;}
.inven-popup-viewer.default-form .inner-content .error  {position:absolute; top:0;left:0; right:0;  text-align:center; line-height:100px; } 

.inven-popup-viewer.default-form .over  {display:none;width:100%;height:100%;position:absolute;top:0;}

.inven-popup-viewer.default-form .info {position:relative; text-align:center;margin:0 auto;}
.inven-popup-viewer.default-form .under .info{width:64px;height:64px;}
.inven-popup-viewer.default-form .over .info {width:100%;height:100%;}
.inven-popup-viewer.default-form .info .ui-thumb {display:flex;position:relative;justify-content: center;align-items: center;width:100%;height:100%;} 
.inven-popup-viewer.default-form .under .another-view .ui-thumb::after {content:"\e98b";position: absolute;display:block;padding:1px;bottom:8px;right:8px;line-height:1;border:1px solid #c2ae7c;border-radius:2px; font-size:12px;font-family:'icon';background:rgba(0,0,0,.6)}
.inven-popup-viewer.default-form .over .info .ui-thumb img {max-width:100%;max-height:100%;}
.inven-popup-viewer.default-form .text {position:relative; font-size:11px;line-height:1.4;}
.inven-popup-viewer.default-form .text .title {font-size:13px; text-align:center;padding: 10px 0;} 
.inven-popup-viewer.default-form .text .item-content-box { height:64px; padding:15px;background:rgba(100,100,100,0.3); overflow-y:auto; } 
.inven-popup-viewer.default-form .text .item-content-box .extra {padding-top:10px;}
.inven-popup-viewer.default-form .text .item-content-box + .item-content-box {margin-top:10px;}
.inven-popup-viewer.default-form .text .item-content-box.no-add {height:160px;}
.inven-popup-viewer.default-form .text div.memo { padding-top:10px;}

.inven-popup-viewer.default-form .control-box {clear:both; position:relative; padding:15px 0 0; text-align:center;}
.inven-popup-viewer.default-form .control-box li {display:inline-block;}
.inven-popup-viewer.default-form .control-box li a {display:block; }

.inven-popup-viewer.default-form .add-item-form {position:relative; display:none;}
.inven-popup-viewer.default-form .add-item-form.on {display:block;}
.inven-popup-viewer.default-form .add-item-form .item-info {position:relative; margin-bottom:5px;}
.inven-popup-viewer.default-form .add-item-form .item-info label {display:none;}
.inven-popup-viewer.default-form .add-item-form .item-info span {display:block; font-size:11px;}
.inven-popup-viewer.default-form .add-item-form input {width:100%; box-sizing:border-box;}
.inven-popup-viewer.default-form .add-item-form .item-input {position:relative; margin-bottom:2px;}
.inven-popup-viewer.default-form .add-item-form .ui-style-btn.type4 {position:absolute; right:87px; bottom:-44px; height:25px; line-height:25px;}

.inven-popup-viewer.default-form .send-item-form	 {position:relative; height:30%;}
.inven-popup-viewer.default-form .send-item-form input,
.inven-popup-viewer.default-form .send-item-form select {width:100%; box-sizing:border-box;}
.inven-popup-viewer.default-form .send-item-form input {padding:0 10px;}
.inven-popup-viewer.default-form .send-item-form .item-input {position:relative; margin-bottom:5px;}
.inven-popup-viewer.default-form .send-item-form .ui-style-btn.type4 {position:absolute; right:87px; bottom:-44px; height:25px; line-height:25px;}


/* 이미지 팝업 */
.image-view-popup img {cursor:pointer;}
#image_view_layer {display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;overflow:auto;background:rgba(0,0,0,0.5);}
#image_view_layer ::-webkit-scrollbar {width:8px;height:8px;}
#image_view_layer .inner-content {position:relative;width:100%;min-height:100%;text-align:center;}
#image_view_layer .inner-content .btn-img-popup-close {
	display: block;
    min-width: 100%;
    min-height: 100vh;
    box-sizing: border-box;
    padding: 20px;
    height: max-content;
}
#image_view_layer .inner-content .btn-img-popup-close::before {content:"";display:inline-block;width:0; height:calc(100vh - 40px);vertical-align: middle;}
#image_view_layer.full .inner-content .btn-img-popup-close {width:max-content;}
#image_view_layer .inner-content img { max-height: calc(100vh - 40px);}
#image_view_layer.full .inner-content img {max-width:none;max-height:none;}
#image_view_layer .img-sizing {position:fixed;bottom:10px;right:10px;width:36px;height:36px;z-index:3;}
#image_view_layer .img-sizing .btn-resize {
	display:none;position:absolute;bottom:0;right:0;
	width:36px;height:36px;text-align:center;line-height:36px;
	border:1px solid #c2ae7c;border-radius:5px;
	background:#000;
	}
#image_view_layer:hover .img-sizing .btn-resize.enlarge{display:block;}
#image_view_layer.full:hover .img-sizing .btn-resize.shrink{display:block;}
#image_view_layer .img-sizing .btn-resize::before {content:"";display:block;font-family:'icon';font-size:26px;}
#image_view_layer .img-sizing .btn-resize.enlarge::before {content:"\e989";}
#image_view_layer .img-sizing .btn-resize.shrink::before{content:"\e98a";}
.image-popup-on .inven_popup_viewer_close {z-index:9990;}


/****************************************************
	Top 버튼
****************************************************/

#topbottom {position:fixed; right:20px; bottom:20px; z-index:50; display:none;}
#topbottom a{position:relative;display:block;width:30px;height:30px;line-height:30px;text-align:center;background:#333;}
#goto_bottom {margin-top:5px;}
#topbottom a span {display:block;width:0;text-indent:100%;overflow:hidden;white-space:nowrap;}
#topbottom a span::after {content:"";display:block;position:absolute;width:0;height:0;top:50%;left:50%;transform:translate(-50%,-50%); border-left: 7px solid transparent; border-right: 7px solid transparent;}
#goto_top span::after { border-bottom: 12px solid #c2ae7c; }
#goto_bottom span::after { border-top: 12px solid #c2ae7c; }

/****************************************************
	서브메뉴 레이아웃
****************************************************/

#submenu {display:block; position:relative; text-align:center; z-index:2;}
#submenu li {display:inline-block; vertical-align:middle; font-size:13px; font-weight:600; padding:8px 10px;}
#subpage {margin-top:20px; position: relative;}
#subpage section {padding-bottom:50px;}

@media all and (max-width:1024px)  {
	#topbottom { right:10px;bottom:10px;}
	#submenu {margin:0;}
	#submenu li {padding:5px; font-size:12px;}
	#subpage {margin-left:0;}
}


/****************************************************
	페이지 타이틀
****************************************************/

.page-title {font-size:18px; padding:10px 0 20px;}
.page-title span {font-size:14px; opacity:.8; font-weight:400;}

.sub-title {font-size:14px; padding:0 0 10px;}
.sub-title:before {content:"\e906"; display:inline-block; vertical-align:middle; font-family:'icon'; margin-right:8px;}


/****************************************************
	알람 팝업
****************************************************/

.ui-memo-alram-box,
.ui-call-alram-box {display:none; position:fixed; top:0; left:0; right:0; z-index:9996; text-align:center;}


/****************************************************
	마퀴 (우 ▶ 좌) 흐름
****************************************************/

.marquee span {display:block; position:relative; overflow:hidden;}
.marquee span i:after {content:""; white-space:nowrap; padding-right:50px;}
 .marquee span i {margin:0; padding-left:100%; display:inline-block; white-space:nowrap;
	-webkit-animation-name:marquee;
	-webkit-animation-timing-function:linear;
	-webkit-animation-duration:20s;
	-webkit-animation-iteration-count:infinite;
	-moz-animation-name:marquee;
	-moz-animation-timing-function:linear;
	-moz-animation-duration:20s;
	-moz-animation-iteration-count:infinite;
	-ms-animation-name:marquee;
	-ms-animation-timing-function:linear;
	-ms-animation-duration:20s;
	-ms-animation-iteration-count:infinite;
	-o-animation-name:marquee;
	-o-animation-timing-function:linear;
	-o-animation-duration:20s;
	-o-animation-iteration-count:infinite;
	animation-name:marquee;
	animation-timing-function:linear;
	animation-duration:20s;
	animation-iteration-count:infinite;
}
.marquee span i:hover {animation-play-state: paused;}
@-webkit-keyframes marquee  {
	from    {-webkit-transform:translate(0%);}
	99%,to  {-webkit-transform:translate(-100%);}
}
@-moz-keyframes marquee  {
	from    {-moz-transform:translate(0%);}
	99%,to  {-moz-transform:translate(-100%);}
}
@-ms-keyframes marquee  {
	from    {-ms-transform:translate(0%);}
	99%,to  {-ms-transform:translate(-100%);}
}
@-o-keyframes marquee  {
	from    {-o-transform:translate(0%);}
	99%,to  {-o-transform:translate(-100%);}
}
@keyframes marquee  {
	from    {transform:translate(0%);}
	99%,to  {transform:translate(-100%);}
}


@keyframes flicker {
    50% {opacity:0;}
    100% {opactiy:1;}
}