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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.box7left{
    float: left;
    max-width: 43%;
}
.box7right{
float: right;
    margin-right: 1em;
    max-width: 45%;
}

.bottom1{
max-width:850px;
margin:auto;"
}
.bottom01{
float:left;
margin:1em;
width: 44%;
}
.bottom02{
float:left;
margin:1em;
width: 44%;
}


.wpcf7 form.sent .wpcf7-response-output {
    border-color: red;
}
.skin-grayish.front-top-page .skinadd-topmv-scroll .skinadd-topmv-scroll__txt{
color: red;
}
.skin-grayish.front-top-page .skinadd-topmv-scroll::before{
border-width: 0px 0px 2px 2px !important;
border: solid red;
}

.box1{
margin:0 1em 0 1.5em;
}
dt{
font-weight: 600;
}
.article h2 {
    margin: 2em 0 2em 0;
}
.box11{
float:left;
}
.right11{
    background-image: url(/wp-content/themes/cocoon-child-master/img/koji01.jpg);
    background-repeat: no-repeat;
    aspect-ratio: 3 / 3;
    background-size: contain;
    float: right;
    text-indent: -9999px;
    max-width: 48%;
    /* grid-auto-columns: 500px; */
    /* background: #555; */
    height: 280px;
}
.right12{
    background-image: url(/wp-content/themes/cocoon-child-master/img/koji04.jpg);
    background-repeat: no-repeat;
    aspect-ratio: 3 / 3;
    background-size: contain;
    float: right;
    text-indent: -9999px;
    max-width: 48%;
    /* grid-auto-columns: 500px; */
    /* background: #555; */
    height: 280px;
}
.right10{
float:right;
max-width: 35%;
margin: 1em 0px 0.5em 0.5em;
}
.left10{
float:left;
width: 50%;
}
.skin-grayish :where(.navi-in, .navi-footer-in) a {
color:#000;
}
.header{
background-position: center;
}
.tagline {
    font-size: 16px;
font-weight: 600;
}
.skin-grayish.front-top-page .navi-in>ul{
font-weight: 500;
}
.skin-grayish #navi-in {
    background-color: rgb(228 228 227 / 87%);
margin-top: 1em;
}
.mobile-menu-buttons .menu-caption {
    font-size: 13px;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
.has-spinner{
border: 1px solid var(--wp--preset--color--sd-gray) !important;;
background-color: var(--cocoon-watery-yellow-color) !important;;
}
    .skin-grayish .mobile-menu-buttons .menu-button, .skin-grayish .mobile-menu-buttons .menu-button>a, .skin-grayish .sidebar-menu-content .sidebar-menu-close-button {
        color: var(--wp--preset--color--black);
    }
.skin-grayish .mobile-menu-buttons {
        align-items: center;
        background-color: rgb(255 255 255 / 72%);
        box-shadow:2px 2px 4px -2px gray inset;
    }


}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
.bottom01{
float:none;
margin:1em auto;
width: 55%;
}
.bottom02{
float:none;
margin:1em auto;
width: 55%;
}

.right10{
max-width: 50%;
}

}

/*770px以下*/
@media screen and (max-width: 770px){
.box7left{
    float: none;
    max-width: none;
}
.box7right{
float: none;
    margin-right: 1em;
    max-width: none;
max-width: 450px;
        margin: auto;
        display: block;
}
}
/*540px以下*/
@media screen and (max-width: 540px){
  /*必要ならばここにコードを書く*/
.box11{
float:none;
}
.right11{
max-width: 100%;
        background-image: url(/wp-content/themes/cocoon-child-master/img/koji01s.jpg);
        margin: 0;
        background-repeat: no-repeat;
        height: auto;
        background-size: contain;
        float: none;
aspect-ratio: revert-rule;
}
.right12{
max-width: 100%;
        background-image: url(/wp-content/themes/cocoon-child-master/img/koji04.jpg);
    aspect-ratio: 3 / 4;
        margin: 0;
        background-repeat: no-repeat;
        height: auto;
        background-size: contain;
        float: none;
aspect-ratio: revert-rule;
}
}



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