/* ==========================================================================
#HEADER
========================================================================== */
body.active{ overflow: hidden;}
header{ position: fixed; top: 0; left: 0; z-index: 1000; width: 100%; height: auto; transition: .3s; box-shadow: unset; width: fit-content; }
header .header{ padding: 40px 40px; width: fit-content; }
header .header .top{ width: fit-content; }
#header-bg{ display: block; width: 320px; height: 320px; border-bottom-right-radius: 320px; background-color: rgba(255,255,255,0.6); position: fixed; top: 0; left: 0; z-index: 100; transition: .3s; transform: scale(0); transform-origin: top left;}
header .header .logo, header .header .logo a{ display: block; width: 240px; height: 34px; position: relative;}
header .header .logo a img{ position: absolute; top: 0; left: 0; width: 100%; object-fit: cover; transition: .3s;}
header .header .logo a img.scroll{ opacity: 0;}
header .header .nav{ padding-top: 40px; width: 140px;}
header .header .nav a{ display: inline-block; transition: .3s; padding-bottom: 20px;}
header .header .nav a#panelbtn{ position: relative; }
header .header .nav a#panelbtn:after{ content: ''; width: 8px; height: 8px; border-radius: 50%; position: absolute; top: 0; right: -20px; background-color: #DEE5ED;}
header .header .nav a.close-btn{ position: relative; display: none;}
header .header .nav a.close-btn:after{ content: ''; width: 8px; height: 8px; border-radius: 50%; position: absolute; top: 0; right: -20px; background-color: #DEE5ED;}
header .header .nav a:hover{ color: #6C4D38; }


/* header-scroll */
header.scroll{ z-index: 1000; }
header.scroll .header .logo a img.scroll{ opacity: 1;}
header.scroll .header .logo a img.normal{ opacity: 0;}
header.scroll .header .nav a{ color: #6C4D38; }

/* header-hover */
header.hover .header .logo a img.scroll{ opacity: 1;}
header.hover .header .logo a img.normal{ opacity: 0;}
header.hover .header .nav a{ color: #6C4D38; }
#header-bg.hover{ transform: scale(1);}

/* panelopen */
#header-bg.panelopen{ position: fixed; width: 100%; height: 100%; background-color: rgba(255,255,255,.5); -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px); border-bottom-right-radius: 0; transform: scale(1);}
body.active header .header .nav a{ display: none; }
body.active header .header .nav a.close-btn{ display: inline-block;}
body.active header .header .logo a img.scroll{ opacity: 1;}
body.active header .header .logo a img.normal{ opacity: 0;}
body.active header .header .nav a{ color: #6C4D38; }

/* panel */
#panel{ position: fixed; display: block; width: 100%; height: 100%; top: 0; pointer-events: none; left: 0; z-index: 999; text-align: center; overflow: auto; /*background-color: rgba(255,255,255,.5); -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px);*/ transition: .3s; opacity: 0;}
#panel.active{ opacity: 1; pointer-events: inherit;}
#panel .mNav{ width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;}
#panel .mNav > ul > li{ width: 100%; overflow: hidden; text-align: center; padding-bottom: 30px; }
#panel .mNav > ul > li > a{ display: inline-block; width: fit-content; box-sizing: border-box; position: relative; transition: .3s; }
#panel .mNav > ul > li > a:after{ content: ''; position: absolute; width: 100%; height: 2px; background-color: #6C4D38; transition: .3s; bottom: 0; left: 0; transform: scale(0); transform-origin: center;}
#panel .mNav > ul > li > a:hover:after{ transform: scale(1);}
#panel .mNav > ul > li > a.active{ color: #CFB59E;}
#panel .mNav > ul > li > a.active:after{ transform: scale(1); background-color: #CFB59E;}
#panel .mNav > ul > li > a.active i{ transform: rotate(180deg);}
#panel .mNav .subNav{ padding: 20px 0 6px; overflow: hidden; width: 600px; left: 0; right: 0; margin: 0 auto; }
#panel .mNav .subNav li{ display: inline-block; width: max-content; padding: 12px 0 0 0 ;}
#panel .mNav .subNav li a{ display: inline-block; width: fit-content; margin: 0 19px; transition: .3s; position: relative; }
#panel .mNav .subNav li a:after{ content: ''; position: absolute; width: 100%; height: 1px; background-color: #CFB59E; transition: .3s; bottom: 0; left: 0; transform: scale(0); transform-origin: center;}
#panel .mNav .subNav li a:hover{ color: #CFB59E;}
#panel .mNav .subNav li a:hover:after{ transform: scale(1);}
.mNav02 li.kids{ display: none!important;}
.mNav03 li.standard{ display: none!important;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
    #header-bg.panelopen{ position: fixed; width: 100%; height: 100%; background-color: rgba(255,255,255,.7); -webkit-backdrop-filter: blur(50px); backdrop-filter: blur(50px); border-bottom-right-radius: 0; transform: scale(1); top:0;}
    #header-bg{ width: 200px; height: 200px; border-bottom-right-radius: 200px; top:-70px;}
    header{ position: fixed!important; }
    header .header .moblie-quick{ position: fixed; top: 20px; right: 15px;}
    header .header .moblie-quick i{ font-size: 20px; color: #fff; transition: .3s;}
    header .header .moblie-quick i.fa-solid{ display: none;}
    header .header .moblie-quick .fa-calendar-check{ margin-left: 10px;}
    header.scroll .header .moblie-quick i{ color: #6C4D38;}
    header.scroll .header .moblie-quick i.fa-solid{ display: inline-block;}
    header.scroll .header .moblie-quick i.fa-regular{ display: none;}
    header .header{ padding: 20px 15px 0 15px; }
    header .header .logo, header .header .logo a{ width: 142px; height: 28px;}
    header .header .nav{ padding-top: 20px;}
    header .header .nav a{ display: none; }
    header .header .nav a#panelbtn{ display: inline-block; }
    body.active header .header .nav a.close-btn{ display: none;}
    body.active header .header .nav a#panelbtn{ opacity: 0; pointer-events: none;}
    #panelclose.none-pc{ width: 64px; height: 64px; border-radius: 50%; background-color: #fff; line-height: 64px; text-align: center; font-size: 20px; position: absolute; bottom: 40px; left: 0; right: 0; margin: 0 auto; display: block;}
}




/* footer */
footer{ padding: 60px 0; background-color: #F7F2EF; text-align: center;}
footer .top{ padding-bottom: 40px; border-bottom: 1px solid #6C4D38; }
footer .top img{ padding-bottom: 40px;}
footer .top a{ font-size: 48px;}
footer .btm{ padding-top: 20px;}
footer ul.license{ display: block; padding-bottom: 20px;}
footer li{ display: inline-block; padding: 0 15px;}
footer li span{ display: inline-block; padding-right: 5px;}
footer li p{ display: inline-block;}
/* =================== 820px =================== */
@media (max-width: 1024px) {
    footer{ padding: 60px 0 80px; }
    footer .top img{ width: 80px; object-fit: cover; padding-bottom: 15px;}
    footer .top p{ font-size: 11px!important;}
}