@charset "utf-8";

/*------------------------------------------------------------------------------------------------ ▼ #wrap-smart-menu --*/

#wrap-smart-menu {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: rgba(255, 255, 255, 1);
	transition: var(--transition);
	z-index: 500;
	
	-ms-overflow-style: none;
	scrollbar-width: none;
	visibility: hidden;
}

#wrap-smart-menu::-webkit-scrollbar {
	display: none;
}

#wrap-smart-menu.open {
	visibility: visible;
}

@media (width <= 1023px) {
	#wrap-smart-menu {
		
	}
}

@media (hover: hover) and (pointer: fine) {
}

/*------------------------------------------------------------------------------------------------ ▼ #smart-menu --*/

#smart-menu {
	display: flex;
	flex-wrap: wrap;
	height: fit-content;
}

#smart-menu a {
	display: block;
	justify-content: center;
	border-bottom: 1px solid #f3f3f3;
	text-align: center;
	font-family: YuGo-B;
}

@media (1024px <= width) {
	#smart-menu {
		width: 600px;
	}
	
	#smart-menu a {
		width: calc(100% / 3);
		padding: 100px 0 40px;
		font-size: 16px;
	}
	
	#smart-menu a:first-child {
		width: 100%;
	}
	
	#smart-menu a.menu-home {
		background: url(/asset/image/general/header_menu/home.png) no-repeat center 37px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-plan {
		background: url(/asset/image/general/header_menu/plan.png) no-repeat center 39px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-company {
		background: url(/asset/image/general/header_menu/company.png) no-repeat center 37px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-news {
		background: url(/asset/image/general/header_menu/news.png) no-repeat center 37px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-contact {
		background: url(/asset/image/general/header_menu/contact.png) no-repeat center 38px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-sitemap {
		background: url(/asset/image/general/header_menu/sitemap.png) no-repeat center 38px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-map {
		background: url(/asset/image/general/header_menu/map.png) no-repeat center 38px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}
	
	#smart-menu a.menu-tel {
		display: none;
	}
}

@media (width <= 1023px) {
	#smart-menu {
		width: 100%;
		padding: 15px var(--margin) 0;
	}
	
	#smart-menu a {
		width: 50%;
		padding: 80px 0 30px;
		font-size: 13px;
	}
	
	#smart-menu a:first-child {
		width: 100%;
	}
	
	#smart-menu a:nth-child(-n + 2) {
		border-top: 0px solid #f0f0f0;
	}
	
	#smart-menu a:nth-child(2n) {
		border-left: 1px solid #f3f3f3;
	}
	
	#smart-menu a.menu-home {
		background: url(/asset/image/general/header_menu/home.png) no-repeat center 35px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-plan {
		background: url(/asset/image/general/header_menu/plan.png) no-repeat center 37px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-company {
		background: url(/asset/image/general/header_menu/company.png) no-repeat center 35px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-news {
		background: url(/asset/image/general/header_menu/news.png) no-repeat center 35px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-contact {
		background: url(/asset/image/general/header_menu/contact.png) no-repeat center 36px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-sitemap {
		background: url(/asset/image/general/header_menu/sitemap.png) no-repeat center 36px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-map {
		background: url(/asset/image/general/header_menu/map.png) no-repeat center 36px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
	}

	#smart-menu a.menu-tel {
		width: 100%;
		background: url(/asset/image/general/header_menu/tel.png) no-repeat center 36px / auto 30px, linear-gradient(to bottom right, #fff, #f6f6f6);
		font-family: Helvetica-B;
		font-size: 20px;
		letter-spacing: 1px;
		color: #46c;
	}
}

@media (hover: hover) and (pointer: fine) {
}

/*------------------------------------------------------------------------------------------------ ▼ #category-menu --*/


#category-menu {
    display: flex;
    flex-wrap: wrap;
    border: 1px solid var(--color-theme);
    border-radius: var(--border-radius-light);
    overflow: hidden;

    a, div {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 50px;
		background: #fff;

        text-align: center;
        font-size: 16px;
    }

    div {
        background: var(--color-theme);
        color: #fff;
    }

    a:nth-child(n + 2) {
        border-top: 1px solid var(--color-theme);
    }

    @media (hover: hover) and (pointer: fine) {
        a:hover {
            background: #eee;
        }
    }
}
