@media screen and (max-width: 1280px){
	#container-wrap .gnbArea{
		width:250px;
		position:fixed;
		background:#1d1f27;
		display:block;
		height:100%;
		z-index:1;
	}
	
	
	#container-wrap .hide{
		display:none;
	}
	
	
	#container-wrap .gnbArea .logo{
		width:135px;
		margin:0 auto;
		padding:30px 0px;
	}
	
	#container-wrap .gnbArea .logo img{
		width:100%;
	}
	
	
	#container-wrap .menu{
		width:100%;
		padding:0px 20px;
		box-sizing:border-box;
	}
	
	#container-wrap .menu dd{
		width:100%;
		border-bottom:1px solid #2d3037;
		padding:20px 10px;
		box-sizing:border-box;
		display:inline-block;
		position:relative;
	}
	
	
	#container-wrap .menu dd:first-child{
		border-top:1px solid #2d3037;
	}
	
	#container-wrap .menu dd .ico{
		width:21px;
		display:inline-block;
		vertical-align:middle;
		opacity:0.3;
	}
	
	#container-wrap .menu dd .ico img{
		width:100% ;
	}
	
	#container-wrap .menu dd .text{
		display:inline-block;
		vertical-align:middle;
		color:#505560;
		margin-left:10px;
		font-size:16px;
	}
	
	#container-wrap .menu dd .arrow{
		display:inline-block;
		float:right;
	}
	
	#container-wrap .menu dd .arrowUP{
		display:none;
	}
	
	#container-wrap .menu dd .subMenuArea{
		display:none;
	}
	
	
	
	#container-wrap .menu .on .ico{
		opacity:1
	}
	
	#container-wrap .menu .on .text{
		color:#fff;
	}
	
	
	#container-wrap .menu .on .arrowUP{
		display:inline-block;
	}
	
	#container-wrap .menu .on .arrowDown{
		display:none;
	}
	
	#container-wrap .menu .on .subMenuArea{
		display:block;
	}
	
	#container-wrap .menu dd .subMenuArea{
		width:250px;
		background:#272a33;
		margin-left:-30px;
		margin-top:20px;
		padding:15px 60px;
		position:relative;
	}
	
	
	#container-wrap .menu dd .subMenuArea .subMenu li{
		font-size:15px;
		color:#c1c1c1;
		margin:10px 0px;
		
	}
	
	#container-wrap .menu dd .subMenuArea .subMenu li a{
		color:#c1c1c1;
	}
	
	
	#container-wrap .menu dd .subMenuArea .subMenu li::before{
		content:' ';
		width:8px;
		height:8px;
		border:1px solid #c1c1c1;
		display:inline-block;
		margin-right:10px;
		border-radius:100%;
		background:#272a33;
		position:relative;
		z-index:1;
	}
	
	
	#container-wrap .menu dd .subMenuArea .subMenu .on2::before{
		content:'';
		background:#3e60dd;
		border:0px solid #c1c1c1;
	}
	
	#container-wrap .menu dd .subMenuArea .subMenu .on2 a{
		color:#3e60dd
		
	}
	
	#container-wrap .menu dd .subMenuArea .line{
		width:1px;
		height:100%;
		background:#c1c1c1;
		display:block;
		left:63.5px;
		position:absolute;
		top:0;
	}
	
	
	#container-wrap .threeM{
		width:210px;
		padding:15px 0px;
		background:#3e60dd;
		color:#fff;
		text-align:Center;
		margin:20px auto 0;
		font-size:16px;
		color:#fff;
	}
	
	
	#container-wrap .threeM a{
		color:#fff;
	}
	
	
	
	
	
	
	
	#container-wrap .comInfo{
		position:absolute;
		bottom:20px;
		right:20px;
		width:210px;
	}
	
	
	
	
	
	#container-wrap .comInfo .company{
		width:100%;
		border-bottom:1px solid #c1c1c1;
		padding-bottom:10px;
		font-size:15px;
		color:#c1c1c1;
	}
	
	
	#container-wrap .comInfo .infoList{
		width:100%;
	}
	
	#container-wrap .comInfo .infoList li{
		width:100%;
		font-size:13px;
		color:#999;
		margin-top:5px;
		font-family:'roboto','noto sans kr'
		
	}
	
	
	
	#container-wrap .top{
		width:100%;
		background:#fff;
		box-shadow:10px 10px 10px #e5e5e5;
		padding:15px 30px;
		box-sizing:border-box;
		display:inline-block;
	}
	
	
	#container-wrap .top .menuIco{
		width:40px;
		display:inline-block;
		vertical-align:middle;
		margin-top:10px;
	}
	
	#container-wrap .top .menuIco img{
		width:100%;
	}
	
	#container-wrap .top .memberInfo{
		display:inline-block;
		float:right;
	}
	
	#container-wrap .top .memberInfo .memMenu{
		display:inline-block;
		vertical-align:middle;
		margin-right:20px;
	}
	
	#container-wrap .top .memberInfo .memMenu li{
		display:inline-block;
		width:30px;
		margin-left:10px;
		position:Relative;
	}
	#container-wrap .top .memberInfo .memMenu li .dot{
		width:10px;
		height:10px;
		background:#466eff;
		border-radius:100%;
		position:absolute;
		right:3px;
	}
	
	
	#container-wrap .top .memberInfo .infoArea{
		display:inline-block;
		vertical-align:middle
	}
	
	
	#container-wrap .top .memberInfo .infoArea .info{
		display:inline-block;
		vertical-align:middle
	}
	
	#container-wrap .top .memberInfo .infoArea .info .name{
		font-size:15px;
		color:#222;
		font-weight:500;
	}
	
	#container-wrap .top .memberInfo .infoArea .info .group{
		font-size:13px;
		color:#858585;
	}
	
	
	#container-wrap .top .memberInfo .infoArea .profile{
		display:inline-block;
		width:50px;
		height:50px;
		border-radius:100%;
		overflow:hidden;
		vertical-align:middle;
		margin-left:10px;
	}
	
	
	
	
	#container-wrap .top .infoDrop{
		width:264px;
		background:#1d1f27;
		position:absolute;
		right:0;
		top:80px;
	}
	
	
	
	
	#container-wrap .top .infoDrop{
		width:264px;
		background:#1d1f27;
		position:absolute;
		right:0;
		top:80px;
		padding:20px;
		box-sizing:border-box;
	}
	
	
	#container-wrap .top .infoDrop .infoDropList{
		width:100%;
	}
	
	
	#container-wrap .top .infoDrop .infoDropList li{
		width:100%;
		margin-top:10px;
	}
	
	#container-wrap .top .infoDrop .infoDropList li:first-child{
		margin-top:0px;
	}
	
	#container-wrap .top .infoDrop .infoDropList li .subj{
		font-size:15px;
		color:#919399;
		display:inline-block;
		width:28%;
		font-family:'roboto','noto sans kr';
	}
	#container-wrap .top .infoDrop .infoDropList li .subs{
		font-size:15px;
		color:#ffffff;
		display:inline-block;
		width:70%;
		font-family:'roboto','noto sans kr';
	}
	
	
	#container-wrap .top .infoDrop .infoDropList li .subs .chgBTN{
		display:inline-block;
		padding:3px 10px;
		border:1px solid #436bff;
		color:#436bff;
		border-radius:50px;
	}
	
	
	#container-wrap .top .infoDrop .infoDropList li .subs .chgBTN a{
		color:#436bff;
	}
	
	
	
	
	#container-wrap .top .infoDrop .logout{
		width:100%;
		margin-top:20px;
		padding-top:20px;
		border-top:1px solid #444;
		display:inline-block;
		
	}
	
	#container-wrap .top .infoDrop .logout .text{
		font-size:14px;
		color:#fff;
		display:inline-block;
		
	}
	
	#container-wrap .top .infoDrop .logout .ico{
		display:inline-block;
		width:16px;
		float:right;
	}
	
	#container-wrap .top .infoDrop .logout .ico img{
		width:100%;
	}



}

