@charset "utf-8";

/*******レイアウト変更202601****/

.top_content01,
.top_content02,
.top_content03
 {
  display: none !important;
}

.contact-card {
  display: none !important;
}



/*******レイアウト変更202601****/

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: #2453A7;
	background-color: #FFFFFF;
	padding: 8px 15px!important;
	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 #2453A7;
}
.wp-pagenavi a:hover{
	color: #fff!important;
	background-color: #2453A7;
    }
.wp-pagenavi span.current{
	color: #fff!important;
	background-color: #2453A7;
    }
	
	
	


	/*page-top*/
	#page-top {
		position: fixed;
		bottom: 70px;
		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;
	}
 



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


*, *: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 {

}



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;

}





#main {
  position: relative; /* もしくは指定なしでもOK */
}






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


  

.sp {
	display: none;
}



 
 

/* =========================
   ヘッダー（PC）
   ========================= */

#head-bg {
  position: relative; /* もしくは指定なしでもOK */
  z-index: auto;      /* ← z-indexの効きを消す*/
  width: 100%;
  color: #fff;
}

.head-nav {
  width: 100%;
  
}

.pc_head {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;  /* 最前面に */
}


.pc_head-inner {
  /*max-width: 1200px;*/
  margin: 0 auto;
  padding: 24px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  
}

/* ロゴ（左上） */
.head_txt01{
  display: inline-block;

  font-size: 1.7rem;
  line-height: 1.2;
  letter-spacing: 0.1em;
  text-decoration: none;
  color: #fff;
  font-weight: 900;      /* 追加 */
}

.head_txt01 a{
  color: #fff;
}

.pcnav {
  margin-right: 180px; /* ← ここを追加するだけでOK */
}


/* グローバルナビ */
.pcnav .head-nav_box {
  display: flex;
  gap: 32px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.pcnav .menu-item a {
  font-size: 0.9rem;
  text-decoration: none;
  color: #fff;
  position: relative;
}

.pcnav .menu-item a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 0;
  height: 1px;
  background: #fff;
  transition: width 0.25s ease;
}

.pcnav .menu-item a:hover::after {
  width: 100%;
}

/* お問い合わせボタン（右上の縦長ボックス） */
.pc-contact-link {
  position: fixed;
  top: 0;
  right: 0;
  width: 135px;
  height: 135px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background: #fff;
  color: #0057a8;
  border-radius: 0;
  z-index: 999;
}




/* アイコン調整（必要なら） */
.pc-contact-icon {
  margin-bottom: 8px;
}

.pc-contact-icon img {

}


.pc-contact-text {
  font-size: 0.85rem;
  letter-spacing: 0.1em;
   color: #0057a8;
}


.pc-contact-link{
 
 
}

.pc-contact-link:hover{
  filter: brightness(0.9);
}


/* =============================
   PCヘッダー（初期：大きめ・透明）
   ============================= */
.pc_head {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: rgba(0,0,0,0);  /* 初期は透明 */
  transition: all 0.4s ease;
}



.pc_head-inner {
  transition: all 0.4s ease;
}

/* 初期ロゴサイズ */
#headlogo_pc_left .head_txt01 h1 {
  transition: all 0.4s ease;
}

/* NAV も高さに合わせる */
.pc_head.scrolled .pcnav .head-nav_box {
  height: 60px;
  line-height: 60px;      /* ← 追加 */
}


/* 初期問い合わせボタン */
.pc-contact-link {
  transition: all 0.4s ease;
}




/* =============================
   スクロール後の縮小ヘッダー
   ============================= */
.pc_head.scrolled {
  height: 60px;
 background: #0082d6;
  z-index: 9999;     /* 最前面に */
}



.pc_head.scrolled .pc_head-inner {
  height: 60px;
}

.pc_head.scrolled #headlogo_pc_left .head_txt01 h1 {
  font-size: 1.6rem;
}

.pc_head.scrolled .pcnav .head-nav_box {
  height: 60px;
}

.pc_head.scrolled .pc-contact-link {
  height: 60px;
  padding: 0 20px;
}

