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

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

/* フォント */



/* メニュー */

.header-container-in {
	display:flex;
	justify-content: space-between;
	margin:0 10%;
}

.header-in {
	width:fit-content;
}


.logo {
	width: fit-content;
	text-align: center;
	padding-bottom: 0;
}

#menu-menu {
	width: fit-content;
}

.navi-in {
	width: fit-content;
}

.navi {
	width: fit-content;
	display:flex;
	align-items: flex-end;
	margin-bottom: 10px;
}

.item-label {
  font-size:20px;
  max-width:80px;
  height:45px;
	margin: 0 auto;
}


.item-label:hover {
  font-size:21px;
  color:#f6a53a;
  transition: 0.5s;
}

.content-top {
  margin:0;
}

.content-top-in {
  width:100%;
}

.header-container-in.hlt-top-menu{
	display: flex;
	align-items: center;
}

.header-container-in.hlt-top-menu .wrap {
	margin-right:20px;
}

/* 更新日時を削除 */
.post-35 .date-tags {
  display: none;
}

.post-348 .date-tags {
  display: none;
}

.post-116 .date-tags{
display:none;
}

.post-273 .date-tags{
	display:none;
}


/* カテゴリーラベルを削除 */
.cat-label {
display: none;
}

/* 投稿アイキャッチ画像消去 */
.eye-catch-wrap > figure > img{
	display:none;
}

/* タイトルを中央寄せ */
.entry-title {
	text-align:center;
}

/* 投稿文を中央寄せ */
.entry-content>p {
	text-align: center;
}

/* キャッチコピー */
.catch-copy {
	text-align: center;
	font-size: 1.2rem;
	padding: 30px 0;
	max-width: 1400px;
	margin: 0 auto;
	background-image: url("http://yoko-y-jewelry.com/wp-content/uploads/2023/05/catch-copy1-e1683772679990.png");
 	background-size: 500px;
}

/* PCで消す */
.pc-hide{
	display: none;
}


/* 見出し */
.article h1, .article h2, .article h3, .article h4, .article h5, .article h6 {
  line-height: 1.25;
  font-weight: normal;
}

#post-35 > header > h1 {
	display: none;
}

#post-348 > header {
	display:none;
}

.article h1 {
  padding-top: 80px;
	position: relative;
}

.article h1::before {
	background-color: #f6a53a; /* 線の色 */
  border-radius: 5px; /* 線の両端を丸く */
  bottom: -10px; /* 線の位置 */
  content: "";
  height: 3px; /* 線の高さ */
  left: 50%; /* 線の中央寄せ */
  position: absolute;
  transform: translateX(-50%); /* 線の中央寄せ */
  width: 30px; /* 線の長さ */
}

.article h2 {
  background-color:#ffffff;
}

/* 新着記事 */

#post-35 > div > div:nth-child(1) > ul > li{
	box-shadow:5px 5px 15px var(--cocoon-x-thin-color);
	border: 1px solid #e8e8e8;
	padding: 10px;
	margin: 10px 8px;
}

#post-35 > div > div > ul > li > div.wp-block-latest-posts__featured-image.aligncenter > a > img {
  width: 100%;
  height: 300px;
	object-fit: cover;
}

#post-35 > div > div:nth-child(1) > ul{
	max-width: 90%;
	padding-left: 0;
}

#post-35 > div > div:nth-child(1) > ul > li:nth-child(1) > div.wp-block-latest-posts__featured-image.aligncenter > a > img {
	object-fit: contain;
}


/* ボタン */

a.btn {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 200px;
	margin: auto;
	padding: 0.5rem 1rem;
	font-size:16px;
	font-weight: bold;
	border: 2px solid #f6a53a;
	color: #f6a53a;
	background-color:#ffffff;
	transition: 0.5s;
	border-radius:0;
}
a.btn:hover {
	color: #fff;
	background: #f6a53a;
}

.fa-position-right {
  position: absolute;
  top: calc(50% - .5em);
  right: 1rem;
}


/* ギャラリー */

/* プロフィール */
.wp-block-media-text .wp-block-media-text__content{
	padding: 15px !important;
}

#post-35 > div > div.wp-block-group.alignwide.is-layout-constrained.wp-block-group-is-layout-constrained > div.wp-block-group.alignwide.is-layout-constrained.wp-block-group-is-layout-constrained > div.wp-block-columns.alignwide.has-small-font-size.is-layout-flex.wp-container-core-columns-is-layout-1.wp-block-columns-is-layout-flex > div > div > figure > img {
	padding: 15px !important;
}

#post-35 > div > div.wp-block-group.alignwide.is-layout-constrained.wp-block-group-is-layout-constrained > div.wp-block-group.alignwide.is-layout-constrained.wp-block-group-is-layout-constrained > div.wp-block-columns.alignwide.has-small-font-size.is-layout-flex.wp-container-core-columns-is-layout-28f84493.wp-block-columns-is-layout-flex > div > div > figure > img {
	width: 50% !important;
	display:block !important;
	margin:0 auto !important;
	box-shadow: none !important;
}


