@charset "utf-8";

/* ////////////////////////////////////////////
 * base & layout
 * //////////////////////////////////////////// */

/* Typography
------------------------------------------*/
html {
	background: #fff;
	font-size: 15px;
}
body {
	line-height: 2.0;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
	color: #000;
}

a {
	color: #000;
	text-decoration: none;
}
a:hover,
a:focus {
	color: inherit;
	text-decoration: underline;
}

/* Layout
------------------------------------------*/
body {
	min-width: 1080px;
	text-align: center;
}
body.home {
	word-break: break-all;
}
#container {
	overflow: hidden;
}

/* header
------------------------------------------*/
#header {
	height: 0; 
}
#header-inner {
	position: relative;
	width: 1080px;
	height: 130px;
	margin: 0 auto;
	z-index: 20;
}
.site-description {
	position: absolute;
	top: 15px;
	left: 40px;
	font-size: 11px;
	color: #fff;
}
#header .logo {
	position: absolute;
	top: 40px;
	left: 40px ;
}
.gnav {
	position: absolute;
	top: 40px;
	right: 40px;
}
.gnav-list>li{
	margin:0 0 0 30px;
}

/* droppy */
.gnav-list { position: relative; text-align: left; zoom: 1; list-style: none; padding: 0; margin: 0; }
.gnav-list li { float: left; display: block; position: relative; z-index: 20; }
.gnav-list ul { display: none; position: absolute; top: 120%; left: -50%; width: 200%; background: rgba(255,255,255,.9); list-style: none; padding: 10px 0; margin: 0; box-shadow: 0 2px 10px rgba(0,0,0,0.15); }
.gnav-list ul li { float: none; }
.gnav-list ul li a {
	display: block; padding: 5px 20px; color: inherit; font-size: 11px; zoom: 1;
	background: url(../../images/default/icon01.png) no-repeat 10px 11px;
}
.gnav-list ul li a:hover { background-color: #f5f5f5; }
.gnav-list ul ul { top: 0; left: 100%; width: 100%; }
.gnav-list a, .gnav-ul img{ display: block; }
#drawer-btn { display: none; }

/* mainimage
------------------------------------------*/
#mainimage {
	position: relative;
	width: 100%;
	height: auto !important;     /* 💡 固定高さを解除し、自動可変にします */
	margin-bottom: 0 !important; 
	background: #009ee3;
	font-size: 0;                
	line-height: 0;              
}
#mainimage>img {
	position:absolute;
	top: 35% !important;         /* 💡 画面幅が広がって高さが変わっても、常に中央付近にテキストが来るよう%指定に変更 */
	left:50%;
	margin-left:-500px;
	z-index: 999;
}
#mainimage-inner {
	width: 100%;
	height: auto !important;     /* 💡 固定高さを解除 */
	margin: 0 auto;
}
.slideshow,
.slideshow ul,
.slideshow .slick-track,
.slideshow .slick-list {
	height: auto !important;
	font-size: 15px;             
	line-height: 2.0;            
}

/* 💡 元サイトと同じく、背景画像（background）ではなく、中身の「imgタグ」を100%で綺麗に見せる構造へ最適化 */
.slideshow li {
	width: 100% !important;
	height: auto !important;
	background: none !important; /* 古い背景画像指定を無効化 */
}
.slideshow li img {
	width: 100% !important;
	height: auto !important;
	display: block !important;
}

.slideshow .slick-slide {
	backface-visibility: hidden;
}

