body{
font-family: "M PLUS 2", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif ;
letter-spacing: 0.96px;
color: #795648;
-webkit-font-smoothing: antialiased;
}
body,html{
padding: 0;
margin: 0;
}
div,p,h1,h2,h3,h4{
box-sizing: border-box;
font-family: "M PLUS 2", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif ;
margin:0;
padding:0;
}
li{
list-style-type: none;
}

a{
color: rgb(255, 152, 0);
transition: color 0.3s;
}
#wrapper {
  position: relative;
}


/*////// DRAWER ////////*/

/* ドロワーメニュー（左からスライド） */
.js-drawer {
  position: fixed;
  top: 0;
  left: 0;                 /* ← 左寄せ */
  width: 80%;
  max-width: 350px;
 height: 100%;
  background: #fff;
  transform: translateX(-100%);   /* ← 画面外（左） */
  transition: transform .3s ease;
  z-index: 1000;                 /* オーバーレイより上 */
}
.js-hamburger{
cursor:pointer;
}

.js-drawer.is-open {
  transform: translateX(0);      /* ← 画面内に入る */
}

/* オーバーレイ（#wrapper に追加した要素） */
.js-drawer-bg {
  position: fixed;
  inset: 0;                      /* top:0; right:0; bottom:0; left:0 と同じ */
  background: rgba(0,0,0,.1);    /* 暗くする */
  opacity: 0;
  pointer-events: none;          /* 普段はクリックを通す */
  transition: opacity .3s ease;
  z-index: 900;                  /* メニューより下、コンテンツより上 */
}

/* メニューオープン時 */
.js-drawer-bg.is-active {
  opacity: 1;
  pointer-events: auto;          /* 背景クリックをここで受け止める = コンテンツはクリックできない */
}

/* スクロール禁止 */
html.is-drawer-open,
body.is-drawer-open {
  overflow: hidden;
}


/*////// DRAWER MENU ////////*/

.js-drawer {
padding: 19px 20px 15px 30px;  
scrollbar-gutter: stable;
scrollbar-width: thin;
overflow-y: auto;
}  

.js-drawer button{
background: none;
border: none;
}
.drawer-close {
position: absolute;
z-index: 1000;
padding: 5px;
top: 25px;
right: 15px;
cursor: pointer;
}
.js-drawer h2 {
font-size: .6875rem;
font-weight: 700;
margin: 20px 12px 5px 0;
text-align: left;
color: #795648;
}

.js-drawer ul,
.js-drawer li {
margin: 0;
padding: 0;
list-style: none;
font-size: .815rem;
line-height: 1.5rem;
}
.js-drawer .category-btn {
padding: 9px 0 0;
}

.js-drawer li a {
color: #795648;
text-decoration: none;
display: flex;
align-items: center;
column-gap: .25em;
text-decoration: none;
}

.js-drawer li:first-child>a {
color: #795648;
/*    padding: 7px 0 0;*/
}
.js-drawer ul.home {
    padding-left: 3px;
    padding-right: 34px;
}
.js-drawer ul.home a{
padding-top: 7px;
}
#menu-info a {
padding: 16px 0 0;
}