/* アイコン非表示 */
.pc_head.scrolled .pc-contact-icon {
  display: none;
}




/* =====================================
   フッター全体
   ===================================== */
#footer {
  position: relative;
  width: 100%;
    background: #0082d6; /* 明るいブルー */
  /*background: #0057a8; 濃い青領域 */

  padding-bottom: 20px;
  padding-top:30px;
   color: #fff;
  font-family: "Noto Sans JP", sans-serif;

}

/* =====================================
   Contactカード（上部中央）
   ===================================== */
.footer-contact {
  position: absolute;
  top: -160px; /* 白背景側にめり込ませる */
  left: 50%;
  transform: translateX(-50%);
  width: 760px;
  z-index: 10;     /* ← これを追加 */
}

.contact-card {
  background: #0082d6; /* 明るいブルー */
  padding: 60px 40px;
  border-radius: 12px;
  text-align: center;
  color: #fff;
  box-sizing: border-box;
}

/* Contact見出し */
.contact-en {
  font-size: 3rem;
  font-weight: 700;
  margin-bottom: 8px;
}

.contact-ja {
  font-size: 1.4rem;
  margin-bottom: 40px;
  opacity: 0.9;
}

.contact-desc {
  font-size: 1.2rem;
  margin-bottom: 25px;
  opacity: 0.9;
}

/* 電話番号 */
.contact-tel {
    font-size: 1.3rem;
    margin-bottom: 35px;

    display: flex;
    align-items: center; /* ← 縦中央揃え */
      justify-content: center;  /* 横方向の中央揃え */
    gap: 6px;            /* ← TEL. と番号の間隔（任意） */
}

.tel-number {
  font-size: 2rem;
  font-weight: 700;
}

/* メール問い合わせボタン */
.contact-mail-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 300px;
  height: 50px;
  border: 1px solid #fff;
  border-radius: 6px;
  text-decoration: none;
  color: #fff;
  font-size: 1.2rem;
  transition: 0.2s;
}

.contact-mail-btn:hover {
  background: rgba(255,255,255,0.15);
}

/* =====================================
   フッター ナビゲーション部分
   ===================================== */
.footer-nav {
  max-width: 1100px;
  margin: 10px auto 0;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 40px;
}

.footer-col {
  list-style: none;
  padding: 0;
}

.footer-col .head {
  font-size: 1.2rem;
  font-weight: 700;
  margin-bottom: 18px;
}

.footer-col li {
  margin-bottom: 8px;
}

.footer-col a {
  position: relative;
  color: #fff;
  text-decoration: none;
  opacity: 0.85;
  font-size: 1rem;
  transition: 0.2s;
}

/* 下線の初期状態（幅0） */
.footer-col a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px; /* 下線位置を微調整 */
  width: 0;
  height: 1px;
  background: #fff;
  transition: width 0.3s ease;
}

/* ホバー時に下線が伸びる */
.footer-col a:hover {
  opacity: 1;
}

.footer-col a:hover::after {
  width: 100%;
}


/* =====================================
   背景の巨大テキスト
   ===================================== */
.footer-bg-text {
  position: absolute;
  bottom: -40px;
  left: 50%;
  transform: translateX(-50%);

  /* 画面幅に応じて自動調整 */
  font-size: clamp(3rem, 10vw, 12rem);

  font-weight: 900;
  color: rgba(255,255,255,0.07);
  white-space: nowrap;
  pointer-events: none;

  /* 念のための保険（横スクロール防止） */
  max-width: 100%;
  overflow: hidden;
}


.mail-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.mail-icon i {
  font-size: 1.2rem; /* 好きに調整 */
  color: #fff;       /* ボタンの色に合わせる */
}





/* =========================
  下向き三角 Divider（白 → グレー）
========================= */

.divider_down {
  --h: 140px;          /* 三角の深さ */
  --bg: #eef2f4;       /* 下側（次セクション）の色 */

  position: relative;
  width: 100%;
  height: var(--h);
  background: #fff;    /* 上は白 */
  overflow: hidden;
}

