/*#######################################*/


/*여기 부터는 반응형 스타일*/


/*#######################################*/












/*#######################################*/
@media screen and (max-width: 1920px) {


}





















/*#######################################*/
@media screen and (max-width: 1600px) {



} /*반응형 1600px 끝*/



/*#######################################*/
@media screen and (max-width: 1500px) {



} /*반응형 1500px 끝*/



/*#####################################*/
@media screen and (max-width: 1280px) {



} /*반응형 1280px 끝*/


/*#####################################*/
@media screen and (max-width: 1200px) {


} /*반응형 1280px 끝*/



/*#######################################*/
@media screen and (max-width: 1000px) {
	.login {
		padding-bottom: 200px;
	}
	.select-box > div {
		/* display: block !important; */
	}
    .select-box:has(.on) .mo-dimm{
	    display: block;
	}
	.select-box > div:not(.mo-dimm){
	border: none;
	}
	.select-box > div ul{
		z-index: 9999;
		position: fixed !important;
		bottom: 0;
		top: unset;
		left: 0 !important;
		width: 100% !important;
		max-height: 50% !important;;
		overflow-y: scroll;
		background: #fff;
		padding: 0 !important;
		border-radius: 20px 20px 0 0;
	}
	.select-box > div ul::-webkit-scrollbar-button:vertical:start:decrement,
	.select-box > div ul::-webkit-scrollbar-button:vertical:start:increment {
		display: block;
		height: 10px;
	}

	.select-box > div ul li:first-child{
		margin-top: 15px;
	}
	.select-box > div ul li a {
		padding: 0 14px;
		font-size: 15px;
		line-height: 46px;
	}

	.mo-dimm{
		/*display: block !important;*/
		position: fixed !important;
		width: 100%;
		height: 100vh;
		z-index: 998;
		background: rgba(0,0,0,0.5);
		left:0;
		top:0;
	}

} /*반응형 1000px 끝*/



/*#######################################*/
@media screen and (max-width: 800px) {




} /*반응형 800px 끝*/





/*#######################################*/
@media screen and (max-width: 700px) {

} /*반응형 700px 끝*/




/*#######################################*/
@media screen and (max-width: 600px) {

	.login {
		width:calc(100% - 32px);
		max-width: 460px;
		margin: 0 auto;
		padding-top: 68px;
		padding-bottom: 250px;
	}
	.login:not(.user-login) h2{
		font-size:26px;
	}
	main:has(section.user-login){
		background-color: #FFFFFF;
	}
	.login.user-login{
		width: calc(100% - 32px);
		padding-top: 54px;
	}

	.user-login .login-wrap{
		padding: 0;
		border-radius: 0;
	}

	.simple-footer {
		padding: 0 90px 70px;
	}

	.simple-footer ul {
		flex-wrap: wrap;
		justify-content: center;
	}

	.simple-footer ul li {
		width: 120px;
	}

	.simple-footer ul li:nth-child(3) a:after {
		display: none;
	}
	.mail-cert .cert-send strong{
		display: block !important;
		overflow: unset !important;
	}

	.mail-cert .cert-send strong{
		font-size: 16px !important;
	}

	.mail-cert .cert-send p{
		font-size: 15px !important;
		line-height: 23px;
	}
	.mail-cert .cert-send p br{
		display: inline;
	}

	.write-list {
		margin-top: 20px;
	}

	.optional-wrap {
		margin-top: 40px;
		padding-top: 0;
	}

} /*반응형 600px 끝*/