@media screen and (max-width: 767px){
	#container-wrap .gnbArea{
		width:250px;
		position:fixed;
		background:#1d1f27;
		display:none;
		height:100%;
		z-index:1;
	}
	
	
	#container-wrap .hide{
		display:block;
	}
	
	
	#container-wrap .gnbArea .logo{
		width:135px;
		margin:0 auto;
		padding:30px 0px;
	}
	
	#container-wrap .gnbArea .logo img{
		width:100%;
	}
	
	
	#container-wrap .menu{
		width:100%;
		padding:0px 20px;
		box-sizing:border-box;
	}
	
	#container-wrap .menu dd{
		width:100%;
		border-bottom:1px solid #2d3037;
		padding:20px 10px;
		box-sizing:border-box;
		display:inline-block;
		position:relative;
	}
	
	
	#container-wrap .menu dd:first-child{
		border-top:1px solid #2d3037;
	}
	
	#container-wrap .menu dd .ico{
		width:21px;
		display:inline-block;
		vertical-align:middle;
		opacity:0.3;
	}
	
	#container-wrap .menu dd .ico img{
		width:100% ;
	}
	
	#container-wrap .menu dd .text{
		display:inline-block;
		vertical-align:middle;
		color:#505560;
		margin-left:10px;
		font-size:16px;
	}
	
	#container-wrap .menu dd .arrow{
		display:inline-block;
		float:right;
	}
	
	#container-wrap .menu dd .arrowUP{
		display:none;
	}
	
	#container-wrap .menu dd .subMenuArea{
		display:none;
	}
	
	
	
	#container-wrap .menu .on .ico{
		opacity:1
	}
	
	#container-wrap .menu .on .text{
		color:#fff;
	}
	
	
	#container-wrap .menu .on .arrowUP{
		display:inline-block;
	}
	
	#container-wrap .menu .on .arrowDown{
		display:none;
	}
	
	#container-wrap .menu .on .subMenuArea{
		display:block;
	}
	
	#container-wrap .menu dd .subMenuArea{
		width:250px;
		background:#272a33;
		margin-left:-30px;
		margin-top:20px;
		padding:15px 60px;
		position:relative;
	}
	
	
	#container-wrap .menu dd .subMenuArea .subMenu li{
		font-size:15px;
		color:#c1c1c1;
		margin:10px 0px;
		
	}
	
	#container-wrap .menu dd .subMenuArea .subMenu li a{
		color:#c1c1c1;
	}
	
	
	#container-wrap .menu dd .subMenuArea .subMenu li::before{
		content:' ';
		width:8px;
		height:8px;
		border:1px solid #c1c1c1;
		display:inline-block;
		margin-right:10px;
		border-radius:100%;
		background:#272a33;
		position:relative;
		z-index:1;
	}
	
	
	#container-wrap .menu dd .subMenuArea .subMenu .on2::before{
		content:'';
		background:#3e60dd;
		border:0px solid #c1c1c1;
	}
	
	#container-wrap .menu dd .subMenuArea .subMenu .on2 a{
		color:#3e60dd
		
	}
	
	#container-wrap .menu dd .subMenuArea .line{
		width:1px;
		height:100%;
		background:#c1c1c1;
		display:block;
		left:63.5px;
		position:absolute;
		top:0;
	}
	
	
	#container-wrap .threeM{
		width:210px;
		padding:15px 0px;
		background:#3e60dd;
		color:#fff;
		text-align:Center;
		margin:20px auto 0;
		font-size:16px;
		color:#fff;
	}
	
	
	#container-wrap .threeM a{
		color:#fff;
	}
	
	
	
	
	
	
	
	#container-wrap .comInfo{
		position:absolute;
		bottom:20px;
		right:20px;
		width:210px;
	}
	
	
	
	
	
	#container-wrap .comInfo .company{
		width:100%;
		border-bottom:1px solid #c1c1c1;
		padding-bottom:10px;
		font-size:15px;
		color:#c1c1c1;
	}
	
	
	#container-wrap .comInfo .infoList{
		width:100%;
	}
	
	#container-wrap .comInfo .infoList li{
		width:100%;
		font-size:13px;
		color:#999;
		margin-top:5px;
		font-family:'roboto','noto sans kr'
		
	}
	
	
	
	#container-wrap .top{
		width:100%;
		background:#fff;
		box-shadow:10px 10px 10px #e5e5e5;
		padding:15px 3%;
		box-sizing:border-box;
		display:inline-block;
	}
	
	
	#container-wrap .top .menuIco{
		width:30px;
		display:inline-block;
		vertical-align:middle;
		margin-top:10px;
	}
	
	#container-wrap .top .menuIco img{
		width:100%;
	}
	
	#container-wrap .top .memberInfo{
		display:inline-block;
		float:right;
	}
	
	#container-wrap .top .memberInfo .memMenu{
		display:inline-block;
		vertical-align:middle;
		margin-right:20px;
	}
	
	#container-wrap .top .memberInfo .memMenu li{
		display:inline-block;
		width:20px;
		margin-left:10px;
		position:Relative;
	}
	#container-wrap .top .memberInfo .memMenu li .dot{
		width:10px;
		height:10px;
		background:#466eff;
		border-radius:100%;
		position:absolute;
		right:3px;
	}
	
	
	#container-wrap .top .memberInfo .infoArea{
		display:inline-block;
		vertical-align:middle
	}
	
	
	#container-wrap .top .memberInfo .infoArea .info{
		display:none;
	}
	
	#container-wrap .top .memberInfo .infoArea .info .name{
		font-size:15px;
		color:#222;
		font-weight:500;
	}
	
	#container-wrap .top .memberInfo .infoArea .info .group{
		font-size:13px;
		color:#858585;
	}
	
	
	#container-wrap .top .memberInfo .infoArea .profile{
		display:inline-block;
		width:50px;
		height:50px;
		border-radius:100%;
		overflow:hidden;
		vertical-align:middle;
		margin-left:10px;
	}
	
	
	
	
	#container-wrap .top .infoDrop{
		width:264px;
		background:#1d1f27;
		position:absolute;
		right:0;
		top:80px;
	}
	
	
	
	
	#container-wrap .top .infoDrop{
		width:264px;
		background:#1d1f27;
		position:absolute;
		right:0;
		top:80px;
		padding:20px;
		box-sizing:border-box;
	}
	
	
	#container-wrap .top .infoDrop .infoDropList{
		width:100%;
	}
	
	
	#container-wrap .top .infoDrop .infoDropList li{
		width:100%;
		margin-top:10px;
	}
	
	#container-wrap .top .infoDrop .infoDropList li:first-child{
		margin-top:0px;
	}
	
	#container-wrap .top .infoDrop .infoDropList li .subj{
		font-size:15px;
		color:#919399;
		display:inline-block;
		width:28%;
		font-family:'roboto','noto sans kr';
	}
	#container-wrap .top .infoDrop .infoDropList li .subs{
		font-size:15px;
		color:#ffffff;
		display:inline-block;
		width:70%;
		font-family:'roboto','noto sans kr';
	}
	
	
	#container-wrap .top .infoDrop .infoDropList li .subs .chgBTN{
		display:inline-block;
		padding:3px 10px;
		border:1px solid #436bff;
		color:#436bff;
		border-radius:50px;
	}
	
	
	#container-wrap .top .infoDrop .infoDropList li .subs .chgBTN a{
		color:#436bff;
	}
	
	
	
	
	#container-wrap .top .infoDrop .logout{
		width:100%;
		margin-top:20px;
		padding-top:20px;
		border-top:1px solid #444;
		display:inline-block;
		
	}
	
	#container-wrap .top .infoDrop .logout .text{
		font-size:14px;
		color:#fff;
		display:inline-block;
		
	}
	
	#container-wrap .top .infoDrop .logout .ico{
		display:inline-block;
		width:16px;
		float:right;
	}
	
	#container-wrap .top .infoDrop .logout .ico img{
		width:100%;
	}



}