@charset "utf-8";
/*-------------------------------------------------
Author : SY,CHo
Create date : 2018. 09. 04. 모바일 리뉴얼
-------------------------------------------------*/
html {min-width: 320px; font-size: 10px;}
*, *:before, *:after {box-sizing: border-box;}
body { line-height: 1.25; font-family: 'NotoR', '맑은 고딕', 'Malgun Gothic', '돋움', 'Dotum', '굴림', 'Gulim', AppleGothic, UnDotum, Arial, Tahoma, Verdana, sans-serif; font-size: 1.6rem; color: #333; letter-spacing: -0.05em;}
a {color: inherit;}

#wrap {width: 100%;}
#header {width: 100%; height: 50px; text-align: center; background-color: #fff;}
#header h1 {line-height: 50px;}
#header h1 img {height: 20px;}
#header .allmenu-open {position: absolute; top: 16px; left: 20px; display: inline-block; width: 25px; height: 20px; line-height: 0; overflow: hidden;}
#header .allmenu-open span {float: left; display: inline-block; width: 100%; height: 4px; background-color: #75777b; border-radius: 2px;}
#header .allmenu-open .line2-1,
#header .allmenu-open .line2-2 {margin: 4px 0;}
#header .allmenu-open .line2-1 {margin-left: 2px; width: 4px; background-color: #fc671a;}
#header .allmenu-open .line2-2 {margin-left: 3px; width: 15px;}
#header .search-open {position: absolute; top: 10px; right: 20px; display: inline-block; width: 30px; height: 30px; overflow: hidden;}
#header .search-open:before {width: 100%; line-height: 1; font-family: 'xeicon'; font-size: 30px; color: #75777b; content: "\e97a";}

#header .total_search {position: absolute; top: 0; left: 0; display: none; width: 100%; height: 50px; line-height: 30px; padding: 10px; background: #fd971d; overflow: hidden;}
#header .total_search .float_left {float: left; display: inline-block; width: calc(100% - 60px); background: #fff; border: solid 1px #f05e22; overflow: hidden;}
#header .total_search input[type="search"] {float: left; padding: 5px; width: calc(100% - 50px); height: 30px; border: none;}
#header .total_search input[type="button"] {float: right; padding: 0; width: 40px; height: 30px; color: transparent; background: url(../../images/mps/common/btn_search.png) no-repeat center; background-size: 21px 20px; border-color: transparent;}
#header .total_search .btn_search_close {float: right; width: 50px; height: 30px; color: #fff; font-weight: bold; letter-spacing: -1px; background: #f05e22;}

.allmenu-box {position: fixed; top: 0;left: -100%; width: 270px; height: 100%; text-align: left;  background-color: #fff;transition: all .3s ease; z-index: 10;}
.allmenu-box:before {position: fixed; top: 0; left: -200%; width: 100%; height: 100%; background-color: rgba(51,51,51,0.9); content: ""; z-index: 9;}
.allmenu-box.active {z-index: 100;}
.allmenu-box.active, .allmenu-box.active:before {left: 0;}

.allmenu-header {position: relative; padding: 15px; height: 50px; line-height: 50px; background-color: #fc671a; z-index: 12;}
.allmenu-header a {position: relative; float: left; display: inline-block; width: 20px; height: 20px; line-height: 20px; vertical-align: middle; color: #fff;}
.allmenu-header a:before {position: absolute; top: 0; left: 0; font-family: 'xeicon'; font-size: 20px;}
.allmenu-header .btn-close:before {content: "\e908";}
.allmenu-header .btn-home {margin-left: 10px;}
.allmenu-header .btn-home:before {content: "\e902";}
.allmenu-header .btn-login {float: right; padding-left: 25px; width: auto;}
.allmenu-header .btn-login:before {content: "\e967";}

.nav-event {position: relative; padding: 15px; width: 100%; font-family: 'NotoM'; color: #fff; background: url(../../images/mps/layout/allmenu-bg.jpg) no-repeat 0 0; background-size: cover; z-index: 12;}
.nav-category {position: relative; float: left; width: 100px; height: 100%; background-color: #eff2f5; z-index: 12;}
.nav-category:after {clear: both; display: block; content: "";}
.nav-category ul {position: absolute; top: 0; left: 0; width: 100%; overflow: hidden;}
.nav-category ul > li {display: block; width: 100%;}
.nav-category ul > li > a {display: block; padding: 0 15px; width: 100%; height: 45px; line-height: 45px; color: #333;}
.nav-category ul > li > a.active {font-family: 'NotoM'; color: #fff; background-color: #555;}

.allmenu-list {position: relative; float: right; padding: 0 20px 600px; width: 170px; height: 100%; background-color: #fff; overflow-x: hidden; overflow-y: scroll; z-index: 11;}
.allmenu-list::-webkit-scrollbar {width: 0;}
.allmenu-list h2 {margin-bottom: 10px; line-height: 45px; font-family: 'NotoM'; font-weight: normal; font-size: 1.6rem; color: #fc671a; border-bottom: 1px solid #fc671a;}
.allmenu-list h2.active {color: #000;}
.allmenu-list .depth2 {line-height: 30px;}
.allmenu-list .depth2 li a {display: block; height: 30px; overflow: hidden;}
.allmenu-list .depth3 {display: none; margin-left: 10px; font-size: 1.4rem; color: #778899;}

.allmenu-box.active .allmenu-close {position: absolute;top: 0; left: 270px;width: 100%;height: 100%;z-index: 15;}
.allmenu-close button {
	display: inline-block;
	position: absolute; 
	top: 10px;
	left: 10px; 
	width: 35px;
	height: 35px;
	background-color: #fc671a;
	border-radius: 50%;
	color: #fff;
	line-height: 35px;
	}
.allmenu-close button:after {
	position: absolute; 
	top: 0;
	 left: 0;
	width: 100%;
	text-align: center; 
	font-size: 20px; 
	font-family: 'xeicon'; 
	content: "\e921";
	}

#body {position: relative; overflow: hidden;}
#go-top {position: fixed; bottom: 20px; right: 20px; display: inline-block; width: 40px; height: 40px; line-height: 38px; text-align: center; font-size: 2rem; color: #848484; background-color: #f9f9f9; border: 1px solid #dbdbdb; opacity: 0; visibility: hidden;  transition: all .5s ease; z-index: 90;}
#body.scroll #go-top {opacity: 1; visibility: visible;}

#footer {padding: 20px 5px; text-align: center; font-size: 1.3rem; color: #b9b9b9; background-color: #3f3f3f;}
#footer ul {display: inline-block; margin: 0 auto 10px; overflow: hidden;}
#footer ul li {display: inline-block; margin-bottom: 5px;}
#footer ul li + li {position: relative; margin-left: 10px;}
#footer ul li + li:before {position: absolute; top: 2px; left: -6px; width: 1px; height: 12px; background-color: #656565; content: "";}
#footer ul li a {display: block;}
#footer ul li a strong {color: #fc8a1a;}
#footer p {color: #858585;}

/* 2018.10.15 SY,CHo 마이페이지 */
.allmenu-header .mypage {position: absolute; right: 40px; padding-left: 20px; width: 85px; white-space: nowrap;}
.allmenu-header .btn-logout {position: absolute; right: 15px;}
.allmenu-header .btn-logout:before {content: "\e966";}
.allmenu-header .mypage:before {content: "\e9f3";}

.allmenu-box.mypage .nav-category {width: 120px;}
.allmenu-box.mypage .nav-category ul > li > a {padding: 0 10px; font-size: 1.5rem;}
.allmenu-box.mypage .allmenu-list {padding: 0 10px 600px; width: 150px;}