@charset "utf-8";

input[type="submit"] {
  -webkit-appearance: none;
  border-radius: 0;
}


.zoom-target {
  transform: scale(0.8);
  transition: transform 0.6s ease-out;
  opacity: 0;
  transition: transform 0.6s ease-out, opacity 0.6s ease-out;
}

.zoom-target.active {
  transform: scale(1.0);
  opacity: 1;
}



/* フェードイン用のCSS */
.show2 {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.6s ease-out;
}

.show2.active {
  opacity: 1;
  transform: translateY(0);
}




.sidesubmenu_navbutton  {
  position: relative;
}

.child {
    display: none;
}

.sidesubmenu-item a{
	height: 59px;
    background-color: #3EA60C;
    color: #fff!important;
    padding-left: 10px;
    display:block;
    width:100%;
 
}	
.sidesubmenu-item a:visited  {
    color: #fff!important;
}






.wp-pagenavi {
	clear: both;
	text-align:center;
	padding-top:40px;
	padding-bottom:40px;

}
.wp-pagenavi a, .wp-pagenavi span {
	color: #3EA60C;
	background-color: #FFFFFF;
	padding: 8px 15px;
	margin: 0 2px;
	white-space: nowrap;
	-webkit-transition: 0.2s ease-in-out;
	-moz-transition: 0.2s ease-in-out;
	-o-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
	text-align: center;
	text-decoration: none;
	border: thin solid #3EA60C;
}
.wp-pagenavi a:hover{
	color: #fff!important;
	background-color: #3EA60C;
    }
.wp-pagenavi span.current{
	color: #fff!important;
	background-color: #3EA60C;
    }
	
	
	






/* =============================================================================
   基本設定
   ========================================================================== */


*, *:before, *:after {
box-sizing: border-box;

}


html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:bottom;
    background:transparent;
    font-style: normal;
    font-weight: normal;
  
}




/**html**/
html{
	height:100%;
	width: 100%;
	margin: 0!important;
    padding: 0!important;
}




body {
	color: #333;line-height: 1.6;
	font-size: 16px;
	font-family: "Hiragino Kaku Gothic ProN", "Meiryo", "Noto Sans JP", sans-serif;
	margin: 0!important;
    padding: 0!important;
    width: 100%;
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

#overwrap {overflow: hidden;position: relative;}
a {color: #333;text-decoration: none;}
a:hover {color: #FF9326;-webkit-transition: 0.3s ease-in-out;-moz-transition: 0.3s ease-in-out;-o-transition: 0.3s ease-in-out;transition: 0.3s ease-in-out;}
a:hover img {opacity: 0.8;filter: alpha(opacity=80);-moz-opacity: 0.8;-webkit-transition: 0.3s ease-in-out;-moz-transition: 0.3s ease-in-out;-o-transition: 0.3s ease-in-out;transition: 0.3s ease-in-out;}
img {width: auto;max-width: 100%;height: auto;vertical-align: bottom;}
em {font-style: normal;}
h1, h2, h3, h4, h5, h6 {font-weight: normal;}
ul {list-style: none;}
sup {vertical-align: super;}
sub {vertical-align: sub;}


p{margin: 0;padding: 0;}


a:visited,
a:active {
  color: #BBBBBB; /* 現在のテキスト色を維持 */
}


/* ========================================================================== */
.mincho {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	-o-transform: rotate(0.028deg);
	-ms-transform: rotate(0.028deg);
	-moz-transform: rotate(0.028deg);
	-webkit-transform: rotate(0.028deg);
	transform: rotate(0.028deg);
}



html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  background-color: transparent !important;

}

/* コンテンツ全体をラップ */
.wrapper {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
 
  position: relative;
  margin: 0 auto;
  width: 100%;
  background-color: transparent !important;
}





/**clear**/
.clear:after {
 content:".";
 display:block;
 visibility:hidden;
 clear:both;
 height:0;
}

.clear{
	min-height:1px;
	clear: both;
	float: none;

}












/* =========================PC=========================================== */
@media screen and (min-width: 768px) {


	/*page-top*/
	#page-top {
		position: fixed;
		bottom: 50px;
		right: 50px;
		font-size: 77%;
		z-index: 100;
	}
	#page-top a {
		text-decoration: none;
		width: 80px;
		text-align: center;
		display: block;
		border-radius: 5px;
		background-image: url(../img/top_bt.png);
		height: 80px;
		padding-top: 0px;
		padding-right: 0;
		padding-bottom: 0px;
		padding-left: 0;
		text-indent: -9999px;
		background-repeat: no-repeat;
	}
	#page-top a:hover {
		background-image: url(../img/top_bt.png);
		background-repeat: no-repeat;
		background-position: 0px -80px;
		height: 80px;
		width: 80px;
			transition: color 0.5s;
	}
 
 
 

