/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: May 22 2026 | 05:57:50 */
/* 外側の枠（表示領域） */
        .marquee-wrapper {
            width: 100%;
            overflow: hidden;
            white-space: nowrap;
            padding: 0px 0;
            display: flex; /* 横に並べる */
        }

        /* アニメーションを適用する中身 */
        .marquee-content {
            display: flex;
            animation: scroll-right-to-left 15s linear infinite;
        }

        /* 流れるテキスト自体のスタイル */
        .marquee-text {
			font-family: "Montserrat", sans-serif;
            font-size: 140px;
            font-weight: 400;
			color:#F6F6F6;
            padding-right: 50px; /* テキスト間の余白 */
			line-height:1;
			    margin-bottom: 0px;
			    padding-top: 15px;
    padding-bottom: 15px;
        }
        /* 右から左へ流れる無限ループのアニメーション */
        @keyframes scroll-right-to-left {
            0% {
                transform: translateX(0);
            }
            100% {
                /* 中身が2つあるので、ちょうど半分(-50%)動いたところでループさせる */
                transform: translateX(-50%);
            }
        }



#Home .company {
	padding-bottom:100px;
}
#Home .company h1 {
	font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  color: #14722B;
	font-size:36px;
	margin-bottom:10px;
	letter-spacing:3px;
}
#Home .company p {
	margin-bottom:10px;
}
#Home .company .btn {
  color: #fff;
	margin-top:30px;
}
#Home .company .btn a {
  position: relative;
  padding-top: 12px;
    padding-right: 45px;
    padding-left: 60px;
    padding-bottom: 12px;
  text-decoration: none;
  color: #fff;
  font-weight: 400;
	background-color:#14722B;
	font-size:16px;
}
#Home .company .btn a:hover {
	background-color:#14722B;
	opacity: 0.7;
}
#Home .company .btn a:before {
  background: url(https://first-coating.co.jp/test/wp-content/uploads/2026/04/ico_arrow_white.svg);
  content: "";
  width: 23px;
  height: 7px;
  left: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}


#Home .products {
	padding-top:100px;
	padding-bottom:100px;
	background-color:#F8FFED;
}
/* 外側のコンテナ：背景色と中央寄せの設定 */
#Home .products .title-container {
  height: 130px;             /* 高さは任意 */
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;          /* 英語がはみ出た場合に隠す */
}

/* 日本語タイトル */
#Home .products .main-title {
  color: #14722B;            /* 白 */
  font-family: "Noto Sans JP", sans-serif;
  font-size: 36px;         /* 日本語の大きさ */
  font-weight: 400;
  position: relative;        /* 重なりの基準にするため */
 /* ↓ 英語が日本語より後ろ、かつ背景（緑色）よりは前に来るように「隔離」します */
  isolation: isolate;
  margin: 0;
}

