{"id":158,"date":"2023-01-27T20:54:02","date_gmt":"2023-01-27T11:54:02","guid":{"rendered":"https:\/\/phantom-cgray03.xyz\/?p=158"},"modified":"2023-02-28T16:23:09","modified_gmt":"2023-02-28T07:23:09","slug":"158","status":"publish","type":"post","link":"https:\/\/phantom-cgray03.xyz\/?p=158","title":{"rendered":"\u3010\u30a2\u30f3\u30b1\u30fc\u30c8\u3011\u56de\u7b54\u5f8c\u4e0b\u90e8\u3078\u30b9\u30af\u30ed\u30fc\u30eb\u3001\u6700\u5f8c\u306b\u30ea\u30f3\u30af\u306e\u30a2\u30f3\u30b1\u30fc\u30c8\u203b\u8981javascript"},"content":{"rendered":"<div class=\"questionCheck__area\">\n<div class=\"questionCheck__head\"><img loading=\"lazy\" decoding=\"async\" draggable=\"false\" src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" width=\"570\" height=\"380\" \/><\/div>\n<div class=\"questionCheck__inner\">\n<div class=\"arrow\"><span class=\"arrowInTxt\">START<\/span><\/div>\n<div class=\"question__box js-question\">\n<div class=\"question__head\">\n<p class=\"num\">Q1<\/p>\n<p class=\"txt\">\u8cea\u554f\u304c\u5165\u308a\u307e\u3059\u8cea\u554f\u304c\u5165\u308a\u307e\u3059<br \/>\n\u8cea\u554f\u304c\u5165\u308a\u307e\u3059<\/p>\n<\/div>\n<div class=\"question__items\"><input id=\"q1-1\" class=\"js-item\" name=\"q1\" type=\"radio\" \/> <label for=\"q1-1\">\u9078\u629e\u80a21-1<\/label> <input id=\"q1-2\" class=\"js-item\" name=\"q1\" type=\"radio\" \/> <label for=\"q1-2\">\u9078\u629e\u80a21-2<\/label> <input id=\"q1-3\" class=\"js-item\" name=\"q1\" type=\"radio\" \/> <label for=\"q1-3\">\u9078\u629e\u80a21-3<\/label> <input id=\"q1-4\" class=\"js-item\" name=\"q1\" type=\"radio\" \/> <label for=\"q1-4\">\u9078\u629e\u80a21-4<\/label><\/div>\n<div class=\"advice__box js-advice is-hidden\"><img decoding=\"async\" draggable=\"false\" src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" \/><\/div>\n<\/div>\n<div class=\"arrow\"><span class=\"arrowInTxt\">NEXT<\/span><\/div>\n<div class=\"question__box js-question\">\n<div class=\"question__head\">\n<p class=\"num\">Q2<\/p>\n<p class=\"txt\">\u8cea\u554f\u304c\u5165\u308a\u307e\u3059\u8cea\u554f\u304c\u5165\u308a\u307e\u3059<\/p>\n<\/div>\n<div class=\"question__items\"><input id=\"q2-1\" class=\"js-item\" name=\"q2\" type=\"radio\" \/> <label for=\"q2-1\">\u9078\u629e\u80a22-1<\/label> <input id=\"q2-2\" class=\"js-item\" name=\"q2\" type=\"radio\" \/> <label for=\"q2-2\">\u9078\u629e\u80a22-2<\/label> <input id=\"q2-3\" class=\"js-item\" name=\"q2\" type=\"radio\" \/> <label for=\"q2-3\">\u9078\u629e\u80a22-3<\/label> <input id=\"q2-4\" class=\"js-item\" name=\"q2\" type=\"radio\" \/> <label for=\"q2-4\">\u9078\u629e\u80a22-4<\/label><\/div>\n<div class=\"advice__box js-advice is-hidden\"><img decoding=\"async\" draggable=\"false\" src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" \/><\/div>\n<\/div>\n<div class=\"arrow\"><span class=\"arrowInTxt\">FINISH<\/span><\/div>\n<div class=\"question__box js-question\">\n<div class=\"question__head\">\n<p class=\"num\">Q3<\/p>\n<p class=\"txt\">\u8cea\u554f\u304c\u5165\u308a\u307e\u3059\u8cea\u554f\u304c\u5165\u308a\u307e\u3059<\/p>\n<\/div>\n<div class=\"question__items\"><input id=\"q3-1\" class=\"js-item\" name=\"q3\" type=\"radio\" \/> <label for=\"q3-1\">\u9078\u629e\u80a23-1<\/label> <input id=\"q3-2\" class=\"js-item\" name=\"q3\" type=\"radio\" \/> <label for=\"q3-2\">\u9078\u629e\u80a23-2<\/label> <input id=\"q3-3\" class=\"js-item\" name=\"q3\" type=\"radio\" \/> <label for=\"q3-3\">\u9078\u629e\u80a23-3<\/label> <input id=\"q3-4\" class=\"js-item\" name=\"q3\" type=\"radio\" \/> <label for=\"q3-4\">\u9078\u629e\u80a23-4<\/label><\/div>\n<div class=\"advice__box js-advice is-hidden\"><img decoding=\"async\" draggable=\"false\" src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" \/><\/div>\n<\/div>\n<div class=\"thanks__box\">\n<div class=\"thanks__head\">\n<div class=\"baloon__box\">\n<p class=\"txt\">\u30a2\u30f3\u30b1\u30fc\u30c8\u3078\u306e\u3054\u56de\u7b54<br \/>\n\u3042\u308a\u304c\u3068\u3046\u3054\u3056\u3044\u307e\u3057\u305f\uff01<\/p>\n<\/div>\n<\/div>\n<div class=\"thanks__content\"><img loading=\"lazy\" decoding=\"async\" draggable=\"false\" src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" width=\"513\" height=\"342\" \/> <a class=\"btn\" draggable=\"false\" href=\"\u25cb\u25cb\u25cb\u25cb\u25cb\">\u25cb\u25cb\u25cb\u25cb\u306e<br \/>\n\u4e88\u7d04\u306f\u3053\u3061\u3089<\/a><\/div>\n<\/div>\n<\/div>\n<\/div>\n<p>\u4e0b\u8a18Beyond\u30b3\u30fc\u30c9<\/p>\n<p>JS head<\/p>\n<pre><code>&lt;!-- \u30bf\u30b0\u8a2d\u5b9a\u306eJavaScript head\u306b\u4ee5\u4e0b\u3092\u30ab\u30c3\u30c8\u3057\u3066\u8cbc\u308a\u4ed8\u3051\u3066\u304f\u3060\u3055\u3044\u3002\r\n    \u540c\u4e00widget\u3092\u8907\u6570\u8ffd\u52a0\u3059\u308b\u5834\u5408\u3001\u8907\u6570\u56de\u8cbc\u4ed8\u3051\u306f\u4e0d\u8981\u3067\u3059\u3002 --&gt;\r\n&lt;script&gt;\r\n    var questionAdvice = questionAdvice || {};\r\n    (function(_) {\r\n        const target = '.js-question';\r\n\r\n        _.questionCheck = function(el) {\r\n            let advice;\r\n            let checkItems = el.querySelectorAll('.js-item');\r\n            checkItems.forEach(checkItem =&gt; {\r\n                checkItem.addEventListener('change', (e) =&gt; {\r\n                    advice = e.target.closest('.js-question').querySelector('.js-advice');\r\n                    if (advice.classList.contains('is-hidden')) {\r\n                        advice.classList.remove('is-hidden');\r\n                        smoothScroll(advice)\r\n                    }\r\n                })\r\n            });\r\n\r\n            function smoothScroll(target) {\r\n                let elPos = target.getBoundingClientRect().top;\r\n                let offset = window.pageYOffset;\r\n                let pos = elPos + offset;\r\n                window.scrollTo({\r\n                    top: pos,\r\n                    behavior: 'smooth',\r\n                });\r\n            };\r\n        };\r\n\r\n        \/**\r\n         * Lazyload\u753b\u50cf\u306e\u8aad\u307f\u8fbc\u307f\u30c1\u30a7\u30c3\u30af\r\n         * @param {object} object \u30c1\u30a7\u30c3\u30af\u3057\u305f\u3044\u753b\u50cf\r\n         * @param {callback} callback \u30ed\u30fc\u30c9\u5b8c\u4e86\u6642\u306b\u5b9f\u884c\u3059\u308b\u95a2\u6570\r\n         *\r\n         *\/\r\n        _.lazyImgLoaded = function(object, callback) {\r\n            if (typeof LazyLoad === 'undefined' || !(object.length)) {\r\n                if (!callback) return;\r\n                callback();\r\n                return;\r\n            }\r\n            const target = Array.from(object);\r\n\r\n            const promise = target.map(async (img) =&gt; {\r\n                return imgCheck(img);\r\n            });\r\n            Promise.all(promise).then((msg) =&gt; {\r\n                if (!callback) return;\r\n                callback();\r\n            });\r\n\r\n            function imgCheck(img) {\r\n                let flg = img.classList.contains('loaded');\r\n                return new Promise((resolve, reject) =&gt; {\r\n                    if (flg) {\r\n                        resolve(\"OK\");\r\n                        return;\r\n                    } else {\r\n                        LazyLoad.load(img, {\r\n                            callback_loaded: resolve(\"OK\"),\r\n                            callback_cancel: reject(\"ERROR\"),\r\n                            callback_error: reject(\"ERROR\")\r\n                        }); \/\/\u753b\u50cf\u306e\u8aad\u307f\u8fbc\u307f\r\n                    }\r\n                });\r\n            }\r\n        };\r\n\r\n        _.init = function() {\r\n            Array.from(document.querySelectorAll(target), el =&gt; {\r\n                _.questionCheck(el);\r\n            })\r\n        };\r\n\r\n    })(questionAdvice);\r\n&lt;\/script&gt;\r\n&lt;!-- JavaScript head\u3053\u3053\u307e\u3067 --&gt;\r\n\r\n\r\n&lt;!-- \u30bf\u30b0\u8a2d\u5b9a\u306eJavaScript body\u306b\u4ee5\u4e0b\u3092\u30ab\u30c3\u30c8\u3057\u3066\u8cbc\u308a\u4ed8\u3051\u3066\u304f\u3060\u3055\u3044\u3002\r\n    \u540c\u4e00widget\u3092\u8907\u6570\u8ffd\u52a0\u3059\u308b\u5834\u5408\u3001\u8907\u6570\u56de\u8cbc\u4ed8\u3051\u306f\u4e0d\u8981\u3067\u3059\u3002 --&gt;\r\n&lt;script&gt;\r\n    document.addEventListener(&#039;DOMContentLoaded&#039;, function() {\r\n        questionAdvice.lazyImgLoaded(document.querySelectorAll(&quot;.js-question img&quot;), questionAdvice.init);\r\n    }, false);\r\n&lt;\/script&gt;\r\n&lt;!-- JavaScript body\u3053\u3053\u307e\u3067 --&gt;\r\n<\/code><\/pre>\n<p>HTML<\/p>\n<pre><code>&lt;div class=\"questionCheck__area\"&gt;\r\n    &lt;div class=\"questionCheck__head\"&gt;\r\n        &lt;img src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" height=\"380\" width=\"570\" draggable=\"false\"&gt;\r\n    &lt;\/div&gt;\r\n\r\n    &lt;div class=\"questionCheck__inner\"&gt;\r\n        &lt;div class=\"arrow\"&gt;\r\n            &lt;span class=\"arrowInTxt\"&gt;START&lt;\/span&gt;\r\n        &lt;\/div&gt;\r\n\r\n        &lt;div class=\"question__box js-question\"&gt;\r\n            &lt;div class=\"question__head\"&gt;\r\n                &lt;p class=\"num\"&gt;Q1&lt;\/p&gt;\r\n                &lt;p class=\"txt\"&gt;\u8cea\u554f\u304c\u5165\u308a\u307e\u3059\u8cea\u554f\u304c\u5165\u308a\u307e\u3059&lt;br&gt;\u8cea\u554f\u304c\u5165\u308a\u307e\u3059&lt;\/p&gt;\r\n            &lt;\/div&gt;\r\n\r\n            &lt;div class=\"question__items\"&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q1\" id=\"q1-1\"&gt;\r\n                &lt;label for=\"q1-1\"&gt;\u9078\u629e\u80a21-1&lt;\/label&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q1\" id=\"q1-2\"&gt;\r\n                &lt;label for=\"q1-2\"&gt;\u9078\u629e\u80a21-2&lt;\/label&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q1\" id=\"q1-3\"&gt;\r\n                &lt;label for=\"q1-3\"&gt;\u9078\u629e\u80a21-3&lt;\/label&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q1\" id=\"q1-4\"&gt;\r\n                &lt;label for=\"q1-4\"&gt;\u9078\u629e\u80a21-4&lt;\/label&gt;\r\n            &lt;\/div&gt;\r\n\r\n            &lt;div class=\"advice__box js-advice is-hidden\"&gt;\r\n                &lt;img src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" draggable=\"false\"&gt;\r\n            &lt;\/div&gt;\r\n        &lt;\/div&gt;\r\n\r\n        &lt;div class=\"arrow\"&gt;\r\n            &lt;span class=\"arrowInTxt\"&gt;NEXT&lt;\/span&gt;\r\n        &lt;\/div&gt;\r\n\r\n        &lt;div class=\"question__box js-question\"&gt;\r\n            &lt;div class=\"question__head\"&gt;\r\n                &lt;p class=\"num\"&gt;Q2&lt;\/p&gt;\r\n                &lt;p class=\"txt\"&gt;\u8cea\u554f\u304c\u5165\u308a\u307e\u3059\u8cea\u554f\u304c\u5165\u308a\u307e\u3059&lt;\/p&gt;\r\n            &lt;\/div&gt;\r\n\r\n            &lt;div class=\"question__items\"&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q2\" id=\"q2-1\"&gt;\r\n                &lt;label for=\"q2-1\"&gt;\u9078\u629e\u80a22-1&lt;\/label&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q2\" id=\"q2-2\"&gt;\r\n                &lt;label for=\"q2-2\"&gt;\u9078\u629e\u80a22-2&lt;\/label&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q2\" id=\"q2-3\"&gt;\r\n                &lt;label for=\"q2-3\"&gt;\u9078\u629e\u80a22-3&lt;\/label&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q2\" id=\"q2-4\"&gt;\r\n                &lt;label for=\"q2-4\"&gt;\u9078\u629e\u80a22-4&lt;\/label&gt;\r\n            &lt;\/div&gt;\r\n\r\n            &lt;div class=\"advice__box js-advice is-hidden\"&gt;\r\n                &lt;img src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" draggable=\"false\"&gt;\r\n            &lt;\/div&gt;\r\n        &lt;\/div&gt;\r\n\r\n        &lt;div class=\"arrow\"&gt;\r\n            &lt;span class=\"arrowInTxt\"&gt;FINISH&lt;\/span&gt;\r\n        &lt;\/div&gt;\r\n\r\n        &lt;div class=\"question__box js-question\"&gt;\r\n            &lt;div class=\"question__head\"&gt;\r\n                &lt;p class=\"num\"&gt;Q3&lt;\/p&gt;\r\n                &lt;p class=\"txt\"&gt;\u8cea\u554f\u304c\u5165\u308a\u307e\u3059\u8cea\u554f\u304c\u5165\u308a\u307e\u3059&lt;\/p&gt;\r\n            &lt;\/div&gt;\r\n\r\n            &lt;div class=\"question__items\"&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q3\" id=\"q3-1\"&gt;\r\n                &lt;label for=\"q3-1\"&gt;\u9078\u629e\u80a23-1&lt;\/label&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q3\" id=\"q3-2\"&gt;\r\n                &lt;label for=\"q3-2\"&gt;\u9078\u629e\u80a23-2&lt;\/label&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q3\" id=\"q3-3\"&gt;\r\n                &lt;label for=\"q3-3\"&gt;\u9078\u629e\u80a23-3&lt;\/label&gt;\r\n                &lt;input class=\"js-item\" type=\"radio\" name=\"q3\" id=\"q3-4\"&gt;\r\n                &lt;label for=\"q3-4\"&gt;\u9078\u629e\u80a23-4&lt;\/label&gt;\r\n            &lt;\/div&gt;\r\n\r\n            &lt;div class=\"advice__box js-advice is-hidden\"&gt;\r\n                &lt;img src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" draggable=\"false\"&gt;\r\n            &lt;\/div&gt;\r\n        &lt;\/div&gt;\r\n\r\n        &lt;div class=\"thanks__box\"&gt;\r\n            &lt;div class=\"thanks__head\"&gt;\r\n                &lt;div class=\"baloon__box\"&gt;\r\n                    &lt;p class=\"txt\"&gt;\u30a2\u30f3\u30b1\u30fc\u30c8\u3078\u306e\u3054\u56de\u7b54&lt;br&gt;\u3042\u308a\u304c\u3068\u3046\u3054\u3056\u3044\u307e\u3057\u305f\uff01&lt;\/p&gt;\r\n                &lt;\/div&gt;\r\n            &lt;\/div&gt;\r\n\r\n            &lt;div class=\"thanks__content\"&gt;\r\n                &lt;img src=\"https:\/\/production.static.squadbeyond.com\/uploads\/article_photo\/photo\/711633\/2856f88e-0076-4f7a-9dd6-c1e5117bb18b.png\" alt=\"\" height=\"342\" width=\"513\" draggable=\"false\"&gt;\r\n                &lt;a href=\"\u25cb\u25cb\u25cb\u25cb\u25cb\" class=\"btn\" draggable=\"false\"&gt;\u25cb\u25cb\u25cb\u25cb\u306e&lt;br&gt;\u4e88\u7d04\u306f\u3053\u3061\u3089&lt;\/a&gt;\r\n            &lt;\/div&gt;\r\n        &lt;\/div&gt;\r\n    &lt;\/div&gt;\r\n&lt;\/div&gt;<\/code><\/pre>\n<p>CSS<\/p>\n<pre><code> p {\r\n  margin: 0;\r\n}\r\n\r\n .questionCheck__area {\r\n  width: 100%;\r\n  height: auto;\r\n}\r\n\r\n .questionCheck__area img {\r\n  width: 100%;\r\n  height: auto;\r\n}\r\n\r\n .questionCheck__area .arrow {\r\n  width: 0;\r\n  height: 0;\r\n  border-style: solid;\r\n  border-right: 100px solid transparent;\r\n  border-left: 100px solid transparent;\r\n  border-top: 60px solid #95dfd6;\r\n  border-bottom: 0;\r\n  position: relative;\r\n  margin: 20px auto 0;\r\n}\r\n\r\n .arrow .arrowInTxt {\r\n  position: absolute;\r\n  top: -50px;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n  font-size: 16px;\r\n  font-weight: bold;\r\n  color: #fff;\r\n  max-width: initial;\r\n}\r\n\r\n .question__box {\r\n  margin-top: 20px;\r\n  width: 100%;\r\n}\r\n\r\n .question__box .question__head {\r\n  width: 95%;\r\n  margin: 0 auto;\r\n  display: flex;\r\n  justify-content: flex-start;\r\n  align-items: flex-start;\r\n}\r\n\r\n .question__box .question__head .num {\r\n  width: 100px;\r\n  height: 100px;\r\n  border-radius: 50px;\r\n  background: #F3C759;\r\n  color: #fff;\r\n  font-size: 40px;\r\n  font-weight: bold;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n}\r\n\r\n@media screen and (max-width:600px) {\r\n   .question__box .question__head .num {\r\n    width: 80px;\r\n    height: 80px;\r\n    border-radius: 40px;\r\n    font-size: 30px;\r\n  }\r\n}\r\n\r\n .question__box .question__head .txt {\r\n  width: calc(100% - 120px);\r\n  margin-left: 20px;\r\n  font-size: 32px;\r\n  font-weight: bold;\r\n  color: #666;\r\n}\r\n\r\n@media screen and (max-width:600px) {\r\n   .question__box .question__head .txt {\r\n    width: calc(100% - 90px);\r\n    margin-left: 10px;\r\n    font-size: 24px;\r\n  }\r\n}\r\n\r\n .question__box .question__items {\r\n  width: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  margin-top: 10px;\r\n}\r\n\r\n .question__items input {\r\n  display: none;\r\n}\r\n\r\n .question__items label {\r\n  width: calc(90% - 80px);\r\n  padding: 10px 15px 10px 65px;\r\n  margin: 15px auto 0;\r\n  border-radius: 5px;\r\n  background: #99CFE5;\r\n  color: #fff;\r\n  font-size: 30px;\r\n  position: relative;\r\n}\r\n\r\n@media screen and (max-width:600px) {\r\n   .question__items label {\r\n    font-size: 24px;\r\n  }\r\n}\r\n\r\n .question__items input:checked+label {\r\n  background: #44A5CB;\r\n}\r\n\r\n .question__items label:before {\r\n  content: '';\r\n  width: 30px;\r\n  height: 30px;\r\n  border: 2px solid #fff;\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 15px;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n .question__items input:checked+label:after {\r\n  content: '';\r\n  width: 16px;\r\n  height: 6px;\r\n  display: block;\r\n  border-bottom: 5px solid #fff;\r\n  border-left: 5px solid #fff;\r\n  position: absolute;\r\n  top: 45%;\r\n  left: 25px;\r\n  transform: rotate(-40deg) translateY(-45%);\r\n}\r\n\r\n .advice__box {\r\n  margin-top: 60px;\r\n}\r\n\r\n .thanks__box {\r\n  width: 90%;\r\n  margin: 60px auto 0;\r\n}\r\n\r\n .thanks__box .thanks__head .baloon__box {\r\n  width: calc(100% - 20px);\r\n  background: #95dfd6;\r\n  text-align: center;\r\n  font-size: 30px;\r\n  color: #fff;\r\n  border-radius: 5px;\r\n  padding: 10px;\r\n  margin-bottom: 30px;\r\n  position: relative;\r\n}\r\n\r\n@media screen and (max-width:600px) {\r\n   .thanks__box .thanks__head .baloon__box {\r\n    font-size: 24px;\r\n  }\r\n}\r\n\r\n .thanks__box .thanks__head .baloon__box:after {\r\n  content: '';\r\n  width: 0;\r\n  height: 0;\r\n  border-style: solid;\r\n  border-right: 10px solid transparent;\r\n  border-left: 10px solid transparent;\r\n  border-top: 15px solid #95dfd6;\r\n  position: absolute;\r\n  bottom: -15px;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n}\r\n\r\n .thanks__content {\r\n  width: 100%;\r\n  margin-top: 30px;\r\n}\r\n\r\n .thanks__content .btn {\r\n  width: 100%;\r\n  height: auto;\r\n  padding: 20px 0;\r\n  margin-top: 20px;\r\n  border-radius: 20vw;\r\n  background-image: linear-gradient(to top, #f83600 0%, #f9d423 100%);\r\n  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);\r\n  display: inline-block;\r\n  color: #fff;\r\n  font-size: 24px;\r\n  font-weight: bold;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  transition: opacity 0.2s;\r\n  opacity: 1;\r\n}\r\n\r\n .thanks__content .btn:hover {\r\n  opacity: 0.8;\r\n}\r\n\r\n .is-hidden {\r\n  display: none;\r\n}<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>START Q1 \u8cea\u554f\u304c\u5165\u308a\u307e\u3059\u8cea\u554f\u304c\u5165\u308a\u307e\u3059 \u8cea\u554f\u304c\u5165\u308a\u307e\u3059 \u9078\u629e\u80a21-1 \u9078\u629e\u80a21-2 \u9078\u629e\u80a21-3 \u9078\u629e\u80a21-4 NEXT Q2 \u8cea\u554f\u304c\u5165\u308a\u307e\u3059\u8cea\u554f\u304c\u5165\u308a\u307e\u3059 \u9078\u629e\u80a22-1 \u9078\u629e\u80a22-2 \u9078\u629e\u80a22-3 \u9078\u629e\u80a22-4<\/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-158","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\/158","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=158"}],"version-history":[{"count":5,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/posts\/158\/revisions"}],"predecessor-version":[{"id":245,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=\/wp\/v2\/posts\/158\/revisions\/245"}],"wp:attachment":[{"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=158"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=158"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/phantom-cgray03.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=158"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}