{"id":60,"date":"2022-12-19T18:48:48","date_gmt":"2022-12-19T09:48:48","guid":{"rendered":"http:\/\/phantom-cgray03.xyz\/?p=60"},"modified":"2023-01-27T16:32:26","modified_gmt":"2023-01-27T07:32:26","slug":"60","status":"publish","type":"post","link":"https:\/\/phantom-cgray03.xyz\/?p=60","title":{"rendered":"\u30a2\u30f3\u30b1\u30fc\u30c8\uff08\u30b9\u30af\u30ed\u30fc\u30eb\u30fb\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u4e0b\u90e8\u8868\u793a\u30fb\u8907\u6570\u9078\u629e\u53ef\u80fd\uff09\u203b\u8981javascript(\u30a2\u30f3\u30b1\u30fc\u30c8)"},"content":{"rendered":"<div class=\"question-reveal-scroll js-scroll-reveal-enquete-select\">\n<form name=\"form-scroll-enquete\">\n<div class=\"questionArea js-form-radio\">\n<h2 class=\"title\">\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059<br \/>\n\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059<\/h2>\n<div class=\"navi\">\n<div class=\"navi__numbers\"><span class=\"current\">01<\/span><span>02<\/span><span>03<\/span><span>04<\/span><span>05<\/span><span>06<\/span><\/div>\n<\/div>\n<div class=\"imagebox\"><picture><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" height=\"358\" width=\"538\" draggable=\"false\" \/> <\/picture><\/div>\n<div class=\"linkbox\"><input id=\"q1-1\" type=\"radio\" name=\"q1\" \/><label for=\"q1-1\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q1-2\" type=\"radio\" name=\"q1\" \/><label for=\"q1-2\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q1-3\" type=\"radio\" name=\"q1\" \/><label for=\"q1-3\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span> <\/label><input id=\"q1-4\" type=\"radio\" name=\"q1\" \/><label for=\"q1-4\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span> <\/label><\/div>\n<\/div>\n<div class=\"questionArea js-form-radio\">\n<h2 class=\"title\">\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059<\/h2>\n<div class=\"navi\">\n<div class=\"navi__numbers\"><span>01<\/span> <span class=\"current\">02<\/span> <span>03<\/span> <span>04<\/span> <span>05<\/span> <span>06<\/span><\/div>\n<\/div>\n<div class=\"imagebox\"><picture><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" height=\"358\" width=\"538\" draggable=\"false\" \/> <\/picture><\/div>\n<div class=\"linkbox\"><input id=\"q2-1\" type=\"checkbox\" data-ignore=\"\" name=\"q2\" \/><label for=\"q2-1\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q2-2\" type=\"checkbox\" data-ignore=\"\" name=\"q2\" \/><label for=\"q2-2\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q2-3\" type=\"checkbox\" data-ignore=\"\" name=\"q2\" \/><label for=\"q2-3\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q2-4\" type=\"checkbox\" data-ignore=\"\" name=\"q2\" \/><label for=\"q2-4\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label> <label class=\"next\"> <input type=\"checkbox\" \/> <span class=\"btn\">\u6b21\u3078<\/span> <\/label><\/div>\n<\/div>\n<div class=\"questionArea js-form-radio\">\n<h2 class=\"title\">\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059<\/h2>\n<div class=\"navi\">\n<div class=\"navi__numbers\"><span>01<\/span> <span>02<\/span> <span class=\"current\">03<\/span> <span>04<\/span> <span>05<\/span> <span>06<\/span><\/div>\n<\/div>\n<div class=\"imagebox\"><picture><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" height=\"358\" width=\"538\" draggable=\"false\" \/> <\/picture><\/div>\n<div class=\"linkbox\"><input id=\"q3-1\" type=\"radio\" name=\"q3\" \/><label for=\"q3-1\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q3-2\" type=\"radio\" name=\"q3\" \/><label for=\"q3-2\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q3-3\" type=\"radio\" name=\"q3\" \/><label for=\"q3-3\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q3-4\" type=\"radio\" name=\"q3\" \/><label for=\"q3-4\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span> <\/label><\/div>\n<\/div>\n<div class=\"questionArea js-form-radio\">\n<h2 class=\"title\">\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059<\/h2>\n<div class=\"navi\">\n<div class=\"navi__numbers\"><span>01<\/span> <span>02<\/span> <span>03<\/span> <span class=\"current\">04<\/span> <span>05<\/span> <span>06<\/span><\/div>\n<\/div>\n<div class=\"linkbox\"><input id=\"q4-1\" type=\"radio\" name=\"q4\" \/><label for=\"q4-1\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q4-2\" type=\"radio\" name=\"q4\" \/><label for=\"q4-2\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q4-3\" type=\"radio\" name=\"q4\" \/><label for=\"q4-3\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q4-4\" type=\"radio\" name=\"q4\" \/><label for=\"q4-4\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span> <\/label><\/div>\n<\/div>\n<div class=\"questionArea js-form-radio\">\n<h2 class=\"title\">\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059<\/h2>\n<div class=\"navi\">\n<div class=\"navi__numbers\"><span>01<\/span> <span>02<\/span> <span>03<\/span> <span>04<\/span> <span class=\"current\">05<\/span> <span>06<\/span><\/div>\n<\/div>\n<div class=\"imagebox\"><picture><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" height=\"358\" width=\"538\" draggable=\"false\" \/> <\/picture><\/div>\n<div class=\"linkbox\"><input id=\"q5-1\" type=\"checkbox\" data-ignore=\"\" name=\"q5\" \/><label for=\"q5-1\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q5-2\" type=\"checkbox\" data-ignore=\"\" name=\"q5\" \/><label for=\"q5-2\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q5-3\" type=\"checkbox\" data-ignore=\"\" name=\"q5\" \/><label for=\"q5-3\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q5-4\" type=\"checkbox\" data-ignore=\"\" name=\"q5\" \/><label for=\"q5-4\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label> <label class=\"next\"> <input type=\"checkbox\" \/> <span class=\"btn\">\u6b21\u3078<\/span> <\/label><\/div>\n<\/div>\n<div class=\"questionArea js-form-radio\">\n<h2 class=\"title\">\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059<\/h2>\n<div class=\"navi\">\n<div class=\"navi__numbers\"><span>01<\/span> <span>02<\/span> <span>03<\/span> <span>04<\/span> <span>05<\/span> <span class=\"current\">06<\/span><\/div>\n<\/div>\n<div class=\"imagebox\"><picture><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" height=\"358\" width=\"538\" draggable=\"false\" \/> <\/picture><\/div>\n<div class=\"linkbox\"><input id=\"q6-1\" type=\"radio\" name=\"q6\" \/><label for=\"q6-1\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q6-2\" type=\"radio\" name=\"q6\" \/><label for=\"q6-2\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q6-3\" type=\"radio\" name=\"q6\" \/><label for=\"q6-3\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><input id=\"q6-4\" type=\"radio\" name=\"q6\" \/><label for=\"q6-4\"><span class=\"btn\">\u30c6\u30ad\u30b9\u30c8<\/span><\/label><\/div>\n<\/div>\n<p><span class=\"send-btn js-switch-btn\"> <button class=\"js-send\" type=\"button\">\u56de\u7b54\u3092\u5b8c\u4e86\u3059\u308b<\/button> <\/span><\/p>\n<div class=\"revealarea js-reveal is-hidden\">\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002<\/div>\n<\/form>\n<\/div>\n<p>\u4e0b\u8a18Beyond\u30b3\u30fc\u30c9<\/p>\n<p>JS head<\/p>\n<p>\u306a\u3057<\/p>\n<p>HTML<\/p>\n<pre><code>&lt;div class=&quot;question-reveal-scroll js-scroll-reveal-enquete-select&quot;&gt;\r\n&lt;form name=&quot;form-scroll-enquete&quot;&gt;\r\n&lt;div class=&quot;questionArea js-form-radio&quot;&gt;\r\n&lt;h2 class=&quot;title&quot;&gt;\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059&lt;br \/&gt;\r\n\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059&lt;\/h2&gt;\r\n&lt;div class=&quot;navi&quot;&gt;\r\n&lt;div class=&quot;navi__numbers&quot;&gt;&lt;span class=&quot;current&quot;&gt;01&lt;\/span&gt;&lt;span&gt;02&lt;\/span&gt;&lt;span&gt;03&lt;\/span&gt;&lt;span&gt;04&lt;\/span&gt;&lt;span&gt;05&lt;\/span&gt;&lt;span&gt;06&lt;\/span&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;div class=&quot;imagebox&quot;&gt;&lt;picture&gt;&lt;img src=&quot;https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png&quot; alt=&quot;&quot; height=&quot;358&quot; width=&quot;538&quot; draggable=&quot;false&quot; \/&gt; &lt;\/picture&gt;&lt;\/div&gt;\r\n&lt;div class=&quot;linkbox&quot;&gt;&lt;input id=&quot;q1-1&quot; type=&quot;radio&quot; name=&quot;q1&quot; \/&gt;&lt;label for=&quot;q1-1&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q1-2&quot; type=&quot;radio&quot; name=&quot;q1&quot; \/&gt;&lt;label for=&quot;q1-2&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q1-3&quot; type=&quot;radio&quot; name=&quot;q1&quot; \/&gt;&lt;label for=&quot;q1-3&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt; &lt;\/label&gt;&lt;input id=&quot;q1-4&quot; type=&quot;radio&quot; name=&quot;q1&quot; \/&gt;&lt;label for=&quot;q1-4&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt; &lt;\/label&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;div class=&quot;questionArea js-form-radio&quot;&gt;\r\n&lt;h2 class=&quot;title&quot;&gt;\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059&lt;\/h2&gt;\r\n&lt;div class=&quot;navi&quot;&gt;\r\n&lt;div class=&quot;navi__numbers&quot;&gt;&lt;span&gt;01&lt;\/span&gt; &lt;span class=&quot;current&quot;&gt;02&lt;\/span&gt; &lt;span&gt;03&lt;\/span&gt; &lt;span&gt;04&lt;\/span&gt; &lt;span&gt;05&lt;\/span&gt; &lt;span&gt;06&lt;\/span&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;div class=&quot;imagebox&quot;&gt;&lt;picture&gt;&lt;img src=&quot;https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png&quot; alt=&quot;&quot; height=&quot;358&quot; width=&quot;538&quot; draggable=&quot;false&quot; \/&gt; &lt;\/picture&gt;&lt;\/div&gt;\r\n&lt;div class=&quot;linkbox&quot;&gt;&lt;input id=&quot;q2-1&quot; type=&quot;checkbox&quot; data-ignore=&quot;&quot; name=&quot;q2&quot; \/&gt;&lt;label for=&quot;q2-1&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q2-2&quot; type=&quot;checkbox&quot; data-ignore=&quot;&quot; name=&quot;q2&quot; \/&gt;&lt;label for=&quot;q2-2&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q2-3&quot; type=&quot;checkbox&quot; data-ignore=&quot;&quot; name=&quot;q2&quot; \/&gt;&lt;label for=&quot;q2-3&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q2-4&quot; type=&quot;checkbox&quot; data-ignore=&quot;&quot; name=&quot;q2&quot; \/&gt;&lt;label for=&quot;q2-4&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt; &lt;label class=&quot;next&quot;&gt; &lt;input type=&quot;checkbox&quot; \/&gt; &lt;span class=&quot;btn&quot;&gt;\u6b21\u3078&lt;\/span&gt; &lt;\/label&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;div class=&quot;questionArea js-form-radio&quot;&gt;\r\n&lt;h2 class=&quot;title&quot;&gt;\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059&lt;\/h2&gt;\r\n&lt;div class=&quot;navi&quot;&gt;\r\n&lt;div class=&quot;navi__numbers&quot;&gt;&lt;span&gt;01&lt;\/span&gt; &lt;span&gt;02&lt;\/span&gt; &lt;span class=&quot;current&quot;&gt;03&lt;\/span&gt; &lt;span&gt;04&lt;\/span&gt; &lt;span&gt;05&lt;\/span&gt; &lt;span&gt;06&lt;\/span&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;div class=&quot;imagebox&quot;&gt;&lt;picture&gt;&lt;img src=&quot;https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png&quot; alt=&quot;&quot; height=&quot;358&quot; width=&quot;538&quot; draggable=&quot;false&quot; \/&gt; &lt;\/picture&gt;&lt;\/div&gt;\r\n&lt;div class=&quot;linkbox&quot;&gt;&lt;input id=&quot;q3-1&quot; type=&quot;radio&quot; name=&quot;q3&quot; \/&gt;&lt;label for=&quot;q3-1&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q3-2&quot; type=&quot;radio&quot; name=&quot;q3&quot; \/&gt;&lt;label for=&quot;q3-2&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q3-3&quot; type=&quot;radio&quot; name=&quot;q3&quot; \/&gt;&lt;label for=&quot;q3-3&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q3-4&quot; type=&quot;radio&quot; name=&quot;q3&quot; \/&gt;&lt;label for=&quot;q3-4&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt; &lt;\/label&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;div class=&quot;questionArea js-form-radio&quot;&gt;\r\n&lt;h2 class=&quot;title&quot;&gt;\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059&lt;\/h2&gt;\r\n&lt;div class=&quot;navi&quot;&gt;\r\n&lt;div class=&quot;navi__numbers&quot;&gt;&lt;span&gt;01&lt;\/span&gt; &lt;span&gt;02&lt;\/span&gt; &lt;span&gt;03&lt;\/span&gt; &lt;span class=&quot;current&quot;&gt;04&lt;\/span&gt; &lt;span&gt;05&lt;\/span&gt; &lt;span&gt;06&lt;\/span&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;div class=&quot;linkbox&quot;&gt;&lt;input id=&quot;q4-1&quot; type=&quot;radio&quot; name=&quot;q4&quot; \/&gt;&lt;label for=&quot;q4-1&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q4-2&quot; type=&quot;radio&quot; name=&quot;q4&quot; \/&gt;&lt;label for=&quot;q4-2&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q4-3&quot; type=&quot;radio&quot; name=&quot;q4&quot; \/&gt;&lt;label for=&quot;q4-3&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q4-4&quot; type=&quot;radio&quot; name=&quot;q4&quot; \/&gt;&lt;label for=&quot;q4-4&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt; &lt;\/label&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;div class=&quot;questionArea js-form-radio&quot;&gt;\r\n&lt;h2 class=&quot;title&quot;&gt;\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059&lt;\/h2&gt;\r\n&lt;div class=&quot;navi&quot;&gt;\r\n&lt;div class=&quot;navi__numbers&quot;&gt;&lt;span&gt;01&lt;\/span&gt; &lt;span&gt;02&lt;\/span&gt; &lt;span&gt;03&lt;\/span&gt; &lt;span&gt;04&lt;\/span&gt; &lt;span class=&quot;current&quot;&gt;05&lt;\/span&gt; &lt;span&gt;06&lt;\/span&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;div class=&quot;imagebox&quot;&gt;&lt;picture&gt;&lt;img src=&quot;https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png&quot; alt=&quot;&quot; height=&quot;358&quot; width=&quot;538&quot; draggable=&quot;false&quot; \/&gt; &lt;\/picture&gt;&lt;\/div&gt;\r\n&lt;div class=&quot;linkbox&quot;&gt;&lt;input id=&quot;q5-1&quot; type=&quot;checkbox&quot; data-ignore=&quot;&quot; name=&quot;q5&quot; \/&gt;&lt;label for=&quot;q5-1&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q5-2&quot; type=&quot;checkbox&quot; data-ignore=&quot;&quot; name=&quot;q5&quot; \/&gt;&lt;label for=&quot;q5-2&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q5-3&quot; type=&quot;checkbox&quot; data-ignore=&quot;&quot; name=&quot;q5&quot; \/&gt;&lt;label for=&quot;q5-3&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q5-4&quot; type=&quot;checkbox&quot; data-ignore=&quot;&quot; name=&quot;q5&quot; \/&gt;&lt;label for=&quot;q5-4&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt; &lt;label class=&quot;next&quot;&gt; &lt;input type=&quot;checkbox&quot; \/&gt; &lt;span class=&quot;btn&quot;&gt;\u6b21\u3078&lt;\/span&gt; &lt;\/label&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;div class=&quot;questionArea js-form-radio&quot;&gt;\r\n&lt;h2 class=&quot;title&quot;&gt;\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059&lt;\/h2&gt;\r\n&lt;div class=&quot;navi&quot;&gt;\r\n&lt;div class=&quot;navi__numbers&quot;&gt;&lt;span&gt;01&lt;\/span&gt; &lt;span&gt;02&lt;\/span&gt; &lt;span&gt;03&lt;\/span&gt; &lt;span&gt;04&lt;\/span&gt; &lt;span&gt;05&lt;\/span&gt; &lt;span class=&quot;current&quot;&gt;06&lt;\/span&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;div class=&quot;imagebox&quot;&gt;&lt;picture&gt;&lt;img src=&quot;https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png&quot; alt=&quot;&quot; height=&quot;358&quot; width=&quot;538&quot; draggable=&quot;false&quot; \/&gt; &lt;\/picture&gt;&lt;\/div&gt;\r\n&lt;div class=&quot;linkbox&quot;&gt;&lt;input id=&quot;q6-1&quot; type=&quot;radio&quot; name=&quot;q6&quot; \/&gt;&lt;label for=&quot;q6-1&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q6-2&quot; type=&quot;radio&quot; name=&quot;q6&quot; \/&gt;&lt;label for=&quot;q6-2&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q6-3&quot; type=&quot;radio&quot; name=&quot;q6&quot; \/&gt;&lt;label for=&quot;q6-3&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;input id=&quot;q6-4&quot; type=&quot;radio&quot; name=&quot;q6&quot; \/&gt;&lt;label for=&quot;q6-4&quot;&gt;&lt;span class=&quot;btn&quot;&gt;\u30c6\u30ad\u30b9\u30c8&lt;\/span&gt;&lt;\/label&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;span class=&quot;send-btn js-switch-btn&quot;&gt; &lt;button class=&quot;js-send&quot; type=&quot;button&quot;&gt;\u56de\u7b54\u3092\u5b8c\u4e86\u3059\u308b&lt;\/button&gt; &lt;\/span&gt;\r\n&lt;div class=&quot;revealarea js-reveal is-hidden&quot;&gt;\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002\u5b8c\u4e86\u30dc\u30bf\u30f3\u3092\u62bc\u3059\u3068\u8868\u793a\u3055\u308c\u308b\u90e8\u5206\u3002&lt;\/div&gt;\r\n&lt;\/form&gt;\r\n&lt;\/div&gt;<\/code><\/pre>\n<p>CSS<\/p>\n<pre><code>.btn{\r\nmargin: 0px;\r\n}\r\n .question-reveal-scroll {\r\n  width: 750px;\r\n  max-width: 100%;\r\n  font-size: 16px;\r\n  background-color: #fff;\r\n  margin: 0 auto 1rem;\r\n  padding: 1rem;\r\n  line-height: 1.5;\r\n  box-sizing: border-box;\r\n}\r\n\r\n .question-reveal-scroll .questionArea {\r\n  margin-bottom: 30px;\r\n  padding-bottom: 30px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  border-bottom: 1px solid #cccccc;\r\n}\r\n\r\n .navi {\r\n  text-align: center;\r\n  margin-bottom: 20px;\r\n  order: 1;\r\n}\r\n\r\n .navi__numbers {\r\n  position: relative;\r\n  display: inline-flex;\r\n  margin: 10px 0;\r\n  font-weight: bold;\r\n}\r\n\r\n .navi__numbers::before {\r\n  content: &#039;&#039;;\r\n  width: calc(100% - 40px);\r\n  height: 20px;\r\n  background-color: #eeeeee;\r\n  position: absolute;\r\n  top: calc(50% - 10px);\r\n  left: 20px;\r\n}\r\n\r\n .navi__numbers .current {\r\n  color: #fff;\r\n  background-color: #ff1493;\r\n}\r\n\r\n .navi__numbers span {\r\n  color: #ffffff;\r\n  background-color: #bbbbbb;\r\n  font-size: 20px;\r\n  border-radius: 50%;\r\n  padding: 0;\r\n  margin: 0 10px;\r\n  width: 35px;\r\n  aspect-ratio: 1\/1;\r\n  display: inline-flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n  position: relative;\r\n}\r\n\r\n .navi__numbers .current~span {\r\n  color: #fff;\r\n  background-color: #eebbcb;\r\n}\r\n\r\n .question-reveal-scroll .title {\r\n  width: 100%;\r\n  color: #000000;\r\n  background-color: #ffffff;\r\n  font-size: 20px;\r\n  text-align: left;\r\n  margin: 0 auto 1em;\r\n  padding: 0;\r\n  order: 2;\r\n}\r\n\r\n .question-reveal-scroll .imagebox {\r\n  text-align: center;\r\n  margin: 0 0 20px;\r\n  order: 3;\r\n}\r\n\r\n .question-reveal-scroll .imagebox img,\r\n .question-reveal-scroll .imagebox video {\r\n  display: inline !important;\r\n}\r\n\r\n .question-reveal-scroll .linkbox {\r\n  box-sizing: border-box;\r\n  order: 4;\r\n}\r\n\r\n .question-reveal-scroll input {\r\n  display: none;\r\n}\r\n\r\n .question-reveal-scroll input+label {\r\n  border: none;\r\n  padding: 6px;\r\n  display: block;\r\n}\r\n\r\n .question-reveal-scroll input+label .btn {\r\n  color: #000000;\r\n  background-color: #eeeeee;\r\n  width: 100%;\r\n  border-radius: 100vh;\r\n  padding: 0.5em 1em;\r\n  font-weight: bold;\r\n  text-align: center;\r\n  font-size: 18px;\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n  cursor: pointer;\r\n}\r\n\r\n .question-reveal-scroll input+label .btn:focus {\r\n  outline: none !important;\r\n}\r\n\r\n .question-reveal-scroll input:checked+label .btn {\r\n  background-color: #ff1493;\r\n  color: #ffffff;\r\n}\r\n\r\n .question-reveal-scroll ::-moz-focus-inner {\r\n  border-color: transparent;\r\n}\r\n\r\n .question-reveal-scroll .send-btn {\r\n  margin: 16px auto;\r\n}\r\n\r\n .question-reveal-scroll .send-btn button {\r\n  text-align: center;\r\n  border: none;\r\n  font-size: 20px;\r\n  font-weight: bold;\r\n  color: #fff;\r\n  margin: 0 auto;\r\n  padding: 1em;\r\n  background-color: #ff1493;\r\n  border-radius: 4px;\r\n  position: relative;\r\n  pointer-events: auto;\r\n  display: block;\r\n  transition: transform .2s;\r\n}\r\n\r\n .send-btn button:hover {\r\n  transform: scale(1.2);\r\n  cursor: pointer;\r\n}\r\n\r\n .revealarea {\r\n  font-size: 20px;\r\n  text-align: left;\r\n  margin: 48px auto 0;\r\n  padding: 0;\r\n  box-sizing: border-box;\r\n}\r\n\r\n .is-hidden {\r\n  display: none;\r\n}\r\n\r\n .next {\r\n  display: block;\r\n  border: none;\r\n  text-align: center;\r\n}\r\n\r\n .next input {\r\n  display: none;\r\n}\r\n\r\n .next .btn {\r\n  width: auto;\r\n  color: #fff;\r\n  font-size: 20px;\r\n  font-weight: 700;\r\n  background: linear-gradient(to bottom, #9acb3e, #018c48);\r\n  border: 1px solid #018c48;\r\n  border-radius: 5px;\r\n  box-shadow: 0 3px 0 #006666;\r\n  text-align: center;\r\n  position: relative;\r\n  margin: 10px auto 12px;\r\n  padding: 10px 20px 8px;\r\n  display: inline-block;\r\n  text-decoration: none;\r\n  box-sizing: border-box;\r\n}\r\n\r\n .next .btn:hover {\r\n  opacity: 0.7;\r\n  top: 2px;\r\n}<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>\u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059 \u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059 010203040506 \u30c6\u30ad\u30b9\u30c8\u30c6\u30ad\u30b9\u30c8\u30c6\u30ad\u30b9\u30c8 \u30c6\u30ad\u30b9\u30c8 \u3053\u3053\u306b\u30c6\u30ad\u30b9\u30c8\u304c\u5165\u308a\u307e\u3059 01 02 03 04 05 06 \u30c6\u30ad\u30b9\u30c8\u30c6\u30ad\u30b9\u30c8\u30c6\u30ad\u30b9\u30c8\u30c6\u30ad\u30b9\u30c8 \u6b21\u3078 \u3053\u3053<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[4,3],"class_list":["post-60","post","type-post","status-publish","format-standard","hentry","category-6","tag-simplicity02","tag-3"],"_links":{"self":[{"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/posts\/60","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=60"}],"version-history":[{"count":29,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/posts\/60\/revisions"}],"predecessor-version":[{"id":107,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/posts\/60\/revisions\/107"}],"wp:attachment":[{"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=60"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=60"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=60"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}