@@ -7,33 +7,34 @@ button{background:none;border:0;cursor:pointer;}
77a {text-decoration : none;}
88table {border-collapse : collapse;border-spacing : 0 ;}
99ol , ul , menu , dir {list-style : none;}
10+ * {--w-grow : initial;--w-align : initial;--h-grow : initial;--h-align : initial;}
1011.\32 00{font-weight : 200 ;}
1112.\37 00{font-weight : 700 ;}
12- @media (hover : hover){.\>\>a\:hover\:c\(--primary\) a : hover , .\>\>a\:hover\:c\(--primary\) a .\:hover {color : var (--primary );}{} }
13- .\>\>a\.active\:c\(--primary\) a .active {color : var (--primary );}{}
13+ @media (hover : hover){.\>\>a\:hover\:c\(--primary\) a : hover , .\>\>a\:hover\:c\(--primary\) a .\:hover {color : var (--primary );}}
14+ .\>\>a\.active\:c\(--primary\) a .active {color : var (--primary );}
1415.c\(\#555\) {color : # 555 ;}
1516.c\(\#ccc\) {color : # ccc ;}
16- .group : hover .group-hover\:c\(--primary\) , html .group .\:hover .group-hover\:c\(--primary\) {color : var (--primary );}{}
17+ .group : hover .group-hover\:c\(--primary\) , html .group .\:hover .group-hover\:c\(--primary\) {color : var (--primary );}
1718.c\(\#666\) {color : # 666 ;}
1819.c\(\#ff0\) {color : # ff0 ;}
1920.c\(\#fff\) {color : # fff ;}
20- .placeholder\:c\(\#ccc\) ::placeholder {color : # ccc ;} {}
21- .\.selected\:c\(\#fff\) .selected , .selected .\.selected\:c\(\#fff\) {color : # fff ;} {}
22- .\>\>a\:c\(\#4f80ff\) a {color : # 4f80ff ;} {}
23- @media only screen and (min-width : 320px ){html .\@w\(320\~\)\:c\(red\) {color : red;} {}}
24- .c\(blue\)\+font\(19\/42\)\+c\(\#D0D0D0\) {color : blue;}
25- .c\(blue\)\+font\(19\/42\)\+c\(\#D0D0D0\) {color : # D0D0D0 ;}
26- .c\(red\) {color : red;}
21+ .placeholder\:c\(\#ccc\) ::placeholder {color : # ccc ;}
22+ .\.selected\:c\(\#fff\) .selected , .selected .\.selected\:c\(\#fff\) {color : # fff ;}
23+ .\>\>a\:c\(\#4f80ff\) a {color : # 4f80ff ;}
24+ @media only screen and (min-width : 320px ){html .\@w\(320\~\)\:c\(red\) {color : red;}}
2725.c\(\#000\) {color : # 000 ;}
28- @media (hover : hover){.hover\:c\(--primary\) : hover , .hover\:c\(--primary\) .\:hover {color : var (--primary );}{} }
26+ @media (hover : hover){.hover\:c\(--primary\) : hover , .hover\:c\(--primary\) .\:hover {color : var (--primary );}}
2927.c\(\#999\) {color : # 999 ;}
30- .\.selected\:c\(\#000\) .selected , .selected .\.selected\:c\(\#000\) {color : # 000 ;} {}
31- html .active\:color\(--primary\) : active , html .active\:color\(--primary\) .\:active {color : var (--primary );} {}
28+ .\.selected\:c\(\#000\) .selected , .selected .\.selected\:c\(\#000\) {color : # 000 ;}
29+ .c\(red\) {color : red;}
30+ .c\(blue\)\+font\(19\/42\)\+c\(\#D0D0D0\) {color : blue;}
31+ .c\(blue\)\+font\(19\/42\)\+c\(\#D0D0D0\) {color : # D0D0D0 ;}
32+ html .active\:color\(--primary\) : active , html .active\:color\(--primary\) .\:active {color : var (--primary );}
3233.font\(20\/- \/-10\%\) {font-size : 20px ;letter-spacing : -0.1em ;}
3334.font\(3em\/- \/-1\.5\%\) {font-size : 3em ;letter-spacing : -0.015em ;}
34- @media (max-width : 767.98px ){html .\~md\:font\(1\.6em\) {font-size : 1.6em ;}{} }
35+ @media (max-width : 767.98px ){html .\~md\:font\(1\.6em\) {font-size : 1.6em ;}}
3536.font\(1\.2em\/- \/-1\.5\%\) {font-size : 1.2em ;letter-spacing : -0.015em ;}
36- @media (max-width : 767.98px ){html .\~md\:font\(1\.4em\) {font-size : 1.4em ;}{} }
37+ @media (max-width : 767.98px ){html .\~md\:font\(1\.4em\) {font-size : 1.4em ;}}
3738.font\(80\/- \/-15\%\) {font-size : 80px ;letter-spacing : -0.15em ;}
3839.font\(20\) {font-size : 20px ;}
3940.font\(30\) {font-size : 30px ;}
@@ -43,46 +44,29 @@ html .active\:color\(--primary\):active,html .active\:color\(--primary\).\:activ
4344.font\(24\) {font-size : 24px ;}
4445.font\(13\) {font-size : 13px ;}
4546.font\(14\/1\.5\/-1\%\) {font-size : 14px ;line-height : 1.5 ;letter-spacing : -0.01em ;}
46- .c\(blue\)\+font\(19\/42\)\+c\(\#D0D0D0\) {font-size : 19px ;line-height : 42px ;}
47- .font\(100\) {font-size : 100px ;}
4847.font\(12\) {font-size : 12px ;}
48+ .font\(100\) {font-size : 100px ;}
49+ .c\(blue\)\+font\(19\/42\)\+c\(\#D0D0D0\) {font-size : 19px ;line-height : 42px ;}
4950.word-spacing\(20\) {word-spacing : 20px ;}
51+ .AppleSD {font-family : "Apple SD Gothic Neo" ;}
5052.monospace {font-family : monospace;font-family : var (--monospace , monospace);}
5153.monospace\(number\) {font-variant-numeric : tabular-nums;}
52- .AppleSD {font-family : "Apple SD Gothic Neo" ;}
5354.bold {font-weight : bold;}
54- @media (hover : hover){.hover\:underline : hover , .hover\:underline .\:hover {text-decoration : underline;}{} }
55+ @media (hover : hover){.hover\:underline : hover , .hover\:underline .\:hover {text-decoration : underline;}}
5556.text-center {text-align : center;}
5657.text-left {text-align : left;}
5758.vertical-top {vertical-align : top;}
5859.block {display : block;}
59- .hbox {display : flex;flex-flow : row;align-items : center;}
60- .hbox\(top\+center\) {display : flex;flex-flow : row;align-items : flex-start;justify-content : center;}
61- .hbox\(bottom\+right\) {display : flex;flex-flow : row;align-items : flex-end;justify-content : flex-end;}
62- .hbox\(fill\) {display : flex;flex-flow : row;align-items : stretch;}
63- .vbox {display : flex;flex-flow : column;align-items : stretch;}
64- .vbox\(center\) {display : flex;flex-flow : column;align-items : center;}
65- .pack {display : flex;align-items : center;justify-content : center;}
66- .gap\(20\) {gap : 20px ;grid-gap : 20px ;}
67- .gap\(40\) {gap : 40px ;grid-gap : 40px ;}
68- .gap\(60\) {gap : 60px ;grid-gap : 60px ;}
69- .gap\(6\) {gap : 6px ;grid-gap : 6px ;}
70- .space-between {justify-content : space-between;}
71- .flex {flex : 1 ;}
72- .flex\(4\) {flex : 4 ;}
73- .flex\(3\) {flex : 3 ;}
74- [class *= "hbox" ]> .space\(2em\) {width : 2em ;} [class *= "vbox" ]> .space\(2em\) {height : 2em ;}
75- .flex-wrap {flex-wrap : wrap;}.flex-wrap > * {max-width : 100% ;max-height : 100% ;}
7660.w\(\~800\) {max-width : 800px ;}
7761.w\(100\~200\) {min-width : 100px ;max-width : 200px ;}
78- .w\(800\) {width : 800px ;}
7962.w\(240\) {width : 240px ;}
8063.w\(100\%\) {width : 100% ;}
64+ .w\(800\) {width : 800px ;}
8165.h\(60\) {height : 60px ;}
8266.h\(100\%\) {height : 100% ;}
8367.m\(20\) {margin : 20px ;}
8468.m\(10\/0\) {margin : 10px 0 ;}
85- .\>h1\:m\(20\) > h1 {margin : 20px ;}{}
69+ .\>h1\:m\(20\) > h1 {margin : 20px ;}
8670.m\(auto\) {margin : auto;}
8771.mt\(40\) {margin-top : 40px ;}
8872.p\(10\/20\) {padding : 10px 20px ;}
@@ -93,34 +77,51 @@ html .active\:color\(--primary\):active,html .active\:color\(--primary\).\:activ
9377.p\(10\) {padding : 10px ;}
9478.pt\(12\) {padding-top : 12px ;}
9579.b\(\#000\.2\) {border : solid 1px rgba (0 , 0 , 0 , .2 );}
96- html .active\:b\(\#000\.2\) : active , html .active\:b\(\#000\.2\) .\:active {border : solid 1px rgba (0 , 0 , 0 , .2 );}{}
80+ html .active\:b\(\#000\.2\) : active , html .active\:b\(\#000\.2\) .\:active {border : solid 1px rgba (0 , 0 , 0 , .2 );}
9781.b\(- \) {border : none;}
9882.bb\(\#000\.1\) {border-bottom : solid 1px rgba (0 , 0 , 0 , .1 );}
99- .bb\(\#000\) {border-bottom : solid 1px # 000 ;}
10083.bb\(4\/transparent\) {border-bottom : solid 4px transparent;}
101- .\.selected\:bbc\(--primary\) .selected , .selected .\.selected\:bbc\(--primary\) {border-bottom-color : var (--primary );} {}
84+ .bb\(\#000\) {border-bottom : solid 1px # 000 ;}
85+ .\.selected\:bbc\(--primary\) .selected , .selected .\.selected\:bbc\(--primary\) {border-bottom-color : var (--primary );}
10286.outline\(- \) {outline : none;}
10387.r\(8\) {border-radius : 8px ;}
10488.r\(6\) {border-radius : 6px ;}
10589.r\(10\) {border-radius : 10px ;}
10690.bg\(\#fff\) {background-color : # fff ;}
107- .odd\:bg\(\#f9f9f9\) : nth-child (2n+1){background-color : # f9f9f9 ;}{}
91+ .odd\:bg\(\#f9f9f9\) : nth-child (2n+1){background-color : # f9f9f9 ;}
10892.bg\(\#f1f1f1\) {background-color : # f1f1f1 ;}
10993.bg\(\#333\) {background-color : # 333 ;}
110- @media (hover : hover){.hover\:bg\(\#555\) : hover , .hover\:bg\(\#555\) .\:hover {background-color : # 555 ;}{} }
111- html .active\:bg\(\#000\) : active , html .active\:bg\(\#000\) .\:active {background-color : # 000 ;}{}
112- .nth-child\(3n\+1\)\:bg\(orange\) : nth-child (3n+1){background-color : orange;}{}
113- .\.selected\:bg\(\#000\) .selected , .selected .\.selected\:bg\(\#000\) {background-color : # 000 ;}{}
94+ @media (hover : hover){.hover\:bg\(\#555\) : hover , .hover\:bg\(\#555\) .\:hover {background-color : # 555 ;}}
95+ html .active\:bg\(\#000\) : active , html .active\:bg\(\#000\) .\:active {background-color : # 000 ;}
96+ .nth-child\(3n\+1\)\:bg\(orange\) : nth-child (3n+1){background-color : orange;}
97+ .\.selected\:bg\(\#000\) .selected , .selected .\.selected\:bg\(\#000\) {background-color : # 000 ;}
11498.bg\(\#f9f9f9\) {background-color : # f9f9f9 ;}
115- .\.selected\:bg\(--primary\) .selected , .selected .\.selected\:bg\(--primary\) {background-color : var (--primary );}{}
99+ .\.selected\:bg\(--primary\) .selected , .selected .\.selected\:bg\(--primary\) {background-color : var (--primary );}
116100.bg\(transparent\) {background-color : transparent;}
117- .clip {overflow : hidden;}
101+ .clip {overflow : hidden;}. clip : has (. nowrap\.\.\. ){ flex-shrink : 1 ;}
118102.scroll-x {overflow-x : auto;overflow-y : hidden;}
119103.scroll-y {overflow-x : hidden;overflow-y : auto;}
120104.overscroll\(none\) {overscroll-behavior : none;}
121105.pre {white-space : pre-wrap;}
122106.nowrap\.\.\. {white-space : nowrap;text-overflow : ellipsis;overflow : hidden;flex-shrink : 1 ;max-width : 100% ;}
123107.line-clamp\(3\) {display : -webkit-box;-webkit-line-clamp : 3 ;-webkit-box-orient : vertical;overflow : hidden;}
108+ .hbox {display : flex;flex-flow : row;align-items : center;}.hbox > * {--w-grow : 1 ;--w-align : initial;--h-grow : initial;--h-align : stretch;}
109+ .hbox\(top\+center\) {display : flex;flex-flow : row;align-items : flex-start;justify-content : center;}.hbox\(top\+center\) > * {--w-grow : 1 ;--w-align : initial;--h-grow : initial;--h-align : stretch;}
110+ .hbox\(bottom\+right\) {display : flex;flex-flow : row;align-items : flex-end;justify-content : flex-end;}.hbox\(bottom\+right\) > * {--w-grow : 1 ;--w-align : initial;--h-grow : initial;--h-align : stretch;}
111+ .hbox\(fill\) {display : flex;flex-flow : row;align-items : stretch;}.hbox\(fill\) > * {--w-grow : 1 ;--w-align : initial;--h-grow : initial;--h-align : stretch;}
112+ .vbox {display : flex;flex-flow : column;align-items : stretch;}.vbox > * {--w-grow : initial;--w-align : stretch;--h-grow : 1 ;--h-align : initial;}
113+ .vbox\(center\) {display : flex;flex-flow : column;align-items : center;}.vbox\(center\) > * {--w-grow : initial;--w-align : stretch;--h-grow : 1 ;--h-align : initial;}
114+ .pack {display : flex;align-items : center;justify-content : center;}.pack > * {--w-grow : 1 ;--w-align : initial;--h-grow : initial;--h-align : stretch;}
115+ .gap\(20\) {gap : 20px ;grid-gap : 20px ;}
116+ .gap\(40\) {gap : 40px ;grid-gap : 40px ;}
117+ .gap\(60\) {gap : 60px ;grid-gap : 60px ;}
118+ .gap\(6\) {gap : 6px ;grid-gap : 6px ;}
119+ .space-between {justify-content : space-between;align-content : space-between;}
120+ .flex {flex : 1 ;}
121+ .flex\(4\) {flex : 4 ;}
122+ .flex\(3\) {flex : 3 ;}
123+ [class *= "hbox" ]> .space\(2em\) {width : 2em ;}[class *= "vbox" ]> .space\(2em\) {height : 2em ;}
124+ .flex-wrap {flex-wrap : wrap;}: where (.flex-wrap > * ){max-width : 100% ;max-height : 100% ;}
124125.layer\(right\) {position : absolute;top : 0 ;right : 0 ;bottom : 0 ;}
125126.layer {position : absolute;top : 0 ;right : 0 ;bottom : 0 ;left : 0 ;}
126127.layer\(bottom\+right\) {position : absolute;right : 0 ;bottom : 0 ;}
@@ -131,16 +132,16 @@ html .active\:bg\(\#000\):active,html .active\:bg\(\#000\).\:active{background-c
131132.z\(9999\) {z-index : 9999 ;}
132133.none {display : none;}
133134.opacity\(0\.7\) {opacity : 0.7 ;}
134- @media (hover : hover){.hover\:opacity\(1\) : hover , .hover\:opacity\(1\) .\:hover {opacity : 1 ;}{} }
135+ @media (hover : hover){.hover\:opacity\(1\) : hover , .hover\:opacity\(1\) .\:hover {opacity : 1 ;}}
135136.pointer {cursor : pointer;}
136137.transition\(\.4s\) {transition : all .4s ;}
137138.transition\(\.2s\) {transition : all .2s ;}
138- .group : hover .group-hover\:rotate\(-10deg\) , html .group .\:hover .group-hover\:rotate\(-10deg\) {transform : rotate (-10deg );}{}
139- html .group : active .group-active\:rotate\(10deg\) , html .group .\:active .group-active\:rotate\(10deg\) {transform : rotate (10deg );}{}
140- .group : hover .group-hover\:rotate\(10deg\) , html .group .\:hover .group-hover\:rotate\(10deg\) {transform : rotate (10deg );}{}
141- html .group : active .group-active\:rotate\(-10deg\) , html .group .\:active .group-active\:rotate\(-10deg\) {transform : rotate (-10deg );}{}
142- html .active\:rotate\(5deg\) : active , html .active\:rotate\(5deg\) .\:active {transform : rotate (5deg );}{}
143- @media (hover : hover){.hover\:scale\(1\.05\) : hover , .hover\:scale\(1\.05\) .\:hover {transform : scale (1.05 );}{} }
144- .after\:content\(--my-content\) ::after {content : var (--my-content );}{}
145- html .active\:bg\(\#000\)\! : active , html .active\:bg\(\#000\)\! .\:active {background-color : # 000!important ;}{}
146- .\.selected\:c\(\#fff\)\! .selected , .selected .\.selected\:c\(\#fff\)\! {color : # fff!important ;} {}: root {font-family : Pretendard, system-ui, sans-serif;color : # 222 ;--primary : # fb3958 ;--primary-bg : rgba (251 , 57 , 88 , .02 )}.markdown {width : 768px ;max-width : 100% ;margin : auto;line-height : 1.6 ;font-size : 16px ;letter-spacing : -.01em ;word-wrap : break-all;color : # 333 }.markdown hr {margin : 2em 0 ;border-top : 1px solid rgba (0 , 0 , 0 , .1 )}.markdown a {color : var (--primary )}.markdown a : hover {text-decoration : underline}.markdown h1 , .markdown h2 , .markdown h3 , .markdown h4 {font-size : 2em ;font-weight : 700 ;margin-top : 2.4em ;margin-bottom : .6em }.markdown h2 {font-size : 1.4em }.markdown h3 {font-size : 1.2em }.markdown h4 {font-size : 1em }.markdown p {margin : 1.4em 0 }.markdown ul , .markdown ol {list-style : disc;padding : 0 1.6em ;margin : 1em 0 }.markdown ol {list-style : number}.markdown li {margin : .2em 0 }.markdown pre {background : # f9f9f9 ;margin : 1em 0 ;padding : 1em ;border-radius : .6em ;white-space : pre-wrap;font-family : monospace;font-size : .9em ;text-align : left}.markdown code {background : # f6f8fa ;padding : 2px .4em ;border-radius : .4em ;font-family : monospace;font-size : .9em }.markdown pre code {background : none;padding : 0 }.markdown .attr-value , .markdown .string , .markdown .string-property {color : var (--primary )}.markdown .comment {color : # 999 }.markdown blockquote {background : var (--primary-bg );margin : 1.4em 0 ;padding : 1.4em ;border-left : 4px solid var (--primary )}.markdown blockquote > : first-child {margin-top : 0 }.markdown blockquote > : last-child {margin-bottom : 0 }.markdown strong {font-weight : 700 }@media (max-width : 768px ){.markdown {font-size : 14px }}
139+ .group : hover .group-hover\:rotate\(-10deg\) , html .group .\:hover .group-hover\:rotate\(-10deg\) {transform : rotate (-10deg );}
140+ html .group : active .group-active\:rotate\(10deg\) , html .group .\:active .group-active\:rotate\(10deg\) {transform : rotate (10deg );}
141+ .group : hover .group-hover\:rotate\(10deg\) , html .group .\:hover .group-hover\:rotate\(10deg\) {transform : rotate (10deg );}
142+ html .group : active .group-active\:rotate\(-10deg\) , html .group .\:active .group-active\:rotate\(-10deg\) {transform : rotate (-10deg );}
143+ html .active\:rotate\(5deg\) : active , html .active\:rotate\(5deg\) .\:active {transform : rotate (5deg );}
144+ @media (hover : hover){.hover\:scale\(1\.05\) : hover , .hover\:scale\(1\.05\) .\:hover {transform : scale (1.05 );}}
145+ .after\:content\(--my-content\) ::after {content : var (--my-content );}
146+ html .active\:bg\(\#000\)\! : active , html .active\:bg\(\#000\)\! .\:active {background-color : # 000!important ;}
147+ .\.selected\:c\(\#fff\)\! .selected , .selected .\.selected\:c\(\#fff\)\! {color : # fff!important ;}: root {font-family : Pretendard, system-ui, sans-serif;color : # 222 ;--primary : # fb3958 ;--primary-bg : rgba (251 , 57 , 88 , .02 )}.markdown {width : 768px ;max-width : 100% ;margin : auto;line-height : 1.6 ;font-size : 16px ;letter-spacing : -.01em ;word-wrap : break-all;color : # 333 }.markdown hr {margin : 2em 0 ;border-top : 1px solid rgba (0 , 0 , 0 , .1 )}.markdown a {color : var (--primary )}.markdown a : hover {text-decoration : underline}.markdown h1 , .markdown h2 , .markdown h3 , .markdown h4 {font-size : 2em ;font-weight : 700 ;margin-top : 2.4em ;margin-bottom : .6em }.markdown h2 {font-size : 1.4em }.markdown h3 {font-size : 1.2em }.markdown h4 {font-size : 1em }.markdown p {margin : 1.4em 0 }.markdown ul , .markdown ol {list-style : disc;padding : 0 1.6em ;margin : 1em 0 }.markdown ol {list-style : number}.markdown li {margin : .2em 0 }.markdown pre {background : # f9f9f9 ;margin : 1em 0 ;padding : 1em ;border-radius : .6em ;white-space : pre-wrap;font-family : monospace;font-size : .9em ;text-align : left}.markdown code {background : # f6f8fa ;padding : 2px .4em ;border-radius : .4em ;font-family : monospace;font-size : .9em }.markdown pre code {background : none;padding : 0 }.markdown .attr-value , .markdown .string , .markdown .string-property {color : var (--primary )}.markdown .comment {color : # 999 }.markdown blockquote {background : var (--primary-bg );margin : 1.4em 0 ;padding : 1.4em ;border-left : 4px solid var (--primary )}.markdown blockquote > : first-child {margin-top : 0 }.markdown blockquote > : last-child {margin-bottom : 0 }.markdown strong {font-weight : 700 }@media (max-width : 768px ){.markdown {font-size : 14px }}
0 commit comments