@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.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/

/* Googleフォント */
@import url('https://fonts.googleapis.com/css2?family=RocknRoll+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300..600&display=swap');


/* 共有設定 */

html {
    scroll-behavior: smooth;
	scroll-padding-top: 80px;
}
@media screen and (max-width: 1023px){
html {
	scroll-padding-top: 20px;
}
}

body {
  overflow-x: hidden;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
  font-style: normal;
  line-height:1.6;
  color:#222;
  background:#0090DF;	
	--wp--style--global--content-size: 1040px;
}
@media screen and (max-width: 1080px){ /*オリジナルの設定値 */
body {	
	--wp--style--global--content-size: 840px;
}
}

/* 表（テーブル） */
.home table {
	margin-bottom:60px !important;
}
.page-id-546 table {
	margin-bottom:0 !important;
}
.page-id-546 table tr td:first-child {
  white-space: nowrap;
}

/* 画像 */
.column-left img {
		border-radius:80% 55%;
}
.plan .column-left img {
		border-radius:8px;
}
.column-right img {
		border-radius:80% 55%;
}
.center img {
		border-radius:80% 55%;
		margin-top:-40px;
}

@media screen and (max-width: 834px){
.column-left img,
.column-right img,
.center img {
	display:block;
	margin:0 auto 20px !important;
}	
}

/* リンク文字 */

a {
	text-decoration:none;
}
a:hover {
	color:#aaaaaa;
}

/* ブログカードのラベル色 */
.blogcard-label.internal-blogcard-label {
	background:#FF0055;
}
.orange .blogcard-label.internal-blogcard-label {
	background:#f27400;
}
.green .blogcard-label.internal-blogcard-label {
	background:#01946c;
}
.blue .blogcard-label.internal-blogcard-label {
	background:#0090df;
}

/* リストのマーク */
.article ul,ol {
	margin-top:40px;
	
	padding-left:0;
	line-height:1.6;
	list-style: none;
}
.article ul li
{
  position: relative;
  padding: 0 0 0 1.4em;
  margin: 0;
  margin-bottom: 20px !important;
}
.article ol li {
  margin-bottom: 20px !important;	
}
.article ul li::before {
  position: absolute;
  left: 0;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: '\f152';
  color: #F6AC00;
}
li:last-child {
	margin-bottom: 0 !important;
}
.wp-block-cover ul,
.wp-block-cover ol {
	margin-bottom:40px;
	 line-height:1.8 !important;
}


.speech-balloon p {
	margin-bottom:1em !important;
}
.speech-balloon p:last-child {
	margin-bottom:0 !important;
}

/* 長いボタン */
.btn-wrap a {
	line-height:1.8;
	font-size:24px !important;
	margin-top:60px !important;
		margin-bottom:20px !important;
}
@media screen and (max-width: 1123px){
.btn-wrap a {
	font-size:22px !important;
}
}
@media screen and (max-width: 1023px){
.btn-wrap a {
	font-size:20px !important;
}
}
@media screen and (max-width: 834px){
.btn-wrap a {
	text-align:left;
	font-size:18px !important;
}	
}
@media screen and (max-width: 480px){
.btn-wrap a {	
		margin-bottom:0 !important;
	border-radius:20px;
}
}


/* スマホのみの改行用 */
.sp-br {
	display:none;
}
@media screen and (max-width: 480px){
.sp-br {
	display:block;
}
.sp-no {
	display:none;
}
.sp-only {
	display:block;
	margin-top:20px;
}
}

/* 各余白を削除 */
.content,
.page.no-sidebar .main,
.page.no-sidebar .article,
.page.no-sidebar .entry-content,
.page.no-sidebar .entry-footer
{
	padding:0 !important;
	margin:0 !important;
	background:#0090DF;
}
.page.no-sidebar .content {
	margin-bottom:-20px !important;
}

@media screen and (max-width: 834px){
.page.no-sidebar .content {
	margin-bottom:-34px !important;
}
}

/* カバーブロックを全幅にする */

