/*
.link-off{
    pointer-events: none;
    cursor: default;
    text-decoration: none;
}
*/

/* body.admin-bar #wrap{padding-top:32px;} */
/*
#wpadminbar{position:fixed;}
@media (max-width:767px){
	body.admin-bar #header{top:calc(46px);}
	body.admin-bar #btn-menu{top:calc(46px + 16px);}
}
*/

/* Reset
-------------------------------------------------------------- */

/* Laytout
-------------------------------------------------------------- */
html.fixed,
body.open{width:100%; overflow:hidden;}
/*

@media (min-width:992px){
	.row-wide{margin-left:-30px; margin-right:-30px;}
	.row-wide>*{padding-left:30px; padding-right:30px;}
}
*/

[class*="fa5a"]::after,
[class*="fa5b"]::before{
	font-family: "Font Awesome 5 Free";
	font-weight:900;
}

/* common
-------------------------------------------------------------- */
a:hover{text-decoration:none;}
/*
a,
a.nav-link:hover{transition: all 0.3s;}
a.nav-link:hover{opacity:.7;}
*/

img{max-width:100%; height:auto;}
img[class*="fit"]{object-fit:cover;}
img.fit-contain{object-fit:contain;}
img.fit-lc{object-position:left center;}
img.fit-rc{object-position:right center;}

[class*="bg-img-"]{background-repeat:no-repeat; background-position:center center;}
.bg-img-cover{background-size:cover;}
.bg-img-contain{background-size:contain;}

.flex-cc{justify-content:center; align-items:center;}

.child-flex>*{display:flex;}
.child-flex>*>*{width:100%;}

.l{text-align:left;}
.c{text-align:center;}
.r{text-align:right;}

a.link-box{color:inherit; text-decoration:none;}
a.link-box:hover{text-decoration:none;/*  opacity:.8; */}

dl.def{line-height:1.6rem;}
dl.def dt{width:140px;}
dl.def dd{margin:-1.6rem 0 1.2rem 160px;}
dl.def dd.row2{margin-top:-3.2rem;}

@media (max-width:575px){
	dl.def:not(.fix) dt{width:auto;}
	dl.def:not(.fix) dd{margin:0 0 1.2rem 0;}
	dl.def:not(.fix) dd.row2{margin-top:-3.2rem;}
}

dl.def.line dt{padding:1rem;}
dl.def.line dd{margin:-3.6rem 0 0 0; padding:1rem 1rem 1rem 160px; border-top:1px solid black;}

.scroll-contents{width:100%; overflow:auto;}
.scroll-contents>*{display:inline-block !important; white-space:nowrap;}
.scroll-contents>*>*{display:inline-block !important; white-space:normal; vertical-align:top; box-sizing:content-box; text-align:left;}
.scroll-contents.scroll-center{text-align:center;}


/* header
-------------------------------------------------------------- */
:root{
	--menubtn-w:20px;
	--menubtn-h:18px;
	--menubtn-rgb:0,0,0;
	--menubtn-open-rgb:0,0,0;
	--menubtn-border-w:1px;
}
#btn-menu{width:var(--menubtn-w);height:var(--menubtn-h);background-color:transparent;padding:0;border:none;outline:0;cursor:pointer;position:relative;z-index:10000;line-height:1;}
#btn-menu span,
#btn-menu::after,
#btn-menu::before{
	content:'';
	background:rgb(var(--menubtn-rgb));
	position:absolute;
	right:0;
	height:var(--menubtn-border-w);
	-webkit-transition:width .2s cubic-bezier(.25,.46,.45,.94);
	transition:width .2s cubic-bezier(.25,.46,.45,.94);
	-webkit-transform-origin:left center;
	-ms-transform-origin:left center;
	transform-origin:left center;
}
#btn-menu::before{top:0;width:100%;}
#btn-menu::after{bottom:0;width:100%;}
#btn-menu span{top:calc(50% - var(--menubtn-border-w)); display:block;width:100%;text-indent:100%; overflow:hidden;}