.sptell {
	display: none;
}
  

.sp {
	display: none;
}





:root{
  --c1:#1a73e8;         /* メインカラー */
  --c1b:#0f5fc4;        /* メイン濃色 */
  --c2:#00bcd4;         /* アクセント（必要なら）*/
  --ink:#222;           /* 文字色 */
  --muted:#666;         /* 補助文字 */
  --bg:#ffffff;         /* 背景 */
  --panel:#ffffff;      /* カード */
  --line:#eee;          /* 境界線 */
}

/* ベース */
*{box-sizing:border-box}
html{font-size:62.5%}
body{font-family: system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif; font-size:1.6rem; line-height:1.8; color:var(--ink); background:var(--bg);}
img{max-width:100%; height:auto; display:block}
a{color:var(--c1); text-decoration:none}
a:hover{color:var(--c1b)}

/* レイアウト */
.container{width:110rem; max-width:calc(100% - 4rem); margin:0 auto}
.section{padding:6rem 0}
.section__title{font-size:2.2rem; text-align:center; color:var(--c1); margin:0 0 3rem; position:relative}
.section__title::after{content:""; display:block; width:6rem; height:.3rem; background:linear-gradient(90deg,var(--c1),var(--c2)); margin:1rem auto 0; border-radius:9999px}

/* ヘッダー */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #fff;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 2px 5px rgba(0,0,0,.04);
  padding: 2.5rem 0;          
}

.header__inner {
  display: flex;
  flex-direction: column;     
  align-items: center;
  justify-content: center;
}

.logo img {
  width: 200px;               
  height: auto;
  margin-bottom: 1rem;
}

.header__tel {
  display: block;
  text-align: center;
}

.tel-link {
  font-weight: 700;
  font-size: 2.5rem;
  color: var(--c1);
}

.tel-link {
  display: inline-flex;       
  align-items: center;        
  font-weight: 900;
  font-size: 2.5rem;
  color: var(--c1);
}

.tel-link i {
  margin-right: .6rem;
  font-size: 2.2rem;          
  line-height: 1;             
  margin-top:10px;
}


/* スクロール後（縮小時） */
.site-header.shrink {
  padding: 1rem 0;             /* 縦幅を縮める */
}

.site-header.shrink .logo img {
  width: 200px;                /* ロゴを小さく */
}

.site-header.shrink .header__tel {
  opacity: 0;                  /* 電話番号は非表示 */
  pointer-events: none;        /* クリックも無効化 */
}


/* Hero */
.hero {
  position: relative;
  color: #fff;
  text-align: center;
  padding: 8rem 0;
  overflow: hidden;
  min-height: 700px;     /* 高さ制限 */
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("../img/key.png") center/cover no-repeat;
  z-index: 0;
}

.hero__inner {
  position: relative;
  z-index: 1;
  max-width: 90rem;
  margin: 0 auto;
  padding: 0 1rem;
  padding-top:50px;

}

.tag {
  display: inline-block;
  font-size: 2.0rem;
  letter-spacing: .08em;
  padding: .3rem 1rem;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 9999px;
  background: rgba(0,0,0,.15);
  backdrop-filter: blur(2px);
}

