#header {
    background-color: var(--white);
    box-shadow: var(--shadow);
    width:100%;
}
#header a {
    text-decoration: none;
}
.header_logo {
    width: auto;
    background: url(../../img/logo.png) left center no-repeat;
    background-size: 1.5em auto;
    padding-left: 1.5em;
    font-size: var(--fsizeL);
    font-weight: 600;
}
.header_logo a {
    color:var(--black);
}
.navbar > .inner{
    width:100%;
    padding: 4px var(--size20);
    display: flex;
    align-items: center;
    gap:var(--size10);
}

@media (max-width:1024px)  {
    .navbar > .inner {
        min-height:60px;
    }
}
@media (max-width:799px)  {
    #header {
        position:sticky;
        left:0;
        top:0;
        z-index: 10;
    }
    .navbar {
/*         height:70px; */
    }
    .navbar > .inner {
		display: block;
        height:100%;
        min-height:60px;
    }
	
	.header_info {
		display: flex;
		gap: 8px;
	}
	
	.header_info .sales_box.sales01 {
		border: 2px solid var(--blue01);
		border-radius: 5px;
		overflow: hidden;
    font-weight: 500;
	}
	
	.header_info .sales_box.sales02 {
    border: 2px solid var(--orange01);
		border-radius: 5px;
		overflow: hidden;
    font-weight: 500;
}
	
    .header_logo {
        width: auto;
        background-size: auto 48px;
        padding-left: 55px;
        font-size: var(--fsizeXL);
		min-height: 60px;
    display: flex;
    align-items: center;
    }
    #gnav {
        position: fixed;
        top: 0;
        right: -80%;
        width: 80%;
        height: 100%;
        padding-top: 100px;
        background:var(--gley02);
        z-index: 2;
        transition:.5s var(--easeout);
    }
    #gnav .inner {
        padding: 0 10% var(--size40);
        overflow: auto;
        height: 100%;
    }
    .navibar-nav {
        margin-bottom:var(--size40);
    }
    .navibar-nav li {
        margin-bottom:0.5em;
        font-size:var(--fsizeL);
    }
    .navibar-nav li a {
        text-decoration: none;
        color:var(--black01);
    }
    .btn_header {
        width:100%;
        height:auto;
        padding:var(--size10) var(--size20);
        display: flex;
        justify-content: center;
        align-items: center;
        gap:var(--size10);
        font-size:var(--fsizeL);
        letter-spacing: 0.1em;
    }
    .btn_header img {
        width:1.5em;
    }
    #gnav.open {
        right: 0;
        transition:.5s var(--easeout);
    }
    .navbar-toggler {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 50px;
        height: 50px;
        background: var(--orange01);
        border: 0;
        position: fixed;
        z-index: 100;
        right:var(--size20);
        top: var(--size10);
    }
    .navbar-toggler span {
        width: 26px;
        height: 2px;
        margin-bottom: 6px;
        background:var(--white);
        display: block;
        transition: 0.5s var(--liner);;
    }
    .navbar-toggler span:last-child {
        margin-bottom:0;
    }
    .navbar-toggler.open span {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        transform: rotate(45deg);
    }
    .navbar-toggler.open span + span {
        transform: rotate(-45deg);
    }
    .navbar-toggler.open span + span + span {
        transform: scale(0);
    }
}
@media (max-width:499px){
    .header_logo {
        width: auto;
        background-size:48px auto;
        padding-left: 50px;
        font-size: calc(0.8*var(--fsizeXL));
    }
}
@media (min-width:800px) {
    #header {
        position:sticky;
        left:0;
        top:0;
        height:100px;
        z-index: 10;
    }
    
    .header_info {
        display: flex;
        align-items: center;
        gap:var(--size10);
    }
    .header_info .medal {
        width:min(12vw,165px);
        height:auto;
    }
    .header_info .sales_box {
        border-radius: 5px;
        border-width:2px;
        border-style: solid;
        overflow: hidden;
        font-size:clamp(10px, 1.25vw, 13px);
        letter-spacing: -0.01em;
        font-weight:500;
    }
    .header_info .sales_box p {
        margin: 0 var(--size10);
    }
    .header_info .sales_box .baloon {
        position:relative;
		margin-bottom: 5px;
    }
    .header_info .sales_box .baloon:after {
        content:"";
        display: block;
        width:19px;
        height:8px;
        position:absolute;
        top:98%;
        left:calc(50% - 19px/2);
        background-color: var(--white);
        clip-path: var(--crip_arw_b);
    }
    .header_info .sales_box.sales01 {
        border-color:var(--blue01);
    }
    .header_info .sales_box.sales02 {
        border-color:var(--orange01);
    }
    #gnav {
        padding:0 0 5px;
    }
    #gnav .navibar-nav {
        display: flex;
        justify-content: center;
        display: flex;
        margin:0 var(--size20);
    }
    #gnav .navibar-nav li a {
        display: inline-block;
        padding:0 0.5em;
        font-size:var(--fsizeS);
        color:var(--black01);
    }
    #gnav .navibar-nav li a span {
        text-decoration: underline;
        text-underline-offset: 5px;
        text-decoration-color: transparent;
        transition:all .3s var(--easeout);
    }
    #gnav .navibar-nav li.current a span,#gnav .navibar-nav li a:hover span {
        text-decoration-color: var(--orange01);
    }
    .btn_header {
        position:absolute;
        width:12vw;
        height:60px;
        display: flex;
        flex-flow: column;
        justify-content: center;
        align-items: center;
        gap:3px;
    }
    .btn_header img {
        width:min(15%,30px);
        height:auto;
    }
    header .btn_contact {
        right:0;
        top:0;
    }
    header .btn_tel {
        right:12vw;
        top:0;
    }
    header .btn_tel span {
        line-height: 1.1;
        display: block
    }
    header .btn_tel span span.txt {
        font-size:0.75em;
    }
    .btn_header span {
        font-size:var(--fsizeS);
    }
}
@media (min-width:1024px) {
    .navibar-nav li:not(:last-child):after {
        content:"／";
    }

}
@media (max-width:1339px) and (min-width:900px){
    .btn_header {
        width:15vw;
        gap:5px;
        flex-flow:row;
    }
    header .btn_tel {
        right:15vw;
    }
}
@media (min-width:1340px) {
    #gnav .navibar-nav {
        justify-content: flex-start;
    }
    .btn_header {
        width:160px;
        height:100px;
        gap:10px;
    }
    .btn_header img {
        width:38px;
        height:auto;
    }
    header .btn_tel {
        right:160px;
    }
   .btn_header span {
        font-size:var(--fsizeM);
    }
}

