@charset "UTF-8";

/* 共通 */
a {
    text-decoration: none;
    color: #99686a;
}
a:hover {
    color: #0bd;
}
p, h1, h2, h3, h4, h5, h6{
    color: #99686a;
}
body {
    font-family: "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
}


/* ヘッダー */
.header {
    background: #99686a;
    margin: 0 auto;
    padding: 15px 25px 15px 25px;
    position: sticky;
    top: 0;
    z-index: 2;
}
.logo {
    width: 350px;
    max-width: 50vw;
}
.nav_container {
    display: flex;
    justify-content: space-between;
}

/* フッター */
#top_group {
    background-color: #F4F0E3;
}
.top_group_container {
    width: 1300px;
    margin: 0 auto;
    max-width: 100%
}
.logo_sub {
    text-align: center;
    padding-top: 117px;
}
.logo_sub img {
    width: 579px;
    max-width: 80%;
}
.top_group_school {
    display: flex;
    justify-content: space-around;
    margin: 41px 0 50px 0;
}
.top_group_school h4 {
    text-align: center;
    margin-bottom: 15px;
    font-weight: normal;
    font-size: 25px;
}
.top_group_school p {
    font-size: 95%;
    color: #000000;
}
.top_group_container_2 {
    width: 1310px;
    margin: 0 auto;
    max-width: 100%;
}
.top_relations_logo {
    display: flex;
    justify-content: space-around;
    margin-bottom: 180px;
}
.top_relations {
    font-size: 25px;
    width: 1300px;
    max-width: 100%;
    margin: 0 auto;
}
.top_relations_logo img {
    width: 200px;
    max-width: 100%;
}
.top_group_puppy {
    margin: 0 5px;
    padding-bottom: 83px;
}
.top_group_puppy h3 {
    font-size: 45px;
    margin-bottom: 21px;
}
.puppy_group {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    text-align: center;
    gap: 30px;
}
.group_btn {
    display: block;
    font-size: clamp(13px, 1.5vw, 16px);
    background: #FFFFFF;
    border-radius: 15px;
    padding: 10px 0;
}
footer {
    background-color: #99686a;
    text-align: center;
    color: #FFFFFF;
}
small {
    display: block;
    font-size: clamp(10px, 1.5vw, 15px);
    padding: .8em 0;
}

/* トップ画像 */
.top_main {
    background-color: #f7ebe5;
}
.top_main img {
    max-width: 100%;
}
.image_center {
    text-align : center;
}

/* トップサブ画像 */
.top_sub_btm, .top_sub {
    background-color: #F4F0E3;
}
.top_sub_btm img, .top_sub img {
    width: 100%;
}

/* ブログ */
#blog {
    background-color: #F4F0E3;
}
.blog_container {
    width: 1150px;
    max-width: 90%;
    margin: 0 auto;
}
.blog_top {
    display: flex;
    align-items: center;
    margin-top: 20px;
}
.blog_top img {
    width: 75px;
    max-width: 100%;
}
.blog_top h2 {
    font-size: 35px;
    margin-left: 20px;
}
.blog_wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 50px;
}
.blog_margin {
    padding: 50px 0 150px 0;
}
.blog_pic img {
    max-width: 100%;
}
.pagenavi_css {
    text-align: center;
    padding-top: 20px;
}
.single_header {
    padding: 20px 0;
}
.single_header h2 {
    font-size: 30px;
}
.blog_container_article {
    width: 850px;
    max-width: 90%;
    margin: 0 auto;
}
.single_article_block {
    padding: 30px 0 70px 0;
}
.single_article_block h3 {
    font-size: 20px;
    text-align: center;
    border: #5D5049 1px solid;
    border-radius: 15px;
    padding: .8rem 0;
}
.article_body {
    margin-top: 10px;
}
.artice_blog_pic {
    text-align: center;
}
.artice_blog_pic img {
    width: 600px;
    max-width: 100%;
    height: auto;
}
.article_meta {
    text-align: right;
    font-size: 12.5px;
}
.content {
    margin: 50px 0;
    text-align: left;
}
.postlinks {
    display: flex;
    justify-content: space-between;
    border-top: #5D5049 1px solid;
    padding: 1rem 0;
}

