@charset "utf-8";
/* CSS Document */

/* 영역구분 */
#wrap {position:relative; width:100%; margin:0 auto; text-align:center;}
.wrap {display:inline-block; vertical-align:middle; position:relative; box-sizing:border-box; width:100% !important; max-width:1920px; margin:0 auto; padding:0 60px;}
.preview {display:inline-block; vertical-align:middle; position:relative; width:100% !important; margin:0 auto; font-size:0; line-height:0;}
.preview img {display:inline-block; vertical-align:middle; max-width:100%;}
.nopd {width:calc(100% + 120px); margin-left:-60px;}
.no-transition *,
.no-transition *:before,
.no-transition *:after {transition:none !important; transition-delay:none !important;}
/*body.no-scroll {overflow: hidden;}*/
:root {
	--black:#111327;
	--black10:#1114261A;
	--white:#FFFFFF;
	--yellow:#FEE608;
	--blue:#0119F7;
	--mixblue:#FDCDFF;
	--gray:#F2F2F6;
	--gray_t1:#aaa;
	--gray_t2:#7C7C7C;
	--red:#FF0000;
	--purple:#9F79F2;
	--basic:#E3E3E2; 
	/* --basic:#E3E3E2; -- #E3E3E2 #D4D4D4 */
}

/* 모바일 */
.mobile-only {display:none !important;}


/* 컬러 */
.cm {color:var(--yellow) !important;}	/* 메인 */
.cs {color:var(--black) !important;}	/* 서브 */
.cw {color:var(--white) !important;}
.cb {color:var(--blue) !important;}
.cg {color:var(--gray) !important;}
.cr {color:var(--red) !important;}
.cg_t1 {color:var(--gray_t1) !important;}
.cg_t2 {color:var(--gray_t2) !important;}


/* 타이틀 */
.title {font-family:'Saira', Pretendard, sans-serif; font-size:40px; color:var(--black); line-height:60px; word-wrap:normal; word-break:keep-all;}
.title.thin, .title .thin {font-weight:100;}
.title.semilight, .title .semilight {font-weight:200;}
.title.light, .title .light {font-weight:300;}
.title.medium, .title .medium {font-weight:500;}
.title.semibold, .title .semibold {font-weight:600;}
.title.bold, .title .bold {font-weight:700;}
.title.extrabold, .title .extrabold {font-weight:800;}
.title.black, .title .black {font-weight:900;}
.title.t1, .title .t1 {font-size:90px; line-height:100px;}
.title.t2, .title .t2 {font-size:60px; line-height:80px; letter-spacing:-1.2px}
.title.t3, .title .t3 {font-size:50px; line-height:70px; letter-spacing:-1px}
.title span {display:inline-block; position:relative;}
.title > span {display:inline-block; float:left; vertical-align:middle; width:100%;}


