@charset "utf-8";
/*桑尼義式冰淇淋*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&display=swap');

:root{
    --MainColor:#975B51;
    --SubColor:#DBD7CE;
    --SubColor2:#A6978A;
}
body{font-family: 'Noto Sans TC', sans-serif;letter-spacing: 1px;}

/*錨點滾動*/
html { scroll-behavior: smooth; }
::-webkit-scrollbar {width: 4px;}
::-webkit-scrollbar-track { box-shadow: inset 0 0 6px rgba(102, 102, 102, 0.6); }
::-webkit-scrollbar-thumb {background-color: var(--MainColor);border-radius: 50px;}

/*大圖================================*/
/*預設解除背景輪播*/
#content_main { margin:0;}
.bannerindex { position:static; height:auto;}
.swiper-banner { position:static; margin:0; height:auto;} 
.swiper-slide img { height:auto;}

@media screen and (max-width: 768px) {
    .bannerindex { padding:0; margin:0;}
}

/*大圖效果*/
/*.pageIndex .swiper-slide:before { content: "";position: absolute;z-index: 999;pointer-events:none;background-size: contain;background-repeat: no-repeat;}
.pageIndex .swiper-slide:nth-child(2):before {width:100%;background-image: url(https://pic03.eapple.com.tw/sunnygelato/大圖-02_word.png);height: 100%;top: 0;left: 0;}

@media screen and (max-width: 768px) {
    .pageIndex .swiper-slide img { animation-fill-mode: none; -webkit-animation-fill-mode: none;}
}*/

