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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

body,#container,#content,#main{
	background-color:#f9f9f9 !important;
}

body.home #header {
/* 	background-color: #000; */
/* 	background:url(http://portfolio.nyanco.me/wp-content/uploads/2025/03/image_fx_-3.png); */
/* 	background-size: cover; */
/* 	background-position: center; */
}
body.home #header .site-name-text{
/* 	color:#fff !important; */
}

.skin-grayish #navi-in {
	background:#000;
	opacity:0.9;
}
body:not(.page.home) #header-container .site-name-text{
	font-size:1rem;
	letter-spacing:2px;
	color:#fff;
}
body:not(.page.home) #header-container{
	background:#000;
}
.navi .item-label, .navi .item-description{
	color:#aaa;
}
#header{
	  opacity: 0;
  animation: fadeIn 2s ease-in-out forwards;
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.tagline{
	font-size:1.5rem;
	color:#aaa;
	font-family: Roboto Condensed, sans-serif !important;
}

.link-sns{
	font-family: Roboto Condensed, sans-serif !important;
	font-weight:bold;
	font-size:2rem;
}
.link-sns a{text-decoration:none !important;}
.link-sns a:hover{
	opacity:0.8;
}

.pagination-next{display:none;}


.no-dis{
	display:none;
}

.site-name-text{
	font-family: Roboto Condensed, sans-serif !important;
    font-weight: 700 !important;
}


.class-h3{
	text-align:center;
	font-size:24px;
	font-family: Roboto Condensed, sans-serif !important;
    font-weight: 700;
    letter-spacing: 8px;
	margin-top:220px;
}
.class-h4{
	text-align:center;
	font-size:15px;
/*     font-weight: bold; */
	font-weight:thin;
	color:#aaa;
	color:#000;
	letter-spacing: 6px;
}

.random-post {
    position: relative;
}

.random-post::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 40px;
    background: linear-gradient(to top, rgba(249, 249, 249, 1) 0%, rgba(249, 249, 249, 0) 100%);
    pointer-events: none;
	z-index:99999;
}



.random-posts-container{
	max-width:100% !important;
	display: flex; 
	flex-wrap: wrap; 
	justify-content: space-between;
}

.random-post{
	width:32%;
	margin-bottom:20px;
	overflow: hidden;
}
.random-post a img{
  object-fit: cover;
  transition: transform 0.4s ease;
}

.random-post a img:hover{
	    transform: scale(1.1);
}


.btn01-wrap{
	display:flex;
	justify-content:center;
	margin:25px auto 100px !important;
}

.background_btn01 {
  position: relative;
  width: 100%;
  max-width: 250px; /* ボタンの幅 */
  color: #fff; /* 文字色 */
	font-family: Roboto Condensed, sans-serif !important;
    font-weight: 500;
	background:#2CA3B6; /* 背景色 */
	background:#bbb; /* 背景色 */
  transition: all 0.5s;
  text-decoration: none;
  text-align: center;
	font-size:1rem;
  display: inline-block;
  padding: 0.3em 2em 0.2em;
}

/* マウスオーバーした際のデザイン */
.background_btn01::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.4s;
  border: 2px solid #bbb; /* 枠の色 */
  transform: scale(1.5,1.5);
  opacity: 0;
  z-index: 1;
}
.background_btn01:hover {
  background: #fff; /* 背景色 */
  opacity: 1 !important;
	color:#bbb;
}
.background_btn01:hover::after {
  opacity: 1;
  transform: scale(1,1);
}








.eye-catch-wrap .eye-catch{
  display: none !important;
}



.related-entry-card-title, .entry-card-title{
	font-size:14px !important;
}
h1.entry-title{
	font-size:18px;
	/*font-weight:normal;*/
}
h2.wp-block-heading{
	background:none;
	padding:10px 0px !important;
}
.under-entry-content{
	display:none;
}

.box-app{
	padding:10px 15px;
	background:#ededed;
	font-size:12px;
	line-height:1.2rem;
}

