/*
Theme Name: twentyseventeen-child
Template: twentyseventeen
*/
/*↓メニューから飛んだ場合の上部見切れ防止対策*/
/* 画面幅が768px以上の設定（PC・タブレット向け） */
@media (min-width: 767px) {
  html {
    /* スマホ（767px以下）のときはこの指定が完全に無視されます */
    scroll-padding-top: 50px;
  }
}
/*↑*/

.custom-logo-link {
    display: none;
}
.top_eyecatch{

	height:60vw;
	max-height:500px;
}
.toplogo{
	background-image:url("http://www.kasama-group.com/mineholdings/wp-content/uploads/2026/04/top-logo.png");
	background-size: auto 100% ;
	background-repeat:no-repeat;
	background-position: center;
	display:flex;
	vertical-align:middle !important;
  align-items: center; /* 上下中央 */
  justify-content: center; /* 左右も中央にする場合 */	
	height:100%;
	max-height:500px;
}
/* トップメニューを右寄せにする */
@media screen and (min-width: 768px) {
    .navigation-top .wrap {
        text-align: right;
    }
    .navigation-top .main-navigation {
        float: none;
        display: inline-block;
    }
}

.site-branding {
	/*border:solid green !important;*/
    /*padding-top: 3em;*/   /* 上部の余白はお好みで調整 */
    /*padding-bottom: 3em;*/ /* 下部の余白はお好みで調整 */	
	background-image:url("http://www.kasama-group.com/mineholdings/wp-content/uploads/2026/04/top-consulting.jpg");
	background-size:100%;
	background-repeat:no-repeat !important;
	background-position: center;
	min-height:100px;
	padding-top: 0 !important;
	padding-bottom :10px !important;
	width:100% !important;
	vertical-align:middle !important;
}

.panel-content .entry-header{
	/*border:solid green;*/
	display: flex !important;  
	/*margin-bottom:10px !important;*/
	margin: 0 auto 10px auto !important;
	padding:auto !important;
	width:100% !important;
	vertical-align:middle !important;
	/*background-image:url("http://www.kasama-group.com/mineholdings/wp-content/uploads/2026/04/バナー.png");
	background-size:100%;
	background-repeat:no-repeat !important;
	background-position: center;*/
	align-items: center;
	min-height:50px;
	max-width:800px;
}

.entry-title{
	margin-top:50px;
	margin-left:0.5em;
	font-size:clamp(1.2rem,1vw + 1rem, 2rem) !important;
	font-family: "メイリオ","Meiryo" !important;
/*	text-shadow: 
      1px -1px 0 #767676, 
      -1px 2px 1px #787777, 
      -2px 4px 1px #828181, 
      -3px 6px 1px #8f8e8d, 
      -4px 8px 1px #9e9c9c, 
      -5px 10px 1px #adabab, 
      -6px 12px 1px #bcbbba, 
      -7px 14px 1px #cbc9c8; 
*/
	/*color:#444444 !important;
	text-align:left;
	border:solid yellow;*/
/*	animation: text08 1s cubic-bezier(0.165, 0.84, 0.44, 1);*/

  /* 線の太さを文字の高さの半分（40%〜60%など）に設定 
  background: linear-gradient(90deg, #228B22 0%, #50A62D 33%, #7EC339 66%, #ADDF45 100%);
  background-size: 100% 10%;
  background-position: bottom;
  background-repeat: no-repeat;/*
  /*padding-bottom: 2px;  文字と線の間に少し隙間をあける */
}

@keyframes text08 {
	0% {
		opacity: 0;
		transform: translateX(20vw) scaleX(1) scaleY(1) skew(-60deg);
	}
	10% {
		opacity: 1;
	}
	80% {
		transform: scaleX(0.3) scaleY(1.2);
	}
	100% {
		transform: scaleX(1) scaleY(1);
	}
}
/*メニューリンク先　前コンテンツに埋め込む*/
.ancer_target{
	/*テスト用に可視化
	height:0px;
	width:100px;
	border:solid red;
	*/
}
.page-one-column .wrap{
	/*border:solid yellow;*/
	width:100% !important;
	margin:auto !important;
	max-width:100%;
}
.page-one-column .site-branding .wrap{
	text-align:center;
	vertical-align:middle !important;
	top:0 !important;
	bottom:0 !important;
	left:0 !important;
	right:0 !important;
	height:100% !important;
}

.site-branding-text{
	/*border:solid pink;*/
	text-align:center;
	font-weight: bold;	
}