#post-35 > div > div > ul > li > a {
	color: #7c7c7c;
	font-weight: bold;
	text-decoration:none;
}


/* お問い合わせフォーム */
/*Contact Form 7カスタマイズ*/
/*スマホContact Form 7カスタマイズ*/
@media(max-width:500px){
.inquiry th,.inquiry td {
 display:block!important;
 width:100%!important;
 border-top:none!important;
 -webkit-box-sizing:border-box!important;
 -moz-box-sizing:border-box!important;
 box-sizing:border-box!important;
}
.inquiry tr:first-child th{
 border-top:1px solid #d7d7d7!important;
}
/* 必須・任意のサイズ調整 */	
.inquiry .haveto,.inquiry .any {	
font-size:10px;
}}
/*見出し欄*/
.inquiry th{
 text-align:left;
 font-size:14px;
 color:#444;
 padding-right:5px;
 width:30%;
 background:#f7f7f7;
 border:solid 1px #d7d7d7;
}
/*通常欄*/
.inquiry td{
 font-size:13px;
 border:solid 1px #d7d7d7;	
}
/*横の行とテーブル全体*/
.entry-content .inquiry tr,.entry-content table{
 border:solid 1px #d7d7d7;	
}
/*必須の調整*/
.haveto{
 font-size:10px;
 padding:5px;
 background:#ff9393;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
/*任意の調整*/
.any{
 font-size:10px;
 padding:5px;
 background:#93c9ff;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
/*ラジオボタンを縦並び指定*/
.verticallist .wpcf7-list-item{
 display:block;
}
/*送信ボタンのデザイン変更*/
#formbtn{
 display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 200px;
	margin: auto;
	padding: 0.5rem 1rem;
	font-size:16px;
	font-weight: bold;
	border: 2px solid #f6a53a;
	color: #f6a53a;
	background-color:#ffffff;
	transition: 0.5s;
	border-radius:0;
}
/*送信ボタンマウスホバー時*/
#formbtn:hover{
	color: #fff;
	background: #f6a53a;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px) {
#container > ul > li.search-menu-button.menu-button{
		display:none;
	}
}

/*834px以下*/
@media screen and (max-width: 834px) {
	  p {
    font-size: 16px;
  }
	
	.header-container-in {
	display:flex;
	width: fit-content;
	margin:0;
}
	
/* ヘッダー */


.header-in {
	width:fit-content;
}

.logo {
	width: fit-content;
	text-align: center;
	padding-bottom: 0;
}
	
	.logo-header
	img{
		width:200px;
	}

/* キャッチコピー */
	.catch-copy {
	font-size: 1rem;
	width: 100%;
}
	
/* pcのみ消す */
	.pc-hide{
		display: block;
	}

  /* メニュー */
	
	.menu-content {
		background-color:rgb(255,255,255,0.85)
	}
	
	.logo-menu-button img{
		position: fixed;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
		margin:0;
		width:180px;
		max-height: 80px;
	}
	
	.has-logo-button .menu-button {
		margin: auto 5px;
	}
	
	.mobile-menu-buttons .menu-button {
		margin: 10px 0;
	}
	
	.mobile-menu-buttons .menu-caption {
		font-size:0;
	}
	.mobile-menu-buttons .menu-caption::before {
		font-size:12px;
		content: "menu"
	}
	
	#container > ul > li.search-menu-button.menu-button{
		display:none;
	}

	.metaslider{
		margin-top: 10px !important;
	}
	

  /* 見出し */
  .article h1 {
    padding-top: 80px;
    margin-bottom: 20px;
  }
	
	
  /* 余白 */
  .space {
    height: 0 !important;
  }
	
/* 新着記事 */
	
	.wp-block-latest-posts.columns-3 li {
    width: 90%;
		max-width: 600px;
}
	
	#post-35 > div > div:nth-child(1) > ul > li:nth-child(1){
		margin: 0 auto;
	}
	
	#post-35 > div > div:nth-child(1) > ul > li:nth-child(2){
		display: none;
	}
	
	#post-35 > div > div:nth-child(1) > ul > li:nth-child(3){
		display: none;
	}

	
/* プロフィール */
	.wp-block-media-text .wp-block-media-text__content{
	padding: 5px !important;
}
	
	.profile-name {
	font-size: 22px !important;
	text-align:center;
}
	.profile-name-e {
		font-size: 16px !important;
		text-align: center;
	}
	.profile-detail {
		font-size: 16px !important;
	}
	
	.profile-space {
		display:none !important;
	}
	
	/* 投稿文を左寄せ */
.entry-content>p {
	text-align: left;
}

}

/*480px以下*/
@media screen and (max-width: 480px) {
}