.wp-block-search__label{
	display:none;
}
.skin-grayish .archive-title{
	border:none;
	font-family: "Montserrat", Meiryo, "Hiragino Kaku Gothic ProN", "Hiragino Sans", var(--skin-grayish-default-font), sans-serif;
	font-weight:normal;
}
.archive-title span{
	display:none;
}


/**** common */
html{
	scroll-padding-top: 160px; // ヘッダーの高さ分設定
}

/******* margin *******/
.mt0{margin-top:0px !important;}
.mt5{margin-top:5px;}
.mt10{margin-top:10px;}
.mt20{margin-top:20px;}
.mt30{margin-top:30px;}
.mt40{margin-top:40px;}
.mt50{margin-top:50px;}
.mt60{margin-top:60px;}
.mt80{margin-top:80px;}
.mt100{margin-top:100px;}
.mt120{margin-top:120px;}

.mb0{margin-bottom:0px !important;}
.mb3{margin-bottom:3px;}
.mb5{margin-bottom:5px;}
.mb10{margin-bottom:10px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mb40{margin-bottom:40px;}
.mb50{margin-bottom:50px;}
.mb60{margin-bottom:60px;}
.mb80{margin-bottom:80px;}
.mb100{margin-bottom:100px;}
.mb120{margin-bottom:120px;}
.mb140{margin-bottom:140px;}

.btn-close{
	font-weight:bold;
	text-align:center;
	background:#ddd;
	padding:15px 0px;
	border-radius:5px;
}

.youtube {
	width: 80%;
	aspect-ratio: 16 / 9;
	margin:0px auto;
}

.youtube iframe {
	width: 100%;
	height: 100%;
	border-radius: 20px;
}

.red-box {
    border: #cb1339 3px solid;
    padding: 10px;
    color: #cb1339;
}


/* 20250206 add */
.PostItem__tag{
  font-size: clamp(1.1rem, 1.205rem + 0.254vw, 1.3rem);
  line-height: 1.3;
	display:block;
	color:#c91339;
	border:#c91339 solid 1px;
	border-radius:3px;
	text-align:center;
	padding:2px 2px;
	margin-bottom:5px;
}
/* /20250206 add */

.sp-show{display:none;}
.pc-show{display:block;}

/*********** text ************/
.red{color:#CB1A3F;}
.bold{font-weight:bold;}
.t-c{text-align:center;}
.t-l{text-align:left;}
.t-r{text-align:right;}

.f-s{font-size:0.9em;}
.f-ss{font-size:0.7em;}
.f-l{font-size:1.2em;}
.f-ll{font-size:1.4em;}
.f-lll{font-size:1.6em;}
.f-llll{font-size:1.8em;}

.t-d-u{text-decoration:underline !important;}

/*********** flexbox ************/
.f-wrap{
    display:flex;
    justify-content: space-between;
    margin-bottom: 20px;
}
.j-c-c{justify-content:center;}
.a-i-c{align-items:center;}

/* 1/2 */
.w30{width:30%;}
.w-floor{width:67%;}

.f5{width:5%;}
.f15{width:15%;}
.f20{width:20%;}
.f40{width:40%;}
.f45{width:45%;}
.f55{width:55%;}
.f58{width:58%;}
.f58-5{width:58.5%;}
.f59{width:59%;}
.f60{width:60%;}
.f80{width:80%;}
.f90{width:90%;}


/* 2 */
.f2-1{width:49%;}
.f2-1-nores{width:49%;}
.f2-1-48{width:48%;}
.f2-1-67{width:67%;}

.f2-1-40{width:54%;}
.f2-1-60{width:45%;}

/* 3 */
.f3-1-100{width:100%;}
.f3-1{width:33%;}
.f3-1-32{width:32%;}
.f3-2{width:66%;}

.f3-2-60-saraya{width:60%;}
.f3-1-30-saraya{width:36%;}


/* 4 */
.f4-1{width:24%;}
.f4-2{width:78%;}
.f4-3{width:74%;}
/* 5 */
.f5-1{width:19%;display: flex;align-items: center;}
.f5-3{width:57%;display: flex;align-items: center;}



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

.sp-show{display:block;}
.pc-show{display:none;}
	
}




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

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

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