/* content main
------------------------------------------*/
body:not(.home):not(.term-base):not(.term-drone) #content-inner {
	width: 1080px;
	margin: 0 auto;
	padding-bottom: 60px;
}
body:not(.home):not(.term-base):not(.term-drone) #main {
	text-align: left;
}
.main-news {
	padding:140px 0;
	background:#F8F8F8;
}
.main-news>div {
	width:1080px;
	margin:0 auto;
	position:relative;
}
.main-news h2{
	position:absolute;
	top:0;
	left:0;
}
.main-news em{
	position:absolute;
	bottom:0;
	left:0;
}
.main-news ul {
	border-top:1px solid #eee;
	margin:0 0 0 380px;
	padding: 0;
	list-style: none;
}
.main-news li{
	text-align:left;
	border-bottom:1px solid #eee;
	background: url(../../images/default/icon02.png) no-repeat 97.5% 50%;
	padding:30px;
}
.main-news .date{
	display:block;
	color:#999;
}

/* SOLUTION エリア */
.main-solution h2{
	background:#F8F8F8 url(../../images/default/solution-bg.png) no-repeat center top / cover;
	padding:100px 0 60px;
	text-align: center;
}
.main-solution .image img {
	width:100%;
}
.main-solution .cont{
	background:url(../../images/default/bg01.png) no-repeat center bottom / cover;
	padding:0 0 60px;
}
.main-solution .cont>div{
	width:1080px;
	margin:-120px auto 0;
	position:relative;
	background:#fff;
	padding:60px 80px;
	box-sizing: border-box;
}
.main-solution .text,
.cleaner-section .text {
	padding:40px 0;
	text-align:left;
}

/* ==========================================================
 * 💡 共通：地盤改良工事・PDCE避雷球・不動産事業 PC版デザイン再現
 * ========================================================== */