/* 텍스트 */
.text {font-family:'Saira', Pretendard, sans-serif; font-size:16px; color:var(--black); font-weight:400; line-height:30px; letter-spacing:-0.32px; word-wrap:normal; word-break:keep-all;}
.text.word, .text .word {word-break:break-all;}
.text.thin, .text .thin {font-weight:100;}
.text.semilight, .text .semilight {font-weight:200;}
.text.light, .text .light {font-weight:300;}
.text.medium, .text .medium {font-weight:500;}
.text.medium, .text .medium {font-weight:500;}
.text.semibold, .text .semibold {font-weight:600;}
.text.bold, .text .bold {font-weight:700;}
.text.extrabold, .text .extrabold {font-weight:800;}
.text.black, .text .black {font-weight:900;}
.text.giant, .text .giant {font-size:25px; line-height:40px; letter-spacing:-1px;}
.text.big, .text .big {font-size:20px; line-height:30px; letter-spacing:-0.4px;}
.text.small, .text .small {font-size:12px; letter-spacing:0;}
.text.small.t1 {line-height:20px;}
.text a {color:#111427;}
.text.cw a, .text .cw a {color:#fff;}
.text a:hover {color:#111427; text-decoration:underline; text-decoration-color:#ffe618;}
.text img {display:inline-block; vertical-align:middle; max-width:100%; margin:0;}
.text span {display:inline-block; position:relative;}
.text > span {display:inline-block; float:left; vertical-align:middle; width:100%;}
.text input {display:inline-block; vertical-align:middle;}
.text label {cursor:pointer;}
.text u {text-decoration:none; border-bottom:rgba(255, 255, 255, 0.1) solid 2px;}
.overflow {min-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break:break-all;}


/* 서식 */
.template {display:inline-block; vertical-align:middle; width:100%; text-align:left; word-wrap:normal; word-break:keep-all;}
.template > h4 {display:block; position:relative; width:auto; margin-top:30px; padding-left:20px; font-size:20px; font-weight:500; color:#111427; line-height:30px;}
.template > h4:first-child {margin-top:0;}
.template > h4:before {content:""; display:inline-block; vertical-align:middle; position:absolute; left:0; top:8px; width:6px; height:6px;border-radius:50%; border:#ffe618 solid 3px;}
.template > strong {display:block; position:relative; width:auto; margin-top:20px; margin-left:25px; font-size:14px; font-family:'Montserrat', Noto Sans KR, sans-serif; font-weight:500; color:#777; line-height:24px;}
.template > p {display:block; position:relative; width:auto; margin-top:10px; margin-left:25px; font-size:14px; font-family:'Montserrat', Noto Sans KR, sans-serif; font-weight:400; color:#777; line-height:24px;}
.template > .box {margin-top:20px; margin-left:25px; padding:20px 25px; border:#e6e6e6 solid 1px; background-color:#f9f9f9; font-size:14px; font-family:'Montserrat', Noto Sans KR, sans-serif; font-weight:400; color:#777; line-height:24px;}
.template strong {font-weight:500; color:#111427;}
.template a {color:#111427;}
.template a:hover {text-decoration:underline; text-decoration-color:rgba(0, 174, 239, 0.7);}
.template > ul {display:block; position:relative; width:auto; margin-top:10px; margin-left:25px; font-size:14px; font-family:'Montserrat', Noto Sans KR, sans-serif; font-weight:400; color:#777; line-height:24px;}
.template > ul > li {position:relative; margin:5px 0; padding-left:10px;}
.template > ul > li:before {content:""; position:absolute; left:0px; top:11px; width:3px; height:3px; border-radius:50%; background-color:#999;}
.template > ul > li > ul {display:block; position:relative; width:auto; margin:5px 15px; font-size:12px; font-family:'Montserrat', Noto Sans KR, sans-serif; font-weight:400; color:#999; line-height:22px;}
.template > ul > li > ul > li {position:relative; padding-left:10px;}
.template > ul > li > ul > li:before {content:""; position:absolute; left:0px; top:11px; width:4px; height:1px; background-color:#999;}
.template > ul > li > p {display:block; position:relative; width:auto; margin:5px 15px; padding-left:10px; font-size:12px; font-family:'Montserrat', Noto Sans KR, sans-serif; font-weight:400; color:#999; line-height:22px;}
.template > ul > li > p:before {content:""; position:absolute; left:0px; top:10px; width:4px; height:1px; background-color:#999;}
.template > .table {margin-top:10px; margin-left:25px;}


/* 탭 */
.tab {display:inline-block; vertical-align:middle; width:100%;}
.tab ul {display:inline-block; vertical-align:middle; width:100%; width:calc(100% + 20px); margin-left:-10px;}
.tab li {display:inline-block; vertical-align:middle; float:left; width:100%;}
.tab.div2 li {width:50%;} .tab.div3 li {width:33.333%;} .tab.div4 li {width:25%;} .tab.div5 li {width:20%;} .tab.div6 li {width:16.666%;} .tab.div7 li {width:14.285%;} .tab.div8 li {width:12.5%;} .tab.div9 li {width:11.111%;} .tab.div10 li {width:10%;}
.tab a {display:block; height:40px; margin:0 10px; padding:0px 10px; border-radius:3px; background-color:#fff; font-size:13px; font-family:'Montserrat', Noto Sans KR, sans-serif; font-weight:900; color:#111427; line-height:40px; text-align:center; overflow:hidden; text-overflow:ellipsis; word-break:break-all; box-shadow:0 20px 40px rgba(17, 20, 39, 0.10); transition:0.2s; -webkit-transition:0.2s;}
.tab a:hover {background-color:#111427; color:#ffe618;}
.tab a.on {background-color:#ffe618; color:#111427;}


/* 분류 */
.sort {padding:10px; background-color:#f5f6f9; border-radius:20px;}
.sort ul {display:inline-block; vertical-align:middle; width:100%;}
.sort li {display:inline-block; vertical-align:middle; float:left; margin:5px;}
.sort input {display:none;}
.sort label {cursor:pointer;}
.sort label span {display:inline-block; vertical-align:middle; padding:0 15px; border-radius:20px; background-color:#fff; font-size:11px; font-family:'Montserrat', Noto Sans KR, sans-serif; font-weight:600; color:#111427; line-height:24px; box-shadow:0 5px 10px rgba(17, 20, 39, 0.04);}
.sort label span:hover {background-color:#c0dae9;}
.sort input:checked + label span {background-color:#111427; color:#ffe618;}


/* 박스 */
.box {position:relative; background-color:#fff; box-shadow:0 50px 100px rgba(17, 20, 39, 0.20);}


/* 꾸밈요소 */
.deco {display:inline-block; vertical-align:middle; position:relative;}
.deco:before {content:""; position:absolute; left:0; right:0; bottom:5px; height:8px; border-radius:1px; background-color:#fff079;}
.deco mark {position:relative; z-index:1;}

.bar {position:relative; padding-top:20px;}
.bar:before {content:""; position:absolute; left:0; top:0; width:40px; height:5px; border-radius:1px; background-color:#ffe618;}

.marker {position:relative;}
.marker:before {content:""; position:absolute; left:0; right:0; bottom:0; height:6px; border-radius:1px; background-color:#fff079;}
.marker mark {position:relative; z-index:1;}

.bullet {position:relative;}
.bullet li {position:relative; padding-left:15px;}
.bullet li:before {content:""; position:absolute; left:0; top:10px; width:4px; height:4px; border-radius:1px; background-color:#838993;}

/* checkbox */
.checkbox {display:flex; position:relative; align-items:center; cursor:pointer;}
.checkbox input {position:absolute; left:0; top:0; width:30px; aspect-ratio:1/1; padding:0; border:0; overflow:hidden; clip-path:inset(50%);}
.checkbox input:focus + span:before {outline:2px dashed var(--blue);}
.checkbox > span {display:flex; position:relative; align-items:flex-start; font-weight:400; word-break:keep-all; text-align:left;}
.checkbox:hover > span i {border-color:rgba(1, 25, 247, 1)}
.checkbox:hover > span i::before {opacity:1}
.checkbox > span i {display:flex; align-items:center; justify-content:center; flex-shrink:0; position:relative; width:30px; aspect-ratio:1/1; margin-right:20px; border-radius:5px; border:3px solid rgba(1, 25, 247, 0.5); box-sizing:border-box; transition:0.2s}
.checkbox > span i::before {opacity:.5; content:""; width:24px; background-image:url("../images/common/icon_check.svg"); background-repeat:no-repeat; background-size:100% auto; aspect-ratio:1/1;}
.checkbox input:checked + span {font-weight:600}
.checkbox input:checked + span i {background-color:var(--blue); box-shadow:0 10px 20px 0 rgba(1, 25, 247, 0.20)}
.checkbox input:checked + span i::before {opacity:1; background-image:url("../images/common/icon_check_y.svg");}

.checkbox.t1 input {width:30px; height:30px;}
.checkbox.t1 > span {font-size:16px; line-height:30px; white-space:nowrap;}
.checkbox.t1 > span b {opacity:0.3;}
.checkbox.t1 > span mark {text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:2px;}
.checkbox.t1 > span i {width:30px; height:30px; margin-right:15px; border-color:rgba(0, 0, 0, 0.5);}
.checkbox.t1:hover > span i {border-color:rgba(0, 0, 0, 0.9)}
.checkbox.t1 input:checked + span i {background-color:rgba(0, 0, 0, 0.9); box-shadow:0 10px 20px 0 rgba(0, 0, 0, 0.20)}
.checkbox.t1 > span i::before {background-image:url("../images/common/icon_check_b.svg");}
.checkbox.t1 input:checked + span i::before {opacity:1; background-image:url("../images/common/icon_check_w.svg");}

	/* radio */
.radio {display:flex; align-items:center; gap:20px; cursor:pointer;}
.radio span {position:relative; align-items:flex-start; font-size:20px; font-weight:400; line-height:30px; letter-spacing:-0.4px; word-break:keep-all; text-align:left;}
/*.radio:hover span {text-decoration:underline; text-underline-position:under; font-weight:600;}*/
.radio:hover input {border-color:rgba(1, 25, 247, 1)}
.radio input {display:inline-block;vertical-align:middle;position:relative; box-sizing:border-box; width:30px; height:30px; border-radius:50%; border:3px solid rgba(1, 25, 247, 0.5); appearance:none;aspect-ratio:1/1; transition:0.1s}
.radio input:checked {border-color:var(--blue); border-width:9px; box-shadow:0 10px 20px 0 rgba(1, 25, 247, 0.20)}
.radio input:checked + span {font-weight:600}
.radio span + input {margin-left:20px;}
.radio + .f_input {margin-left:20px}

.fc_input span,
.fr_input span {white-space:nowrap;}
.fc_input.type01 {width:118px;}
.fc_input.type02,
.fc_input.type08 {width:94px;}
.fc_input.type03 {width:124px;}
.fc_input.type04,
.fc_input.type05 {width:80px;}
.fc_input.type06,
.fc_input.type11 {width:66px;}
.fc_input.type07 {width:98px;}
.fc_input.type09 {width:118px;}
.fc_input.type10 {width:182px;}
.fr_input.type01 {width:146px;}
.fr_input.type02 {width:132px;}
.fr_input.type03 {width:118px;}
.fr_input.type04 {width:122px;}
.fr_input.type05,
.fr_input.type06,
.fr_input.type08 {width:108px;}
.fr_input.type07 {width:94px;}

/* form */
form .f_title {display:flex; align-items:center; flex-wrap:wrap; gap:30px; width:100%; margin-bottom:20px; }
form .f_title span {width:auto}
form .f_title span a {text-decoration:underline; text-underline-position:from-font}
form .f_title span a .autotext:before, form .f_title span a .autotext:after {text-decoration:underline; text-underline-position:from-font}
form .f_title span a:hover span:before {top:-30px;}
form .f_title span a:hover span:after {top:0;}
form .f_title label.required::after {content:"*"; margin-left:8px; color:var(--blue);}
form .f_content {display:flex; gap:60px; flex-wrap:wrap; box-sizing:border-box; min-height:60px; padding:5px 0}
form .f_content.t1 {row-gap:30px}
form .f_textarea {position:relative; width:100%; box-sizing:border-box; border:1px solid rgba(17, 20, 38, 0.20); border-radius:5px;}
form .f_field + .f_field {margin-top:80px}
form .f_content.div3 {flex-wrap:wrap}
form .f_content.div3 > div {width:calc((100% - 120px) /3 )}
form .f_input {position:relative}
form .f_input.t1 input::placeholder {color:transparent}
form .f_input .fi_placeholder {display:flex; align-items:center; gap:5px; position:absolute; left:5px; bottom:11px; pointer-events:none}
form .f_input .fi_placeholder span {font-weight:500}
form .f_input > label {display:none; position:relative; padding-left:14px}
form .f_input > label:before {content:""; position:absolute; left:0; top:50%; width:4px; height:4px; margin-top:-2px; border-radius:50%; background-color:var(--black);}
form .f_content.f_file {flex-direction:column; align-items:flex-start; gap:0;}
form .f_flex {display:flex}
form .f_file > ul {width:100%}
form .f_file > ul li {display:flex; gap:10px; position:relative; padding:10px 0; margin-bottom:30px; border-bottom:1px solid rgba(17, 20, 38, 0.2);}
form .f_file > ul li span.big {overflow: hidden; max-width:calc(100% - 150px); white-space:nowrap; text-overflow:ellipsis; word-break:break-all;}
form .f_file .f_delbtn {display:block; position:absolute; top:50%; right:5px; width:24px; aspect-ratio:1/1; margin-top:-12px; background:url("../images/common/icon_close.svg"); background-size:100%; transition:0.2s}
form .f_file .f_delbtn:hover {transform:rotate(90deg)}
form .f_flex input:disabled {opacity:0; pointer-events:none;}
form .f_filebtn {display:flex;}
form .f_filebtn input[type=file] {display:none}
form .f_filebtn label {display:flex; align-items:center; gap:10px; position:relative; box-sizing:border-box; padding:10px 20px 10px 25px; border:1px solid var(--black); border-radius:5px; cursor:pointer; transition:0.2s}
form .f_filebtn label i {width:16px; aspect-ratio:1/1; background:url("../images/common/icon_plus.svg") center center no-repeat; background-size:100%; transition:0.2s}
form .f_filebtn label:hover i {transform:rotate(90deg)}
form .f_filebtn label:before {content:""; display:block; position:absolute; top:0; left:0; width:calc(100% - 2px); height:calc(100% - 2px); border:1px solid transparent; border-radius:4px; transition:0.3s}
form .f_filebtn label:hover:before {border-color:var(--black)}


.input {width:100%; box-sizing:border-box; padding:10px 5px; border:none; border-bottom:1px solid rgba(17, 20, 38, 0.2); background:none; font-weight:500; transition:0.2s}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	transition: background-color 5000s ease-in-out 0s;
	-webkit-transition: background-color 9999s ease-out;
	-webkit-box-shadow: 0 0 0 1000px #fff0 inset !important;
	-webkit-text-fill-color: var(--black) !important;
}
.input:hover {border-color:rgba(17, 20, 38, 1)}
.input + span {display:block; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--black); transition:0.3s}
.input::placeholder {color:var(--black)}
.input:focus {outline:none}
.input:focus + span {width:100%}
.select {display:block; vertical-align:middle; position:relative; box-sizing:border-box; width:100%; height:50px; margin:0; padding:0 15px; -webkit-appearance:none; -moz-appearance:none; appearance:none; border:none; border-radius:3px; background-color:#fff; background-image:url("../images/common/icon_arrow_select.png"); background-image:url("../images/ie/icon_arrow_select.png")\9; background-repeat:no-repeat; background-size:7px 4px; background-position:right 15px center;
	font-size:14px; color:#111427; letter-spacing:0px; line-height:50px; text-align:left; box-shadow:0 20px 40px rgba(17, 20, 39, 0.1); transition:0.2s; -webkit-transition:0.2s;}
.select:hover {background-color:#ffe618;}
.select::-ms-expand {opacity:0;}
.file {display:block; vertical-align:middle; box-sizing:border-box; width:100%; height:50px; margin:0; padding:10px 0; -webkit-appearance:none; -moz-appearance:none; appearance:none; border:none; border-radius:3px; background-color:#fff;
	font-size:14px; color:#111427; letter-spacing:0; line-height:30px; text-align:left; text-indent:5px; box-shadow:0 20px 40px rgba(17, 20, 39, 0.1); transition:0.2s; -webkit-transition:0.2s;}
.file:hover {background-color:#ffe618;}
.textarea {width:100%; box-sizing:border-box; min-height:250px; padding:20px 25px; margin-bottom:40px; border:none; background:none; resize:none; font-weight:500;}
.textarea::placeholder {color:var(--black)}
.textarea:focus {outline:none}
.textarea + .f_count {position:absolute; right:25px; bottom:10px;}
.textarea + .f_count span {width:auto; margin-right:3px}


/* 버튼 */
.btn_wrap {display:flex;}
.btn {overflow:hidden; display:flex; align-items:center; gap:10px; position:relative; box-sizing:border-box; padding:18px 35px 18px 40px; border:2px solid var(--black); border-radius:5px; background-color:var(--black); font-size:20px; font-weight:600; color:var(--yellow); line-height:30px; letter-spacing:-0.4px; transition:0.7s; -webkit-transition:0.3s;}
.btn i {position:relative; width:24px; aspect-ratio:1/1; background:url("../images/common/icon_right_small.svg") left center repeat; background-size:auto 100%; transition:0.3s ease}
.btn:hover i {background-position:left -100% center}
.btn span {position:relative}
.btn:hover {color:var(--black);}
.btn:before {content:""; position:absolute; top:50%; left:50%; width:2px; height:2px; background:var(--yellow); border-radius:100%; transform:translate(-50%,-50%) scale(0); transition:transform 0.4s ease}
.btn:hover:before {transform:translate(-50%,-50%) scale(200); transition:transform 0.5s ease}
.btn.t1 {background-color:var(--yellow); border-color:var(--yellow); color:var(--black);}
.btn.t1 i {background:url("../images/common/icon_right_small.svg") right center repeat;}


/* 페이징 */
.paging {display:inline-block; vertical-align:middle; width:100%; margin-top:40px; text-align:center;}
.paging ul {display:inline-block; vertical-align:middle;}
.paging li {display:inline-block; vertical-align:middle; float:left;}
.paging a {display:inline-block; vertical-align:middle; min-width:30px; height:40px; margin:5px; padding:0 5px; border-radius:3px; background-color:#fff; font-size:12px; font-family:'Montserrat', Noto Sans KR, sans-serif; font-weight:600; color:#111427; line-height:40px; text-align:center; overflow:hidden; text-overflow:ellipsis; word-break:break-all; box-shadow:0 20px 40px rgba(17, 20, 39, 0.10); transition:0.2s; -webkit-transition:0.2s;}
.paging a:hover {background-color:#111427; color:#ffe618;}
.paging a.on {background-color:#ffe618; font-weight:900; color:#111427;}


/* 팝업 */
.popup {position:fixed; left:0; right:0; top:-100%; bottom:100%; z-index:999999; width:auto !important; height:auto !important; background:rgba(17, 26, 39, 0.9);}
.popup.on {top:0; bottom:0;}
.popup .p_close {display:inline-block; vertical-align:middle; position:fixed; left:50%; top:-100px; z-index:9999; overflow:hidden; width:60px; height:60px; margin-left:-30px; border-radius:30px; background-color:#ffe618; box-shadow:0 20px 40px rgba(17, 20, 39, 0.15); transform:scale(1); transition:0.3s; -webkit-transition:0.3s;}
.popup .p_close:before {content:""; display:inline-block; vertical-align:middle; position:absolute; left:50%; top:50%; width:18px; height:2px; margin-top:-1px; margin-left:-8px; border-radius:2px; background-color:#111427; transform:rotate(45deg); -ms-transform:rotate(45deg); transition:0.2s; -webkit-transition:0.2s;}
.popup .p_close:after {content:""; display:inline-block; vertical-align:middle; position:absolute; left:50%; top:50%; width:18px; height:2px; margin-top:-1px; margin-left:-8px; border-radius:2px; background-color:#111427; transform:rotate(135deg); -ms-transform:rotate(135deg); transition:0.2s; -webkit-transition:0.2s;}
.popup .p_close:hover {background-color:#111427; box-shadow:0 30px 60px rgba(17, 20, 39, 0.5); transform:scale(1.4);}
.popup .p_close:hover:before {background-color:#ffe618; transform:rotate(135deg); -ms-transform:rotate(135deg);}
.popup .p_close:hover:after {background-color:#ffe618; transform:rotate(225deg); -ms-transform:rotate(225deg);}
.popup.on .p_close {top:120px;}
.popup .p_box {display:inline-block; vertical-align:middle; position:absolute; left:150px; right:150px; top:150px; bottom:150px; z-index:2; overflow:auto; width:auto; height:auto; border-radius:5px; background-color:#fff; box-shadow:0 30px 90px rgba(0, 0, 0, 0.5); transform:scale(0.8); transition:0.4s; -webkit-transition:0.4s;}
.popup.on .p_box {transform:scale(1);}
.popup .p_wrap {padding:90px 100px; transition:0.3s; -webkit-transition:0.3s;}
.popup .p_out {position:absolute; left:0; right:0; top:0; bottom:0; z-index:1; cursor:default;}
.popup .p_head {display:inline-block; vertical-align:middle; width:100%; margin-bottom:30px;}
.popup .p_body {display:inline-block; vertical-align:middle; width:100%;}
.popup .p_title {display:inline-block; vertical-align:middle; position:relative; width:100%; padding-top:20px; font-family:'Montserrat', Noto Sans KR, sans-serif; font-size:30px; font-weight:700; color:#111427; line-height:40px; letter-spacing:-1px;}
.popup .p_title:before {content:""; position:absolute; left:0; top:0; width:40px; height:5px; border-radius:1px; background-color:#111427;}
.popup .p_body .p_left {box-sizing:border-box; width:50%; float:left;}
.popup .p_body .p_right {box-sizing:border-box; width:50%; float:right; padding-left:50px;}

.pop {display:flex; justify-content:center; align-items:center; position:fixed; left:0; right:0; top:0; bottom:0; z-index:1000; pointer-events:none; opacity:0; transition:0.3s;}
.pop.on {opacity:1;}
.pop .p_wrap {display:inline-block; position:relative; overflow:hidden; width:calc(100% - 60px); max-width:720px; height:calc(100% - 60px); max-height:956px; border-radius:25px; background-color:var(--gray);}
.pop.on .p_wrap {pointer-events:auto;}
.pop .p_bg {position:absolute; left:0; right:0; top:0; bottom:0; background-color:var(--black); opacity:0.8;}
.pop.on .p_bg {pointer-events:auto; cursor:pointer;}
.pop .p_wrap:before {content:""; position:absolute; left:0; right:0; top:0; bottom:0; z-index:1; background-image:url("../images/pic_plastic01_mo.png"); background-repeat:no-repeat; background-size:100% 100%; pointer-events:none;}
.pop .p_head {display:flex; justify-content:space-between; position:absolute; left:0; right:0; box-sizing:border-box; padding:10px 20px;}
.pop .p_head:before {content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background-color:var(--black); opacity:0.1;}
.pop .p_head strong {display:flex; gap:4px; font-size:12px; font-weight:600; color:var(--black); line-height:30px; letter-spacing:-0.5px;}
.pop .p_head strong .ph_back {display:flex; align-items:center; position:relative; width:30px; height:30px;}
.pop .p_head strong .ph_back i {overflow:hidden; position:relative; width:24px; height:24px;}
.pop .p_head strong .ph_back i:before {content:""; position:absolute; left:150%; top:50%; width:24px; height:24px; margin-left:-12px; margin-top:-12px; background-image:url("../images/common/icon_back.svg"); background-repeat:no-repeat; background-size:100%; transition:0.3s;}
.pop .p_head strong .ph_back i:after {content:""; position:absolute; left:50%; top:50%; width:24px; height:24px; margin-left:-12px; margin-top:-12px; background-image:url("../images/common/icon_back.svg"); background-repeat:no-repeat; background-size:100%; transition:0.3s;}
.pop .p_head strong .ph_back:hover i:before {left:50%;}
.pop .p_head strong .ph_back:hover i:after {left:-100%;}
.pop .p_head .ph_btn {display:flex; justify-content:center; align-items:center; width:30px; height:30px;}
.pop .p_head .ph_btn i {display:inline-block; position:relative; width:12px; height:12px; transform:rotate(45deg); transition:0.3s;}
.pop .p_head .ph_btn:hover i {transform:rotate(135deg);}
.pop .p_head .ph_btn i:before {content:""; position:absolute; left:0; right:0; top:50%; height:2px; border-radius:2px; background-color:var(--black);}
.pop .p_head .ph_btn i:after {content:""; position:absolute; left:0; right:0; top:50%; height:2px; border-radius:2px; background-color:var(--black); transform:rotate(90deg);}
.pop .p_body {overflow:auto; position:absolute; left:0; right:0; top:50px; bottom:0; box-sizing:border-box; padding:40px; text-align:left;}
.pop .p_body .pb_list {display:flex; flex-wrap:wrap; gap:30px; width:100%;}
.pop .p_body .pb_list > li {display:flex; gap:5px; position:relative; flex-wrap:wrap; box-sizing:border-box; width:100%; padding-left:48px;}
.pop .p_body .pb_list > li > i {display:flex; justify-content:center; align-items:center; position:absolute; left:0; top:0; width:36px; height:36px; border-radius:100%; background-color:rgba(17, 20, 38, 0.06);}
.pop .p_body .pb_list > li > i > i {display:inline-block; width:20px; height:20px; background-image:url("../images/common/icon_agreement.svg"); background-size:100% auto; background-position:center 0; opacity:0.8;}
.pop .p_body .pb_list > li:nth-child(2) > i > i {background-position:center -20px;}
.pop .p_body .pb_list > li:nth-child(3) > i > i {background-position:center -40px;}
.pop .p_body .pb_list > li:nth-child(4) > i > i {background-position:center -60px;}
.pop .p_body .pb_list > li:nth-child(5) > i > i {background-position:center -80px;}
.pop .p_body .pb_list > li strong {font-size:20px; font-weight:600; color:var(--black); line-height:36px; letter-spacing:-0.4px; word-break:keep-all;}
.pop .p_body .pb_list > li .pb_box {display:inline-block; width:100%; font-size:16px; font-weight:300; line-height:30px; letter-spacing:-0.5px; word-break:keep-all;}
.pop .p_body .pb_list > li p {display:inline-block; width:100%; }
.pop .p_body .pb_list > li p > span {display:inline-block; width:100%;}
.pop .p_body .pb_list > li ul {display:inline-block; width:100%;}
.pop .p_body .pb_list > li ul li {position:relative; padding-left:25px;}
.pop .p_body .pb_list > li ul li:before {content:""; position:absolute; left:10px; top:13px; width:3px; height:3px; border-radius:50%; background-color:var(--black);}
#contents_form_chatbot {width:100%;}
.pop.p_chatbot {justify-content:flex-end; align-items:flex-end; box-sizing:border-box; padding:60px;}
.pop.p_chatbot .p_wrap {width:100%; max-width:390px; height:100%; max-height:787px;}
.pop.p_chatbot .p_body {padding:20px;}
.pop.p_chatbot .p_body .pb_wrap {display:flex; flex-wrap:wrap; row-gap:20px; width:100%;}
.pop.p_chatbot .p_body .pb_time {display:flex; justify-content:center; gap:5px; width:100%; background-color:#1114260F; border-radius:40px; font-size:12px; font-weight:300; line-height:24px; letter-spacing:-0.5px;}
.pop.p_chatbot .p_body .pb_time span {font-weight:500;}
.pop.p_chatbot .p_body .pb_time .colon {animation: blink 1s infinite;}
@keyframes blink {0% {opacity:1;} 50% { opacity:0;} 100% {opacity:1;}}
.pop.p_chatbot .p_body .pb_title {display:flex; align-items:center; gap:15px;}
.pop.p_chatbot .p_body .pb_title .pbt_logo {flex-shrink:0; display:flex; justify-content:center; align-items:center; width:50px; height:50px; border-radius:50%; background-color:var(--white);}
.pop.p_chatbot .p_body .pb_title .pbt_logo img {width:100%; height:100%;}
.pop.p_chatbot .p_body .pb_title strong {width:100%; height:60px; font-size:20px; font-weight:200; line-height:30px; letter-spacing:-0.5px;}
.pop.p_chatbot .p_body .pb_contact {display:inline-block; overflow:hidden; position:relative; width:100%; height:250px; background-color:var(--yellow); border-radius:10px;}
.pop.p_chatbot .p_body .pb_contact .pbc_btn {display:flex; flex-wrap:wrap; align-content:flex-start; gap:5px; position:absolute; left:0; right:0; top:0; bottom:0; z-index:1; padding:20px; cursor:pointer}
.pop.p_chatbot .p_body .pb_contact .pbc_btn > strong {display:flex; width:100%; height:24px; justify-content:space-between; font-size:14px; color:var(--black); line-height:24px;}
.pop.p_chatbot .p_body .pb_contact .pbc_btn > span {display:inline-block; vertical-align:middle; width:100%; font-size:24px; color:var(--black); font-weight:500; line-height:40px; letter-spacing:-0.5px; text-align:left;}
.pop.p_chatbot .p_body .pb_contact .pbc_btn > span > span {display:inline-block; width:100%;}
.pop.p_chatbot .p_body .pb_contact .pbc_btn i {background-image:none; overflow:hidden; position:relative;}
.pop.p_chatbot .p_body .pb_contact .pbc_btn i:before {content:""; position:absolute; left:-100%; top:50%; width:24px; height:24px; margin-left:-12px; margin-top:-9px; background-repeat:no-repeat; background-size:200%; background-position: right center; background-image:url(../images/common/icon_right.svg); transition:0.3s;}
.pop.p_chatbot .p_body .pb_contact .pbc_btn i:after {content:""; position:absolute; left:50%; top:50%; width:24px; height:24px; margin-left:-12px; margin-top:-9px; background-repeat:no-repeat; background-size:200%; background-position: right center; background-image:url(../images/common/icon_right.svg); transition:0.3s;}
.pop.p_chatbot .p_body .pb_contact .pbc_btn:hover i:before {left:50%;}
.pop.p_chatbot .p_body .pb_contact .pbc_btn:hover i:after {left:150%;}
.pop.p_chatbot .p_body .pb_contact .pbc_pic {position:absolute; right:-130px; bottom:-115px; width:350px; height:350px; aspect-ratio:1/1;  animation:5s  infinite normal running updownpic;}
.pop.p_chatbot .p_body .pb_contact .pbc_pic img {width:100%; height:100%;}
.pop.p_chatbot .p_body .pb_nav {display:flex; flex-wrap:wrap; gap:20px;}
.pop.p_chatbot .p_body .pb_nav li {display:inline-block; vertical-align:middle; width:calc(50% - 10px); border-radius:10px; background-color:var(--white);}
.pop.p_chatbot .p_body .pb_nav li .pbn_box {display:flex; flex-wrap:wrap; box-sizing:border-box; width:100%; padding:20px;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box > span {display:flex; justify-content:space-between; width:100%; font-size:12px; color:var(--black); font-weight:400; line-height:20px; letter-spacing:-0.5px;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box > span i {background-image:none; overflow:hidden; position:relative; width:18px; height:18px;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box > span i:before {content:""; position:absolute; left:-100%; top:50%; width:18px; height:18px; margin-left:-9px; margin-top:-9px; background-repeat:no-repeat; background-size:200%; background-position: right center; transition:0.3s;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box > span i:after {content:""; position:absolute; left:50%; top:50%; width:18px; height:18px; margin-left:-9px; margin-top:-9px; background-repeat:no-repeat; background-size:200%; background-position: right center; transition:0.3s;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box:hover > span i:before {left:50%;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box:hover > span i:after {left:150%;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box > span i.right:before,
.pop.p_chatbot .p_body .pb_nav li .pbn_box > span i.right:after {background-image:url(../images/common/icon_right.svg);}
.pop.p_chatbot .p_body .pb_nav li .pbn_box > span i.download:before,
.pop.p_chatbot .p_body .pb_nav li .pbn_box > span i.download:after {background-image:url(../images/common/icon_download.svg);}
.pop.p_chatbot .p_body .pb_nav li .pbn_box > span i.download:before {left:50% !important; top:-100%;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box > span i.download:after {left:50% !important;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box:hover > span i.download:before {top:50%;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box:hover > span i.download:after {top:150%;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box > strong {display:inline-block; vertical-align:middle; width:100%; font-size:16px; color:var(--black); font-weight:700; line-height:30px; letter-spacing:-0.5px;}
.pop.p_chatbot .p_body .pb_nav li .pbn_box > i {display:flex; justify-content:center; align-items:center; position:relative; width:36px; height:36px; margin-top:15px; border-radius:50%; background-color:rgba(0 ,0 ,0, 0.05);}
.pop.p_chatbot .p_body .pb_nav li .pbn_box > i:before {content:""; display:inline-block; width:20px; height:20px; background-image:url("../images/common/icon_chatbot.svg"); background-position:center 0; background-size:100% auto;}
.pop.p_chatbot .p_body .pb_nav li:nth-child(2) .pbn_box > i:before {background-position:center -20px;}
.pop.p_chatbot .p_body .pb_nav li:nth-child(3) .pbn_box > i:before {background-position:center -40px;}
.pop.p_chatbot .p_body .pb_nav li:nth-child(4) .pbn_box > i:before {background-position:center -60px;}
.pop.p_chatbot .p_body .pb_request {display:flex; flex-wrap:wrap; position:relative; gap:20px; width:100%; margin-top:20px;}
.pop.p_chatbot .p_body .pb_request .pbr_content {display:flex; flex-wrap:wrap; gap:10px; width:100%;}
.pop.p_chatbot .p_body .pb_request .pbr_content > div {transition:0.5s;}
.pop.p_chatbot .p_body .pb_request .pbr_content > div:nth-child(1) {transition-delay:0.3s;}
.pop.p_chatbot .p_body .pb_request .pbr_content > div:nth-child(2) {transition-delay:0.6s;}
.pop.p_chatbot .p_body .pb_request .pbr_content > div:nth-child(3) {transition-delay:0.9s;}
.pop.p_chatbot .p_body .pb_request .pbr_content > div:nth-child(4) {transition-delay:1.2s;}
.pop.p_chatbot .p_body .pb_request .pbr_content > div:nth-child(5) {transition-delay:1.5s;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_title {display:flex; align-items:center; gap:10px; width:100%; transition:0.3s;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_title .pbrct_pic {display:flex; justify-content:center; align-items:center; width:50px; height:50px; font-size:24px; background-color:var(--white); border-radius:50%;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_title .pbrct_pic img {width:100%; height:100%;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_title .pbrct_info {display:flex; flex-wrap:wrap; height:40px;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_title .pbrct_info strong {display:flex; width:100%; font-size:14px; font-weight:700; color:var(--black); line-height:20px; letter-spacing:-0.5px;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_title .pbrct_info .pbrcti_time {display:flex; width:100%; font-size:14px; font-weight:400; color:rgba(0,0,0,0.3); line-height:20px; letter-spacing:-0.5px;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_qustionbox {display:flex; flex-wrap:wrap; flex-direction:column; position:relative; z-index:0; padding:10px 20px; background-color:var(--white); border-radius:15px; transition:0.3s; word-break:keep-all;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_qustionbox.t1 {margin-top:13px;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_qustionbox.t1:before {content:""; position:absolute; left:18px; top:-10px; z-index:-1; width:15px; height:13px; background-image:url("../images/common/deco_triangle.svg"); background-repeat:no-repeat; background-position:center; background-size:100% auto;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_qustionbox span {display:inline-block; vertical-align:middle; width:100%; font-size:16px; font-weight:500; color:var(--black); line-height:30px; letter-spacing:-0.7px; word-break:break-all;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_select {display:flex; flex-wrap:wrap; gap:10px; width:100%;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_select > span {display:inline-block; vertical-align:middle; width:100%; font-size:14px; font-weight:400; color:var(--black); line-height:20px; letter-spacing:-0.5px;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_select > span mark {color:var(--red);}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_select .pbrcs_feild {display:flex; flex-wrap:wrap; gap:10px; width:100%;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_select .pbrcs_btn {display:flex; justify-content:center; align-items:center; gap:10px; margin-top:10px; padding:10px 20px; border-radius:15px; background-color:var(--black); font-size:16px; font-weight:700; color:var(--white); line-height:30px; letter-spacing:-0.5px;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_select .pbrcs_btn i {overflow:hidden; position:relative; width:18px; height:18px;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_select .pbrcs_btn i:before {content:""; position:absolute; left:-100%; top:50%; width:20px; height:20px; margin-left:-10px; margin-top:-10px; background-image:url("../images/common/icon_btnarrow.svg"); background-repeat:no-repeat; background-size:100%; background-position:center; transition:0.3s;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_select .pbrcs_btn i:after {content:""; position:absolute; left:50%; top:50%; width:20px; height:20px; margin-left:-10px; margin-top:-10px; background-image:url("../images/common/icon_btnarrow.svg"); background-repeat:no-repeat; background-size:100%; background-position:center; transition:0.3s;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_select .pbrcs_btn:hover i:before {left:50%;}
.pop.p_chatbot .p_body .pb_request .pbr_content .pbrc_select .pbrcs_btn:hover i:after {left:150%;}

.pop.p_chatbot .p_body .pb_request .pbr_content.off {position:absolute; opacity:0; width:0; height:0; pointer-events:none;}
.pop.p_chatbot .p_body .pb_request .pbr_content.off > div {opacity:0; transform:translateY(-5px); transition-delay:0s !important;}
.pop.p_chatbot .p_body .pb_request .pbr_content.off .pbrc_qustionbox span {display:none;}
.pop.p_chatbot .p_body .pb_request .pbr_content.off .pbrc_select .pbrcs_feild {display:none;}

.pop.p_chatbot .p_body .pb_request .pbr_content.me {justify-content:flex-end;}
.pop.p_chatbot .p_body .pb_request .pbr_content.me .pbrc_title {justify-content:flex-end;}
.pop.p_chatbot .p_body .pb_request .pbr_content.me .pbrc_title .pbrct_info {flex-direction:column;}
.pop.p_chatbot .p_body .pb_request .pbr_content.me .pbrc_title .pbrct_info strong {justify-content:flex-end;}
.pop.p_chatbot .p_body .pb_request .pbr_content.me .pbrc_qustionbox {background-color:var(--yellow);}
.pop.p_chatbot .p_body .pb_request .pbr_content.me .pbrc_qustionbox.t1:before {left:auto; right:18px; background-image:url("../images/common/deco_triangle_yellow.svg");}

.pop.p_chatbot .pcheckbox {display:flex; position:relative;}
.pop.p_chatbot .pcheckbox input {position:absolute; left:0; right:0; top:0; bottom:0; width:100%; height:100%; opacity:0;}
.pop.p_chatbot .pcheckbox > span {display:flex; padding:10px 20px; border:#E4E4E4 solid 1px; border-radius:15px; font-size:16px; font-weight:500; color:var(--black); line-height:28px; letter-spacing:-0.7px;}
.pop.p_chatbot .pcheckbox:hover > span {border-color:var(--black);}
.pop.p_chatbot .pcheckbox input:checked + span {border-color:var(--black); font-weight:700;}
.pop.p_chatbot .pinput {display:flex; width:100%; box-sizing:border-box; padding:10px 20px; border:#E4E4E4 solid 1px; background-color:transparent; border-radius:15px; font-size:16px; font-weight:500; color:var(--black); line-height:30px; letter-spacing:-0.7px;}
.pop.p_chatbot .pinput::placeholder {color:#aaa;}
.pop.p_chatbot .p_feild {display:flex; flex-wrap:wrap; width:100%;}
.pop.p_chatbot .p_feild.off {display:none;}
.pop.p_chatbot .p_feild > span,
.pop.p_chatbot .p_feild > label {display:flex; flex-wrap:wrap; width:100%; gap:5px; width:100%; font-size:14px; font-weight:500; color:var(--black); line-height:30px; letter-spacing:-0.5px;}
.pop.p_chatbot .p_feild .spbtween {justify-content:space-between;}
.pop.p_chatbot .p_textarea {display:inline-block; width:100%;}
.pop.p_chatbot .ptextarea {width:100%; box-sizing:border-box; min-height:270px; padding:10px 20px; border:#E4E4E4 solid 1px; background-color:transparent; border-radius:15px; font-size:16px; font-weight:500; color:var(--black); line-height:30px; letter-spacing:-0.7px;}
.pop.p_chatbot .ptextarea::placeholder {color:#aaa;}
.pop.p_chatbot .ptextarea:focus {outline:none}
.pop.p_chatbot .underline:hover {text-decoration:underline;}
.pop.p_chatbot .pfile > span {align-items:center; justify-content:space-between; width:100%; padding:10px 20px; padding-right:25px; font-size:12px; font-weight:400;}
.pop.p_chatbot .pfile span strong {font-size:16px; font-weight:500;}
.pop.p_chatbot .pfile span i {display:inline-block; position:relative; width:12px; height:12px; transition:0.3s;}
.pop.p_chatbot .pfile:hover span i {transform:rotate(90deg);}
.pop.p_chatbot .pfile span i:before,
.pop.p_chatbot .pfile span i:after {content:""; position:absolute; left:0; right:0; top:50%; height:2px; border-radius:1px; background-color:var(--black); margin-top:-1px;}
.pop.p_chatbot .pfile span i:after {transform:rotate(90deg);}
.pop.p_chatbot .p_filelist {display:flex; position:relative; flex-wrap:wrap; gap:10px; width:100%; padding-bottom:15px;}
.pop.p_chatbot .p_filelist:before {content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background-color:var(--black); opacity:0.1;}
.pop.p_chatbot .p_filelist > li {display:flex; margin-top:10px; justify-content:space-between; box-sizing:border-box; width:100%; padding:10px 20px; padding-right:25px; background-color:#E4E4E4; border-radius:10px; font-size:16px; font-weight:500; color:var(--black); line-height:30px; letter-spacing:-0.5px;}
.pop.p_chatbot .p_filelist > li mark {font-size:12px; font-weight:400; opacity:0.5;}
.pop.p_chatbot .p_filelist > li .pf_removebtn {display:flex; justify-content:flex-end; align-items:center; position:relative; flex-shrink:0; width:30px; height:30px;}
.pop.p_chatbot .p_filelist > li .pf_removebtn i {display:inline-block; position:relative; width:16px; height:16px; transition:0.3s; transform:rotate(45deg);}
.pop.p_chatbot .p_filelist > li .pf_removebtn:hover i {transform:rotate(135deg);}
.pop.p_chatbot .p_filelist > li .pf_removebtn i:before,
.pop.p_chatbot .p_filelist > li .pf_removebtn i:after {content:""; position:absolute; left:0; right:0; top:50%; height:2px; border-radius:1px; background-color:var(--black); margin-top:-1px;}
.pop.p_chatbot .p_filelist > li .pf_removebtn i:after {transform:rotate(90deg);}
.pop.p_chatbot .p_submitbtn {display:flex; position:relative; overflow:hidden; justify-content:center; align-items:center; width:100%; background-color:var(--yellow); border-radius:25px; font-size:16px; font-weight:500; color:transparent; line-height:50px; letter-spacing:-0.5px;}
.pop.p_chatbot .p_submitbtn:before {content:"프로젝트 의뢰하기"; position:absolute; left:0; right:0; top:0; bottom:0; color:var(--black); transition:0.3s;}
.pop.p_chatbot .p_submitbtn:after {content:"프로젝트 의뢰하기"; position:absolute; left:0; right:0; top:100%; bottom:0; color:var(--black); transition:0.3s;}
.pop.p_chatbot .p_submitbtn:hover:before {top:-100%;}
.pop.p_chatbot .p_submitbtn:hover:after {top:0;}

.pop.p_complete .p_head .ph_btn {right:-10px;}
.pop.p_complete .p_wrap {max-width:390px; max-height:445px; border-radius:15px;}
.pop.p_complete .p_wrap:before {opacity:0.6;}
.pop.p_complete .p_body .pb_wrap {display:flex; flex-wrap:wrap; justify-content:center;}
.pop.p_complete .p_body i {display:flex; justify-content:center; align-items:center; width:80px; height:80px; border-radius:50%; background-color:#1114260F;}
.pop.p_complete .p_body i:before {content:""; display:inline-block; width:40px; height:40px; background-image:url("../images/common/icon_complete.svg");  background-repeat:no-repeat; background-size:100% auto; background-position:center;}
.pop.p_complete .p_body strong {display:inline-block; vertical-align:middle; width:100%; margin-top:10px; font-size:20px; font-weight:600; color:var(--black); line-height:30px; letter-spacing:-0.5px; word-break:keep-all; text-align:center;}
.pop.p_complete .p_body p {display:inline-block;vertical-align:middle; margin-top:20px; font-size:16px; font-weight:200; color:var(--black); line-height:30px; letter-spacing:-0.5px;}
.pop.p_complete .p_body p span {display:inline-block; vertical-align:middle; width:100%;}
.pop.p_complete .p_body .pb_btn {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin-top:60px; height:52px; width:100%; background-color:var(--yellow); border-radius:26px; font-size:16px; color:var(--black); font-weight:600; letter-spacing:-0.5px; transition:0.3s;}
.pop.p_complete .p_body .pb_btn:hover {background-color:var(--black); color:var(--yellow);}

@keyframes updownpic {0%{transform:translateY(-3%)} 50%{transform:translateY(3%);} 100%{transform:translateY(-3%);}}

	/* 아이콘 */
i.icon {display:inline-block; width:24px; height:24px; background-repeat:no-repeat; background-size:200% auto; background-position:right; transition:0.3s;}
i.icon.yellow {background-position:left;}
i.icon.mini {width:12px; height:12px;}
i.icon.small {width:16px; height:16px;}
i.icon.big {width:32px; height:32px;}
i.icon.giant {width:40px; height:40px;}
i.icon.contact {background-image:url("../images/common/icon_contact.svg");}
i.icon.download {background-image:url("../images/common/icon_download.svg");}
i.icon.edit {background-image:url("../images/common/icon_edit.svg");}
i.icon.link_giant {background-image:url("../images/common/icon_link_giant.svg");}
i.icon.link_small {background-image:url("../images/common/icon_link_small.svg");}
i.icon.plus_small {background-image:url("../images/common/icon_plus_small.svg");}
i.icon.plus_big {background-image:url("../images/common/icon_plus_big.svg");}
i.icon.right {background-image:url("../images/common/icon_right.svg");}
i.icon.right_small {background-image:url("../images/common/icon_right_small.svg");}
i.icon.close_mini {background-image:url("../images/common/icon_close_mini.svg");}
i.icon.menu_mini {background-image:url("../images/common/icon_menu_mini.svg");}
i.icon.up {background-image:url("../images/common/icon_up.svg");}

.loadingbg {position:fixed; top:50%; left:50%; z-index:5; width:200px; height:200px; margin-left:-100px; margin-top:-100px; border-radius:50%; opacity:0; transition:0.3s; pointer-events:none;}
.loadingbg.on {opacity:1;}
#loading {position:fixed; top:50%; left:50%; width:100px; height:100px; margin-left:-50px; margin-top:-50px; z-index:5; background-image:url("../images/common/icon_loadingbg.png"); background-size:100% auto; background-repeat:no-repeat; transition:0.3s; pointer-events:none; opacity:0;}
#loading.on {opacity:1;}
#loading:before {display:block; content:""; position:absolute; left:0; right:0; top:0; bottom:0; background-image:url("../images/common/icon_loadingring.svg"); background-size:100% auto; background-repeat:no-repeat; animation:spin 1s ease-in-out infinite;-webkit-animation:spin 1s ease-in-out infinite; transition: 0.3s;}
#loading:after {display:block; content:""; position:absolute; left:0; right:0; top:0; bottom:0; background-image:url("../images/common/icon_loadingend.svg"); background-size:100% auto; background-repeat:no-repeat; opacity:0; transition: 0.3s;}
#loading.end {animation:none;}
#loading.end:after {opacity:1;}
@keyframes spin { to { transform: rotate(360deg); }}

@media all and (max-width:1680px) {
	.wrap {padding:0 50px;}
	.nopd {width:calc(100% + 100px); margin-left:-50px;}

	.text {font-size:15px;}
	.text.giant, .text .giant {font-size:23px; line-height:35px; letter-spacing:-0.8px;}
	.text.big, .text .big {font-size:18px; line-height:28px; letter-spacing:-0.5px;}

	form .f_content.div3 > div {width:calc((100% - 60px) / 2)}
	form .f_title {gap:20px; row-gap:0}
	form .f_field + .f_field {margin-top:60px}

	.checkbox input {top:50%; width:26px; margin-top:-13px}
	.checkbox > span {align-items:center; line-height:30px!important;}
	.checkbox > span i {width:26px; margin-right:12px}
	.checkbox > span i::before {width:20px}
	.radio {gap:12px}
	.radio input {width:26px; height:26px;}

	.pop.p_chatbot {padding:50px;}
}




@media all and (max-width:1440px) {
	.title {font-size:35px; line-height:50px}
	.title.t3, .title .t3 {font-size:45px; line-height:60px}

	.btn {padding:15px 30px 15px 35px}

	form .f_content {gap:40px}
	form .f_content.t1 {row-gap:15px}
}





@media all and (max-width:1280px) {
	.wrap {padding:0 40px;}
	.nopd {width:calc(100% + 80px); margin-left:-40px;}

	.btn {padding:10px 25px 10px 30px; font-size:18px; letter-spacing:-0.2px}
	.btn i {width:22px}

	.title {font-size:30px; line-height:45px;}
	.title.t3, .title .t3 {font-size:35px; line-height:50px}

	.text.giant, .text .giant {font-size:21px; line-height:32px; letter-spacing:-0.7px;}
	.text.big, .text .big {font-size:17px; line-height:26px;}

	.checkbox input {width:24px}
	.checkbox > span i {width:24px;}
	.checkbox > span i::before {width:18px}
	.radio input {width:24px; height:24px;}

	form .f_content {gap:30px}
	form .f_field + .f_field {margin-top:50px}

	.pop.p_chatbot {padding:40px;}
	.fc_input.type01 {width:111px;}
	.fc_input.type02,
	.fc_input.type08 {width:94px;}
	.fc_input.type03 {width:124px;}
	.fc_input.type04,
	.fc_input.type05 {width:80px;}
	.fc_input.type06,
	.fc_input.type11 {width:66px;}
	.fc_input.type07 {width:98px;}
	.fc_input.type09 {width:118px;}
	.fc_input.type10 {width:182px;}
	.fr_input.type01 {width:146px;}
	.fr_input.type02 {width:132px;}
	.fr_input.type03 {width:118px;}
	.fr_input.type04 {width:122px;}
	.fr_input.type05,
	.fr_input.type06,
	.fr_input.type08 {width:108px;}
	.fr_input.type07 {width:94px;}
}





@media all and (max-width:1024px) {
	.wrap {padding:0 30px;}
	.nopd {width:calc(100% + 60px); margin-left:-30px;}

	.text.giant, .text .giant {font-size:20px;}

	form .f_content.div3 > div {width:100%}
	form .f_field + .f_field {margin-top:40px}
	form .f_input > label {display:block}

	.pop.p_chatbot {padding:30px;}
}





@media all and (max-width:768px) {
	.loadingbg {width:160px; height:160px; margin-left:-80px; margin-top:-80px;}
	#loading {width:80px; height:80px; margin-left:-40px; margin-top:-40px;}

	.title {font-size:25px; line-height:35px}
}





@media all and (max-width:600px) {
	.text.giant, .text .giant {font-size:17px; line-height:25px}
	.text.big, .text .big {font-size:15px; letter-spacing:-0.3px;}

	.btn {padding:8px 20px 8px 25px; font-size:16px;}
	.btn i {width:18px}

	.checkbox input {width:24px;}
	.checkbox > span i {width:24px; margin-right:10px;}

	form .f_content {gap:20px}
	form .f_input .fi_placeholder {bottom:6px;}


	.input {padding:5px;}

	.textarea {padding:15px 20px;}
	.textarea + .f_count {right:20px; bottom:10px;}

	.pop .p_wrap {border-radius:20px;}
	.pop .p_body {padding:30px;}
	.pop .p_body .pb_list > li {padding-left:0;}
	.pop .p_body .pb_list > li i {display:none;}

	.pop.p_complete .p_wrap {min-width:271px; max-height:394px;}
	.pop.p_complete .p_body strong {font-size:18px;}
	.pop.p_complete .p_body i {width:60px; height:60px;}
	.pop.p_complete .p_body p {font-size:15px; line-height:28px;}
	.pop.p_complete .p_body .pb_btn {margin-top:45px;}


	.fc_input.type01 {width:101px;}
	.fc_input.type02,
	.fc_input.type08 {width:84px;}
	.fc_input.type03 {width:114px;}
	.fc_input.type04,
	.fc_input.type05 {width:70px;}
	.fc_input.type06,
	.fc_input.type11 {width:56px;}
	.fc_input.type07 {width:88px;}
	.fc_input.type09 {width:108px;}
	.fc_input.type10 {width:172px;}
	.fr_input.type01 {width:136px;}
	.fr_input.type02 {width:122px;}
	.fr_input.type03 {width:108px;}
	.fr_input.type04 {width:112px;}
	.fr_input.type05,
	.fr_input.type06,
	.fr_input.type08 {width:98px;}
	.fr_input.type07 {width:84px;}
}





@media all and (max-width:425px) {
	.wrap {padding:0 25px;}
	.nopd {width:calc(100% + 50px); margin-left:-25px;}

	.loadingbg {width:120px; height:120px; margin-left:-60px; margin-top:-60px;}
	#loading {width:60px; height:60px; margin-left:-30px; margin-top:-30px;}

	.title {font-size:22px; line-height:30px}
	.title.t3, .title .t3 {font-size:30px; line-height:40px}

	.pop .p_wrap {border-radius:15px; width:calc(100% - 50px); height:calc(100% - 50px); max-height:100%;}
	.pop .p_body {padding:20px;}
	.pop .p_body .pb_list > li strong {font-size:18px; line-height:32px;}
	.pop .p_body .pb_list > li .pb_box {font-size:15px; line-height:28px;}
	.pop .p_body .pb_list > li ul li {padding-left:20px;}
	.pop .p_body .pb_list > li ul li:before {left:7px; top:12px;}

	.pop.p_chatbot {padding:0;}
	.pop.p_chatbot .p_wrap {max-width:100%; max-height:unset; border-radius:0;}
	.pop.p_complete .p_wrap {max-height:373px;}
}





@media all and (max-width:360px) {
	.text.giant, .text .giant {font-size:16px;}

	.pop.p_chatbot .p_body .pb_title {gap:3.529vw;}
	.pop.p_chatbot .p_body .pb_title strong {font-size:5vw; line-height:7.7778vw; word-break:keep-all;}
	.pop.p_chatbot .p_body .pb_contact {height:210px;}
	.pop.p_chatbot .p_body .pb_contact .pbc_btn > span {font-size:22px; line-height:36px;}
	.pop.p_chatbot .p_body .pb_contact .pbc_pic {right:-120px; bottom:-100px; width:300px; height:300px;}
	.pop.p_chatbot .p_body .pb_nav li {width:100%;}
	.pop.p_chatbot .p_body .pb_nav li .pbn_box > i {display:none;}

	.pop.p_chatbot .p_feild #captcha {transform:scale(0.92); margin-left:-4%;}
}