/* 축소하지 못했습니다. 축소되지 않은 콘텐츠를 반환합니다. (5,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (6,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (8,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (10,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (11,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (12,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (13,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (14,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (17,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (18,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (36,23): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (36,48): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (57,51): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (57,76): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (80,93): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (81,74): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (97,25): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (101,58): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (101,83): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (116,99): run-time error CSS1039: Token not allowed after unary operator: '-img1' (116,141): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (125,154): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (125,210): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (127,158): run-time error CSS1039: Token not allowed after unary operator: '-img1' (127,213): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (133,76): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (138,71): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (139,80): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (157,54): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (161,27): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (168,153): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (168,204): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (172,157): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (186,97): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (190,79): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (191,96): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (196,195): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (206,103): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (229,113): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (229,190): run-time error CSS1039: Token not allowed after unary operator: '-default-txt' (249,110): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (249,140): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (282,21): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (283,132): run-time error CSS1039: Token not allowed after unary operator: '-el-padding' (284,67): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (290,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (292,172): run-time error CSS1039: Token not allowed after unary operator: '-el-color' (294,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (298,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (302,21): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (303,88): run-time error CSS1039: Token not allowed after unary operator: '-el-padding' (305,114): run-time error CSS1039: Token not allowed after unary operator: '-el-padding' (305,161): run-time error CSS1039: Token not allowed after unary operator: '-el-padding' (308,104): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (309,140): run-time error CSS1039: Token not allowed after unary operator: '-img1' (309,189): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (330,46): run-time error CSS1039: Token not allowed after unary operator: '-color-sub1' (332,25): run-time error CSS1039: Token not allowed after unary operator: '-color-sub1' (335,57): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (343,122): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (343,161): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (345,32): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (345,68): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (345,93): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (346,32): run-time error CSS1039: Token not allowed after unary operator: '-color-sub1' (346,56): run-time error CSS1039: Token not allowed after unary operator: '-color-sub1' (348,92): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (348,122): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (364,143): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (364,173): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (365,46): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (366,40): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (368,40): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (370,93): run-time error CSS1039: Token not allowed after unary operator: '-img1' (370,148): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (374,164): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (374,194): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (376,69): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (376,94): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (382,37): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (382,62): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (386,112): run-time error CSS1039: Token not allowed after unary operator: '-img1' (386,167): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (399,93): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (403,128): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (403,158): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (406,143): run-time error CSS1039: Token not allowed after unary operator: '-img1' (406,198): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (409,50): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (409,82): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (414,133): run-time error CSS1039: Token not allowed after unary operator: '-img1' (414,188): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (419,68): run-time error CSS1039: Token not allowed after unary operator: '-img1' (419,123): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (420,44): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (428,89): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (428,184): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (430,112): run-time error CSS1039: Token not allowed after unary operator: '-img1' (430,167): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (435,102): run-time error CSS1039: Token not allowed after unary operator: '-img1' (435,157): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (437,123): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (439,59): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (447,111): run-time error CSS1039: Token not allowed after unary operator: '-img1' (447,159): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (487,148): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (487,173): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (488,150): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (488,175): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (489,269): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (494,128): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (506,142): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (507,68): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (508,141): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (512,87): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (512,133): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (515,171): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (525,109): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (527,78): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (528,95): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (531,147): run-time error CSS1039: Token not allowed after unary operator: '-img1' (531,202): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (533,77): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (538,106): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (541,118): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (542,145): run-time error CSS1039: Token not allowed after unary operator: '-img1' (542,200): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (544,54): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (545,66): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (545,85): run-time error CSS1039: Token not allowed after unary operator: '-img1' (545,140): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (549,78): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (550,60): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (554,77): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (555,110): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (555,149): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (556,126): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (556,145): run-time error CSS1039: Token not allowed after unary operator: '-img1' (556,194): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (573,103): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (573,133): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (573,194): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (575,103): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (576,135): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (579,105): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (579,137): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (579,173): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (580,115): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (580,151): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (582,36): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (583,37): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (584,41): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (585,27): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (612,70): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (628,96): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (628,136): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (629,85): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (631,68): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (632,129): run-time error CSS1039: Token not allowed after unary operator: '-img1' (632,184): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (633,57): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (635,103): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (644,85): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (646,70): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (646,100): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (646,125): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (646,171): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (647,68): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (647,100): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (647,125): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (648,76): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (648,108): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (648,133): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (653,85): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (654,163): run-time error CSS1039: Token not allowed after unary operator: '-img1' (654,218): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (656,70): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (656,100): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (656,125): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (656,171): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (658,68): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (658,100): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (658,125): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (659,76): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (659,108): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (659,133): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (669,127): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (669,152): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (671,175): run-time error CSS1039: Token not allowed after unary operator: '-img1' (671,230): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (674,194): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (683,208): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (739,142): run-time error CSS1039: Token not allowed after unary operator: '-img1' (739,191): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (766,36): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (772,92): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (793,65): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (812,58): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (817,60): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (832,128): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (834,81): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (834,117): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (835,72): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (845,82): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (852,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (852,97): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (852,143): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (856,132): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (858,70): run-time error CSS1039: Token not allowed after unary operator: '-el-width' (859,101): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (859,138): run-time error CSS1039: Token not allowed after unary operator: '-el-width' (860,69): run-time error CSS1039: Token not allowed after unary operator: '-el-width' (861,58): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (868,34): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (875,25): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (876,94): run-time error CSS1039: Token not allowed after unary operator: '-el-width' (877,111): run-time error CSS1039: Token not allowed after unary operator: '-el-width' (879,37): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (879,62): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (882,86): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (899,83): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (919,53): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (921,57): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (930,109): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (932,122): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (932,168): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (934,54): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (937,68): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (941,271): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (942,142): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (946,90): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (947,90): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (951,75): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (951,121): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (972,18): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (972,63): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (972,109): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (987,58): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (991,114): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (993,59): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (994,65): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1002,45): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1003,98): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1011,94): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1016,184): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1029,37): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (1030,153): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1034,74): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1037,51): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (1042,159): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1046,55): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1058,34): run-time error CSS1039: Token not allowed after unary operator: '-color-sub1' (1060,123): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (1060,166): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1064,41): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (1074,55): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1078,79): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1080,49): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1080,74): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1083,61): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1083,107): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1085,212): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1087,75): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1088,48): run-time error CSS1039: Token not allowed after unary operator: '-color-sub1' (1089,68): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1089,93): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1096,50): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1098,61): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1099,39): run-time error CSS1039: Token not allowed after unary operator: '-color-sub1' (1100,54): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1100,79): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1103,154): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1107,66): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1107,91): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1111,149): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1112,128): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1123,88): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1124,99): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1132,72): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1140,129): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1144,103): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1145,137): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1145,167): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (1168,56): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (1168,117): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1169,114): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1173,133): run-time error CSS1039: Token not allowed after unary operator: '-img1' (1173,188): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (1179,77): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1183,86): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1184,60): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1184,109): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1185,134): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1185,175): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1193,207): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1194,78): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1194,117): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1194,142): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1194,191): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1195,88): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1199,113): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (1204,146): run-time error CSS1039: Token not allowed after unary operator: '-img1' (1204,201): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (1210,81): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1210,130): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1212,134): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1213,107): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1213,146): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1213,171): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1213,220): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1218,140): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1219,64): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1220,54): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1221,54): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1221,93): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1221,142): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1226,29): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (1228,61): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1238,176): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1239,136): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1249,67): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1260,168): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1266,134): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1277,90): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1281,177): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1282,126): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1291,147): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (1301,57): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1305,153): run-time error CSS1039: Token not allowed after unary operator: '-img1' (1305,202): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (1307,42): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (1308,79): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1322,41): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1322,84): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1322,114): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1326,60): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1329,69): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1329,94): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1341,62): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1342,71): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1343,55): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1347,137): run-time error CSS1039: Token not allowed after unary operator: '-color-gray4' (1347,162): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1348,75): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1349,74): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1349,99): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1354,81): run-time error CSS1039: Token not allowed after unary operator: '-color-gray1' (1357,123): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1358,116): run-time error CSS1039: Token not allowed after unary operator: '-img1' (1358,171): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (1359,79): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1365,163): run-time error CSS1039: Token not allowed after unary operator: '-img1' (1365,218): run-time error CSS1039: Token not allowed after unary operator: '-img1x2' (1366,96): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (1386,82): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1388,58): run-time error CSS1039: Token not allowed after unary operator: '-color-gray3' (1389,92): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1390,85): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' (1399,28): run-time error CSS1039: Token not allowed after unary operator: '-color-sub1' (1404,59): run-time error CSS1039: Token not allowed after unary operator: '-color-gray2' (1436,77): run-time error CSS1039: Token not allowed after unary operator: '-color-gray0' */ @charset "utf-8"; :root { --primary-c1:#0092ad; --primary-c2:#ff4d00; --color-sub1:#df2406; --color-gray0:#000000; --color-gray1:#ffffff; --color-gray2:#b9b9b9; --color-gray3:#777777; --color-gray4:#f1f1f1; --img1:url(../../images/com/img1.png?20231117); --img1x2:30.0rem 30.0rem; } /* -------------------------------------------------------------------------------- RESET --------------------------------------------------------------------------------- */ html, body, div, span, object, iframe, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main, summary, h1, h2, h3, h4, h5, h6, p, blockquote, pre, form, fieldset, legend, input, label, button, textarea, select, textarea, input, data, table, caption, tbody, tfoot, thead, tr, th, td, b, i, dl, dt, dd, ol, ul, li, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, time, mark, audio, video, a {margin:0;padding:0;box-sizing:border-box;} html {font-size:62.5%;-webkit-overflow-scrollng:touch;} html, body {width:100%;height:100%;} body {background:var(--color-gray1);color:var(--color-gray0);word-wrap:break-word;word-break:normal;word-break:keep-all;-ms-text-size-adjust:100%;-webkit-test-size-adjust:100%;font-variant-numeric:tabular-nums;} body, select, input, button, textarea, button, pre {font-family:"Pretendard", "Mulgun Gothic", -apple-system, BlinkMacSystemfont, AppleSDGothicNeo-Regular, sans-serif;font-size:1.6rem;line-height:1.5;letter-spacing:-0.055em;} article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main, summary {display:block;} blockquote, q {quotes:none;} blockquote::before, blockquote::after, q::before, q::after {content:none;} h1, h2, h3, h4, h5, h6 {font-size:100%;} cite, em, dfn, address {font-style:normal;} fieldset, iframe {border:0 none;} fieldset {min-width:0;} ins {text-decoration:none;} del {text-decoration:line-through;} ol, ul, li {list-style:none;} img, fieldset, iframe {border:0 none;} video, audio, object, embed, iframe {max-width:100%;} legend:not([class]), caption {/*position:absolute;*/overflow:hidden;width:0.1rem;height:0.1rem;margin:-0.1rem 0 0 -0.1rem;font-size:0.1rem;opacity:0;white-space:nowrap;} legend:not([class]) {position:absolute;} i, em, address {font-style:normal;} input, select, textarea {border:0.1rem solid var(--color-gray0);color:var(--color-gray0);border-radius:0;/*-webkit-appearance:none;-moz-appearance:none;appearance:none;*/} label, button {cursor:pointer;} button {cursor:pointer;padding:0;background:none;border:0 none;} select::-ms-expand {display:none;} textarea {border:0.1rem solid #dadada;resize:vertical;} input[type="text"]::-ms-clear, input[type="password"]::-ms-clear, input[type="text"]::-ms-reveal, input[type="password"]::-ms-reveal {display:none;} input[type="radio"], input[type="checkbox"], input[type="tel"], input[type="number"] {border:0 none;vertical-align:middle;} input[type="number"] {-moz-appearace:textfield;} input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {-webkit-appearance:none;} input[type="file"]::-webkit-file-upload-button {cursor:pointer;} input::-ms-clear {display:none;width:0;height:0;} table {width:100%;empty-cells:show;border-collapse:separate;border-spacing:0;table-layout:fixed;} table th {font-weight:normal;} mark {background:none;} sup {vertical-align:top;} a {color:inherit;text-decoration:none;outline:0;} [role="button"] {cursor:pointer;} [tabindex]:focus-visible, a:focus-visible, button:focus-visible {outline:0.3rem dotted var(--color-gray2);} select:focus-visible, textarea:focus-visible {outline:0.1rem dotted var(--color-gray2);} input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active, textarea:-webkit-autofill, textarea:-webkit-autofill:hover, textarea:-webkit-autofill:focus {background-color:transparent;transition:background-color 5000s ease-in-out 0s;} .hide {overflow:hidden;position:absolute;left:-0.1rem;top:-0.1rem;width:0.1rem;height:0.1rem;opacity:0;} .none {display:none;} /* -------------------------------------------------------------------------------- LAYOUT --------------------------------------------------------------------------------- */ body {overflow-y:scroll;--vw:100vw;} body.modal-on {position:fixed;width:100%;} .nav-skip a {overflow:hidden;display:block;position:absolute;left:0;right:0;top:0;width:100%;font-size:1.6rem;line-height:5.6rem;text-align:center;opacity:0;z-index:-1;} .nav-skip a:focus {z-index:500;opacity:1;background:var(--color-gray0);color:var(--color-gray1);} #wrapper {width:100%;min-height:100vh;min-width:152.0rem;padding:0 12.0rem;} /* -------------------------------------------------------------------------------- LAYOUT : HEADER : #header --------------------------------------------------------------------------------- */ #header {position:relative;} #header:before {content:'';display:block;position:absolute;left:-12.0rem;right:-12.0rem;bottom:0;border-bottom:0.3rem solid #000;} #header > div {position:relative;height:13.3rem;margin:0 -4.0rem;padding:4.4rem 4.0rem;z-index:200;} .nav-logo {display:inline-flex;font-size:3.2rem;line-height:4.8rem;font-weight:900;} .nav-logo a {display:block;} .nav-logo .logo {position:relative;width:18.4rem;height:4.8rem;} .nav-logo .logo, .nav-logo .logo::selection {color:transparent;} .nav-logo .logo:after {content:'';position:absolute;left:0;right:0;top:0;bottom:0;background:var(--img1) no-repeat 0 0;background-size:var(--img1x2);} .nav-logo .logo + a {margin:0 0 0 2.4rem;} .nav-gnb {position:absolute;right:0;bottom:0;} .nav-gnb a {display:block;} .nav-gnb > ul {display:flex;} .nav-gnb > ul > li {position:relative;} .nav-gnb > ul > li > a {padding:0 4.0rem 1.0rem;font-size:2.4rem;line-height:7.0rem;font-weight:800;} .nav-gnb > ul > li > a[aria-current="page"] {color:#ff4d00;} .nav-gnb > ul > li > ul {visibility:hidden;position:absolute;left:0;right:0;top:calc(100% - 2.0rem);min-width:16.8rem;min-height:22.7rem;background:var(--color-gray4);opacity:0;box-shadow:0 0.1rem 0.3rem var(--color-gray2);} .nav-gnb > ul > li > ul a,.nav-gnb > ul > li > ul span {position:relative;font-size:1.6rem;line-height:5.3rem;} .nav-gnb > ul > li > ul a:after {content:'';position:absolute;display:block;right:1.6rem;top:2.0rem;width:0.6rem;height:1.2rem;display:block;background:var(--img1) no-repeat -21.0rem -2.5rem;background-size:var(--img1x2);opacity:0;} .nav-gnb > ul > li > ul a:hover, .nav-gnb > ul > li > ul a:focus {outline:0;font-weight:800;} .nav-gnb > ul > li > ul a:hover:after, .nav-gnb > ul > li > ul a:focus:after {opacity:1;} .nav-gnb > ul > li.on > ul {visibility:visible;top:100%;opacity:1;transition:all 0.2s ease-in-out;} .nav-gnb > ul > li > ul:not(.list) {padding:0 0 0.8rem 3.6rem;} .nav-gnb > ul > li > ul:not(.list) > li + li {border-top:0.1rem solid var(--color-gray2);} .nav-gnb > ul > li > ul.list {left:unset;right:4.0rem;} .nav-gnb > ul > li > ul.list {display:flex;} .nav-gnb > ul > li > ul.list > li {min-width:16.8rem;min-height:22.7rem;padding:0 0 0.8rem 3.6rem;} .nav-gnb > ul > li > ul.list > li + li {border-left:0.1rem solid var(--color-gray1);} .nav-gnb > ul > li > ul.list > li > ul > li + li {border-top:0.1rem solid var(--color-gray2);} .logo + .nav-gnb {bottom:50%;transform:translateY(50%);right:7.2rem;} .nav-lnb {position:absolute;right:4.0rem;top:2.0rem;display:flex;gap:4.0rem;} .nav-lnb nav a {display:inline-block;vertical-align:top;font-size:1.6rem;line-height:3.2rem;} .nav-lnb nav a + a {margin:0 0 0 2.4rem;} /* -------------------------------------------------------------------------------- LAYOUT CONTAINER : #container > #content --------------------------------------------------------------------------------- */ #container {margin:-13.6rem 0 -16.0rem;padding:13.6rem 0 28.0rem;} #container .content {position:relative;min-width:128.0rem;min-height:calc(100vh - 48.8rem);margin:0 auto;} #container .content:empty {background:rgba(0,0,0,0.1);} /* -------------------------------------------------------------------------------- LAYOUT : FOOTER : #footer --------------------------------------------------------------------------------- */ #footer {height:16.0rem;border-top:0.1rem solid var(--color-gray2);margin:0 -12.0rem;} #footer > div {position:relative;min-width:128.0rem;margin:0 auto;padding:3.3rem 12.0rem;} #footer dl dt {margin:0 0 2.0rem;font-weight:700;} #footer dl dd {color:var(--color-gray3);} #footer dl dd + dd {margin:0.2rem 0 0;} #footer nav {position:absolute;right:12.0rem;top:4.0rem;} #footer nav a {position:relative;display:inline-block;font-weight:700;} #footer nav a[target="_blank"] {padding:0 3.8rem 0 0;} #footer nav a[target="_blank"]:before, #footer nav a[target="_blank"]:after {content:'';position:absolute;right:0;top:0.3rem;display:block;width:1.3rem;height:1.0rem;border:0.2rem solid var(--color-gray0);border-radius:0.2rem;background:var(--color-gray1);} #footer nav a[target="_blank"]:after {margin:0.4rem;} #footer nav div {margin:2.0rem 0 0;} #footer nav div a + a {position:relative;margin:0 0 0 6.5rem;} #footer nav div a + a:before {content:'';position:absolute;left:-3.3rem;top:50%;display:block;width:0.1rem;height:2.4rem;margin:-1.2rem 0 0;background:var(--color-gray2);} /* -------------------------------------------------------------------------------- LAYOUT : POPUP --------------------------------------------------------------------------------- */ .overlay1 {position:fixed;left:0;right:0;top:0;bottom:0;width:100%;height:100%;min-width:100%;min-height:100%;background:rgba(0,0,0,0);z-index:1000;} /* 컨텐츠형 : 공통 */ [class*="pop-modal"] {display:none;z-index:-1000;overflow-y:auto;} [class*="pop-modal"]::-webkit-scrollbar {width:0.4rem;} [class*="pop-modal"]::-webkit-scrollbar-thumb {background:#dfdfdf;opacity:0.2;} [class*="pop-modal"]::-webkit-scrollbar-track {background:#f8f8f8;border-radius:0;} [class*="pop-modal"], [class*="pop-modal"]:before {position:fixed;left:0;right:0;top:0;bottom:0;} [class*="pop-modal"]:before {content:'';background:rgba(0,0,0,0);transition:all 0.3s ease-in-out;} [class*="pop-modal"] section {position:relative;background:#fff;box-shadow:0 0.1rem 0.3rem var(--color-gray2);overflow:hidden;} [class*="pop-modal"].open:before {background:rgba(0,0,0,0.4);} [class*="pop-modal"].open {display:block;z-index:1000;} [class*="pop-modal"] header {padding:0 2.4rem;border-bottom:0.1rem solid var(--color-gray2);} [class*="pop-modal"] header h1 {font-weight:800;font-size:2.0rem;line-height:5.6rem;color:var(--color-gray0);} [class*="pop-modal"] header button[data-btn="pop-close"], [class*="pop-modal"] .ui-hidebtn {overflow:hidden;display:block;position:absolute;right:0;top:0;width:5.6rem;height:5.6rem;} [class*="pop-modal"] header button[data-btn="pop-close"], [class*="pop-modal"] .ui-hidebtn, [class*="pop-modal"] header button[data-btn="pop-close"]::selection, [class*="pop-modal"] .ui-hidebtn::selection {color:transparent;} [class*="pop-modal"] header button[data-btn="pop-close"]:before, [class*="pop-modal"] header button[data-btn="pop-close"]:after {content:'';display:block;position:absolute;left:50%;top:50%;width:2.4rem;height:0.2rem;margin:-0.1rem 0 0 -1.2rem;background:var(--color-gray0);} [class*="pop-modal"].open header button[data-btn="pop-close"]:before {transform:rotate(-45deg);} [class*="pop-modal"].open header button[data-btn="pop-close"]:after {transform:rotate(45deg);} [class*="pop-modal"] .content {padding:4.8rem 0 0;} [class*="pop-modal"] .content .area-action1 {margin:4.0rem 0 0;} [class*="pop-modal"] .content ~ .bottom {text-align:center;padding:4.8rem 4.0rem;} [class*="pop-modal"] .content .section ~ .section {margin:4.8rem 0 0;} /* 유형1 */ .pop-modal1 section {width:80.0rem;margin:14.0rem auto 4.0rem;padding:4.0rem;border:0.1rem solid var(--color-gray0);box-shadow:0 0.3rem 0.6rem rgba(0,0,0,0.29);} .pop-modal1 header {position:relative;margin:-4.0rem -4.0rem 0;padding:0 2.4rem;} .pop-modal1 header button[data-btn="pop-close"] {left:50%;margin-left:34.4rem;top:0;} .pop-modal1 .content ~ .bottom {margin:0 -4.0rem -4.0rem;} .pop-modal1.scroll:not([data-scroll="none"]) header [data-btn="pop-close"] {position:fixed;} .pop-modal1.min section {width:40.0rem;} .pop-modal1.min header button[data-btn="pop-close"] {margin-left:14.4rem;} .pop-modal1.min .content ~ .bottom {padding:0;display:flex;} .pop-modal1.min .content ~ .bottom .btn-action1 {flex:1;height:6.4rem;line-height:3.2rem;} /* 팝업오픈시 바닥포커스 제한 */ .modal-on .nav-skip *, .modal-on #header *, .modal-on #container *, .modal-on #footer * {pointer-events:none;} /* 로딩 */ [class*="pop-loader"] {visibility:hidden;position:fixed;left:0;right:0;top:0;bottom:0;z-index:1000;} [class*="pop-loader"], [class*="pop-loader"]:before {position:fixed;left:0;right:0;top:0;bottom:0;} [class*="pop-loader"]:before {content:'';background:rgba(0,0,0,0);transition:all 0.3s ease-in-out;} [class*="pop-loader"] > dl {display:none;position:fixed;left:0;right:0;top:50%;margin:0 auto;background:#fff;outline:0;transform:translateY(-50%);} [class*="pop-loader"] > dl {padding:4.0rem 3.1rem 10.0rem;width:calc(100% - 6.2rem);max-width:36.0rem;} [class*="pop-loader"] > dl > dt {margin:-4.0rem -3.1rem 4.0rem;padding:0 1.6rem;border-bottom:0.1rem solid var(--color-gray2);font-weight:800;font-size:2.0rem;line-height:5.7rem;color:var(--default-txt);} [class*="pop-loader"] > dl > dd {font-size:1.8rem;line-height:2.8rem;text-align:center;} [class*="pop-loader"] > dl > dd:after {display:block;content:'';width:8.0rem;height:8.0rem;margin:5.6rem auto 0;background:url(../../images/com/loading.gif) no-repeat 50% 50%;} [class*="pop-loader"].open {visibility:visible;} [class*="pop-loader"].open:before {background:rgba(0,0,0,0.4);} [class*="pop-loader"].open > dl {display:block;} @charset "utf-8"; /* -------------------------------------------------------------------------------- COMPONENT : 공통 --------------------------------------------------------------------------------- */ .sub-con1 {margin:1.6rem 0 0;} .sub-con2 {margin:2.4rem 0 0;} .sub-con3 {margin:3.2rem 0 0;} .sub-con4 {margin:4.0rem 0 0;} /* -------------------------------------------------------------------------------- COMPONENT : TITLE --------------------------------------------------------------------------------- */ .tit-page1 {position:sticky;top:0;margin:0 -12.0rem 8.8rem;padding:0 12.0rem;box-shadow:0 0.1rem 0.3rem var(--color-gray2);background:var(--color-gray1);z-index:100;} .tit-page1 > div {display:flex;justify-content:space-between;align-items:center;min-width:128.0rem;margin:0 auto;padding:3.3rem 0;} .tit-page1 h1 {font-size:3.2rem;line-height:3.8rem;font-weight:800;} .tit-page1 + .tit-page1 {margin-top:-8.8rem;} [class*="tit-sub"] {position:relative;} [class*="tit-sub"] .side {position:absolute;right:0;bottom:0;} div[class*="tit-sub"] > h2, div[class*="tit-sub"] > h3, [class*="tit-sub"]:not(div):not(dl), dl[class*="tit-sub"] > dt {font-weight:800;} div[class*="tit-sub"] .info-step1 {position:absolute;right:0;top:5.4rem;} .tit-sub1 {margin:0 0 2.4rem;} .tit-sub1 ~ .tit-sub1 {margin-top:5.6rem;} div.tit-sub1 {margin:0 0 5.6rem;} div.tit-sub1 > h2, div.tit-sub1 > h3 {margin:0 0 2.4rem;} div.tit-sub1 > h2, div.tit-sub1 > h3, .tit-sub1:not(div):not(dl), dl.tit-sub1 > dt {font-size:2.2rem;line-height:3.0rem;} div.tit-sub1 > h2 + p, div.tit-sub1 > h3 + p {font-size:2.0rem;line-height:2.8rem;} .tit-sub2 {margin:0 0 2.0rem;} .tit-sub2 ~ .tit-sub2 {margin-top:3.2rem;} dl.tit-sub2 > dt {margin:0 0 1.6rem;} div.tit-sub2 > h2, div.tit-sub2 > h3, .tit-sub2:not(div):not(dl), dl.tit-sub2 > dt {font-size:1.8rem;line-height:2.8rem;} div.tit-sub2 > h2 + p, div.tit-sub2 > h3 + p, dl.tit-sub2 > dd {font-size:1.6rem;line-height:2.6rem;} .tbl-data1 + .tit-sub2 ~ .tit-sub2 {margin-top:5.6rem;} .tit-sub3 {margin:0 0 2.0rem;} div.tit-sub3 > h2, div.tit-sub3 > h3, .tit-sub3:not(div):not(dl) {font-size:1.6rem;line-height:2.6rem;} /* -------------------------------------------------------------------------------- COMPONENT : TEXT --------------------------------------------------------------------------------- */ /* 블릿 */ [class*="txt-bul"] {--el-padding:1.2rem;} [class*="txt-bul"] > li, [class*="txt-bul"] > dd, [class*="txt-bul"]:not(ul):not(ol):not(dl) {position:relative;padding:0 0 0 var(--el-padding);} [class*="txt-bul"] {text-align:left;font-size:1em;line-height:1.3;--el-color:var(--color-gray0);} [class*="txt-bul"] + [class*="txt-bul"], [class*="txt-bul"] [class*="txt-bul"], [class*="txt-num"] [class*="txt-bul"] {margin:1.0rem 0 0;} .txt-bul1 {--el-padding:1.2rem;} .txt-bul1 > li + li, .txt-bul1 > dd + dd {margin:1.2rem 0 0;} .txt-bul1 > li::before, .txt-bul1 > dd::before, .txt-bul1:not(ul):not(dl)::before {content:"";position:absolute;top:0.5em;left:0;width:0;height:0;border:0.2rem solid var(--el-color);border-radius:100%;} .txt-bul2 {--el-padding:1.2rem;} .txt-bul2 > li + li, .txt-bul2 > dd + dd {margin:0.8rem 0 0;} .txt-bul2 > li::before, .txt-bul2 > dd::before, .txt-bul2:not(ul):not(dl)::before {content:"-";position:absolute;top:0;left:0;} .txt-bul3 {--el-padding:1.2rem;} .txt-bul3 > li + li, .txt-bul2 > dd + dd {margin:0.8rem 0 0;} .txt-bul3 > li::before, .txt-bul3 > dd::before, .txt-bul3:not(ul):not(dl)::before {content:"*";position:absolute;top:0;left:0;} [class*="txt-num"] {--el-padding:2.4rem;} [class*="txt-num"] > li, [class*="txt-num"] > dd {position:relative;padding:0 0 0 var(--el-padding);} [class*="txt-num"] > li + li, [class*="txt-num"] > dd + dd {margin:1.2rem 0 0;} [class*="txt-num"] > li > span:first-child, [class*="txt-num"] > dd > span:first-child {display:block;width:var(--el-padding);float:left;margin:0 0 0 calc(var(--el-padding) * -1);font-weight:700;} /* 문구 : 안내 */ .info-mes1 {display:inline-block;padding:0.5rem 1.6rem;border-radius:1.6rem;background:#000;color:var(--color-gray1);font-size:1.4rem;line-height:2.2rem;white-space:nowrap;font-weight:800;} .info-mes1:before {content:'';display:inline-block;vertical-align:top;margin:0 0.8rem 0 -0.8rem;width:2.2rem;height:2.2rem;background:var(--img1) no-repeat -20.0rem 0;background-size:var(--img1x2);} /* 문구 : 일반 */ .mes-t1 {text-align:center;font-size:2.0rem;line-height:2.8rem;font-weight:300;} .mes-t1 strong {font-weight:800;} .mes-t1 strong.data {display:block;margin:1.2rem 0;font-size:1.6em;} .form-agree1 + .mes-t1 {margin:5.6rem 0 0;} /* 문구 : 일반 */ .mes-t2 {display:flex;text-align:left;align-items:center;min-height:4.0rem;} .mes-t2 > p {flex:1;} .mes-t2:not(:last-child) {margin:0 0 1.6rem;} /* 문구 : 기능형 */ .txt-cnt1 {margin:0 0 2.0rem;line-height:4.0rem;} .txt-cnt1 strong {margin:0 0.8rem;} .txt-unit1 {margin:0 0 2.0rem;text-align:right;font-size:1.4rem;line-height:2.4rem;} .tit-sub2 + .txt-unit1 {margin-top:-4.4rem;} .txt-required {display:inline-flex;width:1.3rem;padding:0 0 0 0.4rem;overflow:hidden;white-space:nowrap;color:transparent;} .txt-required:before {content:'*';color:var(--color-sub1);} .txt-guide1 {color:var(--color-sub1);font-size:1.6rem;line-height:2.0rem;} /* 텍스트유형 */ .txt-t1 {font-size:1.6rem;line-height:2.4rem;color:var(--color-gray3);} /* -------------------------------------------------------------------------------- COMPONENT : ICON --------------------------------------------------------------------------------- */ [class*="icon-t"] {display:inline-block;white-space:nowrap;vertical-align:top;text-align:center;} .icon-t1 {min-width:7.8rem;height:3.6rem;padding:0 1.2rem;font-size:1.6rem;line-height:3.4rem;font-weight:700;color:var(--color-gray0);border:0.1rem solid var(--color-gray0);border-radius:5.0rem;} .icon-t1.c2 {border-style:dashed;} .icon-t1.c3 {border-color:var(--color-gray3);background-color:var(--color-gray4);color:var(--color-gray3);} .icon-t1.c4 {border-color:var(--color-sub1);color:var(--color-sub1);} .icon-t2 {min-width:3.6rem;padding:0 0.8rem;font-size:1.2rem;line-height:2.2rem;color:var(--color-gray1);background:var(--color-gray0);border-radius:2.0rem;} .icon-t2.c1 {background:#5a5d63;} .icon-t2.c2 {background:#6980a8;} .icon-t2.c3 {background:#8f6a3d;} .icon-t2.c4 {background:#9f4628;} /* -------------------------------------------------------------------------------- COMPONENT : BUTTON --------------------------------------------------------------------------------- */ [class*="btn-action"], [class*="btn-com"], [class*="btn-sub"], [class*="btn-icon"], [class*="btn-t"], [class*="link-t"] {position:relative;display:inline-block;text-align:center;white-space:nowrap;vertical-align:top;} [class*="btn-action"], [class*="btn-com1"] {font-weight:800;} /* ACTION */ .btn-action1 {display:inline-flex;height:5.6rem;min-width:19.2rem;padding:1.5rem;font-size:1.8rem;line-height:2.4rem;border:0.1rem solid var(--color-gray0);background:var(--color-gray1);justify-content:center;} .btn-action1.c1, .btn-action1.c2 {color:var(--color-gray1);} .btn-action1.c1 {background-color:var(--color-gray0);} .btn-action1.c2 {background-color:#df2406;border-color:#df2406;} .btn-action1.c3 {background-color:var(--color-gray4);} .btn-action1.ic1 {gap:1.6rem;align-items:center;} .btn-action1.ic1:after {content:'';width:0.6rem;height:1.2rem;display:block;background:var(--img1) no-repeat -21.0rem -2.5rem;background-size:var(--img1x2);} /* COM */ .btn-com1, .btn-sub1 {display:inline-flex;justify-content:center;align-items:center;height:4.0rem;padding:0.8rem;font-size:1.6rem;line-height:2.2rem;border:0.1rem solid var(--color-gray0);background:var(--color-gray1);} .btn-com1 {min-width:12.0rem;font-size:1.8rem;background-color:var(--color-gray0);color:var(--color-gray1);} .btn-com1[class*=" ic"] {gap:0.6rem;} .btn-com1.ic1:before {content:'\21BB';font-weight:400;font-size:1.2em;transform:rotate(50deg);} /* SUB1 */ .btn-sub1 {padding:0.8rem 2.4rem;font-weight:700;} .btn-sub1.c1 {background-color:var(--color-gray0);color:var(--color-gray1);} .btn-sub1[aria-expanded], .btn-sub1[class*=" ic"] {gap:1.6rem;} .btn-sub1[aria-expanded]:after, .btn-sub1[class*=" ic"]:after, .btn-sub1.ic2:before, .btn-sub1[class*=" file"]:before {content:'';width:0.7rem;height:1.2rem;display:block;margin:0;background:var(--img1) no-repeat -21.0rem -2.5rem;background-size:var(--img1x2);} .btn-sub1[aria-expanded] {padding:0.8rem 3.2rem;} .btn-sub1[aria-expanded="true"]:after {transform:rotate(-90deg);} .btn-sub1[aria-expanded="false"]:after {transform:rotate(90deg);} .btn-sub1.ic2:after, .btn-sub1.ic5:after {display:none;} .btn-sub1.ic2:before {transform:rotate(180deg);} .btn-sub1.ic3:after, .btn-sub1.ic4:after {width:1.2rem;background-position:-3.0rem -10.7rem;} .btn-sub1.ic4:after {transform:rotate(45deg);} .btn-sub1.ic5 {gap:0.8rem;padding:0 1.6rem;} .btn-sub1.ic5:before {content:'\21BB';font-weight:400;font-size:1.2em;transform:rotate(50deg);} .btn-sub1.file1 {min-width:12.0rem;background-color:#007013;border-color:#007013;color:var(--color-gray1);gap:0.8rem;} .btn-sub1.file1:before {width:1.0rem;height:2.0rem;background-position:-23.0rem 0;} /* SUB2 */ .btn-sub2 {min-width:4.8rem;padding:0.4rem 1.2rem;font-weight:700;font-size:1.2rem;line-height:2.0rem;border:0.1rem solid var(--color-gray0);background:var(--color-gray1);} .btn-sub2[class*=" file"], .btn-sub2[class*=" down"] {overflow:hidden;font-size:0.1rem;width:4.8rem;height:3.0rem;} .btn-sub2[class*=" file"]:before, .btn-sub2[class*=" down"]:before {content:'';display:block;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);background:var(--img1) no-repeat -23.0rem -2.5rem;background-size:var(--img1x2);} .btn-sub2[class*=" file"]:before {width:2.0rem;height:2.0rem;background-position:-23.0rem -2.5rem;} .btn-sub2[class*=" down"]:before {width:1.8rem;height:1.3rem;background-position:-27.5rem -2.5rem;} .btn-sub2[class*=" down"] {background-color:var(--color-gray3);border-color:var(--color-gray3);} /* ICON */ .btn-icon1 {width:3.6rem;height:3.6rem;font-size:0.1rem;} .btn-icon1, .btn-icon1::selection {color:transparent;} .btn-icon1:after {content:'';position:absolute;left:0;right:0;top:0;bottom:0;width:2.8rem;height:2.8rem;margin:auto;background:var(--img1) no-repeat -21.0rem -2.5rem;background-size:var(--img1x2);} .btn-icon1.ic1:after {background-position:-2.5rem -12.5rem;} .btn-icon2 {font-size:1.6rem;line-height:2.8rem;font-weight:700;display:inline-flex;gap:1.6rem;} .btn-icon2:before, .btn-icon2:after {content:'';display:block;width:2.8rem;height:2.8rem;box-sizing:border-box;} .btn-icon2:before {position:absolute;right:0;top:0;background:var(--img1) no-repeat -21.0rem -2.5rem;background-size:var(--img1x2);} .btn-icon2:after {border:0.3rem solid var(--color-gray0);} .btn-icon2.ic1:before, .btn-icon2.ic2:before {width:1.2rem;height:1.2rem;} .btn-icon2.ic1:before {height:1.2rem;background-position:-3.0rem -10.7rem;margin:0.8rem;} .btn-icon2.ic2:before {height:0.2rem;background-position:-3.0rem -11.2rem;margin:1.3rem 0.8rem;} .btn-icon2.ic1 span, .btn-icon2.ic2 span:not(.data) {overflow:hidden;position:absolute;left:-0.1rem;top:-0.1rem;width:0.1rem;height:0.1rem;opacity:0;} /* ETC */ .btn-etc1 {display:inline-block;width:19.2rem;padding:4.0rem 0;border:0.1rem solid var(--color-gray1);font-size:1.8rem;line-height:2.4rem;font-weight:800;text-align:center;color:var(--color-gray1);} .btn-etc1:hover, .btn-etc1:focus {background:rgba(255,255,255,0.1);} .btn-etc1.ic1:before {content:'';display:block;width:5.0rem;height:4.3rem;margin:0 auto 1.2rem;background:var(--img1) no-repeat -18.0rem -5.0rem;background-size:var(--img1x2);} /* LINK */ [class*="link-t"] {display:inline-block;line-height:2.4rem;white-space:nowrap;} [class*="link-t"]:before, [class*="link-t"]:after {content:'';display:block;position:absolute;} [class*="link-t"]:after {right:0;top:0.6rem;width:0.6rem;height:1.2rem;display:block;background:var(--img1) no-repeat -21.0rem -2.5rem;background-size:var(--img1x2);} [class*="link-t"]:hover, [class*="link-t"]:focus {outline:0;} [class*="link-t"]:hover:before, [class*="link-t"]:focus:before {left:0;right:3.0rem;bottom:0;border-top:0.1rem solid var(--color-gray0);} .link-t1 {padding:0 3.0rem 0 0;font-weight:700;color:var(--color-gray0);} .link-t2 {padding:0 2.4rem 0 0;} .link-t2 b {padding:0 0.4rem;} /* NAV LINK */ .nav-link1 {display:flex;gap:7.2rem;} .nav-link1 a {font-weight:700;text-align:center;} .nav-link1 a:before {content:'';display:block;width:4.4rem;height:4.4rem;margin:0 auto 1.2rem;background:var(--img1) no-repeat 0 -5.0rem;background-size:var(--img1x2);} .nav-link1 .ic1:before {background-position:0 -5.0rem;} .nav-link1 .ic2:before {background-position:-4.4rem -5.0rem;} .nav-link1 .ic3:before {background-position:-8.8rem -5.0rem;} .nav-link1 .ic4:before {background-position:-13.2rem -5.0rem;} /* -------------------------------------------------------------------------------- COMPONENT : BUTTON AREA --------------------------------------------------------------------------------- */ /* 중앙정렬 */ .area-btn1 {position:relative;margin:5.6rem 0 0;text-align:center;} .area-btn1 .side {position:absolute;left:0;top:50%;transform:translateY(-50%);} .area-btn1 .btn-sub1:only-child {min-width:12.0rem;padding:0.8rem 3.2rem;} .area-btn1 .btn-sub1 + .btn-com1, .area-btn1 .btn-com1 + .btn-sub1 {margin:0 0 0 3.2rem;} .area-btn1 .btn-action1 + .btn-action1 {margin:0 0 0 1.6rem;} .area-btn1:not(:last-child) {margin-bottom:4.0rem;} /* 우측정렬 */ .area-btn2 {display:flex;margin:0 0 1.6rem;justify-content:right;} .area-btn2 .btn-sub1 + .btn-com1, .area-btn2 .btn-com1 + .btn-sub1 {margin:0 0 0 1.8rem;} .area-btn2 .btn-sub1 + .btn-sub1 {margin:0 0 0 0.8rem;} .area-btn2 .btn-sub1 {min-width:12.0rem;} .area-btn2 .btn-com1 {min-width:15.0rem;} /* N분할 */ .area-btn3 {display:flex;flex-wrap:wrap;gap:1.6rem;align-content:start;} .area-btn3 a, .area-btn3 button {width:calc(50% - 0.8rem);} /* 좌정렬 */ .area-btn4 {text-align:left;margin:1.2rem 0 0;} /* -------------------------------------------------------------------------------- COMPONENT : TAB / PAGING --------------------------------------------------------------------------------- */ .nav-tab1 {margin:0 0 4.0rem;} .nav-tab1, .nav-tab1 > ul {position:relative;overflow:hidden;font-size:1.6rem;line-height:5.4rem;text-align:center;font-weight:700;} .nav-tab1 label > input {position:absolute;left:0;right:0;top:0;bottom:0;opacity:0;z-index:-1;width:100%;} .nav-tab1 > ul > li, .nav-tab1 > label {float:left;} .nav-tab1 > ul > li > a, .nav-tab1 > label input + span {position:relative;display:block;min-width:19.2rem;padding:0.2rem 3.2rem 0;background:var(--color-gray4);color:var(--color-gray3);} .nav-tab1 > ul > li > a[aria-current="page"], .nav-tab1 > ul > li > a[aria-selected="true"], .nav-tab1 > label input:checked + span {background:var(--color-gray1);color:var(--color-gray0);z-index:1;} .nav-tab1 > ul > li > a[aria-current="page"]:before, .nav-tab1 > ul > li > a[aria-selected="true"]:before, .nav-tab1 > label input:checked + span:before {content:'';display:block;position:absolute;left:0;right:0;top:0;bottom:-0.3rem;box-shadow:0 0 0 0.3rem inset var(--color-gray0);} .tit-sub1 + .nav-tab1 {margin-top:4.0rem;} .nav-tab1.sub1 {margin:5.6rem 0 4.0rem;} .nav-tab1.sub1 > ul {height:5.6rem;padding:0 0 0.3rem;line-height:5.1rem;} .nav-tab1.sub1 > ul:before {content:'';display:block;position:absolute;left:0;right:0;bottom:0;border-bottom:0.3rem solid var(--color-gray0);} .nav-tab1.sub1 > ul > li > a, .nav-tab1.sub1 > label input + span {min-width:12.7rem;} .nav-tab1.sub1 > ul > li > a[aria-current="page"], .nav-tab1.sub1 > ul > li > a[aria-selected="true"], .nav-tab1.sub1 > label input:checked + span {height:5.9rem;} .nav-tab1.sub1 > ul > li > a[aria-current="page"]:before, .nav-tab1.sub1 > ul > li > a[aria-selected="true"]:before, .nav-tab1.sub1 > label input:checked + span:before {bottom:-0.6rem;} [data-uiarea="tabcon"] {position:relative;} [data-uiarea="tabcon"]:not(.active) {display:none;} /* -------------------------------------------------------------------------------- COMPONENT : PAGENATION --------------------------------------------------------------------------------- */ .nav-pagenation {margin:5.6rem 0 0 0;text-align:center;white-space:nowrap;justify-content:center;font-size:0;} .nav-pagenation a {position:relative;display:inline-block;vertical-align:top;padding:0 1.2rem;font-size:1.6rem;line-height:3.2rem;color:var(--color-gray0);text-indent:-0.1em;} .nav-pagenation a[aria-current="page"] {font-weight:700;color:var(--color-gray0);} .nav-pagenation a[aria-current="page"]:before {content:'';position:absolute;left:1.0rem;right:1.0rem;bottom:0;height:0.2rem;background:var(--color-gray0);} .nav-pagenation a[aria-disabled="true"] {opacity:0.3;pointer-events:none;} .nav-pagenation .btn {width:0;padding:0 0 0 3.2rem;overflow:hidden;color:transparent;} .nav-pagenation .btn:before, .nav-pagenation .btn[data-btn="first"]:after, .nav-pagenation .btn[data-btn="last"]:after {content:'';position:absolute;left:50%;top:50%;} .nav-pagenation .btn:before {width:0.7rem;height:0.7rem;border-left:0.1rem solid var(--color-gray0);border-bottom:0.1rem solid var(--color-gray0);} .nav-pagenation .btn[data-btn="first"]:before, .nav-pagenation .btn[data-btn="before"]:before {transform:rotate(45deg);margin:-0.4rem 0 0 -0.2rem;} .nav-pagenation .btn[data-btn="next"]:before, .nav-pagenation .btn[data-btn="last"]:before {transform:rotate(-135deg);margin:-0.4rem 0 0 -0.5rem;} .nav-pagenation .btn[data-btn="first"]:after, .nav-pagenation .btn[data-btn="last"]:after {width:0;height:1.2rem;transform:translateY(-50%);border-left:0.1rem solid var(--color-gray0);} .nav-pagenation .btn[data-btn="first"]:before, .nav-pagenation .btn[data-btn="first"]:after {left:calc(50% + 0.4rem);} .nav-pagenation .btn[data-btn="first"]:after {margin:0 0 0 -0.8rem;} .nav-pagenation .btn[data-btn="last"]:after {margin:0 0 0 0.8rem;} .nav-pagenation .btn[data-btn="last"]:before, .nav-pagenation .btn[data-btn="last"]:after {left:calc(50% - 0.4rem);} .nav-pagenation .btn + a:not(.btn), .nav-pagenation a:not(.btn) + .btn {margin-left:1.2rem;} /* -------------------------------------------------------------------------------- COMPONENT : LINEMAP --------------------------------------------------------------------------------- */ .nav-linemap > ol {position:relative;display:flex;gap:3.7rem;font-size:1.6rem;line-height:2.4rem;color:var(--color-gray3);padding:0 0 0 3.0rem;} .nav-linemap > ol:before, .nav-linemap > ol:after {content:'';position:absolute;left:0;} .nav-linemap > ol:before {top:50%;width:1.2rem;height:0.6rem;background:var(--color-gray0);margin:0.0rem 0 0 0.2rem;} .nav-linemap > ol:after {bottom:50%;margin:0;width:0;height:0;border-bottom:0.7rem solid var(--color-gray0);border-left:0.8rem solid transparent;border-right:0.8rem solid transparent;} .nav-linemap > ol > li {position:relative;} .nav-linemap > ol > li:before{content:'';position:absolute;} .nav-linemap > ol > li + li:before {content:'';position:absolute;left:-2.1rem;top:0.6rem;width:0.6rem;height:1.2rem;display:block;background:var(--img1) no-repeat -20.0rem -2.5rem;background-size:var(--img1x2);} .nav-linemap > ol > li a {display:block;} .nav-linemap > ol > li[aria-current="location"] {font-weight:700;color:var(--color-gray0);} /* -------------------------------------------------------------------------------- COMPONENT : STEP INFOMATION --------------------------------------------------------------------------------- */ .info-step1 > ol {display:flex;gap:5.4rem;font-size:1.6rem;line-height:2.4rem;font-weight:700;color:var(--color-gray3);counter-reset:cnt;} .info-step1 > ol > li {position:relative;padding:0 0 0 3.2rem;counter-increment:cnt;} .info-step1 > ol > li:before, .info-step1 > ol > li:after {content:'';position:absolute;box-sizing:border-box;} .info-step1 > ol > li:before {content:counter(cnt);left:0;top:0;width:2.4rem;height:2.4rem;border:0.1rem dashed var(--color-gray0);border-radius:100%;font-weight:700;text-align:center;line-height:2.2rem;} .info-step1 > ol > li + li:after {content:'';position:absolute;left:-3.1rem;top:0.6rem;width:0.6rem;height:1.2rem;display:block;background:var(--img1) no-repeat -20.0rem -2.5rem;background-size:var(--img1x2);} .info-step1 > ol > li a {display:block;} .info-step1 ol > li[aria-current="step"] {color:var(--color-gray0);} .info-step1 ol > li[aria-current="step"]:before {background:var(--color-gray0) var(--img1) no-repeat -25.1rem -0.1rem;background-size:var(--img1x2);color:transparent;} .info-step2 > ol {position:relative;display:flex;padding:0 5.4rem;font-size:1.6rem;line-height:2.6rem;text-align:center;font-weight:800;} .info-step2 > ol > li:not(:last-child):before, .info-step2 > ol > li:after {content:'';display:block;position:absolute;left:50%;top:1.1rem;width:100%;} .info-step2 > ol > li:not(:last-child):before {height:0.1rem;background:var(--color-gray3);} .info-step2 > ol > li:after {height:0.3rem;background:var(--color-gray0);top:1.0rem;} .info-step2 > ol > li {position:relative;flex:1;padding:3.0rem 0 0;} .info-step2 > ol > li[aria-current="step"]:after {width:50%;} .info-step2 > ol > li:last-child[aria-current="step"]:after {width:0%;} .info-step2 > ol > li[aria-current="step"] ~ li {font-weight:400;color:var(--color-gray3);} .info-step2 > ol > li[aria-current="step"] ~ li:after {top:0.7rem;width:0.4rem;height:0.4rem;background:var(--color-gray1);border:0.2rem solid var(--color-gray3);border-radius:100%;} .info-step2 > ol > li > em {position:absolute;left:50%;top:0;width:2.4rem;height:2.4rem;margin:0 0 0 -1.2rem;background:var(--color-gray0) var(--img1) no-repeat -25.0rem 0;background-size:var(--img1x2);border-radius:100%;font-size:0.1rem;color:transparent;z-index:1;} .info-step2 > ol > li > em.state1 {background-position:-27.5rem 0;} .info-step2 > ol > li:not(:last-child)[aria-current="step"]:after { width:0; animation:progressAni1 1.2s linear infinite; } @keyframes progressAni1 { 0% {width:0;} 100% {width:100%;} } /* -------------------------------------------------------------------------------- COMPONENT : FORM ELEMENT : INPUT / SELECT --------------------------------------------------------------------------------- */ /* 폼객체 : 공통 */ [class*="el-text"], [class*="el-textarea"], [class*="el-select"] {width:24.0rem;border:1px solid var(--color-gray3);background:var(--color-gray1);font-size:1.6rem;line-height:2.4rem;color:var(--color-gray0);} [class*="el-text"]:focus, [class*="el-textarea"]:focus, [class*="el-select"]:focus, [class*="el-text"].focus, [class*="el-textarea"].focus, [class*="el-select"].focus {border-color:var(--color-gray0);color:#000;outline:0;} [class*="el-text"]:focus-visible, [class*="el-textarea"]:focus-visible, [class*="el-select"]:focus-visible {outline:0.1rem solid var(--color-gray0);} input[aria-invalid="true"], [class*="el-textarea"][aria-invalid="true"], select[aria-invalid="true"], input[aria-invalid="true"]:focus, [class*="el-textarea"][aria-invalid="true"]:focus, select[aria-invalid="true"]:focus {border-color:#ff0000;} [class*="el-text"]:disabled, [class*="el-textarea"]:disabled, [class*="el-select"]:disabled {color:var(--color-gray3);border-color:var(--color-gray2);background-color:var(--color-gray4) !important;} [class*="el-text"][readonly], [class*="el-textarea"][readonly], [class*="el-select"][readonly] {border-color:var(--color-gray2);background-color:var(--color-gray4);} :-ms-input-placeholder {color:var(--color-gray2) !important;} ::-ms-input-placeholder {color:var(--color-gray2) !important;} ::-webkit-input-placeholder {color:var(--color-gray2) !important;} ::placeholder {color:var(--color-gray2) !important;} /* 사이즈 */ .w100 {width:100% !important;} .w75 {width:75% !important;} .w50 {width:50% !important;} .el-w1 {width:24.0rem !important;} .el-w2 {width:48.0rem !important;} .el-w3 {width:11.2rem !important;} .el-s0 {width:10.0rem !important;} .el-s1 {width:16.0rem !important;} .el-s2 {width:60.0rem !important;} .el-s3 {width:45.0rem !important;} .el-s4 {width:38.7rem !important;} .el-s5 {width:31.4rem !important;} .el-s6 {width:36.4rem !important;} /* 폼객체 : text */ .el-text1 {padding:0 2.4rem;height:4.0rem;} .el-text2 {padding:0 2.4rem;height:6.4rem;text-align:center;} /* 폼객체 : textarea */ .el-textarea1 {padding:1.0rem 2.4rem;width:100%;vertical-align:top;} /* 폼객체 : selectbox */ .el-select1 {height:4.0rem;padding:0 4.4rem 0 2.4rem;background:var(--color-gray1) url(../../images/com/img_form1.svg) no-repeat calc(100% - 1.4rem) 50%;background-repeat:no-repeat;-webkit-appearance:none;-moz-appearance:none;appearance:none;} .el-select1:disabled {background:none;} .selectbox::-ms-expand {display:none;} /* -------------------------------------------------------------------------------- COMPONENT : FORM ELEMENT : RADIO / CHECKBOX --------------------------------------------------------------------------------- */ [class*="label-check"] {display:inline-flex;flex-wrap:wrap;} [class*="label-check"] label {position:relative;} [class*="label-check"] label > input {position:absolute;left:0;right:0;top:0;bottom:0;opacity:0;z-index:-1;width:100%;} [class*="label-check"] label > input ~ span {position:relative;display:inline-block;font-size:1.6rem;line-height:2.2rem;vertical-align:top;} [class*="label-check"].list {flex-direction:column;} .label-check1 {gap:0 2.4rem;} .label-check1 label > input + span {padding:0.9rem 0 0.9rem 3.0rem;} .label-check1 label > input + span:before, .label-check1 label > input + span:after {content:'';position:absolute;left:0;top:0.9rem;box-sizing:border-box;} .label-check1 label > input + span:before {width:2.2rem;height:2.2rem;border:0.3rem solid var(--color-gray0);z-index:0;background:var(--color-gray1);} .label-check1 label > input:focus-visible + span:before {outline:0.2rem dotted var(--color-gray2);} .label-check1 label > input[type="radio"] + span:before {border-radius:50%;} .label-check1 label > input:checked + span:before {background:var(--color-gray0);} .label-check1 label > input:checked + span:after {display:block;width:1.3rem;height:1.0rem;margin:0.6rem 0.5rem;background:var(--img1) no-repeat -25.6rem -0.7rem;background-size:var(--img1x2);} .label-check1 label > input:disabled + span {color:var(--color-gray2);} .label-check1 label > input:disabled + span:before, .label-check1 label > input:disabled:checked + span:after {background-color:#f6f5f6;border-color:var(--color-gray2);} .label-check1 label > input:disabled:checked + span:after {background-position:-25.6rem -3.1rem;} .label-check1.simple label {width:2.2rem;overflow:hidden;white-space:nowrap;} .label-check1.simple label > input + span {padding:0 0 0 2.2rem;} .label-check1.simple label > input + span:before, .label-check1.simple label > input + span:after {top:0;} .label-check1 + .label-check1 {margin:0 0 0 2.4rem;} .label-check2 {gap:0.8rem;} .label-check2 label > input ~ span {padding:0.8rem 0;} .label-check2 label > input + span {padding:0.8rem 2.4rem;border:0.1rem dashed var(--color-gray0);border-radius:2.0rem;font-weight:700;} .label-check2 label > input + span + span {margin:0 0 0 0.8rem;} .label-check2 label > input:checked + span {border:0.1rem solid var(--color-gray0);background:var(--color-gray0);color:var(--color-gray1);box-shadow:0 0.2rem 0.2rem var(--color-gray2);} .label-check2 label > input:disabled + span {background-color:var(--color-gray4);border-color:var(--color-gray2);color:var(--color-gray2);} .label-check2 label > input:disabled:checked + span {background-color:var(--color-gray2);border-color:var(--color-gray2);color:var(--color-gray1);} .label-check2 label ~ [class*="input-"] {margin:0 0 0 1.6rem;} .label-check3 {gap:0.8rem;} .label-check3 label > input ~ span {padding:0.8rem 0;} .label-check3 label > input + span {padding:0.8rem 1.6rem;border:0.1rem dashed var(--color-gray0);border-radius:2.0rem;font-weight:700;} .label-check3 label > input + span:before {content:'';display:inline-block;vertical-align:top;width:1.3rem;height:1.0rem;margin:0.6rem 0.8rem 0 0;background:var(--img1) no-repeat -25.6rem -3.1rem;background-size:var(--img1x2);} .label-check3 label > input + span + span {margin:0 0 0 0.8rem;} .label-check3 label > input:checked + span {border:0.1rem solid var(--color-gray0);background:var(--color-gray0);color:var(--color-gray1);box-shadow:0 0.2rem 0.2rem var(--color-gray2);} .label-check3 label > input:checked + span:before {background-position:-25.6rem -0.7rem;} .label-check3 label > input:disabled + span {background-color:var(--color-gray4);border-color:var(--color-gray2);color:var(--color-gray2);} .label-check3 label > input:disabled:checked + span {background-color:var(--color-gray2);border-color:var(--color-gray2);color:var(--color-gray1);} /* -------------------------------------------------------------------------------- COMPONENT : FORM ELEMENT : file --------------------------------------------------------------------------------- */ /* 유형1 */ .label-file1 {display:flex;flex-wrap:wrap;gap:0.8rem;width:100%;line-height:4.0rem;} .label-file1 > div {display:flex;gap:1.6rem;max-width:100%;} .label-file1 > div label {position:relative;display:flex;gap:1.6rem;align-items:center;} .label-file1 > div label input {position:absolute;opacity:0;z-index:-1;width:100%;height:100%;} .label-file1 > div label > span:nth-of-type(1) {width:14.9rem;height:4.0rem;padding:0 0.8rem;font-size:1.8rem;background:var(--color-gray0);color:var(--color-gray1);text-align:center;font-weight:800;} .label-file1 > div .upload:after {content:'';display:block;position:absolute;right:1.4rem;top:50%;width:1.2rem;height:1.2rem;display:block;margin:-0.6rem 0 0;background:var(--img1) no-repeat -3.0rem -10.7rem;background-size:var(--img1x2);transform:rotate(45deg);} .label-file1 > div div span + span, .label-file1 > div div span + span::selection {color:transparent;} .label-file1 > div div.upload {position:relative;display:block;min-width:14.9rem;max-width:14.9rem;padding:0 4.0rem 0 2.4rem;font-size:1.6rem;font-weight:700;box-shadow:0 0 0 0.1rem inset var(--color-gray0);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .label-file1 > div div.upload span:not([role="button"]) {pointer-events:none;} .label-file1 > div div.upload span + span {position:absolute;left:0;right:0;top:0;bottom:0;z-index:-1;} .label-file1:not([data-append="complete"]) > div[data-fileupload="field"]:only-child:after {content:'선택된 파일 없음';} .label-file1:not([data-append="complete"]) > div[data-fileupload="field"]:nth-child(1) .upload {display:none;} .label-file1:not([data-append="complete"]) > div[data-fileupload="field"]:nth-child(1) ~ div > label {display:none;} .label-file1[data-append="complete"] > div label {display:none;} .label-file1 > div div:not([data-fileupload="del"]) {position:relative;} .label-file1 > div div:not([data-fileupload="del"]) span.text {display:block;min-width:14.9rem;max-width:14.9rem;padding:0 4.0rem 0 2.4rem;font-size:1.6rem;font-weight:700;box-shadow:0 0 0 0.1rem inset var(--color-gray0);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .label-file1 > div div:not([data-fileupload="del"]) span.text:not([role="button"]) + span.upload {left:0;bottom:0;} .label-file1 > div div:not([data-fileupload="del"]) span.upload {position:absolute;left:calc(100% - 4.0rem);top:0;width:4.0rem;} .label-file1 + .label-file1 {margin:0.8rem 0 0;} /* -------------------------------------------------------------------------------- COMPONENT : FORM ELEMENT : 가변형 --------------------------------------------------------------------------------- */ .input-data1 {display:inline-flex;gap:1.6rem;align-items:center;} .input-data1 .txt-t1 {white-space:nowrap;} .input-data2 {display:flex;gap:3.6rem;} .input-data2 > :last-child {width:calc(100% - 27.6rem);} .input-data3 {display:flex;flex-direction:column;gap:0.8rem;} .input-data3 > [class*="el-"] {width:100%;} .input-data4 {display:inline-flex;gap:1.6rem;align-items:center;white-space:nowrap;} .input-data4 > [class*="el-select"] {width:auto;min-width:15.8rem;} .input-data5 {display:flex;gap:0.4rem;flex-wrap:wrap;max-width:21.0rem;margin:0 auto;} .input-data5 > [class*="el-select"] {width:auto;} .input-data5 > .input-time1 {flex:1;} .input-data5 > [class*="el-select"]:nth-child(1):nth-last-child(3) {width:100%;} .input-data5 + .input-data5 {margin-top:1.6rem;} .input-wrap1 {position:relative;display:inline-flex;flex-direction:column;gap:0.8rem;padding:0 3.2rem 0 0;min-height:4.0rem;vertical-align:top;} .input-wrap1 [data-btn="side"] {position:absolute;right:0;top:0;margin:0.6rem 0;} .input-wrap2 {position:relative;display:inline-flex;flex-direction:column;gap:0.8rem;} /* -------------------------------------------------------------------------------- COMPONENT : FORM ELEMENT : 고정형 --------------------------------------------------------------------------------- */ .input-num1 {display:inline-flex;gap:1.6rem;} .input-num1 > .el-select1, .input-num1 > .el-text1 {width:16.0rem;} .input-email1 {display:inline-flex;gap:1.6rem;} .input-addr1 {display:flex;flex-wrap:wrap;gap:1.6rem;} .input-addr1 button {width:17.8rem;} .input-addr1 input:nth-of-type(1) {width:9.4rem;} .input-addr1 input:nth-of-type(2) {width:calc(100% - 30.4rem);} .input-addr1 input:nth-of-type(3) {width:100%;} .input-unit1 {display:inline-flex;gap:0.8rem;} .input-unit1 [class*="el-"] {width:9.0rem;} .input-unit1 [class*="el-"]:not(:only-of-type) {width:5.8rem;} .input-unit1 [class*="el-text"] {text-align:right;padding:0 0.8rem;letter-spacing:0;} .input-unit1 [class*="el-text"] ~ span {line-height:4.0rem;} .input-unit1 .unit {font-weight:700;} .label-check1 .input-unit1 {margin:0 0 0 0.8rem;} .input-date1 {display:inline-flex;} .input-date1 button {position:relative;width:4.0rem;height:4.0rem;font-size:0.1rem;line-height:1;color:transparent;overflow:hidden;margin:0 0 0 -4.0rem;} .input-date1 button:after {content:'';position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;width:2.2rem;height:2.2rem;background:var(--img1) no-repeat 0 -12.5rem;background-size:var(--img1x2);} .input-date1 [class*="el-"]:not(:only-of-type) {width:17.0rem;} .input-date1 [class*="el-"]:not(:only-of-type)~ span {width:2.4rem;text-align:center;line-height:4.0rem;} .input-date1.w100 {display:flex;} .input-date1.w100 [class*="el-"] {width:100%;} .input-date1.w100 [class*="el-"]:not(:only-of-type) {width:calc(50% - 1.2rem);} .input-banknum1 {display:inline-flex;gap:1.6rem;} .input-banknum1 [class*="el-"] {width:16.0rem;} .input-banknum1 [class*="el-select"] + [class*="el-text"] {width:31.4rem;} .input-time1 {display:inline-flex;gap:0.8rem;align-items:center;} .input-time1 [class*="el-"] {width:9.0rem;} .input-time1.w100 {display:flex;} .input-time1.w100 [class*="el-"] {width:calc(50% - 1.2rem);} /* -------------------------------------------------------------------------------- COMPONENT : FORM ELEMENT : label형 --------------------------------------------------------------------------------- */ .label-t1 {display:inline-flex;gap:2.4rem;white-space:nowrap;} .label-t1 > :first-child {min-width:5.4rem;padding:1.0rem 0;font-size:1.6rem;line-height:2.0rem;font-weight:700;} .label-t1 + .label-t1:not(.w100) {margin:0 0 0 5.6rem;} .label-t1.file {display:flex;} dl.label-t1.file > dt {width:11.0rem;} dl.label-t1.file > dd {width:calc(100% - 13.4rem);} .form-t1 {border:0.1rem solid var(--color-gray0);padding:2.8rem;text-align:center;} /* -------------------------------------------------------------------------------- COMPONENT : SEARCH AREA --------------------------------------------------------------------------------- */ /* 검색폼 */ .area-search1 {position:relative;display:flex;gap:1.6rem;margin:0 0 5.6rem;background:var(--color-gray4);padding:3.2rem 7.2rem;justify-content:center;} .area-search1 .label-t1 {gap:1.6rem;} .area-search1 .label-t1 + .label-t1 {margin:0 0 0 4.0rem;} .area-search1 .btn {display:inline-flex;gap:1.6rem;} .area-search1 .el-select1:not([class*=" el-s"]) {width:17.0rem;} .area-search1[class*=" data-t"] {justify-content:start;} .area-search1.data-t2 {flex-wrap:wrap;gap:1.6rem 5.6rem;padding-right:22.4rem;} .area-search1.data-t2 .label-t1.auto {flex:1;} .area-search1.data-t2 .label-t1.auto > :first-child ~ :last-child {flex:1;} .area-search1.data-t2 .label-t1.auto > :first-child {min-width:3.0rem;} .area-search1.data-t2 .label-t1 + .label-t1 {margin:0;} .area-search1.data-t2 .btn {position:absolute;right:7.2rem;top:3.2rem;} .area-search1.data-t2 .btn2 {position:absolute;right:7.2rem;bottom:3.2rem;} .area-search1.data-t3 {flex-wrap:wrap;justify-content:space-between;} .area-search1.data-t3 .label-t1 + .label-t1 {margin:0;} .area-search1.data-t3 .btn {position:absolute;right:7.2rem;bottom:3.2rem;} .area-search1.data-t3 .btn2 {display:inline-flex;gap:1.6rem;} .ui-autocomplete {width:55rem !important; border:2px solid var(--color-gray0); border-top-width:.1rem;} .ui-autocomplete li {padding:.5rem 0 .5rem 1rem; font-size:1.6rem;} /* 간략검색 */ .area-search2 {display:flex;justify-content:right;gap:1.6rem;margin:0 0 2.0rem;} .area-search2 .label-check1 + .el-select1 {margin:0 0 0 2.4rem;} .area-search2 .el-select1 {width:16.0rem;} .area-search2 .btn-com1 {min-width:18.7rem;} .area-search2 + .txt-cnt1 {margin-top:-6.0rem;} /* 간략검색 */ .area-search3 {display:flex;gap:0.8rem;margin:0 0 3.6rem;} .area-search3 [class*="el-select"] {width:14.0rem;} .area-search3 [class*="el-text"] {flex:1;} /* -------------------------------------------------------------------------------- COMPONENT : AGREE AREA --------------------------------------------------------------------------------- */ .form-agree1 {position:relative;border:0.1rem solid var(--color-gray0);} .form-agree1 legend.tit {padding:2.2rem 4.8rem;font-size:1.8rem;line-height:2.8rem;font-weight:800;} .form-agree1 [aria-expanded], .form-agree1 .form {position:absolute;right:0;top:0;} .form-agree1 [aria-expanded] {margin:1.6rem 4.8rem;z-index:1;} .form-agree1 .form {display:flex;gap:7.0rem;align-items:center;justify-content:space-between;min-width:60.4rem;padding:1.6rem 4.8rem;} .form-agree1 .con {padding:4.0rem 0 3.0rem;background:var(--color-gray4);} .form-agree1 .con > div {height:50.0rem;padding:0 10.7rem;} .form-agree1 .con > div[data-area="scroll"] {overflow-y:auto;} .form-agree1 .con > div[data-area="scroll"]::-webkit-scrollbar {width:0.4rem;} .form-agree1 .con > div[data-area="scroll"]::-webkit-scrollbar-thumb {background:#dfdfdf;opacity:0.2;} .form-agree1 .con > div[data-area="scroll"]::-webkit-scrollbar-track {background:#f8f8f8;border-radius:0;} .form-agree1 [aria-expanded="false"] ~ .con {visibility:hidden;padding:0;} .form-agree1 [aria-expanded="false"] ~ .con > div {height:0;} .form-agree1 [aria-expanded="true"] ~ .con {visibility:visible;padding:4.0rem 0 3.0rem;} .form-agree1 + .form-agree1 {margin:1.6rem 0 0;} /* -------------------------------------------------------------------------------- COMPONENT : AGREE ACCORDION --------------------------------------------------------------------------------- */ .area-accordion1, .area-accordion1 > dl > dt, .area-accordion1 > dl > dd {position:relative;} .area-accordion1 > dl > dt {padding:2.2rem 4.8rem;font-size:1.8rem;line-height:2.8rem;font-weight:800;border:0.1rem solid var(--color-gray3);} .area-accordion1 > dl > dt [aria-expanded] {position:absolute;right:0;top:0;margin:1.6rem 4.8rem;z-index:1;} .area-accordion1 > dl > dt + dd {padding:4.0rem 4.9rem;border:0.1rem solid var(--color-gray3);border-top-color:var(--color-gray2);} .area-accordion1 > dl > dd + dd {padding:3.2rem 4.9rem;background:var(--color-gray4);} .area-accordion1 > dl > dd {display:none;} .area-accordion1.active > dl > dt {margin:0 0 -0.1rem;} .area-accordion1.active > dl > dd {display:block;} .area-accordion1:not(.active) > dl > dt [aria-expanded] span:not(:only-child):nth-of-type(2) {display:none;} .area-accordion1.active > dl > dt [aria-expanded] span:not(:only-child):nth-of-type(1) {display:none;} .area-accordion1 + .area-accordion1 {margin:4.0rem 0 0;} .area-accordion1 > dl > dd + dd .list-t3 > ul > li:nth-child(1) {background:var(--color-gray1);} .area-accordion1 > dl > dd + dd .list-t3 > ul > li:nth-child(1) span + span {font-weight:700;} /* -------------------------------------------------------------------------------- COMPONENT : TABLE1 --------------------------------------------------------------------------------- */ /* 공통 */ .tbl-data1 {--el-width:20.0rem;position:relative;margin:0 0 5.6rem;border-top:0.3rem solid var(--color-gray0);border-bottom:0.1rem solid var(--color-gray2);} .tbl-data1 > dl, .tbl-data1 > li, .tbl-data1 > table th, .tbl-data1 > table td {min-height:7.2rem;} .tbl-data1 > dl > dt, .tbl-data1 > dl > dd, .tbl-data1 > li > div {padding:1.6rem 2.4rem;font-size:1.6rem;line-height:4.0rem;} .tbl-data1 > dl > dt, .tbl-data1 > table th, .tbl-data1 > li > div:nth-child(1) {padding:2.6rem 2.4rem;font-weight:700;line-height:2.0rem;} .tbl-data1 > dl ~ dl, .tbl-data1 > table tbody th, .tbl-data1 > table tbody td, .tbl-data1 > li + li {border-top:0.1rem solid var(--color-gray2);} .tbl-data1 > dl, .tbl-data1 > li {display:flex;flex-wrap:wrap;} .tbl-data1 > dl > dt, .tbl-data1 > li > div:nth-child(1) {width:var(--el-width);} .tbl-data1 > dl > dt + dd, .tbl-data1 > li > div:nth-child(2) {flex:1;border-left:0.1rem solid var(--color-gray2);width:calc(100% - var(--el-width));} .tbl-data1 > dl > dt + dd:not(:only-of-type) {width:calc(50% - var(--el-width));} .tbl-data1 > dl > dd + dt {border-left:0.1rem solid var(--color-gray2);} .tbl-data1 > dl > dd > ul:not([class]) > li + li {margin:0.4rem 0 0;} .tbl-data1 > dl > dd .txt-guide1 {margin:1.5rem 0 0;} .tbl-data1 > dl > dd .txt-guide1 + .txt-t1 {margin:0.6rem 0 0;} .tbl-data1 > dl > dd .box-t1 {margin:1.0rem 0;} .tbl-data1:last-child {margin:0;} [class*="pop-modal"] .tbl-data1 {--el-width:16.0rem;} [class*="pop-modal"] .tbl-data1 > dl, [class*="pop-modal"] .tbl-data1 > li, [class*="pop-modal"] .tbl-data1 > table th, [class*="pop-modal"] .tbl-data1 > table td {min-height:6.0rem;} [class*="pop-modal"] .tbl-data1 > dl > dt, [class*="pop-modal"] .tbl-data1 > dl > dd, [class*="pop-modal"] .tbl-data1 > li > div {padding:1.0rem 1.6rem;font-size:1.6rem;line-height:4.0rem;} [class*="pop-modal"] .tbl-data1 > dl > dt, [class*="pop-modal"] .tbl-data1 > li > div:nth-child(1) {text-align:center;} .tbl-data1[data-width] {--el-width:attr(data-width);} .tbl-data1[data-width] > dl > dt, .tbl-data1[data-width] > li > div:nth-child(1) {width:var(--el-width);text-align:center;} .tbl-data1[data-width] > dl > dt + dd, .tbl-data1[data-width] > li > div:nth-child(2) {width:calc(100% - var(--el-width));} .tbl-data1 > dl.t1 {background:var(--color-gray0);color:var(--color-gray1);font-weight:700;} .tbl-data1 + .sub-con3 {margin-top:-1.6rem;} .tbl-data1.group + .tbl-data1.group {margin-top:-5.7rem;border-top:0.1rem solid var(--color-gray2);} /* TABLE : 셀 가로설정 */ .tbl-data1 .num, .tbl-data1 .form {width:7.2rem;} .tbl-data1 .num2 {width:10.4rem;} .tbl-data1 .column1 {width:12.0rem;} .tbl-data1 .column2 {width:16.0rem;} .tbl-data1 .column3 {width:18.0rem;} .tbl-data1 .column4 {width:22.0rem;} .tbl-data1 .column5 {width:24.0rem;} .tbl-data1 .column6 {width:28.0rem;} /* TABLE : 기본 */ .tbl-data1 > table th, .tbl-data1 > table td {height:5.9rem;padding:0.9rem 1.6rem;line-height:2.0rem;} .tbl-data1 > table thead th {height:4.0rem;min-height:4.0rem;} .tbl-data1 > table thead ~ tbody th, .tbl-data1 > table thead ~ tbody td {text-align:center;} .tbl-data1 > table tbody th, .tbl-data1 > table tbody td.group {font-weight:400;border-right:0.1rem solid var(--color-gray2);} .tbl-data1 > table tbody thead th:last-child {border-right:0;} .tbl-data1 > table thead th.sub > span:nth-child(1) {overflow:hidden;position:absolute;left:-0.1rem;top:-0.1rem;width:0.1rem;height:0.1rem;opacity:0;} .tbl-data1 > table thead th.sub > sub {display:flex;align-items:center;font-size:1.6rem;line-height:2.0rem;gap:1.6rem;} .tbl-data1 > table tbody th[rowspan], .tbl-data1 > table tbody td[rowspan].group, .tbl-data1 > table .group.align1 {vertical-align:top;padding:1.6rem;} .tbl-data1 > table .nodata {line-height:10.0rem;text-align:center;} .tbl-data1 > table td.tit {text-align:left;font-weight:700;} .tbl-data1 > table td.tit a {display:inline-block;max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;vertical-align:top;word-break:break-all;} .tbl-data1 > table td.tit a:hover, .tbl-data1 > table td.tit a:focus {text-decoration:underline;outline:0;} .tbl-data1 > table td.tit.group {text-align:center;font-weight:700;} .tbl-data1 > table td.align1 {text-align:left;} .tbl-data1 > table td.align2 {text-align:right;padding-left:0;} .tbl-data1 > table td.valign1 {vertical-align:top;} .tbl-data1 .tbl-data1 {border-top:0.1rem solid var(--color-gray2);margin:0;} .tbl-data1 .tbl-data1:first-child {border-top:none;} .tbl-data1 .tbl-data1 > table thead th {background:var(--color-gray4);} .tbl-data1 .tbl-data1 > table thead ~ tbody th, .tbl-data1 .tbl-data1 > table thead ~ tbody td {height:7.2rem;padding:1.4rem 1.6rem;} .tbl-data1 [class*="tbl-data"] > table {table-layout:auto;} /* TABLE : 서브타이틀형 */ .tbl-data1.data-t1 {padding:0 0 0 20.0rem;min-height:7.2rem;} .tbl-data1.data-t1 > .heading {position:absolute;left:0;top:0;width:20.0rem;padding:2.2rem 5.6rem;font-size:1.8rem;line-height:2.8rem;font-weight:700;text-align:center} .tbl-data1.data-t1 > legend.heading {text-align:left;} .tbl-data1.data-t1 > dl, .tbl-data1.data-t1 > ul, .tbl-data1.data-t1 > table {border-left:0.1rem solid var(--color-gray2);} .area-section4 {position:relative;margin:0 0 5.6rem;padding:0 0 0 20.0rem;min-height:7.2rem;border-top:0.3rem solid var(--color-gray0);border-bottom:0.1rem solid var(--color-gray2);} .area-section4 > .heading {position:absolute;left:0;top:0;width:20.0rem;padding:4.2rem 2.4rem;font-size:1.6rem;line-height:2.8rem;font-weight:700;} .area-section4 > .con {border-left:0.1rem solid var(--color-gray2);} .area-section4 > .con > :first-child {border-top:0;} .area-section4 > .con > :last-child {border-bottom:0;} .area-section4 > .con .tbl-data1 > table thead th {background:var(--color-gray4);} /* TABLE : 상세리스트형 */ .tbl-data1.data-t2 {padding:0 0 0 20.0rem;min-height:7.2rem;} .tbl-data1.data-t2 > .heading, .tbl-data1.data-t2 > dt {position:absolute;left:0;top:0;bottom:0;display:flex;justify-content:center;align-items:center;width:20.0rem;padding:4.2rem 2.2rem;font-size:1.8rem;line-height:2.8rem;font-weight:700;border-right:0.1rem solid var(--color-gray2);} .tbl-data1.data-t2 > dl, .tbl-data1.data-t2 > ul, .tbl-data1.data-t2 > table, .tbl-data1.data-t2 > .tbl-data2 {border-left:0.1rem solid var(--color-gray2);} .tbl-data1.data-t2 > [class*="tbl-data"] {margin:0 0 -0.1rem;border-top:0;} .tbl-data1.data-t2 > [class*="tbl-data"] tbody th, .tbl-data1.data-t2 > [class*="tbl-data"] tbody td {vertical-align:top;padding:2.4rem 2.4rem;line-height:2.4rem;} .tbl-data1.data-t2 > [class*="tbl-data"] tbody tr ~ tr td {border-top:0.1rem dashed var(--color-gray2);} .tbl-data1.data-t2 + .tbl-data1.data-t2 {margin-top:-5.7rem;border-top:0.1rem solid var(--color-gray0);} .tbl-data1.data-t2 > dt {font-size:1.6rem;} /* TABLE : 스크롤 */ [data-area-scroll="true"] {position:relative;border-top:0.3rem solid var(--color-gray0);border-bottom:0.1rem solid var(--color-gray2);overflow:hidden;} [data-area-scroll="true"]::-webkit-scrollbar {width:0.4rem;height:0.4rem;} [data-area-scroll="true"]::-webkit-scrollbar-thumb {background:#dfdfdf;opacity:0.2;} [data-area-scroll="true"]::-webkit-scrollbar-track {background:#f8f8f8;border-radius:0;} [data-area-scroll="true"] .tbl-data1 {position:static;border:0;} [data-area-scroll="true"] .tbl-data1 > table {table-layout:fixed;} /* TABLE : 스크롤 : 세로스크롤 */ [data-area-scroll="true"]:not([data-scroll-direction="x"]) {max-height:34.4rem;overflow-y:auto;} [data-area-scroll="true"][data-scroll-row="line2"] {max-height:16.4rem;} [data-area-scroll="true"][data-scroll-row="line3"] {max-height:22.4rem;} [data-area-scroll="true"][data-scroll-row="line4"] {max-height:28.4rem;} [data-area-scroll="true"][data-scroll-row="line5"] {max-height:34.4rem;} [data-area-scroll="true"][data-scroll-row="view4"] {max-height:27.4rem;} /* TABLE : 스크롤 : 가로스크롤 */ [data-area-scroll="true"][data-scroll-direction="x"] {overflow-x:auto;} [data-area-scroll="true"][data-scroll-direction="x"] > table {min-width:100%;width:auto;table-layout:auto;white-space:nowrap;} [data-area-scroll="true"][data-scroll-direction="x"] > table thead > tr > th:first-child, [data-area-scroll="true"][data-scroll-direction="x"] > table tbody > tr > th:first-child { position:sticky;left:0;z-index:1;min-width:20.0rem; background:var(--color-gray1);border-right:0.1rem solid var(--color-gray2);box-shadow:0 0.1rem 0.3rem var(--color-gray2); } [data-area-scroll="true"][data-scroll-direction="x"].tbl-data1 > table tbody td {padding:0.9rem 2.4rem;} /* TABLE : 상단항목고정 */ [data-table-fixed="true"] {position:relative;} [data-table-fixed="true"] thead {position:sticky;top:0;background:#fff;z-index:50;} [data-table-fixed="true"] thead:after {content:'';display:block;position:absolute;left:0;right:0;bottom:-0.1rem;height:0.1rem;background:#a0a0a0;} [data-table-fixed="true"]:not([data-area-scroll="true"]) > table > thead {top:10.4rem;z-index:99;} /* -------------------------------------------------------------------------------- COMPONENT : TABLE1 --------------------------------------------------------------------------------- */ .tbl-data2 {overflow:hidden;border-top:0.1rem solid var(--color-gray0);} .tbl-data2 table {border-collapse:collapse;width:calc(100% + 0.2rem);margin:0 -0.1rem;} .tbl-data2 table th, .tbl-data2 table td {height:4.7rem;padding:1.4rem 1.2rem;line-height:2.0rem;font-weight:700;} .tbl-data2 table thead th {height:4.2rem;padding:1.0rem 1.2rem;} .tbl-data2 table thead ~ tbody th, .tbl-data2 table thead ~ tbody td {text-align:center;border:0.1rem solid var(--color-gray2);} .tbl-data2 table tbody th, .tbl-data2 table tbody td {border-right:0.1rem solid var(--color-gray2);} .tbl-data2 table thead tr + tr th {border-top:0.1rem solid var(--color-gray2);} .tbl-data2 + [class*="txt-bul"], .tbl-data2 + [class*="txt-num"] {margin:3.2rem 0 0;} /* -------------------------------------------------------------------------------- COMPONENT : BOARD --------------------------------------------------------------------------------- */ .tbl-view1 {border-bottom:0.3rem solid var(--color-gray0);} .tbl-view1 .headline {display:flex;gap:5.6rem;padding:0 0 4.0rem;border-bottom:0.3rem solid var(--color-gray0);} .tbl-view1 .headline h1 {flex:1;font-size:2.2rem;line-height:2.8rem;} .tbl-view1 .headline ul {gap:5.6rem;} .tbl-view1 .headline ul, .tbl-view1 .headline ul > li {display:flex;} .tbl-view1 .headline ul > li {gap:2.4rem;} .tbl-view1 .headline ul > li > div:nth-child(1) {font-weight:700;} .tbl-view1 .con {padding:7.2rem;line-height:2.6rem;} .tbl-view1 .info-file {display:flex;gap:5.6rem;padding:4.0rem 0;border-top:0.1rem solid var(--color-gray2);} .tbl-view1 .info-file > dt {font-size:1.8rem;line-height:2.8rem;font-weight:800;} .tbl-view1 .info-file > dd {flex:1;display:flex;flex-direction:column;align-items:flex-start;} .tbl-view1 .info-file > dd a {position:relative;font-size:1.6rem;line-height:2.6rem;} .tbl-view1 .info-file > dd a + a {margin:0.6rem 0 0;} .tbl-view1 .info-file > dd a:hover:before, .tbl-view1 .info-file > dd a:focus:before {content:'';display:block;position:absolute;left:0;right:0;bottom:0;height:0.1rem;background:var(--color-gray0);} /* -------------------------------------------------------------------------------- COMPONENT : LIST --------------------------------------------------------------------------------- */ /* 공통 */ [class*="list-t"] {line-height:4.8rem;} [class*="list-t"] > ul > li {position:relative;display:flex;white-space:nowrap;} [class*="list-t"] > ul > li + li {margin:0.1rem 0 0;} [class*="list-t"] > ul > li a {display:block;position:relative;} [class*="list-t"] > ul > li, [class*="list-t"] > ul > li a {overflow:hidden;text-overflow:ellipsis;} /* 유형1 */ .list-t1 > ul > li {background:var(--color-gray4);} .list-t1 > ul > li:before {content:'';display:block;position:absolute;left:1.6rem;top:50%;width:0.2rem;height:0.2rem;margin:-0.1rem 0 0;background:var(--color-gray0);} .list-t1 > ul > li + li {margin:0.1rem 0 0;} .list-t1 > ul > li, .list-t1 > ul > li > a {padding:0 2.6rem;} .list-t1 > ul > li > a {margin:0 -2.6rem;} .list-t1 > ul > li > a:focus-visible {box-shadow:0 0 0 0.1rem inset var(--color-gray0);} .list-t1 > ul > li span + span {margin:0 0 0 0.8rem;} .list-t1 > ul > li span:nth-child(1) {font-weight:700;} .list-t1 > p {line-height:14.6rem;background:var(--color-gray4);text-align:center;} /* 유형2 */ .list-t2 > ul > li span + span {margin:0 0 0 1.6rem;} .list-t2 > ul > li a:hover, .list-t2 > ul > li a:focus {outline:0;} .list-t2 > ul > li a:hover:before, .list-t2 > ul > li a:focus:before {content:'';position:absolute;left:0;right:0;bottom:0.8rem;height:0.1rem;background:var(--color-gray0);} /* 유형3 */ .list-t3 > ul > li > span {padding:0 2.4rem;} .list-t3 > ul > li + li {border-top:0.1rem solid var(--color-gray2);} .list-t3[data-area="scroll"] {max-height:19.8rem;overflow-y:auto;} .list-t3[data-area="scroll"]::-webkit-scrollbar {width:0.4rem;} .list-t3[data-area="scroll"]::-webkit-scrollbar-thumb {background:#dfdfdf;opacity:0.2;} .list-t3[data-area="scroll"]::-webkit-scrollbar-track {background:#f8f8f8;border-radius:0;} /* 유형4 */ .list-t4 {font-size:1.6rem;line-height:2.2rem;} .list-t4 > ul > li {gap:1.6rem;} .list-t4 > ul > li + li {margin:1.6rem 0 0;} .list-t4 .data1 {flex:1;text-align:right;} .list-t4 .data1 span {color:var(--color-sub1);padding:0 0.4rem;} .list-t4.data-t1 > ul > li {padding:0 2.4rem;} .list-t4.data-t1 .sum {display:flex;justify-content:space-between;margin:1.6rem 0 0;padding:1.6rem 2.4rem;background:var(--color-gray4);border-top:0.1rem solid var(--color-gray2);} .tbl-data1 .list-t4.data-t1 {margin:0.6rem -1.6rem -1.0rem;} .box-t1 {padding:2.4rem;background:var(--color-gray4);} /* -------------------------------------------------------------------------------- COMPONENT : INFO --------------------------------------------------------------------------------- */ /* 유형1 */ .info-data1 ul > li {display:flex;padding:1.0rem 0;gap:1.6rem;} .info-data1 ul > li > div:nth-child(1) {font-weight:700;} /* 유형2 */ .info-data2 dl {display:flex;border:0.1rem solid var(--color-gray0);} .info-data2 dl + dl {margin:1.0rem 0 0;} .info-data2 dl dt, .info-data2 dl dd {display:flex;height:8.0rem;align-items:center;justify-content:center;} .info-data2 dl dt {width:11.7rem;font-weight:800;} .info-data2 dl dd {flex:1;flex-direction:column;border-left:0.1rem solid var(--color-gray0);} .info-data2 dl dd span + span {font-weight:700;} .info-data2 dl dd:last-of-type {background:var(--color-gray0);color:var(--color-gray1);} /* 유형3 */ .info-data3 {position:relative;border-top:0.1rem solid var(--color-gray0);border-bottom:0.3rem solid var(--color-gray0);text-align:center;} .info-data3 dl {display:flex;flex-wrap:wrap;padding:0 0 0 20.0rem;} .info-data3 dl dt {display:flex;align-items:center;justify-content:center;position:absolute;left:0;top:0;bottom:0;width:20.0rem;font-size:1.8rem;line-height:2.8rem;font-weight:800;border-right:0.1rem solid var(--color-gray0);} .info-data3 dl dd:not(.sum) {flex:1;padding:1.8rem 0;line-height:2.4rem;} .info-data3 dl dd:not(.sum) + dd:not(.sum) {border-left:0.1rem solid var(--color-gray2);} .info-data3 dl dd:not(.sum) strong {color:var(--color-sub1);} .info-data3 dl dd.sum {width:100%;padding:3.1rem 0;background:var(--color-gray0);color:var(--color-gray1);} .info-data3 dl dd strong {font-size:1.125em;font-weight:800;padding:0 0.8rem;} /* 유형4 */ .info-data4 {line-height:8.6rem;} .info-data4 [class*="data"] {display:flex;justify-content:end;} .info-data4 [class*="data"] strong {font-size:1.125em;padding:0 0.8rem;} .info-data4 .data1 {border-top:0.1rem solid var(--color-gray2);} .info-data4 .data1 > li {padding:0 5.6rem;} .info-data4 .data1 > li + li {border-left:0.1rem solid var(--color-gray2);} .info-data4 .data1 strong {color:var(--color-sub1);font-weight:800;} .info-data4 .data2 {padding:0 5.6rem;background:var(--color-gray0);color:var(--color-gray1);} .info-data4 .data2 > li + li {margin:0 0 0 2.0rem;} .info-data4 .data2 > li + li.sum {position:relative;margin:0 0 0 8.9rem;} .info-data4 .data2 > li + li.sum:before {content:'';position:absolute;left:-4.4rem;top:50%;width:0.1rem;height:1.4rem;margin:-0.7rem 0 0;background:var(--color-gray1);} .info-data4 .data2 strong {font-weight:700;} /* 유형5 */ .info-data5 {position:relative;margin:2.4rem 0 0;background:var(--color-gray0);color:var(--color-gray1);} .info-data5 ul {position:relative;padding:2.4rem 0;} .info-data5 ul > li {width:50%;padding:0 2.4rem;} .info-data5 ul > li strong {font-size:1.125em;padding:0 0.8rem;} .info-data5 ul > li.sum {position:absolute;right:0;top:0;bottom:0;display:flex;justify-content:end;align-items:center;border-left:0.1rem solid var(--color-gray1);} .info-data5:before, .info-data5:after {content:'';display:block;position:absolute;left:0;right:0;height:0.3rem;background:var(--color-gray0) url(../../images/com/bg2.png) repeat 0 0;} .info-data5:before {bottom:100%;} .info-data5:after {top:100%;transform:rotate(180deg);} .tbl-data1 + [class*="info-data"] {margin-top:-5.7rem;} /* -------------------------------------------------------------------------------- COMPONENT : CONTENT --------------------------------------------------------------------------------- */ /* 유형1 */ .area-section1 {text-align:center;} .area-section1:not(ul), ul.area-section1 > li {padding:7.2rem;border:0.1rem solid var(--color-gray0);} .area-section1 .bottom {margin:7.2rem -7.2rem -7.2rem;padding:3.2rem;border-top:0.1rem solid vaR(--color-gray2);text-align:center;} .area-section1.form .input-data3 {width:48.0rem;margin:0 auto;} ul.area-section1 {display:flex;gap:2.4rem;} ul.area-section1 > li {width:calc(50% - 1.2rem);} /* 유형2 */ .area-section2 {position:relative;display:flex;justify-content:space-between;} .area-section2 section {padding:4.6rem 7.2rem;border:0.1rem solid var(--color-gray2);} .area-section2 section {width:calc(50% - 1.2rem);} .area-section2 section:only-child {width:100%;} .area-section2 + .area-section2, .area-section2 + section {margin:5.6rem 0 0;} .area-section2 .con {position:relative;} .area-section2 .con[aria-disabled="true"] * {pointer-events:none;} .area-section2 .con[aria-disabled="true"]:before, .area-section2 .con[aria-disabled="true"]:after {content:'';position:absolute;left:0;right:0;z-index:10;} .area-section2 .con[aria-disabled="true"]:before {top:0;bottom:0;background:rgba(241, 241, 241, 0.98);border:0.3rem dashed var(--color-gray0);} .area-section2 .con[aria-disabled="true"]:after {content:attr(aria-label);top:50%;font-size:2.2rem;text-align:center;font-weight:800;transform:translateY(-50%);} /* 유형3 */ .area-section3 {display:flex;align-items:flex-start;padding:0.1rem;box-shadow:0 0 0 0.1rem inset var(--color-gray0);} .area-section3:before {content:'';position:absolute;right:0;top:0;bottom:0;display:block;box-sizing:border-box;border:0.1rem solid var(--color-gray0);background:var(--color-gray4);} .area-section3:before, .area-section3 > :nth-child(2) {width:30.0rem;} .area-section3 > :nth-child(1) {flex:1;padding:5.6rem 7.2rem;} .area-section3 > :nth-child(2) {position:sticky;top:10.4rem;padding:4.8rem 3.5rem;} .area-section3 > :nth-child(2).img1 {background:url(../../images/com/bg3.png) no-repeat calc(100% - 1.6rem) 5.0rem;background-size:10.0rem 11.4rem;} /* -------------------------------------------------------------------------------- COMPONENT : 영역분할 / 영역위치 --------------------------------------------------------------------------------- */ .area-col2 {display:flex;gap:4.8rem;} .area-col2 > div {flex:1} .area-col2 > div.area-btn3 {width:25.6rem;flex:none;} .area-aside1 {position:relative;} .area-aside1 .aside1 {position:absolute;right:0;top:0;} .area-aside1 > p.mes {margin:0 0 2.6rem;padding:1.0rem 0 0;} .area-frame1 {width:100%;} .area-frame1 iframe {width:100%;height:68.0rem;} /* -------------------------------------------------------------------------------- COMPONENT : DATEPICKER --------------------------------------------------------------------------------- */ .ui-datepicker {width:31.0rem;margin:0;background:var(--color-gray4);padding:1.6rem;box-shadow:0 0.1rem 0.3rem var(--color-gray2);z-index:99 !important;} .ui-datepicker-header {position:relative;height:2.6rem;margin:0 0 1.2rem;padding:0;line-height:2.6rem;color:var(--color-gray0);border:0;background:none;} .ui-datepicker-header .ui-datepicker-title {width:100%;font-size:1.8rem;font-weight:800;} .ui-datepicker-header a {position:absolute;right:0;top:0;width:2.5rem;height:2.5rem;cursor:pointer;} .ui-datepicker-header a span {display:block;position:relative;font-size:1px;overflow:hidden;pointer-events:none;white-space:nowrap;} .ui-datepicker-header a:after {content:'';display:block;position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;background:var(--img1) no-repeat -0.1rem -10.0rem;background-size:var(--img1x2);} .ui-datepicker-header a span, .ui-datepicker-header a span::selection {color:transparent;} .ui-datepicker-header a.ui-datepicker-prev {right:4.0rem;} .ui-datepicker-header a.ui-datepicker-prev:after {transform:rotate(-180deg);} .ui-datepicker-calendar {border-collapse:separate;border:0;} .ui-datepicker-calendar th, .ui-datepicker-calendar td {text-align:center;height:3.6rem;font-size:1.4rem;line-height:3.6rem;padding:0;} .ui-datepicker-calendar th {font-weight:700;border-bottom:0.2rem solid var(--color-gray0);} .ui-datepicker-calendar tbody > tr:first-child td {padding-top:0.3rem;} .ui-datepicker-calendar td {padding:0.1rem;} .ui-datepicker-calendar a.ui-state-default:hover, .ui-datepicker-calendar a.ui-state-default:focus {box-shadow:0 0 0 0.1rem inset var(--color-gray0);} .ui-datepicker-calendar .ui-state-default {background:var(--color-gray1);box-shadow:0 0 0 0.1rem inset var(--color-gray2);} .ui-datepicker-calendar .ui-state-default {position:relative;display:block;width:100%;height:100%;margin:0;padding:0;background:var(--color-gray1);font-weight:600;color:var(--color-gray0);} .ui-datepicker-calendar .ui-state-holiday, .ui-datepicker-calendar th:nth-child(1), .ui-datepicker-calendar td:nth-child(1) {color:#de1236;} .ui-datepicker-calendar .ui-datepicker-week-end, .ui-datepicker-calendar .ui-datepicker-week-end .ui-state-default {color:#de1236;} .ui-datepicker-calendar .ui-datepicker-week-end ~ .ui-datepicker-week-end, .ui-datepicker-calendar .ui-datepicker-week-end ~ .ui-datepicker-week-end .ui-state-default, .ui-datepicker-calendar th:last-child, .ui-datepicker-calendar td:last-child {color:#2864da;} .ui-datepicker-calendar .ui-state-disabled {opacity:0.2;} .ui-datepicker-calendar .ui-datepicker-today a:before {content:"";display:block;position:absolute;left:50%;bottom:50%;width:0.3rem;height:0.3rem;margin:0 0 1.0rem -0.1rem;border-radius:100%;background:var(--color-gray0);} .ui-datepicker-calendar .ui-state-active {line-height:3.2rem;background:var(--color-gray0);border:0.3rem solid var(--color-gray0);color:var(--color-gray1);box-shadow:0 0 0 0.1rem inset var(--color-gray2);} .ui-datepicker-calendar .ui-datepicker-today a.ui-state-active:before {background:var(--color-gray1);} .modal-on .ui-datepicker {z-index:1001 !important;} .area-calendar {margin:-4.8rem -4.0rem 0;padding:4.8rem 3.2rem 4.0rem;width:calc(100% + 8.0rem);background:var(--color-gray4);} .area-calendar .headline {display:flex;justify-content:space-between;margin:0 0 2.4rem;} .area-calendar .headline p {font-size:2.2rem;line-height:2.5rem;font-weight:700;} .area-calendar .headline .btn {display:flex;gap:1.2rem;} .area-calendar .headline .btn button {position:relative;width:2.5rem;height:2.5rem;cursor:pointer;} .area-calendar .headline .btn button:after {content:'';display:block;position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;background:var(--img1) no-repeat -0.1rem -10.0rem;background-size:var(--img1x2);} .area-calendar .headline .btn button, .area-calendar .headline .btn button::selection {color:transparent;} .area-calendar .headline .btn .btn-prev:after {transform:rotate(-180deg);} .area-calendar .ui-datepicker-calendar th, .area-calendar .ui-datepicker-calendar td {height:4.5rem;line-height:4.5rem;font-weight:600;} .area-calendar .ui-datepicker-calendar td .date {display:block;width:100%;height:100%;} .area-calendar .ui-datepicker-calendar td .date[role="button"] {background:var(--color-gray1);box-shadow:0 0 0 0.1rem inset var(--color-gray2);} .area-calendar .ui-datepicker-calendar td .date[role="button"]:not([aria-selected="true"]):hover, .area-calendar .ui-datepicker-calendar td .date[role="button"]:not([aria-selected="true"]):focus {box-shadow:0 0 0 0.1rem inset var(--color-gray0);} .area-calendar .ui-datepicker-calendar td .date[aria-selected="true"] {line-height:3.9rem;background:var(--color-gray0);border:0.3rem solid var(--color-gray0);color:var(--color-gray1);box-shadow:0 0 0 0.1rem inset var(--color-gray2);} .area-calendar .label {display:flex;font-size:1.4rem;line-height:1.8rem;justify-content:center;margin:2.4rem 0 0;} .area-calendar .label dt {overflow:hidden;position:absolute;left:-0.1rem;top:-0.1rem;width:0.1rem;height:0.1rem;opacity:0;} .area-calendar .label dd {display:inline-flex;gap:0.6rem;} .area-calendar .label dd + dd {margin:0 0 0 2.4rem;} .area-calendar .label dd:before {content:'';display:inline-block;width:1.8rem;height:1.8rem;box-sizing:border-box;border:0.1rem solid var(--color-gray2);vertical-align:top;} .area-calendar .label dd.lb1:before {border:0.1rem dashed var(--color-gray2);} .area-calendar .label dd.lb2:before {background:var(--color-gray1);} .area-calendar .label dd.lb3:before {background:var(--color-gray0);border:0.3rem solid var(--color-gray0);box-shadow:0 0 0 0.1rem inset var(--color-gray2);} /* -------------------------------------------------------------------------------- COMPONENT : 임시 --------------------------------------------------------------------------------- */ .area-temp {background:var(--color-gray4);text-align:center;font-size:2.0rem;line-height:30.0rem;color:transparent;} body > .area-temp {background:rgba(255,0,0,0.05);color:var(--color-gray0);line-height:68.0rem;} @charset "utf-8"; /* -------------------------------------------------------------------------------- PAGE : 메인 --------------------------------------------------------------------------------- */ [class*="main-section"] {display:flex;} [class*="main-section"] .section {position:relative;} [class*="main-section"] .section .side.link-t1 {position:absolute;right:0;top:0;} .main-section1 {overflow:hidden;position:relative;justify-content:space-between;align-items:center;gap:12.8rem;margin:0 -12.0rem;padding:5.4rem 12.0rem 5.6rem;background:var(--color-gray0);} .main-section1:before {content:'';position:absolute;left:50%;top:0;width:192.0rem;height:67.0rem;margin:0 0 0 -96.0rem;background:var(--color-gray0) url(../../images/com/img_main1.png) no-repeat 50% 0;background-size:auto 100%;animation:ani-visual 8s 1;} .main-section1 .section p strong, .main-section1 .section p span {display:block;} .main-section1 .section p strong {font-weight:800;} @keyframes ani-visual { 0% {transform:scale(1.1);} 100% {transform:scale(1.0);} } .main-section1 .section.info {flex:1;max-width:89.0rem;color:var(--color-gray1);} .main-section1 .section.info p strong {font-size:3.2rem;line-height:4.8rem;} .main-section1 .section.info p span {font-size:2.0rem;line-height:2.8rem;margin:4.0rem 0 0;font-weight:300;word-break:break-all;} .main-section1 .section.info .btn {margin:6.4rem 0 0;} .main-section1 .logout, .main-section1 .login {width:40.8rem;height:56.0rem;padding:3.1rem 4.2rem;display:flex;flex-direction:column;background:url(../../images/com/bg1.png);} .main-section1 .logout {justify-content:center;} .main-section1 .logout p strong {font-size:2.4rem;line-height:3.0rem;} .main-section1 .logout p span {font-size:1.6rem;line-height:2.6rem;margin:2.4rem 0 0;} .main-section1 .logout .btn {margin:5.2rem 0 0;} .main-section1 .logout .btn .btn-action1 + .btn-action1 {margin:1.6rem 0 0;} .main-section1 .login .headline {display:flex;margin:0 0 4.0rem;padding:0 0 2.0rem;font-size:2.4rem;line-height:3.0rem;font-weight:800;border-bottom:0.2rem solid var(--color-gray0);} .main-section1 .login .headline span:not(:empty) + span:before {content:'-';display:inline-block;margin:0 0.4rem;} .main-section1 .login .list-t1 {min-height:14.6rem;} .main-section1 .login .list-t1 + .info-data2 {margin:3.0rem 0 0;} .main-section2 {position:relative;justify-content:space-between;margin:0 auto -12.0rem;padding:9.6rem 0 12.0rem;} .main-section2:before {content:'';display:block;position:absolute;left:50%;top:0;bottom:0;width:0.1rem;border-left:0.1rem solid var(--color-gray2);} .main-section2 .section {width:calc(50% - 12.0rem);} .main-section2 .section .tit-sub1 {margin:0 0 4.0rem;} .main-section2 .section .nav-link1 {position:absolute;right:0;top:0.5rem;gap:4.0rem 6.4rem;flex-wrap:wrap;max-width:20.0rem;} .main-section2 .section .nav-link1 a {width:calc(50% - 3.2rem);} /* -------------------------------------------------------------------------------- PAGE : 로그인 --------------------------------------------------------------------------------- */ [data-page="login"] .tit-sub1 {text-align:center;} .form-login {width:84.0rem;margin:0 auto;padding:7.2rem 15.0rem;border:0.1rem solid var(--color-gray0);} .form-login .con {position:relative;} .form-login .con .label-t1 + .label-t1 {margin:2.4rem 0 0;} .form-login .con .btn {display:flex;align-items:center;position:absolute;right:0;top:0;bottom:0;height:auto;} .form-login .bottom {position:relative;display:flex;justify-content:space-around;margin:7.2rem -15.0rem -7.2rem;padding:4.0rem 0;text-align:center;border-top:0.1rem solid var(--color-gray2);} .form-login .bottom:before {content:'';display:block;position:absolute;left:50%;top:0;bottom:0;border-left:0.1rem solid var(--color-gray2);} /* -------------------------------------------------------------------------------- PAGE : 회원가입 --------------------------------------------------------------------------------- */ /* 본인인증 */ .area-section1.data-t1 > li {text-align:center;} .area-section1.data-t1 > li strong {display:block;margin:0 0 1.2rem;font-size:2.4rem;line-height:4.0rem;font-weight:900;} .area-section1.data-t1 [class*="ic"] {position:relative;display:inline-block;padding:1.2rem 0 1.2rem 15.6rem;min-height:12.4rem;text-align:left;} .area-section1.data-t1 [class*="ic"]:before {content:'';display:block;position:absolute;left:0;top:0;width:12.4rem;height:12.4rem;background:var(--color-gray4) url(../../images/com/img2.png) no-repeat 0 0;background-size:24.8rem 12.4rem;border-radius:100%;} .area-section1.data-t1 .ic1:before {background-position:0 0;} .area-section1.data-t1 .ic2:before {background-position:-12.4rem 0;} /* -------------------------------------------------------------------------------- PAGE : 대관안내 --------------------------------------------------------------------------------- */ /* 대관절차안내 */ .list-con1 > ol {counter-reset:cnt;} .list-con1 > ol > li {display:flex;gap:6.4rem;counter-increment:cnt;padding:5.6rem 7.2rem;} .list-con1 > ol > li + li {border-top:0.1rem solid var(--color-gray2);} .list-con1 > ol > li .headline {position:relative;width:9.0rem;font-size:2.2rem;line-height:2.6rem;font-weight:800;} .list-con1 > ol > li .headline:before {content:'0'counter(cnt);display:block;margin:0 0 0.8rem;} .list-con1 > ol > li .headline[class*=" ic"] {width:20.0rem;padding-right:9.0rem;} .list-con1 > ol > li .headline[class*=" ic"]:after {content:'';display:block;position:absolute;right:0;top:0;width:6.0rem;height:6.0rem;background:var(--img1) no-repeat 0 -16.0rem;background-size:var(--img1x2);} .list-con1 > ol > li .headline + div {flex:1;} .list-con1 > ol > li div.con {color:var(--color-gray3);} .list-con1 > ol > li div.con dl:not([class]) > dt {font-weight:700;color:var(--color-gray0);} .list-con1 > ol > li div.con dl:not([class]) > dt ~ dt {margin:3.2rem 0 0;} .list-con1 > ol > li .headline.ic1:after {background-position:0 -16.0rem;} .list-con1 > ol > li .headline.ic2:after {background-position:-6.0rem -16.0rem;} .list-con1 > ol > li .headline.ic3:after {background-position:-12.0rem -16.0rem;} .list-con1 > ol > li .headline.ic4:after {background-position:-18.0rem -16.0rem;} .list-con1 > ol > li .headline.ic5:after {background-position:-24.0rem -16.0rem;} .list-con1 > ol > li .headline.ic6:after {background-position:0 -22.0rem;} .list-con1 > ol > li .headline.ic7:after {background-position:-6.0rem -22.0rem;} .area-section3 > :nth-child(1).list-con1 {padding:0;} /* 양식다운로드 버튼목록 */ .area-btnset1 {border:0.1rem solid var(--color-gray2);border-top:0.3rem solid var(--color-gray0);background:var(--color-gray1);} .area-btnset1 > ul > li, .area-btnset1 > ul > li > a {overflow:hidden;position:relative;display:flex;flex:1;align-items:center;min-height:7.2rem;padding:1.6rem 13.0rem 1.6rem 2.4rem;font-size:1.4rem;line-height:2.0rem;font-weight:700;} .area-btnset1 > ul > li > a {margin:-1.6rem -13.0rem -1.6rem -2.4rem;} .area-btnset1 > ul > li + li {border-top:0.1rem solid var(--color-gray2);} .area-btnset1 span:nth-child(1) ~ span {position:absolute;right:2.4rem;top:50%;transform:translateY(-50%);} .area-btnset1 span:nth-child(1) ~ span:nth-child(3) {right:100%;} .area-btnset1 a:hover, .area-btnset1 a:focus {background-color:var(--color-gray0);color:var(--color-gray1);} .area-btnset1 a:hover span:nth-child(3), .area-btnset1 a:focus span:nth-child(3) {right:2.4rem;} /* -------------------------------------------------------------------------------- PAGE : 대관신청 --------------------------------------------------------------------------------- */ .tit-select1 {position:relative;} .tit-select1 p {display:inline-block;padding:0 2.4rem;font-size:3.2rem;line-height:4.0rem;font-weight:800;} .tit-select1 [data-btn="prev"] {float:left;} .tit-select1 [data-btn="reset"] {float:right;} .tbl-calendar1 {margin:4.0rem 0;border-top:0.3rem solid var(--color-gray0);} .tbl-calendar1 th, .tbl-calendar1 td {border-bottom:0.1rem solid var(--color-gray2);} .tbl-calendar1 td + td {border-left:0.1rem solid var(--color-gray2);} .tbl-calendar1 th {font-size:1.6rem;line-height:4.2rem;font-weight:700;} .tbl-calendar1 td {padding:1.0rem 1.0rem 1.2rem;height:7.8rem;position:relative;font-size:1.4rem;line-height:2.4rem;vertical-align:top;} .tbl-calendar1 td > span:first-child {display:block;width:2.7rem;margin:-1.0rem 0 0.3rem -1.0rem;padding:0.8rem;font-size:1.2rem;line-height:1.4rem;font-weight:700;white-space:nowrap;} .tbl-calendar1 td > span:first-child:only-child {min-height:7.8rem;height:calc(100% + 2.2rem);width:calc(100% + 2.0rem);background:var(--color-gray4);color:var(--color-gray2);font-weight:400;} .tbl-calendar1 td[data-today="true"] {box-shadow:0 0 0 0.2rem inset var(--color-gray0);} .tbl-calendar1 td[data-today="true"] > span:first-child {background:var(--color-gray0);color:var(--color-gray1);} .tbl-calendar1 .btn-add, .tbl-calendar1 .btn-del {position:absolute;left:0;right:0;top:0;bottom:0;display:block;opacity:0;} .tbl-calendar1 .btn-add:focus, .tbl-calendar1 .btn-add:hover, .tbl-calendar1 .btn-del:focus, .tbl-calendar1 .btn-del:hover {opacity:1;} .tbl-calendar1 .btn-del {text-align:center;padding:0 0 0 2.4rem;background:var(--color-gray1);} .tbl-calendar1 .btn-del:before, .tbl-calendar1 .btn-del:after {content:'';display:block;} .tbl-calendar1 .btn-del:before {position:absolute;left:0;right:0;top:0;bottom:0;margin:0.6rem 0;border:0.2rem dashed var(--color-gray0);border-radius:2.0rem;} .tbl-calendar1 .btn-del:after {display:inline-block;width:1.2rem;height:1.2rem;margin:0 0 0 0.6rem;background:var(--img1) no-repeat -3.0rem -10.7rem;background-size:var(--img1x2);transform:rotate(45deg);} .tbl-calendar1 .btn-add {z-index:1;color:transparent;border:0.2rem solid var(--color-gray0);} .tbl-calendar1 ul {white-space:nowrap;} .tbl-calendar1 ul > li {position:relative;line-height:3.4rem;} .tbl-calendar1 ul > li .time:not(:only-child), .tbl-calendar1 ul > li button {position:relative;z-index:2;} .tbl-calendar1 ul .icon-t2 {position:relative;margin:0.6rem 0.8rem 0.6rem 0;z-index:4;} .tbl-calendar1 ul .time:only-child:before {content:'';display:inline-block;vertical-align:top;width:1.4rem;height:1.4rem;margin:1.0rem 0.8rem 0 0;background:var(--img1) no-repeat -5.5rem -12.5rem;background-size:var(--img1x2);} .tbl-calendar1 ul .time[role="button"][aria-disabled] {text-decoration:line-through;color:var(--color-gray3);pointer-events:none;} .tbl-calendar1 ul .time[role="button"][aria-disabled]:only-child:before {background-position:-7.0rem -12.5rem;} .tbl-calendar1 ul .time[role="button"]:hover, .tbl-calendar1 ul .time[role="button"]:focus {text-decoration:underline;} /* -------------------------------------------------------------------------------- PAGE : 대관신청내역 --------------------------------------------------------------------------------- */ /* 대관신청상세 */ .info-summary1 {position:relative;overflow:hidden;margin:0 0 4.0rem;} .info-summary1 .btn {position:absolute;right:0;top:0;display:flex;gap:1.6rem;} .info-summary1 .data1 {margin:0 -1.0rem;} .info-summary1 .data1 > li {position:relative;display:inline-block;padding:0 1.0rem;} .info-summary1 .data1 > li:before {content:'/';position:absolute;left:-0.3rem;top:0;} .info-summary1 .data2 {margin:2.4rem 0 0 -1.0rem;} .info-summary1 .data2 > dt, .info-summary1 .data2 > dd {display:inline-block;vertical-align:top;padding:0 1.0rem;} .info-summary1 .data2 > dt {font-size:2.2rem;line-height:3.6rem;font-weight:800;} .con-toggle1 {display:flex;text-align:left;flex-direction:column;padding:0 0 0 2.4rem;} .con-toggle1 summary {position:relative;cursor:pointer;} .con-toggle1 summary:before, .con-toggle1 summary:after {content:'';position:absolute;left:-2.4rem;top:0.4rem;} .con-toggle1 summary:before {width:1.5rem;height:1.5rem;border:0.1rem solid var(--color-gray0);} .con-toggle1 summary:after {width:0;height:0;} .con-toggle1 summary ~ div {margin:0.6rem 0 0;color:var(--color-gray3);} .con-toggle1:not([open]) summary:after {margin:0.4rem 0.6rem;border-left:0.5rem solid var(--color-gray0);border-top:0.4rem solid transparent;border-bottom:0.4rem solid transparent;} .con-toggle1[open] summary:after {margin:0.6rem 0.4rem;border-top:0.5rem solid var(--color-gray0);border-left:0.4rem solid transparent;border-right:0.4rem solid transparent;} /* 청구 및 납부내역 목록 */ .col-data1 {display:inline-flex;gap:0.8rem;align-items:center;} .col-data2 {display:inline-flex;flex-direction:column;text-align:left;gap:0.2rem;} .con-t1 {padding:0.8rem 0;} .con-t1 > strong, .con-t1 > span {display:block;} .con-t1 strong {color:var(--color-sub1);} .con-t1 strong ~ span {margin:0.2rem 0 0;font-size:1.4rem;} .con-t1 .link-t1 {margin:0.6rem 0 0;} .list-data1 > ul > li {display:flex;align-items:center;gap:1.6rem;padding:1.6rem;} .list-data1 > ul > li + li {border-top:0.2rem dashed var(--color-gray2);} .list-data1 [aria-describedby="column_sub2"] {text-align:right;} .tbl-data1 table tbody th[rowspan] .con-t1, .tbl-data1 table tbody td[rowspan].group .con-t1 {padding:0;} .tbl-data1 table td > ul:not([class]) > li + li {margin:0.4rem 0 0;} .tbl-data1 td.list-data1 {padding:0;} .tbl-data1 #column_sub1, .list-data1 [aria-describedby="column_sub1"] {width:12.0rem;} .tbl-data1 #column_sub2, .list-data1 [aria-describedby="column_sub2"] {width:12.0rem;} .tbl-data1 #column_sub3, .list-data1 [aria-describedby="column_sub3"] {width:12.0rem;} .tbl-data1 #column_sub4, .list-data1 [aria-describedby="column_sub4"] {flex:1;} /* -------------------------------------------------------------------------------- PAGE : 기타 : 약관컨텐츠 --------------------------------------------------------------------------------- */ .area-con1 {word-break:break-all;} .area-con1 > dl:not(:first-child) {margin:3.6rem 0 0;} .area-con1 > dl dl:not(:first-child) {margin:4.0rem 0 0;} .area-con1 dl > dt {margin:0 0 2.0rem;font-weight:800;font-size:1.8rem;line-height:2.4rem;} .area-con1 dl > dt ~ dt {margin-top:4.0rem;} .area-con1 dl > dd + dd {margin:1.0em 0 0;} .area-con1 dl > dd ul {margin:0.5em 0 0;} .area-con1 dl > dd ul:not([class*="data"]) > li + li {margin:0.5em 0 0;} .area-con1 dl > dd ul ul {margin-left:1em;} .area-con1 dl dl > dt {font-weight:800;font-size:1.6rem;line-height:2.2rem;} .area-con1 dl dl > dt ~ dt {margin-top:4.0rem;} .area-con1 .data1 {display:flex;flex-wrap:wrap;margin:4.0rem 0 0;} .area-con1 .data1 > dl {width:calc(50% - 1.2rem);margin:0;} .area-con1 .data1 > dl:nth-of-type(2n) {margin:0 0 0 2.4rem;} .area-con1 .data1 > dl > dt {font-weight:700;} .area-con1 .data1 > dl > dd {padding:3.1rem 3.1rem;border:0.1rem solid var(--color-gray0);} .area-con1 .data1 > dl > dd:nth-of-type(2n) {margin-left:1.2rem;} .area-con1 .data1 > dl > dd:nth-of-type(2) ~ dd {margin-top:1.2rem;} .area-con1 .data1 > dl > dd > span, .area-con1 .data1 > dl > dd > strong {display:block;} .area-con1 .data1 > dl > dd > strong {margin:0 0 1.2rem;} /* Copyright (c) 2021 Kil Hyung-jin, with Reserved Font Name Pretendard. https://github.com/orioncactus/pretendard This Font Software is licensed under the SIL Open Font License, Version 1.1. This license is copied below, and is also available with a FAQ at: http://scripts.sil.org/OFL */ @font-face { font-family: 'Pretendard'; font-weight: 900; font-display: swap; src: local('Pretendard Black'), url(/include/css/font/Pretendard-Black.woff2) format('woff2'), url(/include/css/font/Pretendard-Black.woff) format('woff'); } @font-face { font-family: 'Pretendard'; font-weight: 800; font-display: swap; src: local('Pretendard ExtraBold'), url(/include/css/font/Pretendard-ExtraBold.woff2) format('woff2'), url(/include/css/font/Pretendard-ExtraBold.woff) format('woff'); } @font-face { font-family: 'Pretendard'; font-weight: 700; font-display: swap; src: local('Pretendard Bold'), url(/include/css/font/Pretendard-Bold.woff2) format('woff2'), url(/include/css/font/Pretendard-Bold.woff) format('woff'); } @font-face { font-family: 'Pretendard'; font-weight: 600; font-display: swap; src: local('Pretendard SemiBold'), url(/include/css/font/Pretendard-SemiBold.woff2) format('woff2'), url(/include/css/font/Pretendard-SemiBold.woff) format('woff'); } @font-face { font-family: 'Pretendard'; font-weight: 500; font-display: swap; src: local('Pretendard Medium'), url(/include/css/font/Pretendard-Medium.woff2) format('woff2'), url(/include/css/font/Pretendard-Medium.woff) format('woff'); } @font-face { font-family: 'Pretendard'; font-weight: 400; font-display: swap; src: local('Pretendard Regular'), url(/include/css/font/Pretendard-Regular.woff2) format('woff2'), url(/include/css/font/Pretendard-Regular.woff) format('woff'); } @font-face { font-family: 'Pretendard'; font-weight: 300; font-display: swap; src: local('Pretendard Light'), url(/include/css/font/Pretendard-Light.woff2) format('woff2'), url(/include/css/font/Pretendard-Light.woff) format('woff'); } @font-face { font-family: 'Pretendard'; font-weight: 200; font-display: swap; src: local('Pretendard ExtraLight'), url(/include/css/font/Pretendard-ExtraLight.woff2) format('woff2'), url(/include/css/font/Pretendard-ExtraLight.woff) format('woff'); } @font-face { font-family: 'Pretendard'; font-weight: 100; font-display: swap; src: local('Pretendard Thin'), url(/include/css/font/Pretendard-Thin.woff2) format('woff2'), url(/include/css/font/Pretendard-Thin.woff) format('woff'); } .dialogfont { font-family: "돋움"; font-size: 11px; line-height:16px; } .ui-button-text { font-family: "돋움"; font-size: 11px; } .ui-autocomplete { max-height: 300px; overflow-y: auto; overflow-x: hidden; padding-right: 10px; } .ui-dialog .ui-dialog-content { padding: 0px!important; border:none;} .ui-dialog { z-index: 10000!important;} .nocss {} .doublecursor { cursor:hand; cursor:pointer; } .imekor { ime-mode:active; } .imeeng { ime-mode:inactive; } .imedisable { ime-mode:disabled; } .onlynumber {} .noinput {} .inlinetooltip { color:#ABADB3; } .displayNone { display:none; } .ajaxCenter { position: fixed; left: 50%; top: 50%; z-index: 1000; } .originalTextareaInfo { font-size: 12px; color: #000000; font-family: Tahoma, sans-serif; text-align: right } .warningTextareaInfo { font-size: 12px; color: #FF0000; font-family: Tahoma, sans-serif; text-align: right } hr{clear:both;display:block; visibility:hidden;height:10px} .tl{text-align:left} .tc{text-align:center!important} .tr{text-align:right} .fr{float:right} .fl{float:left} /* 모달 윈도우 */ .blocker { position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; overflow: auto; z-index: 10001; padding: 20px; box-sizing: border-box; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.75); text-align: center; } .blocker:before { content: ""; display: inline-block; height: 100%; vertical-align: middle; margin-right: -0.05em; } .blocker.behind { background-color: transparent; } .modal { z-index: 110; box-sizing: border-box; background: #fff; padding: 30px 30px 5px 30px; vertical-align: middle; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; -webkit-box-shadow: 0 0 10px #000; -moz-box-shadow: 0 0 10px #000; -o-box-shadow: 0 0 10px #000; -ms-box-shadow: 0 0 10px #000; box-shadow: 0 0 10px #000; text-align: left; } .modal a.close-modal { position: absolute; top: -12.5px; right: -12.5px; display: block; width: 30px; height: 30px; text-indent: -9999px; background: url("data:image/png;base64,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") no-repeat 0 0; } .modal-spinner { display: none; width: 64px; height: 64px; position: fixed; top: 50%; left: 50%; margin-right: -32px; margin-top: -32px; background: url("data:image/gif;base64,R0lGODlhIAAgAPMAABEREf///0VFRYKCglRUVG5ubsvLy62trTQ0NCkpKU5OTuLi4vr6+gAAAAAAAAAAACH+GkNyZWF0ZWQgd2l0aCBhamF4bG9hZC5pbmZvACH5BAAKAAAAIf8LTkVUU0NBUEUyLjADAQAAACwAAAAAIAAgAAAE5xDISWlhperN52JLhSSdRgwVo1ICQZRUsiwHpTJT4iowNS8vyW2icCF6k8HMMBkCEDskxTBDAZwuAkkqIfxIQyhBQBFvAQSDITM5VDW6XNE4KagNh6Bgwe60smQUB3d4Rz1ZBApnFASDd0hihh12BkE9kjAJVlycXIg7CQIFA6SlnJ87paqbSKiKoqusnbMdmDC2tXQlkUhziYtyWTxIfy6BE8WJt5YJvpJivxNaGmLHT0VnOgSYf0dZXS7APdpB309RnHOG5gDqXGLDaC457D1zZ/V/nmOM82XiHRLYKhKP1oZmADdEAAAh+QQACgABACwAAAAAIAAgAAAE6hDISWlZpOrNp1lGNRSdRpDUolIGw5RUYhhHukqFu8DsrEyqnWThGvAmhVlteBvojpTDDBUEIFwMFBRAmBkSgOrBFZogCASwBDEY/CZSg7GSE0gSCjQBMVG023xWBhklAnoEdhQEfyNqMIcKjhRsjEdnezB+A4k8gTwJhFuiW4dokXiloUepBAp5qaKpp6+Ho7aWW54wl7obvEe0kRuoplCGepwSx2jJvqHEmGt6whJpGpfJCHmOoNHKaHx61WiSR92E4lbFoq+B6QDtuetcaBPnW6+O7wDHpIiK9SaVK5GgV543tzjgGcghAgAh+QQACgACACwAAAAAIAAgAAAE7hDISSkxpOrN5zFHNWRdhSiVoVLHspRUMoyUakyEe8PTPCATW9A14E0UvuAKMNAZKYUZCiBMuBakSQKG8G2FzUWox2AUtAQFcBKlVQoLgQReZhQlCIJesQXI5B0CBnUMOxMCenoCfTCEWBsJColTMANldx15BGs8B5wlCZ9Po6OJkwmRpnqkqnuSrayqfKmqpLajoiW5HJq7FL1Gr2mMMcKUMIiJgIemy7xZtJsTmsM4xHiKv5KMCXqfyUCJEonXPN2rAOIAmsfB3uPoAK++G+w48edZPK+M6hLJpQg484enXIdQFSS1u6UhksENEQAAIfkEAAoAAwAsAAAAACAAIAAABOcQyEmpGKLqzWcZRVUQnZYg1aBSh2GUVEIQ2aQOE+G+cD4ntpWkZQj1JIiZIogDFFyHI0UxQwFugMSOFIPJftfVAEoZLBbcLEFhlQiqGp1Vd140AUklUN3eCA51C1EWMzMCezCBBmkxVIVHBWd3HHl9JQOIJSdSnJ0TDKChCwUJjoWMPaGqDKannasMo6WnM562R5YluZRwur0wpgqZE7NKUm+FNRPIhjBJxKZteWuIBMN4zRMIVIhffcgojwCF117i4nlLnY5ztRLsnOk+aV+oJY7V7m76PdkS4trKcdg0Zc0tTcKkRAAAIfkEAAoABAAsAAAAACAAIAAABO4QyEkpKqjqzScpRaVkXZWQEximw1BSCUEIlDohrft6cpKCk5xid5MNJTaAIkekKGQkWyKHkvhKsR7ARmitkAYDYRIbUQRQjWBwJRzChi9CRlBcY1UN4g0/VNB0AlcvcAYHRyZPdEQFYV8ccwR5HWxEJ02YmRMLnJ1xCYp0Y5idpQuhopmmC2KgojKasUQDk5BNAwwMOh2RtRq5uQuPZKGIJQIGwAwGf6I0JXMpC8C7kXWDBINFMxS4DKMAWVWAGYsAdNqW5uaRxkSKJOZKaU3tPOBZ4DuK2LATgJhkPJMgTwKCdFjyPHEnKxFCDhEAACH5BAAKAAUALAAAAAAgACAAAATzEMhJaVKp6s2nIkolIJ2WkBShpkVRWqqQrhLSEu9MZJKK9y1ZrqYK9WiClmvoUaF8gIQSNeF1Er4MNFn4SRSDARWroAIETg1iVwuHjYB1kYc1mwruwXKC9gmsJXliGxc+XiUCby9ydh1sOSdMkpMTBpaXBzsfhoc5l58Gm5yToAaZhaOUqjkDgCWNHAULCwOLaTmzswadEqggQwgHuQsHIoZCHQMMQgQGubVEcxOPFAcMDAYUA85eWARmfSRQCdcMe0zeP1AAygwLlJtPNAAL19DARdPzBOWSm1brJBi45soRAWQAAkrQIykShQ9wVhHCwCQCACH5BAAKAAYALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq+E71SRQeyqUToLA7VxF0JDyIQh/MVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiRMDjI0Fd30/iI2UA5GSS5UDj2l6NoqgOgN4gksEBgYFf0FDqKgHnyZ9OX8HrgYHdHpcHQULXAS2qKpENRg7eAMLC7kTBaixUYFkKAzWAAnLC7FLVxLWDBLKCwaKTULgEwbLA4hJtOkSBNqITT3xEgfLpBtzE/jiuL04RGEBgwWhShRgQExHBAAh+QQACgAHACwAAAAAIAAgAAAE7xDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfZiCqGk5dTESJeaOAlClzsJsqwiJwiqnFrb2nS9kmIcgEsjQydLiIlHehhpejaIjzh9eomSjZR+ipslWIRLAgMDOR2DOqKogTB9pCUJBagDBXR6XB0EBkIIsaRsGGMMAxoDBgYHTKJiUYEGDAzHC9EACcUGkIgFzgwZ0QsSBcXHiQvOwgDdEwfFs0sDzt4S6BK4xYjkDOzn0unFeBzOBijIm1Dgmg5YFQwsCMjp1oJ8LyIAACH5BAAKAAgALAAAAAAgACAAAATwEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq+E71SRQeyqUToLA7VxF0JDyIQh/MVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GGl6NoiPOH16iZKNlH6KmyWFOggHhEEvAwwMA0N9GBsEC6amhnVcEwavDAazGwIDaH1ipaYLBUTCGgQDA8NdHz0FpqgTBwsLqAbWAAnIA4FWKdMLGdYGEgraigbT0OITBcg5QwPT4xLrROZL6AuQAPUS7bxLpoWidY0JtxLHKhwwMJBTHgPKdEQAACH5BAAKAAkALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq+E71SRQeyqUToLA7VxF0JDyIQh/MVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GAULDJCRiXo1CpGXDJOUjY+Yip9DhToJA4RBLwMLCwVDfRgbBAaqqoZ1XBMHswsHtxtFaH1iqaoGNgAIxRpbFAgfPQSqpbgGBqUD1wBXeCYp1AYZ19JJOYgH1KwA4UBvQwXUBxPqVD9L3sbp2BNk2xvvFPJd+MFCN6HAAIKgNggY0KtEBAAh+QQACgAKACwAAAAAIAAgAAAE6BDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfYIDMaAFdTESJeaEDAIMxYFqrOUaNW4E4ObYcCXaiBVEgULe0NJaxxtYksjh2NLkZISgDgJhHthkpU4mW6blRiYmZOlh4JWkDqILwUGBnE6TYEbCgevr0N1gH4At7gHiRpFaLNrrq8HNgAJA70AWxQIH1+vsYMDAzZQPC9VCNkDWUhGkuE5PxJNwiUK4UfLzOlD4WvzAHaoG9nxPi5d+jYUqfAhhykOFwJWiAAAIfkEAAoACwAsAAAAACAAIAAABPAQyElpUqnqzaciSoVkXVUMFaFSwlpOCcMYlErAavhOMnNLNo8KsZsMZItJEIDIFSkLGQoQTNhIsFehRww2CQLKF0tYGKYSg+ygsZIuNqJksKgbfgIGepNo2cIUB3V1B3IvNiBYNQaDSTtfhhx0CwVPI0UJe0+bm4g5VgcGoqOcnjmjqDSdnhgEoamcsZuXO1aWQy8KAwOAuTYYGwi7w5h+Kr0SJ8MFihpNbx+4Erq7BYBuzsdiH1jCAzoSfl0rVirNbRXlBBlLX+BP0XJLAPGzTkAuAOqb0WT5AH7OcdCm5B8TgRwSRKIHQtaLCwg1RAAAOwAAAAAAAAAAAA==") #111 no-repeat center center; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; } /* 드래그 앤 드랍 */ /** * The dndDraggingSource class will be applied to * the source element of a drag operation. It makes * sense to hide it to give the user the feeling * that he's actually moving it. */ .dndDraggingSource { display: none; } /** * An element with .dndPlaceholder class will be * added to the dnd-list while the user is dragging * over it. */ .dndPlaceholder { background-color: #ddd; display: block; min-height: 42px; } input::-webkit-input-placeholder { color: #D5D5D5; } input:-ms-input-placeholder { color: #D5D5D5; } /* 주석 */ .annotation {display:block;color:#d43f3b;line-height:22px;padding:4px 0;width:96%} .annotation-inline {display:inline;color:#d43f3b;margin-left:30px;}