/* 사이드영역 기본 레이아아웃 */
.side_box {position:fixed; top:0; left:0; transform:translateX(-100%); max-width:300px; width:calc(100% - 75px); height:100%; visibility: hidden; opacity:0;  transition: all .3s; background:url(/images/bg_fire.jpg) no-repeat; background-size:cover; background-position:-200px;  z-index:1002;}
.side_box:after {content:""; position:absolute; top: 0; left: 0; width: 100%; height: 100%; background:rgba(0,0,0,0.65);}
.side_box.show {transform:translateX(0); visibility: visible; opacity: 1; }
.side_box > i {position:absolute; top:25px; right:25px; color:red; font-size:22px; transition:all .3s; z-index: 1; display: none;}
.side_box .sd_head {position:relative; text-align: center;  transition: all .3s; z-index:2; padding-top:50px;}

.side_box .sd_content {position:relative;  z-index:2;   padding-top:50px;}


.side_box .logo_circle {position:relative; left:0; right:0; margin:0px auto 0 auto; border-radius:100%; background:#f8971d; width:110px;}
.side_box .logo_circle:after {content:""; display:block; padding-top:100%;}
.side_box .logo_circle img {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); height:71.047%;z-index:3;}
.side_box .logo_circle .bg_cir {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); background:#053607; border-radius:100%;}
.side_box .logo_circle .bg_cir:after {content:""; display:block; padding-top:100%;}
.side_box .logo_circle .bg_cir.bg1 {width:95%;}
.side_box .logo_circle .bg_cir.bg2 {width:85%; z-index:1;}