.cleaner-section {
	position: relative !important;
	padding: 120px 0 !important;
	overflow: hidden !important;
	background: #fff;
}
.cleaner-section .clearfix {
	width: 1080px !important;
	margin: 0 auto !important;
	position: relative !important;
	z-index: 2 !important;
}
.cleaner-section ul {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
.cleaner-section ul li {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
}
/* --- 3. 避雷球・地盤改良・不動産エリア（比率完全維持版） --- */
.cleaner-section .image {
	width: 600px !important;   
	height: 450px !important;  /* 💡 4:3比率の枠サイズを維持 */
	overflow: hidden !important;
	border-radius: 4px !important;
	background: none !important;
}

/* 💡 最重要：fill（無理やり引き伸ばし）を廃止し、contain（比率維持）に変更します */
.cleaner-section .image img {
	width: 100% !important;
	height: 100% !important;
	object-fit: contain !important; /* 👈 これにより、画像が縦に潰れたり横に伸びたりせず、元の綺麗な縦横比のまま100%等倍で表示されます */
	display: block !important;
}
.cleaner-section .cont {
	width: 420px !important;
	padding: 40px 0 !important;
	text-align: left !important;
	box-sizing: border-box !important;
}

/* 💡 dynamic-title-blue：PC版左寄せの洗練されたブルーのテキスト */
.dynamic-title-blue {
	font-size: 38px !important;
	font-weight: 800 !important;
	line-height: 1.1 !important;
	color: #009ee3 !important;
	margin: 0 0 5px 0 !important;
	text-transform: uppercase !important;
	font-family: Arial, Helvetica, "sans-serif" !important;
	text-align: left !important;
	display: block !important;
}
.dynamic-subtitle-black {
	font-size: 16px !important;
	font-weight: bold !important;
	color: #333 !important;
	margin-bottom: 25px !important;
	letter-spacing: 0.05em !important;
	text-align: left !important;
	display: block !important;
}

/* 💡 custom-watermark-text：PC版の薄いグレーのテキスト背景 */
.custom-watermark-text {
	position: absolute !important;
	font-family: Arial, Helvetica, "sans-serif" !important;
	font-weight: 900 !important;
	font-size: 7.5vw !important;
	line-height: 0.95 !important;
	color: #f2f2f2 !important;  /* 薄いグレー */
	text-transform: uppercase !important;
	pointer-events: none !important;
	z-index: 1 !important;
	white-space: nowrap !important;
}

/* 1. 地盤改良（背景：薄グレー / 画像：右 / 文字：左寄せ / 背景文字：左上） */
.main-ground {
	background: #fff !important;
}
.main-ground ul li {
	flex-direction: row-reverse !important;
}
.main-ground .custom-watermark-text {
	top: 8% !important;
	left: 5% !important;
}

/* 2. PDCE避雷球（背景：白 / 画像：左 / 文字：右寄せ配置内の左寄せ / 背景文字：右上） */
.main-drone {
	background: #f8f8f8 !important;
}
.main-drone ul li {
	flex-direction: row !important;
}
.main-drone .custom-watermark-text {
	top: 8% !important;
	right: 5% !important;
}

/* 3. 不動産事業（背景：白 / 画像：右 / 文字：左寄せ / 背景文字：左上） */
.main-reno {
	background: #fff !important;
}
.main-reno ul li {
	flex-direction: row-reverse !important;
}
.main-reno .custom-watermark-text {
	top: 8% !important;
	left: 5% !important;
}

/* --- 4. WORKS（施工実績ギャラリー）エリア（PC版サイズ適正最大化版） --- */
.main-gallery {
	background: #F8F8F8 !important;
	padding: 100px 0 !important; 
	text-align: center !important;
}
.main-gallery h2.dynamic-title-blue {
	font-size: 38px !important;
	font-weight: 800 !important;
	line-height: 1.1 !important;
	color: #009ee3 !important;
	margin: 0 0 5px 0 !important;
	text-transform: uppercase !important;
	font-family: Arial, Helvetica, "sans-serif" !important;
	text-align: center !important;
	display: block !important;
}
.main-gallery .daisin-sp-works-container {
	width: 1080px !important;
	margin: 0 auto !important;
	padding: 0 !important;
}
.main-gallery ul.daisin-sp-works-slider {
	margin: 0 auto !important;
	padding: 0 !important;
	list-style: none !important;
	width: 100% !important;
}
.main-gallery .daisin-sp-works-container .slick-track {
	display: flex !important;
	justify-content: center !important;
	align-items: stretch !important;
	margin: 0 auto !important;
}
.main-gallery .daisin-sp-works-container .slick-slide {
	/* 💡 widthの固定値を廃止！Slick本来の計算幅を100%活かして小さくなるバグを防ぎます */
	padding: 0 15px !important; /* 👈 左右の適度な余白（隙間）はこれで維持します */
	height: auto !important;
	outline: none !important;
	float: none !important;
	box-sizing: border-box !important;
}
/* 💡 カードの横幅は100%（Slickの器いっぱいのサイズ）に広げます */
.main-gallery .works-card {
	display: block !important;
	width: 100% !important; 
	text-align: left !important;
	background: #fff !important;
	box-shadow: 0 6px 20px rgba(0,0,0,0.05) !important;
	text-decoration: none !important;
	border-radius: 4px !important;
	overflow: hidden !important;
	box-sizing: border-box !important;
}
/* 💡 画像エリアの縦幅を 220px にして、迫力ある大きさをしっかりと保ちます */
.main-gallery .works-image {
	width: 100% !important;
	height: 220px !important;
	overflow: hidden !important;
}
.main-gallery .works-image img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
}
.main-gallery .works-title {
	font-size: 15px !important;
	font-weight: bold !important;
	color: #333 !important;
	padding: 18px 20px !important;
	margin: 0 !important;
	text-align: left !important;
}

