@charset "utf-8";

/* /////////////// jinstar /////////////// */

body{ background-color:var(--wgraybgcolor);}
#contants{ padding:0; width:100%; height:auto; min-height:auto;}

/* login */
.login_wrap{ background:url('../images/member/login_bg.png') 50% 50% no-repeat; background-size:cover; width:100%; height:100%; min-height:600px; overflow-y:auto; overflow-x:hidden; padding:0 0; display:flex; align-items:center;}

.login_box{ max-width:1100px; padding:20px; margin:0 auto; position:relative; display:flex; gap:50px; align-items:center;}
.login_box .login_left{ width:calc(100% - 600px);}
.login_box .login_right{ width:600px;}
.login_box .login_right .login_right_img{ margin-bottom:20px;}
.login_box .login_right .login_right_img > p{ color:var(--white); font-size:1.2em; margin-top:5px; font-weight:500;}
.login_box .login_right .login_right_img > span{ display:block; color:var(--white); margin-top:5px; font-weight:500;}
.login_box .login_right .login_right_img .login_customer{ font-size:1.6em; color:var(--maincolor); margin:20px 0; font-weight:700;}
.login_box .login_right .login_right_img .login_customer strong{ margin-left:5px; font-size:1.5em; font-weight:700; color:var(--white); display:inline-block; vertical-align:middle; position:relative; z-index:1; width:285px;}
.login_box .login_right .login_right_img .login_customer strong:after{ font-weight:700; content:attr(data-content); position:absolute; left:-3px; top:0; z-index:-1; padding:0px 4px;
color:transparent; -webkit-text-stroke:8px transparent; background:linear-gradient(to bottom, var(--maincolor), #00487c); -webkit-background-clip:text; background-clip:text;}
.login_box .login_right .login_form{ }
.input_box{ display:flex; gap:5px;}
.input_box.input_login{ }
.input_box.input_find{ }
.input_box.input_find_certifi{ display:block;}
.input_box.input_find_certifi p{ margin-bottom:20px;}
.input_box.input_find_certifi p input{ margin-right:5px;}
.input_box.input_find_certifi p small{ font-size:0.8em; display:block; margin-top:5px; color:var(--wgraytcolor);}
.input_box.input_find_confirm{ display:block;}
.input_box.input_find_reset{ display:block;}
.input_box > div{ width:calc(100% - 140px);}
.input_box.input_login > div input:last-child{ margin-bottom:0;}
.input_box.input_find > div input:last-child{ margin-bottom:0;}
.input_box > p{ width:100%;}
.input_box input[type="text"],
.input_box input[type="password"],
.input_box input[type="email"],
.input_box input[type="tel"]{ width:100%; margin-bottom:5px;}
.input_box.input_login > div input{ border:0;}
.input_box > button{ width:140px; font-weight:500; border:0; display:block;}
.input_box.input_login > button{ background-color:var(--white);}
.input_box.input_find > button{ background-color:var(--maincolor); color:var(--white);}
.login_box .login_right .login_form .input_menu{ overflow:hidden; margin-top:10px;}
.login_box .login_right .login_form .input_menu p{ float:left;}
.login_box .login_right .login_form .input_menu p input[type="checkbox"]{ margin-right:5px;}
.login_box .login_right .login_form .input_menu p label{ color:var(--white);}
.login_box .login_right .login_form .input_menu ul{ float:right;}
.login_box .login_right .login_form .input_menu ul li{ display:inline-block; vertical-align:middle; margin-left:15px; position:relative;}
.login_box .login_right .login_form .input_menu ul li:after{ content:''; position:absolute; left:-10px; top:3px; width:1px; height:12px; background-color:var(--white);}
.login_box .login_right .login_form .input_menu ul li:first-child{ margin-left:0;}
.login_box .login_right .login_form .input_menu ul li:first-child:after{ display:none;}
.login_box .login_right .login_form .input_menu ul li a{ color:var(--white);}

.find_wrap{ }
.find_box{ max-width:600px; padding:40px 20px 20px; margin:0 auto;}
.find_box .find_title{ margin-bottom:50px; text-align:center;}
.find_box .find_title h2{ text-align:center; margin-bottom:20px;}
.find_box .find_title h3{ text-align:center;}
.find_box .find_title h4{ text-align:center;}
.find_box .find_form_wrap{ background-color:var(--white); border:1px solid var(--bordercolor); padding:20px;}
.find_box .find_form_wrap .find_form{ }
.find_box .find_form_wrap .find_form h5{ font-weight:500; margin-bottom:10px;}
.find_box .find_form_wrap .find_form .how_find{ margin-bottom:20px;}
.find_box .find_form_wrap .find_form .how_find p{ display:inline-block; vertical-align:middle; margin-right:15px;}
.find_box .find_form_wrap .find_form .how_find p input{ margin-right:5px;}
.find_box .find_form_wrap .find_form .find_input{ margin-top:20px;}
.find_box .find_form_wrap .find_form .find_input p{ margin-bottom:5px; display:flex; align-items:center;}
.find_box .find_form_wrap .find_form .find_input p span{ display:inline-block; vertical-align:middle; width:80px;}
.find_box .find_form_wrap .find_form .find_input p input{ width:calc(100% - 80px);}
.find_box .find_form_wrap .btns{ margin-bottom:0; margin-top:30px;}

.find_compl{ padding-top:30px;}
.find_compl h6{ text-align:center;}
.find_compl h6 b{ display:inline-block; vertical-align:middle; position:relative; z-index:1;}
.find_compl h6 b:after{ content:''; position:absolute; background-color:rgba(255,255,0,0.4); left:-5px; right:-5px; bottom:0px; height:10px; z-index:-1;}

.re_try_certifi a{ text-decoration:underline;}

/* regi */
.regi_wrap{ }

.regi_box{ max-width:900px; padding:40px 20px 20px; margin:0 auto;}
.regi_box .regi_title{ margin-bottom:50px; text-align:center;}
.regi_box .regi_title h2{ text-align:center; margin-bottom:20px;}
.regi_box .regi_title h3{ text-align:center; margin-bottom:5px;}
.regi_box .regi_title h4{ text-align:center;}
.regi_box .regi_title b{ font-size:1em;}
.regi_box .regi_title .compl_icon{ margin:30px 0 20px;}
.regi_box .regi_title .compl_icon i{ font-size:5em; color:var(--maincolor);}
.regi_box .regi_form_wrap{ background-color:var(--white); border:1px solid var(--bordercolor); padding:20px;}
.regi_box .regi_form_wrap .regi_form{ margin-top:30px; padding-top:30px;}
.regi_box .regi_form_wrap .regi_form:first-child{ margin-top:0; padding-top:0; border-top:0;}
.regi_box .regi_form_wrap .regi_form h5{ font-weight:500; margin-bottom:10px;}
.regi_box .regi_form_wrap .regi_form textarea{ height:200px; font-size:0.9em; margin-bottom:10px;}
.regi_box .regi_form_wrap .regi_form .list_table{ margin-bottom:10px;}
.regi_box .regi_form_wrap .regi_form .agr_chkbox{ padding:10px; background-color:var(--wgraybgcolor);}
.regi_box .regi_form_wrap .regi_form .agr_chkbox input{ margin-right:5px;}
.regi_box .regi_form_wrap .btns{ margin-bottom:0; margin-top:30px;}

@media (max-width:1199px){
	
}

@media (max-width:959px){
	.login_box{ display:block;}
	.login_box .login_left{ width:auto; max-width:180px; margin:0 auto 20px;}
	.login_box .login_right{ width:auto; max-width:500px; margin:0 auto;}
	.login_box .login_right .login_right_img p{ font-size:1em;}
	.login_box .login_right .login_right_img span{ font-size:0.8em;}
	.input_box > div{ width:calc(100% - 100px);}
	.input_box > button{ width:100px;}
}

@media (max-width:767px){
	.login_box .login_left{ max-width:120px;}
	.login_box .login_right{ max-width:300px;}

	.login_box .login_right .login_right_img .login_customer strong{ margin-left:0; margin-top:5px;}
}