/* ワードプレス404 */
.top_404 h3 {
    text-align: center;
    font-size: 28px;
    padding: 30px;
}
.wrapper_404 {
    padding: 50px 0 100px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.top_404 img {
    width: 100px;
    max-width: 100%;
}
.wrapper_404 p {
    text-align: left;
    font-size: 1rem;
}
.top_404 a {
    text-decoration: underline;
}

/* ハンバーガー */
.hamburger {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    width: 45px;
    height: 45px;
    padding: 10px;
    background: #5D5049;
    border: 0;
    color: #fff;
    cursor: pointer;
    z-index: 1;
  }

/*三本線*/
.hamburger__line {
    position: relative;
    top: 12px;
    width: 30px;
    height: 2px;
    background: #fff;
}
.hamburger__line::before,
.hamburger__line::after {
    position: absolute;
    content: "";
    display: block;
    width: 30px;
    height: 2px;
    background: #fff;
    transition: 0.3s;
}
.hamburger__line::before {
    top: -8px;
}
.hamburger__line::after {
    bottom: -8px;
}
  
/*OPEN時スタイル*/
.hamburger[aria-expanded="true"] .hamburger__line{
    background: transparent;
}
.hamburger[aria-expanded="true"] .hamburger__line::before {
    top: 0;
    transform: rotate(45deg);
}
.hamburger[aria-expanded="true"] .hamburger__line::after {
    bottom: 0;
    transform: rotate(-45deg);
}
/* 2026年6月更新 */
/* デフォルト（PC含む）では非表示 */
.fix_bottom {
    display: none;
}
/* ↑ここまで2026年6月更新 */

/* ヘッダーPC用設定 */
@media screen and (min-width: 960px) {
    .gnav {
        display: block !important;
    }
    .gnav__list {
        display: flex;
        justify-content: space-between;
        margin: 0 45px;
    }
    .gnav__item {
      margin: 0 1em;
    }
    .gnav__link {
        display: block;
        padding-top: 10px;
        color: #FFFFFF;
        font-size: 15px;
    }
    .nav_container {
        width: 1650px;
        margin: 0 auto;
        max-width: 100%;
        flex-direction: column;
        justify-content: flex-start;
    }
    .gnav_none {
        display: none;
    }
    .hamburger {
        display: none;
    }
}

/* スマートフォン用 */
@media screen and (max-width: 959px) {
    .gnav {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: calc(100vh - 75px);
        padding: 75px 0;
        background: rgba( 250, 250, 240, .98);
        text-align: center;
        overflow-y: auto;
    }
    .gnav__list {
        border-top: 1px dashed #aaa;
    }
    .gnav__item {
        border-bottom: 1px dashed #aaa;
    }
    .gnav__link {
        display: block;
        padding: 10px;
        font-weight: bold;
    }
    .nav_container {
        align-items: center;
    }
    .blog_wrapper {
        display: block;
    }
    .blog_block {
        padding: 1rem 0;
        border-bottom: #5D5049 1px solid;
        width: 98%;
        margin: 0 auto;
    }
    .blog_pic {
        display: none;
    }
    .meta {
        font-size: 11px;
    }
    .news_desc {
        font-size: 14px;
    }
}
@media (max-width:700px) {
    .top_sub_btm {
        background-image: url(pic/0Q1A9493.png);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 40% top;
        height: 38vh;
    }
    .backgrand_set {
        background-repeat: no-repeat;
        background-size: cover;
        height: 38vh;
    }
    .image_center img, .top_sub_btm img {
        display: none;
    }
    .top_bg {
        background-image: url(pic/0Q1A9955.png);
        background-position: 38% top;
    }
    .not404_bg {
        background-image: url(pic/0Q1A9350.png);
        background-position: 50% top;
    }
    li {
        font-size: 90%;
    }
    .logo_sub {
        padding-top: 85px;
    }
    .top_group_school {
        flex-direction: column;
        align-items: center;
    }
    .top_group_yahagi {
        padding-bottom: 25px;
    }
    .top_relations_logo {
        margin-bottom: 50px;
        text-align: center;
    }
    .top_relations_logo img {
        max-width: 85%;
    }
    .top_group_puppy {
        padding-bottom: 55px;
    }
    .top_group_puppy h3 {
        font-size: 25px;
        margin-bottom: 0;
        text-align: center;
    }
    .puppy_group {
        display: block;
    }
    .group_btn {
        width: 250px;
        margin: 0 auto;
        max-width: 100%;
    }
    .puppy_group li {
        padding: 10px 0;
    }
    .blog_margin {
        padding: 20px 0 100px 0;
    }
    .article_meta {
        font-size: 75%;
    }
    .single_article_block h3 {
        font-size: 16px;
    }
    p {
        font-size: 90%;
    }
    .blog_top h2 {
        font-size: 25px;
    }
    .top_group_school h4 {
        margin-bottom: 0;
    }
    .top_group_school p, a {
        font-size: 82.5%;
    }
    .top_catch_comment p {
        font-size: 90%;
    }
    .gnav__item a, li {
        font-size: 100%;
    }
    /* 2026年6月更新 */
    /* CSS変数 */
    :root {
        --fix-bottom-height: 65px;
    }

    /* 固定CTAバー */
    .fix_bottom {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: 1;
        background: rgba(0, 0, 0, 0.6);
        display: flex;
        justify-content: center;
        align-items: center;
        min-height: var(--fix-bottom-height);
        padding-bottom: env(safe-area-inset-bottom);
    }

    /* 中央幅制限 */
    .fix_bottom_container {
        width: 100%;
        max-width: 600px;
    }

    /* 横並び */
    .fix_bottom_li ul {
        display: flex;
        gap: 10px;
        padding: 10px;
        margin: 0;
        list-style: none;
    }

    /* li縦Flex */
    .fix_bottom_li li {
        flex: 1;
        display: flex;
        flex-direction: column;
        text-align: center;
    }

    /* 説明文 */
    .fix_text {
        color: #fff;
        margin-bottom: 0;
        line-height: 1.5;
        font-size: 65%;
    }

    /* ボタン共通 */
    .fix_tel_box, .fix_trial_btn {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 7px 14px;
        gap: 3px;
        color: #fff;
        text-decoration: none;
        transition: 0.2s;
        margin-top: auto;
        font-size: 75%;
    }

    .fix_trial_btn span {
        color: #fff;
    }

    /* 電話 */
    .fix_tel_box {
        background: #99686a;
    }

    /* メール */
    .fix_trial_btn {
        background: #5d5049;
    }

    /* アイコン */
    .fix_tel_icon {
        width: 13px;
    }

    .fix_mail_icon {
        width: 15px;
    }

    /* hover / focus / active */
    .fix_tel_box:hover, .fix_trial_btn:hover {
        color: #fff;
    }

    .fix_tel_box:focus, .fix_trial_btn:focus {
        outline: none;
        opacity: 1;
        transform: none;
    }

    .fix_tel_box:active, .fix_trial_btn:active {
        transform: scale(0.96);
    }

    /* 下部固定分余白 */
    .footer_container {
        padding-bottom: calc(var(--fix-bottom-height) + env(safe-area-inset-bottom));
    }
/* ↑ここまで2026年6月更新 */
}