/*
Theme Name: My Theme
Author: Your Name
Description: Cats of the world
Version: 1.0
Text Domain mytheme
*/

@import url('https://fonts.googleapis.com/css?family=Sawarabi+Gothic');

html {
    font-family:"Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体";
}

body {
    margin: 0;
    background-color: #f7f7f7;
    color: #333;
}
*,
*:before,
*:after {
    box-sizing: border-box;
}

img {
    max-width: 100%;
    pointer-events: none;
}

.global-nav {
    position: relative;
}

.global-nav::before {
    content: '';
    position: absolute;
    width: 60px;
    height: 35px;
    right: 0;
    bottom: -32px;
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/02/cat-walk.png');
    background-size: contain;
    background-repeat: no-repeat;
}

.global-nav .current-menu-item {
    position: relative;
}

.global-nav .current-menu-item::before {
    content: "";
    position: absolute;
    bottom: -25px;
    left: 65%;
    transform: translateX(-50%);
    width: 110px;
    height: 65px;
    background-image: url('https://catcafesoftheworld.com/wp-content/themes/my-theme/assets/images/icon_keshiin-1.png');
    background-size: contain;
    background-repeat: no-repeat;
}

.global-nav__sns {
    display: none;
}

.header {
    background-color: #fff9ca;
    position: relative;
}

.header__inner {
    width: 1000px;
    margin: auto;
    padding: 10px 0;
    display: flex;
    align-items: center;
}

.header-sns {
    margin-left: 24px;
}

.header-sns p {
    transition: 0.3s;
}

.header-sns p:hover {
    opacity: 0.7;
}

.header-sns p {
    width: 50px;
}

.header-sns p a {
	display: block;
}

.site-name {
    margin: 0;
    font-size: 20px;
}
.site-name a {
    color: currentColor;
    text-decoration: none;
}

.site-logo {
    width: 150px;
    height: 150px;
	overflow: hidden;
}

.site-logo a {
	display: block;
}

.site-logo a img {
    width: 100%;
	height: auto;
}

@media screen and (max-width:1023px) {
    .header__inner {
        width: 100%;
        justify-content: space-between;
        padding: 16px;
    }
    .site-logo {
        width: 130px;
        height: 130px;
    }
    .header-sns {
        display: none;
        /* margin-left: 0;
        display: flex; */
    }
    .header-sns p:first-of-type {
        margin-right: 16px;
    }
    .global-nav::before {
        bottom: 0;
        width: 120px;
        height: 65px;
    }
    .global-nav .current-menu-item::before {
        display: none;
    }
    .global-nav__sns {
        display: flex;
        justify-content: space-evenly;
    }
    .global-nav__sns a {
        width: 60px;
        display: block;
    }
}

@media screen and (max-width:768px) {
    .site-logo {
        width: 100px;
        height: 100px;
    }
}

/* ハンバーガーメニュー start */

.hamburger-menu {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 40px;
    height: 30px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    z-index: 1000;
    position: relative;
}

.hamburger-menu span {
    display: block;
    width: 100%;
    height: 5px;
    background: #333;
    border-radius: 5px;
    transition: transform 0.3s ease, opacity 0.3s ease, top 0.3s ease;
    position: absolute;
    left: 0;
}

/* 各バーの位置調整 */
.hamburger-menu span:nth-child(1) {
    top: 0;
}

.hamburger-menu span:nth-child(2) {
    top: 50%;
    transform: translateY(-50%);
}

.hamburger-menu span:nth-child(3) {
    top: 100%;
    transform: translateY(-100%);
}

/* バツ印に変形するスタイル */
.hamburger-menu.open span:nth-child(1) {
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
}

.hamburger-menu.open span:nth-child(2) {
    opacity: 0;
}

.hamburger-menu.open span:nth-child(3) {
    top: 50%;
    transform: translateY(-50%) rotate(-45deg);
}