.entry-content .wp-block-cover,
.entry-content .wp-block-cover-image {
  margin: 0 calc((100% - 100vw)/2) ;
  min-height: auto;
  width: auto;
  padding-top:80px;
  padding-bottom:80px;
}

.page-cover {
	margin-top:-1px !important;
}

@media screen and (max-width: 1023px){
.entry-content .wp-block-cover,
.entry-content .wp-block-cover-image {

}
}
@media screen and (max-width: 480px){
.entry-content .wp-block-cover,
.entry-content .wp-block-cover-image {

}
.wp-block-cover__inner-container {
	margin-top:-60px !important;/* 応急処置 */
}
}

/* 2カラム */
.column-wrap {
    gap:2em;
}
@media screen and (max-width: 834px){
.column-2.order .column-left {
	order:2;
}		
.column-2.order .column-right {
	order:1;
}
}

/* 見出し */
h1,
h2,
h3,
h4,
h5 {
  font-family: "Noto Sans JP", sans-serif;	
}

.page.no-sidebar h1.wp-block-heading {
  font-weight: 600;	
font-size:48px;
	background:none;
	padding:0;
	line-height:1.5;
	letter-spacing:0.05em;
	text-align:center;
}

.page.no-sidebar h2.wp-block-heading {
  font-weight: 600;	
font-size:40px;
	background:none;
	padding:0;
	line-height:1.5;
}

.page.no-sidebar h3.wp-block-heading {
  font-weight: 400;	
font-size:32px;
	background:none;
	padding:0;
	line-height:1.5;
	border:none;
}

.page.no-sidebar h4.wp-block-heading {
  font-weight: 400;	
font-size:24px;
	background:none;
	line-height:1.5;
	border-top:solid 4px #fff;
	border-bottom:solid 4px #fff;
}

/* 2番目以降のh3に適用 */
.wp-block-cover__inner-container h3 ~ h3 {
	margin-top:80px;
}

@media screen and (max-width: 1023px){


.page.no-sidebar h1.wp-block-heading{
font-size:40px;		
}	
	
.page.no-sidebar h2.wp-block-heading {
font-size:34px;
}
.page.no-sidebar h3.wp-block-heading {
font-size:30px;
}	
}

@media screen and (max-width: 834px){
h3.wp-block-heading.margin100 {
	margin-top:100px;
}
}

@media screen and (max-width: 480px){

.page.no-sidebar h1.wp-block-heading{
font-size:36px;	
	margin-top:40px !important;
}		

.page.no-sidebar h2.wp-block-heading {
font-size:27px;
	margin-top:40px !important;
}
.page.no-sidebar h3.wp-block-heading {
font-size:26px;
}
	
/* 2番目以降のh3に適用 */
.wp-block-cover__inner-container h3 ~ h3 {
	margin-top:60px;
}	
}




/* ヘッダー */

#header-container.header-container {
	background:#0090DF;	
	border-radius:0 0 20px 20px;
}
.tagline {
	margin-bottom:-20px !important;
	padding-bottom:0 !important;
	font-size:18px;
	font-weight: 600;	
}
.site-name-text {
  font-family: "RocknRoll One", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size:24px !important;
  letter-spacing:0.15em;
  color:#fff;
}

nav,
.navi-in {
	background:#0090DF;	
	border-radius:0 0 20px 20px;	
}
nav .menu-header a {
	font-size:15px;	
	color:#fff;
}
nav .menu-header li a {
padding-left:11px !important;
padding-right:11px !important;	
}


@media screen and (max-width: 1123px){
nav .menu-header li a {
padding-left:7px !important;
padding-right:7px !important;	
}
}

#menu-item-1879 a:link,
#menu-item-1812 a:link,
#menu-item-1316 a:link,
#menu-item-1227 a:link,
#menu-item-1041 a:link,
#menu-item-168 a:link {
	background:#10AFFF;	
}

#menu-item-167 {
	background:#F6AC00;
	font-weight:bold;
}
#menu-item-167 .item-label:before {
	font-family: "Font Awesome 5 Free";
  content: '\f086';
	margin-right:6px;
}
#navi #menu-item-167 {
	margin-right:20px;
}

