@charset"utf-8";

/* login */
.login_wrap{position:relative;border:1px solid #ddd;/* border-bottom-color:#949494; */}
.login_wrap .login_box{position:relative;padding:20px;}
.login_wrap .login_box .item{}
.login_wrap .login_box .title{margin-bottom:20px;padding-bottom:20px;border:1px solid transparent;border-bottom-color:#eee;}
.login_wrap .login_box h2{margin:0 0 10px;padding:0;background:none;color:#363636;font-family:'ntk';font-size:30px;font-weight:bold;line-height:1;}
.login_wrap .login_box h2:before{display:none;}
.login_wrap .login_box h2 span{color:#701e20;font-weight:bold;line-height:1;vertical-align:baseline;}
.login_wrap .login_box p{margin:0;line-height:20px;}
.login_wrap .login_box .form{}
.login_wrap .login_box .form ul{position:relative;margin-bottom:5px;}
.login_wrap .login_box .form ul li{position:relative;margin-top:5px;}
.login_wrap .login_box .form ul li:first-child{margin-top:0;}
.login_wrap .login_box .form ul li input{padding:0 12px;width:100%;height:42px;border:1px solid #bbb;}
.login_wrap .login_box .form ul li label{position:absolute;top:0;left:12px;line-height:42px;}
.login_wrap .login_box .form .btn{width:100%;padding:0;height:50px;background-color:#701e20;border-color:#701e20;font-size:15px;line-height:50px;text-align:center;}
.login_wrap .login_box .form .btn:hover,
.login_wrap .login_box .form .btn:focus{background-color:#df0200;border-color:#df0200;}
.login_wrap .login_box .form .find{margin-top:5px;text-align:center;}
.login_wrap .login_box .form .find li{display:inline-block;margin:0;line-height:1;}
.login_wrap .login_box .form .find li:first-child{margin-right:10px;padding-right:12px;}
.login_wrap .login_box .form .find li:first-child:before{content:"";display:block;position:absolute;top:50%;right:0;margin-top:-7px;width:1px;height:14px;background-color:#ddd;}
.login_wrap .login_box .form .find button{line-height:1;}
.login_wrap .login_box .form .find button:hover,
.login_wrap .login_box .form .find button:focus{color:#df0200;}
.login_wrap .l_guide{margin:0;padding:20px;background-color:#f9f9f9;border-top:1px solid #ddd;}
.login_wrap .l_guide a.color-orange:link,
.login_wrap .l_guide a.color-orange:visited{color:#701e20;}
.login_wrap .l_guide a.color-orange:hover,
.login_wrap .l_guide a.color-orange:focus{color:#df0200;}

@media only screen and (min-width:640px) {
	.login_wrap .login_box{padding:30px 30px 30px 47.5%;}
	.login_wrap .login_box .title{position:absolute;top:50%;left:0;margin:-40px 0 0;padding-left:30px;width:47.5%;border-bottom-color:transparent;}
	.login_wrap .login_box .form{padding-left:10%;border-left:1px solid #eee;}
	.login_wrap .l_guide{padding:30px;}
}
@media only screen and (min-width:768px) {
	.login_wrap .login_box{padding:35px 50px 35px 45%;}
	.login_wrap .login_box .title{padding-left:35px;width:45%;}
	.login_wrap .login_box .form{position:relative;padding-right:110px;}
	.login_wrap .login_box .form .find{text-align:left;}
	.login_wrap .login_box .form ul{margin-bottom:0;}
	.login_wrap .login_box .form .btn{position:absolute;top:0;right:0;width:100px;height:89px;line-height:89px;}
	.login_wrap .l_guide{padding:30px 35px;}
}
@media only screen and (min-width:1024px) {
	.login_wrap .login_box{padding:40px 55px 40px 43.5%;}
	.login_wrap .login_box .title{padding-left:40px;}
	.login_wrap .l_guide{padding:30px 40px;}
}
@media only screen and (min-width:1200px) {
	.login_wrap .login_box{padding:55px 70px 45px 40%;}
	.login_wrap .login_box .title{margin-top:-47px;padding-left:55px;}
	.login_wrap .login_box h2{margin-bottom:20px;font-size:35px;}
	.login_wrap .login_box p{font-size:15px;}
	.login_wrap .login a {background:red;color:white;width:;padding: 7px 35px 10px 35px;margin-top: 10px;}
	.login_wrap .login {margin-left: 48px;/* width: 30px; */margin-top: 17px;/* height: 299px; */}
	.login_wrap .l_guide{padding:30px 55px;}
	.login_wrap .login_box .form{padding:0 155px 10px 10%;}
	.login_wrap .login_box .form .btn{width:145px;}
}


.login_wrap2 {position:relative; border:1px solid #ddd; margin-bottom:10px;}    
.login_wrap2 .login_box {padding:25px 50px; position:relative;}
.login_wrap2 .login_box h2 {color:#363636; font-family:'ntk'; font-size:35px; }
.login_wrap2 .login_box h2:before {display:none;}
.login_wrap2 .login_box h2 span {color:#701e20; font-weight:bold; line-height:1;}
.login_wrap2 .login_box .item.form {position:absolute; right:67px; top:25px;}
.login_wrap2 .login_box .btn {width:145px; background-color:#701e20; height:70px; padding-top: 23px;}

@media only screen and (max-width: 768px) {
    .login_wrap2 .login_box {padding:20px;}
    .login_wrap2 .login_box .item.form  {position:relative; right:auto; top:auto;}
    .login_wrap2 .login_box .btn {width:100%; height:50px; padding-top: 13px;}
    .login_wrap2 .login_box h2 {font-size:30px;}
}