.js-drawer .category-btn > div {
display: flex;
align-items: center;
position: relative;
}
.js-drawer .category-btn .cat-pic {
min-height: 30px;
width: 42px;
}
.js-drawer .category-btn .cat-inner {
height: 30px;
width: 30px;
margin: 0 10px 0 0;
background-size: cover;
background-repeat: no-repeat;
}
.js-drawer  .category-btn:nth-of-type(1) .cat-inner {
background: url("../img/pendeleton_logo.jpg") no-repeat center / cover;
}
.js-drawer  .category-btn:nth-of-type(2) .cat-inner {
background: url("../img/fdcamp_logo.jpg") no-repeat center / cover;
}
.js-drawer  .category-btn:nth-of-type(3) .cat-inner {
background: url("../img/fdclassic_logo.jpg") no-repeat center / cover;
}
.js-drawer  .category-btn:nth-of-type(4) .cat-inner {
background: url("../img/arb_logo.jpg") no-repeat center / cover;
}
.js-drawer  .category-btn:nth-of-type(5) .cat-inner {
background: url("../img/autoparts_loog.jpg") no-repeat center / cover;
}
.js-drawer  .category-btn:nth-of-type(6) .cat-inner {
background: url("../img/gear_log.jpg") no-repeat center / cover;
}
.category-btn .cat-title {
  line-height: 24px;
  vertical-align: middle;
  min-height: 24px;
  display: flex;
  width: calc(100% - 42px);
    align-items: center;
}
.category-btn .cat-title a {
  display: inline-block;
  width: calc(100% - 34px);
  line-height: 1.5;
  padding-bottom: 2px;
}
.category-btn .parent-icon {
  display: inline-block;
  width: 34px;
  padding-left: 8px;
  cursor: pointer;
  height: 19.5px;
}
.parent-icon.clicked {
    transform: scale(1, -1);
}
.category-sub{
display: none;
}
ul.category-sub {
padding: 0 0 0 42px;
width: calc(100% - 34px);
}
ul.category-sub li{
position: relative;
padding-left: 1em;
opacity: .75;
font-size: .8125rem;
}
ul.category-sub li.hyphen::before {
position: absolute;
left: 0;
content: '‒';
display: inline-block;
width: 0;
height: 0;
opacity: .5;
}
ul.category-sub li a{
margin-top: 9px;
}
#menu-social {
  margin: 10px auto 10px;
}
#menu-social li {
  display: inline-block;
  padding: 5px 0;
  margin: 0 2px;
}
#menu-social a {
  width: 34px;
  height: 34px;
  border-radius: 6px;
  display: inline-block;
  transition: background-color .3s;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
}
#menu-social img {
  width: 20px;
  height: 20px;
}
@media screen and (max-width:959px){
.js-drawer {
padding: 19px 7px 15px 15px;  
}
}
@media screen and (max-width:639px){
.js-drawer {
width: 270px;
}
}

/*//////FOOTER////////*/

footer {
position: relative;
  margin-top: 40px;
  padding-top: 40px;
  color: #795648;
  font-size: .875rem;
  background: #fffbed;
}
.footer-wrapper {
  position: relative;
  max-width: 100%;
  padding: 0;
  margin: 0 auto;
  display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
align-content: stretch;
align-items: stretch;
}
footer h3, 
footer h4 {
font-size: .6875rem;
font-weight: 700;
margin: 0 0 10px;
text-align: left;
color: #795648;
}
footer a, footer a:focus, footer a:hover {
font-weight: 400;
color:#795648;
text-decoration: none;
}
footer .slide-menu-cat .category-btn:first-child {
padding: 3px 0 0;
}
footer .slide-menu-cat .category-btn {
padding: 9px 0 0;
}
.uk-heading-line {
overflow: hidden;
}
.uk-heading-line>* {
display: inline-block;
position: relative;
}
.uk-heading-line>::after {
left: 100%;
margin-left: calc(5px + .3em);
content: "";
position: absolute;
top: calc(50% - (calc(.2px + .05em) / 2));
width: 1500px;
border-bottom: calc(.2px + .05em) solid #e2d9d6;
}
#footer-cat {
padding-left: 3px;
padding-right: 10px;
}
.sub-cat .category-btn>div {
display: flex;
align-items: center;
position: relative;
}
footer .slide-menu-cat .category-btn:first-child {
padding: 3px 0 0;
}
.sub-cat .category-btn>div {
display: flex;
align-items: center;
position: relative;
}
.sub-cat .category-btn .cat-pic {
min-height: 30px;
width: 42px;
}
.sub-cat .category-btn .cat-inner {
height: 30px;
width: 30px;
margin: 0 10px 0 0;
background-size: cover;
background-repeat: no-repeat;
}
.sub-cat .category-btn .cat-title {
line-height: 24px;
vertical-align: middle;
min-height: 24px;
display: flex;
width: calc(100% - 42px);
}
.sub-cat .category-btn .cat-title {
width: 100%;
display: flex;
align-items: center;
}
.slide-menu-cat .category-btn .cat-title a {
display: inline-block;
width: calc(100% - 34px);
line-height: 1.5;
padding-bottom: 2px;
}
.sub-cat .category-btn:nth-of-type(1) .cat-inner {
background: url("../img/pendeleton_logo.jpg") no-repeat center / cover;
}
.sub-cat .category-btn:nth-of-type(2) .cat-inner {
background: url("../img/fdcamp_logo.jpg") no-repeat center / cover;
}
.sub-cat .category-btn:nth-of-type(3) .cat-inner {
background: url("../img/fdclassic_logo.jpg") no-repeat center / cover;
}
.sub-cat .category-btn:nth-of-type(4) .cat-inner {
background: url("../img/arb_logo.jpg") no-repeat center / cover;
}
.sub-cat .category-btn:nth-of-type(5) .cat-inner {
background: url("../img/autoparts_loog.jpg") no-repeat center / cover;
}
.sub-cat .category-btn:nth-of-type(6) .cat-inner {
background: url("../img/gear_log.jpg") no-repeat center / cover;
}
.slide-menu-cat .category-btn .parent-icon {
display: inline-block;
width: 34px;
padding-left: 8px;
cursor: pointer;
height: 19.5px;
}