/* スマホ時のナビゲーション */
@media screen and (max-width: 1023px) {
    .hamburger-menu {
        display: flex;
    }
    .hamburger-menu.open {
        position: fixed;
        right: 16px;
    }

    .hamburger-menu.open span {
        background: #fff9ca;
    }

    .global-nav {
        display: none;
        position: fixed;
        top: 0;
        right: 0;
        width: 80%;
        height: 100vh; /* メニューの高さを画面全体に */
        background: rgba(75, 75, 75, 0.9);
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        flex-direction: column;
        text-align: center;
        padding: 20px 0;
        z-index: 999;
    }

    .global-nav__list {
        display: block;
    }

    .global-nav__list li {
        margin: 10px 0;
    }

    .global-nav.show {
        display: flex;
    }

    /* 背景を覆うオーバーレイ */
    .nav-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: rgba(0, 0, 0, 0.5);
        z-index: 998;
    }

    .nav-overlay.active {
        display: block;
    }
}

/* ハンバーガーメニュー end */

.sidebar-search {
    margin-top: 32px;
}

.sidebar-search label {
    color: #ad6b6b;
    font-weight: bold;
}

.contents {
    position: relative;
    padding-bottom: 32px;
}

.contents::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/02/background3.jpg');
    background-size: contain;
    z-index: -1;
}

.heading__box {
    width: 1000px;
    text-align: center;
    margin: 0 auto;
    padding: 32px 0;
    text-align: center;
}

.heading__inner {
    display: inline-block;
    position: relative;
    padding: .5em 3em;
    border-left: 2px dotted rgba(0, 0, 0, .1);
    border-right: 2px dotted rgba(0, 0, 0, .1);
    box-shadow: 0 0 5px rgba(0, 0, 0, .2);
    background-color: rgba(0, 0, 0, .01);
    color: #ad6b6b;
}

.wrapper {
    width: 1000px;
    margin: 0 auto;
    padding-left: 16px;
    padding-right: 16px;
}

.home .wrapper {
    display: flex;
    justify-content: space-between;
    margin-top: 64px;
}

.global-nav ul {
    display: flex;
    justify-content: center;
    padding-left: 24px;
}

.global-nav ul li {
    list-style: none;
    margin-right: 8px;
    padding: 0;
    width: 142px;
    height: 86px;
    border-radius: 10px;
    transition: 0.3s;
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/02/icon_stamp6.png');
    background-size: contain;
    background-repeat: no-repeat;
    text-align: center;
    position: relative;
}

.global-nav ul li:hover {
    opacity: 0.7;
}

.global-nav ul li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff9ca;
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
    transform: rotate(-12deg);
}

@media screen and (max-width:1023px) {
    .heading__inner {
        padding: .5em 1em;
        font-size: 24px;
    }
    .wrapper {
        width: 100%;
        display: block;
    }
    .heading__box {
        width: 100%;
        padding: 0;
    }
    .home .wrapper {
        display: block;
    }
    .home .contents { 
        padding: 16px 16px 64px;
    }
    .global-nav ul {
        display: block;
        padding-left: 0;
        margin-left: auto;
        margin-right: auto;
        margin-top: 32px;
    }
    .global-nav ul li {
        width: 200px;
        height: 60px;
        background-image: none;
        margin-bottom: 32px;
    }
    .global-nav ul li a {
        transform: rotate(4deg);
        border-bottom: dashed 2px;
        font-size: 24px;
    }
}

@media screen and (max-width:768px) {
    .global-nav ul li  {
        width: 170px;
    }

    .global-nav ul li a {
        font-size: 18px;
    }
}

