{"id":26746,"date":"2025-02-10T01:29:10","date_gmt":"2025-02-09T16:29:10","guid":{"rendered":"https:\/\/motoki-design.co.jp\/wordpress\/?p=26746"},"modified":"2025-02-10T14:10:17","modified_gmt":"2025-02-10T05:10:17","slug":"snow-monkey-forms-css-variable-guide","status":"publish","type":"post","link":"https:\/\/motoki-design.co.jp\/wordpress\/snow-monkey-forms-css-variable-guide\/","title":{"rendered":"Snow Monkey Forms\u2502CSS\u3092\u66f8\u304f\u305f\u3081\u306e\u5909\u6570\u30ac\u30a4\u30c9"},"content":{"rendered":"\n<p>Snow Monkey Forms\u306f\u6a5f\u80fd\u9762\u306f\u7d20\u6674\u3089\u3057\u3044\u306e\u3067\u3059\u304c\u3001\u898b\u305f\u76ee\u306e\u8abf\u6574\u306f\u8a2d\u5b9a\u9805\u76ee\u304c\u5c11\u306a\u3044&amp;\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3057\u306b\u304f\u3044\u3067\u3059\u3002<\/p>\n\n\n\n<p>\u7121\u7406\u3084\u308aCSS\u3067\u4e0a\u66f8\u304d\u3057\u3066\u3057\u307e\u3046\u306e\u3067\u3059\u304c\u3001\u3082\u3046\u3061\u3087\u3063\u3068\u5909\u6570\u3068\u304b\u308f\u304b\u3063\u3066\u3044\u308b\u3068\u30ad\u30ec\u30a4\u306b\u30b3\u30fc\u30c7\u30a3\u30f3\u30b0\u3067\u304d\u305d\u3046\u3060\u3063\u305f\u306e\u3067\u3001\u8abf\u67fb\u3057\u3066\u307f\u307e\u3057\u305f\u3002<\/p>\n\n\n\n<p class=\"is-style-icon_pen\">\u30d0\u30fc\u30b8\u30e7\u30f3 9.1.1&nbsp;<\/p>\n\n\n\n<p><strong>\u305d\u306e\u4ed6\u30e1\u30e2<\/strong><\/p>\n\n\n\n<p>\u30d7\u30ec\u30fc\u30b9\u30db\u30eb\u30c0\u30fc\u306e\u8272\u3092\u5909\u66f4<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>.smf-text-control__control::placeholder {\n    color: #ADADAD;\n}<\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Snow Monkey Forms\u3067\u5b9a\u7fa9\u3055\u308c\u3066\u3044\u308b\u5909\u6570<\/h2>\n\n\n\n<p>snow-monkey-forms\/dist\/css\/fallback.css\u3000\u306b\u8a18\u8f09\u3055\u308c\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>:root {\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u30b0\u30ed\u30fc\u30d0\u30eb\u8a2d\u5b9a\n      \u30fb\u80cc\u666f\u8272\u3084\u89d2\u4e38\u306a\u3069\u3001\u5168\u4f53\u306b\u95a2\u308f\u308b\u57fa\u672c\u8a2d\u5b9a\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_global--background-color: #0000;        \/* \u80cc\u666f\u8272 *\/\n    --_global--border-radius: 3px;               \/* \u89d2\u4e38 *\/\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u30ab\u30e9\u30fc\u30d1\u30ec\u30c3\u30c8\n      \u30fb\u30c6\u30ad\u30b9\u30c8\u3084\u30dc\u30fc\u30c0\u30fc\u3001\u30a2\u30af\u30bb\u30f3\u30c8\u30ab\u30e9\u30fc\u306a\u3069\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_color-black: #111;                        \/* \u30d6\u30e9\u30c3\u30af\u7cfb *\/\n    --_color-gray: #999;                         \/* \u30b0\u30ec\u30fc *\/\n    --_dark-color-gray: #666;                     \/* \u3084\u3084\u6697\u3044\u30b0\u30ec\u30fc *\/\n    --_darker-color-gray: #444;                   \/* \u3055\u3089\u306b\u6697\u3044\u30b0\u30ec\u30fc *\/\n    --_darkest-color-gray: #3b3b3b;               \/* \u6700\u3082\u6697\u3044\u30b0\u30ec\u30fc *\/\n    --_light-color-gray: #ccc;                    \/* \u3084\u3084\u660e\u308b\u3044\u30b0\u30ec\u30fc *\/\n    --_lighter-color-gray: #eee;                  \/* \u3055\u3089\u306b\u660e\u308b\u3044\u30b0\u30ec\u30fc *\/\n    --_lightest-color-gray: #f7f7f7;              \/* \u975e\u5e38\u306b\u660e\u308b\u3044\u30b0\u30ec\u30fc *\/\n    --_color-text: #333;                         \/* \u57fa\u672c\u306e\u30c6\u30ad\u30b9\u30c8\u8272 *\/\n    --_dark-color-text: #000;                    \/* \u6fc3\u3044\u30c6\u30ad\u30b9\u30c8\u8272 *\/\n    --_darker-color-text: #000;                  \/* \u3055\u3089\u306b\u6fc3\u3044\u30c6\u30ad\u30b9\u30c8\u8272 *\/\n    --_darkest-color-text: #000;                 \/* \u6700\u3082\u6fc3\u3044\u30c6\u30ad\u30b9\u30c8\u8272 *\/\n    --_light-color-text: #666;                    \/* \u3084\u3084\u660e\u308b\u3044\u30c6\u30ad\u30b9\u30c8\u8272 *\/\n    --_lighter-color-text: #888;                  \/* \u3055\u3089\u306b\u660e\u308b\u3044\u30c6\u30ad\u30b9\u30c8\u8272 *\/\n    --_lightest-color-text: #919191;              \/* \u975e\u5e38\u306b\u660e\u308b\u3044\u30c6\u30ad\u30b9\u30c8\u8272 *\/\n    --_color-white: #fff;                        \/* \u767d *\/\n    --_color-red: #e74c3c;                        \/* \u30a2\u30af\u30bb\u30f3\u30c8\u7528\u306e\u8d64 *\/\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u30b3\u30f3\u30c6\u30ca\u30fb\u30d5\u30a9\u30fc\u30e0\u30fb\u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3\u8a2d\u5b9a\n      \u30fb\u30d5\u30a9\u30fc\u30e0\u90e8\u5206\u306e\u30dc\u30fc\u30c0\u30fc\u8272\u3084\u30b3\u30f3\u30c6\u30ca\u306e\u5e45\u3001\u52d5\u304d\u306e\u901f\u3055\u306a\u3069\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_global--container-margin: var(--_s1);     \/* \u30b3\u30f3\u30c6\u30ca\u5468\u308a\u306e\u4f59\u767d *\/\n    --_global--container-max-width: 1280px;        \/* \u30b3\u30f3\u30c6\u30ca\u306e\u6700\u5927\u5e45 *\/\n    --_list-item-indent: 1.5em;                   \/* \u30ea\u30b9\u30c8\u30a2\u30a4\u30c6\u30e0\u306e\u30a4\u30f3\u30c7\u30f3\u30c8 *\/\n    --_form-control-border-color: var(--_light-color-gray);      \/* \u30d5\u30a9\u30fc\u30e0\u306e\u5883\u754c\u7dda\u8272 *\/\n    --_form-control-border-color-hover: var(--_color-gray);        \/* \u30db\u30d0\u30fc\u6642\u306e\u5883\u754c\u7dda\u8272 *\/\n    --_form-control-border-color-focus: #85b7d9;    \/* \u30d5\u30a9\u30fc\u30ab\u30b9\u6642\u306e\u5883\u754c\u7dda\u8272 *\/\n    --_global--transition-duration: .2s;          \/* \u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u6642\u9593 *\/\n    --_global--transition-function-timing: ease-out; \/* \u30a4\u30fc\u30b8\u30f3\u30b0\uff08\u52d5\u304d\u306e\u52a0\u6e1b\uff09 *\/\n    --_global--transition-delay: 0s;              \/* \u30c8\u30e9\u30f3\u30b8\u30b7\u30e7\u30f3\u306e\u9045\u5ef6\u6642\u9593 *\/\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u30bf\u30a4\u30dd\u30b0\u30e9\u30d5\u30a3\u8a2d\u5b9a\n      \u30fb\u30d5\u30a9\u30f3\u30c8\u30d5\u30a1\u30df\u30ea\u30fc\u3001\u30b5\u30a4\u30ba\u3001\u884c\u9593\u306a\u3069\u30c6\u30ad\u30b9\u30c8\u306b\u95a2\u308f\u308b\u8a2d\u5b9a\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_half-leading: 0.3;                         \/* \u884c\u9593\u306e\u88dc\u6b63\u5024 *\/\n    --_global--line-height: calc(1 + var(--_half-leading)*2); \/* \u57fa\u672c\u884c\u9ad8\u3055 *\/\n    --_base-font-family: &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif;  \/* \u30d9\u30fc\u30b9\u30d5\u30a9\u30f3\u30c8 *\/\n    --_global--font-family: var(--_base-font-family); \/* \u5168\u4f53\u3067\u4f7f\u7528\u3059\u308b\u30d5\u30a9\u30f3\u30c8 *\/\n    --_base-font-size-px: 16px;                    \/* \u30d9\u30fc\u30b9\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\uff08\u30d4\u30af\u30bb\u30eb\u5358\u4f4d\uff09 *\/\n    --_global--font-size-px: var(--_base-font-size-px); \/* \u57fa\u672c\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba *\/\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u898b\u51fa\u3057\u306e\u30de\u30fc\u30b8\u30f3\u8a2d\u5b9a\n      \u30fbh1\uff5eh6 \u306a\u3069\u5404\u898b\u51fa\u3057\u306e\u4e0a\u4e0b\u306e\u4f59\u767d\u8abf\u6574\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_margin-scale: 1;                           \/* \u30de\u30fc\u30b8\u30f3\u306e\u62e1\u5927\u30fb\u7e2e\u5c0f\u30b9\u30b1\u30fc\u30eb *\/\n    --_h1-margin-top: 0;                          \/* h1 \u4e0a\u4f59\u767d *\/\n    --_h1-margin-bottom: 1;                        \/* h1 \u4e0b\u4f59\u767d *\/\n    --_h2-margin-top: 2;                          \/* h2 \u4e0a\u4f59\u767d *\/\n    --_h2-margin-bottom: 1;                        \/* h2 \u4e0b\u4f59\u767d *\/\n    --_h3-margin-top: 1.5;                        \/* h3 \u4e0a\u4f59\u767d *\/\n    --_h3-margin-bottom: 1;                        \/* h3 \u4e0b\u4f59\u767d *\/\n    --_h4-margin-top: 1.25;                        \/* h4 \u4e0a\u4f59\u767d *\/\n    --_h4-margin-bottom: 1;                        \/* h4 \u4e0b\u4f59\u767d *\/\n    --_h5-margin-top: 1;                           \/* h5 \u4e0a\u4f59\u767d *\/\n    --_h5-margin-bottom: .5;                       \/* h5 \u4e0b\u4f59\u767d *\/\n    --_h6-margin-top: 1;                           \/* h6 \u4e0a\u4f59\u767d *\/\n    --_h6-margin-bottom: .5;                       \/* h6 \u4e0b\u4f59\u767d *\/\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u30b9\u30da\u30fc\u30b7\u30f3\u30b0\uff08\u4f59\u767d\u30fb\u30d1\u30c7\u30a3\u30f3\u30b0\uff09\u306e\u57fa\u6e96\n      \u30fb\u5168\u4f53\u306e\u30b9\u30da\u30fc\u30b9\u8a08\u7b97\u306e\u57fa\u672c\u3068\u306a\u308b\u5024\uff08\u884c\u9ad8\u3055\u3092\u5229\u7528\uff09\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_space-unitless: var(--_global--line-height);  \/* \u30b9\u30da\u30fc\u30b9\u8a08\u7b97\u306e\u57fa\u6e96\u5024 *\/\n    --_space: calc(var(--_global--line-height) * 1rem); \/* \u57fa\u672c\u306e\u30b9\u30da\u30fc\u30b9\u5358\u4f4d *\/\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u305d\u306e\u4ed6\u8a2d\u5b9a\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_page-effect-z-index: 1000000;              \/* \u30a8\u30d5\u30a7\u30af\u30c8\u7b49\u3067\u4f7f\u7528\u3059\u308b z-index *\/\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u30cf\u30fc\u30e2\u30cb\u30c3\u30af\u30b7\u30fc\u30b1\u30f3\u30b9\uff08\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u30fb\u884c\u9593\u8abf\u6574\u7528\uff09\n      \u30fb\u8abf\u548c\u6570\u5217\u3092\u5229\u7528\u3057\u3066\u3001\u30b5\u30a4\u30ba\u3084\u884c\u9593\u306e\u30ea\u30ba\u30e0\u3092\u4f5c\u6210\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_harmonic-sequence-base: 8;\n    --_min-harmonic-sequence-base: 9;\n    --_max-harmonic-sequence-base: var(--_harmonic-sequence-base);\n    --_line-height-slope: -0.16666;\n    --_font-size-level: 0;\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u30de\u30fc\u30b8\u30f3\u30fb\u30d1\u30c7\u30a3\u30f3\u30b0\u8a08\u7b97\u7528\u6570\u5217\uff08ms\u7cfb\uff09\n      \u30fb\u30ea\u30ba\u30df\u30ab\u30eb\u306a\u6570\u5217\u3067\u4f59\u767d\u306e\u6bd4\u7387\u3092\u8a2d\u5b9a\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_ms-2: calc(var(--_space-unitless) \/ 3 * 1);\n    --_ms-1: calc(var(--_space-unitless) \/ 3 * 2);\n    --_ms0: 0rem;\n    --_ms1: calc(var(--_space-unitless) \/ 3 * 3);\n    --_ms2: calc(var(--_space-unitless) \/ 3 * 5);\n    --_ms3: calc(var(--_space-unitless) \/ 3 * 8);\n    --_ms4: calc(var(--_space-unitless) \/ 3 * 13);\n    --_ms5: calc(var(--_space-unitless) \/ 3 * 21);\n    --_ms6: calc(var(--_space-unitless) \/ 3 * 34);\n    --_ms7: calc(var(--_space-unitless) \/ 3 * 55);\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u306a\u30b9\u30da\u30fc\u30b7\u30f3\u30b0\uff08s\u7cfb\uff09\n      \u30fbms\u7cfb\u306e\u5024\u306b rem \u5358\u4f4d\u3084 clamp() \u3092\u7528\u3044\u3001\u753b\u9762\u5e45\u306b\u5fdc\u3058\u305f\u30b5\u30a4\u30ba\u306b\u8abf\u6574\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_s-2: calc(var(--_ms-2) * 1rem);\n    --_s-1: calc(var(--_ms-1) * 1rem);\n    --_s0: 0rem;\n    --_s1: calc(var(--_ms1) * 1rem);\n    --_s2: clamp(\n        calc(var(--_ms1) + var(--_ms2) * 0.28125) * 1rem,\n        calc(((var(--_ms2) - var(--_ms1) + var(--_ms2) * 0.28125) \/ 57.5 * -22.5\n             + var(--_ms1) + var(--_ms2) * 0.28125) * 1rem\n             + (var(--_ms2) - var(--_ms1) + var(--_ms2) * 0.28125) \/ 57.5 * 100vw),\n        var(--_ms2) * 1rem\n    );\n    --_s3: clamp(\n        calc(var(--_ms1) + var(--_ms3) * 0.28125) * 1rem,\n        calc(((var(--_ms3) - var(--_ms1) + var(--_ms3) * 0.28125) \/ 57.5 * -22.5\n             + var(--_ms1) + var(--_ms3) * 0.28125) * 1rem\n             + (var(--_ms3) - var(--_ms1) + var(--_ms3) * 0.28125) \/ 57.5 * 100vw),\n        var(--_ms3) * 1rem\n    );\n    --_s4: clamp(\n        calc(var(--_ms1) + var(--_ms4) * 0.28125) * 1rem,\n        calc(((var(--_ms4) - var(--_ms1) + var(--_ms4) * 0.28125) \/ 57.5 * -22.5\n             + var(--_ms1) + var(--_ms4) * 0.28125) * 1rem\n             + (var(--_ms4) - var(--_ms1) + var(--_ms4) * 0.28125) \/ 57.5 * 100vw),\n        var(--_ms4) * 1rem\n    );\n    --_s5: clamp(\n        calc(var(--_ms1) + var(--_ms5) * 0.28125) * 1rem,\n        calc(((var(--_ms5) - var(--_ms1) + var(--_ms5) * 0.28125) \/ 57.5 * -22.5\n             + var(--_ms1) + var(--_ms5) * 0.28125) * 1rem\n             + (var(--_ms5) - var(--_ms1) + var(--_ms5) * 0.28125) \/ 57.5 * 100vw),\n        var(--_ms5) * 1rem\n    );\n    --_s6: clamp(\n        calc(var(--_ms1) + var(--_ms6) * 0.28125) * 1rem,\n        calc(((var(--_ms6) - var(--_ms1) + var(--_ms6) * 0.28125) \/ 57.5 * -22.5\n             + var(--_ms1) + var(--_ms6) * 0.28125) * 1rem\n             + (var(--_ms6) - var(--_ms1) + var(--_ms6) * 0.28125) \/ 57.5 * 100vw),\n        var(--_ms6) * 1rem\n    );\n    --_s7: clamp(\n        calc(var(--_ms1) + var(--_ms7) * 0.28125) * 1rem,\n        calc(((var(--_ms7) - var(--_ms1) + var(--_ms7) * 0.28125) \/ 57.5 * -22.5\n             + var(--_ms1) + var(--_ms7) * 0.28125) * 1rem\n             + (var(--_ms7) - var(--_ms1) + var(--_ms7) * 0.28125) \/ 57.5 * 100vw),\n        var(--_ms7) * 1rem\n    );\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u30de\u30fc\u30b8\u30f3\u8a2d\u5b9a\uff08\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6 s\u7cfb \u00d7 \u30de\u30fc\u30b8\u30f3\u30b9\u30b1\u30fc\u30eb\uff09\n      \u30fb\u5916\u5074\u306e\u4f59\u767d\u3068\u3057\u3066\u5229\u7528\uff08\u5fc5\u8981\u306b\u5fdc\u3058\u3066\u5909\u66f4\uff09\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_margin-2: calc(var(--_s-2) * var(--_margin-scale));\n    --_margin-1: calc(var(--_s-1) * var(--_margin-scale));\n    --_margin0: 0rem;\n    --_margin1: calc(var(--_s1) * var(--_margin-scale));\n    --_margin2: calc(var(--_s2) * var(--_margin-scale));\n    --_margin3: calc(var(--_s3) * var(--_margin-scale));\n    --_margin4: calc(var(--_s4) * var(--_margin-scale));\n    --_margin5: calc(var(--_s5) * var(--_margin-scale));\n    --_margin6: calc(var(--_s6) * var(--_margin-scale));\n    --_margin7: calc(var(--_s7) * var(--_margin-scale));\n\n    \/*\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \u25a0 \u30d1\u30c7\u30a3\u30f3\u30b0\u8a2d\u5b9a\uff08\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6 s\u7cfb\u305d\u306e\u307e\u307e\uff09\n      \u30fb\u5185\u5074\u306e\u4f59\u767d\u3068\u3057\u3066\u5229\u7528\n    \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500*\/\n    --_padding-2: var(--_s-2);\n    --_padding-1: var(--_s-1);\n    --_padding0: 0rem;\n    --_padding1: var(--_s1);\n    --_padding2: var(--_s2);\n    --_padding3: var(--_s3);\n    --_padding4: var(--_s4);\n    --_padding5: var(--_s5);\n    --_padding6: var(--_s6);\n    --_padding7: var(--_s7);\n}\n<\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Snow Monkey Forms\u306e\u30d5\u30a9\u30fc\u30e0\u306eCSS<\/h2>\n\n\n\n<p>snow-monkey-forms\/dist\/css\/app.css \u304c\u30d9\u30fc\u30b9\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u30d5\u30a9\u30fc\u30e0\uff1a\u30b7\u30f3\u30d7\u30eb\u30c6\u30fc\u30d6\u30eb\u30bf\u30a4\u30d7<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>\/* \u30a2\u30af\u30b7\u30e7\u30f3\u90e8\u5206\u306e\u4e0a\u4e0b\u30de\u30fc\u30b8\u30f3\uff08\u30b7\u30f3\u30d7\u30eb\u30c6\u30fc\u30d6\u30eb\u3082 --_margin1 \u3092\u4f7f\u7528\uff09 *\/\n.smf-form--simple-table + .smf-action {\n  margin: var(--_margin1) 0;\n  text-align: center;\n}\n.smf-form--simple-table .smf-item {\n  margin-bottom: 0;\n  margin-top: 0;\n  padding: 1rem 0;\n}\n\/* \u533a\u5207\u308a\u7dda\u5185\u306e\u5217\u306f\u5de6\u53f3\u306e\u30d1\u30c7\u30a3\u30f3\u30b0\u7121\u3057\uff08\u56fa\u5b9a\uff09 *\/\n.smf-form--simple-table .smf-item--divider .smf-item__col {\n  flex: 1 1 auto;\n  max-width: none;\n}\n\/* \u30e9\u30d9\u30eb\u90e8\u5206\u306e\u4e0b\u30d1\u30c7\u30a3\u30f3\u30b0\uff1a--_padding-1 \u3092\u5229\u7528 *\/\n.smf-form--simple-table .smf-item__col--label {\n  padding-bottom: var(--_padding-1);\n}\n@media (min-width:640px) {\n  .smf-form--simple-table .smf-item {\n    display: flex;\n  }\n  .smf-form--simple-table .smf-item__col {\n    flex: 1 1 auto;\n  }\n  .smf-form--simple-table .smf-item__col--label {\n    flex: 0 0 14em;\n    max-width: 14em;\n    padding-bottom: 0;\n    padding-right: var(--_padding1);  \/* --_padding1 \u3067\u30e9\u30d9\u30eb\u306e\u53f3\u30d1\u30c7\u30a3\u30f3\u30b0\u8abf\u6574 *\/\n  }\n  .smf-form--simple-table .smf-item__col--controls {\n    flex: 1 1 calc(100% - 14em);\n    max-width: calc(100% - 14em);\n  }\n}<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u30d5\u30a9\u30fc\u30e0\uff1a\u30ec\u30bf\u30fc\u30bf\u30a4\u30d7<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>\/* \u30a2\u30af\u30b7\u30e7\u30f3\u90e8\u5206\u306e\u4e0a\u4e0b\u30de\u30fc\u30b8\u30f3\uff08\u30ec\u30bf\u30fc\u30bf\u30a4\u30d7\u3082 --_margin1 \u3092\u4f7f\u7528\uff09 *\/\n.smf-form--letter + .smf-action {\n  margin: var(--_margin1) 0;\n  text-align: center;\n}\n.smf-form--letter .smf-item {\n  margin-bottom: 0;\n  margin-top: 0;\n  padding: 1rem 0;  \/* \u56fa\u5b9a\u5024 *\/\n}\n\/* \u30e9\u30d9\u30eb\u90e8\u5206\u306e\u4e0b\u30d1\u30c7\u30a3\u30f3\u30b0\uff1a--_padding-1 \u3092\u5909\u66f4\u3059\u308b\u3068\u3001\u30e9\u30d9\u30eb\u4e0b\u306e\u4f59\u767d\u304c\u5909\u308f\u308b *\/\n.smf-form--letter .smf-item__col--label {\n  padding-bottom: var(--_padding-1);\n}\n.smf-form--letter .smf-text-control__control {\n  max-width: 100%;\n  width: 100%;\n}<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u30d5\u30a9\u30fc\u30e0\uff1a\u30d3\u30b8\u30cd\u30b9\u30bf\u30a4\u30d7<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>\/* \u30d5\u30a9\u30fc\u30e0\u4e0b\u90e8\u306e\u30a2\u30af\u30b7\u30e7\u30f3\u90e8\u5206\uff08\u30dc\u30bf\u30f3\u306a\u3069\uff09\u306e\u4e0a\u4e0b\u30de\u30fc\u30b8\u30f3 *\/\n.smf-form--business + .smf-action {\n  margin: var(--_margin1) 0;  \/* --_margin1 \u3092\u5909\u66f4\u3059\u308b\u3068\u3001\u30a2\u30af\u30b7\u30e7\u30f3\u90e8\u5206\u306e\u4e0a\u4e0b\u4f59\u767d\u304c\u5909\u308f\u308b *\/\n  text-align: center;\n}\n\n\/* \u5404\u9805\u76ee\u306e\u67a0\u7dda\u8a2d\u5b9a\uff08\u56fa\u5b9a\u5024\uff09 *\/\n.smf-form--business .smf-item {\n  border: 1px solid #ddd;\n  margin-bottom: 0;\n  margin-top: 0;\n}\n\n\/* \u6700\u521d\u306e\u9805\u76ee\u4ee5\u5916\u306f\u4e0a\u306e\u30dc\u30fc\u30c0\u30fc\u3092\u975e\u8868\u793a *\/\n.smf-form--business .smf-item:not(:first-child) {\n  border-top: none;\n}\n\n\/* \u533a\u5207\u308a\u7dda\u30a2\u30a4\u30c6\u30e0\u306e\u5de6\u53f3\u30dc\u30fc\u30c0\u30fc\u3092\u9664\u53bb *\/\n.smf-form--business .smf-item--divider {\n  border-left: none;\n  border-right: none;\n}\n\n\/* \u533a\u5207\u308a\u7dda\u5185\u306e\u5404\u5217\uff1a\u5de6\u53f3\u306e\u30d1\u30c7\u30a3\u30f3\u30b0\u306f\u56fa\u5b9a\uff080\uff09 *\/\n.smf-form--business .smf-item--divider .smf-item__col {\n  flex: 1 1 auto;\n  max-width: none;\n  padding-left: 0;\n  padding-right: 0;\n}\n\n\/* \u5404\u5217\u306e\u5185\u5074\u4f59\u767d\uff1a\u3053\u3053\u3067 --_padding1 \u3092\u5229\u7528\n     \u2192 \u3053\u306e\u5024\u3092\u5909\u66f4\u3059\u308b\u3068\u3001\u9805\u76ee\u5185\u306e\u5de6\u53f3\u30d1\u30c7\u30a3\u30f3\u30b0\u304c\u8abf\u6574\u3067\u304d\u308b *\/\n.smf-form--business .smf-item__col {\n  padding: var(--_padding1);\n}\n\n\/* \u30e9\u30d9\u30eb\u90e8\u5206\u306e\u80cc\u666f\u8272\u3068\u4e0b\u90e8\u30dc\u30fc\u30c0\u30fc\uff08\u56fa\u5b9a\u5024\uff09 *\/\n.smf-form--business .smf-item__col--label {\n  background-color: #f7f7f7;\n  border-bottom: 1px solid #ddd;\n}\n\n\/* \u753b\u9762\u5e45 640px \u4ee5\u4e0a\u306e\u5834\u5408\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u8abf\u6574 *\/\n@media (min-width:640px) {\n  .smf-form--business .smf-item {\n    display: flex;  \/* \u6a2a\u4e26\u3073\u306b\u3059\u308b *\/\n  }\n  .smf-form--business .smf-item__col {\n    flex: 1 1 auto;\n  }\n  .smf-form--business .smf-item__col--label {\n    border-bottom: none;\n    border-right: 1px solid #ddd;\n    flex: 0 0 14em;\n    max-width: 14em;\n  }\n  .smf-form--business .smf-item__col--controls {\n    flex: 1 1 calc(100% - 14em);\n    max-width: calc(100% - 14em);\n  }\n}<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u30dc\u30bf\u30f3\u64cd\u4f5c\uff08\u30a2\u30af\u30b7\u30e7\u30f3\u30a8\u30ea\u30a2\uff09<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>\/* \u30dc\u30bf\u30f3\u5185\u306e\u5de6\u53f3\u30d1\u30c7\u30a3\u30f3\u30b0\uff1a--_padding1 \u3092\u8abf\u6574\u3059\u308b\u3068\u3001\u30dc\u30bf\u30f3\u306e\u5de6\u53f3\u4f59\u767d\u304c\u5909\u308f\u308b *\/\n.smf-action .smf-button-control__control {\n  padding-left: var(--_padding1);\n  padding-right: var(--_padding1);\n}\n\/* \u30dc\u30bf\u30f3\u540c\u58eb\u306e\u9593\u9694\uff1a--_margin-1 \u3067\u8abf\u6574 *\/\n.smf-action .smf-button-control + .smf-button-control {\n  margin-left: var(--_margin-1);\n}\n\/* \u30dc\u30bf\u30f3\u5185\u306b\u914d\u7f6e\u3059\u308b\u300c\u9001\u4fe1\u4e2d\u300d\u30a2\u30a4\u30b3\u30f3\u306f\u4f4d\u7f6e\u3092\u7d76\u5bfe\u6307\u5b9a *\/\n.smf-action .smf-button-control__control {\n  position: relative;\n}\n.smf-action .smf-button-control__control .smf-sending {\n  position: absolute;\n  right: 5px;\n  top: 50%;\n  transform: translateY(-50%);\n}\n<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u30d5\u30a3\u30fc\u30eb\u30c9\u30bb\u30c3\u30c8\u5185\u306e\u8981\u7d20\u9593\u4f59\u767d<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>\/* \u30d5\u30a3\u30fc\u30eb\u30c9\u30bb\u30c3\u30c8\u5185\u306e\u5404\u8981\u7d20\u306e\u4e0a\u30de\u30fc\u30b8\u30f3\uff1a--_margin-2 \u3067\u8abf\u6574 *\/\n.smf-control-fieldset &gt; * + * {\n  margin-top: var(--_margin-2);\n}\n<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u30b3\u30f3\u30c8\u30ed\u30fc\u30eb\u8aac\u660e\u6587<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>\/* \u8aac\u660e\u6587\u306e\u6587\u5b57\u8272\u306f --_dark-color-gray \u3092\u4f7f\u7528 *\/\n.smf-control-description {\n  color: var(--_dark-color-gray);\n  margin-top: var(--_margin-2);\n  --_font-size-level: -1; \/* \u30bf\u30a4\u30dd\u30b0\u30e9\u30d5\u30a3\u7528\u306e\u5fae\u8abf\u6574\uff08\u8a73\u7d30\u306f\u5168\u4f53\u8a2d\u5b9a\u53c2\u7167\uff09 *\/\n  font-size: var(--_font-size);  \/* --_font-size \u3092\u5909\u66f4\u3059\u308b\u3068\u3001\u8aac\u660e\u6587\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u3082\u5909\u308f\u308b *\/\n  line-height: var(--_line-height);  \/* \u884c\u9593\u306f --_line-height \u306b\u4f9d\u5b58 *\/\n}<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u30a8\u30e9\u30fc\u30e1\u30c3\u30bb\u30fc\u30b8<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>.smf-error-messages {\n  color: #cc3033;  \/* \u56fa\u5b9a\u8272 *\/\n  margin-top: var(--_margin-2);\n}\n<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u30d7\u30ed\u30b0\u30ec\u30b9\u30fb\u30c8\u30e9\u30c3\u30ab\u30fc\uff08\u9032\u884c\u72b6\u6cc1\u8868\u793a\uff09<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>.smf-progress-tracker {\n  display: flex;\n  flex-wrap: nowrap;\n  list-style: none;\n  margin-bottom: var(--_margin1);  \/* \u4e0b\u30de\u30fc\u30b8\u30f3\u306f --_margin1 \u3092\u5229\u7528 *\/\n  margin-left: 0;\n  padding-left: 0;\n}\n.smf-progress-tracker__item {\n  align-items: center;\n  display: flex;\n  flex: 1 1 auto;\n  flex-direction: column;\n  margin: 0;\n  position: relative;\n  width: 33.33333%;\n}\n\/* \u9032\u6357\u30d0\u30fc\uff08\u6a2a\u7dda\uff09\u306e\u8272\u306f --_light-color-gray \u3067\u6307\u5b9a *\/\n.smf-progress-tracker__item:after,\n.smf-progress-tracker__item:before {\n  background-color: var(--_light-color-gray);\n  content: &quot;&quot;;\n  display: block;\n  height: 1px;\n  position: absolute;\n  top: 12px;\n}\n.smf-progress-tracker__item:before {\n  left: 0;\n  right: 50%;\n}\n.smf-progress-tracker__item:after {\n  left: 50%;\n  right: 0;\n}\n\/* \u5b8c\u4e86\u30fb\u5165\u529b\u4e2d\u72b6\u614b\u306e\u8868\u793a\u5207\u66ff *\/\n.smf-progress-tracker__item--complete:after,\n.smf-progress-tracker__item--input:before {\n  display: none;\n}\n\/* \u756a\u53f7\u306e\u8868\u793a\uff08\u4e38\u3044\u80cc\u666f\uff09\u306b\u306f --_light-color-gray \u3092\u4f7f\u7528 *\/\n.smf-progress-tracker__item__number {\n  align-items: center;\n  background-color: var(--_light-color-gray);\n  border-radius: 100%;\n  color: #fff;\n  display: flex;\n  height: 24px;\n  justify-content: center;\n  letter-spacing: 0;\n  overflow: hidden;\n  position: relative;\n  width: 24px;\n  z-index: 1;\n}\n\/* \u756a\u53f7\u4e0b\u306e\u30c6\u30ad\u30b9\u30c8\u306f --_light-color-gray \u3067\u8272\u6307\u5b9a *\/\n.smf-progress-tracker__item__text {\n  color: var(--_light-color-gray);\n  margin-top: 0.5em;\n}\n\/* \u9032\u884c\u72b6\u6cc1\u306b\u5fdc\u3058\u305f\u80cc\u666f\u30fb\u6587\u5b57\u8272\uff1a--_color-text \u3092\u5229\u7528 *\/\n[data-screen=back] .smf-progress-tracker__item--input .smf-progress-tracker__item__number,\n[data-screen=complete] .smf-progress-tracker__item--complete .smf-progress-tracker__item__number,\n[data-screen=confirm] .smf-progress-tracker__item--confirm .smf-progress-tracker__item__number,\n[data-screen=input] .smf-progress-tracker__item--input .smf-progress-tracker__item__number,\n[data-screen=invalid] .smf-progress-tracker__item--input .smf-progress-tracker__item__number {\n  background-color: var(--_color-text);\n  font-weight: 700;\n}\n[data-screen=back] .smf-progress-tracker__item--input .smf-progress-tracker__item__text,\n[data-screen=complete] .smf-progress-tracker__item--complete .smf-progress-tracker__item__text,\n[data-screen=confirm] .smf-progress-tracker__item--confirm .smf-progress-tracker__item__text,\n[data-screen=input] .smf-progress-tracker__item--input .smf-progress-tracker__item__text,\n[data-screen=invalid] .smf-progress-tracker__item--input .smf-progress-tracker__item__text {\n  color: var(--_color-text);\n  font-weight: 700;\n}<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u9001\u4fe1\u4e2d\u30a2\u30a4\u30b3\u30f3\uff08\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\uff09<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>@keyframes smf-sending {\n  0% { transform: rotate(0deg); }\n  to { transform: rotate(1turn); }\n}\n.smf-sending[aria-hidden=true] {\n  visibility: hidden;\n}\n.smf-sending:before {\n  animation: smf-sending 2s ease-out 0s infinite;\n  border: 1px solid #00000080;\n  border-radius: 100%;\n  border-top-color: #0000;\n  content: &quot;&quot;;\n  display: block;\n  height: 10px;\n  width: 10px;\n}<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u30b7\u30b9\u30c6\u30e0\u30a8\u30e9\u30fc\u30fb\u305d\u306e\u4ed6<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>.smf-system-error-status-text {\n  color: var(--_color-gray);  \/* --_color-gray \u3092\u5909\u66f4\u3059\u308b\u3068\u30a8\u30e9\u30fc\u6642\u306e\u6587\u5b57\u8272\u304c\u5909\u308f\u308b *\/\n  --_font-size-level: -1;\n  font-size: var(--_font-size);\n  line-height: var(--_line-height);\n}\n.snow-monkey-form[data-screen=loading] {\n  visibility: hidden;\n}\n.smf-form [data-invalid=&quot;1&quot;] {\n  border-color: #d98585;\n}<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u30dc\u30bf\u30f3\u306e\u30b9\u30bf\u30a4\u30eb\uff08\u30b7\u30b9\u30c6\u30e0\u30a8\u30e9\u30fc\uff0f\u30a2\u30af\u30b7\u30e7\u30f3\uff09<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-css\" data-lang=\"CSS\"><code>.smf-action .smf-button-control__control {\n  background-color: var(--_lighter-color-gray);  \/* --_lighter-color-gray \u3067\u30dc\u30bf\u30f3\u80cc\u666f\u8272\u3092\u8abf\u6574 *\/\n  background-image: linear-gradient(180deg, #fff, var(--_lighter-color-gray));\n  border-radius: var(--_global--border-radius);  \/* --_global--border-radius \u3067\u30dc\u30bf\u30f3\u306e\u89d2\u4e38\u3092\u8abf\u6574 *\/\n  color: var(--_color-text);  \/* --_color-text \u3067\u30dc\u30bf\u30f3\u306e\u6587\u5b57\u8272\u3092\u5909\u66f4 *\/\n  cursor: pointer;\n  display: inline-block;\n  padding: var(--_padding-2) var(--_padding-1);  \/* \u4e0a\u4e0b\u4f59\u767d\u306f --_padding-2\u3001\u5de6\u53f3\u4f59\u767d\u306f --_padding1 \u3067\u8abf\u6574 *\/\n  text-decoration: none;\n  --_border-radius: var(--_global--border-radius);\n  --_border-color: var(--_form-control-border-color);  \/* --_form-control-border-color \u3067\u521d\u671f\u306e\u30dc\u30bf\u30f3\u67a0\u8272\u3092\u6307\u5b9a *\/\n  border: 1px solid var(--_border-color);\n  border-radius: var(--_border-radius);\n  outline: 0;\n  --_transition-duration: var(--_global--transition-duration);  \/* \u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u6642\u9593 *\/\n  --_transition-function-timing: var(--_global--transition-function-timing);  \/* \u30a4\u30fc\u30b8\u30f3\u30b0\u8a2d\u5b9a *\/\n  --_transition-delay: var(--_global--transition-delay);\n  transition: border var(--_transition-duration) var(--_transition-function-timing) var(--_transition-delay);\n}\n.smf-action .smf-button-control__control:hover {\n  --_border-color: var(--_form-control-border-color-hover);  \/* \u30db\u30d0\u30fc\u6642\u306e\u67a0\u8272\uff1a--_form-control-border-color-hover \u3092\u8abf\u6574 *\/\n}\n.smf-action .smf-button-control__control:active,\n.smf-action .smf-button-control__control:focus,\n.smf-action .smf-button-control__control:focus-within,\n.smf-action .smf-button-control__control[aria-selected=true] {\n  --_border-color: var(--_form-control-border-color-focus);  \/* \u30d5\u30a9\u30fc\u30ab\u30b9\u6642\u306e\u67a0\u8272\uff1a--_form-control-border-color-focus \u3092\u8abf\u6574 *\/\n}\n\/* \u30dc\u30bf\u30f3\u5185\u306e input \u3084 textarea \u306f\u67a0\u7dda\u7121\u3057\u306b *\/\n.smf-action .smf-button-control__control &gt; input,\n.smf-action .smf-button-control__control &gt; textarea {\n  border: none;\n  outline: none;\n}<\/code><\/pre><\/div>\n\n\n\n\n","protected":false},"excerpt":{"rendered":"<p>Snow Monkey Forms\u306f\u6a5f\u80fd\u9762\u306f\u7d20\u6674\u3089\u3057\u3044\u306e\u3067\u3059\u304c\u3001\u898b\u305f\u76ee\u306e\u8abf\u6574\u306f\u8a2d\u5b9a\u9805\u76ee\u304c\u5c11\u306a\u3044&amp;\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3057\u306b\u304f\u3044\u3067\u3059\u3002 \u7121\u7406\u3084\u308aCSS\u3067\u4e0a\u66f8\u304d\u3057\u3066\u3057\u307e\u3046\u306e\u3067\u3059\u304c\u3001\u3082\u3046\u3061\u3087\u3063\u3068\u5909\u6570\u3068\u304b\u308f\u304b\u3063\u3066\u3044\u308b\u3068\u30ad\u30ec\u30a4\u306b\u30b3\u30fc [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":26747,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"pochipp_cv_data":"","swell_btn_cv_data":"","footnotes":""},"categories":[111],"tags":[],"area":[],"class_list":["post-26746","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-plugin"],"_links":{"self":[{"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/posts\/26746","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/comments?post=26746"}],"version-history":[{"count":3,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/posts\/26746\/revisions"}],"predecessor-version":[{"id":26750,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/posts\/26746\/revisions\/26750"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/media\/26747"}],"wp:attachment":[{"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/media?parent=26746"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/categories?post=26746"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/tags?post=26746"},{"taxonomy":"area","embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/area?post=26746"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}