@media (min-width:768px){
.mikkel-center{
		width:90%!important;
		margin:auto!important;
}
}
.mikkel-border-left{
	padding-left:1em!important;
	border-left:10px solid var(--mikkel-color,#000)!important;
}

.green{
--mikkel-color:#d4f35b;
}
.cyan{
--mikkel-color:#7bd8d7;
}
.orange{
--mikkel-color:#fbb03b;	
}


td {
  border: none!important; /* すべての枠線を消す */
}

/*フッター*/
.mikkel-footer-border a{
	color:#64554e!important;
	border-bottom:1px solid #000!important;
	width:fit-content!important;
	font-size:1.1em!important;
	margin-bottom:0.75em!important;
}

/*ヘッダー*/
.menu-item a::after{
border-bottom:2px solid #85ccff!important;	
}

/*インライン画像*/
img .mikkel-inline-baseline{
	padding:0!important;
	vertical-align:text-top!important;
}
img{
	padding:0!important;
	margin:0!important;
	vertical-align:text-top!important;
}

/*字幅*/
body,H1,H2,H3,H4,H5,H6,p{letter-spacing:0.05em;}

/*二重線*/
.mikkel-border-double{
  border-bottom: 6px double black!important;
}

/*　*/
.image-container {
  position: relative; /* 基準点にする */
  display: inline-block; /* 画像サイズに合わせるため */
}

/* 白い膜を作る */
.image-container::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-color: rgba(255, 255, 255, 0.5); /* 半透明の白 */
  opacity: 0; /* 最初は隠しておく */
  transition: 0.3s;
  pointer-events: none; /* 下の画像をクリックできるようにする */
}

/* ホバー時に膜を表示 */
.image-container:hover::after {
  opacity: 1;
}

/**/
.box-h3{
	margin:auto;
	width:300px!important;
}
.mikkel-box{
	border-width:3px!important;
	border-radius:12px!important;
}
.wp-block-button__link{
	border-width:2px!important;
	border-radius:8px!important;
}

/**/
.mikkel-border-green{
	border-bottom:3px solid #d4f35b!important;
}
.mikkel-border-cyan{
	border-bottom:3px solid #7bd8d7!important;
}
.mikkel-border-orange{
	border-bottom:3px solid #fbb03b!important;
}
.mikkel-border-blue{
	border-bottom:3px solid #85ccff!important;
}

/**/
.mikkel-border-green-image{
	background-image:url(https://mikkel.work/wp-content/uploads/2025/12/border-green.png)!important;
	background-repeat: no-repeat!important;
	background-position:50% 100%!important;
	background-size: 100% auto!important;
	overflow: visible!important;
	padding-bottom:0.65rem!important;
}
.mikkel-border-blue-image{
	background-image:url(https://mikkel.work/wp-content/uploads/2025/12/border-blue.png)!important;
	background-repeat: no-repeat!important;
	background-position:50% 100%!important;
	background-size: 100% auto!important;
	overflow: visible!important;
	padding-bottom:0.5rem!important;
	margin-left:0!important;
	width:fit-content!important;
}

/**/
.mikkel-point-blue::before{
content: "●";
color:#85ccff!important;
}
/*茨城で働くページ*/
.mikkel-border-left-blue{
	border-left:10px solid #85ccff!important;
}


/* 本体設定（変更なし） */
.mikkel-background-image-h2 {
  padding-top: calc(35px - 0.7em) !important;
  height: 75px !important;
  position: relative;
  overflow: hidden !important; 
  z-index: 1;
}

.mikkel-background-image-h2 {
padding-top:calc(35px - 0.7em )!important;
height: 75px !important;
position: relative;
}

@media(min-width:768px){
.mikkel-background-image-h2{
background-image: url(https://mikkel.work/wp-content/uploads/2025/12/graph.png) !important;
background-repeat: no-repeat!important;   
background-position:center center!important;
background-size:cover!important;
overflow:hidden!important;
	}
}

@media(max-width:768px){
.mikkel-background-image-h2-double {
  padding-top: calc(35px - 0.7em) !important;
  height: 75px !important;	
	}
}

@media(min-width:768px){
/* 本体（見出し）の設定 */
.mikkel-background-image-h2-double {
  padding-top: calc(35px - 0.7em) !important;
  height: 75px !important;
  position: relative !important;
  
  background-image: url(https://mikkel.work/wp-content/uploads/2025/12/rekishikan.png), url(https://mikkel.work/wp-content/uploads/2025/12/kairakuen.png) !important;
  
  background-repeat: no-repeat, no-repeat !important;
  
  /* 位置の指定：左側(75%の位置) , 右側(右端) */
  background-position: 67.5% center, right center !important;
  
  background-size:25% !important; 
  overflow: hidden !important;
}

/* ▼ 共通設定：キャプションの見た目 ▼ */
.mikkel-background-image-h2-double::before,
.mikkel-background-image-h2-double::after {
  position: absolute !important;
  bottom: 0 !important;
  color: #fff !important;
  font-size: 10px !important;
  padding: 5px 8px !important;
  text-shadow: 0 0 2px rgba(0,0,0,0.9) !important;
  line-height: 1.2 !important;
  z-index: 2 !important;
  font-weight: normal !important;
  background: none !important;
}

/* ▼ 1つ目のキャプション（左側：歴史館）の設定 ▼ */
.mikkel-background-image-h2-double::before {
  content: "歴史館" !important;
  right: 25% !important; /* 右端から25%の位置 */
}

/* ▼ 2つ目のキャプション（右側：偕楽園）の設定 ▼ */
.mikkel-background-image-h2-double::after {
  content: "偕楽園" !important;
  right: 0 !important; /* 右端 */
}
}