/* --- 5. 下部 2連バナー（会社概要・採用情報：余白ゼロ＆ロゴ前面重ね） --- */
.main-banner {
	padding: 0 !important;       /* 💡 上下の余白を完全に0にします */
	margin: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	overflow: hidden !important;
}
.main-banner .clearfix {
	width: 100% !important;      /* 💡 1080pxの制限を外し画面いっぱいに広げます */
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}
.main-banner ul {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	display: flex !important;    /* 💡 左右にきれいに50%ずつ並べます */
	justify-content: flex-start !important;
}
.main-banner li {
	width: 50% !important;       /* 💡 左右ぴったり半分ずつにします */
	height: 580px !important;    /* 💡 元サイトと同じダイナミックな高さを維持 */
	margin: 0 !important;        /* 💡 隙間の余白を完全にゼロにします */
	padding: 0 !important;
	background-position: center center !important;
	background-repeat: no-repeat !important;
	background-size: cover !important; /* 💡 背景写真がエリアいっぱいに広がります */
	box-sizing: border-box !important;
}
/* 💡 リンクを縦横100%フルカバーにし、かつ中のロゴ画像をど真ん中に中央寄せします */
.main-banner .banner-link {
	display: flex !important;
	justify-content: center !important; /* 💡 前面のロゴを横方向の中央寄せ */
	align-items: center !important;     /* 💡 前面のロゴを縦方向の中央寄せ */
	width: 100% !important;
	height: 100% !important;
	text-decoration: none !important;
	cursor: pointer !important;
	padding: 0 !important;              /* 💡 白い余白の原因だった古いパディングをリセット */
	margin: 0 !important;
}
/* 💡 復活させた前面のロゴ画像自体のサイズ感と余白を適正化 */
.main-banner .banner-link img {
	max-width: 80% !important;          /* 💡 画面幅が縮んでもはみ出さないセーフティ */
	height: auto !important;
	display: block !important;
	margin: 0 auto !important;
}

/* footer
------------------------------------------*/
#footer {
	background: url(../../images/default/bg03.png) no-repeat center center / cover;
	padding: 140px 0;
}
#footer-inner,
#footer-bottom > div {
	position: relative;
	width: 1080px;
	margin: 0 auto;
	color:#fff;
	text-align:left;
}
#footer-inner .mail {
	position:absolute;
	top:0;
	right:0;
}
#footer-inner .tel {
	position:absolute;
	top:10px;
	right:320px;
}
#footer-inner .time {
	position:absolute;
	top:60px;
	right:320px;
}
#footer-bottom {
	background:#323232;
	padding:50px 0 60px;
	font-size: 12px;
}
.footer-copyright {
	color: #999;
	margin:10px 0 0;
}
#footer-bottom .logo{
	position:absolute;
	top:0;
	right:0;
	font-size:18px;
	font-weight:bold;
}
#footer-bottom .location{
	position:absolute;
	top:40px;
	right:0;
}
#footer-bottom .link a{
	color:#fff;
}

/* 固定配置バナー */
.fixed-banner {
	position:fixed;
	top:200px;
	right:-226px;
	display: flex;
	justify-content: space-between;
	box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.5);
	transition: all 0.5s 0s ease;
	z-index: 99999;
}
.fixed-banner:hover {
	right:0;
}
.fixed-banner>div {
	background:#323232;
	width:226px;
	text-align:right;
	font-size:10px;
	color:#fff;
	padding:50px 20px 0;
	box-sizing: border-box;
}
.fixed-banner .time{
	margin:0 0 20px;
}
.fixed-banner02 {
	position:fixed;
	top:410px;
	right:0px;
	box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.5);
	transition: all 0.5s 0s ease;
	z-index: 99999;
}
.pagetop-btn-wrap {
	display: none;
	position: fixed;
	bottom: 40px;
	right: 90px;
	z-index: 9998;
}
#sp-fixed-footer {
	display: none;
}


/* ==========================================================
 * 📱 スマホ用レスポンシブ・ハンバーガー設定（768px以下）
 * ========================================================== */