/* ねこBOX F*/
.neko-box-f {
    position: relative;
    margin: 4em auto 3em;
    padding: 120px 30px 20px 30px;
    background: #dbdada; 
    color: #ffffff; /* 文字色 */
    text-align: center; /* テキスト中央（不要なら行を削除） */
    border: 3px solid #dbdada; /* ボックス枠線(太さ・線種・色) */
    border-radius: 10px;
    z-index: auto;
    box-shadow: 1px 1px 3px #acacac;
   }

   .neko-box-f::before, 
   .neko-box-f::after {
    height: 80px;
    width: 80px;
    position: absolute;
    content:'';
    top: -30px;
    z-index: -10;
   }

   .neko-box-f::before {
    left: 20%;
    background: #999999; /* 左耳背景色 */
    border: 8px solid #dbdada; /* 左耳枠線(太さ・線種・色) */
    border-radius: 10px 50px 100px 50px;
    transform: rotate( 45deg );
    box-shadow: 1px -1px 3px #acacac; /* 耳の影（不要なら行を削除） */
   }
   .neko-box-f::after {
    right: 20%;
    background: #999999; /* 右耳背景色 */
    border: 8px solid #dbdada; /* 右耳枠線(太さ・線種・色) */
    border-radius: 50px 10px 50px 100px;
    transform: rotate( -45deg );
    box-shadow: 1px 1px 3px #acacac; /* 耳の影（不要なら行を削除） */
   }
   .neko-wrap-f{
    background-color: transparent;
    position: relative;
    z-index: 0;
   }

   .neko-wrap-f::before {
    content: "";
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/01/eye2.png');
    background-repeat: no-repeat;
    background-size: contain;
    width: 100px;
    height: 50px;
    position: absolute;
    top: 40px;
    left: 300px;
    z-index: 99;
   }

   .neko-wrap-f::after {
    content: "";
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/01/eye2.png');
    background-repeat: no-repeat;
    background-size: contain;
    width: 100px;
    height: 50px;
    position: absolute;
    top: 40px;
    right: 300px;
    z-index: 99;
   }


@media screen and (max-width:768px) {
    .neko-wrap-f {
        display: none;
    }
}

.entry-title {
    margin-top: 0;
    padding-top: 32px;
}

.entry-item {
    position: relative;
}

.entry-item img {
    width: 250px;
    height: 200px;
    object-fit: cover;
    display: block;
}

.entry-item::before,
.entry-item::after {
    height: 80px;
    width: 80px;
    position: absolute;
    content:'';
    top: -30px;
    z-index: -1;
}

.entry-item:not(:last-child) {
    margin-bottom: 64px;
}

.entry-item::before {
    left: 20%;
    background: #e5e5e5; /* 左耳背景色 */
    border: 8px solid #fff; /* 左耳枠線(太さ・線種・色) */
    border-radius: 10px 50px 100px 50px;
    transform: rotate( 45deg );
    box-shadow: 1px -1px 3px #acacac; /* 耳の影（不要なら行を削除） */
}

.entry-item::after {
    right: 20%;
    background: #e5e5e5; /* 右耳背景色 */
    border: 8px solid #fff; /* 右耳枠線(太さ・線種・色) */
    border-radius: 50px 10px 50px 100px;
    transform: rotate( -45deg );
    box-shadow: 1px 1px 3px #acacac; /* 耳の影（不要なら行を削除） */
}

.entry-item__inner {
    width: 600px;
    background-color: #fff;
    padding: 40px 32px 40px;
    margin-bottom: 24px;
    display: flex;
    justify-content: space-around;
    border-radius: 20px;
}

.entry-item__date {
    color: #ad6b6b;
    position: relative;
    padding-left: 24px;
}

.entry-item__date::before {
    content: '';
    width: 22px;
    height: 22px;
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/02/icon_calendar.png');
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    left: 0;
}

.entry-item__ttl a {
    text-decoration: none;
    color: #ad6b6b;
}

.entry-item-left {
    flex: 1;
    position: relative;
    margin-right: 32px;
}

.entry-item__txt {
    flex: 1;
    min-width: 200px;
    display: flex;
    flex-direction: column;
}

.entry-item__flex {
    display: flex;
}

.entry-item a img {
    display: block;
}

