@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.2
*/
/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/*画像のドラッグ＆ドロップ・スマホ長押し禁止*/
img {
-webkit-touch-callout: none;
-webkit-user-select:none;
-moz-touch-callout:none;
-moz-user-select:none;
-webkit-user-drag: none;
-khtml-user-drag: none;
user-drag: none;
touch-callout:none;
user-select:none;
}
/*右クリック禁止*/
.right-clik-none{
pointer-events: none;
}
/*ヘッダーメニューの縦ライン*/
#navi .navi-in > ul > li{
border-left: 1px solid #ffffff;
}
#navi .navi-in > ul > li:last-child{
border-right: 1px solid #ffffff;
}
/*ヘッダーメニューのフォントサイズ変更*/
.navi-in .menu-header .item-label{
font-size: 12px;
font-weight: bold;
letter-spacing: 0.1em;
}
/*ヘッダーモバイルボタンの背景色*/
.mobile-menu-buttons{
background-color: #1f2e55;
color: #ffffff;
box-shadow: none;
}
.mobile-menu-buttons .menu-button > a{
color: #ffffff;
}
/*スライドインメニューを右から*/
.navi-menu-content{
left: auto;
right: 0;
background-color: #1f2e55;
transform: translateX(101%);
}
/*スライドインメニューをカスタマイズ*/
.navi-menu-content{
left: auto;
right: 0;
background-color: rgba(31,46,85,0.5);
transform: translateX(101%);
}
.menu-drawer a{
font-size: 14px;
font-weight: bold;
letter-spacing: 0.1em;
color: #ffffff;
padding: 22px 0 22px 0;
}
.menu-drawer a:hover{
color: rgba(255,255,255,0.5);
background-color: rgba(31,46,85,0);
}
.menu-drawer li{
border-bottom: solid 1px #ffffff;
}
/*フッター*/
.footer{
margin-top: 0px;
}
/*フッターメニューのフォントサイズ等変更*/
#navi-footer-in a{
font-size: 12px;
display: inline-block;
position: relative;
}
.navi-footer-in a:hover{
background: none!important;
position: absolute;
}
/*フッターメニューの縦ラインを削除等*/
#navi-footer-in li{
border: none;
}
.footer-bottom-content{
font-size: 12px;
float: none;
text-align: center;
}
/*フッターウィジットの調整*/
.footer-widgets.cf{
margin: 0px;
}
.footer-left{
padding: 0px;
}
.footer-center{
text-align: center;
padding: 0px;
}
.footer-right{
padding: 0px;
}
/*フッターロゴの位置*/
.footer-center #media_image-2{
margin-top: 40px;
margin-bottom: 0px;
padding-bottom: 20px;
}
/*フッターロゴのhover なし*/
.footer-center a:hover{
background: none!important;
}
/*ポリシー＆コピーライトのスペース*/
.footer-bottom{
margin-top: 0px;
}
/*コピーライトの位置＆文字サイズ*/
.source-org.copyright{
margin-top: 0px;
font-size:　10px;
letter-spacing: 0.05em;
}
/*モバイルフッターウィジットの調整*/
.footer-widgets-mobile.cf{
margin: 0px;
}
/*モバイルフッターロゴの位置*/
.footer-mobile #media_image-3{
margin-top: 40px;
margin-bottom: 0px;
padding-bottom: 20px;
}
/*モバイルフッターロゴを中央揃え*/
.footer-widgets-mobile .widget_media_image{
text-align: center;
}
/*モバイルフッターロゴのhover なし*/
.footer-mobile a:hover{
background: none!important;
}
/*固定ページのタイトルを削除*/
.page .entry-title{
display: none;
}
/*固定ページの投稿日を削除*/
.page .date-tags{
display: none;
}
/*メインコンテンツの上下の位置調整*/
#content.content.cf{
margin-top: 30px;
}
#main.main{
padding-top: 0px;
padding-bottom: 0px;
margin-top: 0px;
margin-bottom: 0px;
}
/*エントリーコンテンツの上下の位置調整*/
.entry-content.cf{
margin-top: 0px;
margin-bottom: 0px;
padding-left: 7px;
padding-right: 7px;
}
/*ホームのID*/
#post-1172{
margin-bottom: 0px;
}
/*ギャラリー文字の位置調整*/
.wp-block-image img.wp-image-1777{
margin-top:15px;
margin-bottom:20px;
}
/*ギャラリーの位置調整*/
.wp-block-group .wp-block-image{
margin-bottom: 0px;
}
/*ギャラリー画像のhover 設定*/
.wp-block-image img.wp-image-1431{
filter: grayscale(100%);
transition: all 0.8s ease-in;
}
.wp-block-image img.wp-image-1431:hover {
filter: grayscale(0%);
}
.wp-block-image img.wp-image-1420{
filter: grayscale(100%);
transition: all 0.8s ease-in;
}
.wp-block-image img.wp-image-1420:hover {
filter: grayscale(0%);
}
.wp-block-image img.wp-image-1421{
filter: grayscale(100%);
transition: all 0.8s ease-in;
}
.wp-block-image img.wp-image-1421:hover {
filter: grayscale(0%);
}
.wp-block-image img.wp-image-1419{
filter: grayscale(100%);
transition: all 0.8s ease-in;
}
.wp-block-image img.wp-image-1419:hover {
filter: grayscale(0%);
}
/*横幅いっぱいのグレー背景*/
.gray-back{
width: 100vw;
margin: 0 calc(50% - 50vw);
padding: 0 calc(50vw - 50%);
}
/*横幅いっぱいのホワイト背景*/
.white-back{
width: 100vw;
margin: 0 calc(50% - 50vw);
padding: 0 calc(50vw - 50%);
}
/*GoogleFont のCSS*/
.afacad-flux{
font-family: "Afacad Flux", sans-serif;
font-optical-sizing: auto;
font-weight: 600;
font-style: normal;
font-variation-settings:
"slnt" 0;
}
/*カテゴリーライン*/
.category-line{
width: 200px;
border-width:2px;
}
/*トップページテキスト*/
.top-text{
margin-top:5px;
margin-bottom:5px;
text-align:justify;
}
/*矢印*/
.arrow-down{
text-align: center;
}
.arrow-down:after{
content: "\f107";
font-family: Fontawesome;
font-size: 2rem;
color: #1f2e55;
}
/*ボタンのサイズ設定*/
.wp-block-button .wp-block-button__link{
width:240px;
}
/*もっと見るボタンのhover 設定*/
.more-button a:hover{
background-color: #1f2e55!important;
border-color: #1f2e55;
transition:1s;
color: #ffffff!important;
}
/*お問い合わせボタンのhover 設定*/
.contact-button a:hover{
background-color: #ffffff!important;
border-color: #1f2e55;
transition:1s;
color: #1f2e55!important;
}
.works-concept{
text-align:justify;
}
/*reCAPTCHAマーク位置*/
.grecaptcha-badge { bottom: 100px!important; }
/*カテゴリラベルの位置*/
.cat-label{
top: 0%;
left: 0%;
padding: 2px 8px;
border: 0;
opacity: 0.8; /*透過率80%*/
}
.eye-catch .cat-label{
display: none;
}
/*カテゴリラベルカード左寄せ*/
.ect-3-columns {
justify-content: flex-start;
}
/*必須マーク*/
.contact7 .must{
color: #FFF;
font-size: 10px;
margin-left: 10px;
padding: 2px 4px;
border-radius: 3px;
background: #1f2e55;
vertical-align: text-top;
}
/*送信ボタンのデザイン変更*/
#contact7_btn{
display: block;
padding: 1em 0;
margin-top: 20px;
margin-left: auto;
margin-right: auto;
width: 40%;
background: #1f2e55;
color: #fff;
font-size: 16px;
border-radius: 3px;
border: none;
transition: 0.4s;
}
/*送信ボタンマウスホバー時*/
#contact7_btn:hover{
background: #7d8488;
color: #fff;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
/*必要ならばここにコードを書く*/
/*1023px以下でPC用のロゴを消す*/
img.site-logo-image{
visibility: hidden;
width: 100vw;
}
/*1023px以下でモバイル用のロゴ表示*/
.logo-menu-button.menu-button{
background-image: url(https://akinai-design.com/wp-content/uploads/2024/09/mobile_header_logo_white.png);
background-size: auto 20px;
background-position: center;
background-repeat: no-repeat;
background-position: left;
margin-left: 25px;
}
/*モバイルメニューボタンのキャプションを消す*/
.mobile-menu-buttons .menu-caption{
display: none;
}
.mobile-menu-buttons{
align-items: center;
}
}
/*834px以下*/
@media screen and (max-width: 834px){
/*必要ならばここにコードを書く*/
/*新着記事表示*/
.new-entry-cards.large-thumb a {
width: 50%;
}
}
/*480px以下*/
@media screen and (max-width: 480px){
/*必要ならばここにコードを書く*/
/*新着記事表示*/
.new-entry-cards.large-thumb a {
width: 100%;
}
}