/* モバイルボタン */
.mobile-footer-menu-buttons.mobile-menu-buttons {
	background:#0090DF;
}
.menu-button .menu-icon,
.menu-button .menu-caption{
	color:#fff;
}
.menu-drawer a {
	color:#333;	
	border-bottom:solid #44B7FF 2px;
}
.navi-menu-close-button.menu-close-button {
	color:#0090DF;	
}
.menu-item-167 a {
	color:#f39800;
	font-weight:bold;
}

/* モバイルメニュー */
.menu-item-1651 a:before,
.menu-item-1652 a:before,
.menu-item-1653 a:before,
.menu-item-1654 a:before,
.menu-item-1655 a:before {
	font-family: "Font Awesome 5 Free";
  content: '\f101';
	color:#0090DF;
	font-weight:800;
	margin-right:6px;
}

.menu-item-1815 {
	margin-top:24px;
}

.menu-item-1646 a,
.menu-item-1645 a,
.menu-item-1649 a,
.menu-item-1644 a,
.menu-item-1650 a,
.menu-item-1815 a,
.menu-item-1880 a
{
background:#10AFFF;	
	color:#fff;
}


.menu-drawer .menu-item-1647 a {
	margin-top:24px;
	padding:20px;
	color:#fff;
	background:#F6AC00;
	border-bottom:none;
	text-align:center;
	font-size:22px;
	font-weight:600;
}
.menu-drawer .menu-item-1647 a:before {
	font-family: "Font Awesome 5 Free";
  content: '\f086';
	margin-right:6px;
} 

.navi-menu-content {
  left: auto;
  right: 0;
  transform: translateX(105%);
}

.page.no-sidebar .article-header.entry-header {
	display:none;
}

@media screen and (max-width: 1023px){
.site-name-text {
	font-size:32px !important;	
}
}


@media screen and (max-width: 480px){
.tagline {
	margin-top:30px;
	margin-bottom:-20px !important;
	padding-bottom:0 !important;
	font-size:15px;
	font-weight: 600;	
}
.site-name-text {
	font-size:24px !important;	
}
}

/* ホームHERO */
.hero {
	margin:-1px 19px 40px !important;
	border-radius:30px 0 0 30px;
	position:relative;
	height:640px;
}
.hero .copy {
  position:absolute;
  top:-270px;
  left:20px;
  z-index:1000 !important;	
}
.hero h1.wp-block-heading.main-copy {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size:60px;
  letter-spacing:0.03em;	
  line-height:1.5;
  margin-bottom:40px;
}
.hero .sub-copy {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  font-style: normal;
	font-size:25px;
	letter-spacing:0.04em;	
	margin-bottom:14px !important;
	line-height:1.8;
}
/* 実績ラベル */
.achievements {
	bottom:-260px;
	background:#0090DF;
	padding:8px 10px;
	 font-family: "Noto Sans JP", sans-serif;
	font-weight:600;
	font-size:18px;
	display:inline-block;
}
.achievements .label {
	color:#fff;
}
.achievements i {
	margin-right:4px;
	color:#FECB3C;
}

.hero-cta {
	background:#F6AC00;	
	padding:6px 40px;
	position:absolute;
  bottom:-320px;
  right:100px;
	z-index:910;
	display:none;
}

.hero-cta a {
	color:#fff;
		 font-family: "Noto Sans JP", sans-serif;
	font-size:30px;
	font-weight:600;
}




.notice {
	color:#0090DF;
	background:#fff;
	font-size:1.1em;
	padding:0 6px 6px;
	margin-right:10px;
	  letter-spacing:0.02em;	
}
.wp-block-cocoon-blocks-button-1.cta a {
	background:#F6AC00;	
	font-size:20px;
	padding:14px 40px;
}
.wp-block-cocoon-blocks-button-1.cta a:before {
	font-family: "Font Awesome 5 Free";
  content: '\f086';
	margin-right:6px;
} 

/* スライダー */
#metaslider-id-225 {
	position:absolute;
	top:-260px;
	right:5px;
		z-index:900;
}
.slider-225 {
	border-radius:80% 55%;
}
.page-id-546 #metaslider-id-225 {
		position:static;
	top:0px !important;
}