.entry-item__category {
    margin-right: 16px;
}

.entry-item__detail {
    margin: auto 0 0 0;
}

.entry-item__detail a {
    text-decoration: none;
    background-color: #f49d9b;
    padding: 8px;
    display: flex;
    justify-content: center;
    border-radius: 10% / 50%;
    transition: 0.3s;
    box-shadow: 0 4px 0 #c34b41;
    color: #fff;
    font-weight: bold;
}

.entry-item__detail a:hover {
    transform: translateY(4px);
    box-shadow: none;
}

.entry-item__detail a::before {
    content: "";
    display: block;
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/01/nikuqu.png');
    background-repeat: no-repeat;
    background-size: 24px;
    width: 24px;
    margin-right: 8px;
}

.ribbon {
    min-width: 100px;
    position: absolute;
    top: -20px;
    left: -20px;
    padding: 0.5em;
    background: #a6d3c8;
    color: white;
    text-align: center;
    font-weight: bold;
    font-family: serif;
    text-decoration: none;
}

.ribbon::before {
    position: absolute;
    content: '';
    top: 100%;
    left: 0;
    border: none;
    border-bottom: solid 15px transparent;
    border-right: solid 20px rgb(149, 158, 155);
}

@media screen and (max-width:1023px) { 
    .entry-item__inner {
        width: 100%;
    }
    .entry-item__detail a {
        padding: 3vw;
    }
}

@media screen and (max-width:768px) {
    .entry-item__inner {
        flex-direction: column;
        width: 100%;
    }
    .entry-item {
        width: 100%;
        padding: 0;
        display: block;
    }
    .entry-item-left {
        margin-right: 0;
    }
    .entry-item img {
        width: 100%;
        height: 100%;
    }
    .entry-item__ttl {
        margin-bottom: 0;
    }
}

.page-numbers {
    display: flex;
    list-style : none;
    align-items: center;
    color: #ad6b6b;
    font-weight: bold;
}

.page-numbers li {
    padding: 8px;
}

.page-numbers li a {
    text-decoration: none;
}

.pager-btn {
    width: 120px;
}

@media screen and (max-width:768px) {
    .pager-btn {
        width: 100px;
    }
    .page-numbers {
        padding-left: 0;
    }
}

/* サイドバー */

.sidebar-box {
    min-width: 320px;
}

.sidebar,
.sidebar-type {
    background-color: #fff;
    padding: 16px 32px;
    /* border-radius: 20px; */
    position: relative;
}

.sidebar__inner::before {
    content: "";
    width: 80px;
    height: 80px;
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/01/cat-jump.png');
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    right: 0;
    bottom: 0;
}

.sidebar-type__inner::before {
    content: "";
    width: 80px;
    height: 100px;
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/02/cat_standup2.png');
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    right: 0;
    top: 0;
}

.sidebar ul,
.sidebar-type ul {
    list-style: none;
    padding: 0;
}

.sidebar ul li:not(:last-child) {
    margin-bottom: 8px;
}

.sidebar ul li a,
.sidebar-type ul li a {
    text-decoration: none;
    display: flex;
    min-height: 32px;
    color: #ad6b6b;
}
.sidebar ul li a::before  {
    content: "";
    display: block;
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/01/cat-face.png');
    background-repeat: no-repeat;
    background-size: contain;
    width: 24px;
    margin-right: 4px;
}

.sidebar-type {
    margin-top: 64px;
}

.sidebar-type__inner h2 {
    text-align: center;
}

.widget--sidebar h2,
.widget--type h2 {
    color: #ad6b6b;
}

.wp-block-tag-cloud a {
    font-size: 12px!important;
    color: #ad6b6b;
}

@media screen and (max-width:768px) {
    .sidebar-type__inner::before {
        top: auto;
        bottom: 0;
    }
}

.sns-box {
    position: relative;
}

.sns-top {
    font-family: cursive;
    text-align: center;
}