@media screen and (max-width: 768px) {
    body {
        min-width: 100% !important;
        width: 100% !important;
        overflow-x: hidden !important;
    }
    #container {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }
    
	#header {
        width: 100% !important;
        max-width: 100% !important;
        position: relative !important;
        height: 0 !important; 
        margin-bottom: 0 !important;
        z-index: 999 !important; /* メニュー展開時に裏に隠れるよう設定 */
    }
    #header-inner {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        /* 💡 左右の余白を15pxに固定し、ロゴとメニューを画面の本当の左端・右端へ配置します */
        padding: 20px 15px !important; 
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important; /* 💡 これにより、中のロゴとハンバーガーが自動的に100%同じ高さ（縦中央）で同期します */
        background: transparent !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }
    
    /* 💡 ロゴ画像を最前面に表示させ、背後の写真の上でもしっかり見えるようにします */
    #header .logo {
        position: relative !important; 
        top: 0 !important;   /* 👈 調整いただいた記述を統合 */
        left: 0 !important;  /* 👈 調整いただいた記述を統合 */
        z-index: 1 !important; 
        width: 45% !important;
        max-width: 140px !important;
        margin: 0 !important;
        padding: 0 !important; /* 💡 縦位置がずれる原因となる内側余白をリセット */
        text-align: left !important;
        display: flex !important;
        align-items: center !important;
    }
    #header .logo a {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 0 !important; /* 余計な隙間をリセット */
    }
    #header .logo img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .site-description {
        display: none !important;
    }

    /* ハンバーガーボタン */
    #drawer-btn {
        display: block !important;
        position: relative !important;
        z-index: 9999 !important; 
        width: 30px !important;
        height: 24px !important;
        cursor: pointer !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    #drawer-btn span {
        display: block !important;
        position: absolute !important;
        width: 100% !important;
        height: 3px !important;
        background-color: #fff !important; 
        border-radius: 3px !important;
        transition: all 0.3s ease-in-out !important;
    }
    #drawer-btn span:nth-of-type(1) { top: 0 !important; }
    #drawer-btn span:nth-of-type(2) { top: 10px !important; }
    #drawer-btn span:nth-of-type(3) { top: 20px !important; }

    #drawer-btn.active span:nth-of-type(1) { transform: translateY(10px) rotate(-45deg) !important; }
    #drawer-btn.active span:nth-of-type(2) { opacity: 0 !important; }
    #drawer-btn.active span:nth-of-type(3) { transform: translateY(-10px) rotate(45deg) !important; }

    /* ドロワーメニュー */
    .gnav {
        position: fixed !important;
        top: 0 !important;
        right: -100% !important;
        width: 80% !important;
        height: 100vh !important;
        background: rgba(199, 199, 199, 0.98) !important;
        box-shadow: -5px 0 15px rgba(0,0,0,0.1) !important;
        padding: 80px 20px 40px !important;
        transition: all 0.4s ease !important;
        z-index: 9998 !important;
        overflow-y: auto !important;
    }
    .gnav.active {
        right: 0 !important;
    }
    .gnav-list {
        text-align: left !important;
        width: 100% !important;
    }
    .gnav-list > li {
        float: none !important;
        display: block !important;
        margin: 0 0 20px 0 !important;
        border-bottom: 1px solid #eee !important;
        padding-bottom: 15px !important;
        width: 100% !important;
    }
    .gnav-list a, .gnav-list img {
        display: inline-block !important;
        max-width: 100% !important;
        height: auto !important;
        color: #fff !important;
    }
    .gnav-list ul {
        display: block !important;
        position: static !important;
        width: 100% !important;
        background: transparent !important;
        padding: 10px 0 0 15px !important;
        margin: 0 !important;
        box-shadow: none !important;
    }

    .fixed-banner, .fixed-banner02 {
        display: none !important;
    }
    #footer {
        padding: 60px 0 120px !important;
    }
    #footer-inner, #footer-bottom > div {
        width: 100% !important;
        padding: 0 20px !important;
        box-sizing: border-box !important;
    }
    #footer-inner .mail, #footer-inner .tel, #footer-inner .time,
    #footer-bottom .logo, #footer-bottom .location {
        position: static !important;
        text-align: center !important;
        margin: 15px 0 !important;
        width: 100% !important;
    }

    /* スマホ下部固定ナビ */
    #sp-fixed-footer {
        display: block !important;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 60px;
        background: #323232;
        z-index: 99999;
    }
    #sp-fixed-footer ul {
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 100%;
        margin: 0;
        padding: 0;
        list-style: none;
    }
    #sp-fixed-footer li {
        width: 33.333%;
        text-align: center;
        border-right: 1px solid #444;
    }
    #sp-fixed-footer li:last-child { border-right: none; }
    #sp-fixed-footer a {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        color: #fff;
        font-size: 10px;
        height: 60px;
    }
    #sp-fixed-footer i {
        font-size: 18px;
        margin-bottom: 2px;
        color: #009ee3;
    }

    /* 各コンテンツ共通 */
    #mainimage {
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 0 !important;
        line-height: 0 !important;
    }
    .slideshow li {
        height: 320px !important; /* 👈 ここでスマホ版の背景画像の表示領域を広げました */
    }
    .slideshow li img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important; /* 💡 高さを広げても画像が歪まないようにカバーします */
    }
    #mainimage > img {
        position: absolute !important;
        top: 50% !important; 
        left: 50% !important;
        transform: translate(-50%, -50%) !important; 
        width: 75% !important; 
        max-width: 280px !important;
        margin: 0 !important;
        display: block !important;
        z-index: 10 !important;
    }
    #mainimage-inner {
        width: 100% !important;
        height: auto !important;
    }
    .main-news > div, .main-solution .cont > div, .main-banner ul {
        width: 100% !important;
        padding: 0 20px !important;
        box-sizing: border-box !important;
    }
    .main-news {
        padding: 40px 0 !important;
        margin-top: 0 !important; /* 👈 上の画像とピタッと吸着させます */
    }
    .main-news h2 { position: static !important; text-align: center !important; margin-bottom: 20px !important; }
    .main-news ul { margin: 0 !important; }
    .main-news li { padding: 20px 10px !important; }
    .main-news em { position: static !important; display: block !important; text-align: center !important; margin-top: 20px !important; }
    .main-solution h2 { padding: 40px 20px !important; }
    .main-solution .cont { float: none !important; width: 100% !important; margin: 0 0 20px 0 !important; }
    .main-solution .cont > div { margin: 0 auto !important; width: 100% !important; padding: 30px 20px !important; }

    /* 💡 主要3セクション スマホ調整（中央揃え） */
    .cleaner-section { padding: 50px 0 !important; }
    .cleaner-section .clearfix { width: 100% !important; padding: 0 20px !important; box-sizing: border-box !important; }
    .cleaner-section ul li { display: block !important; }
    .cleaner-section .image { width: 100% !important; height: 240px !important; margin-bottom: 20px !important; }
    .cleaner-section .cont { width: 100% !important; text-align: center !important; padding: 0 !important; }
    .dynamic-title-blue { font-size: 28px !important; text-align: center !important; }
    .dynamic-subtitle-black { text-align: center !important; margin-bottom: 20px !important; }
    .custom-watermark-text { 
        position: absolute !important; 
        /* 💡 3セクションすべての古い個別位置指定（右上や左上など）を完全にリセットします */
        top: 50% !important; 
        left: 50% !important; 
        right: auto !important;
        bottom: auto !important;
        /* 💡 文字の「中心」を基準に、スマホ画面の完全など真ん中にロックします */
        transform: translate(-50%, -50%) !important; 
        
        /* 💡 スマホの画面幅に合わせてダイナミックに広がる大きめのサイズに変更 */
        font-size: 11vw !important; 
        line-height: 1.0 !important; 
        text-align: center !important; /* 💡 2行に改行されている文字もきれいに中央揃えにします */
        white-space: nowrap !important; 
        
        /* 💡 視認性をあげるため、文字色を非常に上品で薄いグレーに固定します */
        color: rgba(0, 0, 0, 0.02) !important; 
        z-index: 1 !important; 
        pointer-events: none !important;
        font-family: 'Arial Black', Impact, sans-serif !important;
    }

    /* 💡 個別セクションごとの古い位置ズレ命令（!important合戦）をここで完全に無効化し、上の「中央揃え」に統一させます */
    .main-ground .custom-watermark-text,
    .main-drone .custom-watermark-text,
    .main-reno .custom-watermark-text {
        top: 50% !important;
        left: 50% !important;
        right: auto !important;
        transform: translate(-50%, -50%) !important;
    }

    /* 💡 WORKS スマホ調整（1枚中央揃えスライダー） */
    .main-gallery { padding: 50px 0 !important; }
    .main-gallery .daisin-sp-works-container { width: 100% !important; }
    .main-gallery ul.daisin-sp-works-slider { display: block !important; width: 100% !important; }
    .main-gallery .daisin-sp-works-container .slick-track { display: flex !important; justify-content: flex-start !important; }
    .main-gallery .daisin-sp-works-container .slick-slide { margin: 0 !important; display: flex !important; justify-content: center !important; }
    .main-gallery .works-card { width: 290px !important; margin: 0 auto !important; box-shadow: 0 4px 10px rgba(0,0,0,0.06) !important; }
    .main-gallery .works-title { text-align: center !important; }
    
	.main-banner {
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }
    .main-banner .clearfix {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .main-banner ul { 
        width: 100% !important; 
        max-width: 100% !important;
        padding: 0 !important; /* 💡 左右に発生していた20pxの白い余白（隙間）を完全にゼロにします */
        margin: 0 !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important; /* 1列縦並び（2段）を維持 */
    }
    .main-banner li { 
        width: 100% !important; 
        max-width: 100% !important;
        margin: 0 !important; /* 💡 バナーとバナーの間の細い隙間だけを残し、横の余白はゼロに */
        height: 220px !important; /* 💡 スマホの画面幅に対して写真とロゴが最も美しく収まる高さ（220px）に微調整 */
        padding: 0 !important;
        background-position: center center !important;
        background-repeat: no-repeat !important;
        background-size: cover !important; /* 背景写真を枠いっぱいに敷き詰める */
        box-sizing: border-box !important;
    }
    
    /* 💡 背景画像の上で、リンクエリアを縦横100%フルカバーにし、かつ中身をど真ん中に集めます */
    .main-banner .banner-link {
        display: flex !important;
        justify-content: center !important; /* 💡 前面のロゴを横方向の中央寄せ */
        align-items: center !important;     /* 💡 前面のロゴを縦方向の中央寄せ */
        width: 100% !important;
        height: 100% !important;
        padding: 0 30px !important;         /* 💡 左右にセーフティ余白を設け、ロゴが画面端にぶつかるのを防ぎます */
        box-sizing: border-box !important;
    }
    
    /* 💡 最重要：不自然なパディングをリセットし、ロゴとVIEW MOREボタンの画像を写真の中に綺麗に内包させます */
    .main-banner p { 
        width: 100% !important;
        height: auto !important;
        padding: 0 !important; /* 💡 古い古い大きなパディング（padding-top: 70px等）を完全にリセットし、見切れを防ぎます */
        margin: 0 !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }
    
    /* 💡 浮かび上がっている「COMPANY」「RECRUIT」のロゴ画像自体をスマホサイズにジャストフィットさせます */
    .main-banner .banner-link img,
    .main-banner p img {
        width: auto !important;
        max-width: 100% !important; /* 👈 どんなにスマホ画面が小さくても、写真の横幅を決してはみ出しません */
        height: auto !important;
        max-height: 140px !important; /* 👈 写真の縦幅（220px）に対しても絶対に上下に飛び出さないセーフティ */
        display: block !important;
        margin: 0 auto !important;
    }

}

/* 💡 PC版バリア（ドロワー隠し） */
@media screen and (min-width: 769px) {
    #drawer-btn, .daisin-sp-works-container .slick-prev, .daisin-sp-works-container .slick-next {
        display: none !important;
    }
}