{"id":2025,"date":"2026-01-23T18:47:52","date_gmt":"2026-01-23T09:47:52","guid":{"rendered":"https:\/\/sora1.jp\/islab\/?page_id=2025"},"modified":"2026-03-16T14:54:00","modified_gmt":"2026-03-16T05:54:00","slug":"content-ai","status":"publish","type":"page","link":"https:\/\/sora1.jp\/islab\/content-ai\/","title":{"rendered":"Web\u30b3\u30f3\u30c6\u30f3\u30c4\u4f5c\u6210AI"},"content":{"rendered":"\n<div class=\"swell-block-fullWide pc-py-0 sp-py-40 alignfull\" style=\"background-color:#ffffff\"><div class=\"swell-block-fullWide__inner\">\n<style>\n  @import url('https:\/\/fonts.googleapis.com\/css2?family=Noto+Sans+JP:wght@400;500;700;900&display=swap');\n\n  \/* --- SWELL Optimization Styles --- *\/\n  .swell-lp-wrapper {\n    font-family: 'Noto Sans JP', \"Helvetica Neue\", Arial, \"Hiragino Kaku Gothic ProN\", \"Hiragino Sans\", Meiryo, sans-serif;\n    color: #333;\n    line-height: 1.8;\n    margin: 0;\n    padding: 0;\n    width: 100%;\n  }\n\n  .swell-lp-wrapper * {\n    box-sizing: border-box;\n  }\n\n  \/* Section Styles *\/\n  .slp-section {\n    padding: 60px 20px;\n    width: 100%;\n  }\n\n  .slp-container {\n    max-width: 1100px;\n    margin: 0 auto;\n    position: relative;\n  }\n\n  \/* Typography *\/\n  .slp-h2 {\n    font-size: 1.8rem;\n    font-weight: 700;\n    text-align: center;\n    margin-bottom: 2.5rem;\n    color: #333;\n    position: relative;\n    padding-bottom: 15px;\n  }\n  \n  .slp-h2::after {\n    content: '';\n    display: block;\n    width: 60px;\n    height: 3px;\n    background: #4f46e5;\n    margin: 15px auto 0;\n    border-radius: 2px;\n  }\n\n  .slp-h3 {\n    font-size: 1.25rem;\n    font-weight: 700;\n    margin-bottom: 1rem;\n    color: #1e293b;\n    display: flex;\n    align-items: center;\n    gap: 10px;\n  }\n\n  \/* Colors *\/\n  .bg-white { background-color: #ffffff; }\n  .bg-gray { background-color: #f8fafc; }\n  \n  \/* --- New Hero Section Styles (2-Column & Match Tone) --- *\/\n  .slp-hero-new {\n    padding: 80px 20px 100px;\n    background-color: #ffffff;\n    overflow: hidden;\n  }\n\n  .slp-hero-inner {\n    display: flex;\n    align-items: center;\n    gap: 60px;\n    max-width: 1100px;\n    margin: 0 auto;\n  }\n\n  .slp-hero-text {\n    flex: 1;\n    z-index: 2;\n  }\n\n  .slp-hero-catch {\n    color: #3b82f6;\n    font-weight: 700;\n    font-size: 1.1rem;\n    margin-bottom: 10px;\n  }\n\n  .slp-hero-main-title {\n    color: #004a82 !important;\n    font-size: clamp(32px, 4.5vw, 68px) !important;\n    font-weight: 900 !important;\n    font-family: 'Noto Sans JP', sans-serif !important;\n    line-height: 1.2;\n    margin-bottom: 25px;\n    letter-spacing: -0.02em;\n  }\n\n  .slp-hero-desc {\n    font-size: 1.125rem;\n    color: #475569 !important;\n    line-height: 1.8;\n    margin-bottom: 30px;\n    font-weight: 700 !important;\n  }\n\n  .slp-hero-highlight {\n    font-size: 1.1rem;\n    font-weight: 700;\n    color: #1f2937;\n    margin-bottom: 30px;\n    background: linear-gradient(transparent 70%, #dbeafe 70%);\n    display: inline-block;\n  }\n\n  .slp-hero-btn-wrap {\n    margin-top: 10px;\n  }\n\n  \/* --- Premium CTA Button Styles --- *\/\n  .btn-cta-premium {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 0.75rem;\n    background: linear-gradient(135deg, #0B698F 0%, #003652 100%);\n    color: #ffffff !important;\n    font-weight: 900;\n    padding: 1.25rem 3rem;\n    border-radius: 9999px;\n    font-size: 1.125rem;\n    text-decoration: none !important;\n    box-shadow: 0 10px 25px -5px rgba(11, 105, 143, 0.5), 0 8px 10px -6px rgba(11, 105, 143, 0.1);\n    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n    position: relative;\n    overflow: hidden;\n    border: 2px solid transparent;\n    width: 100%;\n    max-width: 420px;\n  }\n\n  @media (min-width: 640px) {\n    .btn-cta-premium { width: auto; max-width: none; }\n  }\n\n  .btn-cta-premium::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: -100%;\n    width: 50%;\n    height: 100%;\n    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 100%);\n    transform: skewX(-20deg);\n    transition: all 0.7s ease;\n  }\n\n  .btn-cta-premium:hover {\n    transform: translateY(-3px);\n    box-shadow: 0 20px 35px -5px rgba(11, 105, 143, 0.6), 0 10px 15px -6px rgba(11, 105, 143, 0.2);\n    border-color: rgba(202, 237, 251, 0.3);\n  }\n\n  .btn-cta-premium:hover::before {\n    left: 150%;\n    animation: shine 1.5s infinite;\n  }\n\n  @keyframes shine {\n    0% { left: -100%; }\n    20% { left: 150%; }\n    100% { left: 150%; }\n  }\n\n  .btn-cta-premium svg {\n    transition: transform 0.3s ease;\n  }\n\n  .btn-cta-premium:hover svg {\n    transform: translateX(4px);\n  }\n\n  \/* Bottom CTA Section *\/\n  .slp-bottom-cta {\n    padding: 80px 20px;\n    text-align: center;\n    background: #ffffff;\n    border-top: 1px solid #e2e8f0;\n  }\n\n  .slp-bottom-cta-title {\n    font-size: 1.8rem;\n    font-weight: 900;\n    color: #004a82;\n    margin-bottom: 1rem;\n  }\n\n  .slp-bottom-cta-desc {\n    font-size: 1rem;\n    color: #475569;\n    font-weight: 700;\n    margin-bottom: 30px;\n  }\n\n  \/* --- Image Area Styles --- *\/\n  .slp-hero-image-area {\n    flex: 1;\n    position: relative;\n    z-index: 1;\n  }\n\n  .slp-hero-bg-wrapper {\n    position: relative;\n    width: 100%;\n    border-radius: 20px;\n    background-color: #f8fafc; \/* \u4f59\u767d\u304c\u81ea\u7136\u306b\u898b\u3048\u308b\u3088\u3046\u8584\u3044\u30b0\u30ec\u30fc\u306b\u5909\u66f4 *\/\n    padding-top: 70%;\n    overflow: hidden;\n    border: 1px solid #e2e8f0; \/* \u80cc\u666f\u304c\u767d\u306b\u8fd1\u3044\u305f\u3081\u67a0\u7dda\u3092\u8ffd\u52a0 *\/\n  }\n\n  .slp-hero-bg-img {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    object-fit: contain; \/* cover\u304b\u3089contain\u306b\u5909\u66f4\u3057\u3066\u753b\u50cf\u304c\u5207\u308c\u306a\u3044\u3088\u3046\u306b *\/\n    padding: 10px; \/* \u67a0\u306b\u5bc6\u7740\u3057\u306a\u3044\u3088\u3046\u5c11\u3057\u4f59\u767d\u3092\u8ffd\u52a0 *\/\n  }\n\n  .slp-hero-ui-img {\n    position: absolute;\n    bottom: -15%;\n    left: -20%;\n    width: 75%;\n    border-radius: 12px;\n    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);\n    border: 6px solid #ffffff;\n    z-index: 3;\n    transition: transform 0.3s ease;\n  }\n  \n  .slp-hero-ui-img:hover {\n    transform: translateY(-5px) scale(1.02);\n  }\n\n  \/* --- Floating Badge --- *\/\n  .slp-hero-badge {\n    position: absolute;\n    top: -20px;\n    right: -15px;\n    background: linear-gradient(135deg, #f59e0b, #ea580c);\n    color: #ffffff;\n    font-size: 0.95rem;\n    font-weight: 900;\n    width: 110px;\n    height: 110px;\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    line-height: 1.3;\n    box-shadow: 0 10px 20px rgba(234, 88, 12, 0.4);\n    border: 4px solid #ffffff;\n    z-index: 10;\n    animation: floatBadge 3s ease-in-out infinite;\n  }\n\n  @keyframes floatBadge {\n    0% { transform: translateY(0) rotate(5deg) scale(1); }\n    50% { transform: translateY(-15px) rotate(-5deg) scale(1.05); }\n    100% { transform: translateY(0) rotate(5deg) scale(1); }\n  }\n\n  \/* Responsive for New Hero *\/\n  @media (max-width: 992px) {\n    .slp-hero-inner {\n      flex-direction: column;\n      gap: 50px;\n    }\n    .slp-hero-text {\n      text-align: center;\n    }\n    .slp-hero-main-title {\n      font-size: 2.2rem;\n    }\n    .slp-hero-image-area {\n      width: 100%;\n      max-width: 600px;\n      margin: 0 auto 30px;\n    }\n    .slp-hero-ui-img {\n      left: 10%;\n      width: 80%;\n      bottom: -10%;\n    }\n    .slp-hero-badge {\n      width: 90px;\n      height: 90px;\n      font-size: 0.8rem;\n      top: -10px;\n      right: 0px;\n    }\n  }\n\n  \/* --- Infographic Styles --- *\/\n  .slp-flow-wrapper {\n    padding: 40px;\n    background: #fff;\n    border-radius: 20px;\n    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.1);\n    border: 1px solid #e2e8f0;\n    color: #333;\n    text-align: left;\n  }\n\n  .slp-flow-title {\n    font-size: 1.5rem;\n    font-weight: 700;\n    color: #4f46e5;\n    margin-bottom: 15px;\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n    text-align: center;\n  }\n\n  .slp-flow-description {\n    font-size: 1rem;\n    color: #4b5563;\n    text-align: center;\n    margin-bottom: 40px;\n    line-height: 1.6;\n    max-width: 800px;\n    margin-left: auto;\n    margin-right: auto;\n  }\n\n  .slp-flow-container {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    position: relative;\n    gap: 20px;\n  }\n\n  \/* Connector Line *\/\n  .slp-flow-container::before {\n    content: '';\n    position: absolute;\n    top: 30px;\n    left: 50px;\n    right: 50px;\n    height: 2px;\n    background: #e2e8f0;\n    z-index: 0;\n  }\n\n  .slp-flow-step {\n    position: relative;\n    z-index: 1;\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    text-align: center;\n  }\n\n  .slp-flow-icon-box {\n    width: 60px;\n    height: 60px;\n    background: #fff;\n    border: 2px solid #4f46e5;\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-bottom: 15px;\n    color: #4f46e5;\n    transition: all 0.3s ease;\n    box-shadow: 0 4px 6px rgba(0,0,0,0.05);\n  }\n\n  .slp-flow-step:hover .slp-flow-icon-box {\n    background: #4f46e5;\n    color: #fff;\n    transform: translateY(-3px);\n    box-shadow: 0 10px 15px rgba(79, 70, 229, 0.2);\n  }\n\n  .slp-flow-step-title {\n    font-size: 0.95rem;\n    font-weight: 700;\n    color: #1e293b;\n    margin-bottom: 8px;\n  }\n\n  .slp-flow-step-desc {\n    font-size: 0.8rem;\n    color: #64748b;\n    line-height: 1.5;\n    max-width: 140px;\n  }\n\n  \/* Suite Grid *\/\n  .slp-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));\n    gap: 30px;\n    margin-top: 40px;\n  }\n\n  .slp-card {\n    background: #fff;\n    border-radius: 16px;\n    padding: 30px;\n    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);\n    border: 1px solid #f1f5f9;\n    transition: transform 0.3s ease;\n    display: flex;\n    flex-direction: column;\n  }\n  \n  .slp-card:hover {\n    transform: translateY(-5px);\n    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05);\n  }\n\n  .slp-card-img {\n    width: 100%;\n    height: auto;\n    border-radius: 8px;\n    border: 1px solid #e2e8f0;\n    margin-bottom: 20px;\n    box-shadow: 0 2px 5px rgba(0,0,0,0.05);\n    aspect-ratio: 16 \/ 9;\n    object-fit: cover;\n    background-color: #f8fafc;\n    cursor: zoom-in;\n    transition: filter 0.2s;\n  }\n\n  .slp-card-img:hover {\n    filter: brightness(0.95);\n  }\n\n  .slp-tag {\n    font-size: 0.75rem;\n    font-weight: 700;\n    text-transform: uppercase;\n    padding: 4px 10px;\n    border-radius: 4px;\n    margin-bottom: 15px;\n    display: inline-block;\n    align-self: flex-start;\n  }\n  \n  .tag-core { background: #e0e7ff; color: #4338ca; }\n  .tag-growth { background: #d1fae5; color: #065f46; }\n  .tag-nurture { background: #fae8ff; color: #86198f; }\n  .tag-analysis { background: #cffafe; color: #0891b2; }\n  .tag-research { background: #fff7ed; color: #c2410c; }\n  .tag-video { background: #fdf4ff; color: #a21caf; }\n\n  \/* --- Lightbox Styles --- *\/\n  .slp-lightbox {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: rgba(0, 0, 0, 0.85);\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    z-index: 99999;\n    opacity: 0;\n    visibility: hidden;\n    transition: all 0.3s ease;\n    padding: 20px;\n    cursor: zoom-out;\n    backdrop-filter: blur(5px);\n  }\n\n  .slp-lightbox.active {\n    opacity: 1;\n    visibility: visible;\n  }\n\n  .slp-lightbox img {\n    max-width: 95%;\n    max-height: 90vh;\n    border-radius: 8px;\n    box-shadow: 0 5px 30px rgba(0,0,0,0.5);\n    transform: scale(0.95);\n    transition: transform 0.3s ease;\n    cursor: default;\n    background: #fff;\n  }\n\n  .slp-lightbox.active img {\n    transform: scale(1);\n  }\n\n  \/* Responsive *\/\n  @media (max-width: 768px) {\n    .slp-section { padding: 60px 15px; }\n    \n    .slp-flow-container {\n      flex-direction: column;\n      align-items: flex-start;\n      gap: 30px;\n      padding-left: 20px;\n    }\n    .slp-flow-container::before {\n      width: 2px;\n      height: calc(100% - 60px);\n      left: 30px;\n      top: 0;\n      right: auto;\n    }\n    .slp-flow-step {\n      flex-direction: row;\n      text-align: left;\n      width: 100%;\n      align-items: flex-start;\n    }\n    .slp-flow-icon-box {\n      margin-bottom: 0;\n      margin-right: 20px;\n      flex-shrink: 0;\n    }\n    .slp-flow-step-desc {\n      max-width: 100%;\n    }\n  }\n<\/style>\n\n<div class=\"swell-lp-wrapper\">\n\n  <section class=\"slp-hero-new\">\n    <div class=\"slp-container\">\n      <div class=\"slp-hero-inner\">\n        <div class=\"slp-hero-text\">\n          <p class=\"slp-hero-catch\">\u4f1a\u793e\u306e\u8cc7\u7523\u3092AI\u304c\u6709\u529b\u306a\u30b3\u30f3\u30c6\u30f3\u30c4\u306b\u5909\u3048\u308b\uff01<\/p>\n          <h1 class=\"slp-hero-main-title\">Web\u30b3\u30f3\u30c6\u30f3\u30c4\u4f5c\u6210 AI<\/h1>\n          <p class=\"slp-hero-desc\">\n            \u304a\u5ba2\u69d8\u3068\u306e\u3084\u308a\u53d6\u308a\u306e\u30c7\u30fc\u30bf\u3001\u55b6\u696d\u8cc7\u6599\u3001\u4f1a\u793e\u6848\u5185\u3001\u4f01\u753b\u66f8\u3001\u63d0\u6848\u66f8\u306a\u3069\u3092AI\u304c\u55b6\u696d\u30a2\u30d7\u30ea\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u306b\u3057\u307e\u3059\u3002\u81ea\u793e\u72ec\u81ea\u306e\u30aa\u30ea\u30b8\u30ca\u30eb\u30a2\u30d7\u30ea\u304c\u5b8c\u6210\u3067\u3059\uff01\n          <\/p>\n          <p class=\"slp-hero-highlight\">\u30de\u30fc\u30b1\u30c6\u30a3\u30f3\u30b0\u306e\u300c\u5168\u5de5\u7a0b\u300d\u3092\u3001AI\u304c\u52a0\u901f\u3055\u305b\u308b\u3002<\/p>\n          <div class=\"slp-hero-btn-wrap\">\n            <a href=\"https:\/\/sora1.jp\/islab\/contact\/\" class=\"btn-cta-premium\" aria-label=\"\u8cc7\u6599\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3068\u7121\u6599\u30c7\u30e2\u3092\u7533\u3057\u8fbc\u3080\">\n              \u8cc7\u6599\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\uff06\u7121\u6599\u30c7\u30e2\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M5 12h14\"><\/path><path d=\"m12 5 7 7-7 7\"><\/path><\/svg>\n            <\/a>\n          <\/div>\n        <\/div>\n\n        <div class=\"slp-hero-image-area\">\n          <div class=\"slp-hero-badge\">\u30ef\u30f3\u30af\u30ea\u30c3\u30af<br>\u3067\u5b8c\u6210\uff01<\/div>\n\n          <div class=\"slp-hero-bg-wrapper\">\n            <!-- URL\u5909\u66f4\u3001CSS\u3067object-fit: contain\u9069\u7528 -->\n            <img decoding=\"async\" src=\"https:\/\/sora1.jp\/islab\/wp-content\/uploads\/2026\/03\/AI-APP-6B.jpeg\" class=\"slp-hero-bg-img\" alt=\"Hero Background\">\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/sora1.jp\/islab\/wp-content\/uploads\/2026\/03\/AI-APP-11-2.gif\" class=\"slp-hero-ui-img\" alt=\"App UI\">\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section id=\"apps-section\" class=\"slp-section bg-white\">\n    <div class=\"slp-container\">\n      <h2 class=\"slp-h2\">WEB\u30a2\u30d7\u30ea\u306e\u4f8b<\/h2>\n      \n      <div class=\"slp-grid\">\n        <div class=\"slp-card\">\n          <span class=\"slp-tag tag-core\">Core Tool<\/span>\n          <h3 class=\"slp-h3\">\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#4f46e5\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\" ry=\"2\"\/><line x1=\"3\" x2=\"21\" y1=\"9\" y2=\"9\"\/><line x1=\"9\" x2=\"9\" y1=\"21\" y2=\"9\"\/><\/svg>\n            LP\u81ea\u52d5\u4f5c\u6210\u30a2\u30d7\u30ea\n          <\/h3>\n          <img decoding=\"async\" src=\"https:\/\/sora1.jp\/islab\/wp-content\/uploads\/2026\/03\/AI-APP-11-2.gif\" alt=\"LP\u81ea\u52d5\u4f5c\u6210\u30a2\u30d7\u30ea UI\" class=\"slp-card-img\" title=\"\u30af\u30ea\u30c3\u30af\u3057\u3066\u62e1\u5927\">\n          <p>\u30c6\u30ad\u30b9\u30c8\u6307\u793a\u3084\u53c2\u8003\u753b\u50cf\u304b\u3089\u3001\u30c7\u30b6\u30a4\u30f3\u6e08\u307f\u306e\u30e9\u30f3\u30c7\u30a3\u30f3\u30b0\u30da\u30fc\u30b8(HTML)\u3092\u5373\u5ea7\u306b\u69cb\u7bc9\u3002\u30b3\u30fc\u30c7\u30a3\u30f3\u30b0\u5de5\u6570\u3092\u30bc\u30ed\u306b\u3057\u307e\u3059\u3002<\/p>\n        <\/div>\n\n        <div class=\"slp-card\">\n          <span class=\"slp-tag tag-growth\">Growth<\/span>\n          <h3 class=\"slp-h3\">\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#10b981\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\"\/><circle cx=\"12\" cy=\"10\" r=\"3\"\/><\/svg>\n            AI List Generator\n          <\/h3>\n          <img decoding=\"async\" src=\"https:\/\/sora1.jp\/islab\/wp-content\/uploads\/2026\/01\/AI-APP-2.jpeg\" alt=\"AI List Generator UI\" class=\"slp-card-img\" title=\"\u30af\u30ea\u30c3\u30af\u3057\u3066\u62e1\u5927\">\n          <p>Google\u691c\u7d22Grounding\u3092\u6d3b\u7528\u3057\u3001\u7279\u5b9a\u30a8\u30ea\u30a2\u30fb\u696d\u7a2e\u306e\u5e97\u8217\u60c5\u5831\u3092\u53ce\u96c6\u3002\u6b63\u78ba\u6027\u306e\u9ad8\u3044\u55b6\u696d\u30ea\u30b9\u30c8\u3092\u81ea\u52d5\u751f\u6210\u3057\u307e\u3059\u3002<\/p>\n        <\/div>\n\n        <div class=\"slp-card\">\n          <span class=\"slp-tag tag-growth\">Growth<\/span>\n          <h3 class=\"slp-h3\">\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#f97316\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z\"\/><polyline points=\"14 2 14 8 20 8\"\/><\/svg>\n            SEO\u5b8c\u5168\u5bfe\u5fdcBlog\u81ea\u52d5\u751f\u6210\u30a2\u30d7\u30ea\n          <\/h3>\n          <img decoding=\"async\" src=\"https:\/\/sora1.jp\/islab\/wp-content\/uploads\/2026\/03\/AI-APP-6B.jpeg\" alt=\"SEO Blog Generator UI\" class=\"slp-card-img\" title=\"\u30af\u30ea\u30c3\u30af\u3057\u3066\u62e1\u5927\">\n          <p>\u95a2\u9023\u8cc7\u6599\u3092\u8aad\u307f\u8fbc\u307f\u3001SEO\u306b\u5f37\u3044\u8a18\u4e8b\u69cb\u6210\u304b\u3089\u672c\u6587\u3001\u30a2\u30a4\u30ad\u30e3\u30c3\u30c1\u753b\u50cf\u307e\u3067\u3092\u4e00\u8cab\u751f\u6210\u3002\u30b3\u30f3\u30c6\u30f3\u30c4\u30de\u30fc\u30b1\u30c6\u30a3\u30f3\u30b0\u3092\u81ea\u52d5\u5316\u3002<\/p>\n        <\/div>\n\n        <div class=\"slp-card\">\n          <span class=\"slp-tag tag-growth\">Growth<\/span>\n          <h3 class=\"slp-h3\">\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#3b82f6\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8\"\/><polyline points=\"16 6 12 2 8 6\"\/><line x1=\"12\" x2=\"12\" y1=\"2\" y2=\"15\"\/><\/svg>\n            SNS\u6295\u7a3f\u539f\u7a3f\u81ea\u52d5\u751f\u6210\u30a2\u30d7\u30ea\n          <\/h3>\n          <img decoding=\"async\" src=\"https:\/\/sora1.jp\/islab\/wp-content\/uploads\/2026\/01\/AI-APP-1.jpeg\" alt=\"BizTweet AI UI\" class=\"slp-card-img\" title=\"\u30af\u30ea\u30c3\u30af\u3057\u3066\u62e1\u5927\">\n          <p>\u30c8\u30ec\u30f3\u30c9\u3084\u30c8\u30d4\u30c3\u30af\u306b\u5408\u308f\u305b\u3066\u3001SNS\u6295\u7a3f\u6587\u3068\u753b\u50cf\u3092\u81ea\u52d5\u751f\u6210\u3002\u65e5\u3005\u306e\u904b\u7528\u8ca0\u8377\u3092\u8efd\u6e1b\u3057\u3001\u30a8\u30f3\u30b2\u30fc\u30b8\u30e1\u30f3\u30c8\u3092\u9ad8\u3081\u307e\u3059\u3002<\/p>\n        <\/div>\n\n        <div class=\"slp-card\">\n          <span class=\"slp-tag tag-analysis\">Analysis<\/span>\n          <h3 class=\"slp-h3\">\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#0891b2\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"18\" y1=\"20\" x2=\"18\" y2=\"10\"><\/line><line x1=\"12\" y1=\"20\" x2=\"12\" y2=\"4\"><\/line><line x1=\"6\" y1=\"20\" x2=\"6\" y2=\"14\"><\/line><\/svg>\n            Morning Insights\n          <\/h3>\n          <img decoding=\"async\" src=\"https:\/\/sora1.jp\/islab\/wp-content\/uploads\/2026\/01\/AI-APP-4.jpeg\" alt=\"Morning Insights UI\" class=\"slp-card-img\" title=\"\u30af\u30ea\u30c3\u30af\u3057\u3066\u62e1\u5927\">\n          <p>GA4\u30a2\u30af\u30bb\u30b9\u89e3\u6790\u30c7\u30fc\u30bf\u3068\u9023\u643a\u3057\u3001\u6bce\u671d\u306e\u6226\u7565\u7684\u30a2\u30c9\u30d0\u30a4\u30b9\u3092\u300c\u97f3\u58f0\u300d\u3067\u30d6\u30ea\u30fc\u30d5\u30a3\u30f3\u30b0\u3059\u308bAI\u30a2\u30ca\u30ea\u30b9\u30c8\u3002<\/p>\n        <\/div>\n\n        <div class=\"slp-card\">\n          <span class=\"slp-tag tag-research\">Research<\/span>\n          <h3 class=\"slp-h3\">\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#c2410c\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle><line x1=\"2\" y1=\"12\" x2=\"22\" y2=\"12\"><\/line><path d=\"M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z\"><\/path><\/svg>\n            \u30c8\u30ec\u30f3\u30c9\u30ec\u30dd\u30fc\u30bf\u30fc\uff06\u30e1\u30eb\u30de\u30ac\u4f5c\u6210\u30a2\u30d7\u30ea\n          <\/h3>\n          <img decoding=\"async\" src=\"https:\/\/sora1.jp\/islab\/wp-content\/uploads\/2026\/01\/AI-APP-3.jpeg\" alt=\"Trend Reporter UI\" class=\"slp-card-img\" title=\"\u30af\u30ea\u30c3\u30af\u3057\u3066\u62e1\u5927\">\n          <p>\u30ad\u30fc\u30ef\u30fc\u30c9\u306b\u95a2\u9023\u3059\u308b\u6700\u65b0\u30cb\u30e5\u30fc\u30b9\u3092\u81ea\u52d5\u53ce\u96c6\u3057\u3001\u9031\u520a\u30ec\u30dd\u30fc\u30c8\u3068\u30e1\u30eb\u30de\u30ac\u30c9\u30e9\u30d5\u30c8\u3092\u30ef\u30f3\u30af\u30ea\u30c3\u30af\u3067\u751f\u6210\u3057\u307e\u3059\u3002<\/p>\n        <\/div>\n\n        <div class=\"slp-card\">\n          <span class=\"slp-tag tag-video\">Video<\/span>\n          <h3 class=\"slp-h3\">\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#a21caf\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polygon points=\"23 7 16 12 23 17 23 7\"><\/polygon><rect x=\"1\" y=\"5\" width=\"15\" height=\"14\" rx=\"2\" ry=\"2\"><\/rect><\/svg>\n            \u52d5\u753b\u30de\u30cb\u30e5\u30a2\u30eb\u81ea\u52d5\u751f\u6210\u30a2\u30d7\u30ea\n          <\/h3>\n          <img decoding=\"async\" src=\"https:\/\/sora1.jp\/islab\/wp-content\/uploads\/2026\/01\/AI-APP-6.jpeg\" alt=\"Auto Narrator UI\" class=\"slp-card-img\" title=\"\u30af\u30ea\u30c3\u30af\u3057\u3066\u62e1\u5927\">\n          <p>\u88fd\u54c1\u306e\u64cd\u4f5c\u753b\u9762\u306a\u3069\u306e\u52d5\u753b\u30d5\u30a1\u30a4\u30eb\u3092\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9\u3059\u308b\u3060\u3051\u3067\u3001AI\u304c\u8996\u899a\u60c5\u5831\u3092\u89e3\u6790\u3057\u3001\u30ca\u30ec\u30fc\u30b7\u30e7\u30f3\u539f\u7a3f\u3092\u81ea\u52d5\u751f\u6210\u3002<\/p>\n        <\/div>\n\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"slp-section bg-white\">\n    <div class=\"slp-container\" style=\"text-align: center;\">\n      <h2 class=\"slp-h2\">Technology Stack<\/h2>\n      <div style=\"display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; color: #64748b;\">\n        <span style=\"border: 1px solid #e2e8f0; padding: 10px 20px; border-radius: 8px;\">Gemini 2.5 Pro<\/span>\n        <span style=\"border: 1px solid #e2e8f0; padding: 10px 20px; border-radius: 8px;\">Gemini 2.5 Flash<\/span>\n        <span style=\"border: 1px solid #e2e8f0; padding: 10px 20px; border-radius: 8px;\">GPT-4o<\/span>\n        <span style=\"border: 1px solid #e2e8f0; padding: 10px 20px; border-radius: 8px;\">Claude 3.5 Sonnet<\/span>\n        <span style=\"border: 1px solid #e2e8f0; padding: 10px 20px; border-radius: 8px;\">Imagen 3<\/span>\n        <span style=\"border: 1px solid #e2e8f0; padding: 10px 20px; border-radius: 8px;\">Search Grounding<\/span>\n        <span style=\"border: 1px solid #e2e8f0; padding: 10px 20px; border-radius: 8px;\">React \/ SPA<\/span>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"slp-section bg-gray alignfull\">\n    <div class=\"slp-container\">\n      <div class=\"slp-flow-wrapper\">\n        <h2 class=\"slp-flow-title\">App Development Flow<\/h2>\n        <p class=\"slp-flow-description\">\n          \u30ea\u30b9\u30c8\u4f5c\u6210\u304b\u3089\u3001LP\u5236\u4f5c\u3001\u30d6\u30ed\u30b0\u96c6\u5ba2\u3001SNS\u62e1\u6563\u3001\u30e1\u30eb\u30de\u30ac\u914d\u4fe1\u307e\u3067\u3002<br>\n          ISLab\u304c\u63d0\u6848\u3059\u308b\u3001\u6b21\u4e16\u4ee3\u306e\u7d71\u5408\u578bAI\u30ef\u30fc\u30af\u30d5\u30ed\u30fc\n        <\/p>\n        \n        <div class=\"slp-flow-container\">\n          \n          <div class=\"slp-flow-step\">\n            <div class=\"slp-flow-icon-box\">\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"><\/path><polyline points=\"14 2 14 8 20 8\"><\/polyline><line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"><\/line><line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"><\/line><polyline points=\"10 9 9 9 8 9\"><\/polyline><\/svg>\n            <\/div>\n            <div>\n              <div class=\"slp-flow-step-title\">1. \u4f01\u753b\u30fb\u8981\u4ef6\u5b9a\u7fa9<\/div>\n              <div class=\"slp-flow-step-desc\">AI\u304c\u5e02\u5834\u8abf\u67fb\u3068\u30a2\u30a4\u30c7\u30a2\u51fa\u3057\u3092\u30b5\u30dd\u30fc\u30c8<\/div>\n            <\/div>\n          <\/div>\n\n          <div class=\"slp-flow-step\">\n            <div class=\"slp-flow-icon-box\">\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle><path d=\"M14.31 8l5.74 9.94M9.69 8h11.48M7.38 12l5.74-9.94M9.69 16L3.95 6.06M14.31 16H2.83M16.62 12l-5.74 9.94\"><\/path><\/svg>\n            <\/div>\n            <div>\n              <div class=\"slp-flow-step-title\">2. \u30c7\u30b6\u30a4\u30f3<\/div>\n              <div class=\"slp-flow-step-desc\">UI\/UX\u3092\u81ea\u52d5\u751f\u6210\u30fb\u6700\u9069\u5316<\/div>\n            <\/div>\n          <\/div>\n\n          <div class=\"slp-flow-step\">\n            <div class=\"slp-flow-icon-box\">\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><polyline points=\"16 18 22 12 16 6\"><\/polyline><polyline points=\"8 6 2 12 8 18\"><\/polyline><\/svg>\n            <\/div>\n            <div>\n              <div class=\"slp-flow-step-title\">3. \u958b\u767a\u30fb\u5b9f\u88c5<\/div>\n              <div class=\"slp-flow-step-desc\">\u30b3\u30fc\u30c7\u30a3\u30f3\u30b0\u3092AI\u304c\u9ad8\u901f\u5316<\/div>\n            <\/div>\n          <\/div>\n\n          <div class=\"slp-flow-step\">\n            <div class=\"slp-flow-icon-box\">\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M22 11.08V12a10 10 0 1 1-5.93-9.14\"><\/path><polyline points=\"22 4 12 14.01 9 11.01\"><\/polyline><\/svg>\n            <\/div>\n            <div>\n              <div class=\"slp-flow-step-title\">4. \u30c6\u30b9\u30c8\u30fb\u691c\u8a3c<\/div>\n              <div class=\"slp-flow-step-desc\">\u54c1\u8cea\u30c1\u30a7\u30c3\u30af\u3068\u6539\u5584\u63d0\u6848<\/div>\n            <\/div>\n          <\/div>\n\n          <div class=\"slp-flow-step\">\n            <div class=\"slp-flow-icon-box\">\n              <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5\"><\/path><\/svg>\n            <\/div>\n            <div>\n              <div class=\"slp-flow-step-title\">5. \u30ea\u30ea\u30fc\u30b9<\/div>\n              <div class=\"slp-flow-step-desc\">\u8fc5\u901f\u306a\u30c7\u30d7\u30ed\u30a4\u3068\u904b\u7528\u958b\u59cb<\/div>\n            <\/div>\n          <\/div>\n\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"slp-bottom-cta\">\n    <div class=\"slp-container\">\n      <h2 class=\"slp-bottom-cta-title\">\u307e\u305a\u306f\u7121\u6599\u3067\u4f53\u9a13\u3057\u3066\u307f\u307e\u305b\u3093\u304b\uff1f<\/h2>\n      <p class=\"slp-bottom-cta-desc\">\u5b9f\u969b\u306e\u753b\u9762\u3092\u3054\u89a7\u3044\u305f\u3060\u3051\u308b\u30c7\u30e2\u3084\u3001\u8a73\u7d30\u306a\u8cc7\u6599\u3092\u3054\u7528\u610f\u3057\u3066\u304a\u308a\u307e\u3059\u3002<\/p>\n      <a href=\"https:\/\/sora1.jp\/islab\/contact\/\" class=\"btn-cta-premium\" aria-label=\"\u8cc7\u6599\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3068\u7121\u6599\u30c7\u30e2\u3092\u7533\u3057\u8fbc\u3080\">\n        \u8cc7\u6599\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\uff06\u7121\u6599\u30c7\u30e2\n        <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M5 12h14\"><\/path><path d=\"m12 5 7 7-7 7\"><\/path><\/svg>\n      <\/a>\n    <\/div>\n  <\/section>\n\n<\/div>\n\n<script>\n  document.addEventListener('DOMContentLoaded', function() {\n    \/\/ Lightbox Logic\n    const lightbox = document.createElement('div');\n    lightbox.className = 'slp-lightbox';\n    lightbox.innerHTML = '<img decoding=\"async\" src=\"\" alt=\"Enlarged Image\" \/>';\n    document.body.appendChild(lightbox);\n\n    const lightboxImg = lightbox.querySelector('img');\n\n    const images = document.querySelectorAll('.slp-card-img');\n    images.forEach(img => {\n      img.addEventListener('click', (e) => {\n        e.stopPropagation();\n        const src = img.getAttribute('src');\n        if (src) {\n          lightboxImg.setAttribute('src', src);\n          lightbox.classList.add('active');\n          document.body.style.overflow = 'hidden';\n        }\n      });\n    });\n\n    lightbox.addEventListener('click', () => {\n      lightbox.classList.remove('active');\n      document.body.style.overflow = '';\n    });\n  });\n<\/script>\n<\/div><\/div>\n\n\n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"content-type":"","swell_btn_cv_data":"","footnotes":""},"class_list":["post-2025","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/sora1.jp\/islab\/wp-json\/wp\/v2\/pages\/2025","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sora1.jp\/islab\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sora1.jp\/islab\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sora1.jp\/islab\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sora1.jp\/islab\/wp-json\/wp\/v2\/comments?post=2025"}],"version-history":[{"count":16,"href":"https:\/\/sora1.jp\/islab\/wp-json\/wp\/v2\/pages\/2025\/revisions"}],"predecessor-version":[{"id":2239,"href":"https:\/\/sora1.jp\/islab\/wp-json\/wp\/v2\/pages\/2025\/revisions\/2239"}],"wp:attachment":[{"href":"https:\/\/sora1.jp\/islab\/wp-json\/wp\/v2\/media?parent=2025"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}