.site-description{
	/*border:solid blue;*/
	text-align:center;
	color:black !important;	
	 /*text-shadow: 20px 20px 40px rgba(255, 255, 255, 1);*/
	 /*text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
	text-shadow: 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #fff;
	text-shadow: 2px 2px 1px white;*/

	/* 文字の周りに白フチをつける 
  text-shadow: 
     2px  2px 0 #fff,
    -2px  2px 0 #fff,
     2px -2px 0 #fff,
    -2px -2px 0 #fff,
     2px  0px 0 #fff,
    -2px  0px 0 #fff,
     0px  2px 0 #fff,
     0px -2px 0 #fff;*/

	
	
	background-color: rgba(255, 255, 255, 0.7); /* 白の60%の不透明度 */
  padding: 4px 12px; /* 文字の周りに少し余白を作る */
  border-radius: 4px; /* 好みで角を少し丸める */
  display: inline-block; /* 文字の幅に合わせる場合 */
	
	
	margin: 0;	
}


/*contents*/
.page-one-column .panel-content .wrap{
	width:100% !important;
	margin:0 !important;
	max-width:100%;	
	font-size: 0.9rem;
	text-align:center!important;
}


td ul{
	padding-left:1.5em;
	list-style-type:square !important;
	margin:0;
}


#pl-29{
	max-width:1500px !important;
	margin:0 !important;
	left:0 !important;
	right:0 !important;
}
/*
.profile{
	text-align:left !important;
}
*/

.profile-detail{
	width: 100%;
	margin: 0 auto;	
	max-width:800px;
}
.profile-detail table{
	/*background-color: rgba(255, 255, 255, 0.2) !important;*/
		margin: 0 auto;
	border-collapse: collapse;/*境界線共有*/
	width:100%;
}
.profile-detail th{
	padding:1em 2.5em;
	width:30%;
	max-width:400px;
	border-bottom:solid 1px #228B22;
	white-space: nowrap;
	/*letter-spacing: 2em !important;*/
	/*text-justify: inter-ideograph !important;日本語向け：文字間隔を調整 */
	text-align-last: justify !important;  /*最終行も強制的に均等割付 */
}
.profile-detail td{

	padding:1em 1.5em;
	border-bottom:solid 1px #ADDF45;
	text-align-last:left;
}
.profile-history{
	width: fit-content;
	margin: 0 auto;
}
.profile-history-title{
	width: fit-content;
}
.profile-history th{
	padding:1em 2em;
	vertical-align:top !important;
		text-align-last: justify !important;  /*最終行も強制的に均等割付 */
	white-space: nowrap;
}

.noborder table {
  border-collapse: collapse; /* セルの枠線を結合する */
  border: none !important; /* テーブルの外枠をなくす */
}

.noborder table th,
.noborder table td {
  border: none !important; /* セルの枠線をなくす */
	margin:0;
	padding:0;
	width: fit-content;
}
.tel-fax-container {
  display: flex;       /* 子要素（span）を横並びにする */
  flex-wrap: wrap;     /* 画面が狭くなったら折り返す設定 */
 /* gap: 10px 20px;       span同士の隙間（縦の隙間 横の隙間）※お好みで調整 */
	
}

.tel-fax-container span {
  white-space: nowrap; /* これが肝！span内のテキストを絶対に改行させない */
	margin-right:20px;
}

@media (max-width: 768px) { 
		.profile-detail th{
		font-size:0.8em;
		padding:1em 0em;
		text-align-last:none;
		width:15%;
	}
		.profile-history th{
		font-size:0.8em;
		padding:1em 0em;
		text-align-last:none;
			
	}	
}
.profile-history .td{
	padding:1em 1.5em;

}
.vertical-line,.vertical-line-end{
		padding:0;
  position: relative;
  width: 2px !important; /* 線の太さ */
  height: 100px; /* 線の長さ */
  background-color: #556B2F; /* 線の色 */
  border-radius: 2px; /* 縦線自体を少し丸くする（オプション） */
  margin: 20px;
}

/* 上の丸 */
.vertical-line::before {
  content: '';
  position: absolute;
  top: -4px; /* 丸の直径の半分を上にずらす */
  left: 50%;
  transform: translateX(-50%);
  width: 12px; /* 丸の直径 */
  height: 12px; /* 丸の直径 */
  background-color: #556B2F; /* 丸の色 */
  border-radius: 50%; /* 丸にする */
}
.vertical-line-end::before {
  content: '';
  position: absolute;
  top: -4px; /* 丸の直径の半分を上にずらす */
  left: 50%;
  transform: translateX(-50%);
  width: 12px; /* 丸の直径 */
  height: 12px; /* 丸の直径 */
  background-color: #556B2F; /* 丸の色 */
  border-radius: 50%; /* 丸にする */
}
/* 下の丸 */
.vertical-line-end::after {
  content: '';
  position: absolute;
  bottom: -4px; /* 丸の直径の半分を下にずらす */
  left: 50%;
  transform: translateX(-50%);
  width: 12px;
  height: 12px;
  background-color: #556B2F;
  border-radius: 50%;
}