@media screen and (max-width: 1250px){
.hero {
	margin:-1px 19px 40px !important;
	height:600px;
}		
.hero .copy {
  left:30px;
}	
.hero h1.wp-block-heading.main-copy {
  font-size:54px;
  line-height:1.6;
}
.hero .sub-copy {
	font-size:25px;
	margin-bottom:20px !important;
}	
#metaslider-id-225 {
	top:-240px;
	max-width: 480px !important;
	max-height: 480px !important;
}	
}

@media screen and (max-width: 1123px){
.hero {
	margin:-1px 19px 30px !important;
	height:580px;
}	
.hero .copy {
  top:-240px;
  left:30px;
}	
.hero h1.wp-block-heading.main-copy {
  font-size:44px;
}
.hero .sub-copy {
	font-size:24px;
	margin-bottom:20px !important;
}
}

@media screen and (max-width: 1023px){
.hero {
	height:480px;
}	
.hero .copy {
  top:-220px;
  left:40px;
}
	
.hero h1.wp-block-heading.main-copy {
  font-size:40px;
  letter-spacing:0.01em;
line-height:1.6;
}
.hero .sub-copy {
	font-size:22px;
	  letter-spacing:0.01em;	
}
	
/* 実績ラベル */
.achievements {
	padding:8px 10px;
	font-size:16px;
	margin-top:-10px;
}	
	
#metaslider-id-225 {
	top:-190px;
	right:30px;
	max-width: 380px !important;
	max-height: 380px !important;
}	
}
@media screen and (max-width: 930px){
.hero .copy {
  left:0px;
}
#metaslider-id-225 {
	right:-10px;
}
}

@media screen and (max-width: 834px){

.hero {
	height:500px;
}	
.hero .copy {
	margin-top:14px;
  position:static;
text-align:center;
}
	
.hero h1.wp-block-heading.main-copy {
  font-size:40px;
}
.hero .sub-copy {
	font-size:24px;
	text-align:center;
	margin-bottom:0 !important
}
	
/* 実績ラベル */
.achievements {
	padding:8px 10px;
	font-size:16px;
	margin-top:16px;
}		
	
#metaslider-id-225 {
	display:none;
}
.page-id-546 #metaslider-id-225 {
	display:block;
}

}


@media screen and (max-width: 600px){
.hero {
	height:500px;
}
	
.hero h1.wp-block-heading.main-copy {
  font-size:32px;
}
.hero .sub-copy {
	font-size:22px;
}	
/* 実績ラベル */
.achievements {
	padding:8px 10px;
	font-size:14px;
	margin-top:16px;
}		
	
}	

@media screen and (max-width: 480px){

.hero {
	margin:-1px 0 0 !important;
	height:548px;
	border-radius:0;
}
.hero .copy {
  position:absolute;
width:100%;
  top:-200px;
  left:0px;
	text-align:center;	
}
/* 実績ラベル */
.achievements {
	position:absolute;
	bottom:180px;
  left:0;	
	right:0;
	padding:4px;
	font-size:13px;
	margin-top:16px;
}
.achievements i {
	margin-right:1px;
}	
	
.hero h1.wp-block-heading.main-copy {
  font-size:26px;
		margin-top:0 !important;
	line-height:1.6;
}
.hero .sub-copy {
	display:none;
}
#metaslider-id-225 {
	display:block;
	top:-55px;
	left:0;
	right:0;
	margin:0 auto;
	max-width: 340px !important;
	max-height: 340px !important;
}	
}	

#footer{
	background:#0090DF !important;	
	border-radius:20px 20px 0 0 !important;
}

@media screen and (max-width: 1023px){
#footer{
	padding-bottom:50px;
	}
}


.navi-footer a,
.copyright {
	color:#fff;
}

/* 目次 */

.page.no-sidebar #toc {
	display:none;
}
.parent-pageid-976 #toc li ol {
	display:none;	
}



