@CHARSET "UTF-8";
body {
	background: #f2e1cc;
	width: 100%;
	height: 100%;
	min-width: auto;
}
/* common */
.login_wrap {
	position: relative;
	height: calc(100% - 60px);
	display:flex;
	align-items:center;
	overflow-x:hidden;
	width: 100%;
}
.login {
	height: 760px;
	width: 1400px;
	border-radius: 30px;
	box-shadow: 10px 10px 8px 5px rgba(154, 131, 100, 0.1);
	overflow:hidden;
	background: url(../images/login_img.png) no-repeat left 50%;
	position: relative;
	margin: 0 auto;
}
.copyright {
	width: 100%;
	height: 60px;
	position: relative;
	text-align:center;
	bottom:0;
}
.login h1 {
	position: absolute;
	left: 50px;
	top: 50px;
	color: #383e4b;
	font-family:"GmarketSansMedium";
	font-size: 32px;
	line-height: 40px;
}
.login h1:after{
	content:"";
	position: absolute;
	width: 98px;
	height: 79px;
	background:url(../images/login_woman.png) no-repeat;
	left:570px;
	 top: 30px;
	 animation: woman 7s linear infinite;
}
.copyright h2 {
	display:inline;
	padding-right: 30px;
}
.login_box {
	width: 50%;
	float:right;
	height: 100%;
	font-family: 'Noto Sans KR', sans-serif;
	font-size: 18px;
	background: #fff;
	display:flex;
	overflow-x:hidden;
}
.login_form {
	width: 420px;
	height:480px;
	align-self: center;
	margin: 0 auto;
}
.login_box h2 {
	color: #383e4b;
	font-size: 36px;
	height: 90px;
}
.login_box input {
	width: 100%;
}
.login_box input[type="text"], .login_box input[type="password"] {
	height: 50px;
	line-height: 40px;
	border-radius: 3px;
	border: 1px solid #e4e8ea;
	margin: 16px 0 42px 0;
	padding: 0 15px;
	font-weight:300;
	font-size: 16px;
}
.login_box input[type="text"] {
	background:#f8fafb url(../images/icon_id.png) no-repeat 98% 50%;
}
.login_box input[type="password"] {
	background:#f8fafb url(../images/icon_pw.png) no-repeat 98% 50%;
}
 .login_box input::placeholder {
 color: #7c8594;
}
.login_box label {
	text-align:left;
	width: 100%;
	display:inline-block;
	font-family: 'Noto Sans KR', sans-serif;
	font-weight:300;
	font-size: 18px;
}
.login_box .btn_login {
	background: #1761fd;
	color: #fff;
	border-radius: 3px;
	height: 50px;
	border: none;
	font-size: 18px;
	cursor: pointer;
}
.login_box p {
	font-size: 15px;
	font-weight:300;
	margin-top: 20px;
}
@keyframes woman {
   0% {-webkit-transform: translate(0,0);transform: translate(0,0)}
   70% {-webkit-transform: translate(20px,40px);transform: translate(20px,40px)}
   100% {-webkit-transform: translate(0,0);transform: translate(0,0)}
}
 @media screen and (max-width: 1240px) {
 .login {
width: 90%;
height: 600px;
background-size: 550px 600px;
}
}
 @media screen and (max-width: 1024px) {
 .login_wrap h2 {
 font-size: 26px;
 line-height: 90px;
}
.login_form {
 width: 330px;
 height: auto;
}
.login_wrap {
 height: 100vh;
}
.login h1:after{
	left:15%;
}
 .login_box {
 width: 70%;
}
 .copyright {
 display:none;
}
}
@media screen and (max-width: 896px) {
	/* mobile */
.login_wrap {
 align-items:flex-start ;
 margin: 30px 0;
}
.login h1:after{
	left:20%;
}
}
@media screen and (max-width: 768px) {

 .login_box {
 width: 70%;
}
.login h1:after{
	display:none;
}
}
 @media screen and (max-width: 414px) {
	  body {
background: #fff;
}

 .login {
 min-height: 600px;
padding: 40px 0;
background: #fff;
box-shadow:none;
width: 100%;
}
.login_box {
 width: 100%;
 clear:both;
 height: 450px;
}
.login_box input[type="text"], .login_box input[type="password"] {
    margin: 10px 0 20px 0;
 
}
 .login_form {
 width: 300px;
}
.login_wrap h2 {
 font-size: 24px;
 line-height: 90px;
}
.login_wrap h1 {
 width: 100%;
 text-align:center;
 position: relative;
 left: 0;
 top: 0;
 border-bottom: 1px solid #999;
 padding-bottom: 20px;
}
.login_wrap h2, .login_box p {
 text-align:center;
}
}
@media screen and (max-width: 375px) {



}