/*
Theme Name:GoFstudio
Theme URI: 
Author:
Author URI:
Description:GoFstudio
Version: 1.0
*/



/*
パンくずリスト 
*/
.breadcrumbs {
	border-bottom: solid 4px #1a1311;
	width: 100%;
	margin-bottom: 10px;
}

.gen-ewQ-navul {
	list-style: none;
}

.breadcrumbs__list {
	display: flex;
	max-width: 1604px;
	width: 100%;
	padding: 20px;
	margin: 0 auto;
	white-space: nowrap;
	overflow-x: auto;
}

.breadcrumbs__item {
	position: relative;
	font-size: 14px;
}

.breadcrumbs__item:before {
	content: "＞";
	display: block;
	position: absolute;
    right: -20px;
    top: 50%;
    transform: translate(0,-50%);
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
  } 

  .breadcrumbs__item + .breadcrumbs__item  { 
    margin-left: 30px;
  } 

  .breadcrumbs__item:last-child:before { 
    display: none;
  } 

  .breadcrumbs__item a  { 
    font-size: 14px;
  } 

  .breadcrumbs__item a  { 
    transition: all .3s;
  } 

  .breadcrumbs__item:first-child a  { 
    font-weight: 700;
  } 

  .breadcrumbs__item a:hover { 
    opacity: .7;
  } 


/*
カテゴリ 
*/
.category-section { 
	padding: 0 20px; 
	max-width: 1080px; 
	width: 100%; 
	margin: 0 auto; 
	overflow: hidden;
} 

.category-head__title {
    font-size: 33px;
    font-weight: 700;
	margin: 30px 0;
}

.category__list { 
	width: 100%;
} 

.pagination { 
	align-items: center; 
	display: flex; 
	justify-content: center; 
	margin-top: 80px;
}

.category__item + .category__item  { 
	margin-top: 50px;
}

.pagination .current  { 
	align-items: center; 
	display: flex; 
    justify-content: center; 
    margin: 0 10px; 
    padding-bottom: 2px; 
    width: 20px; 
    height: 20px; 
    font-size: 20px; 
    font-weight: 700; 
    transition: all .3s;
  } 

.pagination .current  { 
    border-bottom: solid #1a1311 2px;
}

.pagination a  { 
    align-items: center; 
    display: flex; 
    justify-content: center; 
    margin: 0 10px; 
    padding-bottom: 2px; 
    width: 20px; 
    height: 20px; 
    font-size: 20px; 
    font-weight: 700; 
    transition: all .3s;
} 

.pagination a  { 
    color: #9a9a9a;
} 
     

@media screen and (min-width: 768px){ 
	.pagination a:hover { 
    color: #1a1311;
	} 
}     


.pagination .next  { 
    font-size: 20px; 
    font-weight: 700; 
    color: #1a1311; 
    margin-top: -5px;
} 

.category__item a  { 
    display: flex; 
    width: 100%; 
    padding: 30px; 
    border: solid 2px #1a1311; 
    border-left: none; 
    position: relative;
} 

.category__item a::before { 
    content: ""; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 2px; 
    height: calc(100% - 20px); 
    background: #1a1311;
} 

.category__item a::after { 
    content: ""; 
    position: absolute; 
    bottom: 0; 
    right: 0; 
    width: 0; 
    height: 0; 
    border-left: 44px solid transparent; 
    border-bottom: 44px solid #1a1311;
} 

figure { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
} 

figure { 
    display: block;
} 

.category__item__img { 
    max-width: 320px; 
    width: 100%; 
    margin-right: 15px; 
    position: relative;
} 

.category__item__content { 
    max-width: calc(100% - 335px); 
    width: 100%; 
    position: relative;
} 

.category__item__img__inner { 
    height: 0; 
    padding-top: 56.25%; 
    position: relative; 
    overflow: hidden;
} 

.category__item__main-category { 
    position: absolute; 
    left: -12px; 
    top: -15px; 
    font-size: 12px; 
    line-height: 1; 
    padding: 5px 10px; 
    background: #fff 0% 0% no-repeat padding-box; 
    box-shadow: 2px 2px 0px #ffff3b; 
    border: 1px solid #1a1311;
}
	
.category__item__category { 
    font-size: 12px; 
    line-height: 1.2; 
    color: #505050; 
    margin: 8px 0 5px;
}
	
.category__item__date { 
    font-family: "Arial","ヒラギノ角ゴ ProN","Hiragino Kaku Gothic ProN","Noto Sans JP","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif; 
    display: inline-block; 
    font-size: 12px; 
    font-weight: 700; 
    position: absolute; 
    top: -15px; 
    right: -15px;
} 

.category__item__title { 
    font-size: 26px; 
    font-weight: 700; 
    line-height: 1.4; 
    margin-bottom: 10px;
} 

.category__item__lead { 
    font-size: 14px;
}
	
.category__item__img img  { 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%,-50%); 
    margin: auto; 
    width: 100%; 
    height: auto;
} 