.profile-history td{
	text-align:left;
}
#post-281{

	width:100%!important;
	margin:0;
	background-color:ivory;
}
#post-281 .entry-header{
	display:none !important;
}
#post-281 .wrap{
	/*padding:0;*/
		background-color:ivory;
}
.fade-in4 {
  opacity: 0; /* 最初は透明 */
  animation: fadeIn 6s forwards; /* 2秒かけて実行 */
}
	
.fade-in2 {
  opacity: 0; /* 最初は透明 */
  animation: fadeIn 3s forwards; /* 2秒かけて実行 */
}
/*文字フェードイン*/
@keyframes fadeIn {
  to {
    opacity: 1; /* 透明から不透明へ */
  }
}



.top-title-area{
	padding-top:40%;
	padding-bottom:30%;
	display: block;
	
}
	
.top-title{

	font-size: clamp(1.5rem, 3vw + 1rem, 3.5rem);
	font-weight: 800;
	/*text-shadow: 2px 2px 2px white;*/
		/* 文字の周りに白フチをつける */
  text-shadow: 
     2px  2px 0 ivory,
    -2px  2px 0 ivory,
     2px -2px 0 ivory,
    -2px -2px 0 ivory,
     2px  0px 0 ivory,
    -2px  0px 0 ivory,
     0px  2px 0 ivory,
     0px -2px 0 ivory;
}
.top-subtitle{

	font-size: clamp(0.5rem, 0.6vw + 1rem, 2.5rem);
	font-weight: 600;
	/*text-shadow: 2px 2px 2px white;*/
	/* 文字の周りに白フチをつける */
  text-shadow: 
     2px  2px 0 ivory,
    -2px  2px 0 ivory,
     2px -2px 0 ivory,
    -2px -2px 0 ivory,
     2px  0px 0 ivory,
    -2px  0px 0 ivory,
     0px  2px 0 ivory,
     0px -2px 0 ivory;
}
.top-name{
	display: block;
	font-family:sans-serif;
	font-size: clamp(1rem, 4vw + 1rem, 4rem);
	font-weight:800;
	color:#003366;
	margin-top:0;
	margin-bottom:0;
}
@media screen and (max-width: 768px) {
	.top-name{
		font-size:2em !important;
	}
}
.catchphrase{
	font-family:sans-serif;
	font-size: clamp(1rem, 1.25vw + 0.5rem, 2rem);
	color:#003366;
}

.navigation-top {

    background-image: url('http://www.kasama-group.com/mineholdings/wp-content/uploads/2026/03/logo_mh.jpg');
    background-repeat: no-repeat;
    background-position: left;
    background-size: contain;
}


/*背景画像重ねる*/
.panel-content{
	/*border:solid yellow;*/
	width:100% !important;
	text-align:center !important;
	padding:auto !important;
}
.panel-content .wrap{
	/*border:solid blue;*/
	padding-top:0px;
	/*padding:auto !important;*/
	text-align:center !important;
/*	background-color:#f5f5f5;*/
}
.entry-content{	
	position:relative;
	text-align:center !important;
	/*border:solid green;*/
}
.philosophy {	
	margin: 0 auto;
	text-align:center;
	/*text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);*/
	color:black;
	max-width:800px;
}

.container_flex{
	position:relative;
	margin: 2em auto;
    display: flex;
	font-size: clamp(0.5rem, 0.5vw + 0.5rem, 1.5rem);
}
.container_img {
	width: 25%;
	aspect-ratio: 9 / 16;
	border-radius:10px;/*角丸*/
	/*height:250px;*/
	/*opacity: 0.7;*/
	color:white;

/*	text-shadow:
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000,
		0 0 3px #000;*/
text-shadow: 0 0 10px #000,0 0 15px #000;	
	background-size:100%;
	background-repeat:no-repeat !important;
	background-position: center;
	text-align:center;
	padding-top:5%;
	animation: zoom-animation 12s infinite;
}
.container_consulting {
	background-image:url('http://www.kasama-group.com/mineholdings/wp-content/uploads/2026/05/consulting.png');
	animation-delay: 0s;
}
.container_estate {
	background-image:url('http://www.kasama-group.com/mineholdings/wp-content/uploads/2026/05/estate.png');
	animation-delay: 3s;
}
.container_environment {
	background-image:url('http://www.kasama-group.com/mineholdings/wp-content/uploads/2026/05/environment.png');
	animation-delay: 6s;

}
.container_amusement {
	/*border:solid yellow;*/
	background-image:url('http://www.kasama-group.com/mineholdings/wp-content/uploads/2026/06/amusement.png');
	animation-delay: 9s;

}

