RickCogley · April 21, 2025 01:47
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html lang="en"><head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Home - eSolia Pro Blog</title>

    <meta name="supported-color-schemes" content="light dark">
    <meta name="theme-color" content="hsl(33.38 100% 70%)" media="(prefers-color-scheme: light)">
    <meta name="theme-color" content="hsl(237.79 38% 28.000000000000004%)" media="(prefers-color-scheme: dark)">

    <link rel="stylesheet" href="/pagefind/pagefind-ui.css"><link rel="stylesheet" href="/styles.css?cb=1745196394893" type="text/css">
    <link rel="alternate" href="/feed.xml" type="application/atom+xml" title="eSolia Pro Blog">
    <link rel="alternate" href="/feed.json" type="application/json" title="eSolia Pro Blog">
    <link rel="canonical" href="http://localhost:3000/en/">
    <script src="/js/main.js?cb=1745196394893" type="module" defer=""></script>

    <!-- Splide CSS -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@splidejs/splide@latest/dist/css/splide.min.css">

    <!-- Splide JS -->
    <script src="https://cdn.jsdelivr.net/npm/@splidejs/splide@latest/dist/js/splide.min.js"></script>

    <link rel="manifest" href="/manifest.json" crossorigin="use-credentials">
    
  <meta property="og:type" content="website">
 <meta property="og:site_name" content="eSolia Pro Blog">
 <meta property="og:locale" content="en">
 <meta property="og:title" content="Home">
 <meta property="og:description" content="Blog page from eSolia Inc., Tokyo, Japan">
 <meta property="og:url" content="http://localhost:3000/en/">
 <meta property="og:image" content="http://localhost:3000/assets/blog-esolia-pro-default.png">
 <meta name="twitter:card" content="summary_large_image">
 <meta name="twitter:site" content="@esolia_inc">
 <meta name="fediverse:creator" content="@[email protected]">
 <meta name="description" content="Blog page from eSolia Inc., Tokyo, Japan">
 <meta name="keywords" content="eSolia, blog, weblog, pro, professional, tokyo it service, japan, english">
 <meta name="robots" content="index, follow">
 <meta name="generator" content="Lume 2f3d7c6b9aa9a1856d7f62cc3ee62ad8a4495a39">
 <meta name="twitter:label1" content="Written by">
 <meta name="twitter:data1" content="Team eSolia">
 <meta name="twitter:label2" content="Reading Time">
 <meta name="twitter:data2" content="2 min">
 <script type="text/javascript" src="/pagefind/pagefind-ui.js"></script><script type="text/javascript">window.addEventListener('DOMContentLoaded',()=>{new PagefindUI({"element":"#search","showImages":false,"excerptLength":0,"showEmptyFilters":true,"showSubResults":false,"resetStyles":true,"bundlePath":"/pagefind/","baseUrl":"/"});});</script><link rel="icon" sizes="48x48" href="/favicon.ico">
 <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
 <link rel="icon" sizes="192x192" href="/android-chrome-192x192.png">
 <link rel="icon" sizes="512x512" href="/android-chrome-512x512.png">
 <link rel="icon" sizes="16x16" href="/favicon-16x16.png">
 <link rel="icon" sizes="32x32" href="/favicon-32x32.png">
 <link rel="icon" sizes="any" href="/favicon.svg" type="image/svg+xml">
 <link rel="alternate" hreflang="ja" href="http://localhost:3000/">
 <link rel="alternate" hreflang="en" href="http://localhost:3000/en/">
 </head>
  <body class="flex h-full bg-zinc-50 dark:bg-black">
    <!-- Container start -->
    <div class="flex w-full">
      <div class="fixed inset-0 flex justify-center sm:px-8">
        <div class="flex w-full max-w-7xl lg:px-8">
          <div class="w-full bg-white ring-1 ring-zinc-100 dark:bg-zinc-900 dark:ring-zinc-300/20">
          </div>
        </div>
      </div>
      <div class="relative flex w-full flex-col">
        <!-- ===== top-nav.vto TEMPLATE START ===== -->
 <header class="pointer-events-none relative z-50 flex flex-none flex-col">
  <div class="order-last mt-[calc(--spacing(16)-(--spacing(3)))]"></div>
  <div class="top-0 order-last -mb-3 pt-3 sm:px-8">
    <div class="mx-auto w-full max-w-7xl lg:px-8">
      <div class="relative px-4 sm:px-8 lg:px-12">
        <div class="mx-auto max-w-2xl lg:max-w-5xl">
          <div class="top-(--avatar-top,--spacing(3)) w-full">
            <div class="relative mt-20">
              <a aria-label="Return to Site Top" type="button" class="pointer-events-auto block origin-left" href="/en/"><img id="large-logo" alt="eSolia full size logo linking to site top" loading="lazy" fetchpriority="high" decoding="async" class="-ml-4 w-64 object-cover dark:grayscale dark:invert dark:saturate-[.1] transition-opacity duration-300" src="/assets/logo_horiz_darkblue_bgtransparent_2.svg"></a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div id="top-nav-bg" class="fixed top-0 z-10 h-24 pt-6 w-full bg-zinc-50/50 dark:bg-zinc-700/50 transition-all duration-700 shadow-xs">
    <div class="top-(--header-top,--spacing(6)) w-full sm:px-8 fixed">
      <div class="mx-auto w-full max-w-7xl lg:px-8">
        <div class="relative px-4 sm:px-8 lg:px-12">
          <div class="mx-auto max-w-2xl lg:max-w-5xl">
            <div class="relative flex gap-4 items-center">
              <div class="flex flex-1 items-center">
                <a aria-label="Return to Site Top" class="pointer-events-auto block origin-left" href="/en/" type="button"><img id="small-logo" alt="eSolia symbol-type logo linking to site top" loading="lazy" fetchpriority="high" decoding="async" class="w-12 object-cover rounded-md bg-white/90 dark:bg-white/10 dark:grayscale dark:invert dark:saturate-[.1] opacity-0 transition-opacity duration-300" src="/assets/symbol_darkblue_bgtransparent_2.svg"></a>
              </div>
              <div class="flex flex-1 justify-end md:justify-center">
                <div class="pointer-events-auto md:hidden relative">
                  <button aria-label="Toggle menu" class="group flex items-center rounded-full bg-white/90 px-4 py-2 text-sm font-medium text-zinc-800 ring-1 shadow-lg shadow-zinc-800/5 ring-zinc-900/5 backdrop-blur-sm dark:bg-zinc-800/90 dark:text-zinc-200 dark:ring-white/10 dark:hover:ring-white/20" type="button" x-data="" @click="$dispatch('toggle-menu')">
                    <span>Menu</span>
                    <svg viewbox="0 0 8 6" aria-hidden="true" class="ml-3 h-auto w-2 stroke-zinc-500 group-hover:stroke-zinc-700 dark:group-hover:stroke-zinc-400">
                      <path d="M1.75 1.75 4 4.25l2.25-2.5" fill="none" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
                      </path>
                    </svg>
                  </button>
                </div>
                <div hidden="" style="position: fixed; top: 1px; left: 1px; width: 1px; height: 0; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; display: none">
                </div>
                <nav class="pointer-events-auto hidden md:block">
                  <ul class="flex rounded-full bg-esoliaamber-500/90 px-3 text-sm font-medium ring-1 shadow-lg shadow-zinc-800/5 ring-zinc-900/5 backdrop-blur-sm dark:bg-zinc-800/90 dark:ring-white/10 divide-x-1 divide-zinc-50/50 dark:divide-zinc-200/50" role="menubar" aria-label="Navigation menu links">                      <li>
                        <a class="relative block whitespace-nowrap px-3 py-2 transition text-zinc-50 dark:text-zinc-200 hover:text-sky-400 dark:hover:text-sky-500" href="/en/archive" target="_self" aria-label="Site internal link" title="Link to the Archive page">Archive
                          <span class="sr-only">(Site internal link)</span></a>
                      </li>
                      <li>
                        <a class="relative block whitespace-nowrap px-3 py-2 transition text-zinc-50 dark:text-zinc-200 hover:text-sky-400 dark:hover:text-sky-500" href="https://esolia.com" target="_blank" aria-label="External link" title="Link to eSolia Inc. website">eSolia Inc.
                          <span class="sr-only">(External link)</span></a>
                      </li>
 </ul>
                </nav>

                <nav class="pointer-events-auto md:hidden" x-data="{ open: false, zIndex: 0 }">
                  <button type="button" class="mobile-menu-btn text-xl" x-on:click="open=!open; zIndex = open ? 100 : 0" x-on:toggle-menu.window="open = !open; zIndex = open ? 100 : 0" x-show="open" x-cloak="">
                    <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-12 w-12 fill-esoliaamber-400 dark:fill-esoliaamber-300"><path d="M205.66,194.34a8,8,0,0,1-11.32,11.32L128,139.31,61.66,205.66a8,8,0,0,1-11.32-11.32L116.69,128,50.34,61.66A8,8,0,0,1,61.66,50.34L128,116.69l66.34-66.35a8,8,0,0,1,11.32,11.32L139.31,128Z"></path></svg>
                  </button>
                  <div class="mobile-menu" x-bind:class="{'is-active' : open }" :style="{ zIndex: zIndex }">                      <div class="mobile-menu__item space-y-4">
                        <a class="text-white hover:text-sky-400 text-5xl inline-block" href="/en/archive" aria-label="Site internal link" title="Link to the Archive page"><span class="text-white font-thin">ARCHIVE</span>
                          <span class="sr-only">(Site internal link)</span>
                        </a>
                      </div>
                      <div class="mobile-menu__item space-y-4">
                        <a class="text-white hover:text-sky-400 text-5xl inline-block" href="https://esolia.com" aria-label="External link" title="Link to eSolia Inc. website"><span class="text-white font-thin">ESOLIA INC.</span>
                          <span class="sr-only">(External link)</span>
                        </a>
                      </div>
 </div>
                </nav>
              </div>
              <div class="flex justify-end md:flex-1 z-50 space-x-1">
                  <div class="pointer-events-auto z-50">
                    <button type="button" aria-label="Toggle language" class="group rounded-full bg-esoliaamber-500/90 px-3 py-2 ring-1 shadow-lg shadow-zinc-800/5 ring-zinc-900/5 backdrop-blur-sm transition dark:bg-zinc-800/90 dark:ring-white/10 dark:hover:ring-white/20 z-50 text-sm font-medium dark:group-hover:text-zinc-100">                          <a class="text-zinc-50 dark:text-zinc-200 hover:text-sky-400 dark:hover:text-sky-500" href="/" title="ホーム">
 日本語                          </a>
                    </button>
                  </div>
                <div class="pointer-events-auto z-50">
                  <button type="button" id="search-button" aria-label="Popup Search" class="group rounded-full bg-white/90 px-3 py-2 ring-1 shadow-lg shadow-zinc-800/5 ring-zinc-900/5 backdrop-blur-sm transition dark:bg-zinc-800/90 dark:ring-white/10 dark:hover:ring-white/20 z-50">
                    <span>
                      <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-5 w-5 fill-esoliaamber-500 stroke-esoliaamber-800 transition group-hover:fill-esoliaamber-600 group-hover:stroke-esoliaamber-900 hover:scale-110"><path d="M192,112a80,80,0,1,1-80-80A80,80,0,0,1,192,112Z" opacity="0.2"></path><path d="M229.66,218.34,179.6,168.28a88.21,88.21,0,1,0-11.32,11.31l50.06,50.07a8,8,0,0,0,11.32-11.32ZM40,112a72,72,0,1,1,72,72A72.08,72.08,0,0,1,40,112Z"></path></svg>
                    </span>
                  </button>
                </div>
                <div class="pointer-events-auto z-50" x-data="themeToggle" :class="{ 'dark': darkMode }">
                  <button type="button" aria-label="Toggle theme" class="group rounded-full bg-white/90 px-3 py-2 ring-1 shadow-lg shadow-zinc-800/5 ring-zinc-900/5 backdrop-blur-sm transition dark:bg-zinc-800/90 dark:ring-white/10 dark:hover:ring-white/20 z-50" @click="darkMode = !darkMode">
                    <span x-show="!darkMode">
                      <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-5 w-5 fill-esoliaamber-500 stroke-esoliaamber-800 transition group-hover:fill-esoliaamber-600 group-hover:stroke-esoliaamber-900 hover:scale-110"><path d="M184,128a56,56,0,1,1-56-56A56,56,0,0,1,184,128Z" opacity="0.2"></path><path d="M120,40V16a8,8,0,0,1,16,0V40a8,8,0,0,1-16,0Zm72,88a64,64,0,1,1-64-64A64.07,64.07,0,0,1,192,128Zm-16,0a48,48,0,1,0-48,48A48.05,48.05,0,0,0,176,128ZM58.34,69.66A8,8,0,0,0,69.66,58.34l-16-16A8,8,0,0,0,42.34,53.66Zm0,116.68-16,16a8,8,0,0,0,11.32,11.32l16-16a8,8,0,0,0-11.32-11.32ZM192,72a8,8,0,0,0,5.66-2.34l16-16a8,8,0,0,0-11.32-11.32l-16,16A8,8,0,0,0,192,72Zm5.66,114.34a8,8,0,0,0-11.32,11.32l16,16a8,8,0,0,0,11.32-11.32ZM48,128a8,8,0,0,0-8-8H16a8,8,0,0,0,0,16H40A8,8,0,0,0,48,128Zm80,80a8,8,0,0,0-8,8v24a8,8,0,0,0,16,0V216A8,8,0,0,0,128,208Zm112-88H216a8,8,0,0,0,0,16h24a8,8,0,0,0,0-16Z"></path></svg>
                    </span>
                    <span x-show="darkMode">
                      <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-5 w-5 fill-sky-300 stroke-sky-500 transition group-hover:fill-sky-400 group-hover:stroke-sky-700 hover:scale-110"><path d="M210.69,158.18A88,88,0,1,1,97.82,45.31,96.08,96.08,0,0,0,192,160,96.78,96.78,0,0,0,210.69,158.18Z" opacity="0.2"></path><path d="M240,96a8,8,0,0,1-8,8H216v16a8,8,0,0,1-16,0V104H184a8,8,0,0,1,0-16h16V72a8,8,0,0,1,16,0V88h16A8,8,0,0,1,240,96ZM144,56h8v8a8,8,0,0,0,16,0V56h8a8,8,0,0,0,0-16h-8V32a8,8,0,0,0-16,0v8h-8a8,8,0,0,0,0,16Zm72.77,97a8,8,0,0,1,1.43,8A96,96,0,1,1,95.07,37.8a8,8,0,0,1,10.6,9.06A88.07,88.07,0,0,0,209.14,150.33,8,8,0,0,1,216.77,153Zm-19.39,14.88c-1.79.09-3.59.14-5.38.14A104.11,104.11,0,0,1,88,64c0-1.79,0-3.59.14-5.38A80,80,0,1,0,197.38,167.86Z"></path></svg>
                    </span>
                  </button>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
 </header>
 <!-- ===== top-nav.vto TEMPLATE END ===== -->

        <div class="flex-none" style="height: var(--content-offset)"></div>

        <!-- ===== index.vto LAYOUT START ===== -->
 <main class="flex-auto">
  <!-- ===== top-welcome-header.vto TEMPLATE START ===== -->
 <div class="mt-9 sm:px-8">
  <div class="mx-auto w-full max-w-7xl lg:px-8">
    <div class="relative px-4 sm:px-8 lg:px-12">
      <div class="mx-auto max-w-2xl lg:max-w-5xl">
        <div class="max-w-2xl">
          <h1 class="text-4xl tracking-tight text-zinc-800 sm:text-5xl dark:text-zinc-100">
            <span class="font-light">IT Tips Blog</span>
          </h1>
          <p class="mt-6 text-base text-zinc-600 dark:text-zinc-400">
            What kind of blog is this? This is this kind of blog... We're eSolia, your virtual Japan IT department. Join us for some articles and tips from our bilingual professionals, then leverage our experience for your success in Japan.
          </p>
          <div class="mt-6 flex gap-6">
            <a class="group -m-1 p-1" aria-label="Follow on LinkedIn" href="https://www.linkedin.com/company/esolia" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-6 w-6 fill-sky-800 dark:fill-sky-600 transition hover:scale-110"><path d="M224,40V216a8,8,0,0,1-8,8H40a8,8,0,0,1-8-8V40a8,8,0,0,1,8-8H216A8,8,0,0,1,224,40Z" opacity="0.2"></path><path d="M216,24H40A16,16,0,0,0,24,40V216a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V40A16,16,0,0,0,216,24Zm0,192H40V40H216V216ZM96,112v64a8,8,0,0,1-16,0V112a8,8,0,0,1,16,0Zm88,28v36a8,8,0,0,1-16,0V140a20,20,0,0,0-40,0v36a8,8,0,0,1-16,0V112a8,8,0,0,1,15.79-1.78A36,36,0,0,1,184,140ZM100,84A12,12,0,1,1,88,72,12,12,0,0,1,100,84Z"></path></svg></a>
            <a class="group -m-1 p-1" aria-label="Follow on Bluesky" href="https://bsky.app/profile/esolia.com" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-6 w-6 fill-sky-400 dark:fill-sky-300 transition hover:scale-110"><path d="M225.12,119.71c-7.86,30.94-29.31,32.71-37.36,32.23h-1A36,36,0,1,1,128,180a36,36,0,1,1-58.72-28.06h-1c-8,.48-29.5-1.29-37.36-32.23C22.79,87.84,15.78,48,47.07,48S128,95.8,128,127.67C128,95.8,177.64,48,208.93,48S233.21,87.84,225.12,119.71Z" opacity="0.2"></path><path d="M232.7,50.48C229,45.7,221.84,40,209,40c-16.85,0-38.46,11.28-57.81,30.16A140.07,140.07,0,0,0,136,87.53V56a8,8,0,0,0-16,0V87.53a140.07,140.07,0,0,0-15.15-17.37C85.49,51.28,63.88,40,47,40,34.16,40,27,45.7,23.3,50.48c-6.82,8.77-12.18,24.08-.21,71.2,6.05,23.83,19.51,33,30.63,36.42A44,44,0,0,0,128,205.27a44,44,0,0,0,74.28-47.17c11.12-3.4,24.57-12.59,30.63-36.42C239.63,95.24,244.85,66.1,232.7,50.48ZM92,208A28.12,28.12,0,0,1,88.86,152a8,8,0,1,0-1.76-15.9A43.64,43.64,0,0,0,66.36,144c-8.43.09-22-3.57-27.76-26.26C35.72,106.39,27,71.86,35.94,60.3,37.37,58.46,40.09,56,47,56c27.27,0,73,44.88,73,71.67V180A28,28,0,0,1,92,208ZM217.4,117.74c-5.77,22.69-19.33,26.34-27.77,26.26a43.6,43.6,0,0,0-20.74-7.95,8,8,0,1,0-1.76,15.9A28.11,28.11,0,1,1,136,180V127.67C136,100.88,181.69,56,209,56c6.95,0,9.66,2.46,11.1,4.3C229.05,71.86,220.28,106.39,217.4,117.74Z"></path></svg></a>
            <a class="group -m-1 p-1" aria-label="Follow on X Twitter" href="https://x.com/esolia_inc" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-6 w-6 fill-black-600 dark:fill-zinc-50 transition hover:scale-110"><path d="M208,216H160L48,40H96Z" opacity="0.2"></path><path d="M214.75,211.71l-62.6-98.38,61.77-67.95a8,8,0,0,0-11.84-10.76L143.24,99.34,102.75,35.71A8,8,0,0,0,96,32H48a8,8,0,0,0-6.75,12.3l62.6,98.37-61.77,68a8,8,0,1,0,11.84,10.76l58.84-64.72,40.49,63.63A8,8,0,0,0,160,224h48a8,8,0,0,0,6.75-12.29ZM164.39,208,62.57,48h29L193.43,208Z"></path></svg></a>
            <a class="group -m-1 p-1" aria-label="GitHub profile" href="https://github.com/esolia" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-6 w-6 fill-green-600 dark:fill-green-500 transition hover:scale-110"><path d="M208,104v8a48,48,0,0,1-48,48H136a32,32,0,0,1,32,32v40H104V192a32,32,0,0,1,32-32H112a48,48,0,0,1-48-48v-8a49.28,49.28,0,0,1,8.51-27.3A51.92,51.92,0,0,1,76,32a52,52,0,0,1,43.83,24h32.34A52,52,0,0,1,196,32a51.92,51.92,0,0,1,3.49,44.7A49.28,49.28,0,0,1,208,104Z" opacity="0.2"></path><path d="M208.3,75.68A59.74,59.74,0,0,0,202.93,28,8,8,0,0,0,196,24a59.75,59.75,0,0,0-48,24H124A59.75,59.75,0,0,0,76,24a8,8,0,0,0-6.93,4,59.78,59.78,0,0,0-5.38,47.68A58.14,58.14,0,0,0,56,104v8a56.06,56.06,0,0,0,48.44,55.47A39.8,39.8,0,0,0,96,192v8H72a24,24,0,0,1-24-24A40,40,0,0,0,8,136a8,8,0,0,0,0,16,24,24,0,0,1,24,24,40,40,0,0,0,40,40H96v16a8,8,0,0,0,16,0V192a24,24,0,0,1,48,0v40a8,8,0,0,0,16,0V192a39.8,39.8,0,0,0-8.44-24.53A56.06,56.06,0,0,0,216,112v-8A58,58,0,0,0,208.3,75.68ZM200,112a40,40,0,0,1-40,40H112a40,40,0,0,1-40-40v-8a41.74,41.74,0,0,1,6.9-22.48A8,8,0,0,0,80,73.83a43.81,43.81,0,0,1,.79-33.58,43.88,43.88,0,0,1,32.32,20.06A8,8,0,0,0,119.82,64h32.35a8,8,0,0,0,6.74-3.69,43.87,43.87,0,0,1,32.32-20.06A43.81,43.81,0,0,1,192,73.83a8.09,8.09,0,0,0,1,7.65A41.76,41.76,0,0,1,200,104Z"></path></svg></a>
          </div>
        </div>
      </div>
    </div>
  </div>
 </div>
 <!-- ===== top-welcome-header.vto TEMPLATE END ===== -->

  <div class="mt-12 sm:px-8 md:mt-16">
    <div class="mx-auto w-full max-w-7xl lg:px-8">
      <div class="relative px-4 sm:px-8 lg:px-12">
        <div class="mx-auto max-w-2xl lg:max-w-5xl">
          <div class="mx-auto grid max-w-xl grid-cols-1 gap-y-20 lg:max-w-none lg:grid-cols-1">
            <div class="flex flex-col gap-6">
              <!-- ===== top-main-tags1.vto TEMPLATE START ===== -->
 <div class="flex space-x-2 bg-zinc-100 dark:bg-zinc-700 p-2 rounded-md">
    <div class="text-zinc-500 ml-1 mt-2">
      <nav class="">
        <ul class="flex flex-wrap space-x-2 space-y-2">
            <li>
              <a href="/en/category/Troubleshooting/" class="inline-flex items-center rounded-md bg-emerald-50 dark:bg-emerald-200 px-2 py-1 text-xs font-medium text-emerald-600 dark:text-emerald-700 ring-1 ring-emerald-500/10 dark:ring-emerald-500/30 ring-inset hover:bg-emerald-100 no-underline whitespace-nowrap">Troubleshooting</a>
            </li>
            <li>
              <a href="/en/category/Security/" class="inline-flex items-center rounded-md bg-esoliaamber-50 dark:bg-esoliaamber-200 px-2 py-1 text-xs font-medium text-esoliaamber-600 dark:text-esoliaamber-700 ring-1 ring-esoliaamber-500/10 dark:ring-esoliaamber-500/30 ring-inset hover:bg-esoliaamber-100 no-underline whitespace-nowrap">Security</a>
            </li>
            <li>
              <a href="/en/category/Network/" class="inline-flex items-center rounded-md bg-fuchsia-50 dark:bg-fuchsia-200 px-2 py-1 text-xs font-medium text-fuchsia-600 dark:text-fuchsia-700 ring-1 ring-fuchsia-500/10 dark:ring-fuchsia-500/30 ring-inset hover:bg-fuchsia-100 no-underline whitespace-nowrap">Network</a>
            </li>
            <li>
              <a href="/en/category/Microsoft-365/" class="inline-flex items-center rounded-md bg-esoliablue-50 dark:bg-esoliablue-200 px-2 py-1 text-xs font-medium text-esoliablue-600 dark:text-esoliablue-700 ring-1 ring-esoliablue-500/10 dark:ring-esoliablue-500/30 ring-inset hover:bg-esoliablue-100 no-underline whitespace-nowrap">Microsoft-365</a>
            </li>
            <li>
              <a href="/en/category/Cloud/" class="inline-flex items-center rounded-md bg-lime-50 dark:bg-lime-200 px-2 py-1 text-xs font-medium text-lime-600 dark:text-lime-700 ring-1 ring-lime-500/10 dark:ring-lime-500/30 ring-inset hover:bg-lime-100 no-underline whitespace-nowrap">Cloud</a>
            </li>
            <li>
              <a href="/en/category/AI-Usage/" class="inline-flex items-center rounded-md bg-red-50 dark:bg-red-200 px-2 py-1 text-xs font-medium text-red-600 dark:text-red-700 ring-1 ring-red-500/10 dark:ring-red-500/30 ring-inset hover:bg-red-100 no-underline whitespace-nowrap">AI-Usage</a>
            </li>
        </ul>
      </nav>
    </div>
 </div>
 <!-- ===== top-main-tags1.vto TEMPLATE END ===== -->

              <!-- ===== top-post-cards1.vto TEMPLATE START ===== -->
 <div class="mx-auto mt-2 grid max-w-2xl grid-cols-1 gap-x-8 gap-y-20 lg:mx-0 lg:max-w-none lg:grid-cols-3">
    <article class="flex flex-col items-start">
      <div class="relative w-full">
        <div class="absolute inset-0 bg-red-500 opacity-80 rounded-2xl transition-opacity duration-300 mix-blend-color">
        </div>
        <img src="/assets/cat6-bg.jpg" alt="" class="aspect-video w-full rounded-2xl bg-blend-overlay object-cover sm:aspect-2/1 lg:aspect-3/2 transition-opacity duration-300 filter dark:invert mix-blend-normal dark:mix-blend-luminosity" loading="lazy" fetchpriority="high" decoding="async">
        <div class="absolute inset-0 rounded-2xl ring-1 ring-gray-900/10 ring-inset">
        </div>
      </div>
      <div class="max-w-xl">
        <div class="z-10">
          <!-- ===== post-details.vto TEMPLATE START ===== -->
 <div class="mt-8 flex flex-wrap items-center gap-x-4 text-xs">
    <time datetime="Thu Apr 10 2025 14:13:55 GMT+0900 (日本標準時)" class="order-first flex items-center text-zinc-400 dark:text-zinc-300">
      <span class="h-4 w-0.5 rounded-full bg-zinc-200 dark:bg-zinc-400"></span>
      <span class="ml-3">2025-04-10</span>
 <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="size-6 fill-sky-400"><path d="M152,128a24,24,0,1,1-24-24A24,24,0,0,1,152,128Z" opacity="0.2"></path><path d="M128,96a32,32,0,1,0,32,32A32,32,0,0,0,128,96Zm0,48a16,16,0,1,1,16-16A16,16,0,0,1,128,144Z"></path></svg>    </time>
  <a href="/en/category/AI-Usage/" data-pagefind-filter="Filter by Category" class="relative rounded-md bg-red-50 dark:bg-red-200 px-2 py-1 text-xs font-medium text-red-600 dark:text-red-700 ring-1 ring-red-500/10 dark:ring-red-500/30 ring-inset hover:bg-red-100 no-underline">AI-Usage</a>
      <span class="relative px-2 py-1 text-xs font-light text-zinc-400 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-700">by: <a class="no-underline text-zinc-400 dark:text-zinc-300" data-pagefind-filter="Filter by Author" href="/en/author/Yanquan%20Ma/">Yanquan Ma</a></span>
 </div>
 <div class="text-xs/3 text-zinc-500 ml-4 mt-2 flex space-x-2 break-keep">
 </div>
 <!-- ===== post-details.vto TEMPLATE END ===== -->

        </div>
        <div class="group relative">
          <h3 class="mt-3 text-lg/6 font-semibold text-gray-900 group-hover:text-gray-600">
            <a href="/en/posts/20250410-admin-asked-ai-about-the-it-terminology-en/" data-faid="en-202503g-admin-asked-ai" class="data-fatrigger text-zinc-800 hover:text-sky-500 dark:text-zinc-50 dark:hover:text-sky-500">
              <span class="absolute inset-0"></span>
              UTP Cable? Cat Cable? RJ45 Connector? Admin asked AI about the IT terminology that admin is curious about 
            </a>
          </h3>
          <p class="mt-5 line-clamp-3 text-sm/6 text-zinc-600 dark:text-zinc-300">
            How to Use AI to Turn “Kind of Know” into “Truly Understand” — IT terms you often see at work. This time, we’ll share a real example of how AI helped deepen understanding.<br>
          </p>
        </div>
      </div>
    </article>
    <article class="flex flex-col items-start">
      <div class="relative w-full">
        <div class="absolute inset-0 bg-esoliablue-500 opacity-80 rounded-2xl transition-opacity duration-300 mix-blend-color">
        </div>
        <img src="/assets/cat1a-bg.jpg" alt="" class="aspect-video w-full rounded-2xl bg-blend-overlay object-cover sm:aspect-2/1 lg:aspect-3/2 transition-opacity duration-300 filter dark:invert mix-blend-normal dark:mix-blend-luminosity" loading="lazy" fetchpriority="high" decoding="async">
        <div class="absolute inset-0 rounded-2xl ring-1 ring-gray-900/10 ring-inset">
        </div>
      </div>
      <div class="max-w-xl">
        <div class="z-10">
          <!-- ===== post-details.vto TEMPLATE START ===== -->
 <div class="mt-8 flex flex-wrap items-center gap-x-4 text-xs">
    <time datetime="Thu Apr 10 2025 10:21:00 GMT+0900 (日本標準時)" class="order-first flex items-center text-zinc-400 dark:text-zinc-300">
      <span class="h-4 w-0.5 rounded-full bg-zinc-200 dark:bg-zinc-400"></span>
      <span class="ml-3">2025-04-10</span>
 <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="size-6 fill-sky-400"><path d="M152,128a24,24,0,1,1-24-24A24,24,0,0,1,152,128Z" opacity="0.2"></path><path d="M128,96a32,32,0,1,0,32,32A32,32,0,0,0,128,96Zm0,48a16,16,0,1,1,16-16A16,16,0,0,1,128,144Z"></path></svg>    </time>
  <a href="/en/category/Microsoft-365/" data-pagefind-filter="Filter by Category" class="relative rounded-md bg-esoliablue-50 dark:bg-esoliablue-200 px-2 py-1 text-xs font-medium text-esoliablue-600 dark:text-esoliablue-700 ring-1 ring-esoliablue-500/10 dark:ring-esoliablue-500/30 ring-inset hover:bg-esoliablue-100 no-underline">Microsoft-365</a>
      <span class="relative px-2 py-1 text-xs font-light text-zinc-400 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-700">by: <a class="no-underline text-zinc-400 dark:text-zinc-300" data-pagefind-filter="Filter by Author" href="/en/author/Ena%20Ishikawa/">Ena Ishikawa</a></span>
 </div>
 <div class="text-xs/3 text-zinc-500 ml-4 mt-2 flex space-x-2 break-keep">
 </div>
 <!-- ===== post-details.vto TEMPLATE END ===== -->

        </div>
        <div class="group relative">
          <h3 class="mt-3 text-lg/6 font-semibold text-gray-900 group-hover:text-gray-600">
            <a href="/en/posts/20250402-sharepoint-online-post-migration-problem-causes-solutions-en/" data-faid="en-202503b-sharepoint-migration-part1" class="data-fatrigger text-zinc-800 hover:text-sky-500 dark:text-zinc-50 dark:hover:text-sky-500">
              <span class="absolute inset-0"></span>
              Unable to Open Files After Migrating to SharePoint Online? Comprehensive Guide to Causes and Solutions!
            </a>
          </h3>
          <p class="mt-5 line-clamp-3 text-sm/6 text-zinc-600 dark:text-zinc-300">
            Are you facing issues where files won’t open <strong>after migrating to SharePoint Online?</strong> In this article, we explain the differences in SPO’s folder structure, URL limitations, access management, and <em>give some practical troubleshooting solutions</em>. We also provide a detailed guide on metadata management to enhance searchability!<br>
 <br>
          </p>
        </div>
      </div>
    </article>
    <article class="flex flex-col items-start">
      <div class="relative w-full">
        <div class="absolute inset-0 bg-emerald-500 opacity-80 rounded-2xl transition-opacity duration-300 mix-blend-color">
        </div>
        <img src="/assets/cat5-bg.jpg" alt="" class="aspect-video w-full rounded-2xl bg-blend-overlay object-cover sm:aspect-2/1 lg:aspect-3/2 transition-opacity duration-300 filter dark:invert mix-blend-normal dark:mix-blend-luminosity" loading="lazy" fetchpriority="high" decoding="async">
        <div class="absolute inset-0 rounded-2xl ring-1 ring-gray-900/10 ring-inset">
        </div>
      </div>
      <div class="max-w-xl">
        <div class="z-10">
          <!-- ===== post-details.vto TEMPLATE START ===== -->
 <div class="mt-8 flex flex-wrap items-center gap-x-4 text-xs">
    <time datetime="Thu Apr 10 2025 10:04:00 GMT+0900 (日本標準時)" class="order-first flex items-center text-zinc-400 dark:text-zinc-300">
      <span class="h-4 w-0.5 rounded-full bg-zinc-200 dark:bg-zinc-400"></span>
      <span class="ml-3">2025-04-10</span>
 <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="size-6 fill-sky-400"><path d="M152,128a24,24,0,1,1-24-24A24,24,0,0,1,152,128Z" opacity="0.2"></path><path d="M128,96a32,32,0,1,0,32,32A32,32,0,0,0,128,96Zm0,48a16,16,0,1,1,16-16A16,16,0,0,1,128,144Z"></path></svg>    </time>
  <a href="/en/category/Troubleshooting/" data-pagefind-filter="Filter by Category" class="relative rounded-md bg-emerald-50 dark:bg-emerald-200 px-2 py-1 text-xs font-medium text-emerald-600 dark:text-emerald-700 ring-1 ring-emerald-500/10 dark:ring-emerald-500/30 ring-inset hover:bg-emerald-100 no-underline">Troubleshooting</a>
      <span class="relative px-2 py-1 text-xs font-light text-zinc-400 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-700">by: <a class="no-underline text-zinc-400 dark:text-zinc-300" data-pagefind-filter="Filter by Author" href="/en/author/Shiori/">Shiori</a></span>
 </div>
 <div class="text-xs/3 text-zinc-500 ml-4 mt-2 flex space-x-2 break-keep">
 </div>
 <!-- ===== post-details.vto TEMPLATE END ===== -->

        </div>
        <div class="group relative">
          <h3 class="mt-3 text-lg/6 font-semibold text-gray-900 group-hover:text-gray-600">
            <a href="/en/posts/20250402-my-computer-froze-7-easy-fixes-for-beginners-en/" data-faid="en-202503a-pc-freeze" class="data-fatrigger text-zinc-800 hover:text-sky-500 dark:text-zinc-50 dark:hover:text-sky-500">
              <span class="absolute inset-0"></span>
              My Computer Froze! 7 Easy Fixes for Beginners 
            </a>
          </h3>
          <p class="mt-5 line-clamp-3 text-sm/6 text-zinc-600 dark:text-zinc-300">
            When your computer screen suddenly freezes while you’re using it, it can be quite stressful, and frustrating especially if you’re busy.<br>
 However, immediately forcing a shutdown or yanking the power plug can lead to data loss or make the situation worse.<br>
 First, take a deep breath and stay calm. Then, try <strong>the seven solutions</strong> below.<br>
 <br>
          </p>
        </div>
      </div>
    </article>
    <article class="flex flex-col items-start">
      <div class="relative w-full">
        <div class="absolute inset-0 bg-emerald-500 opacity-80 rounded-2xl transition-opacity duration-300 mix-blend-color">
        </div>
        <img src="/assets/cat5-bg.jpg" alt="" class="aspect-video w-full rounded-2xl bg-blend-overlay object-cover sm:aspect-2/1 lg:aspect-3/2 transition-opacity duration-300 filter dark:invert mix-blend-normal dark:mix-blend-luminosity" loading="lazy" fetchpriority="high" decoding="async">
        <div class="absolute inset-0 rounded-2xl ring-1 ring-gray-900/10 ring-inset">
        </div>
      </div>
      <div class="max-w-xl">
        <div class="z-10">
          <!-- ===== post-details.vto TEMPLATE START ===== -->
 <div class="mt-8 flex flex-wrap items-center gap-x-4 text-xs">
    <time datetime="Wed Apr 09 2025 10:07:46 GMT+0900 (日本標準時)" class="order-first flex items-center text-zinc-400 dark:text-zinc-300">
      <span class="h-4 w-0.5 rounded-full bg-zinc-200 dark:bg-zinc-400"></span>
      <span class="ml-3">2025-04-09</span>
 <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="size-6 fill-sky-400"><path d="M152,128a24,24,0,1,1-24-24A24,24,0,0,1,152,128Z" opacity="0.2"></path><path d="M128,96a32,32,0,1,0,32,32A32,32,0,0,0,128,96Zm0,48a16,16,0,1,1,16-16A16,16,0,0,1,128,144Z"></path></svg>    </time>
  <a href="/en/category/Troubleshooting/" data-pagefind-filter="Filter by Category" class="relative rounded-md bg-emerald-50 dark:bg-emerald-200 px-2 py-1 text-xs font-medium text-emerald-600 dark:text-emerald-700 ring-1 ring-emerald-500/10 dark:ring-emerald-500/30 ring-inset hover:bg-emerald-100 no-underline">Troubleshooting</a>
      <span class="relative px-2 py-1 text-xs font-light text-zinc-400 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-700">by: <a class="no-underline text-zinc-400 dark:text-zinc-300" data-pagefind-filter="Filter by Author" href="/en/author/Kisetsu%20Yamada/">Kisetsu Yamada</a></span>
 </div>
 <div class="text-xs/3 text-zinc-500 ml-4 mt-2 flex space-x-2 break-keep">
 </div>
 <!-- ===== post-details.vto TEMPLATE END ===== -->

        </div>
        <div class="group relative">
          <h3 class="mt-3 text-lg/6 font-semibold text-gray-900 group-hover:text-gray-600">
            <a href="/en/posts/20250409-battery-health-en/" data-faid="en-202503f-laptop-battery-health" class="data-fatrigger text-zinc-800 hover:text-sky-500 dark:text-zinc-50 dark:hover:text-sky-500">
              <span class="absolute inset-0"></span>
              Tips for how to check your laptop battery health on Windows
            </a>
          </h3>
          <p class="mt-5 line-clamp-3 text-sm/6 text-zinc-600 dark:text-zinc-300">
            Every mobile device has a battery.  And the battery condition is getting gradually worse over time and lasts less time as you continue to use it.<br>
 Windows offers a useful feature to check the battery status of your device by simply inputting a single command line. Here is the quick tip for how to check it on Windows laptops.<br>
 <br>
          </p>
        </div>
      </div>
    </article>
    <article class="flex flex-col items-start">
      <div class="relative w-full">
        <div class="absolute inset-0 bg-esoliablue-500 opacity-80 rounded-2xl transition-opacity duration-300 mix-blend-color">
        </div>
        <img src="/assets/cat1a-bg.jpg" alt="" class="aspect-video w-full rounded-2xl bg-blend-overlay object-cover sm:aspect-2/1 lg:aspect-3/2 transition-opacity duration-300 filter dark:invert mix-blend-normal dark:mix-blend-luminosity" loading="lazy" fetchpriority="high" decoding="async">
        <div class="absolute inset-0 rounded-2xl ring-1 ring-gray-900/10 ring-inset">
        </div>
      </div>
      <div class="max-w-xl">
        <div class="z-10">
          <!-- ===== post-details.vto TEMPLATE START ===== -->
 <div class="mt-8 flex flex-wrap items-center gap-x-4 text-xs">
    <time datetime="Tue Apr 08 2025 16:31:31 GMT+0900 (日本標準時)" class="order-first flex items-center text-zinc-400 dark:text-zinc-300">
      <span class="h-4 w-0.5 rounded-full bg-zinc-200 dark:bg-zinc-400"></span>
      <span class="ml-3">2025-04-08</span>
 <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="size-6 fill-sky-400"><path d="M152,128a24,24,0,1,1-24-24A24,24,0,0,1,152,128Z" opacity="0.2"></path><path d="M128,96a32,32,0,1,0,32,32A32,32,0,0,0,128,96Zm0,48a16,16,0,1,1,16-16A16,16,0,0,1,128,144Z"></path></svg>    </time>
  <a href="/en/category/Microsoft-365/" data-pagefind-filter="Filter by Category" class="relative rounded-md bg-esoliablue-50 dark:bg-esoliablue-200 px-2 py-1 text-xs font-medium text-esoliablue-600 dark:text-esoliablue-700 ring-1 ring-esoliablue-500/10 dark:ring-esoliablue-500/30 ring-inset hover:bg-esoliablue-100 no-underline">Microsoft-365</a>
      <span class="relative px-2 py-1 text-xs font-light text-zinc-400 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-700">by: <a class="no-underline text-zinc-400 dark:text-zinc-300" data-pagefind-filter="Filter by Author" href="/en/author/Kylie%20Cogley%20/">Kylie Cogley </a></span>
 </div>
 <div class="text-xs/3 text-zinc-500 ml-4 mt-2 flex space-x-2 break-keep">
 </div>
 <!-- ===== post-details.vto TEMPLATE END ===== -->

        </div>
        <div class="group relative">
          <h3 class="mt-3 text-lg/6 font-semibold text-gray-900 group-hover:text-gray-600">
            <a href="/en/posts/20250408-outlook-calendar-sync-issues-en/" data-faid="en-202503e-outlook-calender-sync-issues" class="data-fatrigger text-zinc-800 hover:text-sky-500 dark:text-zinc-50 dark:hover:text-sky-500">
              <span class="absolute inset-0"></span>
              How to Fix Outlook Calendar Sync Issues.
            </a>
          </h3>
          <p class="mt-5 line-clamp-3 text-sm/6 text-zinc-600 dark:text-zinc-300">
            If you use Outlook, you might occasionally encounter problems where your calendar doesn’t update or updating is delayed. This issue can lead to scheduling conflicts such as double bookings. Here are some methods to help resolve these problems and ensure smoother scheduling.<br>
 <br>
          </p>
        </div>
      </div>
    </article>
    <article class="flex flex-col items-start">
      <div class="relative w-full">
        <div class="absolute inset-0 bg-emerald-500 opacity-80 rounded-2xl transition-opacity duration-300 mix-blend-color">
        </div>
        <img src="/assets/cat5-bg.jpg" alt="" class="aspect-video w-full rounded-2xl bg-blend-overlay object-cover sm:aspect-2/1 lg:aspect-3/2 transition-opacity duration-300 filter dark:invert mix-blend-normal dark:mix-blend-luminosity" loading="lazy" fetchpriority="high" decoding="async">
        <div class="absolute inset-0 rounded-2xl ring-1 ring-gray-900/10 ring-inset">
        </div>
      </div>
      <div class="max-w-xl">
        <div class="z-10">
          <!-- ===== post-details.vto TEMPLATE START ===== -->
 <div class="mt-8 flex flex-wrap items-center gap-x-4 text-xs">
    <time datetime="Tue Apr 08 2025 14:57:10 GMT+0900 (日本標準時)" class="order-first flex items-center text-zinc-400 dark:text-zinc-300">
      <span class="h-4 w-0.5 rounded-full bg-zinc-200 dark:bg-zinc-400"></span>
      <span class="ml-3">2025-04-08</span>
 <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="size-6 fill-sky-400"><path d="M152,128a24,24,0,1,1-24-24A24,24,0,0,1,152,128Z" opacity="0.2"></path><path d="M128,96a32,32,0,1,0,32,32A32,32,0,0,0,128,96Zm0,48a16,16,0,1,1,16-16A16,16,0,0,1,128,144Z"></path></svg>    </time>
  <a href="/en/category/Troubleshooting/" data-pagefind-filter="Filter by Category" class="relative rounded-md bg-emerald-50 dark:bg-emerald-200 px-2 py-1 text-xs font-medium text-emerald-600 dark:text-emerald-700 ring-1 ring-emerald-500/10 dark:ring-emerald-500/30 ring-inset hover:bg-emerald-100 no-underline">Troubleshooting</a>
      <span class="relative px-2 py-1 text-xs font-light text-zinc-400 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-700">by: <a class="no-underline text-zinc-400 dark:text-zinc-300" data-pagefind-filter="Filter by Author" href="/en/author/Sachiko%20Kosuge%20/">Sachiko Kosuge </a></span>
 </div>
 <div class="text-xs/3 text-zinc-500 ml-4 mt-2 flex space-x-2 break-keep">
 </div>
 <!-- ===== post-details.vto TEMPLATE END ===== -->

        </div>
        <div class="group relative">
          <h3 class="mt-3 text-lg/6 font-semibold text-gray-900 group-hover:text-gray-600">
            <a href="/en/posts/20250408-simple-maintenance-tips-en/" data-faid="en-202503d-Simple-Maintenance-Tips" class="data-fatrigger text-zinc-800 hover:text-sky-500 dark:text-zinc-50 dark:hover:text-sky-500">
              <span class="absolute inset-0"></span>
              Simple Maintenance Tips to keep your PC running smoothly 
            </a>
          </h3>
          <p class="mt-5 line-clamp-3 text-sm/6 text-zinc-600 dark:text-zinc-300">
            Simple maintenance tips to keep your PC running smoothly.<br>
 By regularly performing these easy maintenance tasks, you can maintain your PC’s performance and enjoy using it for a long time.<br>
          </p>
        </div>
      </div>
    </article>
 </div>

 <!-- ===== top-post-cards1.vto TEMPLATE END ===== -->

            </div>
            <!-- ===== panel-cta.vto TEMPLATE START ===== -->
 <div class="flex flex-col lg:flex-row lg:space-x-4">
  <form class="rounded-2xl border border-zinc-100 p-6 dark:border-zinc-700/40" action="/thank-you">
    <h2 class="flex text-sm font-semibold text-zinc-900 dark:text-zinc-100">
      <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-6 w-6 fill-esoliaamber-500 dark:fill-amber-600"><path d="M224,56l-96,88L32,56Z" opacity="0.2"></path><path d="M224,48H32a8,8,0,0,0-8,8V192a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V56A8,8,0,0,0,224,48Zm-96,85.15L52.57,64H203.43ZM98.71,128,40,181.81V74.19Zm11.84,10.85,12,11.05a8,8,0,0,0,10.82,0l12-11.05,58,53.15H52.57ZM157.29,128,216,74.18V181.82Z"></path></svg>
      <span class="ml-3">Stay Informed</span>
    </h2>
    <p class="mt-2 text-sm text-zinc-600 dark:text-zinc-400">
      Get notified when we publish something new, by entering your email address below.
    </p>
    <div class="mt-6 flex">
      <label for="email" class="sr-only">Email address</label>
      <input id="email" type="email" placeholder="Email address" aria-label="Email address" required="" class="min-w-0 flex-auto appearance-none rounded-md border border-zinc-900/10 bg-white px-3 py-[calc(--spacing(2)-1px)] shadow-md shadow-zinc-800/5 placeholder:text-zinc-400 focus:border-sky-500 focus:ring-4 focus:ring-sky-500/10 focus:outline-hidden sm:text-sm dark:border-zinc-700 dark:bg-zinc-700/[0.15] dark:text-zinc-200 dark:placeholder:text-zinc-500 dark:focus:border-sky-400 dark:focus:ring-sky-400/10">
      <button class="ml-4 inline-flex flex-none items-center justify-center gap-2 rounded-md px-3 py-2 text-sm font-semibold outline-offset-2 text-zinc-50 bg-sky-500 transition hover:bg-sky-400 active:bg-sky-600 active:text-sky-100/70 active:transition-none dark:bg-sky-700 dark:hover:bg-sky-600 dark:active:bg-sky-700 dark:active:text-sky-100/70 transform hover:scale-105 active:scale-100 focus:ring-4 focus:ring-sky-500/50" type="submit">
        Join
      </button>
    </div>
  </form>
  <div class="rounded-2xl border border-zinc-100 p-6 dark:border-zinc-700/40 mt-6 lg:mt-0">
    <h2 class="flex text-sm font-semibold text-zinc-900 dark:text-zinc-100">
      <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-6 w-6 fill-esoliaamber-500 dark:fill-amber-600"><path d="M224,128a96,96,0,1,1-96-96A96,96,0,0,1,224,128Z" opacity="0.2"></path><path d="M140,180a12,12,0,1,1-12-12A12,12,0,0,1,140,180ZM128,72c-22.06,0-40,16.15-40,36v4a8,8,0,0,0,16,0v-4c0-11,10.77-20,24-20s24,9,24,20-10.77,20-24,20a8,8,0,0,0-8,8v8a8,8,0,0,0,16,0v-.72c18.24-3.35,32-17.9,32-35.28C168,88.15,150.06,72,128,72Zm104,56A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z"></path></svg>
      <span class="ml-3">Considering our services?</span>
    </h2>
    <p class="mt-2 text-sm text-zinc-600 dark:text-zinc-400">
      Please click the button to contact us via our main site. We will get back to you from there. We look forward to assisting you!

    </p>
    <div class="mt-6 flex">
      <a href="https://esolia.com/info-request/" target="_blank" rel="noopener" role="button" tabindex="0" aria-label="Contact us via eSolia main site" class="inline-flex flex-none items-center justify-center gap-2 rounded-md px-3 py-2 text-sm font-semibold  outline-offset-2 text-zinc-50 bg-sky-500 transition hover:bg-sky-400 active:bg-sky-600 active:text-sky-100/70 active:transition-none dark:bg-sky-700 dark:hover:bg-sky-600 dark:active:bg-sky-700 dark:active:text-sky-100/70 transform hover:scale-105 active:scale-100 focus:ring-4 focus:ring-sky-500/50">
        Contact us
      </a>
    </div>
  </div>
 </div>
 <!-- ===== panel-cta.vto TEMPLATE END ===== -->

          </div>
        </div>
      </div>
    </div>
  </div>
 </main>
 <!-- ===== index.vto LAYOUT END ===== -->


        <!-- Current page: /en/ -->
        <!-- ===== footer.vto TEMPLATE START ===== -->
 <footer class="mt-32 flex-none bg-zinc-100 dark:bg-zinc-800">
  <div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
    <div class="py-16">
      <a aria-label="Return to Site Top" class="pointer-events-auto block origin-left" href="/en/"><img id="large-logo" alt="eSolia full size logo linking to site top" loading="lazy" fetchpriority="high" decoding="async" class="mx-auto h-12 w-auto object-cover dark:grayscale dark:invert dark:saturate-[.1] transition-opacity duration-300" src="/assets/logo_horiz_darkblue_bgtransparent_2.svg"></a>

      <nav class="mt-10 text-sm" aria-label="quick links">
        <div class="-my-1 flex justify-center gap-x-6 flex-wrap">            <a class="inline-block rounded-lg px-2 py-1 text-sm" href="/archive" aria_label="Site internal link" title="Link to the Archive page" target="_self">
              Archive
              <span class="sr-only">(Site internal link)</span></a>
            <a class="inline-block rounded-lg px-2 py-1 text-sm" href="/sitemap.xml" aria_label="Site internal link" title="Link to the Sitemap" target="_self">
              Sitemap
              <span class="sr-only">(Site internal link)</span></a>
            <a class="inline-block rounded-lg px-2 py-1 text-sm" href="https://esolia.com/privacy" aria_label="Site internal link" title="Link to the Privacy Policy" target="_self">
              Privacy Policy
              <span class="sr-only">(Site internal link)</span></a>
            <a class="inline-block rounded-lg px-2 py-1 text-sm" href="https://github.com/eSolia/blog.esolia.pro" aria_label="External link" title="Link to the GitHub Repository for this site" target="_blank">
              Github Repo
              <span class="sr-only">(External link)</span></a>
            <a class="inline-block rounded-lg px-2 py-1 text-sm" href="https://esolia.com" aria_label="External link" title="Link to eSolia Inc. website" target="_blank">
              eSolia
              <span class="sr-only">(External link)</span></a>
 </div>
      </nav>
    </div>
    <div class="flex flex-col items-center border-t border-slate-400/10 py-10 sm:flex-row-reverse sm:justify-between">
      <div class="mt-6 flex flex-wrap gap-6">
        <a class="group -m-1 p-1" aria-label="Follow on LinkedIn" href="https://www.linkedin.com/company/esolia" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-6 w-6 fill-sky-800 dark:fill-sky-600 transition hover:scale-110"><path d="M224,40V216a8,8,0,0,1-8,8H40a8,8,0,0,1-8-8V40a8,8,0,0,1,8-8H216A8,8,0,0,1,224,40Z" opacity="0.2"></path><path d="M216,24H40A16,16,0,0,0,24,40V216a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V40A16,16,0,0,0,216,24Zm0,192H40V40H216V216ZM96,112v64a8,8,0,0,1-16,0V112a8,8,0,0,1,16,0Zm88,28v36a8,8,0,0,1-16,0V140a20,20,0,0,0-40,0v36a8,8,0,0,1-16,0V112a8,8,0,0,1,15.79-1.78A36,36,0,0,1,184,140ZM100,84A12,12,0,1,1,88,72,12,12,0,0,1,100,84Z"></path></svg></a>
        <a class="group -m-1 p-1" aria-label="Follow on Bluesky" href="https://bsky.app/profile/esolia.com" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-6 w-6 fill-sky-400 dark:fill-sky-300 transition hover:scale-110"><path d="M225.12,119.71c-7.86,30.94-29.31,32.71-37.36,32.23h-1A36,36,0,1,1,128,180a36,36,0,1,1-58.72-28.06h-1c-8,.48-29.5-1.29-37.36-32.23C22.79,87.84,15.78,48,47.07,48S128,95.8,128,127.67C128,95.8,177.64,48,208.93,48S233.21,87.84,225.12,119.71Z" opacity="0.2"></path><path d="M232.7,50.48C229,45.7,221.84,40,209,40c-16.85,0-38.46,11.28-57.81,30.16A140.07,140.07,0,0,0,136,87.53V56a8,8,0,0,0-16,0V87.53a140.07,140.07,0,0,0-15.15-17.37C85.49,51.28,63.88,40,47,40,34.16,40,27,45.7,23.3,50.48c-6.82,8.77-12.18,24.08-.21,71.2,6.05,23.83,19.51,33,30.63,36.42A44,44,0,0,0,128,205.27a44,44,0,0,0,74.28-47.17c11.12-3.4,24.57-12.59,30.63-36.42C239.63,95.24,244.85,66.1,232.7,50.48ZM92,208A28.12,28.12,0,0,1,88.86,152a8,8,0,1,0-1.76-15.9A43.64,43.64,0,0,0,66.36,144c-8.43.09-22-3.57-27.76-26.26C35.72,106.39,27,71.86,35.94,60.3,37.37,58.46,40.09,56,47,56c27.27,0,73,44.88,73,71.67V180A28,28,0,0,1,92,208ZM217.4,117.74c-5.77,22.69-19.33,26.34-27.77,26.26a43.6,43.6,0,0,0-20.74-7.95,8,8,0,1,0-1.76,15.9A28.11,28.11,0,1,1,136,180V127.67C136,100.88,181.69,56,209,56c6.95,0,9.66,2.46,11.1,4.3C229.05,71.86,220.28,106.39,217.4,117.74Z"></path></svg></a>
        <a class="group -m-1 p-1" aria-label="Follow on X Twitter" href="https://x.com/esolia_inc" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-6 w-6 fill-black-600 dark:fill-zinc-50 transition hover:scale-110"><path d="M208,216H160L48,40H96Z" opacity="0.2"></path><path d="M214.75,211.71l-62.6-98.38,61.77-67.95a8,8,0,0,0-11.84-10.76L143.24,99.34,102.75,35.71A8,8,0,0,0,96,32H48a8,8,0,0,0-6.75,12.3l62.6,98.37-61.77,68a8,8,0,1,0,11.84,10.76l58.84-64.72,40.49,63.63A8,8,0,0,0,160,224h48a8,8,0,0,0,6.75-12.29ZM164.39,208,62.57,48h29L193.43,208Z"></path></svg></a>
        <a class="group -m-1 p-1" aria-label="GitHub profile" href="https://github.com/esolia" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 256 256" fill="currentColor" class="h-6 w-6 fill-green-600 dark:fill-green-500 transition hover:scale-110"><path d="M208,104v8a48,48,0,0,1-48,48H136a32,32,0,0,1,32,32v40H104V192a32,32,0,0,1,32-32H112a48,48,0,0,1-48-48v-8a49.28,49.28,0,0,1,8.51-27.3A51.92,51.92,0,0,1,76,32a52,52,0,0,1,43.83,24h32.34A52,52,0,0,1,196,32a51.92,51.92,0,0,1,3.49,44.7A49.28,49.28,0,0,1,208,104Z" opacity="0.2"></path><path d="M208.3,75.68A59.74,59.74,0,0,0,202.93,28,8,8,0,0,0,196,24a59.75,59.75,0,0,0-48,24H124A59.75,59.75,0,0,0,76,24a8,8,0,0,0-6.93,4,59.78,59.78,0,0,0-5.38,47.68A58.14,58.14,0,0,0,56,104v8a56.06,56.06,0,0,0,48.44,55.47A39.8,39.8,0,0,0,96,192v8H72a24,24,0,0,1-24-24A40,40,0,0,0,8,136a8,8,0,0,0,0,16,24,24,0,0,1,24,24,40,40,0,0,0,40,40H96v16a8,8,0,0,0,16,0V192a24,24,0,0,1,48,0v40a8,8,0,0,0,16,0V192a39.8,39.8,0,0,0-8.44-24.53A56.06,56.06,0,0,0,216,112v-8A58,58,0,0,0,208.3,75.68ZM200,112a40,40,0,0,1-40,40H112a40,40,0,0,1-40-40v-8a41.74,41.74,0,0,1,6.9-22.48A8,8,0,0,0,80,73.83a43.81,43.81,0,0,1,.79-33.58,43.88,43.88,0,0,1,32.32,20.06A8,8,0,0,0,119.82,64h32.35a8,8,0,0,0,6.74-3.69,43.87,43.87,0,0,1,32.32-20.06A43.81,43.81,0,0,1,192,73.83a8.09,8.09,0,0,0,1,7.65A41.76,41.76,0,0,1,200,104Z"></path></svg></a>
      </div>
      <p class="mt-6 text-sm text-zinc-500 sm:mt-0 text-center sm:text-left">
        ©2025
        eSolia Inc. All rights reserved.<br>
        <span class="text-xs text-zinc-400">Shiodome City Center 5F (Work Styling), 1-5-2 Higashi-Shimbashi, Minato-ku, Tokyo, Japan, 105-7105</span>
      </p>
    </div>
  </div>
 </footer>
 <!-- ===== footer.vto TEMPLATE END ===== -->

        <!-- ===== search-modal.vto TEMPLATE START ===== -->
 <div id="searchModal" class="fixed top-0 left-0 z-1000 w-full h-full overflow-auto hidden">
  <div class="relative w-3/4 h-3/4 mx-auto mt-24 overflow-auto p-5 bg-white/95 dark:bg-zinc-800/95 border border-zinc-100 dark:border-zinc-700/40 rounded-lg shadow-md">
    <div class="block text-right items-right font-bold text-sm">
      <a id="modal-close" href="#">Close</a>
    <div id="search" class="text-left mt-6" tabindex="0"></div>
  </div>
 </div>
 <!-- ===== search-modal.vto TEMPLATE END ===== -->

      </div>
    </div>
    <!-- Container end -->
    <script src="/js/fathom-post-list-event.js"></script>
  
  

 </div></body><!-- ===== base.vto LAYOUT END ===== --></html>
          <script type="module" src="https://cdn.jsdelivr.net/gh/lumeland/cms@6a17aac8bb5b95ba9c22f0bc36645c17e56c9b5d/static/components/u-bar.js"></script>
          <u-bar data-api="/admin/status"></u-bar>