.hero__title {
  font-size: 4rem;
  line-height: 1.3;
  margin: 1.2rem 0 .8rem;
  text-shadow: 0 2px 8px rgba(0,0,0,.25);
    font-weight: 900;
}

.hero__lead {
  font-size: 2rem;
  opacity: .95;
  text-shadow: 0 1px 6px rgba(0,0,0,.25);
}


.services_images{
  margin: 3rem auto;      /* 上下マージン＋中央寄せ */
  text-align: center;
}
.services_images img{
display: block;
  margin: 0 auto;  
}



/* カード（業務内容） */
.cards{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:2rem}
.card{background:var(--panel); border:1px solid var(--line); border-radius:1.2rem; padding:2rem; box-shadow:0 4px 14px rgba(0,0,0,.04); transition:transform .2s ease, box-shadow .2s ease}
.card:hover{transform:translateY(-2px); box-shadow:0 10px 24px rgba(0,0,0,.08)}
.card h4{margin:0 0 .6rem; font-size:1.8rem}
.card p{margin:0; color:#555}

/* 会社情報（行区切り＋大きめ文字） */
.company{
  background:#f8f9fb;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.company .container{ max-width:90rem; }

/* 行ごとに下線を通す：縦方向のgapは0にして1本線に */
.company__list{
  display:grid;
  grid-template-columns: 24rem 1fr; /* ラベル幅少し広め */
  gap: 0 2.4rem;                    /* 縦0・横だけ余白 */
  margin:0;
}

.company__list dt,
.company__list dd{
  padding: 1.6rem 0;                /* 余裕を持たせる */
  border-bottom: 1px solid var(--line);
  font-size: 1.8rem;                /* 文字大きめ */
  line-height: 1.9;
}

/* ラベルと値のトーン差 */
.company__list dt{
  font-weight:700;
  color:#222;
  letter-spacing:.02em;
}
.company__list dd{ color:#333; }

/* 最終行の線だけ消す */
.company__list > :nth-last-child(-n+2){ border-bottom:none; }

/* フッター */
.site-footer{border-top:1px solid var(--line); background:#fff}
.footer__inner{padding:2rem 0; text-align:center; color:#666; font-size:1.2rem}

/* footer: 文字=白 / 背景=黒 */
.site-footer{
  background:#000;
  border-top:none;            /* 不要なら消す */
}
.footer__inner{
  padding:2rem 0;
  text-align:center;
  color:#fff;                 /* ← 白文字 */
  font-size:1.2rem;
}




/* モバイル専用UIはPCでは非表示 */
.sp-call{display:none}


}
/* ===== Smooth shrink to ~80px (PC only / replace) ===== */
@media (min-width:1024px){
  .site-header{
    --p: 0; /* 0=未スクロール, 1=最大縮小 */
    padding-block: calc(2.5rem - 1.5rem * var(--p)); /* 2.5rem→1rem */
  }

  /* ロゴは高さ基準で補間（100→60px） */
  .logo img{
    width: auto !important;
    height: calc(100px - 40px * var(--p));
    margin-bottom: calc(1rem - 1rem * var(--p));
    will-change: height, margin;
  }

  /* TELは “実測高さ var(--telH)” を height で畳む＋フェード */
  .header__tel{
    height: calc(var(--telH, 120px) * (1 - var(--p)));
    overflow: hidden;
    opacity: calc(1 - var(--p));
    transform: translateY(calc(-8px * var(--p)));
    will-change: height, opacity, transform;
  }

  /* 見栄え（お好みで） */
  .tel-link{
    display: inline-flex;
    align-items: center;
    font-weight: 900;
    font-size: clamp(2rem, 2.5rem - .5rem * var(--p), 2.5rem);
    color: var(--c1);
  }
  .tel-link i{
    margin-right: .6rem;
    font-size: 2.2rem;
    line-height: 1;
  }
}










/* =========================スマホ=========================================== */
@media screen and (max-width: 767px) {


 


.pc {
	display: none;
}


/* page-top */
#page-top {
  display: none !important;
}



:root{
  --c1:#1a73e8;         /* メインカラー */
  --c1b:#0f5fc4;        /* メイン濃色 */
  --c2:#00bcd4;         /* アクセント（必要なら）*/
  --ink:#222;           /* 文字色 */
  --muted:#666;         /* 補助文字 */
  --bg:#ffffff;         /* 背景 */
  --panel:#ffffff;      /* カード */
  --line:#eee;          /* 境界線 */
}

/* ベース */
*{box-sizing:border-box}
html{font-size:62.5%}
body{font-family: system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif; font-size:1.6rem; line-height:1.8; color:var(--ink); background:var(--bg);}
img{max-width:100%; height:auto; display:block}
a{color:var(--c1); text-decoration:none}
a:hover{color:var(--c1b)}

/* レイアウト */
.container{width:100%; max-width:calc(100% - 4rem); margin:0 auto}
.section{padding:6rem 0}
.section__title{font-size:2.2rem; text-align:center; color:var(--c1); margin:0 0 3rem; position:relative}
.section__title::after{content:""; display:block; width:6rem; height:.3rem; background:linear-gradient(90deg,var(--c1),var(--c2)); margin:1rem auto 0; border-radius:9999px}

/* ヘッダー */
.site-header {
  top: 0;
  z-index: 100;
  background: #fff;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 2px 5px rgba(0,0,0,.04);
  padding: 2.5rem 0;          
}

.header__inner {
  display: flex;
  flex-direction: column;     
  align-items: center;
  justify-content: center;
}

.logo img {
  width: 200px;               
  height: auto;
  margin-bottom: 1rem;
}

.header__tel {
  display: block;
  text-align: center;
}

.tel-link {
  font-weight: 700;
  font-size: 2.5rem;
  color: var(--c1);
}

.tel-link {
  display: inline-flex;       
  align-items: center;        
  font-weight: 900;
  font-size: 2.5rem;
  color: var(--c1);
}

.tel-link i {
  margin-right: .6rem;
  font-size: 2.2rem;          
  line-height: 1;             
  margin-top:10px;
}


/* スクロール後（縮小時） */
.site-header.shrink {
  padding: 1rem 0;             /* 縦幅を縮める */
}

.site-header.shrink .logo img {
  width: 200px;                /* ロゴを小さく */
}

.site-header.shrink .header__tel {
  opacity: 0;                  /* 電話番号は非表示 */
  pointer-events: none;        /* クリックも無効化 */
}


/* Hero */
.hero {
  position: relative;
  color: #fff;
  text-align: center;
  padding: 20px 0px 10px 0px;
  overflow: hidden;
   height: 400px;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("../img/key.png") center/cover no-repeat;
  z-index: 0;
}

.hero__inner {
  position: relative;
  z-index: 1;
  max-width: 90rem;
  margin: 0 auto;
  padding: 0 1rem;
  

}

.tag {
  display: inline-block;
  font-size: 1.4rem;
  letter-spacing: .08em;
  padding: .3rem 1rem;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 9999px;
  background: rgba(0,0,0,.15);
  backdrop-filter: blur(2px);
}

.hero__title {
  font-size: 2.5rem;
  line-height: 1.3;
  margin: 1.2rem 0 .8rem;
  text-shadow: 0 2px 8px rgba(0,0,0,.25);
    font-weight: 900;

}

.hero__lead {
  font-size: 1.5rem;
  opacity: .95;
  text-shadow: 0 1px 6px rgba(0,0,0,.25);

}


.services_images{
  margin: 3rem auto;      /* 上下マージン＋中央寄せ */
  text-align: center;
}
.services_images img{
display: block;
  margin: 0 auto;  
}



/* カード（業務内容） */
.cards{list-style:none; margin:0px; padding:0; display:block; grid-template-columns:repeat(3,1fr); gap:2rem}
.card{background:var(--panel); border:1px solid var(--line); border-radius:1.2rem; margin:5px 0px; padding:2rem; box-shadow:0 4px 14px rgba(0,0,0,.04); transition:transform .2s ease, box-shadow .2s ease}
.card:hover{transform:translateY(-2px); box-shadow:0 10px 24px rgba(0,0,0,.08)}
.card h4{margin:0 0 .6rem; font-size:1.8rem}
.card p{margin:0; color:#555}

/* 会社情報（行区切り＋大きめ文字） */
.company{
  background:#f8f9fb;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.company .container{ max-width:90rem; }

/* 行ごとに下線を通す：縦方向のgapは0にして1本線に */
.company__list{
  grid-template-columns: 24rem 1fr; /* ラベル幅少し広め */
  gap: 0 2.4rem;                    /* 縦0・横だけ余白 */
  margin:0;
  padding:10px;
}

.company__list dd{
  padding: 1.6rem 0;                /* 余裕を持たせる */
  border-bottom: 1px solid var(--line);
  font-size: 1.8rem;                /* 文字大きめ */
  line-height: 1.9;
}

/* ラベルと値のトーン差 */
.company__list dt{
  font-weight:700;
  color:#222;
  letter-spacing:.02em;
}
.company__list dd{ color:#333; }

/* 最終行の線だけ消す */
.company__list > :nth-last-child(-n+2){ border-bottom:none; }

/* フッター */
.site-footer{border-top:1px solid var(--line); background:#fff}
.footer__inner{padding:2rem 0; text-align:center; color:#666; font-size:1.2rem}

/* footer: 文字=白 / 背景=黒 */
.site-footer{
  background:#000;
  border-top:none;            /* 不要なら消す */
}
.footer__inner{
  padding:2rem 0;
  text-align:center;
  color:#fff;                 /* ← 白文字 */
  font-size:1.2rem;
}



}



/* デフォルトは非表示（PC） */
.sp-call{ display: none; }

/* ===== SP専用（最大1023px） ===== */
@media (max-width:1023px){
  /* 画面下に固定・グラデ＋影 */
  .sp-call{
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 300;
    background: linear-gradient(90deg, var(--c1), var(--c2));
    box-shadow: 0 -6px 18px rgba(0,0,0,.15);
    display: block;
  }

  /* ボタン本体：中央寄せ・大きめタップ領域 */
  .sp-call a{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    color: #fff;
    text-decoration: none;
    font-weight: 800;
    font-size: 1.8rem;
    padding: 1.4rem 1rem calc(1.4rem + env(safe-area-inset-bottom));
  }

  /* 電話アイコン（Font Awesome 4.5） */
  .sp-call a::before{
    content: "\f095";               /* fa-phone */
    font-family: FontAwesome;
    font-size: 1.6rem;
    line-height: 1;
  }

  /* ちょいインタラクション */
  .sp-call a:hover{ opacity: .9; }
  .sp-call a:active{ transform: translateY(1px); }


}

/* ===== SP固定TELバー：フッターが隠れない調整 ===== */
@media (max-width:1023px){
  :root{ --spcall-h: 64px; } /* ← 足りなければ 72px などに */

  /* 画面下に固定 */
  .sp-call{
    position: fixed; left:0; right:0; bottom:0; z-index:300;
    background: linear-gradient(90deg, var(--c1), var(--c2));
    box-shadow: 0 -6px 18px rgba(0,0,0,.15);
  }

  /* ボタン本体の高さを固定＋安全域ぶん下パディング */
  .sp-call a{
    display:flex; align-items:center; justify-content:center; gap:.6rem;
    height: var(--spcall-h);
    padding: 0 1rem env(safe-area-inset-bottom);
    color:#fff; font-weight:800; font-size:1.8rem; text-decoration:none;
  }
  .sp-call a::before{ content:"\f095"; font-family:FontAwesome; font-size:1.6rem; line-height:1; }


}

@media (max-width:1023px){
  :root{
    --spcall-h: 64px;   /* ボタンの実高さ */
    --spcall-gap: 12px; /* 余白を少し足す */
  }
  body{
    padding-bottom: calc(var(--spcall-h) + var(--spcall-gap) + env(safe-area-inset-bottom));
  }
}