/*
記事 
*/
.single-section { 
    padding: 0 20px; 
    max-width: 1080px; 
    width: 100%; 
    margin: 0 auto; 
    overflow: hidden;
	display: block;
}

  .single__bottom { 
    margin: 60px auto 70px; 
    border-bottom: 4px solid #1a1311;
  } 

  .single__head { 
    margin-bottom: 24px; 
    line-height: 1.5;
  } 

  .single__bottom__inner { 
    max-width: 1080px; 
    margin: 0 auto; 
    padding: 0 20px 10px; 
    display: flex; 
    justify-content: flex-end; 
    align-items: flex-end;
  } 

  .recommend { 
    padding: 0 30px;
  } 

  .post-link { 
    padding: 23px 20px; 
    border: solid 1px #1a1311; 
    display: flex;
  } 

  * + .post-link  { 
    margin-top: 50px;
  } 

  time { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  .single__head__date { 
    font-family: "Arial","ヒラギノ角ゴ ProN","Hiragino Kaku Gothic ProN","Noto Sans JP","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif; 
    display: block; 
    font-size: 12px; 
    font-weight: 700; 
    text-align: right; 
    margin-bottom: 20px;
  } 

  .single__head__category { 
    font-size: 16px; 
    font-weight: 700;
  } 

  h1 { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  .single__head__title { 
    font-size: 36px; 
    font-weight: 700;
  } 

  figure { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  figure { 
    display: block;
  } 

  .single__thumbnail { 
    width: 100%; 
    position: relative; 
    margin-bottom: 24px;
  } 

  ul { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  ul { 
    list-style: none;
  } 

  ul { 
    list-style: square;
  } 

  .single__bottom__sns { 
    display: flex;
  } 

  .single__bottom__date { 
    font-family: "Arial","ヒラギノ角ゴ ProN","Hiragino Kaku Gothic ProN","Noto Sans JP","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif; 
    font-size: 12px; 
    font-weight: 700; 
    margin-left: 20px;
  } 

  h2 { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  .recommend__title { 
    font-size: 20px; 
    font-weight: 700; 
    margin-bottom: 10px;
  } 

  .recommend__list { 
    max-width: 720px; 
    width: 100%;
  } 

  a { 
    margin: 0; 
    padding: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  a { 
    text-decoration: none; 
    color: inherit;
  } 

  .post-link__item { 
    width: 50%; 
    padding-right: 20px;
  } 

  .post-link__item:last-child { 
    text-align: right; 
    border-left: solid 2px #1a1311; 
    padding-right: 0; 
    padding-left: 20px;
  } 

  .single__category { 
    position: absolute; 
    z-index: 1; 
    left: 12px; 
    top: 12px; 
    font-size: 12px; 
    line-height: 1; 
    padding: 5px 10px; 
    background: #fff 0% 0% no-repeat padding-box; 
    box-shadow: 2px 2px 0px #ffff3b; 
    border: 1px solid #1a1311;
  } 

  .single__thumbnail__inner { 
    height: 0; 
    padding-top: 56.25%; 
    position: relative; 
    overflow: hidden;
  } 

  table { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  table { 
    border-collapse: collapse; 
    border-spacing: 0;
  } 

  table { 
    width: 100%;
  } 

  table { 
    border-collapse: collapse; 
    border: 2px solid #8c; 
    font-family: sans-serif; 
    font-size: .8rem; 
    letter-spacing: 1px;
  } 

  .single__content > *  { 
    margin-top: 18px; 
    font-size: 16px; 
    line-height: 1.7; 
    color: #656565;
  } 

  li { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  li { 
    list-style: none;
  } 

  .single__bottom__sns li  { 
    max-width: 32px; 
    width: 100%;
  } 

  .single__bottom__sns li + li  { 
    margin-left: 16px;
  } 

  .recommend__item + .recommend__item  { 
    margin-top: 20px;
  } 

  p { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  .post-link__item__text { 
    font-size: 17px; 
    font-weight: 700; 
    line-height: 1; 
    margin-bottom: 10px;
  } 

  .post-link__item__title { 
    font-size: 14px; 
    font-weight: 700;
  } 

  img { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  img { 
    vertical-align: bottom; 
    height: auto;
  } 

  .single__thumbnail img  { 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%,-50%); 
    margin: auto; 
    width: 100%; 
    height: auto;
  } 

  tbody { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  .single__bottom__sns li a  { 
    display: block; 
    width: 100%;
  } 

  .recommend__item a  { 
    display: flex; 
    width: 100%; 
    padding: 30px; 
    border: solid 2px #1a1311; 
    border-left: none; 
    position: relative;
  } 

  .recommend__item a::before { 
    content: ""; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 2px; 
    height: calc(100% - 20px); 
    background: #1a1311;
  } 

  .recommend__item a::after { 
    content: ""; 
    position: absolute; 
    bottom: 0; 
    right: 0; 
    width: 0; 
    height: 0; 
    border-left: 35px solid transparent; 
    border-bottom: 35px solid #1a1311;
  } 

  span { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  tr { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  tbody > tr:nth-of-type(2n)  { 
    background-color: #f5f5f5;
  } 

  .single__bottom__sns li img  { 
    display: block; 
    width: 100%;
  } 

  .recommend__item__img { 
    max-width: 140px; 
    width: 100%; 
    margin-right: 15px; 
    position: relative;
  } 

  .recommend__item__content { 
    max-width: calc(100% - 155px); 
    width: 100%;
  } 

  td { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    background: 0 0;
  } 

  td { 
    border: 1px solid #777; 
    padding: 8px 10px;
  } 

  .recommend__item__img__inner { 
    height: 0; 
    padding-top: 56.25%; 
    position: relative; 
    overflow: hidden;
  } 

  .recommend__item__main-category { 
    position: absolute; 
    left: -12px; 
    top: -15px; 
    font-size: 12px; 
    line-height: 1; 
    padding: 5px 10px; 
    background: #fff 0% 0% no-repeat padding-box; 
    box-shadow: 2px 2px 0px #ffff3b; 
    border: 1px solid #1a1311;
  } 

  .recommend__item__category { 
    font-size: 12px; 
    line-height: 1.2; 
    color: #505050; 
    margin-bottom: 10px;
  } 

  .recommend__item__title { 
    font-size: 17px; 
    font-weight: 700; 
    line-height: 1.4;
  } 

  .recommend__item__img img  { 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%,-50%); 
    margin: auto; 
    width: 100%; 
    height: auto;
  }