@charset "utf-8";
/*
Theme Name:ZERO child
Template:zero_tcd055
Version:1.5.1
*/

* { box-sizing: border-box;}
body {font-family: "游ゴシック",YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;}
/* ----------------------------------------------
 相殺
---------------------------------------------- */
h2, h3, h4 { margin-top: 60px!important;}
h2:first-of-type { margin-top: 0!important;}
.size-full { width:100%!important; height: auto!important;}
.wp-embedded-content { width: 100%;}
/* ヘッダー上部 */
#header_top { background: #333;}
#header_top_inner { height: 30px; max-width: 1150px;}
#site_desc { height: 30px; line-height: 30px!important;}
/* ヘッダー下部 */
#header { height: 70px;}
#header_inner { height: 70px;}
/* ロゴ */
#logo_image .logo .pc_logo_image { width: 250px; height: auto;}
#logo_image .logo .mobile_logo_image { width: 180px; height: auto;}
@media only screen and (max-width: 768px) { 
  #header { height: 56px;}
  #header_inner { height: 56px;}
}
#post_image img { width: 100%; height: auto;}
/* グローバルメニュー */
.pc #global_menu { top: 10px; }
.pc #global_menu > ul > li > a { margin: 0; border-radius: 0;}
.pc #global_menu ul ul { top: 60px;}
/* 固定ヘッダー */
.pc .header_fix { padding-top: 70px;}
.pc .header_fix #header { height: 70px;}
.pc .header_fix #header_inner { height: 70px;}
/* 固定ヘッダーのグローバルメニュー */
.pc .header_fix #global_menu > ul > li { height:50px; line-height:50px; margin:0; }
.pc .header_fix #global_menu ul ul { top: 60px;}
.pc .header_fix #global_menu { border-right:1px solid rgba(255,255,255,0.5);}
.pc .header_fix #global_menu > ul > li { border-left:1px solid rgba(255,255,255,0.5);}
.pc .header_fix #header_category_menu { top: 60px;}

#single_recent_post h4 { margin-top: 0!important;}
#related_post h4 { margin-top: 0!important}
 