/*#######################################*/
@media screen and (max-width: 500px) {
	.login {
		padding-bottom: 330px;
	}
	.simple-footer{padding: 0 38px 70px;}
	.write-list .email{
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		row-gap: 10px;
		position: relative;
	}
   .write-list #emailNotice{
	    padding-top: 0px;
   }
	.user-login.on .input-box .ico-faq{
		font-size: 12px;
		background-size: 13px;
		padding-left: 17px;
	}
	.user-login.on .notice {
        font-size: 12px !important;
        line-height: normal;
    }
	.write-list .info, .notice{
		font-size: 12px;
	}
	/*.write-list .email:after{*/
	/*	content:"";*/
	/*	display: block;*/
	/*	width: 100%;*/
	/*	height:1px;*/
	/*	border-top: 1px dashed #e0e0e0;*/
	/*	left:0;*/
	/*	bottom:-110px;*/
	/*	z-index: 3;*/
	/*	position: absolute;*/
	/*}*/

	.notice::before {
		background-size: 14px 14px;
		padding: 1px 0 1px 17px;
	}

	.write-list .email > .input, .write-list .email > .email-domain{
		width: calc(50% - 15px);
	}

	.write-list .email em{
		width: 30px;
		margin: 0;
		text-align: center;
		line-height: 48px;
	}
	.write-list .email .email-domain .select-box button{
		height: 48px;
		line-height: 48px;
		padding: 0px 15px;
	}
	.write-list .email .email-domain .select-box button:after{
		right: 10px;
	}

	.write-list .email .input:nth-child(3){
		width: calc(100% - 30px);
	}

	.write-list .email + .select-box{
		margin-bottom:70px;
	}

	.write-list .info{
		background-position: 0 5px;
	}

	/* 선택사항에 밑줄 제거 2025.03.04 */
	/*.choice-wrap {*/
	/*	margin-top: 35px;*/
	/*	padding-top: 35px;*/
	/*	border-top: 1px dashed #e0e0e0;*/
	/*}*/

	.choice-wrap .select-box button{
		padding: 0 8px;
		line-height: 48px;
	}
	.choice-wrap .select-box button:after{
		right: 10px;
	}

	.choice-wrap .radio-wrap strong{
		margin-bottom:15px;
	}

	.choice-wrap .radio-wrap .radio-box{
		display: flex;
		flex-wrap:wrap;
		row-gap:15px;
	}

	.mail-cert .check-text ul {
		padding: 15px 16px;
	}

	.mail-cert .check-text .notice{
		background-position: 0 1px;
	}

	.mail-cert .go-back{
		line-height: 38px;
	}

	.mail-cert .check-text{
		margin-top:0;
	}

	.password-find .btn-flex a{
		line-height: 38px;
	}

} /*반응형 450px 끝*/





/*#######################################*/
@media screen and (max-width: 450px) {
	.login:not(.user-login) {
		padding-top: 45px;
	}
	.agree-wrap .agree-list br{
		display: inline;
		padding-left: 35px;
	}

} /*반응형 450px 끝*/

@media screen and (max-width: 420px) {

	.agree-wrap .agree-list input[type="checkbox"] + label[for="agree03"] .br {
		display: inline-block;
	}

}


/*#######################################*/
@media screen and (max-width: 380px) {
	.login:not(.user-login) {
		padding-bottom: 400px;
	}

	.speech-bubble{
		width: 100px;
	}

	.speech-bubble h1{
		font-size: 12px;
		line-height: 26px;
		font-weight: 500;
	}

	.agree-wrap .agree-list input[type="checkbox"] + label{
		padding-right:15px;
	}

	.agree-wrap .agree-list input[type="checkbox"] + label[for="agree03"] p {
		margin-top: 5px;
		line-height: 20px;
	}

	.agree-wrap .agree-list input[type="checkbox"] + label[for="agree04"] span:last-child {
		padding-left: 40px;
	}

	.password-find.on .notice .br{
		display: inline;
	}

	.login.on .input-box > div a{
		position: relative;
	}

} /*반응형 380px 끝*/


@media screen and (max-width: 375px) {
	.simple-footer {
		padding: 0 10px 70px;
	}
	.simple-footer ul li{
		width: 115px;
		padding: 4px 7px;
	}

	.simple-footer ul li a{
		font-size: 13px;
	}
	.simple-footer .copyright{
		font-size: 13px;
		padding: 0 8px;
	}

	.agree-wrap .agree-list input[type="checkbox"] + label[for="agree04"] span:last-child {
		padding-left: 35px;
	}


}


/*#######################################*/
@media screen and (max-width: 360px) {

	.login .sns-box li{
		margin:0 8px;
	}

} /*반응형 360px 끝*/



/*#######################################*/
@media screen and (max-width: 350px) {

	.join-step li{
		font-size: 12px;
	}

	.join-step li em{
		margin-right: 4px;
	}

} /*반응형 350px 끝*/

/*#######################################*/
@media screen and (max-width: 320px) {

	.agree-wrap .agree-list input[type="checkbox"] + label[for="agree04"] span:last-child {
		padding-left: 0;
	}

}
/*반응형 320px 끝*/

/*#######################################*/
@media screen and (max-width: 308px) {
	.login:not(.user-login) {
		padding-bottom: 440px;
	}

	.login .login-sub input[type="checkbox"] + label{
		font-size:13px;
	}

	.login .login-sub a{
		font-size:13px;
		margin-left:8px;
		padding-left: 8px;
	}

	.login .sns-box li {
		margin: 0 5px;
	}

	.join-step li{
		margin-right:6px;
		padding-right:14px;
	}

} /*반응형 300px 끝*/