#btn-menu:hover:not(.open)::after,
#btn-menu:hover:not(.open)::before{width:100%}
#btn-menu:hover:not(.open) span{width:100%;}
#btn-menu.open span{opacity:0}
#btn-menu.open::before{-webkit-animation:menu-icon-1 .6s alternate forwards;animation:menu-icon-1 .6s alternate forwards}
#btn-menu.open::after{-webkit-animation:menu-icon-2 .6s alternate forwards;animation:menu-icon-2 .6s alternate forwards}
@-webkit-keyframes menu-icon-1{
    40%{top:50%;width:var(--menubtn-w);-webkit-transform:translate(0,-50%);transform:translate(0,-50%);-webkit-transform-origin:center center;transform-origin:center center;rgb(var(--menubtn-rgb))}
    100%{top:50%;width:var(--menubtn-w);-webkit-transform:translate(0,-50%) rotate(135deg);transform:translate(0,-50%) rotate(135deg);-webkit-transform-origin:center top;transform-origin:center top;rgb(var(--menubtn-open-rgb))}
}
@keyframes menu-icon-1{
    40%{top:50%;width:var(--menubtn-w);-webkit-transform:translate(0,-50%);transform:translate(0,-50%);-webkit-transform-origin:center center;transform-origin:center center;rgb(var(--menubtn-rgb))}
    100%{top:50%;width:var(--menubtn-w);-webkit-transform:translate(0,-50%) rotate(135deg);transform:translate(0,-50%) rotate(135deg);-webkit-transform-origin:center top;transform-origin:center top;rgb(var(--menubtn-open-rgb))}
}
@-webkit-keyframes menu-icon-2{
    40%{bottom:50%;width:var(--menubtn-w);-webkit-transform:translate(0,50%);transform:translate(0,50%);-webkit-transform-origin:center center;transform-origin:center center;rgb(var(--menubtn-rgb))}
    100%{bottom:50%;right:1px;width:var(--menubtn-w);-webkit-transform:translate(0,50%) rotate(-135deg);transform:translate(0,50%) rotate(-135deg);-webkit-transform-origin:center top;transform-origin:center top;rgb(var(--menubtn-open-rgb))}
}
@keyframes menu-icon-2{
    40%{bottom:50%;width:var(--menubtn-w);-webkit-transform:translate(0,50%);transform:translate(0,50%);-webkit-transform-origin:center center;transform-origin:center center;rgb(var(--menubtn-rgb))}
    100%{bottom:50%;right:1px;width:var(--menubtn-w);-webkit-transform:translate(0,50%) rotate(-135deg);transform:translate(0,50%) rotate(-135deg);-webkit-transform-origin:center top;transform-origin:center top;rgb(var(--menubtn-open-rgb))}
}

/*
#btn-menu.txt-show span{
	border-top:2px solid #000;
	background-color:transparent;
	padding-top:12px;
	height:auto;
	overflow:visible;
	text-indent:inherit;
	font-size:13px;
}
*/

@media (min-width:992px){
	#btn-menu{display:none;}
}

@media (max-width:991px){	
    [class*="drawer-pannel"]{
        width:90%;
        height:100vh;
        height:100dvh;
        padding:60px 20px;
        position:fixed;
        top:0;
        right:0;
        background:white;
        overflow-y: auto;
        z-index:9999;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
/*
        -webkit-transition:ease .3s;
        transition:ease .3s;
*/
    }
    body.open [class*="drawer-pannel"]{
        -webkit-transform: translateX(0);
        transform: translateX(0);
        -webkit-transition:ease .3s;
        transition:ease .3s;
    }
}

/* scroll fadein
--------------------------------------------------------------*/
.fadein{
    opacity:0;
    transform:translateY(40px);
    transition:all 1s;
}
.fadein.only{
    transform:translateY(0);
}
.fadein.lazyloaded{
    opacity:1;
    transform:translateY(0);
}

/* float-scroll-link
----------------------------------------------- */
#float-scroll-link-box{position:fixed; bottom:16px; right:16px; z-index:1000;}
.scroll-link{display:inline-block; width:46px; height:46px; background-color:rgba(0,0,0,.8); border-radius:50%; border:none; position:relative; padding:0; margin:0;}
.scroll-link::after{
	content:'';
	display:block;
	width:12px;
	height:12px;
	border:1px solid white;
	border-width:1px 1px 0 0;
	-webkit-transform:rotate(-45deg) translate(-50%, -50%);
    transform:rotate(-45deg) translate(-50%, -50%);
    position:absolute;
    top:56%;
    left:50%;
	transform-origin:0 0;
}

/* youtube
----------------------------------------------- */
.post-tmb,
.ratio-box,
.youtube{
	width:100%;
	aspect-ratio:16/9;
	position:relative;
}
.post-tmb>img,
.ratio-box>*,
.youtube iframe{
	position: absolute;
	top:0;
	left:0;
	width:100% !important;
	height:100% !important;
}
.post-tmb>img{object-fit:cover;}

.map iframe{width:100%; vertical-align:bottom;}

/* button anime
----------------------------------------------- */
.line-hover{
    position: relative;
    display: inline-block;
}
.line-hover::after{
    content: '';
    position: absolute;
    bottom:0;
    left: 0;
    width: 100%;
    height: 2px;
    background:black;
    transform:scale(0, 1);
    transform-origin:left top;
    transition:transform .3s;
}
.line-hover.active::after,
.line-hover:hover::after {
  transform:scale(1, 1);
}
.nav-link.line-hover::after{
    bottom:.5rem;
    left:.2rem;
    width:calc(100% - .4rem);
}

.pannel .line-hover::after{
    background:white;
}

/* slide */
.hover-slide{position:relative; overflow:hidden;}
.hover-slide>*{position:relative; z-index:10;}
.hover-slide::before{
    content:'';
    width:120%;
    height:100%;
    background-color:black;
    position:absolute;
    top:0;
    left:-130%;
    transition:all .3s ease;
    transform:skewX(-25deg);
}
.hover-slide:hover::before{left:-10%;}
.hover-slide:hover{color:white;}
.hover-slide.disabled{opacity:.7;}
