@charset "utf-8";
/*Background_setting*/
*{ margin:0; padding:0; line-height:160%; font-family:'微軟正黑體',sans-serif; box-sizing:border-box; /*scroll-behavior: smooth;*/} /*拿掉 smooth， html required 驗證 延遲捲動會無法顯示訊息*/
*:focus { outline: none;}
::selection{ background-color:#ffdc28; color:#000;}
a{ text-decoration:none;}
img{ max-width:100%;}
font{ color:inherit; font:inherit;}
strong{ font-weight:bold;}

/*Header*/
header{ position:fixed; top:0; left:0; right:0; z-index:10;}
header .SearchBox{ text-align:center; background-color:#ffdc28; display: flex; align-items: center; justify-content: center; padding:10px; gap:10px;}
header .SearchBox .GufonetLogo{ width:120px;}
header .SearchBox .SearchBar{ position:relative; width:100%; max-width:550px;}
header .SearchBox .SearchBar input{ width:100%; background-color:#fff; border:0; border-radius:44px; height:44px; line-height:34px; padding:5px 70px 5px 25px;}
header .SearchBox .SearchButton{ width:29px; height:29px; position:absolute; top:7px; right:25px; border:0; background:none; background:url(../images/layout/icon-search.png) no-repeat center; background-size:cover;}
header .SearchBox.Scroll{ padding:5px 10px;}
header .SearchBox.Scroll .GufonetLogo{ width:80px;}
header .SearchBox.Scroll .SearchBar input{ height:30px; line-height:30px; padding:5px 40px 5px 25px;}
header .SearchBox.Scroll .SearchBar input:focus{ border-color:#4e2280;}
header .SearchBox.Scroll .SearchButton{ top:4px; right:10px; width:22px; height:22px; cursor:pointer;}
header .MenuBox{ display:flex; /*align-items: flex-end;*/ justify-content: space-between; padding:0 30px; position:relative;}
header .MenuBox::after{ content:""; position:absolute; top:0; left:0; right:0; height:170px; display:block; background: linear-gradient(to bottom, rgba(255,255,255,1) 40%,rgba(0,0,0,0) 100%); pointer-events:none; z-index:-1;}
header .MenuBox .Beside{ flex:1;}
header .MenuBox .Logo{ width:209px; display:block; padding:10px;}
header .MenuBox .MobileMenu{ display:none;}
header .MenuBox .List{ display:flex; list-style-type:none; padding-top:15px;}
header .MenuBox .List .Item{}
header .MenuBox .List .Item a{ font-size:18px; display:block; color:#000 ; padding:10px 20px; font-weight:bold; position:relative;}
/* header .MenuBox .List .Item:hover .Name{ color:#e09d15;} */
/* header .MenuBox .List .Item:hover .Name::after{ content:""; display:block; position:absolute; left:20px; right:20px; bottom:10px; border-top:1px solid #e09d15;} */
header .MenuBox .List .Item .OptionsList{ display:flex; position:absolute; left:0; right:0; background-color:#fff; list-style-type:none; display:none; z-index:6;}
header .MenuBox .List .Item .OptionsList .ContentArea{ width:100%; max-width:1400px; margin:auto; padding:30px; display:flex;}
header .MenuBox .List .Item .OptionsList .Head{ width: 450px; flex-shrink: 0;}
header .MenuBox .List .Item .OptionsList .Head p{ font-size:40px; font-weight:bold; padding-bottom:20px; text-align:center}
header .MenuBox .List .Item .OptionsList .SubList{ flex:1; list-style-type: none; padding-left:80px; max-height: 100%; overflow-y: auto;}
header .MenuBox .List .Item .OptionsList .SubList .DetailItem{ position:relative;}
/* header .MenuBox .List .Item .OptionsList .SubList .DetailItem:hover::after{ content:""; display:block; background-image: url(../images/layout/icon-menu-arrow-02.png); width:20px; height:20px; background-size: 100%; transform: rotate(-90deg); position:absolute; top:18px; right:0;} */
/* header .MenuBox .List .Item .OptionsList .SubList .DetailItem:hover>a::after{ content:""; display:block; background-image: url(../images/layout/icon-menu-arrow-02.png); width:20px; height:20px; background-size: 100%; transform: rotate(-90deg); position:absolute; top:18px; right:0;} */
header .MenuBox .List .Item .OptionsList .PaginationList{ flex:1; list-style-type: none; padding-left:80px;}
/* header .MenuBox .List .Item:hover .OptionsList{ display:block; box-shadow:0 20px 20px rgba(0,0,0,.1); } */
header .MenuBox .List .Item .OptionsList .SubList .DetailItem:hover>a,
header .MenuBox .List .Item .OptionsList a:hover{ color:#e09d15;}
header .MenuBox .Language{ text-align:right;}
header .MenuBox .Language a{ font-size:18px; display:inline-block; color:#000 ; padding:15px; display:none;}
header .SearchBox.Scroll + .MenuBox::after{ height:100px; background: linear-gradient(to bottom, rgba(255,255,255,1) 70%,rgba(0,0,0,0) 100%);}

/* PC 選單 */
@media screen and (min-width: 1281px){
    header .MenuBox .List .Item .OptionsList .ContentArea{ max-height: calc( 100dvh - 75px - 64px ); }
    header .MenuBox .List .Item .OptionsList .SubList .DetailItem:has(.PaginationList):hover>a::after{ content:""; display:block; background-image: url(../images/layout/icon-menu-arrow-02.png); width:20px; height:20px; background-size: 100%; transform: rotate(-90deg); position:absolute; top:18px; right:0;}

    header .MenuBox .List .Item:hover .Name{ color:#e09d15;}
    header .MenuBox .List .Item:hover .Name::after{ content:""; display:block; position:absolute; left:20px; right:20px; bottom:10px; border-top:1px solid #e09d15;}
    header .MenuBox .List .Item:hover .OptionsList{ display:block; box-shadow:0 20px 20px rgba(0,0,0,.1); }

    header .MenuBox .List .Item .OptionsList .SubList .DetailItem{ display:inline-flex; width:100%; }
    header .MenuBox .List .Item .OptionsList .SubList .DetailItem>a{ width:100%; }
    header .MenuBox .List .Item .OptionsList .SubList .DetailItem:has(.PaginationList)>*{ width:50%; }
    header .MenuBox .List .Item .OptionsList .SubList .DetailItem:has(.PaginationList):after{ right:calc(50% - 25px); }
    header .MenuBox .List .Item .OptionsList .SubList .DetailItem .PaginationList{ display:none; }
    header .MenuBox .List .Item .OptionsList .SubList .DetailItem .PaginationList .DetailItem a::after{display:none;}
    
    header .MenuBox .List .Item .OptionsList .SubList .DetailItem:hover .PaginationList{ z-index:1; display:block; }
    
    header .MenuBox .List .Item .OptionsList .SubList{ position:relative;}
    header .MenuBox .List .Item .OptionsList .SubList .DetailItem:has(.PaginationList){ position:unset;}
    header .MenuBox .List .Item .OptionsList .SubList .DetailItem .PaginationList{ overflow:auto; position:absolute; top:0; bottom: 0; right:0;}

    .RightBtnx .FunctionSlide{ width: 90px; margin-bottom: -40px; overflow: hidden; }
    .RightBtnx>.Function[target-about]{ transform: translateY( -210px ); }
}


/*Footer*/
footer nav{ width:100%; background-color:#e5e5e2; padding:50px 30px;}
footer .FatFooter{ display:flex; flex-wrap: wrap; justify-content: space-between; row-gap: 80px; width:100%; max-width:1280px; margin:auto;}
footer .FatFooter .Label{ width:20%; flex-shrink:0; list-style-type:none;}
footer .FatFooter .Label .LableTitle{ font-size:16px; color:#000; font-weight:bold; position:relative; z-index:0;}
footer .FatFooter .Label .LableTitle::after{ content:""; display:block; position:absolute; left:-1px; right:-1px; bottom:0; border-top:7px solid #ffdc28; z-index:-1;}
footer .FatFooter .List{ list-style-type:none;}
footer .FatFooter .List .Item a{ color:#333; font-size:14px; transition:.2s;}
footer .FatFooter .Community{ position:relative;}
footer .FatFooter .Community .Link{ display:inline-block; border-radius:50%; width:45px; height:45px; border:1px solid #000; margin:1px;}
footer .FatFooter .Community .Group{ display:inline-block;}
footer .Copyright{ background-color:#626262; text-align:center; padding:15px;}
footer .Copyright .Links a{ color:#ffdc28; font-size:14px; border-left:1px solid #ffdc28; padding:0 10px; line-height:1; display:inline-block;}
footer .Copyright .Links a:first-child{ border:0;}
footer .Copyright p{ font-size:14px; color:#fff;}
footer .FatFooter .List .Item a:hover{ text-decoration:underline; padding-left:5px; transition:.2s;}
footer .FatFooter .Community .Group .WindowsTouchArea{ display:none; top:60px; right:auto; left:-95px; padding:0;}
footer .FatFooter .Community .Group.open .WindowsTouchArea{ display: block;}
footer .FatFooter .Community .Group .WindowsTouchArea .RightWindows::before{ top:-11px; right:15px; border-color: #ffdc28 transparent; border-width: 0 12px 10px 12px;}
footer .FatFooter .Community .Group .WindowsTouchArea .RightWindows::after{ top:-10px; right:15px; border-color: #fff transparent; border-width: 0 12px 10px 12px;}
footer .NewsletterArea{ padding-top:10px;}
footer .NewsletterArea .Title{ font-size:18px; font-weight:bold; text-align:left; padding-bottom:5px;}
/*footer .NewsletterArea .Title::before{ content:""; display:inline-block; width:40px; height:24px; background:url(../images/page/icon-title-decorate.png) center; background-size:cover; vertical-align:text-bottom; margin-right:5px;}*/
footer .NewsletterArea .EmailArea{ background-color:#fff; padding:3px 6px; border-radius:5px; width:100%; border:0; font-size:16px;}
footer .NewsletterArea .BtnBox{ gap:10px; padding-top:10px; display:flex; text-align:center;}
footer .NewsletterArea .BtnBox .Enter{ background-color:#ffdc28; border-radius:5px; color:#000; font-size:16px; display:block; padding:5px; border:0; flex:1; cursor:pointer;}
footer .NewsletterArea .BtnBox .Cancel{ background-color:#d9d9d9; border-radius:5px; color:#000; font-size:16px; display:block; padding:5px; border:0; flex:1; cursor:pointer;}



/*Right*/
.RightBtnx{ position:fixed; right:15px; bottom:20px; display:flex; flex-direction: column; gap:20px; text-align:right; z-index:5;}
.RightBtnx .Btn{ display:block; text-align:center; position:relative; font-size:0; z-index:1;}
.RightBtnx .Btn img{ width:65px; height:65px;}
.RightBtnx .Btn .Icon{ width:65px; height:65px; background:no-repeat center; background-size:cover; display:inline-block; transition:.2s;}
.RightBtnx .Btn .Icon.GufoFAQ{ background-image:url(../images/layout/icon-gufo-faq.png);}
.RightBtnx .Btn .Icon.Contact{ background-image:url(../images/layout/icon-right-contact.png);}
.RightBtnx .Btn .Icon.Newsletter{ background-image:url(../images/layout/icon-right-newsletter.png);}
.RightBtnx .Btn p{ color:#7a7a7a; font-size:18px; font-weight:bold;}
.RightBtnx .Btn:hover img{ transform: scale(1.1); transition:.2s;}
.RightBtnx .Btn:hover .Icon.GufoFAQ{ background-image:url(../images/layout/icon-gufo-faq-hover.png);}
.RightBtnx .Btn:hover .Icon.Contact{ background-image:url(../images/layout/icon-right-contact-hover.png);}
.RightBtnx .Btn:hover .Icon.Newsletter{ background-image:url(../images/layout/icon-right-newsletter-hover.png);}
/*LightBox*/
.LightBox{ position:fixed; top:0; left:0; right:0; bottom:0; background-color:rgba(0,0,0,.4); display:flex; align-items: center; justify-content: center; padding:30px; z-index:10;}
.LightBox .ContentArea{ width:100%; max-width:800px; background-color:#fff; border-radius:10px; overflow:hidden;}
.LightBox .ContentArea .TopArea{ border-bottom:1px solid #e9ecef; display:flex;}
.LightBox .ContentArea .TopArea .Title{ flex:auto; padding:15px 20px; line-height:1; color:#7a7a7a; font-size:20px; font-weight:bold;}
.LightBox .ContentArea .TopArea .Close{ padding:15px 20px; line-height:1; color:#7a7a7a; font-size:20px; font-weight:bold; cursor:pointer;}
.LightBox .ContentArea .TopArea .Close:hover{ background-color:#eee;}
.LightBox .ContentArea .MainArea{ padding:30px 20px 40px;}
.LightBox .ContentArea .MainArea p{ padding-bottom:15px; line-height:1.8;}
.LightBox .ContentArea .MainArea img{ display:block; margin:auto;}
.WindowsTouchArea{ display:none; padding-right:110px; position:absolute; right:0;}
.RightWindows{ width:300px; background-color:#fff; border:1px solid #ffdc28; border-radius:5px; box-shadow:0 0 9px 3px rgba(0,0,0,.14); padding:10px; position:relative;}
.RightWindows::before{ content:""; display:block; position:absolute; top:75px; right:-11px; border-style:solid; border-color:transparent #ffdc28; border-width:12px 0 12px 10px;}
.RightWindows::after{ content:""; display:block; position:absolute; top:75px; right:-10px; border-style:solid; border-color:transparent #fff; border-width:12px 0 12px 10px;}
.RightWindows .Title{ font-size:22px; font-weight:bold; text-align:left; padding-bottom:15px;}
.RightWindows .Title::before{ content:""; display:inline-block; width:40px; height:24px; background:url(../images/page/icon-title-decorate.png) center; background-size:cover; vertical-align:text-bottom; margin-right:5px;}
.RightWindows table{ text-align:left;}
.RightWindows .Name{ color:#000; font-weight:bold;}
.RightWindows .Num{ color:#7a7a7a; padding-left:5px;}
.RightWindows .EmailArea{ background-color:#eee; padding:3px 6px; border-radius:5px; width:100%; border:0; font-size:20px;}
.RightWindows .BtnBox{ gap:10px; padding-top:20px; display:flex; text-align:center;}
.RightWindows .BtnBox .Enter{ background-color:#ffdc28; border-radius:5px; color:#000; font-size:20px; display:block; padding:10px; border:0; flex:1; cursor:pointer;}
.RightWindows .BtnBox .Cancel{ background-color:#d9d9d9; border-radius:5px; color:#000; font-size:20px; display:block; padding:10px; border:0; flex:1; cursor:pointer;}
.WindowsTouchArea.Contact{ top:60px;}
.WindowsTouchArea.Newsletter{ top:230px;}
.Function.open .WindowsTouchArea{ display:block;}

.Message{ bottom:0;}
.MessageBox{ width:500px; height:550px; max-height: 90vh; display: flex; flex-direction: column; background-color:#fff; box-shadow:0 0 45px 10px rgba(0,0,0,.1); text-align:left; overflow:hidden; border-radius:5px;}
.MessageBox .TitleArea{ display:flex; background-color:#4e2280;}
.MessageBox .TitleArea .Name{ flex:1; color:#fff; line-height:40px; padding-left:20px;}
.MessageBox .TitleArea .Close{ color:#fff; line-height:40px; width:40px; text-align:center; cursor:pointer;}
.MessageBox .TitleArea .Close:hover{ background-color:rgba(0,0,0,.2);}
.MessageBox .DisplayArea{ flex:1; padding:20px; overflow-Y:auto; display:flex; flex-direction: column; gap:20px;}
.MessageBox .DisplayArea .Row{ display:flex; align-items: flex-start; gap:10px;}
.MessageBox .DisplayArea .Photo{ width:30px; height:30px; border-radius:50%; background:center no-repeat #eee; background-size:cover; flex-shrink:0;}
.MessageBox .DisplayArea .Word { max-width: 66%; width: fit-content; min-width: 50px; list-style-position: inside; padding: 5px 10px; border-radius: 10px; background-color: #eee;}
.MessageBox .DisplayArea .Word > * { margin-bottom:1rem;}
.MessageBox .DisplayArea .Row.System { flex-direction: row;}
.MessageBox .DisplayArea .Row.User{ flex-direction: row-reverse;}
.MessageBox .DisplayArea .Row.User .Photo{ display:none;}
.MessageBox .DisplayArea .Row.User .Word{ background-color:#4e2280; color:#fff;}
.MessageBox .ControlArea{ display:flex; background-color:#fff; border-top:1px solid #fff; padding:5px; gap:5px;}
.MessageBox .ControlArea .Input{ flex:1; color:#333; border:1px solid #ccc; border-radius:5px;}
.MessageBox .ControlArea .Input input{ width:100%; background:none; border:0; line-height:40px; font-size:18px; padding:0 15px;}
.MessageBox .ControlArea .Enter{ width:80px; flex-shrink:0; cursor:pointer;}
.MessageBox .ControlArea .Enter button{ width:100%; color:#fff; background-color:#4e2280; line-height:40px; text-align:center; border:0; border-radius:5px; padding:0 10px; font-size:18px; cursor:pointer;}

/*Cookies*/
.Cookies{ position:fixed; left:0; right:0; bottom:0; background-color:rgba(0,0,0,.7); padding:20px; z-index:11;}
.Cookies .ContentArea{ display:flex; gap:30px; align-items: center; margin:auto; max-width:1000px;}
.Cookies p{ font-size:16px; color:#fff;}
.Cookies a{ font-size:16px; color:#fff; text-decoration:underline; display:inline-block;}
.Cookies .Enter{ display:inline-block; border:1px solid #fff; color:#fff; padding:5px 15px; font-size:16px; cursor:pointer; width:100px; text-align:center; flex-shrink:0; transition:.2s;}
.Cookies a:hover{ color:#ffdc28; transition:.2s;}
.Cookies .Enter:hover{ border-color:#ffdc28; color:#ffdc28; transition:.2s;}

@media screen and ( max-width: 1500px) {
/*Header*/
header .MenuBox{ padding:0 10px;}
header .MenuBox .List .Item a{ padding:15px 10px;}
}

@media screen and (max-width: 1280px) and (min-width: 769px) {
/*Header*/
header{ background-color:#fff;}
header::before{ content:""; display:block; background:linear-gradient(to right, #edaf11, #ffda27); width:100%; height:5px;}
header .SearchBox{ background:none; position:absolute; top:0; left:100px; right:50px; padding:10px 0; z-index:1;}
header .SearchBox.Scroll{ top:10px;}
header .SearchBox .GufonetLogo{ display:none;}
header .SearchBox .SearchBar input{ border:1px solid #ccc; padding:0 40px 0 15px; height:36px;}
header .SearchBox .SearchButton{ width:36px; height:36px; top:0; right:5px; background-size:16px;}
header .MenuBox{ justify-content: center; align-items: center; padding:0 5px 0 0 ;}
header .MenuBox .Logo{ width:100px; padding:10px 0;}
header .MenuBox nav{ display:none; position:absolute; top:/*64*/50px; left:0; right:0; background-color:#fff;}
header .MenuBox nav.open{ display:unset; }
header .MenuBox .List{ flex-direction: column; padding:0;}
header .MenuBox .List .Item a{ padding:15px; position:relative; display:flex; justify-content: space-between;}
header .MenuBox .List .Item a::after{ content:""; display:block; width:30px; height:30px; background:url(../images/layout/icon-menu-arrow-01.png) no-repeat center; background-size:30px;}
header .MenuBox .List .Item .SubList{ display:none; position:relative; background:none;}
header .MenuBox .List .Item .SubList .DetailItem a{ font-size:15px; padding:5px 15px; color:#000;}
header .MenuBox .List .Item .SubList .DetailItem a::after{ display:none;}
header .MenuBox .List .Item .OptionsList{ position:relative;}
header .MenuBox .List .Item .OptionsList .Head{ display:none;}
header .MenuBox .List .Item .OptionsList .PaginationList{ display:none;}
header .MenuBox .List .Item.Focus .OptionsList .ContentArea{ padding:0 20px 20px 20px; flex-direction: column;}
header .MenuBox .List .Item.Focus{ background-color:#fefcf2;}
header .MenuBox .List .Item.Focus .OptionsList{ display:flex; background:none;}
header .MenuBox .List .Item.Focus a{ color:#e09d15;}
header .MenuBox .List .Item.Focus a::after{ background-image:url(../images/layout/icon-menu-arrow-02.png);}
header .MenuBox .List .Item.Focus .SubList{ display:block; padding:0;}
header .SearchBox.Scroll + .MenuBox::after{ height:80px;}

/* 次選單對齊 */
header .MenuBox .List .Item .DetailItem.Focus .PaginationList{ padding-left:15px; width:100%; display:inline-flex; flex-direction:column; }
header .MenuBox .List .Item .DetailItem.Focus .PaginationList a{ font-size:14px; color:#333; font-weight:400; }

/* 極限高度限制 */
header .SearchBox + .MenuBox nav{ max-height: calc( 100dvh - 55px ); overflow: auto; }
header .SearchBox.Scroll + .MenuBox nav{ max-height: calc( 100dvh - 55px ); overflow: auto; }

header .MenuBox .MobileMenu{ width:42px; height:42px; background:url(../images/layout/icon-hamburger.png) no-repeat center; background-size:24px; display:block; cursor:pointer;}
header .MenuBox .Language{ display:none;}
header .MenuBox::after{ height:80px; background: linear-gradient(to bottom, rgba(254,254,255,1) 70%,rgba(0,0,0,0) 100%);}
header .MenuBox .MobileMenu:hover{ background-color:#eee; border-radius:3px;}

/*Footer*/
footer .FatFooter .Label{ width:25%;}
footer .FatFooter .Community .Group .WindowsTouchArea .RightWindows{ width:300px;}

/*Right*/
.RightBtnx{ position:relative; flex-direction: row; right:auto; bottom:auto; padding:10px 20px;}
.RightBtnx .FunctionSlide{ /*margin-bottom: -40px;*/ width: 100%; display: inline-flex; flex-direction: row; }
.RightBtnx .Function{ flex:1;}
.RightBtnx .rightbtn-swiper-button-next{ display: none !important; }
.RightBtnx .rightbtn-swiper-button-prev{ display: none !important; }
.RightBtnx .TopBtn{ display:none;}
.RightWindows{ width: calc(100vw - 40px); margin:auto;}
.RightWindows .Name,
.RightWindows .Num{ display:block;}
.WindowsTouchArea{ padding-right:0px; left:0;}
.WindowsTouchArea.Contact,
.WindowsTouchArea.Newsletter{ top:100%;}
.RightWindows::before{ top:-11px;}
.RightWindows::after{ top:-10px;}
.RightWindows::before{ border-width: 0 12px 10px 12px; border-color: #ffdc28 transparent; z-index:1;}
.RightWindows::after{ border-width: 0 12px 10px 12px; border-color: #fff transparent; z-index:1;}
.WindowsTouchArea.Contact .RightWindows::before,
.WindowsTouchArea.Contact .RightWindows::after{ bottom:auto; right:50%; transform: translateX(50%);}
.WindowsTouchArea.Newsletter .RightWindows::before,
.WindowsTouchArea.Newsletter .RightWindows::after{ bottom:auto; right:10%;}

.MessageBox{ width:100%; height:100%; max-height:none; top:0; bottom:0; position:fixed; z-index:10;}
}

@media screen and (max-width: 768px){
/*Header*/
header{ background-color:#fff;}
header::before{ content:""; display:block; background:linear-gradient(to right, #edaf11, #ffda27); width:100%; height:5px;}
header .SearchBox{ background:none; position:absolute; top:0; left:100px; right:50px; padding:10px 0; z-index:1;}
header .SearchBox .GufonetLogo{ display:none;}
header .SearchBox .SearchBar input{ border:1px solid #ccc; padding:0 40px 0 15px; height:36px;}
header .SearchBox .SearchButton{ width:36px; height:36px; top:0; right:5px; background-size:16px;}
header .SearchBox.Scroll{ top:10px;}
header .MenuBox{ justify-content: center; align-items: center; padding:0 5px 0 0 ;}
header .MenuBox .Logo{ width:100px; padding:10px 0;}
header .MenuBox nav{ display:none; position:absolute; top:/*64*/50px; left:0; right:0; background-color:#fff;}
header .MenuBox nav.open{ display:unset; }
header .MenuBox .List{ flex-direction: column; padding:0;}
header .MenuBox .List .Item a{ padding:15px; position:relative; display:flex; justify-content: space-between;}
header .MenuBox .List .Item a::after{ content:""; display:block; width:20px; height:20px; background:url(../images/layout/icon-menu-arrow-01.png) no-repeat center; background-size:100%;}
header .MenuBox .List .Item .OptionsList .SubList{ display:none; position:relative; background:none;}
header .MenuBox .List .Item .OptionsList .SubList .DetailItem a{ font-size:15px; padding:5px 15px; color:#000;}
header .MenuBox .List .Item .OptionsList .SubList .DetailItem a::after{ display:none;}
header .MenuBox .List .Item .OptionsList{ position:relative;}
header .MenuBox .List .Item .OptionsList .Head{ display:none;}
header .MenuBox .List .Item .OptionsList .PaginationList{ display:none;}
header .MenuBox .List .Item.Focus{ background-color:#fefcf2;}
header .MenuBox .List .Item.Focus .OptionsList{ display:flex; background:none;}
header .MenuBox .List .Item.Focus .OptionsList .ContentArea{ padding:0 20px 20px 20px; flex-direction: column;}
header .MenuBox .List .Item.Focus a{ color:#e09d15;}
header .MenuBox .List .Item.Focus a::after{ background-image:url(../images/layout/icon-menu-arrow-02.png);}
header .MenuBox .List .Item.Focus .SubList{ display:block; padding:0;}

header .MenuBox .List .Item .DetailItem.Focus .PaginationList{ padding-left:15px; width:100%; display:inline-flex; flex-direction:column; }
header .MenuBox .List .Item .DetailItem.Focus .PaginationList a{ font-size:14px; color:#333; font-weight:400; }

/* 極限高度限制 */
header .SearchBox + .MenuBox nav{ max-height: calc( 100dvh - 55px ); overflow: auto; }
header .SearchBox.Scroll + .MenuBox nav{ max-height: calc( 100dvh - 55px ); overflow: auto; }

header .MenuBox .MobileMenu{ width:42px; height:42px; background:url(../images/layout/icon-hamburger.png) no-repeat center; background-size:24px; display:block; cursor:pointer;}
header .MenuBox .Language{ display:none;}
header .MenuBox::after{ height:80px; background: linear-gradient(to bottom, rgba(254,254,255,1) 70%,rgba(0,0,0,0) 100%);}
header .SearchBox.Scroll + .MenuBox::after{ height:80px;}

/*Footer*/
footer nav{ padding:30px;}
footer .FatFooter{ gap:10px 0px;}
footer .FatFooter .Label{ width:33%;}
footer .FatFooter .Label .LableTitle{ font-size:12px;}
footer .FatFooter .List{ display:none;}
footer .FatFooter .Community{ display:block; text-align:center; width:100%; padding-top:20px; position:relative;}
footer .Copyright .Links a{ font-size:12px;}
footer .Copyright p{ font-size:12px;}
footer .FatFooter .Community .Group{ position:static;}
footer .FatFooter .Community .Group .WindowsTouchArea{ top:auto; left:0; right:0; bottom:70px;}
footer .FatFooter .Community .Group .WindowsTouchArea .RightWindows{ width:auto;}
footer .FatFooter .Community .Group .WindowsTouchArea .RightWindows::before{ top:auto; bottom:-11px; right:50%; border-width: 10px 12px 0px 12px; transform: translateX(88px);}
footer .FatFooter .Community .Group .WindowsTouchArea .RightWindows::after{ top:auto; bottom:-10px; right:50%; border-width: 10px 12px 0px 12px; transform: translateX(88px);}

/*Right*/
.RightBtnx{ position:relative; flex-direction: row; right:auto; bottom:auto; padding:10px 20px;}
.RightBtnx .FunctionSlide{ /*margin-bottom: -40px;*/ width: 100%; display: inline-flex; flex-direction: row; }
.RightBtnx .Function{ flex:1;}
.RightBtnx .TopBtn{ display:none;}
.RightWindows{ width: calc(100vw - 40px); margin:auto;}
.RightWindows .Name,
.RightWindows .Num{ display:block;}
.WindowsTouchArea{ padding-right:0px; left:0;}
.WindowsTouchArea.Contact,
.WindowsTouchArea.Newsletter{ top:100%;}
.RightWindows::before{ top:-11px;}
.RightWindows::after{ top:-10px;}
.RightWindows::before{ border-width: 0 12px 10px 12px; border-color: #ffdc28 transparent; z-index:1;}
.RightWindows::after{ border-width: 0 12px 10px 12px; border-color: #fff transparent; z-index:1;}
.WindowsTouchArea.Contact .RightWindows::before,
.WindowsTouchArea.Contact .RightWindows::after{ bottom:auto; right:50%; transform: translateX(50%);}
.WindowsTouchArea.Newsletter .RightWindows::before,
.WindowsTouchArea.Newsletter .RightWindows::after{ bottom:auto; right:10%;}

.MessageBox{ width:100%; height:100%; max-height:none; top:0; bottom:0; position:fixed; z-index:10;}

/*Cookies*/
.Cookies .ContentArea{ flex-direction: column; gap:10px;}
.Cookies .Enter{ width:100%;}

}