@charset "UTF-8";
/* font setting */
*:not(.fa-brands, .fa-solid) {
	font-family: "Kosugi Maru", serif !important;
	font-weight: 400;
	font-style: normal;
}
/* base layout */
html {
	> body {
		/* header design */
		> header,
		> footer {
			background: var(--c_white);
		}
		> header {
			border-bottom: 2px solid var(--c_black);
			> h1 {
				a {
					display        : block;
					height         : Calc(var(--h_header)* 0.5);
					margin         : Calc(var(--h_header) * 0.25);
					text-decoration: none;

					img {
						height: Calc(var(--h_header) * 0.5);
						width : auto;
					}
					span {
						color         : var(--c_black);
						font-size     : Calc(var(--h_header) * 0.5);
						vertical-align: top;
					}
				}
			}
		}
		/* footer design */
		> footer {
			border-top: 2px solid var(--c_black);

			> p {
				color  : var(--c_black);
				padding: Calc((var(--h_footer) - var(--p_tb_hf))* 0.25);
			}
		}
	}
}
/* open map button*/
.btn_open_map {
    background : transparent;
    color      : var(--c_success);
    font-weight: bold;
}
/* lightbox */
.lightbox {
    cursor: pointer;
}
.lightbox_bg,
.mapbox_bg {
    background: var(--c_black);
    display   : none;
    height    : 100%;
    opacity   : 50%;
    position  : fixed;
    top       : 0;
    width     : 100%;
    z-index   : 10000;
}
.lightbox_main,
.mapbox_main {
    align-items    : center;
    display        : none;
    height         : 100%;
    justify-content: center;
    position       : fixed;
    top            : 0;
    width          : 100%;
    z-index        : 11000;
}
.lightbox_img,
.mapbox_iframe {
    border       : 20px solid var(--c_white);
    border-radius: 20px;
}
.lightbox_img {
    max-height: 80%;
    max-width : 90%;
}
.lightbox_btn,
.mapbox_btn {
    background   : var(--c_white);
    border-radius: 40px;
    color        : var(--c_gray);
    font-size    : 32px;
    font-weight  : 900;
    padding      : 10px 17px;
    position     : absolute;
    right        : 10px;
    top          : 10px;
    z-index      : 12000;
}