.sns-top p {
    margin-bottom: 0;
}

.sns-icon {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 16px;
}

.sns-icon a {
    transition: 0.3s;
}

.sns-icon a:hover {
    opacity: 0.7;
}

.sns-icon img {
    width: 48px;
}

.sns-top::after {
    content: "";
    background-repeat: no-repeat;
    background-size: contain;
    width: 80px;
    height: 80px;
    background-image: url('https//testup.shiomichi.site/wp-content/uploads/2025/01/cat-osuwari.png');
    position: absolute;
    bottom: 0;
    right: -120px;
}

.sns-icon1 {
    margin-right: 16px;
}

.sns-icon2 {
    margin-left: 16px;
}

.footer {
    background-color: #fff9ca;
    padding-bottom: 32px;
}

.footer__inner {
    padding: 16px;
    width: 1000px;
    margin: 0 auto;
}

.footer-main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative
}

.footer-main::before,
.footer-main::after {
    height: 100px;
    width: 130px;
    position: absolute;
    content:'';
    top: -30px;
    z-index: -1;
}

.footer-main::before {
    left: 20%;
    background: #fff9ca; 
    border: 8px solid #fff9ca; 
    border-radius: 10px 50px 100px 50px;
    transform: rotate( 45deg );
}

.footer-main::after {
    right: 20%;
    background: #fff9ca;
    border: 8px solid #fff9ca; 
    border-radius: 50px 10px 50px 100px;
    transform: rotate( -45deg );
}

.footer-global-nav::before {
    content: '';
    position: absolute;
    width: 80px;
    height: 70px;
    right: 70px;
    bottom: -65px;
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/02/cat_nobi.png');
    background-size: contain;
    background-repeat: no-repeat;
}

.footer-global-nav__list {
    list-style: none;
    padding: 0;
    /* display: flex;
    justify-content: center; */
}

.footer-global-nav__list li {
    display: flex;
    align-items: center;
    transition: 0.3s;
    font-weight: bold;
    border-bottom: dashed 2px #4b4b4b;
    padding-bottom: 4px;
}

.footer-global-nav__list li:not(:last-child) {
    margin-bottom: 16px;
}

.footer-global-nav__list li:hover {
    opacity: 0.7;
}

.footer-global-nav__list li::before {
    content: "";
    display: block;
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/01/nikuqu.png');
    background-repeat: no-repeat;
    background-size: contain;
    width: 18px;
    height: 18px;
    margin-right: 4px;
    transform: scaleY(-1);
}

.footer-global-nav__list li a {
    text-decoration: none;
    color: #4b4b4b;
}

.footer-logo {
    text-align: center;    
}

.footer-logo img {
    width: 150px;
}

.copyright {
    text-align: center;
    font-size: 12px;
    display: block;
}

@media screen and (max-width: 1023px) {
    .footer__inner {
        width: 100%;
        padding: 16px;
    }
    .footer-main {
        flex-direction: column-reverse;
        align-items: normal;
    }
    .sns-top::after {
        right: 0;
    }
    .footer-main::before {
        left: 0;
    }
    .footer-main::after {
        right: 0;
    }
    .footer-global-nav {
        margin-left: 64px;
        margin-right: 64px;
    }
    .footer-global-nav::before {
        width: 80px;
        height: 70px;
        left: 30px;
        bottom: 230px;
    }
}

/* 投稿ページ */
.post-categories li a {
    background-color: #dbdada;
    padding: 8px 16px;
}

.entry-thumb {
    text-align: center;
}

.entry-thumb img {
    height: auto;
}

.entry-category ul {
    list-style: none;
    padding: 0;
}

.entry-category ul li a {
    text-decoration: none;
}

.entry-tag ul {
    list-style: none;
    padding: 0;
}

.entry-tag ul li::before {
    content: "#";
}

.entry-tag ul li a {
    text-decoration: none;
}

