/*
Theme Name: light-plan_01
Author: SALONNO
Version: 1.0
*/

html {
    margin: 0px !important;
}

body {
    font-family: Arial, Helvetica, sans-serif;
}


	h1{
		font-size:48px;
	}

	h2{
		font-size:30px;
	}

	h3{
		font-size:24px;
	}

	h4{
		font-size:16px;
	}

	p{
		font-size:18px;
		color:#4B5563;
	}

@media (max-width: 1024px) {
	
	h1{
		font-size:36px;
	}

	h2{
		font-size:24px;
	}

	h3{
		font-size:20px;
	}

	h4{
		font-size:14px;
	}

	p{
		font-size:16px;
	}
}


@media (max-width: 767px) {
	h1{
	font-size:28px;
	}

	h2{
		font-size:20px;
	}

	h3{
		font-size:18px;
	}

	h4{
		font-size:13px;
	}

	p{
		font-size:14px;
	}
}

button.reservation-btn {
    background-color: #000;
}

button.reservation-btn:hover {
    background-color: #000;
	opacity:0.8;
}




/* header-menu↓ */
ul.header-menu li {
    float: left;
}

ul.header-menu li a {
    margin: 0 1.5rem;
    font-size: 14px;
	color:#fff;
}

ul.header-menu li a:hover {
	color:#000;
}

a.hidden.md\:block {
    border: 1px solid;
	color:#fff;
}

a.hidden.md\:block:hover {
	color:#000;
}

header.fixed {
    transition: all 0.4s ease; 
    background-color: inherit; 
    box-shadow: none;
}

header.fixed.plus-dec {
    background-color: #fff;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); 
    transition: all 0.4s ease; 
}

a.scroll-dec {
    color: #000 !important;
	transition: all 0.4s ease; 
}

a.scroll-dec:hover {
    opacity:0.8!important;
}

.btn-dec {
	transition: all 0.4s ease; 
    color: #000!important; 
}

.btn-dec:hover {
	background-color:#000!important;
	color:#fff!important;
}

img.logo-h {
    max-height: 70px!important;
}

@media (max-width: 767px) {
	img.logo-h {
    max-height: 50px!important;
}
	
	.h-24 {
    height: 4rem;
}
}


 /* ハンバーガーボタン */
     input#hamburger-toggle {
    display: none!important;
}

        .hamburger {
            position: absolute;
            top: 33px;
    		right: 33px;
            display: none;
            flex-direction: column;
            justify-content: space-around;
            width: 30px;
            height: 25px;
            background: transparent;
            border: none;
            cursor: pointer;
        }

@media (max-width: 767px) {
	.hamburger {
		display:flex;
	}
	
	.hamburger {
    top: 20px;
	}
}

        .bar {
            width: 30px;
            height: 4px;
            background-color: black;
            transition: all 0.3s ease-in-out;
        }

        #mobile-menu {
            position: fixed;
            top: 0;
            right: -100%; 
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.9);
            transition: right 0.3s ease-in-out;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }

        .hamburger-toggle:checked ~ #mobile-menu {
            right: 0; 
        }

        .hamburger-toggle:checked + .hamburger .bar:nth-child(1) {
            display:none;
        }

        .hamburger-toggle:checked + .hamburger .bar:nth-child(2) {
            display:none;
        }

        .hamburger-toggle:checked + .hamburger .bar:nth-child(3) {
            display:none;
        }

        /* 閉じるボタン (✕) */
        .close-btn {
            position: absolute;
			top:15px;
    		right: 30px;
            font-size: 40px;
            color:#fff;
            background: none;
            border: none;
            cursor: pointer;
			transition: 0.5s;
        }

.close-btn:hover{
	transform: scale(1.15);
	color: #007BFF;
}

        /* メニュー内リンクのスタイル */
        .menu-list li a {
            text-decoration: none;
            color: #fff;
            font-size: 24px;
            transition: color 0.3s;
        }

        .menu-list li a:hover {
            color: #007BFF; /* ホバー時の色 */
        }








/* header-menu↑ */

/*  main-view↓ */

.hero-bg img{
	width: -webkit-fill-available;
    height: -webkit-fill-available;
    object-fit: cover;
}


@media (max-width: 767px) {
.w-full {
    width: 100%;
    aspect-ratio: 2 / 3!important;
    height:auto;
	}
}
	
/* main-view↑ */

/* about↓ */
.overflow-hidden {
    margin: auto;
}

/* about↑ */

/* menu↓ */


.shadow-md {
    --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 -3px 3px -1px rgba(0, 0, 0, 0.06);
}

.shadow-md.rounded-lg.overflow-hidden {
    border: 1px solid #e7e7e7;
}

.transition-colors:hover {
    background-color: #1717170D;
}

.transition-colors {
    transition-duration: 100ms;
}

.group .divide-y > .p-6:nth-of-type(even) {
    background-color: #f9fafb!important;
}


.p-6 {
    background-color: white; 
    transition: background-color 0.3s ease, color 0.3s ease; 
}

.group .divide-y > .p-6:nth-of-type(even) {
    background-color: #f9fafb !important; 
}

.p-6:hover {
    background-color: #171717; 
    color: white; 
}

.transition-colors:hover {
    background-color: #1717170D; 
}

.transition-colors {
    transition-duration: 100ms; 
}



/* menu↑ */


/* insta↓ */
.insta-list {
    display: flex;
    justify-content: center;
	align-items: center;
    gap: 1%;
    flex-wrap: wrap;
}

.insta-list iframe {
    width: 30% !important;
}

@media (max-width: 767px) {
	.insta-list iframe {
    width: 44% !important;
	}
	
}


/* insta↑ */

/* map↓ */
.w-full {
    width: 100%;
    aspect-ratio: 16 / 9;
}

.w-full.aspect-\[16\/6\] iframe {
    width: 100% !important;
    height: 100% !important;
}

/* map↑ */


/* footer↓ */
p.text-gray-400.font-s16 {
    font-size: 16px;
}

.flex.items-center.gap-2.mb-2 svg {
    transform: translateY(-1px);
}

/* footer↑ */