/*
Theme Name: Xwrite child
Version: 2.0.0
Template: xwrite
*/


/* ========================================
   フクマ薬局 ヘッダー完成版
   PC：ロゴ｜メニュー｜ボタン
======================================== */

#header{
  position:relative;
  z-index:100;
  width:100%;
  background:#fff;
  border-bottom:1px solid #eeeae4;
}

#header .fk-header-container{
  width:100%;
  max-width:none;
  margin:0 auto;
  padding:14px 32px;
  box-sizing:border-box;
}

/* 全体を横並び */
.fk-header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  width:100%;
  min-height:72px;
}

/* ========================================
   ロゴ
======================================== */

.fk-header-row .headerInfo{
  display:block !important;
  flex:0 0 auto;
  width:auto !important;
  margin:0 !important;
  padding:0 !important;
}

.fk-header-row .siteInfo{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
}

.fk-header-row .siteInfo__logo{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
}

.fk-header-row .siteInfo__title{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1 !important;
}

.fk-header-row .siteInfo__title a{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
}

.fk-header-row .siteInfo__logo img,
.fk-header-row .siteInfo__title img{
  display:block !important;
  width:auto !important;
  max-width:210px !important;
  max-height:58px !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* キャッチフレーズは非表示 */
.fk-header-row .siteInfo__desc{
  display:none !important;
}

/* ========================================
   メニュー
======================================== */

.fk-header-nav{
  flex:1 1 auto;
  min-width:0;
}

.fk-header-nav__list{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex-wrap:nowrap !important;
  gap:0 !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}

.fk-header-nav__list > li{
  position:relative;
  flex:0 0 auto;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}

.fk-header-nav__list > li::before,
.fk-header-nav__list > li::after{
  display:none !important;
}

.fk-header-nav__list > li > a{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:44px !important;
  padding:8px 10px !important;
  color:#50493f !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  font-size:15px !important;
  line-height:1.5 !important;
  font-weight:500 !important;
  letter-spacing:.02em !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  transition:color .25s ease;
}

.fk-header-nav__list > li > a:hover{
  color:#5f8748 !important;
  text-decoration:none !important;
}

/* ========================================
   現在ページのみグリーン
======================================== */

.fk-header-nav__list > li.current-menu-item > a,
.fk-header-nav__list > li.current_page_item > a{
  color:#5f8748 !important;
}

/* 親・祖先メニューは通常色 */
.fk-header-nav__list > li.current-menu-ancestor > a,
.fk-header-nav__list > li.current-menu-parent > a,
.fk-header-nav__list > li.current_page_parent > a,
.fk-header-nav__list > li.current_page_ancestor > a{
  color:#50493f !important;
}
/* ========================================
   子メニュー
======================================== */

.fk-header-nav__list .sub-menu{
  position:absolute !important;
  top:100% !important;
  left:0 !important;
  z-index:9999 !important;
  display:none !important;
  min-width:220px !important;
  margin:0 !important;
  padding:8px 0 !important;
  background:#fff !important;
  border:1px solid #eeeae4 !important;
  box-shadow:0 10px 24px rgba(0,0,0,.10) !important;
  list-style:none !important;
}

.fk-header-nav__list li:hover > .sub-menu{
  display:block !important;
}

.fk-header-nav__list .sub-menu li{
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}

.fk-header-nav__list .sub-menu li::before,
.fk-header-nav__list .sub-menu li::after{
  display:none !important;
}

.fk-header-nav__list .sub-menu a{
  display:block !important;
  padding:10px 16px !important;
  color:#50493f !important;
  background:#fff !important;
  border:none !important;
  font-size:12px !important;
  line-height:1.6 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}

.fk-header-nav__list .sub-menu a:hover{
  color:#5f8748 !important;
  background:#f7f6f1 !important;
}

/* ========================================
   右側ボタン
======================================== */

.fk-header-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex:0 0 auto !important;
  gap:6px !important;
  margin-left:auto !important;
  padding:5px 8px 5px 0 !important;
}

.fk-header-action{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:66px !important;
  height:32px !important;
  padding:0 10px !important;
  border-radius:3px !important;
  box-sizing:border-box !important;
  font-size:14px !important;
  line-height:1 !important;
  font-weight:400 !important;
  letter-spacing:.02em !important;
  text-align:center !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  box-shadow:none !important;
  transition:
    opacity .25s ease,
    transform .25s ease;
}

