/* =========================
header
========================= */

/* ナビ背景 */
.l-header__gnav{
  background:#fff;
}
/* ナビ文字 */
.l-header__gnav ul{
    color: var(--border-color);
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
    background-color: #ffffff;
    background-image: radial-gradient(#dcdcdc 0.8px, transparent 0.8px);
    background-size: 4px 4px;
}
.c-gnav>.menu-item>a .ttl {
  font-size: 18px;
}

/* ナビリンク */
.c-gnav a{
  color:#333;
  font-weight:600;
}

/* ホバー */
.c-gnav a:hover{
  opacity:.7;
}
/* 下線の位置調整（余白をつける） */
.c-gnav > .menu-item > a {
  position: relative;
}
.l-header__gnav .c-gnav > .menu-item > a::after {
  bottom: 5px; /* ← 少し近め */
}
.l-fixHeader .c-gnav > .menu-item > a::after {
  bottom: -8px; /* ← さっきの値 */
}

.c-gnav > .menu-item > a::after {
  height: 2px;
  background: linear-gradient(
    to right,
    orange 0%,
    orange 33.33%,
    #1dd0da 33.33%,
    #1dd0da 100%
  );
}

/* ヘッダーウィジェットのCSS */
.header-contact{
  display:flex;
  gap:12px;
  align-items:center;
}

.header-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  line-height:1;
  padding:8px 16px;
  border-radius:6px;
  text-decoration:none;
  margin-bottom: 5px;
}

.header-btn--tel {
    background: #ffffff;
    color: #000000;
    border-radius: 30px;
    border: solid 1px #000;
    box-shadow: 3px 3px 0 #000;
    font-family: "Nova Round", sans-serif;
    font-size: 1.5rem;
}
.header-btn--tel:hover {
    background: #61b5bf;
    border-color: transparent;
    transform: translateY(-2px);
    box-shadow: none;
	opacity: 0.7;
}




.header-btn--mail{
    background: #000;
color: #fff;
    border-radius: 30px;
    border: solid 1px #000;
    box-shadow: 3px 3px 0 #fff;
}
.header-btn--mail:hover {
	border-color: transparent;
    transform: translateY(-2px);
    box-shadow: none;
	opacity: 0.7;
}

.header-contact .header-btn--tel::before{
  content: "";
  display:inline-block;
    width: 40px;
    height: 40px;
  margin-right:6px;
  background:url("/wp-content/themes/swell_child/img/jl-ic-tel.svg") no-repeat center / contain;
}

.header-contact .header-btn--mail::before{
  content: "";
  display:inline-block;
    width: 40px;
    height: 40px;
  margin-right:6px;
  background:url("/wp-content/themes/swell_child/img/jl-ic-mail.svg") no-repeat center / contain;
}
.l-fixHeader .l-fixHeader__logo{
	display:none;
}
.l-fixHeader .l-fixHeader__gnav{
    background: #fff;
    margin: 10px 0;
    padding: 12px 30px;
    border-radius: 50px;
    border: solid 1px #000;
    box-shadow: 3px 3px 0 #000;
}

@media (min-width: 960px){

  .l-header.-parallel .l-header__logo{
    width:auto;
    text-align:left;
	padding: 0 0 0 20px;
  }

  .l-header.-parallel .w-header{
    width:auto;
	margin-left:auto;
	margin-right: 20px;
  }
}
/* --------------------------- */
/* ここからブログパーツヘッダー */
/* SPヘッダー */
.jl-sp-header{
	position:fixed;
	max-height: 60px;
	top:9px;
	left:8px;
	right:8px;
	border:2px solid #000;
	border-radius:13px;
	background:#fff;
	margin:7px;
	padding:1px 10px;
	z-index:9998;
	transition: opacity 0.3s ease;
}

.jl-sp-header.hidden {
    display: none !important; 
}

.jl-sp-menu-inner{
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:#fff;
padding:20px;
z-index:9999;
overflow:auto;
}
/*  closeボタン */
.jl-sp-close{
	font-weight:700;
	font-size:18px;
	margin-bottom:30px;
	cursor:pointer;
	display:flex;
	justify-content:flex-end;
}

/* menuボタン */
.jl-menu-btn{
display:flex;
align-items:center;
gap:6px;
border:2px solid #000;
border-radius:20px;
padding:6px 12px;
background:#fff;
font-weight:700;
}

/* ハンバーガー */
.jl-menu-icon{
width:18px;
height:2px;
background:#000;
position:relative;
display:block;
}

.jl-menu-icon::before,
.jl-menu-icon::after{
content:"";
position:absolute;
width:18px;
height:2px;
background:#000;
left:0;
}

.jl-menu-icon::before{
top:-6px;
}

.jl-menu-icon::after{
top:6px;
}

/* メニュー */
.jl-sp-menu{
display:none;
margin-top:20px;
flex-direction:column;
gap:14px;
}

/* TEL / MAILボタン配置 */
.jl-sp-contact{
	display:flex;
	flex-direction:column;
	gap:15px;
	margin-bottom:40px;

}
/* ナビメニュー */
.jl-sp-nav ul{
	list-style:none;
	padding:0;
	margin:0;
}

.jl-sp-nav li{
	border-bottom:2px solid #000;
}

.jl-sp-nav a{
	display:block;
	padding:16px;
	font-size:18px;
	font-weight:700;
	text-decoration:none;
	color:#000;
}

.jl-sp-nav li:last-child{
  border-bottom:none;
}

/* --------------------
 * SPヘッダー ロゴ
 * -------------------- */
/* SPヘッダー：ロゴだけ少しはみ出させる */
.jl-sp-header {
  overflow: visible;
}
.jl-logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.jl-logo__link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  line-height: 1;
}

.jl-logo__img {
  display: block;
  width: 130px;
  height: auto;
  transform: translateY(-7px);
}

/* @media (max-width: 420px) {
  .jl-logo__img {
    width: 120px;
  }
} */

/* フッター位置で非表示に */

@media (min-width:960px){
.jl-sp-header{
display:none;
}
}
@media (max-width:959px){

.l-header{
display:none;
}

.l-header__gnav{
display:none;
}
	.jl-sp-header{
display:flex;
justify-content:space-between;
align-items:center;
}
/* SWELL固定ヘッダーを消す */
.l-fixHeader{
display:none !important;
}

}