.backhome-btn {
    margin: 36px 0;
}

.backhome-btn a {
    background: #f49d9b;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    max-width: 240px;
    padding: 10px 25px;
    color: #fff;
    transition: 0.3s ease-in-out;
    font-weight: 500;
    text-decoration: none;
}
.backhome-btn a:before {
    content: '';
    position: absolute;
    top: calc(50% - 2px);
    left: -2em;
    transform: translateY(calc(-50% - 2px)) rotate(-30deg);
    width: 12px;
    height: 2px;
    background-color: #c34b41;
    transition: 0.3s;
}
.backhome-btn a:after {
    content: '';
    position: absolute;
    top: 50%;
    left: -2em;
    transform: translateY(-50%);
    width: 60px;
    height: 2px;
    background-color: #c34b41;
    transition: 0.3s;
}
.backhome-btn a:hover:before, .backhome-btn a:hover:after {
    left: -2.5em;
}
.backhome-btn a:hover {
    background: #f7c0bf;
    color: #000;
}

.post_map {
	text-align: center;
}

.post_map iframe {
	width: 100%;
}

/* お問い合わせ */

.contact-box {
    margin: 0 auto;
    width: 500px;
    display: block;
}

.contact-box p {
    margin-right:auto ;
    margin-left: auto;
}

.contact-box textarea {
    width: 100%;
}

.submit-btn {
    text-align: center;
    position: relative;
}

.submit-btn p {
    width: 120px;
    position: relative;
}

.submit-btn input {
    width: 120px;
    height: 40px;
    background-color: #efefef;
    color: #000;
    border: solid 1px #fff;
}

.submit-btn p::before,
.submit-btn p::after {
    content: '';
    background-image: url('https://catcafesoftheworld.com/wp-content/uploads/2025/01/nikuqu.png');
    background-repeat: no-repeat;
    background-size: contain;
    width: 24px;
    height: 24px;
    position: absolute;
    z-index: 1;
}

.submit-btn p::before {
    left: 100px;
    bottom: 53%;
    transform: translate(-50%,50%);
}

.submit-btn p::after {
    right: 100px;
    bottom: 53%;
    transform: translate(50%,50%);
}

.wpcf7-spinner {
    display: none;
}

@media screen and (max-width: 1023px) {
    .contact-box {
        width: 100%;
    }
}

/* 当サイトについて */

.about-box {
    width: 80%;
    position: relative;
    margin: 0 auto;
    padding: 40px 32px;
    background: #fff;
    border-radius: 30px;
}

.about-content {
    margin: 0 auto;
}

  .about-box p {
    margin: 0; 
    padding: 0;
  }

.about-cat {
    display: flex;
    justify-content: space-between;
    margin-top: 36px;
}

.about-cat__left,.about-cat__right {
    width: 340px;
    height: fit-content;
}

.about-cat__left {
    position: relative;
}

.about-cat__left:before {
    content: "";
    position: absolute;
    left: 42%;
    top: -12px;
    width: 12px;
    height: 12px;
    background: #fff;
    border-radius: 50%;
}

.about-cat__left:after {
    content: "";
    position: absolute;
    left: 50%;
    top: -28px;
    width: 18px;
    height: 18px;
    background: #fff;
    border-radius: 50%;
}

@media screen and (max-width: 768px) {
    .about-box {
        width: 100%;
        padding: 16px 24px;
    }
}

/* アーカイブページ */
.archive .entry-item::before,.archive .entry-item::after {
    display: none;
}

.archive .entries {
    display: grid;
    grid-template-columns: repeat(3,1fr);
}

.archive .contents {
    padding-bottom: 64px;
}

.archive-title {
    margin: 0;
}

@media screen and (max-width: 1023px) {
    .archive .entries {
        display: block;
    }
    .archive-title {
        padding: 36px 0;
    }
}

@media screen and (max-width: 768px) { 
    .archive-title { 
        font-size: 24px;
    }
}