h1{
	font-family: "Noto Serif JP" ;
}

.before-window{
        width:100%;
        height:40px;
        background-color:#fff8ec;
}

.container {
    display: flex;
    width: 100%;
  }
  .container2 {
    display: flex;
    width: 100%;
  }

  .box1 { flex: 1; background: #fff8ec; }   /* 20% */
  .box2 { background: transparent; }    /* 30% */
  .box3 { background: #c5956b; }   /* 10% */
  .box4 { background: #c5956b; }   /* 10% */


#splash {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: white;
        display: flex;
        flex-flow: column;
        align-items: center;
        justify-content: center;
        z-index: 9999;
        font-size: 2rem;
        opacity: 1;
        transition: opacity 1s ease;
}

#splash.fade-out {
  opacity: 0;
  pointer-events: none;
}

.splash-text01 {
        font-size: 24px;
}

.splash-text02 {
        font-size: 36px;
}

body{
        margin:0px;
}

.background {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
}

.background img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: zoomLoop 10s ease-in-out infinite;
  transform-origin: center;
}

a{
        text-decoration:none;
}

a,a:hover,a:visited{
    color: inherit;
}

z3{border-bottom:2px dotted #000000;color: #000000;line-height: 50px;}

/* ヘッダー（ここから） */
header {
        top: 0;
        position:fixed;
        width: 100%;
        height:80px;
        z-index: 1;
}

.header-box{
        background-color:#fff8ec;
        /* background-color:#FFFFFF; */
        display: flex;
        justify-content: space-between; /* 左右に分ける */
        align-items: center;
}

.header-left,.header-right{
        transform: translateY(-50px);
        opacity: 0;
        transition: transform 1s ease, opacity 1s ease;
}

.header-left{
        padding:20px 20px 10px 20px;
}

.bar {
        background-color:#000000;
        height:10px;
}

.slide.is-visible .header-left,
.slide.is-visible .header-right{
        transform: translateY(0);
        opacity: 1;
}

/* ヘッダー（ここまで） */

/* HOME（ここから） */
.home-image{
        display: block;
        margin: 0 auto;
        width: 30%;
        min-width: 300px;
}

@keyframes zoomLoop {
        0%   { transform: scale(1); }
        50%  { transform: scale(1.1); }
        100% { transform: scale(1); }
}

.home-content-text{
        color: #1C202D;
        font-family: "Noto Serif JP" ;
        font-size: 6vw;
        font-weight: bold;
        text-shadow: 1px 1px 4px rgba(0,0,0,0.6);
        z-index: -1;
        transform: translate(-100px, 70px) rotate(-10deg);
        opacity: 0;
        transition: transform 0.6s ease, opacity 0.6s ease;
}

.slide.is-visible .home-content-text{
        transform: translate(0, 0) rotate(-10deg);
        opacity: 1;
}

/* 画像スクロール部分（ここから） */
.scroll-gallery {
  width: 100%;
  overflow: hidden;
}

.scroll-gallery img {
  margin-right: 0px;
  flex-shrink: 0;
}

@keyframes scroll-left-pc {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-2000px);
  }
}

@keyframes scroll-left-sp {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-1000px);
  }
}

/* ホバー時にアニメーション停止（任意） */
.scroll-gallery:hover .scroll-track {
  animation-play-state: paused;
}
/* 画像スクロール部分（ここまで） */

.home-content-text02{
        font-family: "Noto Serif JP" ;
        position: relative;
        background-color: white;
        padding-top:30px;
        margin-inline: auto;
        z-index: -1;
}

.round-sky{
        position: absolute;
        top: 5%;
        left: 10%;
        border-radius: 50%;
        /* background-color: rgb(255,253,208); */
        background-color: rgba(102,179,255,0.6);
        z-index: -1;
}

.a-few-words-title{
        text-align: center;
        font-family: "Noto Serif JP" ;
        font-weight: bold;
        padding:20px 0px 0px 0px;
}

.transparent{
        background-color: rgba(255,255,255,0.8);
}

.image-area{
        background-color:#fff8ec;
        padding:20px;
}

.a-few-words-body{
        padding:30px 30px 70px 30px;
}

.dotted-line {
        height: 20px;
        background-image: repeating-linear-gradient(
                to right,
                #3498db 0px,
                #3498db 40px,
                transparent 40px,
                transparent 60px
                );
}

.qa{
        margin: 0px auto;
        padding-bottom:30px;
        font-family: "Noto Serif JP" ;
        background-color:#ffc569;
}

.qa-title{
        margin-top:10px;
        background-color:#fff8ec;
}

.qa-body{
        margin-top:10px;
        margin-bottom:40px;
        background-color:#fff8ec;
}

/* HOME（ここまで） */


/* 施工事例（ここから） */
.construction01,
.construction02{
        background-color: rgba(255,255,255,0.8);
        margin-bottom:30px;
}

.construction-subtitle{
	padding:20px;
        font-family: "Noto Serif JP" ;
}

.construction-text{
        background-image: repeating-linear-gradient(
                to bottom,
                transparent,
                transparent 24px,
                #000000 25px
        );
        line-height: 25px;
        margin:20px;
}

/* 施工事例（ここまで） */

/* お問い合わせ（ここから） */
.contact{
        display: flex;
        justify-content: center;
}

.google-form{
        width: 100%;
        max-width: 1200px;
        border: none;
}
/* お問い合わせ（ここまで） */

/* 会社案内（ここから） */
.other-content,
.staff-content{
        margin:auto;
}

.company-information{
        width: 100%;
        border-collapse: collapse;
        background-color: rgba(255,255,255,0.8);
}

.company-information th,
.company-information td {
        line-height: 1.8;
        padding: 20px;
        text-align: left;
        border: 1px solid;
}

.slide.is-visible .company-image{
        transform: translateY(0);
        opacity: 1;
}
/* 会社案内（ここまで） */

/* スタッフ紹介（ここから） */
.staff{
        background-color: rgba(255,255,255,0.8);
        margin-bottom:20px;
}

.staff-top{
        display: flex;
        align-items:center;
}

.staff-image{
        padding:10px;
}

.staff-name{
        font-family: "Noto Serif JP" ;
        font-size: 24px;
	padding:20px;
}

.staff-position{
        font-size: 18px;
}

.staff-text{
        background-image: repeating-linear-gradient(
                to bottom,
                transparent,
                transparent 24px,
                #000000 25px
        );
        line-height: 25px;
        height: 200px;
        margin:auto;
        width:90%;
        font-family: "Noto Serif JP" ;
}
/* スタッフ紹介（ここまで） */

/* 採用情報（ここから） */
.recruit-text{
        padding:20px;
        font-size: 18px;
        margin:auto;
        background-color: rgba(255,255,255,0.8);
}
/* 採用情報（ここまで） */

/* フッター（ここから） */
footer {
        /* position:fixed; */
        bottom: 0;
        width: 100%;
        /* height: 100px; */
        background-color: #333;
        color: white;
        text-align: center;
        padding: 10px;
        box-sizing: border-box;
}

/* フッター（ここまで） */