@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template: cocoon-master
Version: 1.2.3
*/

/* AI Media Editorial 2026
 * Top-page styles and article styles are deliberately separated.
 */
:root{
  --media-ink:#171b18;
  --media-blue:#1259ff;
  --media-cyan:#63d8ff;
  --media-yellow:#f3f86c;
  --media-paper:#fff;
  --media-pale:#eef7ff;
  --media-muted:#596477;
}
*{box-sizing:border-box}
body{
  color:var(--media-ink);
  background:#f7f9ff;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
}

/* Shared header */
#header-container{
  position:relative;
  background:var(--media-paper);
  border-bottom:2px solid var(--media-ink);
  box-shadow:0 5px 0 rgba(99,216,255,.55);
}
.header{background:var(--media-paper)}
.header-container-in.hlt-top-menu{
  display:flex;
  align-items:center;
  gap:24px;
}
.header-in{min-height:96px}
.logo-header{
  position:relative;
  width:350px!important;
  max-width:350px!important;
}
.logo-header a{
  position:relative!important;
  display:block!important;
  height:76px!important;
  min-width:330px;
  text-decoration:none;
}
.logo-header img{display:none!important}
.logo-header a:before{
  content:"";
  position:absolute;
  left:0;
  top:7px;
  width:62px;
  height:62px;
  background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cmVjdCB3aWR0aD0iNTEyIiBoZWlnaHQ9IjUxMiIgcng9IjkyIiBmaWxsPSIjZWVmN2ZmIi8+PGNpcmNsZSBjeD0iMjU2IiBjeT0iMjU2IiByPSIyMjAiIGZpbGw9IiMxMjU5ZmYiIHN0cm9rZT0iIzE3MWIxOCIgc3Ryb2tlLXdpZHRoPSIyMCIvPjxwYXRoIGQ9Ik03NSAyMTBDMTI4IDc4IDI5NiA0OCA0MTggMTM4YzUyIDM5IDQ0IDExOC0xOSAxMzctNjQgMjAtOTQgMTExLTE4NSAxMzdDMTEzIDQ0MSAzNSAzMTcgNzUgMjEwWiIgZmlsbD0iI2YzZjg2YyIvPjxyZWN0IHg9Ijk4IiB5PSIxMjYiIHdpZHRoPSIzMTYiIGhlaWdodD0iMjI2IiByeD0iMjUiIGZpbGw9IiM2M2Q4ZmYiIHN0cm9rZT0iIzE3MWIxOCIgc3Ryb2tlLXdpZHRoPSIxOCIvPjxyZWN0IHg9IjEyMyIgeT0iMTUxIiB3aWR0aD0iMjY2IiBoZWlnaHQ9IjE3NiIgcng9IjEwIiBmaWxsPSIjZmZmIiBzdHJva2U9IiMxNzFiMTgiIHN0cm9rZS13aWR0aD0iMTMiLz48cGF0aCBkPSJNNzcgMzU3aDM1OGwtNDMgNTlIMTIwWiIgZmlsbD0iIzYzZDhmZiIgc3Ryb2tlPSIjMTcxYjE4IiBzdHJva2Utd2lkdGg9IjE4IiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PHBhdGggZD0iTTE2NCAyOTB2LTM0aDMydjM0bTI1IDB2LTU3aDMydjU3bTI1IDB2LTgxaDMydjgxbTI1IDB2LTExMmgzMnYxMTIiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzE3MWIxOCIgc3Ryb2tlLXdpZHRoPSIxMyIvPjxwYXRoIGQ9Ik0xNjMgMjM1bDY1LTUwIDU0IDI3IDcyLTczIiBmaWxsPSJub25lIiBzdHJva2U9IiMxMjU5ZmYiIHN0cm9rZS13aWR0aD0iMTgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjxwYXRoIGQ9Ik0zNjkgODJjOCAyOCAxOCAzOCA0NiA0Ni0yOCA4LTM4IDE4LTQ2IDQ2LTgtMjgtMTgtMzgtNDYtNDYgMjgtOCAzOC0xOCA0Ni00NloiIGZpbGw9IiNmM2Y4NmMiIHN0cm9rZT0iIzE3MWIxOCIgc3Ryb2tlLXdpZHRoPSIxMSIvPjwvc3ZnPg==") center/contain no-repeat;
}
.logo-header a:after{
  content:"シゴト自動化ラボ";
  position:absolute;
  left:78px;
  top:18px;
  color:var(--media-ink);
  font-size:21px;
  line-height:1.2;
  font-weight:950;
  letter-spacing:.02em;
  white-space:nowrap;
}
.logo-header:after{
  content:"AIで業務を小さく自動化";
  position:absolute;
  left:78px;
  top:51px;
  color:var(--media-muted);
  font-size:11px;
  line-height:1;
  font-weight:700;
  letter-spacing:.04em;
  white-space:nowrap;
}
.navi{
  background:transparent;
  border:0;
}
.navi-in .item-description{display:none!important}
.navi-in>ul{
  justify-content:flex-end;
  align-items:center;
  gap:8px;
}
.navi-in>ul>li{
  width:auto!important;
  flex:0 0 auto!important;
  border:0!important;
}
.navi-in>ul>li>a{
  min-height:46px;
  padding:0 16px!important;
  color:var(--media-ink);
  background:#f4f8ff;
  border:1.5px solid var(--media-ink);
  border-radius:8px;
  font-size:14px;
  font-weight:850;
}
.navi-in>ul>li>a:hover{
  color:var(--media-ink);
  background:var(--media-yellow);
  transform:translateY(-1px);
}
.navi-in>ul>li:last-child>a{
  color:var(--media-ink);
  background:var(--media-yellow);
}
.navi-in>ul>li:last-child>a:hover{background:var(--media-cyan)}

