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

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

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

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

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


/*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:#d6faff;
 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:7px;
 padding:5px;
 background:#ff9393;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
/*任意の調整*/
.any{
 font-size:7px;
 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;
 padding:1em 0;
 margin-top:30px;
 width:100%;
 background:#00ccff;
 color:#fff;
 font-size:18px;
 font-weight:bold;	 
 border-radius:2px;
 border: none;
}
/*送信ボタンマウスホバー時*/
#formbtn:hover{
 background:#fff;
 color:#00ccff;
}

/*グローバルナビメニュー説明*/
	.sub-caption{
	font-size:14px; /*文字サイズ*/
	color:#cff; /*文字色*/
}

/*マウスオーバー時の文字色と背景色を変更*/
#navi .navi-in a:hover{
	color: #000000!important;
	font-weight: bold;
	background: #f7fcfe;
	transition: all 0.5s ease;
}
#navi .navi-in a:hover .sub-caption{
	font-size:14px; /*文字サイズ*/
	font-weight: bold;
	color: #369; /*文字色*/
}
.wp-block-navigation-item__content:hover{
	color: #f7fcfe!important;
	font-weight: bold;
	background: #006699;
	transition: all 0.5s ease;
}

input[type="search"] {
  width: 100%;
  flex-grow: 1;
}

/*SDM ダウンロード説明ページの左右分割表示キャンセル*/
.sdm_post_item_top_left{
	float: none;
	width: auto;
}

.sdm_post_item_top_right{
	float: none;
	width: auto;
}

/* SDMカード表示用のCSS*/
.download-display{
	height: 100%;
	width: 100%;
    margin: 0 !important;
	padding: 20px;
    text-align: center;
    box-shadow: 0 0 8px gray;
}

.download-display-title{
    font-size: 20px;
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.download-display-info
{
    margin-left: 0px;
    margin-right: 0px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 0px;
    font-size: 15px;
    font-weight: light;
}

.download-display-thumbnail .sdm_download_thumbnail_image{
    width:320px !important;
    height:180px !important;
   float:none !important;
}

.grid-container {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	grid-template-rowss: repeat(auto-fill, 300px);
	gap: 10px;
	margin: 0px!important;
	padding: 20px!important;
}

.mmd {
	display: none;
}
.blender {
	display: none;
}
.voice {
	display: none;
}
.song {
	display: none;
}
.material {
	display: none;
}
.mmd-model {
	display: none;
}
.others {
	display: none;
}
#all:checked ~ .grid-container .download-display {
	display: block;
}
#mmd:checked ~ .grid-container .mmd {
	display: block;
}
#blender:checked ~ .grid-container .blender {
	display: block;
}
#voice:checked ~ .grid-container .voice {
	display: block;
}
#song:checked ~ .grid-container .song {
	display: block;
}
#material:checked ~ .grid-container .material {
	display: block;
}
#mmd-model:checked ~ .grid-container .mmd-model {
	display: block;
}
#others:checked ~ .grid-container .others {
	display: block;
}

input[type="radio"] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.file-type {
	display: inline-block;
	border-radius: 5px;
	border: 2px solid #ccc;
	padding: 5px 10px;
	cursor: pointer;
	background-color: #fff;
	color: #333;
	margin-right: 10px;
	font-weight: normal;
	box-shadow: 0px 2px 3px rgba(0,0,0,0.1);
}

.file-type:hover {
	background-color: #bef9ff;
}

input:checked + .file-type {
	background-color: #2d2a7e;
	border-color: #2d2a7e;
	font-weight: bold;
	color: #fff;
}

.file-type:first-of-type {
	margin-left: 0;
}

.file-type:last-of-type {
	margin-right: 0;
}