@charset "euc-kr";
:root{
	--color-main01:#e71e18;
	--color-main02:#45985b;
	--color-main03:#b9b5b7;
	--color-main04:#edbf1c;
	--color-main05:#f3f4ef;
}


.w1600{width:1600px; margin:0 auto;}
.w1440{width:1440px; margin:0 auto;}
.w1280{width:1280px; margin:0 auto;}


.T_center{text-align:center !important;}
.T_left{text-align:left !important;}
.T_right{text-align:right !important;}


.color01{color:var(--color-main01) !important;}


/* input */
input{border:1px solid #aaa; margin:0; font-size:1.1rem; outline:none; -webkit-appearance:none; appearance:none; border-radius:0; font-family:"NanumNeo_R",sans-serif; -webkit-transition:0.3s; transition:0.3s;}
input:-ms-input-placeholder{color:#aaa; font-family:"NanumNeo_R",sans-serif; -webkit-transition:0.3s; transition:0.3s;}
input:-moz-input-placeholder{color:#aaa; font-family:"NanumNeo_R",sans-serif; -webkit-transition:0.3s; transition:0.3s;}
input::-webkit-input-placeholder{color:#aaa; font-family:"NanumNeo_R",sans-serif; -webkit-transition:0.3s; transition:0.3s;}
input::placeholder{opacity:1; font-size:0.925em; color:#aaa; font-family:"NanumNeo_R",sans-serif; -webkit-transition:0.3s; transition:0.3s;}
input:focus{outline:none; border:1px solid #222;}

input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"]{width:100%; height:3rem; line-height:3rem; padding:0 0.5rem;}

input[type="text"]:disabled,
input[type="email"]:disabled,
input[type="number"]:disabled,
input[type="password"]:disabled{background:#f5f5f5; border-color:#ddd; color:#5f5f5f;}

input[type="text"]:read-only,
input[type="email"]:read-only,
input[type="number"]:read-only,
input[type="password"]:read-only{pointer-events:none; background:#f5f5f5; border-color:#ddd; color:#5f5f5f;}

/* file */
input[type="file"]{height:3rem; line-height:3rem; padding:0 0.5rem; font-size:1rem; cursor:pointer;}
input[type="file"]::file-selector-button{font-family:"NanumNeo_R",sans-serif; background:#9f9f9f; border:1px solid #aaa; color:#fff; border-radius:3px; padding:0.5rem 0.6rem; letter-spacing:-0.3px; font-size:0.85em; margin-right:0.5rem; cursor:pointer;}
.file-lab{position:relative; margin-bottom:0.8rem; width:50%;}
.file-lab.last{margin-bottom:0 !important;}
.file-lab input[type="file"]{width:calc(100% - 2.5rem);}
.file-lab a.file-del{display:inline-block; width:2rem; height:2rem; opacity:.5; background:url("/fro_end/img/bbs_delete.svg")center/70% auto no-repeat; position:absolute; top:50%; right:0; transform:translateY(-50%);}
@media(hover:hover){
	input[type="file"]:hover::file-selector-button{background:#333;}
	.file-lab a.file-del:hover{background-image:url("/fro_end/img/bbs_delete_open.svg"); opacity:1;}
}

/* password */
div.type-pw{position:relative;}
div.type-pw a.pw-eyes{display:block; width:1.5rem; height:1.5rem; background:url("/fro_end/img/input_showpw.svg")center/100% auto no-repeat; position:absolute; top:50%; right:1rem; transform:translateY(-50%);}
div.type-pw a.pw-eyes.show{background-image:url("/fro_end/img/input_hidepw.svg");}
div.type-pw input[type="password"]:disabled + a.pw-eyes{opacity:.2; pointer-events:none;}

/* input - checkbox, radio */
label.lab-input{position:relative;}
label.lab-input div.lab-label{font-size:1rem; position:absolute; pointer-events:none;}
label.lab-input input{padding-top:1rem; font-size:1rem;}
label.lab-input input:placeholder-shown + div.lab-label{top:50%; left:0.5rem; transform:translateY(-50%); font-family:'NanumNeo_R', sans-serif;}
label.lab-input input:not(placeholder-shown) + div.lab-label{transform:scale(0.8); top:4px; left:4px; color:#aaa; font-family:'NanumNeo_B', sans-serif;}
label.lab-input input:focus + div.lab-label{transform:scale(0.8); top:4px; left:4px;  color:#aaa; font-family:'NanumNeo_B', sans-serif;}
label.lab-input input::placeholder{opacity:0;}
label.lab-input input:focus::placeholder{opacity:1;}


/* input - checkbox, radio */
label.c-input{position:relative; display:inline-block; padding-left:1.8rem; cursor:pointer; font-size:1rem; margin:0.8rem 0;}
label.c-input input{position:absolute; z-index:-1; opacity:0; width:0; height:0; padding:0;}
label.c-input div.ci-show{position:absolute; top:50%; left:0; transform:translateY(-50%); border:1px solid #aaa; height:1.35rem; width:1.35rem; background:#fff; border-radius:50%; -webkit-transition:0.3s; transition:0.3s;}
label.c-input div.ci-show:after{content:""; position:absolute; display:none;}
label.c-input.ci-radio div.ci-show{border-radius:50%;}
label.c-input:hover input ~ div.ci-show,
label.c-input input:focus ~ div.ci-show{border-color:#222;}
label.c-input input:checked ~ div.ci-show{border-color:#222;}
label.c-input:hover input:not([disabled]):checked ~ div.ci-show{}
label.c-input input:checked:focus ~ div.ci-show{}
label.c-input input:disabled ~ div.ci-show{border-color:#ddd; background:#f5f5f5; pointer-events:none;}
label.c-input input:checked ~ div.ci-show:after{display:block;}

label.c-input.ci-check div.ci-show:after{left:7px; top:3.5px; width:4px; height:8px; border:solid #222; border-width:0 2px 2px 0; transform:rotate(45deg);}
label.c-input.ci-check input:disabled ~ div.ci-show:after{border-color:#7b7b7b;}

label.c-input.ci-radio div.ci-show:after{left:50%; top:50%; transform:translate(-50%, -50%); height:43%; width:43%; border-radius:50%; background:#222;}
label.c-input.ci-radio input:disabled ~ div.ci-show:after{background:#7b7b7b;}


/* input - checkbox, radio */
label.n-input{position:relative;}
label.n-input input{position:absolute; top:0; left:0; z-index:-11;}
label.n-input div.ci-show{display:inline-block; background:#fff; padding:0.9rem 1.6rem; border:1px solid #ccc; cursor:pointer; margin-right:0.8rem; transition:0.3s; -webkit-transition:0.3s;}
label.n-input input:hover ~ div.ci-show,
label.n-input input:focus ~ div.ci-show{border-color:#333;}
label.n-input input:checked ~ div.ci-show{border-color:#222; outline:1px solid #222; font-family:'NanumNeo_EB',sans-serif;}
label.n-input input:disabled ~ div.ci-show,
label.n-input input:disabled:hover ~ div.ci-show{pointer-events:none; background:#f5f5f5; border-color:#eee; color:#9f9f9f;}
label.n-input input:disabled:checked ~ div.ci-show,
label.n-input input:disabled:checked:hover ~ div.ci-show{color:#222; border:1px solid #222; background:#fff;}

/* switch */
input[type="checkbox"].switch{position:absolute; width:0; height:0; visibility:hidden; z-index:-1;}
label.switch{position:relative; display:inline-block; width:2.5rem; height:1.5rem; border-radius:50px; background:#ddd; cursor:pointer; -webkit-transition:0.3s; transition:0.3s;}
label.switch:after{content:""; position:absolute; top:5px; left:5px; width:0.8rem; height:0.8rem; background:#fff; border-radius:30px; -webkit-transition:0.3s; transition:0.3s;}
input.switch:checked + label{background:var(--color-main02);}
input.switch:checked + label:after{left:calc(100% - 5px); transform:translateX(-100%); box-shadow:0 5px 15px rgba(0, 0, 0, 0.5);}
label.switch:active:after{width:50%;}


/* select */
select{height:3rem; line-height:3rem; border:1px solid #aaaaaa; padding:0 2.5rem 0 0.5rem; font-family:'NanumNeo_R',sans-serif; font-size:1rem; background:#fff url("/fro_end/img/select_arrow.svg")92% center/0.95em 0.95em no-repeat;}
select:focus{border:1px solid #222;}

/* textarea */
textarea{border:1px solid #aaa; border-radius:0; font-family:'NanumNeo_R',sans-serif; padding:0.5rem; outline:0;}
textarea:focus{border:1px solid #222; outline:none;}


/* button */
div.btn-wrap{display:flex; align-items:center; justify-content:center; margin-top:4rem;}
div.btn-wrap .kc-btn{margin:0 0.5rem;}
.kc-btn{display:inline-block; font-size:1.125rem; padding:0.8rem 1.6rem; transition:0.3s; -webkit-transition:0.3s; font-family:'NanumNeo_B',sans-serif;}
.kc-btn[class*="--sm"]{font-size:1rem; padding:0.4rem 0.8rem;}
.kc-btn[class*="--lg"]{font-size:1.3rem; padding:1rem 2rem; font-family:'NanumNeo_EB',sans-serif;}
.kc-btn[class*="fill"]{color:#fff; background:#222;}
.kc-btn[class*="fill01"]{background:var(--color-main01);}
.kc-btn[class*="fill02"]{background:var(--color-main02);}
.kc-btn[class*="fill03"]{background:var(--color-main03);}
.kc-btn[class*="fill04"]{background:var(--color-main04);}
.kc-btn[class*="fill05"]{background:var(--color-main05); color:#222;}
.kc-btn[class*="fillWH"]{background:#fff; color:#222;}
.kc-btn[class*="outline"]{border:1px solid #222; position:relative; overflow:hidden; z-index:1;}
.kc-btn[class*="outline01"]{border-color:var(--color-main01); color:var(--color-main01);}
.kc-btn[class*="outline02"]{border-color:var(--color-main02); color:var(--color-main02);}
.kc-btn[class*="outline03"]{border-color:var(--color-main03); color:var(--color-main03);}
.kc-btn[class*="outline04"]{border-color:var(--color-main04); color:var(--color-main04);}
.kc-btn[class*="outline05"]{border-color:var(--color-main05); color:var(--color-main05);}
.kc-btn[class*="outlineWH"]{border-color:#fff; color:#fff;}
.kc-btn[class*="outline"]:before{content:''; display:block; width:100%; height:100%; background:#222; position:absolute; top:0; left:-100%; transition:0.3s; -webkit-transition:0.3s; z-index:-1;}
.kc-btn[class*="outline01"]:before{background:var(--color-main01);}
.kc-btn[class*="outline02"]:before{background:var(--color-main02);}
.kc-btn[class*="outline03"]:before{background:var(--color-main03);}
.kc-btn[class*="outline04"]:before{background:var(--color-main04);}
.kc-btn[class*="outline05"]:before{background:var(--color-main05);}
.kc-btn[class*="outlineWH"]:before{background:#fff;}
.kc-btn.form{background:#333; color:#fff; font-size:1rem;}
.kc-btn.cancel{background:#727272; color:#fff; border:1px solid #b2b2b2;}
.kc-btn.confirm{color:#222; border:1px solid #222; position:relative; overflow:hidden;}
.kc-btn.confirm:before{content:''; display:block; width:100%; height:100%; background:#222; position:absolute; top:0; left:-100%; z-index:-1; transition:0.3s; -webkit-transition:0.3s;}
.kc-btn.list{border:1px solid #222; padding:1rem 2.6rem; position:relative; overflow:hidden;}
.kc-btn.list:before{content:''; display:block; width:100%; height:100%; background:#222; position:absolute; top:0; left:-100%; z-index:-1; transition:0.3s; -webkit-transition:0.3s;}
.kc-btn.write{position:relative; padding:1.2rem 1.8rem; padding-left:3.8em;}
.kc-btn.write:before{content:''; display:block; width:1.2em; height:1.2em; position:absolute; top:50%; transform:translateY(-50%); left:1.5em; background:url("/fro_end/img/bbs_write.svg")center/100% auto no-repeat;}
.kc-btn.link{border:1px solid #333; padding-right:3.2rem; position:relative; overflow:hidden;}
.kc-btn.link:before{content:''; display:block; width:100%; height:100%; background:#222; position:absolute; top:0; left:-100%; z-index:-1; transition:0.3s; -webkit-transition:0.3s;}
.kc-btn.link:after{content:''; display:block; width:1em; height:1em; background:url("/fro_end/img/ic_arrow.svg")center/100% auto no-repeat; position:absolute; top:0.8rem; right:1.2rem;}
.kc-btn.download-tag{font-size:1rem; padding:0.25rem 0.8rem; border:1px solid #333; background:#fff; border-radius:50px; padding-right:2.2rem; position:relative; overflow:hidden; z-index:1; vertical-align:middle;}
.kc-btn.download-tag:before{content:''; display:block; width:100%; height:100%; background:#333; position:absolute; top:0; left:-100%; z-index:-1; transition:0.3s; -webkit-transition:0.3s;}
.kc-btn.download-tag:after{content:''; display:block; width:0.9em; height:0.9em; background:url("/fro_end/img/ic_download.svg")center/100% auto no-repeat; position:absolute; top:0.5rem; right:0.8rem; z-index:1; transition:0.3s; -webkit-transition:0.3s;}
@media(hover:hover){
	.kc-btn[class*="fill"]:hover,
	.kc-btn.write:hover{transform:translateY(-5px); box-shadow:0 8px 15px rgba(0,0,0,0.2);}
	.kc-btn[class*="outline"]:hover{color:#fff;}
	.kc-btn[class*="outline05"]:hover{color:#222;}
	.kc-btn[class*="outlineWH"]:hover{color:#222;}
	.kc-btn[class*="outline"]:hover:before{left:0;}
	.kc-btn.confirm:hover{color:#fff;}
	.kc-btn.confirm:hover:before{left:0;}
	.kc-btn.list:hover{color:#fff;}
	.kc-btn.list:hover:before{left:0;}
	.kc-btn.link:hover{color:#fff;}
	.kc-btn.link:hover:before{left:0;}
	.kc-btn.link:hover:after{background-image:url("/fro_end/img/ic_arrow_wh.svg");}
	.kc-btn.download-tag:hover{color:#fff; box-shadow:3px 5px 15px rgba(0,0,0,0.3);}
	.kc-btn.download-tag:hover:before{left:0;}
	.kc-btn.download-tag:hover:after{background-image:url("/fro_end/img/ic_download_wh.svg");}
}


/* table */
.BR{border-right:1px solid #ccc !important;}
.table-mob-scroll{display:none; font-size:12px; color:#6f6f6f; letter-spacing:-0.5px; font-family:'NanumNeo_B', sans-serif; margin-bottom:0.25rem; position:relative; padding-left:2.5em;}
.table-mob-scroll:before{content:''; display:block; width:1.6em; height:1.6em; animation:moveSwipe 2s linear infinite; background:url("/fro_end/img/table_mob_scroll.svg")center/100% auto no-repeat; position:absolute; top:50%; left:0; transform:translateY(-50%);}
@keyframes moveSwipe{
	0%{left:0;}
	50%{left:8px;}
	100%{left:0;}
}
div.table-wrap{overflow-x:auto; overflow-y:hidden;}
table.table01{width:100%; text-align:center;}
table.table01 tr{border-bottom:1px solid #ccc;}
table.table01 th{padding:1rem; border-right:1px solid #ccc;}
table.table01 td{padding:1rem; border-right:1px solid #ccc; background:#fff;}
table.table01 td:last-of-type{border-right:none;}
table.table01 tbody th{background:#f3f4ef;}
table.table01 thead th{background:var(--color-main02); color:#fff;}
table.table01 thead td{background:#f3f4ef; font-weight:bold;}
table.table01 thead tr th:last-child{border-right:none;}
table.table01.hor{border-top:1px solid #ccc;}
table.table01.hor tbody td{text-align:left;}

/* layout */
.lay-flex{display:flex; align-items:center;}
.lay-flex .lay-bar{display:inline-block; padding:0 0.8rem;}
.lay-flex .lay-bar.sm{padding:0 0.4rem;}
.lay-flex .wid3{width:3rem;}
.lay-flex .wid5{width:5rem;}
.lay-flex .wid10{width:10rem;}
.lay-flex .wid20{width:20rem;}


.mt0{margin-top:0;}
.mt0d5{margin-top:0.5rem;}
.mt1{margin-top:1rem;}


@media screen and (max-width:1600px){
	.w1600{width:90%;}
}


@media screen and (max-width:1440px){
	.w1440{width:90%;}
}


@media screen and (max-width:1280px){
	.w1280{width:90%;}
}


@media screen and (max-width:1024px){
	html,body{font-size:15px;}
	.w1600{width:92%;}
	.w1440{width:92%;}

	.file-lab{width:80%;}
	
	/* table */
	table.table01 th{padding:0.8rem;}
	table.table01 td{padding:0.8rem;}
}

@media screen and (max-width:800px){
	
	label.c-input.ci-check div.ci-show:after{left:6px; top:3px;}

}

@media screen and (max-width:640px){
	
	input[type="text"], 
	input[type="email"], 
	input[type="number"], 
	input[type="password"]{height:2.8rem; line-height:2.8rem;}
	select{height:2.8rem; line-height:2.8rem;}
	
	/* label */
	label.n-input div.ci-show{padding:0.7rem 1.2rem;}
	
	/* layout */
	.lay-flex .lay-bar{padding:0 0.35rem;}
	
	/* button */
	div.btn-wrap{margin-top:3rem;}
	.kc-btn{font-size:1rem; padding:0.6rem 1.2rem;}
	.kc-btn[class*="--sm"]{font-size:0.9rem; padding:0.4rem 0.8rem;}
	.kc-btn[class*="--lg"]{font-size:1.2rem; padding:0.8rem 1.2rem;}
	
	/* table */
	table.table01{font-size:0.9rem;}

}


@media screen and (max-width:480px){
	html,body{font-size:14px;}
	.on480{display:block !important;}
	input{font-size:1rem;}

	.file-lab{width:100%;}
	
	/* label */
	label.c-input.ci-check div.ci-show:after{width:3px; height:7px;}

	/* button */
	div.btn-wrap{margin-top:2rem;}

	/* table */
	table.table01{font-size:0.8rem;}
	table.table01 th{padding:0.5rem;}
	table.table01 td{padding:0.5rem;}
}
@media screen and (max-width:400px){
	/* table */
	.table-mob-scroll{display:block;}
}