/* Homepage: let the page's own .aihome design control its contents */
.page-id-27 .article-header,
.page-id-27 .sns-share,
.page-id-27 .sns-follow,
.page-id-27 .date-tags,
.page-id-27 .sidebar{display:none!important}
.page-id-27 .content-in{
  display:block!important;
  width:100%!important;
  max-width:1228px!important;
}
.page-id-27 #main{
  float:none!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.page-id-27 .entry-content{
  margin:0!important;
  padding:0 24px 44px!important;
}
.page-id-27 .article{margin:0!important}


/* Homepage category grid: ignore WordPress auto-generated empty nodes */
.page-id-27 .aigrid{
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:18px!important;
}
.page-id-27 .aigrid>br,
.page-id-27 .aigrid>p:empty{display:none!important}
.page-id-27 .aigrid>.aicat{
  grid-column:span 2;
  width:100%;
  min-width:0;
}
.page-id-27 .aigrid>.aicat:nth-last-child(2){grid-column:2/span 2}
.page-id-27 .aigrid>.aicat:last-child{grid-column:4/span 2}

/* Single-post template only */
.single .content-in{
  display:block!important;
  width:auto!important;
  max-width:1080px!important;
  margin:0 auto!important;
  padding:0 24px!important;
}
.single #main{
  float:none!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}