/*header--------------------------------------------*/
.stellarnav ul ul li a { font-size: 14px; }
.header_area {background: transparent;; padding:0;}
.main_header_area {background: linear-gradient(45deg, #ffffff75, #ffffffde);border-bottom:1px solid var(--SubColor2);backdrop-filter: blur(10px);padding: 10px;}
.main_header_area .container { max-width: 100%;width: 90%;}
.tp_links a{display: none;}
.pageIndex .header_area {position: absolute;width: 100%;z-index: 10000;top: 20px;transition: ease-out 0.5s;box-shadow: none;}
.pageIndex .header_area .main_header_area {box-shadow: none;background: #ffffffbd;width: 90%;max-width: 1400px;
    margin: 0 auto;border-radius: 60px;transition: ease-out 0.5s;backdrop-filter: blur(10px);border: 1px solid var(--SubColor);padding: 10px;}
.pageIndex .header_area.sticky {transition: ease-out 0.5s;position: fixed;top: 0;background: transparent;}
.pageIndex .header_area.sticky .main_header_area {background: linear-gradient(45deg, #ffffff75, #ffffffde);width: 100%;max-width: 100%;
    border-radius: 0;transition: ease-out 0.5s;backdrop-filter: blur(10px);border:unset;border-bottom:1px solid var(--SubColor2);}

/*RWD*/
@media screen and (max-width: 1024px) {
    .header_area{position: sticky;background: #Fff;}
    .pageIndex .header_area .main_header_area {width: 100%;border: unset;border-radius: 0px;}
    .pageIndex .header_area{top: 0px;position: sticky;}
    .pageIndex .header_area.sticky .main_header_area{border-bottom:unset;}
}
@media screen and (max-width: 768px) {
    .header_area{backdrop-filter:unset;background:#fff;}
    .header_area.sticky{backdrop-filter:unset;background:#fff;}
    .pageIndex .header_area.sticky .main_header_area{backdrop-filter: unset;background:#fff;}
    .pageIndex .header_area .main_header_area{backdrop-filter: unset;background:#fff;box-shadow: 0 -2px 15px 0 rgba(0, 0, 0, 0.2);}
    .main_header_area{backdrop-filter: unset;background:#fff;box-shadow: 0 -2px 15px 0 rgba(0, 0, 0, 0.2);border-bottom: none;padding: 10px;}
}

/*選單*/
.tp_links a{display: none;}
.me_tp_features a{color: #222;margin: 0 0px;}
.stellarnav li.has-sub > a:after{content: '+';border-left:0px;border-right:0px;border-top:0px;}
.stellarnav > ul > li > a{height: 60px;color:#222;}
.stellarnav > ul > li.has-sub > a {padding-right: 15px;}
.stellarnav li.has-sub > a:after {display: none;}
.stellarnav > ul > li:hover > a {color: var(--MainColor);transition: 0.3s;}
.stellarnav > ul > li:hover:before {transform: translate(-50%, -50%) scale(1, 1);opacity: 1;}

/*RWD*/
@media screen and (max-width: 1024px) {
    .stellarnav > ul > li > a{height: 30px;}
}
@media screen and (max-width: 570px) {
    .me_tp_features{display: none;}
}

/*LOGO--------------------------------------------*/
.nav-brand{top: 3px;position: relative;}

/*浮動按鈕===========================================*/
.info_fix{z-index: 999999;bottom: 125px;}
.linksBtn{background-color: var(--MainColor);}
.info_fix:hover>.linksBtn{background: var(--SubColor2);}

/*第二層*/
.info_fix_links a{background: var(--MainColor);}
.info_fix_links a:hover{background: var(--SubColor2);}
a.info_fix_default.info_fix_phone{display: none;}
a.info_fix_default.info_fix_mail{display: none;}

/*TO TOP*/
#to_top{bottom: 80px;right:25px;background: var(--MainColor);box-shadow: unset;color: #ffffff;left:unset;width: 40px;height: 40px;font-size: 10px;}
#to_top i:before, #to_top i:after{background: #ffffff;height: 10px;top: 3px;}
#to_top i.top{height: 10px;}
#to_top i.top:before, #to_top i.top:after {height: 10px;}

/*FOOTER------------------------------------------*/
.footer{background: #fff;border-top: 1px solid var(--SubColor2);}
.footer_logo{display: block;max-width: 100%;margin: 0;}
.footer_menu {width: 100%;display: grid;grid-template-columns: 1fr 1fr;grid-gap: 5px; }
.footer .center{max-width: 80%;width: 100%;}
.footer_info ul {display: flex;width: 100%;margin-left: 0;flex-direction: row;justify-content: space-around;align-items: center;}
.footer_info{grid-template-columns: 200px 1fr;padding-right: 0;align-items: center;}
.footer_menu a{background: transparent;color: #222;font-size: 15px;padding: 10px;margin:0;text-align: center;border-radius: 10px;border: 1px solid var(--SubColor2);}
.footer_menu a:nth-child(1){display: none;}
.footer_info li p {color: #222;font-size: 15px;}
.footer_info li p  a{color: #222;}
.copy{padding: 15px 0;border-top: none;color: #ffffff;letter-spacing: 1px;background:var(--SubColor2);}
.copy a {color: #ffffff;}
.box_link{display: none;}
.footer_menu a:hover{background: var(--SubColor2);transition: 0.3s;}
.footer_info li p.add2:before{content: '營業時間：';}

/*RWD*/
@media screen and (max-width: 1200px) {
    .footer_info {grid-template-columns: 1fr;padding: 0;}
    .footer_info ul{justify-content: space-between;}
    .footer_logo{display: none;}
}
@media screen and (max-width: 768px) {
    #to_top { bottom:80px;}
    .bannerindex { padding:0; margin:0;}
    .footer_info ul{flex-direction: column;}
    .footer_logo{display: none;}
    .footer_menu{grid-template-columns: 1fr 1fr 1fr 1fr;}
    .footer{padding: 30px 0 55px;}
}
@media screen and (max-width: 600px) {
    .footer_menu{grid-template-columns: 1fr 1fr 1fr;}
}
@media screen and (max-width: 425px) {
    .footer_menu{grid-template-columns: 1fr 1fr;}
}

/*手機版選單--------------------------------------*/
.stellarnav .menu-toggle {padding: 12px 10px;margin: 25px 0;border-radius: 50px;background: var(--SubColor2);}
.stellarnav .menu-toggle span.bars { top: 3px; }
.stellarnav .menu-toggle span.bars span {margin: 0 auto 5px;background: #fff;height:1px;}
.stellarnav .menu-toggle:after {font-size: 13px;letter-spacing: 1px;color: #fff;}
.stellarnav.mobile.left .close-menu { background: unset;border-bottom: 1px #ddd solid;}
.stellarnav .icon-close { margin-right: 5px; }
.stellarnav.mobile>ul>li>a { padding: 15px; }
.stellarnav.mobile>ul>li>a.dd-toggle { padding: 20px 15px; }

/*RWD*/
@media screen and (max-width: 570px) {
    .stellarnav .menu-toggle{margin: 10px 0;}
}

/*第二層*/
.stellarnav a.dd-toggle .icon-plus:after{border-bottom: solid 1px #777;}
.stellarnav a.dd-toggle .icon-plus:before{border-bottom: solid 1px #777;}
.stellarnav.mobile>ul>li>a.dd-toggle{padding: 12px 15px;}