.toc-content ul,
.toc-content ol {
	margin-top:0 !important;
	padding-left:0 !important;
	line-height:2.0;
	list-style: none;
}
.parent-pageid-976 .toc-content ul,
.parent-pageid-976 .toc-content ol {
	line-height:1.2;
	list-style: none;
}

.toc-content ul li,
.toc-content ol li {
	font-weight:bold;
	margin-bottom:1em;
}

.toc-content ul li li,
.toc-content ol li li {
	font-weight:normal;
	padding-left:0.8em;
	margin-bottom:0 !important;
}

/* 記事一覧の最初に固定した記事の背景色を変更 */
.category-1 #list.list.ect-entry-card.front-page-type-index a:first-child,
.category-8 #list.list.ect-entry-card.front-page-type-index a:first-child,
#new_entries-2 a:first-child
{
background:#FFF3DF;
}
.paged.category-1 #list.list.ect-entry-card.front-page-type-index a:first-child,
.paged.category-8 #list.list.ect-entry-card.front-page-type-index a:first-child {
background:none;	
}


/* 記事ページ */
.single .article h2,
.page-id-976 h2,
.parent-pageid-976 h2,
.page-id-1293 h2,
.parent-pageid-1293 h2
{
	background:#ECF7FE;
	margin-top:50px;
	border-top:solid 1px #18AEFF;	
	border-bottom:solid 1px #18AEFF;
}

.parent-pageid-976 h2::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: '\f518';
	color:#18AEFF;
		margin-right:10px;
}

.page-id-976 .btn-wrap a::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: '\f518';
	color:#fff;
		margin-right:10px;
}



.parent-pageid-976 h2
{
	border-top:dotted 3px #18AEFF;	
	border-bottom:dotted 3px #18AEFF;
}



.single .article h3,
.page-id-976 .article h3,
.parent-pageid-976 .article h3,
.page-id-1293 .article h3,
.parent-pageid-1293 .article h3
{
	border-color:#18AEFF;
	border-top:none;
	border-right:none;
	border-bottom:none;
	border-left:solid #18AEFF 10px;	
	margin-top:50px;
	line-height:1.6;
}

h3.widget-sidebar-title {
	background:#ECF7FE;	
}

.single .article h4,
.page-id-976 h4,
.parent-pageid-976 h4,
.page-id-1293 h4,
.parent-pageid-1293 h4
{
	border-color:#18AEFF;	
	border-top:none;
	border-top:dotted #18AEFF 3px;
	border-bottom:dotted #18AEFF 3px;
	line-height:1.6;
}

.single .article h5,
.page-id-976 h5,
.parent-pageid-976 h5,
.page-id-1293 h5
{
	line-height:1.6;
}


/* 100アイデア */
.idea-nav {
  font-size: 0.85em;
  color: #666;
  margin:  -10px 0 40px;
	text-align:center;
}
.idea-nav a {
  text-decoration: none;
	margin:0 6px;
}
.idea-nav a:hover {
  text-decoration: underline;
}
@media screen and (max-width: 480px){
.idea-nav {
  font-size: 0.8em;	
}  
.idea-nav a {
  margin-right: 4px;
}	
}
.author-content {
	padding-top:10px;
}

li.logo-menu-button.menu-button {
	background:#F6AC00;
	padding-left:4px;
	padding-right:4px;
}

/* 本音 */
.h-list {
	width:94%;
	margin:0 auto;
}
.h-list li {
	background:#10AFFF;
	padding:8px 16px;
	border-radius:4px;
}
.h-list li a {
	color:#fff;
	display:block;
	font-size:18px;
	font-weight:600;
	  font-family: "Noto Sans JP", sans-serif;
}
.h-list li a i {
	margin-right:10px;
}
.page-id-1293 .wp-block-quote ,
.parent-pageid-1293 .wp-block-quote {
	background:#FDF4E1;
	border:none;
}
.page-id-1293 .wp-block-quote p ,
.parent-pageid-1293 .wp-block-quote p {
	font-size:20px;
}

.page-id-1293 blockquote::before,
.page-id-1293 blockquote::after,
.parent-pageid-1293 blockquote::before,
.parent-pageid-1293 blockquote::after
{
    color: #f27400;
}




/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