.single .sidebar{display:none!important}
.single .main{
  background:var(--media-paper);
  border:2px solid var(--media-ink);
  border-radius:0;
  box-shadow:7px 7px 0 var(--media-cyan);
  padding:clamp(22px,4vw,48px);
}
.single .article-header .entry-title{
  margin-bottom:24px;
  padding:0 0 20px;
  color:var(--media-ink);
  font-size:clamp(2rem,3.4vw,2.75rem);
  line-height:1.18;
  font-weight:950;
  letter-spacing:-.04em;
  position:relative;
}
.single .article-header .entry-title:after{
  content:"";
  display:block;
  width:104px;
  height:10px;
  margin-top:18px;
  background:var(--media-yellow);
  border:2px solid var(--media-ink);
}
.single .eye-catch{
  margin-bottom:34px;
  overflow:hidden;
  border:2px solid var(--media-ink);
  border-radius:0;
  box-shadow:6px 6px 0 var(--media-blue);
}
.single .eye-catch img{display:block;width:100%}
.single .entry-categories a,
.single .cat-label{
  color:var(--media-ink)!important;
  background:var(--media-yellow)!important;
  border:2px solid var(--media-ink)!important;
  border-radius:0!important;
  font-weight:900!important;
}
.single .entry-content{
  width:100%;
  max-width:860px;
  margin-left:auto;
  margin-right:auto;
  font-size:1.05rem;
  line-height:1.9;
}
.single .article-header,
.single .eye-catch,
.single .article-footer{max-width:960px;margin-left:auto;margin-right:auto}
.single .entry-content>p:first-of-type{
  margin:30px 0;
  padding:20px 22px;
  background:var(--media-pale);
  border:2px solid var(--media-ink);
  border-left:10px solid var(--media-blue);
  font-weight:650;
}
.single .entry-content h2{
  margin:60px 0 24px;
  padding:17px 16px 14px;
  color:var(--media-ink);
  background:transparent;
  border:0;
  border-top:3px solid var(--media-ink);
  border-bottom:3px solid var(--media-ink);
  position:relative;
  font-size:clamp(1.5rem,3vw,2.05rem);
  font-weight:950;
}
.single .entry-content h2:before{
  content:"";
  position:absolute;
  left:16px;
  top:-9px;
  width:76px;
  height:12px;
  background:var(--media-yellow);
  border:2px solid var(--media-ink);
}
.single .entry-content h3{
  margin:40px 0 18px;
  padding:5px 0 8px 16px;
  color:var(--media-ink);
  background:transparent;
  border:0;
  border-left:7px solid var(--media-blue);
  border-bottom:2px solid var(--media-ink);
  font-weight:900;
}
.single .entry-content ul,
.single .entry-content ol{
  margin:22px 0;
  padding:18px 22px 18px 44px;
  color:var(--media-ink);
  background:#fbfddc;
  border:2px solid var(--media-ink);
}
.single .entry-content li::marker{
  color:var(--media-blue);
  font-weight:900;
}
.single .entry-content blockquote{
  margin:24px 0;
  padding:20px;
  background:var(--media-pale);
  border:2px solid var(--media-ink);
  border-left:8px solid var(--media-cyan);
  border-radius:0;
}
.single .entry-content table{
  border:2px solid var(--media-ink);
  border-collapse:collapse;
  box-shadow:4px 4px 0 var(--media-cyan);
}
.single .entry-content th,
.single .entry-content td{
  padding:11px;
  border:1px solid var(--media-ink);
}
.single .entry-content th{
  color:var(--media-ink);
  background:var(--media-yellow);
  font-weight:900;
}
.single .entry-content pre,
.single .entry-content .wp-block-code{
  color:#f5f8ff;
  background:#111b2c;
  border:2px solid var(--media-ink);
  border-radius:0;
  box-shadow:5px 5px 0 var(--media-blue);
}
.single .toc{
  background:var(--media-pale);
  border:2px solid var(--media-ink);
  border-radius:0;
  box-shadow:5px 5px 0 var(--media-yellow);
}
.single .toc-title{font-weight:950}
.single .related-entry-card-wrap{
  margin-bottom:14px;
  border:2px solid var(--media-ink);
  border-radius:0;
  box-shadow:4px 4px 0 var(--media-cyan);
}
.single .sns-buttons a{
  border:1px solid var(--media-ink)!important;
  border-radius:0!important;
}

/* Archives */
.archive .main,
.category .main{
  background:var(--media-paper);
  border:2px solid var(--media-ink);
  border-radius:0;
  box-shadow:6px 6px 0 var(--media-cyan);
}
.archive-title{
  color:var(--media-ink);
  font-weight:950;
}

