/*우측메뉴바===============================================================*/
.rightMenu {position: fixed; right: -25%; top: 0; width: 25%; height: 100vh; background: #000f69; z-index: 999;-webkit-transition: right 0.4s; -moz-transition: right 0.4s; -ms-transition: right 0.4s; -o-transition: right 0.4s; transition: right 0.4s;}
.rightMenu.open {right: 0;}
.rightMenu.open .menuBar {display: none;}
.rightMenu.open .closeTab  {display: block;}
.rightMenu .menuBar {width: 70px; height: 100%; position: absolute; left: -70px; top: 0; background: #000f69; border-left: 1px solid rgba(0,0,0,0.1);}
.rightMenu .closeTab {position: absolute; display: none; left: -70px; top: 100px; width: 70px; height: 70px; background: #000f69;}
.rightMenu button.close_menu {width: 100%; height: 100%; background: none; border: none; color:#fff;}
.rightMenu button.close_menu img {display: block; margin: 5px auto;}
.rightMenu button.close_menu:hover {background: #fd8204;}
.rightMenu button.open_menu {width: 100%; margin: 35px 0; text-align: center; border: none; background: none;}
.rightMenu .bar_login a {display: block; width: 100%; padding: 20px 0; text-align: center;}

.mainBoby .rightMenu .menuBar {width: 70px; height: 100%; position: absolute; left: -70px; top: 0; background: rgba(0,15,105,0.15); border-left: 1px solid rgba(255,255,255,0.5);}
.mainBoby.fp-viewing-1 .rightMenu .menuBar,.mainBoby.fp-viewing-2 .rightMenu .menuBar {
	width: 70px; height: 70px; left: -70px; border-bottom: 1px solid rgba(255,255,255,0.5);
}
.mainBoby.fp-viewing-1 .rightMenu button.open_menu,.mainBoby.fp-viewing-2 .rightMenu button.open_menu {margin: 22px 0;}
.mainBoby.fp-viewing-1 .rightMenu .bar_login,.mainBoby.fp-viewing-2 .rightMenu .bar_login {display: none;}

.menuCon {float: left; width: 100%; height: 100%; padding: 30px 30px 30px 70px;}
.menuCon .con_login {width: 100%; text-align: right; overflow: hidden;}
.menuCon .con_login a {display: inline-block; padding: 8px 25px; background: #0d1b71;}
.menuCon .con_login a:first-child {margin-right: 5px;}
.menuCon .con_login a:hover {background: #fd8204;}
.menuCon .category {font-family: 'Montserrat', sans-serif; color:#fff; font-weight: 300; font-size: 36px; margin-top: 40px;}


nav {margin-top: 50px; height: calc(100% - 220px); overflow: hidden; overflow-y: auto; }
nav::-webkit-scrollbar {width: 5px;}
nav::-webkit-scrollbar-thumb {background: #707580; width: 5px; border-radius: 20px;}
nav::-webkit-scrollbar-track {background: #ddd; border-radius: 20px;}
nav .gnb {height: 100%;}
nav .gnb > li {margin-bottom: 35px; padding-left: 10px; -ms-word-break: keep-all; word-break: keep-all;}
nav .gnb > li:last-child {margin-bottom: 0;}
nav .gnb > li > a {position: relative; display: block; padding-left: 30px; font-size: 20px; font-weight: 500; color: #7e90ff}
nav .gnb > li > a span.aBar {position: absolute; left: 0; top:50%; transform:translate(-50%); display: block; width: 20px; height: 3px; background: #333f87; -webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: lal 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;}
nav .gnb > li > a span.aBar1 {z-index: 1;}
nav .gnb > li > a span.aBar2 {transform:translate(-50%) rotate(90deg);}
nav .gnb > li:hover > a {color:#fff;}
nav .gnb > li:hover > a span.aBar {background: #fff;}

nav .gnb > li > ul.subMenu {display: none; padding: 20px 0 20px 50px;}
nav .gnb > li > ul.subMenu > li {position: relative; margin-bottom: 10px; padding-left: 15px;}
nav .gnb > li > ul.subMenu > li:last-child {margin-bottom: 0;}
nav .gnb > li > ul.subMenu > li::before {position: absolute; left: 0; top: 10px; display: block; content: ''; width: 5px; height: 5px; background: #fff; border-radius: 50%;}
nav .gnb > li > ul.subMenu > li > a {font-size: 18px; color:#fff;}
nav .gnb > li > ul.subMenu > li:hover > a {color:#fd8204}

nav .gnb > li.active > a {color: #fff}
nav .gnb > li.active > a > i {color:#fff;}
nav .gnb > li.active > a span.aBar1 {background: #fff;}
nav .gnb > li.active > a span.aBar2 {opacity: 0;}
nav .gnb > li.active > ul.subMenu > li.active > a {color:#fd8204}

@media (max-width: 1600px) {
	.menuCon {padding: 30px 30px 30px 50px;}
}

@media (max-width: 1400px) {
	.rightMenu {width: 30%; right:-30%;}
	.menuCon {padding: 30px 15px 30px 50px;}
}
@media (max-width: 1180px) {
	/* .rightMenu {width: 40%; right: -40%;} */
	.mainBoby .rightMenu .menuBar {width: 60px; left: -60px; }
	.rightMenu .menuBar {width: 60px; height: 100%; position: absolute; left: -60px; top: 0; background: rgba(0,15,105,0.15); border-left: 1px solid rgba(255,255,255,0.5);}
	
}
@media (max-width: 1024px) {
	.rightMenu {width: 50%; right: -50%;}
	.menuCon {padding: 30px 15px 30px 50px;}
}
@media (max-width: 890px) {

	.mainBoby .rightMenu .menuBar {width: 70px; height: 70px; left: -70px; border-bottom: 1px solid rgba(255,255,255,0.5);}
	.rightMenu .menuBar {width:70px; height: 70px; left: -70px; border-bottom: 1px solid rgba(255,255,255,0.5); background: #000f69;}
	.rightMenu button.open_menu {margin: 22px 0 !important;}
	.mainBoby.fp-viewing-0 .rightMenu .menuBar {background: none; border: none;}
	.rightMenu .bar_login {display: none;}
	.rightMenu .closeTab {left: -70px; top: 0; width: 70px; height: 70px;}
}
@media (max-width: 640px) {
	/* .rightMenu {width: 60%; right: 0;} */
	.menuCon {padding: 30px 15px 30px 30px;}
	.menuCon .con_login a {padding: 5px 15px;}
	.menuCon .category {margin-top: 30px; font-size: 30px;}
	nav {margin-top: 40px;  height: calc(100% - 200px);}
	nav .gnb > li > a {font-size: 18px;}
	nav .gnb > li > a span.aBar {width: 15px; height: 3px; }
	nav .gnb > li > a span.aBar2 {transform:translate(-50%) rotate(90deg);}
	nav .gnb > li > ul.subMenu > li > a {font-size: 16px;}
	nav .gnb > li > ul.subMenu {display: none; padding: 20px 0 20px 30px;}
}
@media (max-width: 560px) {
	.rightMenu {width: 80%; right: -80%;}
	.menuCon {padding: 30px 15px 30px 50px;}
}

@media (max-width: 380px) {
	.menuCon {padding: 30px 15px 30px 30px;}
}