﻿/* ===================================================================
   momiji-pet.com | Responsive Style
   =================================================================== */
*,
*::before,
*::after {box-sizing: border-box;}

.block-access-map #map-canvas {
    width: 100%;
    height: 450px;
    max-width: 880px;
    margin: 0 auto;
}
.hamburger-btn,
.mobile-nav,
.site-navigation-sp,
.header-clinic-info-sp,
.home-heading-sp,
.link-to-news-mobile,
.tel-sp {display: none;}

@media (max-width: 768px) {

	body {margin-top: 0; background-color: #f8f4e5;}

        header {padding-top: 10px;}

        footer {background-color: #f8f4e5 !important;}

        .container {
                width: auto;
                padding: 0;
        }

	.about-clinic,
	.nav-container,
	.sub-navigation,
	.smilego_btn,
        .footer-nav-container,
        .link-to-page {
		display: none;
	}

	header .logo img {
		width: 220px !important;
		height: auto;
	}

	header .logo {
		display: block;
		padding-bottom: 10px;
		padding-left: 15px;
	}

        header .logo-location {
                font-size: 11px;
                line-height: 1;
                margin-bottom: 15px;
        }
        .pure-u-12-24 {
                width: 100%;
        }

	.header-clinic-info-sp {
		display: block;
		background-color: #5e3719;
		color: #ffffff;
		font-size: 9px;
		line-height: 1.6;
		text-align: left;
		padding: 3px 1px 3px 15px;
	}

	.header-clinic-info-sp p {
		margin: 0;
		padding: 0;
	}

        .smilego_bnr {
                width: auto !important;
        }

	.home-heading-pc {
		display: none;
	}

	.home-heading-sp {
		display: block;
		margin: 0 15px;
		position: relative;
		padding-bottom: 50px;
	}

	.home-heading-sp::before {
	        content: "";
	        position: absolute;
	        bottom: 0;
	        left: 50%;
	        transform: translateX(-50%);
	        width: 90%;
	        height: 5px;
	        background-color: #5e3719;
	        border-radius: 5px;
	}

	.home-heading-sp .main-catchphrase {
		font-size: 16px;
		font-weight: bold;
		text-align: center;
		line-height: 1.5;
		color: #5e3719;
		margin: 10px 0;
	}

	.home-heading-sp .sub-catchphrase-box {
		background-color: #eae2d2;
		border-radius: 5px;
		padding: 5px;
		margin-bottom: 20px;
	}

	.home-heading-sp .sub-catchphrase-box p {
		margin: 0;
		font-size: 14px;
		line-height: 1.5;
		color: #5e3719;
		text-align: center;
	}

	.home-heading-sp .info-button {
		display: block;
		background-color: #5e3719;
		color: #ffffff;
		font-size: 16px;
		font-weight: bold;
		text-align: center;
		text-decoration: none;
		padding: 14px;
		border-radius: 50px;
		transition: opacity 0.2s;
	}

	.home-heading-sp .info-button:hover {
		opacity: 0.8;
	}

	.site-navigation-sp { display: block; }

	.hamburger-btn { display: block !important; }

	.hamburger-btn {
		position: absolute;
		top: 35px;
		right: 15px;
		z-index: 300;
		width: 40px;
		height: 40px;
		border: none;
		background: transparent;
		cursor: pointer;
	}

	.hamburger-btn-line,
	.hamburger-btn::before,
	.hamburger-btn::after {
		content: '';
		display: block;
		width: 30px;
		height: 3px;
		background-color: #5e3719;
		position: absolute;
		left: 5px;
		transition: all .3s;
	}

	.hamburger-btn::before { top: 8px; }
	.hamburger-btn-line { top: 18px; }
	.hamburger-btn::after { top: 28px; }

	.mobile-nav {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		overflow-y: auto;
		padding: 60px 20px 10px 20px;
		box-sizing: border-box;
		background-color: #5e3719;
		z-index: 1001;
		color: #fff;
		transform: translateY(-100%);
		transition: transform .5s;
	}

	.mobile-nav.is-open {
		transform: translateY(0);
	}

	.close-btn {
		position: absolute;
		top: 20px;
		right: 20px;
		z-index: 210;
		font-size: 40px;
		color: #fff;
		background: none;
		border: none;
		cursor: pointer;
		line-height: 1;
	}

	.mobile-nav-list { margin-bottom: 20px; }
	.mobile-nav-list ul { list-style: none; padding: 0; text-align: left; margin: 0;}
	.mobile-nav-list li a { display: block; padding: 14px 0; color: #fff; font-size: 16px; text-decoration: none; border-bottom: 1px dotted rgba(255,255,255,0.3); }
	.mobile-nav-list li:first-child a { border-top: 1px dotted rgba(255,255,255,0.3); }
	.mobile-nav-list li a::before { content: '\25B6'; margin-right: 15px; font-size: 14px; }
	.mobile-nav-contact { width: 100%; text-align: center; }
	.mobile-nav-contact a img {
	        max-width: 90%;
	        height: auto;
	        display: block;
	        margin: 0 auto;
	}

	.mobile-nav-schedule {
	        padding: 20px 10px 0 10px;
	        box-sizing: border-box;
	}

        .mobile-nav-schedule img {
                max-width: 100%;
                height: auto;
                display: block;
                margin: 0 auto;
        }

	.mobile-nav-info { font-size: 13px; line-height: 1.5; }

        .hero-unit {
                width: 100%;
                margin: 0 auto;
                text-align: center;
        }

        .hero-unit img {
                max-width: 100%;
                height: auto;
                display: block;
        }

	.site-main-top > h1 {
		display: block !important;
		padding: 15px;
		margin: 0 15px 20px 15px;
		font-size: 15px;
		line-height: 1.7;
		text-align: left;
		color: #5d452d;
		background: #f8f4f0;
		border-radius: 5px;
	}

	.site-main-top > h1 small { font-size: 12px; }

	.site-navigation-sp ul { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0 15px; list-style: none; }
	.site-navigation-sp ul li { width: 48%; }
	.site-navigation-sp ul li a { display: block; width: 100%; height: 160px; background-size: contain; background-repeat: no-repeat; background-position: center; border-radius: 8px; }
	.nav-btn-sp-1 { background-image: url('images/top/m-sub-navi1.png'); }
	.nav-btn-sp-1:hover { background-image: url('images/top/m-sub-navi-hover1.png'); }
	.nav-btn-sp-2 { background-image: url('images/top/m-sub-navi2.png'); }
	.nav-btn-sp-2:hover { background-image: url('images/top/m-sub-navi-hover2.png'); }
	.nav-btn-sp-3 { background-image: url('images/top/m-sub-navi3.png'); }
	.nav-btn-sp-3:hover { background-image: url('images/top/m-sub-navi-hover3.png'); }
	.nav-btn-sp-4 { background-image: url('images/top/m-sub-navi4.png'); }
	.nav-btn-sp-4:hover { background-image: url('images/top/m-sub-navi-hover4.png'); }

        .block-news-and-blog { margin-top: 10px; }
        .block-news-and-blog .pure-u-1-2 {
                width: 100% !important;
                display: block;
                margin-bottom: 40px;
        }

        .main-container {background-image: none !important;}

        .main-container-block {
                padding: 1px;
                margin: 15px 20px;
                background-image: none !important;
                border-radius: 5px !important;
        }

        .block-news,
        .block-blog {
                width: auto !important;
                float: none !important;
        }

        .block-news h2,
        .block-blog h2,
        .block-access-map h2 {
                margin-left: 15px;
                margin-bottom: 8px;
                display: flex;
                align-items: center;
                gap: 6px;
        }

        .block-news h2 img,
        .block-blog h2 img,
        .block-access-map h2 img {
                display: none;
        }

        .block-news h2::before,
        .block-blog h2::before,
        .block-access-map h2::before {
                content: '';
                display: inline-block;
                width: 22px;
                height: 22px;
                background-image: url('https://wis-support.jp/wp-content/themes/momiji/images/shared/icon-orange-momiji.png');
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
        }

        .block-news h2::after,
        .block-blog h2::after,
        .block-access-map h2::after {
                font-size: 16px;
                color: #5e3719;
        }

         .block-news h2::after {
                content: 'お知らせ';
        }
        .block-blog h2::after {
                content: 'もみじだより';
        }
        .block-access-map h2::after {
                content: 'アクセスマップ';
        }

        .block-list-news,
        .block-list-blog {
                padding: 0 15px;
                border: none !important;
                background-color: #fff !important;
        }

        .block-news-and-blog .link-to-page {
                width: auto !important;
                margin-left: 0 !important;
        }

        .block-news-and-blog .link-to-news-page a,
        .block-news-and-blog .link-to-blog-page a {
                width: auto !important;
                height: auto !important;
                text-indent: 0 !important;
                background: none !important;
                margin: 0;
        }

        .block-news-and-blog .entry-meta {
                font-weight: normal !important;
        }

        .block-news-and-blog .entry-title a, .block-news-and-blog .entry-title a:hover {
                font-size: 14px;
                line-height: 1.6;
        }

        .block-news-and-blog .entry-content a, .block-news-and-blog .entry-content a:hover {
                font-size: 12px;
                font-weight: normal !important;
        }

        .block-news-and-blog li {
                background-image: none !important;
        }

        .entry-eyecatch img {
                max-width: 100%;
                height: auto;
                display: block;
                padding-right: 10px;
        }

        .entry-content a p {margin: 0;}

        .pure-u-7-24 {width: 25% !important;}
        .pure-u-17-24 {width: 75% !important;}

        .link-to-blog-page img {
                width: 100%;
                height: auto;
                display: block;
        }
        .link-to-page.link-to-news-page {display: none;}
        
        .link-to-news-mobile {
                display: block;
                text-align: center;
                margin: 30px 0;
        }
        
        .link-to-news-mobile a {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                width: 100%;
                max-width: 270px;
                height: 48px;
                box-sizing: border-box;
                background-color: #5e3719;
                border: 1px solid #835B3B;
                border-radius: 10px;
                color: #fff;
                text-decoration: none;
                font-family: "Noto Sans JP", sans-serif;
                font-size: 16px;
                font-weight: 700;
                transition: all 0.2s;
        }

        .link-to-news-mobile a::after {
                content: '\203A';
                font-weight: bold;
                font-size: 24px;
        }

        .link-to-news-mobile a:hover {
                background-color: #835B3B;
                color: #fff;
        }

	.block-list-news ul li:nth-child(n+3),
	.block-list-blog ul li:nth-child(n+3) {
		display: none;
	}

	#map-canvas {
		width: 100% !important;
		height: 400px !important;
		padding: 0px;
        }

	.block-access-map {
	        margin: 0 20px 20px 20px;
        }

        .block-access-map p {
	        display: none !important;
        }

	#smilego_bnrcbb11edc81d0 {
                top: 120px !important;
                z-index: 100;
        }

        #link-to-pagetop {
                display: none !important;
        }

        .block-news-and-blog .entry-title:after {
                display: none !important;
        }

	.site-footer .pure-g > [class*="pure-u-"] {
	        width: 100% !important;
	        text-align: center;
	}

	.site-footer .pure-u-5-24 img {
	        width: 182px;
	        height: auto;
	        margin: 0 auto;
	}

	.site-footer .contact {
	        font-size: 14px;
	        line-height: 1.8;
	        color: #5d452d;
	}

	.site-footer .contact .tel {
	        text-align: center;
	        padding: 20px 0;
	        display: none;
	}

	.tel-sp {
	        display: block;
	        width: 100%;
	        text-align: center;
	}

        .tel-sp a img {
                max-width: 90%;
                height: auto;
                display: block;
                margin: 0 auto;
        }

	.site-footer .pure-u-11-24 {
	        margin: 20px;
	}
	
	.site-footer .pure-u-11-24 .schedule{
	        background-color: #fff;
	        border-radius: 5px;
	        padding: 10px 20px;
	}

	.site-footer .schedule table {
	        width: 100%;
	        font-size: 11px;
	        color: #5e3719;
	        margin: 0;
	        border-collapse: collapse;
	        border: none;
	        line-height: 1.8px;
	}

	.site-footer .schedule th,
	.site-footer .schedule td {
	        padding: 4px 0;
	        background-color: #fff;
	        color: #5e3719;
	        border: none;
	}

	.site-footer .schedule td[colspan="7"] {
	        font-size: 13px;
	        font-weight: bold;
	}
	
	.schedule tbody tr {
	        border-bottom: solid 1px #5e3719;
	}

	.site-footer .schedule img {
	        width: 22px;
	        height: auto;
	}

	.site-footer .pure-u-5-5 {
	        display: none !important;
	}

	.site-footer .link-sitemap {
	        display: none !important;
	}

	.site-footer .link-sitemap a {
	        display: none !important;
	}

.block-event-calendar {
    margin: 20px;
}
.xo-event-calendar table td a {
    text-decoration: none;
    font-size: 8px;
}

}