#footer-cat {
font-size: .8125rem;
}
#footer-info,
.footer-info  {
padding-left: 5px;
font-size: .8125rem;
}
footer .uk-nav > li > a {
padding: 22px 0 0;
display: flex;
align-items: center;
}
footer .uk-nav-default > li:first-child > a {
padding-top: 5px;
}
footer ul.category-sub li a{
display: block;
margin-top: 12px;
}
.footer-info li a {
font-size: .75rem;
padding: 20px 0 0;
display: flex;
align-items: center;
}
.footer-info li#info-privacy a {
  padding-top: 5px;
}

@media (min-width: 959px) {
.footer-wrapper {
padding: 0 5%;
gap: 20px 3%;
}
}
#footer-copyright {
  text-align: center;
  font-size: .6875rem;
  opacity: .8;
  letter-spacing: .05em;
  padding: 10px 0;
}
.footer-item-center, 
.footer-item-left, .footer-item-right {
  width: calc(94% / 3);
  padding: 0;
  position: relative;
}
.footer-logo, 
.footer-logo a, 
.footer-logo a:hover, 
.header-logo, 
.header-logo a, 
.header-logo a:hover {
  font-size: 1.5rem;
  line-height: normal;
  border: none;
  color: #111;
  font-weight: 400 !important;
  height: 50px;
  display: inline-block;
  opacity: 1 !important;
}
.footer-logo {
  margin-bottom: 20px;
  height: 50px;
  display: inline-block;
  text-align: left;
}
.footer-logo img {
max-height: 50px;
}

#footer-social {
  margin-left: auto;
  height: 50px;
}
#footer-social a {
width: 34px;
height: 34px;
border-radius: 6px;
display: inline-block;
transition: background-color .3s;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
}
#footer-social li {
display: inline-block;
padding: 3px;
margin: 0 2.5px;
}
#footer-social li img {
width: 20px;
height: 20px;
}

#page-top {
display: none;
position: fixed;
bottom: 20px;
bottom: calc(20px + env(safe-area-inset-bottom));
transition: opacity .3s 
ease, bottom .1s;
transition-delay: bottom .1s;
font-size: 14px;
line-height: 1;
z-index: 400;
cursor: pointer;
}
#page-top {
  left: calc(100vw - 65px);
}

#page-top span {
background: #000;
color: #fff;
width: 20px;
height: 20px;
padding: 4px 5px 6px;
text-align: center;
display: block;
opacity: .9;
transition: all .3s ease;
border-radius: 50%;
}
.uk-icon {
margin: 0;
border: none;
border-radius: 0;
overflow: visible;
font: inherit;
color: inherit;
text-transform: none;
padding: 0;
background-color: transparent;
display: inline-block;
fill: currentcolor;
line-height: 0;
}

