#preloader {
    display: none !important;
}





.site-header {
    position: relative;
    z-index: 1;
}

.nav-container {
    position: relative;
    z-index: 99999 !important;
}

.burger-btn {
    position: relative;
    z-index: 999999 !important;
}


/* パソコン（画面横幅が768px以上）の時の設定 */
@media (min-width: 768px) {
  .phone-link {
    pointer-events: none!important; /* クリック（タップ）を無効化 */
    cursor: default;      /* カーソルを通常の矢印にする */
    color: inherit;       /* 文字色を周りの文章と同じにする（リンク色にしない） */
    text-decoration: none; /* 下線を消す */
  }
}

/* 用語集：読み仮名の表示 */
.doc-block h2 .yomi {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 400;
  color: var(--steel);
  margin-left: 6px;
}

/* Q&A：Q・Aラベルの表示 */
.doc-block h2 .qa-q {
  display: inline-block;
  background: var(--orange);
  color: var(--white);
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 700;
  padding: 2px 9px;
  border-radius: 3px;
  margin-right: 10px;
  vertical-align: middle;
}
.doc-block p .qa-a {
  color: var(--orange);
  font-weight: 700;
  margin-right: 4px;
}

/*
Theme Name: Jimukumiai Machimin LP
Theme URI:
Author: 町田民主商工会 労働保険事務組合
Description: 労働保険事務組合 町田民主商工会のための1ページ・ランディングページ用テーマです。建設業の小規模事業者・一人親方向けの労災特別加入サービスを紹介します。
Version: 1.0
Text Domain: jimukumiai-lp

このファイルにはテーマ情報のみを記載しています。
実際のスタイルは assets/css/main.css に分割して読み込んでいます。
*/
/* ==========================================================
   PRELOADER.CSS
   Opening Animation
========================================================== */
:root{
    --preloader-bg:#ffffff;
    --preloader-text:#111111;
    --preloader-accent:#2563eb;
    --preloader-duration:2.8s;
    --preloader-z:99999;
}


/* ==========================
   Wrapper
========================== */

#preloader{
    position:fixed;
    inset:0;
    display:flex;
    justify-content:center;
    align-items:center;
    background:var(--preloader-bg);
    z-index:var(--preloader-z);
    overflow:hidden;
    transition:
        opacity .8s ease,
        visibility .8s ease;
}

#preloader.loaded{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
}

/* ==========================
   Layout
========================== */

.preloader-inner{
    text-align:center;
    padding:20px;
}

/* ==========================
   Title
========================== */

.preloader-title{
    margin:0;
    font-size:clamp(2rem,6vw,4.5rem);
    font-weight:800;
    letter-spacing:.18em;
    color:var(--preloader-text);
}
.preloader-subtitle{

    margin:10px 0 0;

    font-size:clamp(2rem,6vw,4.5rem);

    font-weight:1000;

    letter-spacing:.1em;

    color:#000;

}




/* ==========================
   Shine Effect
========================== */

.shine{
    position:relative;
    display:inline-block;
    overflow:hidden;
}

.shine::after{

    content:"";

    position:absolute;

    top:-40%;

    left:-150%;

    width:60%;

    height:180%;

    transform:rotate(20deg);

    background:linear-gradient(
        90deg,
        rgba(255,255,255,0),
        rgba(255,255,255,.95),
        rgba(255,255,255,0)
    );

    animation:shineMove var(--preloader-duration) ease-in-out forwards;

}

/* ==========================
   Fade In
========================== */

.preloader-title,
.preloader-subtitle{

    opacity:0;

    animation:fadeIn .8s ease forwards;

}

.preloader-subtitle{

    animation-delay:.25s;

}

/* ==========================
   Animation
========================== */

@keyframes fadeIn{

    from{
        opacity:0;
        transform:translateY(15px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}

@keyframes shineMove{

    0%{
        left:-160%;
    }

    100%{
        left:180%;
    }

}

/* ==========================
   Mobile
========================== */

@media (max-width:768px){

    .preloader-title{

        letter-spacing:.12em;

    }

    .preloader-subtitle{

        letter-spacing:.22em;

    }

}

/* ==========================
   Reduced Motion
========================== */

@media (prefers-reduced-motion:reduce){

    .shine::after,
    .preloader-title,
    .preloader-subtitle{

        animation:none;

        opacity:1;

    }

    #preloader{

        transition:none;

    }

}