﻿@charset "utf-8";
/*-------------------------------------------------
Style Sheet
Version : 1.0
Author :  ������
Create date : 2022. 08. 18.
-------------------------------------------------*/

/* layout */
body{
	width:100%;
	height:100vh;
	position: relative;
	/* overflow: hidden; */
	background:url(../Images/loginPg_bg.jpg) top center no-repeat;
}


.form-conbox{
	width:100%;
	margin:auto;
	box-sizing: border-box;
}

.width50{
	width:50%;
	float:left;
	box-sizing: border-box;
}


.form-conbox h1{
	width:100%;
	text-align: center;
	margin-bottom:40px;
}

.form-conbox input{
	width:100%;
	border-radius: 5px;
	height: 50px;
	box-sizing: border-box;
	border:2px solid #dcdcdc;
	margin-bottom:20px;
	padding: 18px 20px;
}

.form-conbox input:focus{
	outline:none;
	border:2px solid #125ce6;
	color:#125ce6;
}

.form-conbox input:focus::placeholder{
	color:#125ce6
}

.form-conbox .btn{
	width:100%;
	border-radius: 20px 0px 20px 20px;
	height:50px;
	box-sizing: border-box;
	padding:16px 0;
	color:#fff
}

/* ?loginPg */

.login-conbox{
	padding-top:100px;
	max-width:1000px;
}

.pw-find{
	width:100%;
	text-align: center;
	line-height:1.5;
	margin-bottom:30px;
}

.pw-find button{
	vertical-align: baseline;
	border-bottom:2px solid #125ce6;
	color:#125ce6;
	margin-left:5px;
	font-weight: 700;
}


.login-conbox .right-con{
	padding-left:100px;
}

.signInBtn{
	background: linear-gradient( 35deg, #4383f0, #789eee);
}

.login-conbox .left-con img{
	width:100%;
}

/* findPw-conbox */

.findPw-conbox{
	max-width: 840px;
	padding-top:100px;
}

.findPw-conbox .left-con{
	padding-right:25px;
}

.findPw-conbox .right-con{
	padding-left:25px;
}

.tempPwBtn{
	background: linear-gradient( 35deg, #7329d8, #506eea);
}

.pwChangeBtn{
	background: linear-gradient( 35deg, #1fbe9d , #24bdcd);
}

.noticeTxt{
	margin-bottom:10px;
}
.noticeTxt img{
	float: left;
	margin-right:5px;
	margin-top:5px;
}

.noticeTxt span{
	line-height:1;
}

@media (max-width:1000px){
	.login-conbox{
		padding:100px 50px 0 50px;
	}
	.right-con{
		padding-left:50px;
	}
}


@media (max-width:940px){
	.login-conbox{
		width:400px;
		padding:100px 0 0 0;
	}
	.login-conbox .left-con{
		display: none;
	}
	.login-conbox .right-con{
		width:100%;
		padding:0 20px;
	}
}

@media (max-width:840px){
	.findPw-conbox{
		padding:100px 20px 0 20px;
	}
	.findPw-conbox .left-con{
		padding-right:10px;
	}
	.findPw-conbox .right-con{
		padding-left:10px;
	}
}

@media (max-width:650px){
	body{
		background:#f5faff;
	}
	.findPw-conbox{
		padding-top:100px;
	}
	.findPw-conbox .width50{
		width:100%;
		padding:0px;
		margin-bottom:30px;
	}
	.findPw-conbox .width50 > div{
		max-width:400px;
		margin:auto
	}
}

@media (max-width:400px){
	body{
		display: table;
	}

	.login-conbox, .findPw-conbox{
		width:100%;
		display: table-cell;
		vertical-align: middle;
		padding-top:0px;
	}
}