@media (max-width: 959px) {
.footer-item-center, .footer-item-left, .footer-item-right {
width: 100%;
padding: 0;
position: relative;
padding-left: 15px;
padding-right: 15px;
}
footer h3{
padding-top: 1em;
}
footer h4{
padding-top: 1em;
}
.footer-logo {
display: block;
width: 100%;
text-align: center;
margin: 15px auto 20px;
height: auto;
}
#footer-social {
display: block;
margin: 0 auto 20px;
height: auto;
}
#footer-copyright {
padding: 10px 0 70px;
}
}


/*//////HEADER////////*/

header {
position: sticky;
top: 0;
min-height: 70px;
width: 100%;
background-color: #fff;
z-index: 300;
}
#header-box {
display: flex;
justify-content: flex-start;
padding: 15px 0;
max-width: 1920px;
padding-right: calc(5vw - 7px);
padding-left: calc(5vw - 7px);
}
#header-menu {
width: 74px;
padding: 0 38px 0 0;
height: 50px;
min-height: 50px !important;
}
#header-menu  svg {
display: inline-block;
background: #fff;
border-radius: 50%;
padding: 7px 6px 6px 7px;
text-align: center;
line-height: 80px;
width: 23px !important;
height: 36px !important;
}
header svg{
fill:#85685b;
}
.header-logo {
-webkit-flex-grow: 1;
flex-grow: 1;
text-align: left;
}
.header-logo a, 
.header-logo a:hover {
font-size: 1.5rem;
line-height: normal;
border: none;
color: #111;
font-weight: 400 !important;
height: 50px;
display: inline-block;
opacity: 1 !important;
}
.header-logo h1 {
height: 50px;
display: inline-block;
overflow: hidden;
}
#header-box .header-logo img {
max-height: 50px;
}
.uk-navbar-right{
display:flex;
align-items:center;
}
.header-login {
height: 50px;
min-height: 50px;
padding: 0 12px 0;
display: flex;
justify-content: center;
align-items: center;
box-sizing: border-box;
}
.header-search{
position: relative;
display: flex;
}
.form_popup {
display: none;
position: absolute;
z-index: 1020;
box-sizing: border-box;
top: 5px;
right: 25px;
}
.form_popup input[type="text"]{
width: 280px;
height: 40px;
background: #fff;
border: 1px solid #e5e5e5;
border-radius: 5px;
box-sizing: border-box;
}
#drawer-search{
display: none;
}

@media screen and (max-width:959px){
#header-box {
max-width: 100%;
margin-left: auto;
margin-right: auto;
padding: 10px 10px;
}
#header-menu {
width: 44px;
}
.header-logo {
width:100%;
text-align: center;
}
.header-login {
width: 40px;
}

.header-search{
display: none;
}
#drawer-search  {
display: block;
    width: calc(100% - 12px);
	margin-top: 15px;
}
#drawer-search  form{
position: relative;
}
#drawer-search  button{
position: absolute;
left: 0;
top: 6px;
z-index: 1025;
}
#drawer-search input[type="text"] {
background: #fff !important;
width: 100%;
height: 34px;
color: #000;
border: 1px solid #ccc;
border-radius: 3px;
padding-left: 40px;
box-sizing: border-box;
position: relative;
}
#drawer-search .search-icon {
    color: #999 !important;
}
}


/*//////PAGE////////*/

h1.pages {
text-align: center;
font-size: 1.375rem;
margin: 0 0  0.25em;
line-height:1.2;
font-weight: 400;
}
h1.pages a,
h1.pages a:hover{
text-decoration: none;
  color: #795648;
}
p.pagenumber{
text-align: center;
font-size: 90%;
padding: 0;
margin: 0 0  30px;
}
.blog_inner{
width: 90%;
max-width: 1100px;
margin: auto;
display: grid;
grid-template-columns: 120px 1fr;
padding: 15px 0;
border-bottom: solid 1px #eee;
align-items: center;
}
.blog_inner:first-of-type{
border-top: solid 1px #eee;
}
.blog_inner a{
color: #795648;
text-decoration: none;
}
.blog_thumb{
width: 100px;
position: relative;
}
.blog_thumb img{
width: 100%;
height: auto;
}
.blog_inner h2{
font-weight: 400;
font-size: .875rem;
line-height:1.5;
padding-bottom: 10px;
}
.publish_date {
font-size: .75rem;
color: #999;
line-height:1.8;
}