/* ----------------------------------------------
 base
---------------------------------------------- */
sub, sup { font-size: 11px;}
.icon-window { padding-right: 26px; background: url(/wp-content/themes/zero-child/img/icon-window.png) no-repeat center right/16px auto;}
.font-bold { font-weight: bold!important;}
.co-green { color: #009250;}
.co-y-green { color: #82b72d;}
.co-pink { color: #ea6896;}
.text-delete { display: inline-block; color: #82b72d; text-decoration: line-through;}
.marker-pink { background: linear-gradient(transparent 60%, #eeb6ca 60%);}
.marker-blue { background: linear-gradient(transparent 60%, #9fd9f6 60%);}
.marker-green { background: linear-gradient(transparent 60%, #a5d4ad 60%);}
.marker-y-green { background: linear-gradient(transparent 60%, #82b72d 60%);}
.marker-pink-block { display: inline-block; background: linear-gradient(transparent 60%, #eeb6ca 60%) bottom center;}
.marker-blue-block { display: inline-block; background: linear-gradient(transparent 60%, #9fd9f6 60%) bottom center;}
.marker-y-green-block { display: inline-block; background: linear-gradient(transparent 60%, #d7e7af 60%) bottom center;}
.mt0 { margin-top: 0!important;}
.mt10 { margin-top: 10px!important;}
.mt20 { margin-top: 20px!important;}
.mt30 { margin-top: 30px!important;}
.mt40 { margin-top: 40px!important;}
.mt50 { margin-top: 50px!important;}
.mt60 { margin-top: 60px!important;}
.mb10 { margin-bottom: 10px!important;}
.mb20 { margin-bottom: 20px!important;}
.mb30 { margin-bottom: 30px!important;}
.mb40 { margin-bottom: 40px!important;}
.mb50 { margin-bottom: 50px!important;}
.mb60 { margin-bottom: 60px!important;}
.text-notes { color: #d04255;}

.hr-dashed-green { margin: -20px 0 10px; border: 0; border-bottom: 1px dashed #a5d4ad;}
.hr-dotted { margin: 0; border: 0; border-bottom: 1px dotted #ddd;}
/* ----------------------------------------------
 h style
---------------------------------------------- */
.h-base01 { display: flex; align-items: center;}
.h-design01 { position: relative; display: flex; align-items: center; height: 40px; margin-bottom: 20px!important; padding: 0 20px!important; border: 1.5px solid #666;}
.h-design01:before { content: ""; position: absolute; bottom: -23px; left: 11px; border: 12px solid transparent; border-top: 12px solid #fff; z-index: 2;}
.h-design01:after { content: ""; position: absolute; bottom: -26px; left: 10px; border: 13px solid transparent; border-top: 13px solid #666; z-index: 1;}
.h-design02 { position: relative; display: flex; align-items: center; height: 40px; padding: 0 20px!important; color: #fff; background: #a4d1e3;} 
.h-design02:before { content: ''; position: absolute; top: 100%; left: 0; border-bottom: solid 15px transparent; border-right: solid 20px #788d95;
}
/* ----------------------------------------------
 table style
---------------------------------------------- */
.table-design01 { border-bottom: 1px solid #ddd;}
.table-design01 th, .table-design01 td { display: block; width: 100%;}
.table-design01 th { padding: 6px 10px; text-align: left; line-height: 1.5;}
.table-design01 td { padding: 10px; border-top: none; border-bottom: none;}
/* ----------------------------------------------
 single
---------------------------------------------- */
.box-size-medium { width: 80%; margin: 20px auto 0;}
@media print, (min-width: 897px) {
  .box-size-medium { width: 300px; margin: 0;}
}
/* ----------------------------------------------
 Category：design-clip/wordpress detail
---------------------------------------------- */
.pc-scroll, .sm-scroll { width: 100%; height: 600px; overflow-y: scroll; margin: 30px auto;}
.pc-scroll-h300 { width: 100%; height: 300px; overflow-y: scroll; margin: 30px auto;}
.sm-scroll { width: 100%; height: 80vh;}
.sm-scroll img { width: 100%; height: auto;}
.ul-color-picker { display: flex; justify-content: space-between; margin: 0!important;}
.ul-color-picker li { list-style-type: none; width: 19%;}
.ul-color-picker li .lp-color { display: flex; justify-content: center; align-content: center; height: 40px; color: #fff;}
@media print, (min-width: 897px) { 
  .sm-scroll { width: 400px; height: 650px;}
}
/* ----------------------------------------------
 Category：design-clip list
---------------------------------------------- */
.design-clip ul { display: flex; justify-content: flex-start; flex-wrap: wrap;}
.design-clip ul li { width: 24%; margin-right: 4%;}
.design-clip ul li img { width: 100%; height: auto; border: 1px solid #080404;}
.design-clip ul li .date { margin-top: 10px; color: #999; font-size: 13px;}
.design-clip ul li .ttl { margin-top: 5px; line-height: 1.5;}
.design-clip ul li .icon-tag { margin-top: 10px; color: #999; font-size: 13px;}
.design-clip ul li .icon-tag:before { content:'\e935'; margin-right: 5px; font-size: 12px;}
@media only screen and (max-width: 768px) { 
  .design-clip ul li:nth-child(even) { margin-right: 0;}
}
@media print, (min-width: 897px) { 
  .design-clip ul li { width: 30%; margin-right: 5%!important;}
  .design-clip ul li:nth-child(3n) { margin-right: 0!important;}
}
/* ----------------------------------------------
 Category：wordpress detail
---------------------------------------------- */
@media only screen and (max-width: 768px) { 
  .wordpress .table-detail th, .wordpress .table-detail td { display: block; width: 100%;}
}
@media print, (min-width: 897px) { 
  .wordpress .table-detail th, .wordpress .table-detail td { vertical-align: middle;}
  .wordpress .table-detail th { width: 26%; min-width: 180px;}
  .wordpress .table-detail td { width: calc(100% - 26%)!important}
}
/* ----------------------------------------------
 icon -font-
---------------------------------------------- */
.icon { margin-right: 5px; padding: 5px 10px; font-size: 12px; border-radius: 2px;}
.icon.number { color: #fff; font-size: 18px; font-weight: normal; background: #82b72d;}

/* ----------------------------------------------
 目次プラグイン「Easy Table of Contents」相殺
---------------------------------------------- */
div#ez-toc-container { padding: 20px; border-radius: 0;}
.ez-toc-title-container { display: flex; align-items: center; height: 34px; margin-bottom: 20px; padding: 0 10px; background: #e6f1d5; border-radius: 4px;}
div#ez-toc-container nav ul li { line-height: 1.8;}
div#ez-toc-container nav ul li a { font-weight: bold;}
div#ez-toc-container nav ul li ul li a { font-weight: normal;}
