@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    1.0.8
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
:root{
	--color_main: #94AE11;
	--color_blue: #001F3F;
	--color_red: #8B0000;
}


.font-mini{font-size: 0.8em;}
.font-bold{font-weight: bold;}
.font-red{color: #ff0000;}
table th ul,
table th ol,
table td ul,
table td ol{margin-bottom: 0 !important;}
.source{font-size: 0.8em; text-align: right; color: #ccc;}
.source a{color: #ccc; text-decoration: none;}
.table__block table{margin-bottom: 10px;}
.table__block p.font-mini{margin-bottom: 0;}


/*ヘッダー、フッターの調整*/
.header-container{box-shadow: 0 0 5px #ddd;}
.header-container-in.hlt-top-menu{flex-wrap: wrap;}
.header-container-in.hlt-top-menu .logo-header img{max-height: 50px; padding-top: 10px;}
.header__tel{padding: 10px 0 5px; font-weight: bold;}
.header__tel a{background-color: var(--color_blue); display: inline-block; width: auto; padding: 0.5em 1.5em; border-radius: 50px; box-shadow: 0 2px 5px #ccc; color: #fff; text-decoration: none; text-align: center; line-height: 1.3; transition: 0.3s;}
.header__tel a .text{display: block; font-size: 0.7em;}
.header__tel a i{margin-right: 0.5em; font-size: 0.9em;}
.header__tel a:hover{box-shadow: none; opacity: 0.7;}
.header__tel a.tel{background-color: var(--color_main); margin-right: 0.5em;}
.header__tel a.email{padding: 0.5em 2em;}
.footer-bottom-logo img {height: 40px;}

/*記事デザイン*/
.single .content{margin-top: 60px;}
.single .main{border-right: 1px solid #eee; position: relative;}
.single .main:before,
.single .main:after{content: ""; width: 800px; height: 4px; background-color: #eee; margin-left: 29px; position: absolute; top: 0; left: 0;}
.single .main:after{background-color: var(--color_main); width: 120px;}
.single .entry-content{border-bottom: 1px solid #eee;}
.entry-title, .archive-title{margin-bottom: 32px; font-size: 30px;}
.cat-link{background-color: var(--color_main);}
.article h2{background-color: #ebeecb; border-left: 8px solid var(--color_main);}
.article h3{border-left: 7px solid var(--color_main);}
.article h4{border: none; border-left: 4px solid var(--color_main);}
.article p + h2,
.article p + h3,
.article p + h4{margin-top: 2.5em;}
.related-entries .sub-caption{font-weight: bold; font-size: 13px;}

/*キャプションのデザイン調整*/
.wp-block-image figcaption{text-align: right; color: #797979;}
.wp-block-image figcaption a{color: #797979;}
.wp-block-image figcaption a:hover{color: #ccc;}

/*CTRのデザイン調整*/
.single-case__cv {margin: 80px 0 0; padding: 50px 1%; background: #ccde68; display: flex; align-items: center;}
.single-case__cv:last-child {margin: 20px 0 0;}
.single-case__cv-img {width: 30%; padding: 10px 5px 10px 10px;}
.single-case__cv-img img{border: none;}
.single-case__cv-text {width: 70%; padding: 10px 10px 10px 35px; border-left: 1px solid #656565; font-size: 15px;}
.single-case__cv-text p {margin-bottom: 0;}
.single-case__cv-text-main {margin-bottom: 20px; font-weight: bold; font-size: 1.4em;}
.single-case__cv-text .btn {text-align: center; padding: 1em; border-color: transparent;}
.single-case__btn {margin: 40px 0 20px; text-align: center;}
.single-case__btn .btn {font-size: 1em; width: 80%; border-color: transparent;}
.single-case__btn .btn:hover {background-color: #00d084 !important; opacity: 1;}
.single-case__btn .micro-copy{display: inline-block; margin: 0 auto 10px; font-size: 12px; font-weight: bold; position: relative;}
.single-case__btn .micro-copy:before,
.single-case__btn .micro-copy:after{content: ""; height: 1px; width: 30px; background-color: #333; position: absolute; bottom: 50%;}
.single-case__btn .micro-copy:before{transform: rotate(60deg); left: -3em;}
.single-case__btn .micro-copy:after{transform: rotate(-60deg); right: -3em;}
.single-case__tel{margin-bottom: 20px; text-align: center; font-size: 24px; font-weight: bold; line-height: 1;}
.single-case__tel a{text-decoration: none; color: #333; transition: .3s;}
.single-case__tel a:hover{color: #00d084;}

.single-case__cv.text{margin-top: 40px; justify-content: center; flex-direction: column;} /* テキストのみのCV（運送業 行政書士カテゴリで使用） */
.single-case__cv.text .single-case__btn{width: 100%;}
.single-case__cv.text .single-case__btn .btn{padding: 1.5em 1em 1.3em; border-color: transparent;}
.single-case__cv.text a.link{color: #333;}
.single-case__cv.text a.link:hover{opacity: 0.7;}

/*ダウンロードCTRのデザイン調整*/
.dl-block{margin: 50px 0; padding: 20px; background: #ccde68; display: flex;}
.dl-block-img{width: 25%;}
.dl-block-img img{border: none;}
.dl-block-content{width: 75%; padding-left: 20px;}
.dl-block-title{font-weight: bold; font-size: 1.2em;}
.dl-btn{
  display: inline-block;
  background-color: #333;
  padding: 15px 40px;
  margin-top: 10px;
  border-radius: 50px;
  color: #fff;
  letter-spacing: 1px;
  font-weight: bold;
  text-decoration: none;
}
.dl-btn:hover{background-color: #00d084; color: #fff;}

/*監修者のデザイン調整*/
.block-supervisor{border: 2px solid #000; border-radius: 5px; padding: 20px; margin: 20px 0 0; display: flex; justify-content: space-between;}
.supervisor-img{width: 15%;}
.supervisor-content{width: 85%; padding-left: 15px; font-size: 14px;}
.supervisor-main{margin-bottom: 10px;}
.supervisor-name{font-weight: bold; font-size: 1.2em;}

/*ホワイトペーパー用バナーのデザイン調整*/
.banner-block.whitepaper{margin: 50px 0; transition: .3s;}
.banner-block.whitepaper:hover{opacity: .6;}

/*ホワイトペーパー用バナーのデザイン調整*/
.wp-block-cocoon-blocks-column-2 .column-left{background-color: #F9FFDB; padding: 2%;}
.wp-block-cocoon-blocks-column-2 .column-right{background-color: #e6f9ff; padding: 2%;}

/*画面下CTA*/
.float-cta{position: fixed; bottom: 0; left: 0; width: 100%; display: flex;}
.float-cta a{width: 50%; background-color: var(--color_main); display: inline-block; padding: 1em 1.5em; font-size: 1.2em; text-align: center; color: #fff; font-weight: bold; text-decoration: none;line-height: 1.3; transition: 0.3s;}
.float-cta a .text{display: block; font-size: 0.7em;}
.float-cta a i{margin-right: 0.5em; font-size: 0.9em;}
.float-cta a:hover{box-shadow: none; background-color: #aac232;}
.float-cta a.tel{background-color: var(--color_blue);}
.float-cta a.tel:hover{background-color:#034283}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
@media screen and (max-width: 1255px){
	.single .main:before{width: calc(100% - 58px);}
}
@media screen and (max-width: 1023px){
	.single .main{border-right: none;}
}
@media screen and (max-width: 834px){
	.single .main:before{width: calc(100% - 32px); margin-left: 16px;}
}
/*768px以下*/
@media screen and (max-width: 768px){
  .single-case__cv{flex-direction: column; padding: 20px;}
  .single-case__cv-img{width: 100%; text-align: center; padding: 0;}
  .single-case__cv-img img{width: 50%;}
  .single-case__cv-text{width: 100%; padding: 0 20px; border-left: none;}
  .single-case__btn{text-align: center; margin: 40px 0;}
  .dl-block{flex-direction: column;}
  .dl-block-img{width: 100%; max-width: 300px; margin: auto;}
  .dl-block-content{width: 100%;}
  .dl-btn{width: 100%; text-align: center;}
  .block-supervisor{flex-direction: column;}
  .supervisor-img{width: 100%; max-width: 120px; margin: auto;}
  .supervisor-content{width: 100%; padding-left: 0;}
  .supervisor-content p{margin-bottom: 0;}
  .supervisor-main{margin-bottom: 5px;}
}

/*480px以下*/
@media screen and (max-width: 480px){
	.mobile-header-menu-buttons{justify-content: space-between; align-items: center;}
	.has-logo-button .logo-menu-button{flex-grow: 0;}
	.logo-menu-button img{max-height: 34px; margin-left: 8%;}
	.entry-title{padding: 0; margin-bottom: 24px; font-size: 21px; line-height: 1.4 !important;}
  .single-case__cv{margin-top: 50px; padding: 10px 10px 30px;}
  .single-case__cv-img img{width: 80%;}
  .single-case__cv-text-main{margin-bottom: 10px; font-size: 1.3em;}
  .single-case__cv .single-case__btn{margin: 30px 0 20px;}
  .single-case__btn .btn{width: 100%;}
  .single-case__tel{margin-bottom: 30px;}
  .dl-block-img{max-width: 200px;}
	.float-cta a{font-size: 1em;}
}