.pagenavi{
padding: 30px 0;
text-align: center;
}

.wp-pagenavi a, .wp-pagenavi span {
	text-decoration: none;
	padding: 3px 5px;
	margin: 2px 5px;
	border: none !important;
}

.wp-pagenavi span.current {
background: #fff5d3;
border-radius: 3px;
}


@media screen and (max-width:959px){
.blog_inner{
width: 96%;
}
h1.pages {
font-size: 1.125rem;
}
}
@media screen and (max-width:600px){
.blog_inner{
width: 96%;
display: flex;
flex-wrap: wrap;
padding: 20px 0 20px 0;
}
.blog_inner h2{
margin: 0;
font-size: .8125rem;
}
.blog_publish {
width: 100%;
}
.blog_publish p{
margin: 0;
}
}


/*//////SINGLE////////*/
img{
max-width: 100%;
}
#page_blog {
margin: 0 auto;
padding: 30px 2.5%;
width: 95%;
max-width: 1100px;
}
.singlepage{
border-bottom: solid 1px rgba(0,0,0,0.1);
margin-bottom: 50px;
padding-bottom: 40px;
}
.singlepage h1.singletitle {
font-size: 1.25rem;
line-height: 1.2em;
font-weight: 400;
line-height: 1.5em;
margin-bottom: 0;
text-transform: none;
word-wrap: break-word;
}
.singlepage  h1.singletitle a,
.singlepage  h1.singletitle a:hover{
color:#795648;
text-decoration: none;
}
.singlepage .blog_publish {
margin: 20px 0 20px ;
}
.singlepage .publish_date{
font-size: 13px;
line-height: 1.8;
}
article{
font-size: 14px;
line-height: 1.7;
}
article h3{
font-size: 1.5em;
font-weight: 400;
}
article div{
min-height: 1.25em;
}
.singlepage .social {
margin: 40px 0 0;
text-align: center;
width: 100%;
}
.singlepage .social ul {
display: inline-block;
}
.singlepage .social ul li {
float: left;
margin-right: 15px;
}
.singlepage .social ul li img {
    width: 30px;
}
.singlepage_navi_bottom{
font-size: 90%;
}
.nav_prev{
margin-bottom: 1em;
font-size: 14px;
}
.nav_next{
font-size: 14px;
}
ul.blog_category {
display: flex;
padding: 0;
margin: 0;
margin-bottom: 2em;
}
ul.blog_category li{
margin: 0 0.5em 0 0;
font-size: 90%;
line-height: 1.4;
display: flex;
align-items: center;
}
ul.blog_category li a{
text-decoration: none;
padding: 0 1em;
color: #fff;
background: #795648;
border-radius: 2px;
}
ul.blog_category li a:hover{
background: #ff9800;
}
.backtolist{
width: 12em;
margin: 40px auto 0;
text-align: center;
}
.backtolist a{
width: 100%;
display: block;
line-height: 2.2em;
text-decoration: none;
color: #795648;
background: #fff;
border: solid 1px #795648;
border-radius: 50px;
transition: 0.3s;
}
.backtolist a:hover{
color: #fff;
background: #795648;
opacity: 0.8;
}


/*//////ARCHIVE////////*/

#archive h1 {
text-align: center;
font-size: 1.375rem;
margin: 0 0  2em;
line-height:1.2;
font-weight: 400;
}


/*//////SEARCH////////*/

#searchresult h1 {
text-align: center;
font-size: 1.375rem;
margin: 0 0  2em;
line-height:1.2;
font-weight: 400;
}
p.search_none{
text-align: center;
}