@charset "UTF-8";

/* login */
div.login-wrap{width:500px; margin:3rem auto;}
div.login-wrap div.form-login{}
div.login-wrap div.form-login div[class*="inp-"]{display:flex; align-items:center; margin-bottom:0.5rem; border:1px solid #ccc; border-radius:0.5rem; overflow:hidden;}
div.login-wrap div.form-login div[class*="inp-"] div.ico{width:4rem; height:3.5rem; background:#f9f9f9; border-radius:0; border-right:1px solid #ddd;}
div.login-wrap div.form-login div[class*="inp-"] div.ico img{display:block; width:50%; height:100%; margin:0 auto; object-fit:contain; opacity:.6;}
div.login-wrap div.form-login div[class*="inp-"] input{width:100%; height:3.5rem; border-radius:0; border:0; font-size:1.125rem;}
div.login-wrap div.form-login div.inp-id{}
div.login-wrap div.form-login div.inp-pw{margin-bottom:0;}
div.login-wrap div.form-login div.inp-pw div.pw{width:100%;}
div.login-wrap div.form-login a.btn-login{display:block; width:100%; padding:1rem; background:var(--color-main01); color:#fff; font-size:1.25rem; border-radius:0.5rem; text-align:center; font-family:'Pretendard-Bold',sans-serif; margin-top:1rem;}

div.login-wrap div.etc-login{margin-top:1rem; display:flex; justify-content:flex-end;}
div.login-wrap div.etc-login a[class*="btn-"]{text-align:center; position:relative; margin-right:1rem; padding-right:1rem;}
div.login-wrap div.etc-login a[class*="btn-"]:after{content:''; display:block; width:4px; height:4px; border-radius:50%; background:#aaa; position:absolute; top:50%; right:-5px; transform:translateY(-50%);}
div.login-wrap div.etc-login a[class*="btn-"]:last-child{margin-right:0; padding-right:0;}
div.login-wrap div.etc-login a[class*="btn-"]:last-child:after{display:none;}
div.login-wrap div.etc-login a.btn-join{font-family:'Pretendard-SemiBold',sans-serif;}

div.login-wrap div.sns-login{margin-top:3.5rem;}
div.login-wrap div.sns-login div.div-line{border-top:1px solid #ddd; position:relative;}
div.login-wrap div.sns-login div.div-line span{position:absolute; top:-1rem; left:50%; transform:translateX(-50%); height:2rem; line-height:2rem; padding:0 1rem; background:#fff; color:#aaa;}
div.login-wrap div.sns-login ul{margin-top:2rem;}
div.login-wrap div.sns-login ul li{margin-top:0.5rem; height:3rem; line-height:3rem; border-radius:0.5rem; overflow:hidden;}
div.login-wrap div.sns-login ul li a[class*="btn-"]{display:block; width:100%; height:100%; padding:0 0.5rem; text-align:center; font-family:'Pretendard-Medium',sans-serif; position:relative;}
div.login-wrap div.sns-login ul li a[class*="btn-"] span.ico{width:1rem; height:1rem; position:absolute; top:50%; left:1rem; transform:translateY(-50%);}
div.login-wrap div.sns-login ul li a[class*="btn-"] span.ico img{display:block; width:100%; height:100%; object-fit:contain;}
div.login-wrap div.sns-login ul li a.btn-kakao{background:#fee500; color:#191600;}
div.login-wrap div.sns-login ul li a.btn-naver{background:rgb(3,199,90); color:#fff;}


/* member */
div.member-wrap{width:860px; margin:0 auto; min-height:35vh;}
div.member-wrap ul.member-tab{display:flex; justify-content:center; gap:1rem; margin-bottom:3rem;}
div.member-wrap ul.member-tab li{font-size:1.25rem; border-radius:50px; border:2px solid #ddd; background:#fff;}
div.member-wrap ul.member-tab li a{padding:0.6rem 1.5rem; color:#7f7f7f;}
div.member-wrap ul.member-tab li.on{background:var(--color-main03); border-color:var(--color-main03); font-family:'Pretendard-Bold',sans-serif; box-shadow:0 3px 18px rgba(230,116,62,0.5);}
div.member-wrap ul.member-tab li.on a{color:#fff;}
div.member-wrap p.form-tit{margin-bottom:0.25rem; font-size:1.5rem; font-family:'Pretendard-Bold',sans-serif; border-bottom:2px solid #333; padding-bottom:0.5rem;}
div.member-wrap p.form-notice{margin-bottom:0.25rem;}
div.member-wrap p.form-notice02{font-size:1.125rem; font-family:'Pretendard-Bold',sans-serif; margin-bottom:0.5rem;}
div.member-wrap div.member-form-wrap section.form-sect{border-top:2px solid #333; margin-bottom:3rem;}

/* join */
div.member-wrap.join{}
div.member-wrap.join ul.step{display:flex; align-items:center; justify-content:center; margin:2rem 0 3rem 0; position:relative;}
div.member-wrap.join ul.step:before{content:''; display:block; width:45%; height:1px; background:#ccc; position:absolute; top:1.8rem; left:50%; transform:translateX(-50%); z-index:-1;}
div.member-wrap.join ul.step li{margin:0 3rem; text-align:center;}
div.member-wrap.join ul.step li p.step-ico{width:3.5rem; height:3.5rem; border:1px solid #ccc; background:#fff; text-align:center; border-radius:50%; margin:0 auto; margin-bottom:0.65rem; position:relative;}
div.member-wrap.join ul.step li p.step-num{font-size:1rem; font-family:'Pretendard-Bold',sans-serif; margin-bottom:0.2rem; color:#ccc; letter-spacing:-0.5px;}
div.member-wrap.join ul.step li p.step-txt{font-size:1.2rem; font-family:'Pretendard-Light',sans-serif; color:#aaa;}
div.member-wrap.join ul.step li.on p.step-ico{border-color:var(--color-main01); box-shadow:0 10px 10px var(--color-main01-10);}
div.member-wrap.join ul.step li.on p.step-num{color:var(--color-main01);}
div.member-wrap.join ul.step li.on p.step-txt{color:#333; font-family:'NanumNeo_B',sans-serif;}
div.member-wrap.join ul.step li:nth-child(1) p.step-ico{background:#fff url("../img/join_step1.svg")center/ 40% auto no-repeat;}
div.member-wrap.join ul.step li:nth-child(2) p.step-ico{background:#fff url("../img/join_step2.svg")center/ 36% auto no-repeat;}
div.member-wrap.join ul.step li:nth-child(3) p.step-ico{background:#fff url("../img/join_step3.svg")center/ 40% auto no-repeat;}
div.member-wrap.join ul.step li:nth-child(1).on p.step-ico{background:var(--color-main01) url("../img/join_step1_on.svg")center/ 40% auto no-repeat;}
div.member-wrap.join ul.step li:nth-child(2).on p.step-ico{background:var(--color-main01) url("../img/join_step2_on.svg")center/ 36% auto no-repeat;}
div.member-wrap.join ul.step li:nth-child(3).on p.step-ico{background:var(--color-main01) url("../img/join_step3_on.svg")center/ 40% auto no-repeat;}

/* join step01 */
div.member-wrap.join.step01 div.sns-auth-list{}
div.member-wrap.join.step01 div.sns-auth-list ul.sns-list{display:flex; flex-wrap:wrap; gap:1.5rem 4%;}
div.member-wrap.join.step01 div.sns-auth-list ul.sns-list li{width:48%;}
div.member-wrap.join.step01 div.sns-auth-list ul.sns-list li a[class^="btn-"]{display:block; width:100%; height:100%; padding:1.5rem 2rem; border-radius:1rem; font-family:'Pretendard-SemiBold',sans-serif; font-size:1.2rem; word-break:keep-all;}
div.member-wrap.join.step01 div.sns-auth-list ul.sns-list li a[class^="btn-"] span.ico{display:block; width:2rem; height:2rem; margin-bottom:1rem;}
div.member-wrap.join.step01 div.sns-auth-list ul.sns-list li a[class^="btn-"] span.ico img{display:block; width:100%; height:100%; object-fit:contain;}
div.member-wrap.join.step01 div.sns-auth-list ul.sns-list li a.btn-kakao{background:#fee500; color:#191600;}
div.member-wrap.join.step01 div.sns-auth-list ul.sns-list li a.btn-naver{background:rgb(3,199,90); color:#fff;}
div.member-wrap.join.step01 div.member-notice{margin-top:2rem; padding-top:1rem; border-top:1px solid #ddd;}

/* join step02 */
div.member-wrap.join.step02 div.member-term-wrap section.term-sect{margin-bottom:3rem;}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap{}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term{}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term div.term-input{position:relative; border-bottom:1px solid #ddd; padding:0.5rem 0;}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term div.term-input label{font-size:1.125rem; font-family:'Pretendard-Medium',sans-serif;}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term div.term-input a.term-box-arrow{width:1rem; height:1rem; display:block; background:url("../img/ico_arrow.svg")center/80% auto no-repeat; position:absolute; top:50%; right:0; transform:translateY(-50%) rotate(90deg);}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term div.term-input a.term-box-arrow.open{transform:translateY(-50%) rotate(-90deg);}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term div.term-box{background:#f5f5f5; height:0; padding:0; line-height:1.5; font-size:0.9rem; overflow:hidden;}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term div.term-box.open{height:auto !important; padding:1rem; overflow-y:auto; max-height:18rem;}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term.all div.term-input{border-bottom:none;}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term.all div.term-input label{font-family:'Pretendard-Bold',sans-serif; padding-left:2.5rem; margin:0.5rem 0; font-size:1.3rem;}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term.all div.term-input label div.ci-show{width:1.5rem; height:1.5rem; border:1px solid #333;}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term.all div.term-input label.c-input input:checked ~ div.ci-show{border-color:var(--color-main01);}
div.member-wrap.join.step02 div.member-term-wrap section.term-sect div.term-wrap div.term.all div.term-box{border:1px solid #333; background:#fff; font-size:1rem; border-radius:0.5rem;}

/* join step04 */
div.member-wrap.join.step04 div.join-complete{padding:3rem; text-align:center; border:3px solid #333; border-radius:1rem;}
div.member-wrap.join.step04 div.join-complete p.txt01{font-size:1.5rem; font-family:'Pretendard-bold',sans-serif;}
div.member-wrap.join.step04 div.join-complete p.txt01:before{content:''; display:block; width:3rem; height:3rem; background:url("../img/member_join_done.svg")center/contain no-repeat; margin:0 auto; margin-bottom:1rem;}
div.member-wrap.join.step04 div.join-complete p.txt02{font-size:1.125rem; background:#f5f5f5; margin-top:1rem; padding:1.5rem; line-height:1.6; border-radius:0.5rem; color:#5f5f5f;}

/* find */
div.member-wrap.find div.find-complete{padding:3rem; text-align:center; border:3px solid #333; border-radius:1rem;}
div.member-wrap.find div.find-complete p.txt01{font-size:1.25rem; font-family:'Pretendard-bold',sans-serif;}
div.member-wrap.find div.find-complete p.txt02{font-size:1.5rem; background:#f5f5f5; margin-top:1rem; padding:1.5rem; line-height:1.6; border-radius:0.5rem; border:2px solid #eee;}
div.member-wrap.find div.find-complete.empty{background:#f5f5f5; border-color:#eee;}
div.member-wrap.find div.find-complete.empty p.txt01{font-size:1.5rem; font-family:'Pretendard-Medium',sans-serif; color:#5f5f5f;}

/* modify */
div.member-wrap.modify ul.sns-login-contect{display:flex; justify-content:space-between; align-items:center;}
div.member-wrap.modify ul.sns-login-contect li{width:49%; border-radius:0.5rem; position:relative;}
div.member-wrap.modify ul.sns-login-contect li a{padding:1rem; display:block; width:100%; height:100%;  position:relative;}
div.member-wrap.modify ul.sns-login-contect li a div.slc-lab{display:block; display:flex; gap:0.5rem; align-items:center; flex-wrap:wrap;}
div.member-wrap.modify ul.sns-login-contect li a div.slc-lab img{display:block; width:1.5rem; height:1.5rem; object-fit:contain;}
div.member-wrap.modify ul.sns-login-contect li a div.slc-lab span.slc-txt{font-family:'Pretendard-Bold',sans-serif; font-size:1.1rem;}
div.member-wrap.modify ul.sns-login-contect li a div.slc-lab span.slc-state{}
div.member-wrap.modify ul.sns-login-contect li a span.slc-btn{background:#fff; display:inline-block; height:70%; font-family:'Pretendard-Medium',sans-serif; display:flex; align-items:center; justify-content:center; padding:0 1.5rem; color:#333; position:absolute;top:15%; right:1rem; border-radius:5px;}
div.member-wrap.modify ul.sns-login-contect li.kakao{background:#fee500; color:#191600;}
div.member-wrap.modify ul.sns-login-contect li.naver{background:rgb(3,199,90); color:#fff;}



@media screen and (max-width:1600px){}
@media screen and (max-width:1440px){}
@media screen and (max-width:1280px){}
@media screen and (max-width:1024px){
	
	/* member */
	div.member-wrap{width:100%;}

	/* join */
	div.member-wrap.join ul.step:before{top:1.5rem; width:30%;}
	div.member-wrap.join ul.step li{margin:0 2rem;}
	div.member-wrap.join ul.step li p.step-ico{width:3.2rem; height:3.2rem;}
	div.member-wrap.join ul.step li p.step-num{font-size:0.9rem;}
	div.member-wrap.join ul.step li p.step-txt{font-size:1rem;}

}
@media screen and (max-width:800px){}
@media screen and (max-width:640px){
	
	/* login */
	div.login-wrap{width:100%;}

	/* modify */
	div.member-wrap.modify ul.sns-login-contect li a div.slc-lab{gap:0.3rem;}
	div.member-wrap.modify ul.sns-login-contect li a span.slc-btn{position:static; padding:0.5rem; margin-top:0.5rem;}

}
@media screen and (max-width:480px){
	
	/* login */
	div.login-wrap div.etc-login{justify-content:center;}

	/* join */
	div.member-wrap.join ul.step:before{width:40%;}
	div.member-wrap.join.step01 div.sns-auth-list ul.sns-list li a[class^="btn-"]{padding:1.2rem 1.5rem; font-size:1.15rem;}
	div.member-wrap.join.step01 div.sns-auth-list ul.sns-list li a[class^="btn-"] span.ico{margin-bottom:0.65rem; width:1.5rem; height:1.5rem;}

}
@media screen and (max-width:400px){
	
	/* join */
	div.member-wrap.join ul.step{margin-top:0;}
	div.member-wrap.join ul.step:before{width:90%;}
	div.member-wrap.join ul.step li{width:33.33%; margin:0;}
	div.member-wrap.join ul.step li p.step-num{margin-bottom:0; font-size:0.8rem;}
}
@media screen and (max-width:320px){}