/* 背後の英語（疑似要素） */
#Home .products .main-title::before {
  content: "Products";        /* 表示したい英語を入力 */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* 完全に中央へ配置 */
  /* デザインのポイント */
  color: rgba(255, 255, 255, 1); /* 白に透明度(0.15)をつけて透けさせる */
  font-size: 140px;                  /* 日本語よりかなり大きく */
	font-weight: 300;
  font-family: "Montserrat", sans-serif;   /* フォントはお好みで */
  /* ↓ ここが修正ポイント：マイナス値を指定して日本語テキストの「後ろ」に回す */
  z-index: -1;
  white-space: nowrap;              /* 改行を防ぐ */
}
#Home .products a{
	text-decoration:none;
}
#Home .products a:hover {
  opacity: 0.8;
}
#Home .products .cover{
	margin-top:30px;
	min-height:396px;
	padding-left:100px;
}
#Home .products .cover h3{
	font-size:36px;
		font-family: "Noto Sans JP", sans-serif;
	font-weight:500;
	color:#FFF;
	margin-bottom:15px;
}
#Home .products .cover p{
	font-size:18px;
	font-weight:500;
	color:#FFF;
}
#Home .products .btn {
  color: #fff;
	margin-top:50px;
}
#Home .products .btn a {
  position: relative;
  padding-top: 12px;
    padding-right: 45px;
    padding-left: 60px;
    padding-bottom: 12px;
  text-decoration: none;
  color: #fff;
  font-weight: 400;
	background-color:#14722B;
	font-size:16px;
}
#Home .products .btn a:hover {
	background-color:#14722B;
	opacity: 0.7;
}
#Home .products .btn a:before {
  background: url(https://first-coating.co.jp/test/wp-content/uploads/2026/04/ico_arrow_white.svg);
  content: "";
  width: 23px;
  height: 7px;
  left: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

#Home .newsArea {
	padding-top:100px;
	padding-bottom:120px;
}
#Home .newsArea pre {
	font-size: 55px;
     font-family: "Jost", sans-serif;
	font-style: italic;
    font-weight: 500;
	line-height: 1.1;
    overflow: hidden;
	margin-right:15px;
	    padding-top: 10px;
}
#Home .newsArea h2 {
	font-size:36px;
	font-family: "Noto Sans JP", sans-serif;
	font-weight:500;
	color:#14722B;
}
#Home .newsArea ul li{
	padding-top:15px;
	padding-bottom:15px;
	border-bottom:1px solid #ccc;
}
#Home .newsArea .date{
	font-size:16px;
	font-family: "Noto Sans JP", sans-serif;
	font-weight:500;
	color:#14722B;
	padding-left:10px;
	width: 100px;
}
#Home .newsArea .title{
	font-size:16px;
	font-family: "Noto Sans JP", sans-serif;
	font-weight:400;
	color:#333;
}
#Home .newsArea p.goList{
	font-size:16px;
	text-align:right;
	margin-top:10px;
}

#Home .movie{
	padding-bottom:120px;
}






@media (max-width: 833px) {
	
	.marquee-text {
            font-size: 80px;
			    padding-top: 15px;
    padding-bottom: 15px;
        }
	
	#Home .company {
	padding-bottom:50px;
		padding-left:15px;
		padding-right:15px;
}
#Home .company h1 {
	text-align:center;
	font-size:30px;
	margin-bottom:5px;
}
#Home .company .btn {
  color: #fff;
	margin-top:20px;
	justify-content:center;
}
	
	
	#Home .products {
	padding-top:50px;
	padding-bottom:50px;
		padding-left:15px;
		padding-right:15px;
}
/* 外側のコンテナ：背景色と中央寄せの設定 */
#Home .products .title-container {
  height: 80px;             /* 高さは任意 */
}

/* 日本語タイトル */
#Home .products .main-title {
  font-size: 30px;         /* 日本語の大きさ */
  font-weight: 500;
}

/* 背後の英語（疑似要素） */
#Home .products .main-title::before {
  font-size: 80px;                  /* 日本語よりかなり大きく */
	font-weight: 300;
}
	#Home .products .cover{
	margin-top:20px;
	min-height:360px;
	padding-left:15px;
		padding-right:15px;
}
#Home .products .cover h3{
	font-size:28px;
	margin-bottom:10px;
	text-align:center;
}
#Home .products .cover p{
	font-size:16px;
	font-weight:500;
	color:#FFF;
}
#Home .products .btn {
  color: #fff;
	margin-top:30px;
}
	
			#Home .newsArea {
	padding-top:40px;
	padding-bottom:60px;
		padding-left:15px;
		padding-right:15px;
}
#Home .newsArea h2 {
	font-size:30px;
	margin-bottom:15px;
	text-align:center;
}
#Home .newsArea ul li{
	padding-top:10px;
	padding-bottom:10px;
	border-bottom:1px solid #ccc;
}
#Home .newsArea .date{
	font-size:16px;
	margin-right:200px;
	padding-left:0px;
}
#Home .newsArea .title{
	font-size:16px;
	font-family: "Noto Sans JP", sans-serif;
	font-weight:400;
	color:#333;
}
#Home .newsArea p.goList{
	font-size:16px;
	text-align:right;
	margin-top:10px;
}
	
	#Home .movie{
	padding-bottom:60px;
}

	
}