@charset "utf-8";

/* 
 * content CSS Document
 *
 */





#content{position:relative; padding:60rem 0; box-sizing:border-box; }

.sub_title{text-align:center; margin-bottom:30rem; }
.sub_title h2{font-size:40px; font-weight:bold; color:#222; line-height:1em;}

@media (max-width:768px){
	.sub_title h2{font-size:30px;}
}
@media (max-width:620px){
	#content{padding:40rem 0;}
}
@media (max-width:480px){
	.sub_title{margin-bottom:20px;}
	.sub_title h2{font-size:23px;}
}

/* 고객센터 */
.box-pirvacy{display:block; padding:50rem; box-sizing:border-box; border-radius:10rem; background:#f9f9f9;}
.box-pirvacy > h3{display:block; font-size:24rem; font-weight:700; color:#333;}
.chk_box_wrap{display:block; margin:15rem 0 0;}
.box-cs .top{display:block; text-align:right; margin-bottom:50rem; font-size:16rem; font-weight:600; color:#222; border-bottom: 2px solid #222; padding-bottom: 10rem; box-sizing:border-box;}
.box-cs .top .ess{position:relative; top:2rem; margin-right:5rem; display:inline-block; color:#ff4002; }
.text-box{position:relative; margin:20rem 0 0; }
.text-box .text{background:#fff; padding:20rem; box-sizing:border-box; border:1px solid #eee; box-sizing:border-box; border-radius:5rem;}
.text-box .text p{display:block; margin-bottom:3rem; font-size:16rem; font-weight:400; color:#666; line-height:1.4em; word-break:keep-all;}
.box-cs{margin-top:40rem;}
.box-cs input{display:block; padding:15rem; width:100%; height:60rem; border:1px solid #ddd; box-sizing:border-box; border-radius:5rem; font-size:16rem; color:#333; outline:none;}
.box-cs textarea{display:block; padding:15rem; width:100%; height:200rem; border:1px solid #ddd; box-sizing:border-box; border-radius:5rem; font-size:16rem; color:#333;  outline:none;}
.input-list{display:grid; gap:20rem; grid-template-columns: repeat(3, 1fr); margin-bottom:30rem;}
.box-cs label{position:relative; display:inline-block; margin-bottom:10rem; font-size:17rem; font-weight:600; color:#333; line-height:1em; word-break:keep-all;}
.box-cs label .ess{position:absolute; top:-4rem; right:-10rem; color:#ff4002; }
.input-content{display:block; margin:30rem 0 0;}
.area-btn{margin:40rem auto 0; text-align:center;}
.input-submit,
.area-btn a{display: flex; align-items: center; justify-content: center; margin:0 auto; width:100rem; height:40rem; background:var(--color-point); font-size:15rem; color:#fff; font-weight:500; border-radius:5rem; box-sizing:border-box; border:None;}

/*checkbox_custom*/
.ckbox input[type="checkbox"]{display:none; width:20rem; height:15rem;}
.ckbox input[type="checkbox"] + label span{display:inline-block; margin-right:5rem; width:26rem; height:26rem; background:url(../img/sub/img_check.png) left top no-repeat; cursor: pointer;}
.ckbox label{display:flex;position:relative; padding-left:28rem; color:rgba(0,0,0,0.4);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;}
.ckbox label input{position:absolute;opacity:0;cursor:pointer;}
.checkmark{position:absolute;top:0;left:0;width:20rem;height:20rem;border:1rem solid #ddd; background:#fff; border-radius:3rem; box-sizing:border-box;}
.ckbox label:hover input ~ .checkmark{}
.ckbox label input:checked ~ .checkmark{border:1rem solid var(--color-point); background-color:var(--color-point);}
.checkmark:after{display:none;position:absolute;content:"";}
.ckbox label input:checked ~ .checkmark:after{display:block;}
.ckbox label .checkmark:after{top:2.5rem;left:7rem;width:5rem;height:9rem;border:1px solid #fff; border-width:0 1px 1px 0;transform:rotate(45deg);-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);}
.ckbox em{position:relative; top:1.5rem; font-size:16rem; font-weight:500; color:#333; line-height:1em; word-break:keep-all;}

@media (max-width:1024px){
	.box-pirvacy{padding:40rem;}
	.input-list{gap:15rem;}
}
@media (max-width:768px){
	.box-pirvacy{padding:30rem;}
	.box-pirvacy > h3{font-size:22rem;}
	.text-box{margin:15rem 0 0;}
	.text-box .text{padding:15rem;}
	.box-cs input{padding:12rem; height:55rem;}
}
@media (max-width:620px){
	.box-pirvacy{padding:20rem;}
	.box-pirvacy > h3{font-size:20rem;}
	.text-box{margin:10rem 0 0;}
	.text-box .text p{font-size:15rem;}
	.box-cs{margin-top:30rem;}
	.box-cs .top{margin-bottom:30rem; font-size:15rem;}
	.box-cs label{font-size:16rem;}
	.input-list{gap:15rem; grid-template-columns: repeat(1, 1fr); margin-bottom:15rem;}
	.input-content{margin:15rem 0 0;}
}
@media (max-width:480px){
	.box-pirvacy{padding:15rem 12rem 18rem; border-radius:5rem;}
	.box-pirvacy > h3{font-size:14rem;}
	.text-box{margin:7rem 0 0;}
	.text-box .text{padding:12rem; height:100rem; overflow-y:scroll;}
	.text-box .text::-webkit-scrollbar{width:4rem;}
	.text-box .text p{font-size:11rem; margin-bottom:1rem;}
	.chk_box_wrap{margin:10rem 0 0;}
	.ckbox label{padding-left:20rem;}
	.ckbox label .checkmark:after{top:1rem; left:5rem; width:4rem; height:8rem;}
	.checkmark{width:15rem; height:15rem;}
	.ckbox em{font-size:11rem;}
	.box-cs{margin-top:20rem;}
	.box-cs .top{margin-bottom:15rem; font-size:12rem;}
	.box-cs label{font-size:12rem; margin-bottom:5rem;}
	.box-cs label .ess{top:-3rem; right:-8rem;}
	.box-cs input{height:40rem; padding:10rem; font-size:12rem;}
	.input-list{gap:10rem;margin-bottom:10rem;}
	.input-content{margin:10rem 0 0;}
	.box-cs textarea{height:120rem; padding:10rem; font-size:12rem;}
	.area-btn{margin:20rem auto 0;}
	.input-submit,
	.area-btn a{width:90rem; height:38rem; font-size:12rem;}
}

/* login */
.area-member{margin:60rem auto 40rem;}
#login-box{position:relative; width:500rem; margin:0 auto;}
#login-box #login_area{background-color:#fff;}
#login-box #login_area h2.member {font-size:30rem;font-family:Gotham, notokr;}
#login-box #login_area h2{line-height:50rem;text-align:center;font-size:48rem;}
#login-box #login_area h3{text-align:center;color:#666}
#login-box #login_area h3 p {font-size:15rem;font-weight:normal;}
#login-box #login_area #login_fs{margin-top:0rem; padding:0;}
#login-box #login_area #login_fs .login_input{width:100%;height:55rem;line-height:55rem;padding:0 25rem;margin-bottom:10rem;border:none;background-color:#f9f9f9; border:1rem solid #e4e4e4; box-sizing:border-box; font-weight:bold;font-size:16rem; color:#111;}
#login-box #login_area #login_fs .login_input:focus{border: 1rem solid #1974d9 !important;  box-shadow: none;}
#login-box #login_area #login_fs .login_input::placeholder {color:#666;}
#login_fs label{position:relative; top:-2rem; font-size:14rem; font-weight:500; color:#555;}
#login-box #login_area #login_fs .btn_submit{display:block;width:100%;height:63rem;margin-top:20rem;background:var(--color-point);text-align:center;color:#fff; font-size:18rem; font-weight:500; border-radius:0; transition:all 0.3s ease;}
#login-box #login_area #login_fs .btn_submit:hover{background:#042d66;}
#login-box #login_info{position:relative;padding:0rem 0;margin-top:-1rem;border:0rem solid #dfdce1;background-color:#fff;text-align:center;}
#login-box #login_info p{font-size:13rem;}
#login-box #login_info div{margin-top:0rem;}
#login-box #login_info div a{display:inline-block;width:155rem;height:34rem;line-height:34rem;border:1rem solid #d5d5d5;color:#333;font-size:13rem;font-weight:bold}
#login-box #login_info div a:last-child{margin-left:-1rem}
#login-box .button_etc {position:relative;width:100%;text-align:center;}
#login-box .button_etc a {display:inline-block;margin:25rem 10rem 0rem; font-size:14rem; font-weight:600; color:#555; border:none;}
#login-box .button_etc a:hover{color:var(--color-point);}

@media (max-width:768px){
	.area-member{margin-top:80rem;}
}
@media (max-width:620px){
	.area-member{margin:40px auto 0px;}
	#login-box{width:80%;}
	#login-box #login_area #login_fs .login_input{height:45rem; line-height:45rem; padding:10rem; font-size:12rem; margin-bottom:7rem;}
	#login_fs label{font-size:12rem; top:0;}
	#login-box #login_area #login_fs .btn_submit{margin-top:10rem; height:45rem; font-size:13rem;}
	#login-box .button_etc a{margin:15rem 0; font-size:12rem;}
}
@media (max-width:480px){
	#login-box #login_area #login_fs .login_input{height:35rem; line-height:35rem; margin-bottom:4rem;}
	#login-box #login_area #login_fs .btn_submit{ height:35rem; font-size:13rem;}
	#login-box .button_etc a{margin:15rem 0; font-size:12rem;}
	#login_fs label{font-size:11px;;}
	#login-box .button_etc a{margin:12rem 0; font-size:11px;;}
}

.area_policy{padding-top:0;}
.area_policy h2{padding:30rem 0;font-size:40rem;color:#222;text-align:center;font-weight: 700;}
.area_policy h3{margin-bottom:20rem;font-weight: 700;font-size:22rem;color:#222;}
.area_policy ul li,
.area_policy p{line-height:1.6; font-weight:400; font-size:15rem; color:#666;  text-align:justify;}
.area_policy ul li{margin-bottom:8rem;}
.area_policy ul li:last-child{margin:0;}
.area_policy ul li ul{margin-top:5rem; margin-bottom:20rem;}
.area_policy ul li ul li{margin-bottom:2rem; font-size:15rem;}
.area_policy .inr_policy{padding:40rem 0; border-bottom:1rem solid #ddd;}
.area_policy .inr_policy.first{padding-top:0;}
.area_policy .inr_policy:last-child{border:none;}

@media (max-width:480px){
	.area_policy h3{font-size:15rem; margin-bottom:7rem;}
	.area_policy .inr_policy{padding:20rem 0;}
	.area_policy ul li, .area_policy p{font-size:12rem; line-height:1.4em; margin-bottom:4rem; text-align:left;}
	.area_policy ul li ul{margin-top:2rem; margin-bottom:7rem;}
	.area_policy ul li ul li{font-size:12rem; margin-bottom:4rem;}
	
}