/* グレーの三角を下からせり上げる */
.divider_down::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;

  border-left: 50vw solid transparent;
  border-right: 50vw solid transparent;
  border-top: var(--h) solid var(--bg);
}


 .footer-adress_for_pc{
    display: flex;
    align-items: center;
    justify-content: flex-end;

   
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;

    padding-right: 20px;

    background: #0057a8;
    color: #fff;
    font-size: 0.8rem;
    line-height: 1;
    letter-spacing: 0.05em;

    z-index: 999;
  }

}








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

.footer-adress_for_pc{
  display: none; /* まずは非表示 */
}

img {
width: auto;
max-width: 100%;
height: auto;
vertical-align: bottom;
}



.pc {
	display: none;
}

.pc_head {
	display: none;
}


#sp_headlogo_icon a{
display: inline-block;

  font-size: 1.4rem;
  line-height: 1.2;
  letter-spacing: 0.1em;
  text-decoration: none;
  color: #fff;
  font-weight: 900;      /* 追加 */
  padding:20px 0px 0px 15px;
}







/* =====================================
   フッター全体
   ===================================== */
#footer {
  position: relative;
  width: 100%;
  background: #0057a8; /* 濃い青領域 */
  margin-top: 15px;
  padding-bottom: 0px;
   color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  padding-top:20px;
}

/* =====================================
   Contactカード（上部中央）
   ===================================== */
.footer-contact {
  width: 100%;
  z-index: 10;     /* ← これを追加 */
}

.contact-card {
  background: #0082d6; /* 明るいブルー */
  padding: 60px 40px;
  border-radius: 12px;
  text-align: center;
  color: #fff;
  box-sizing: border-box;
}

/* Contact見出し */
.contact-en {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 8px;
}

.contact-ja {
  font-size: 1.0rem;
  margin-bottom: 40px;
  opacity: 0.9;
}

.contact-desc {
  font-size: 0.8rem;
  margin-bottom: 25px;
  opacity: 0.9;
}

/* 電話番号 */
.contact-tel {
    font-size: 1.3rem;
    margin-bottom: 35px;

    display: flex;
    align-items: center; /* ← 縦中央揃え */
      justify-content: center;  /* 横方向の中央揃え */
    gap: 6px;            /* ← TEL. と番号の間隔（任意） */
}

.tel-number {
  font-size: 2rem;
  font-weight: 700;
}

/* メール問い合わせボタン */
.contact-mail-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 300px;
  height: 50px;
  border: 1px solid #fff;
  border-radius: 6px;
  text-decoration: none;
  color: #fff;
  font-size: 1.2rem;
  transition: 0.2s;
}

.contact-mail-btn:hover {
  background: rgba(255,255,255,0.15);
}

.footer-adress {
  color: #fff;          /* 白文字 */
  text-align: center;   /* 中央揃え */
  font-size: 0.8rem;    /* 文字サイズ */
  margin-top: 10px;     /* 適度な余白（必要なら調整） */
  line-height: 1.6;     /* 複数行でも読みやすく */
}


  .divider_down{ --h: 90px; }

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


}



/********fix******/
@media (min-width: 1024px) {


  
}

@media screen and (max-width: 1135px) {
  .pcnav .head-nav_box {
    gap: 20px;
  }

.head_txt01{
  font-size: 1.2rem;
  margin-right:10px;

}
.pc_head.scrolled #headlogo_pc_left .head_txt01 h1 {
  font-size: 1.2rem;
}

  .hero-caption h3,
  .hero-caption h4 {
    white-space: nowrap;
  }
  
  
  
}


/* タブレット縦向き（iPad含む）でスマホヘッダーに切り替え */
@media screen and (max-width: 1023px) and (orientation: portrait) {
  .pc {
    display: none;
  }

  .sp {
    display: block;
  }
  
  #sp_headlogo_icon a{
	display: inline-block;
  font-size: 1.4rem;
  line-height: 1.2;
  letter-spacing: 0.1em;
  text-decoration: none;
  color: #fff;
  font-weight: 900;      /* 追加 */
  padding:20px 0px 0px 15px;
}

.pc_head {
	display: none;
}
.footer-adress {
	/*display: none;*/
}

}