.fk-header-action:hover{
  opacity:.82 !important;
  transform:translateY(-1px);
  text-decoration:none !important;
}

/* 電話 */
.fk-header-action--tel{
  border:1px solid #8b7f6f !important;
  background:#fff !important;
  color:#5f574e !important;
}

/* ご予約 */
.fk-header-action--reserve{
  border:1px solid #8b7f6f !important;
  background:#8b7f6f !important;
  color:#fff !important;
}

/* 問診票 */
.fk-header-action--monshin{
  border:1px solid #5f8748 !important;
  background:#5f8748 !important;
  color:#fff !important;
}

/* ========================================
   中間サイズPC
======================================== */

@media (max-width:1300px) and (min-width:1101px){

  #header .fk-header-container{
    padding-left:20px;
    padding-right:20px;
  }

  .fk-header-row{
    gap:16px;
  }

  .fk-header-row .siteInfo__logo img,
  .fk-header-row .siteInfo__title img{
    max-width:185px !important;
  }

  .fk-header-nav__list > li > a{
    padding-left:13px !important;
    padding-right:13px !important;
    font-size:14px !important;
  }

  .fk-header-action{
    min-width:60px !important;
    padding-left:13px !important;
    padding-right:13px !important;
    font-size:14px !important;
  }
}

/* ========================================
   小さめPC・タブレット
======================================== */

@media (max-width:1100px) and (min-width:768px){

  #header .fk-header-container{
    padding:10px 14px;
  }

  .fk-header-row{
    gap:10px;
    min-height:64px;
  }

  .fk-header-row .siteInfo__logo img,
  .fk-header-row .siteInfo__title img{
    max-width:160px !important;
    max-height:50px !important;
  }

  .fk-header-nav__list{
    justify-content:center !important;
    flex-wrap:wrap !important;
  }

  .fk-header-nav__list > li > a{
    min-height:34px !important;
    padding:5px 6px !important;
    font-size:10px !important;
  }

  .fk-header-actions{
    gap:4px !important;
    padding-right:0 !important;
  }

  .fk-header-action{
    min-width:52px !important;
    height:30px !important;
    padding:0 6px !important;
    font-size:12px !important;
  }
}

/* ========================================
   スマホ
======================================== */

@media (max-width:767px){

  #header .fk-header-container{
    padding:10px 15px;
  }

  .fk-header-row{
    display:block !important;
    min-height:0;
  }

  .fk-header-row .headerInfo{
    display:block !important;
    width:100% !important;
    text-align:center !important;
  }

  .fk-header-row .siteInfo{
    width:100% !important;
    text-align:center !important;
  }

  .fk-header-row .siteInfo__logo img,
  .fk-header-row .siteInfo__title img{
    max-width:205px !important;
    max-height:52px !important;
    
  }

  /* PC用メニューとボタンを非表示 */
  .fk-header-nav,
  .fk-header-actions{
    display:none !important;
  }
	
	.is-layout-flex > :is(*, div) {
    margin: 0px !important;
}
}

/* ========================================
   タグ一覧
======================================== */
/* ========================================
   タグ一覧
   PC：7個ごとに改行・中央揃え
======================================== */

.fk-all-tags{
  display:grid;
  grid-template-columns:repeat(7, max-content);
  justify-content:center;
  gap:10px 12px;
  margin:25px auto;
}

.fk-all-tags__item{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:7px 14px;
  border:1px solid #7fa358;
  border-radius:999px;
  color:#658847;
  font-size:14px;
  line-height:1.4;
  text-decoration:none !important;
  background:#fff;
  white-space:nowrap;
  transition:.3s;
}

.fk-all-tags__item:hover{
  color:#fff;
  background:#7fa358;
}


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

  .fk-all-tags{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:8px;
    margin:20px auto;
  }

  .fk-all-tags__item{
    padding:6px 11px;
    font-size:12px;
  }

}

/* ========================================
   サイドバー内のタグ一覧
   はみ出し防止
======================================== */

.sidebar .fk-all-tags,
.widget .fk-all-tags{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  width:100%;
  max-width:100%;
}

.sidebar .fk-all-tags__item,
.widget .fk-all-tags__item{
  padding:6px 10px;
  font-size:12px;
  white-space:nowrap;
}