/* Footer */
.footer{
  margin-top:72px;
  color:#fff;
  background:var(--media-ink);
  border-top:7px solid var(--media-blue);
}
.footer a{color:#fff;font-weight:700}
.footer a:hover{color:var(--media-yellow)}

@media screen and (max-width:1023px){
  .page-id-27 .aigrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .page-id-27 .aigrid>.aicat{grid-column:auto}
  .page-id-27 .aigrid>.aicat:nth-last-child(2){grid-column:auto}
  .page-id-27 .aigrid>.aicat:last-child{
    grid-column:1/-1;
    width:calc(50% - 9px);
    justify-self:center;
  }
  .header-in{min-height:88px}
  .logo-header{width:300px!important;max-width:300px!important}
  .logo-header a{min-width:290px}
  .logo-header a:before{width:56px;height:56px;top:10px}
  .logo-header a:after{left:68px;top:20px;font-size:18px}
  .logo-header:after{left:68px;top:48px;font-size:10px}
  .navi-in>ul{gap:6px}
  .navi-in>ul>li>a{padding:0 10px!important;font-size:12px}
}
@media screen and (max-width:834px){
  .header-container-in.hlt-top-menu{justify-content:center}
  .logo-header{width:300px!important;max-width:300px!important}
  .logo-header a{min-width:290px}
  .navi{display:none}
  .page-id-27 .entry-content{padding:0 12px 34px!important}
  .page-id-27 .aigrid{grid-template-columns:1fr!important}
  .page-id-27 .aigrid>.aicat,
  .page-id-27 .aigrid>.aicat:nth-last-child(2),
  .page-id-27 .aigrid>.aicat:last-child{grid-column:auto;width:100%}
  .single .content-in{padding:0 12px!important}
  .single .main{padding:22px 18px;border-width:2px;box-shadow:5px 5px 0 var(--media-cyan)}
  .single .article-header .entry-title{font-size:2rem}
}
@media screen and (max-width:480px){
  .logo-header{width:270px!important;max-width:270px!important}
  .logo-header a{min-width:260px}
  .logo-header a:before{width:50px;height:50px;top:13px}
  .logo-header a:after{left:61px;top:21px;font-size:16px}
  .logo-header:after{left:61px;top:47px;font-size:9px}
  .single .entry-content{font-size:1rem}
  .single .entry-content h2{margin-top:48px;padding:15px 10px 12px;font-size:1.42rem}
  .single .entry-content h3{font-size:1.18rem}
  .single .entry-content ul,
  .single .entry-content ol{padding:16px 16px 16px 34px}
}


/* Homepage heading reset */
.page-id-27 .aihome h1,
.page-id-27 .aihome h2,
.page-id-27 .aihome h3{
  padding:0!important;
  color:inherit;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.page-id-27 .aihome h1:before,
.page-id-27 .aihome h1:after,
.page-id-27 .aihome h2:before,
.page-id-27 .aihome h2:after,
.page-id-27 .aihome h3:before,
.page-id-27 .aihome h3:after{content:none!important}


/* Article heading & table-of-contents polish 2026-08-29 */
.single .entry-content h2{
  margin:56px 0 22px!important;
  padding:17px 20px!important;
  color:var(--media-ink)!important;
  background:linear-gradient(90deg,var(--media-pale) 0%,#fff 100%)!important;
  border:0!important;
  border-left:7px solid var(--media-blue)!important;
  border-bottom:1px solid #cfdcf0!important;
  box-shadow:none!important;
  line-height:1.45!important;
  font-size:clamp(1.45rem,2.6vw,1.9rem)!important;
}
.single .entry-content h2:before,
.single .entry-content h2:after{
  content:none!important;
  display:none!important;
}
.single .entry-content h3{
  margin:38px 0 16px!important;
  padding:3px 0 10px 14px!important;
  color:var(--media-ink)!important;
  background:transparent!important;
  border:0!important;
  border-left:4px solid var(--media-blue)!important;
  border-bottom:1px solid #cfdcf0!important;
  box-shadow:none!important;
  line-height:1.55!important;
  font-size:clamp(1.15rem,2.1vw,1.38rem)!important;
}
.single .entry-content h2 br,
.single .entry-content h3 br{
  display:none!important;
}
.single .toc{
  width:100%;
  max-width:760px;
  margin:30px auto 42px!important;
  padding:20px 22px!important;
  color:var(--media-ink)!important;
  background:#fff!important;
  border:1px solid #cfdcf0!important;
  border-left:6px solid var(--media-blue)!important;
  border-radius:10px!important;
  box-shadow:0 8px 22px rgba(18,89,255,.08)!important;
}
.single .toc-title{
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 0 12px!important;
  margin:0!important;
  color:var(--media-ink)!important;
  font-size:1.08rem!important;
  font-weight:900!important;
  border-bottom:1px solid #dbe5f4;
}
.single .toc-title:before{
  content:"";
  display:block;
  width:10px;
  height:22px;
  flex:0 0 10px;
  background:var(--media-blue);
  border-radius:2px;
}
.single .toc .toc-content{
  margin-top:12px!important;
}
.single .toc ol,
.single .toc ul{
  margin:0!important;
  padding:0!important;
  color:inherit!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  list-style:none!important;
}
.single .toc li{
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
.single .toc li+li{
  border-top:1px solid #edf1f7!important;
}
.single .toc li a{
  display:block;
  padding:8px 4px!important;
  color:#25334d!important;
  font-weight:650;
  line-height:1.55;
  text-decoration:none!important;
}
.single .toc li a:hover{
  color:var(--media-blue)!important;
  background:var(--media-pale)!important;
}
.single .toc li ol{
  margin:0 0 5px 12px!important;
  padding:0 0 0 14px!important;
  border-left:2px solid #d9e5fa!important;
}
.single .toc li li+li{
  border-top:0!important;
}
.single .toc li li a{
  padding:5px 4px!important;
  font-size:.95em;
  font-weight:500;
}
.single .toc a br{
  display:none!important;
}
@media screen and (max-width:480px){
  .single .entry-content h2{
    margin-top:44px!important;
    padding:14px 13px!important;
    font-size:1.35rem!important;
  }
  .single .entry-content h3{
    margin-top:32px!important;
    padding-left:11px!important;
    font-size:1.12rem!important;
  }
  .single .toc{
    margin:24px auto 34px!important;
    padding:17px 15px!important;
  }
}