@keyframes zoom-animation {
0% {
    transform: scale(1);
  }
  12.5% { /* 8秒のなかの最初の1/8（1秒）で拡大 */
    transform: scale(1.2);
  }
  25% { /* 次の1/8（1秒）で戻る */
    transform: scale(1);
  }
  100% {
    transform: scale(1); /* 残りの時間は静止 */
  }
}
.container_text {
	padding-top:2em;
	margin: 0 auto;
	text-align:left;
	width: fit-content;
	/*opacity: 0.7;*/

}

/*企業概要で使用*/
.summary{
	position: relative;
	max-width:800px;
	margin-left:auto;
	margin-right:auto;
}
.summary_back{
	background-image:
		linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), /* フィルター層 */
		url('http://www.kasama-group.com/mineholdings/wp-content/uploads/2026/05/summary_back.png'); /* 画像層 */
 	background-size: 100%;
	background-repeat:no-repeat;
	position:relative;
	margin: 0 auto;
	width:100%;
	max-width:1000px;
	aspect-ratio: 1408 / 768;

}
.summary_text_mobile{
	text-align:left;
}

.summary_text{
	text-align:center !important;
	color:black;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	width: fit-content;
	font-weight:600;
	line-height: 3em;
	text-shadow:
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff,
		0 0 3px #fff;   	
	  /* -webkit-font-smoothing: antialiased; Chrome, Safari, Edge */
  /* -moz-osx-font-smoothing: grayscale;   Firefox */

	}
/*
.fadein {
    opacity: 0;
    animation: fadein 3s ease forwards;
	/*
	filter: drop-shadow(0 0 10px white);*/
/*
}
@keyframes fadein {
    100% {  opacity: 1;}

}
以下遅延の指定 
.txt01 {animation-delay: 0s;}
.txt02 {animation-delay: 0s;}
.txt03 {animation-delay: 1s;}
.txt04 {animation-delay: 2s;}
.txt05 {animation-delay: 3s;}
.txt06 {animation-delay: 4s;}*/
/* 各要素の遅延設定（.is-animated がついてからカウントが始まります） ###########*/
/* ベースとなるアニメーションの設定（共通） */
.fadein {
  opacity: 0;
  transform: translateY(20px); /* 少し下から浮き上がらせる場合 */
  transition: opacity 1s, transform 1s;
}

/* 画面に入ったら（クラスがついたら）アニメーションを実行 */
.is-animated .fadein {
  opacity: 1;
  transform: translateY(0);
}
.is-animated .txt01 { transition-delay: 0s; }
.is-animated .txt02 { transition-delay: 0s; }
.is-animated .txt03 { transition-delay: 0.5s; } /* 1秒だと間伸びするため少し短縮がおすすめ */
.is-animated .txt04 { transition-delay: 1s; }
.is-animated .txt05 { transition-delay: 1.5s; }
.is-animated .txt06 { transition-delay: 2s; }



/* 画面幅が1100px以下になったら縦並びにする */
@media screen and (max-width: 1100px) {
	/*企業理念の画像*/
	.container_img {
		width:50%;
		aspect-ratio: 18 /10; /* 画像の縦横比を保つ */
	}

}


/*スマホ表示用*/
@media screen and (max-width: 400px) {

	.philosophy, .summary{
		width:100%;
	}

}
.for_pc_text{
	line-height:2em !important;
}
/* 画面幅が768px以下になったら縦並びにする */
@media (max-width: 768px) {

	.summary_back {
		/*top:0;*/
		width:100%;
		height:110%;
	}
	.for_mobile_text{
		line-height:2em !important;
		display: block;
	}
	.for_pc_text{
		display: none;
	}
}
@media screen and (min-width: 768px) {
	.for_mobile_text{		
		display: none;
	}
	.for_pc_text{
		display: block;
	}
}

.twentyseventeen-panel{
	background-image: url('http://www.kasama-group.com/mineholdings/wp-content/uploads/2026/05/back.png');
	background-size: cover;
    background-attachment: fixed;
}