.side_box .logo_circle .c_cir {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); background:#f8971d; border-radius:100%;width:93%;}
.side_box .logo_circle .c_cir:after {content:""; display:block; padding-top:100%;}
.side_box .logo_txt {display:inline-block; vertical-align:middle; position: relative; font-size:22px; font-weight:800; color:#fec007; text-align:center; line-height:100%; padding:12px 0 0 5px; letter-spacing:0.05em; text-align:center;}
.side_box .logo_txt span {display:inline-block; font-size:13px; font-weight:600; color:#f8971d; line-height:100%; padding:7px 0 0 0; }

@media screen and (max-width: 300px){
	.side_mask > i {display: none;}
	.side_box {width:100%;}
	.side_box > i {display: block;}
}

.side_box .sd_head .logo_box {position:absolute; top:45px; left:30px; font-size:0; width:170px; cursor:pointer;}
.side_box .sd_head .logo_box img {display:inline-block; vertical-align:top; width:50px;}
.side_box .sd_head .logo_box .logo_txt {display:inline-block; vertical-align:top; width:calc(100% - 50px); font-size:12px; color:#fff; text-align:left; padding-left:10px;}
.side_box .sd_head .logo_box .logo_txt span {display:inline-block; width:100%; font-size:11px;}

.side_box .latest_aca_list_mb {position: absolute; bottom:0; left:0; right:0; width:calc(100% - 10px); margin:auto;; height: 50px; overflow: hidden; background:#021631; border-radius:30px;background: url(/images/bg_menu_cover1.jpg) no-repeat; background-position: bottom center !important; background-size: cover;}
.side_box .latest_aca_list_mb .c_title {position: absolute; top:50%; left:15px; transform:translateY(-50%);  background:#0161ce; line-height:100%; padding:4px 7px ;font-size:9px; color:rgba(255,255,255,0.7); border-radius:30px;}

.side_box .latest_aca_list_mb ul.real_study {position: absolute;top: 0;right: 0; width: calc(100% - 80px); }
.side_box .latest_aca_list_mb ul.real_study li {height: 50px;font-size: 0; text-align: left; width: 100%;text-overflow: ellipsis; white-space: nowrap; overflow:hidden;}
.side_box .latest_aca_list_mb ul.real_study li a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;}
.side_box .latest_aca_list_mb ul.real_study li h4,
.side_box .latest_aca_list_mb ul.real_study li when {display: inline-block; vertical-align: middle; height: 50px;line-height: 50px;}
.side_box .latest_aca_list_mb ul.real_study li h4 {font-size: 11px; color: #0bf; font-weight: 500;}
.side_box .latest_aca_list_mb ul.real_study li when {font-size: 11px; color: #ddd; font-weight: 300;}


.login_user	{ position:absolute; top:50%; left:0; transform:translateY(-50%); padding:0; width:100%; z-index:1;}
.login_user .info_box		{position:relative; padding:0 45px 35px 45px;}
.login_user .info_box i		{position:absolute; top:0; left:0; font-size:40px; color:#000;}
.login_user .info_box .set	{position:relative; }
.login_user .info_box .set > div	{display:inline-block; width:100%; line-height:110%; text-align:left; position:relative;}
.login_user .info_box .set .who	{font-family:var(--neo); font-size:20px; font-weight:800; color:#000; letter-spacing:-0.05em;padding:0px 0 10px 0;}
.login_user .info_box .set .who span	{display:inline-block; font-size:13px; letter-spacing:0em; padding-left:5px;}
.login_user .info_box .set .msg	{font-size:11px; color:#000; line-height:140%; opacity:0.4;}
nav.user_mov	{position:absolute; bottom:80px; left:0; width:100%; font-size:0; padding:0 25px; display:flex; }
nav.user_mov li	{flex:1; font-size:0; position:relative;}
nav.user_mov li a	{position:absolute; top:0; left:0; font-size:0; width:100%; height:100%;}
nav.user_mov li i,
nav.user_mov li span	{display:inline-block; width:100%; line-height:100%;}
nav.user_mov li i	{font-size:20px; color:#fff;}
nav.user_mov li span	{font-size:10px; color:#ddd; padding-top:3px;font-family:var(--neo); font-weight:300; letter-spacing:-0.05em;}
nav.user_mov li.out	{position:absolute; top:0; right:0; width:auto;}




/* 사이드영역 사이트메뉴 출력 / navi_default_toggle */
ul.navi_mb		{display:inline-block; width:100%;margin:0; padding:0 50px;}
ul.navi_mb > li				{position:relative; }
ul.navi_mb > li > a			{display:block; font-family: var(--neo); font-size: 16px; font-weight: 500; letter-spacing: -0.05em;padding:10px 0px; color:#fff;  position:relative;}
ul.navi_mb > li > a:hover {color:#fff; }
ul.navi_mb > li > a .plus			{position:absolute; top:50%; right:0; transform: translateY(-50%); color:rgba(255,255,255,0.2); font-size:12px; display: none;}
ul.navi_mb > li > a.on			{color:#fd9104; font-weight:800;}
ul.navi_mb > li > a.on .plus	{color:#fff; }
ul.navi_mb > li ul.sub2			{display: inline-block; padding:10px 0 25px 5px; font-size:0; width:100%; }
ul.navi_mb > li ul.sub2 li		{display:inline-block; vertical-align:middle; width:100%; }
ul.navi_mb > li ul.sub2 li a	{padding:7px 0; font-family: var(--neo); font-size: 14px; font-weight: 500; letter-spacing: -0.05em; width:100%; color:rgba(255,255,255,0.7); line-height:100%; display:block;}
ul.navi_mb > li ul.sub2 li a:before	{content:"ㆍ ";}

ul.navi_mb > li ul.sub2 li a.on2		{color:#fd9104;}

ul.navi_mb > li ul.sub3			{float:left; padding:10px 0 15px 0; font-size:0; width:100%; border-bottom:1px dashed #eeeeee;}
ul.navi_mb > li ul.sub3 li		{display:inline-block; vertical-align:middle; width:100%; }
ul.navi_mb > li ul.sub3 li a	{padding:5px 15px 5px 40px; font-size:11px; width:100%; color:rgba(255,255,255,0.7); display:block;background:white; border-bottom:0; }
ul.navi_mb > li ul.sub3 li:last-child a	{border-bottom:0; }
ul.navi_mb > li ul.sub3 li a:before	{content:"- ";}
ul.navi_mb > li ul.sub3 li a:hover	{background:#ffffff; color:#fff; }
ul.navi_mb > li ul.sub3 li a.on3		{color:#fd9104;}

ul.navi_mb > li ul.sub4			{float:left; padding:5px 0 10px 0; font-size:0; width:100%; }
ul.navi_mb > li:last-child ul.sub4			{padding-bottom:0;}
ul.navi_mb > li ul.sub4 li		{display:inline-block; vertical-align:middle; width:100%; }
ul.navi_mb > li ul.sub4 li a	{padding:5px 15px 5px 45px; font-size:11px; width:100%; color:rgba(255,255,255,0.7); display:block;background:white; border-bottom:0; }
ul.navi_mb > li ul.sub4 li:last-child a	{border-bottom:0; }
ul.navi_mb > li ul.sub4 li a:before	{content:"";}
ul.navi_mb > li ul.sub4 li a:hover	{background:#ffffff; color:#fff; }
ul.navi_mb > li ul.sub4 li a.on4		{color:#fd9104;}

@media screen and (max-width: 650px){
	ul.navi_mb > li > a			{font-size: 14px; padding:7px 0px;}
	ul.navi_mb > li ul.sub2			{padding:5px 0 20px 5px;}
	ul.navi_mb > li ul.sub2 li a	{padding:5px 0; font-size: 12px;}
}

/* mask */
.side_mask {width: 100%; height: 100%; position: fixed; top: 0;  left: 0; background: rgba(0,0,0,0.95); visibility: hidden; opacity: 0; transition: all .3s; z-index:1001;}
.side_mask.show {opacity: 1; visibility: visible; }
.side_mask > i {position:absolute; top:25px; right:25px; transform:translateX(-100%); color:#fff; font-size:22px; transition:all .3s;}
.side_mask.show > i { transform:translateX(0);}


.side_box .poster_thum {position:relative !important; bottom:initial !important; right:initial !important; width:100%; z-index:1 !important; padding:0 35px;}
.side_box .poster_thum img {width:100%; border-radius:7px;}
