@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&family=League+Spartan:wght@400;500;600;700;800&family=Noto+Sans+TC:wght@300;400;500;700;900&display=swap');

body{ 
    font-size:14px; 
    font-family: 'Noto Sans TC',Microsoft JhengHei,Arial, Helvetica,sans-serif,nsimsun; 
    font-weight: 500;
    color:#434343; 
    position:relative;
    background-color: #faf7f3;
    letter-spacing: 1.2px;

    /*overflow-y: hidden; */

    width: 100%;
    overflow-x: hidden;
    animation-name: fade-in;
    animation-duration:1s;
    animation-timing-function:ease-in;
}
@keyframes fade-in{
    0%{
        opacity:0;
    }
    100%{
        opacity: 1;
    }
}

body.active{
    overflow: hidden;
}

a{ color:#333;transition: .3s}
a:hover{ color:#ae882c;}
* { 
 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
}
  
/*   html{
    overflow-y: hidden; 
    position:static;
} */


::selection {
    background: #efc252;
    color: #fff;
}
::-moz-selection {
    background: #efc252;
    color: #fff;
}


/****** scrollbar ******/
 ::-webkit-scrollbar {
    width: 8px;
    background-color: #E2E2E2;
}

::-webkit-scrollbar-track {
    box-shadow: inset 0 0 8px #E2E2E2;
    background-color: #E2E2E2;
}

::-webkit-scrollbar-thumb {
    background-color: #b1b1b1;
    border-radius: 5px;
}


input,select,
input::placeholder,
select::placeholder {
  font-family: 'Noto Sans TC'
}

/*==============================================*/

/*共用*/

.all_title01{
    font-size: 28px;
    font-weight: 500;
    letter-spacing: 1.5px;
}

.all_title02{
    font-size: 28px;
    font-weight: 600;
}

.all_title03{
    font-size: 18px;
    font-weight: 500;
}

.all_title04{
    font-size: 22px;
    color: #996c33;
    font-weight: 700;
}




/*-------*/


.all_introduce_01{
    font-weight: 500;
    font-size: 16px;
    line-height: 36px;
    color: #434343;
    letter-spacing: 1.5px;
}

/*-------*/


.all_btn01{
    font-size: 18px;
    color: #fff;
    background-color: #7f704e;
    padding: 10px 10px;
    position: relative;
    text-align: center;
    display: block;
    transition: .3s;
    width: 320px;
    max-width: 100%;
    letter-spacing: 1.5px;

    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.all_btn01:after{
    content: "";
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border: 1px #b0a17e solid;
    transition: .3s;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.all_btn01:hover{
    background-color: #948665;
    color: #fff;
}

.all_btn01:hover:after{
    width: calc(100% - 2px);
    height: calc(100% - 2px);
}


.all_btn01.style2{
    background-color: #8d8172;
}
.all_btn01.style2:after{
    display: none;
}


.all_btn02{
    font-size: 18px;
    color: #fff;
    background-color: #ef822a;
    padding: 10px 10px;
    position: relative;
    text-align: center;
    display: block;
    transition: .3s;
    width: 210px;

    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;

    max-width: 100%;
    letter-spacing: 1.5px;
}

.all_btn02:after{
    content: "";
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border: 1px #eeb98e solid;
    transition: .3s;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.all_btn02:hover{
    background-color: #f98527;
    color: #fff;
}

.all_btn02:hover:after{
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    border: 1px #a685bf00 solid;
}




.all_btn03 {
    font-size: 18px;
    color: #fff;
    background-color: #c79f65;
    padding: 10px 10px;
    position: relative;
    text-align: center;
    display: block;
    transition: .3s;
    width: 210px;
    max-width: 100%;
    letter-spacing: 1.5px;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.all_btn03:after{
    content: "";
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border: 1px #fff solid;
    transition: .3s;
    opacity: .3;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.all_btn03:hover{
    background-color: #8a7454;
    color: #fff;
}

.all_btn03:hover:after{
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    border: 1px #a685bf00 solid;
}

/*-------*/

.all_titlebox_01 {
    display: flex;
    gap: 0 15px;
    align-items: center;
}

.all_titlebox_01.center{
    justify-content: center;
}

.all_titlebox_01 h2{
    font-size: 28px;
    color: #434343;
    font-weight: 500;
    letter-spacing: 1.2px;
}

/*-------*/

.all_titlebox_02{
    font-size: 20px;
    padding: 15px 25px;
    background-color: #fff;
    box-shadow: 0px 5px 10px #0002;
    letter-spacing: 1.2px;
    margin: 0px 0 15px 0;
}


.all_text_box{
    padding: 20px 25px;
}

.all_text_box .all_title04{
    margin-bottom: 20px;
}


/*------------*/


.input_box01{
    font-size: 15px;
    padding: 12px 15px;
    border: 1px #cdcdcd solid;
    width: 100%;
    outline:none;
    background-color: #fffef900;
}

.input_box01:focus{
    border: 1px #996c33 solid;
}

.input_box01:disabled{
    background-color: #eeedef;
}

.select_box01{
    font-size: 15px;
    padding: 12px 15px;
    border: 1px #cdcdcd solid;
    width: 100%;
    outline:none;
    background-color: #fffef900;

    appearance:none;
    -moz-appearance:none;
    -webkit-appearance:none;

    /*改變右邊箭頭樣式*/
    background: url("../img/cheveron-down.svg") no-repeat calc(100% - 10px) center transparent;
    background-size: 23px;

    line-height: 20px;
}

.select_box01:focus{
    border: 1px #996c33 solid;
}



.input_box02{
    font-size: 14px;
    padding: 12px 15px;
    border: 1px #e2dfd3 solid;
    width: 100%;
    background-color: #fffef9;
    border-radius: 3px;
    outline:none;
}

.input_box02:focus{
    border: 1px #996c33 solid;
}



/*-------*/

.center{
    text-align: center;
}


/*=================*/

.all_box{
    padding: 80px 0 100px 0;
}

.all_box_02{
    position: relative;
    z-index: 1;
}

.all_width{
    width: 1320px;
    margin: 0 auto;
    max-width: 92%;
    position: relative;
}

.all_flex{
    display: flex;
    gap: 20px 20px;
}

.all_flex_01{
    display: flex;
    gap: 20px 20px;
}

.all_flex_02{
    display: flex;
    gap: 20px 20px;
}

.limit_1line{
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    height: auto;
}

.limit_2line{
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    height: auto;
}

.limit_3line{
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    height: auto;
}


.title_box_01{
    
}

.title_box_01 p{
    margin-top: 20px;
}

/*----------------*/

.all_top_box {
    display: flex;
    justify-content: space-between;
    gap: 0 20px;
    margin-bottom: 20px;
    overflow: hidden;
}

.list_tab{
    padding: 10px 0 20px 0;
}

.list_tab ul {
    display: flex;
    gap: 15px 20px;
    flex-wrap: wrap;
}

.list_tab ul li .all_btn01{
    width: 160px;
    transition: .3s;
    background-color: #c3b79c;
}

.list_tab ul li .all_btn01.active{
    background-color: #7f704e;
}

.list_tab ul li .all_btn01:hover{
    background-color: #7f704e;
}


.list_tab ul li .all_btn01:after {
    border: 1px #b0a17e00 solid;
}

.list_tab ul li .all_btn01.active:after {
    border: 1px #b0a17e solid;
}


/*---------------*/

.left_list{
    width: 280px;
    position: relative;
    z-index: 1;
}

.left_list .all_titlebox_01{
    margin-bottom: 30px;
}

.list_menu{
    padding-top: 10px;

}

.rwd_list{
    display: none;
}


.list_menu ul {
/*    border-left: 1px #cbc5bf solid;*/
    display: block;
    background-color: #fff;
    padding:20px 0;
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;

/*    display: flex;*/
    /*gap: 15px 0;
    flex-direction: column;*/
/*    padding: 5px 0;*/
}

.list_menu ul.active{
    display: block;
}

.list_menu ul li{
    padding: 8px 0;
}

.list_menu ul li a{
    font-size: 18px;
    color: #343434;
    padding: 0 22px;
    letter-spacing: 1.2px;
    font-weight: 500;
}

.list_menu ul li a:hover{
    color: #996c33;
}

.list_menu ul li a.active{
    color: #996c33;
    font-weight: 700;
}

/*------------------------*/

.right_info{
    width:calc(100% - 300px) ;
    position: relative;
    z-index: 1;
}


.web_cate {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    font-size: 16px;
    font-weight: 500;
    padding: 10px 0 10px 0;
}

.web_cate span{
    margin: 0 10px;
    font-weight: 700;
}


.web_cate p{
    color: #996c33;
}





/*==============================================*/

.menu_close_bg{
    display: none;
}

.menu{
    box-shadow: 0 0 12px #0001;
    padding: 0px 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 150;
    background-color: #efece2;
    transition: .3s;

}

.menu_top{
    background-color: #948665;
    padding: 8px 0;
}

.menu_top>div{
    display: flex;
    justify-content: flex-end;
}

.menu_top ul{
    display: flex;
    gap: 0 25px;
}

.menu_top ul li a{
    color: #ffff;
    transition: .3s;
    font-weight: 600;
}

.menu_top ul li a:hover{
    color: #e2dabe;
}

/*-----*/

.menu_box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 100;
    padding: 5px 0;
}

.menu_logo{
    width: 100px;
}

.menu_logo img{
    width: 100%;
}


.menu_right{
    display: flex;
    align-items: center;
    gap: 20px;
}


.menu_list>ul{
    display: flex;
}

.other_menu{
    display: none;
}

.menu_list>ul>li{
    position: relative;
}

.menu_list>ul>li>a{
    display: flex;
    font-size: 16px;
    padding: 30px 20px;
    position: relative;
    flex-direction: column;
    align-items: center;
    font-weight: 400;
}

.menu_list>ul>li>a span{
    font-size: 12px;
    color: #eb9f65;
    font-weight: 600;
}

.menu_list>ul>li>a div{
    position: relative;
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 1px;
/*    font-weight: 600;*/
}

.menu_list>ul>li>a div i{
    font-size: 20px;
    color: #aaa;
    /*position: absolute;
    right: -23px;
    top: 50%;
    transform: translateY(-50%);*/
}

.menu_list>ul>li>a:hover div i{
    color: #797263;
}





.menu_ul_hover:hover .menu_02{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}


.menu_02{
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    position: absolute;
    width: 150px;
    background-color: #fff;
    box-shadow: 0 0 5px #0002;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99;
    border-radius: 15px;
    transition: .2s;
    overflow: hidden;
    top: calc(100% - 10px);

}

.menu_ul_02{
    margin: 0 auto;
    display: flex;
    max-width: 100%;
    flex-direction: column;
    padding: 0px 0px;
    text-align: center;
}

.menu_ul_02.center li a {
    justify-content: center;
}



.menu_ul_02 li{
    width: 100%;
    position: relative;
    background-color: #fff;
    transition: .3s;
}

.menu_ul_02 li:hover{
    background-color: #eee;
}


.menu_ul_02 li a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 15px;
    gap: 0 20px;
    font-size: 16px;
}


/*-----------*/

.menu_icon{

}

.menu_icon ul{
    display: flex;
    gap: 15px;
}

.menu_icon ul li a{
    background-color: #948665;
    width: 35px;
    height: 35px;
    border-radius: 15px;
    color: #fff;
    display: flex;
    font-size: 16px;
    justify-content: center;
    align-items: center;
    position: relative;
}

.menu_icon ul li a:hover{
    background-color: #706446;
}

.menu_icon ul li a span {
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #ef822a;
    color: #fff;
    display: flex;
    font-size: 12px;
    align-items: flex-start;
    font-weight: 800;
    justify-content: center;
    right: -8px;
    top: -8px;
    line-height: 20px;
    letter-spacing: 0;
}



/*------------------------------------------*/
/*Footer*/

.footer{
    position: relative;
    margin-top: 100px;
}

.footer .bg{
    width: 100%;
    position: absolute;
    bottom: 100%;
    left: 0;
    z-index: -1;
}

.footer_box{
    padding: 5rem 0;
    background-color: #413a2b;
}

.footer_box>div {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer_box .info{

}

.footer_box .info img{
    margin-bottom: 40px;
}

.footer_box .info p{
    font-size: 16px;
    line-height: 36px;
    font-weight: 400;
    color: #fff;
    letter-spacing: 1.5px;
}

.footer_box .info p a{
    color: #fff;
}

.footer_box .info p a:hover{
    color: #beb9b6;
}



.footer_right{
    text-align: right;
}

.footer_menu{
    display: flex;
    margin-bottom: 40px;
    color: #fff;
    font-size: 16px;
    letter-spacing: 1.5px;
    gap: 15px 5px ;
}

.footer_menu a{
    color: #fff;

}

.footer_menu a:hover{
    color: #beb9b6;
}



.footer_copyright{
    padding: 15px 0;
    background-color: #342f25;
}

.footer_copyright>div {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer_copyright p{
    color: #fffb;
    font-size: 15px;
    letter-spacing: 1.5px;
    line-height: 28px;
}

.footer_copyright ul{
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0 12px;
}

.footer_copyright ul li a{
    color: #beb9b6;
    font-size: 20px;
    transition: .3s;
    padding: 5px;
}

.footer_copyright ul li a:hover{
    color: #fff;
}





/*------------------------------------------*/

/*-------------*/
/*頁碼*/
.page_box {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 0;
}

.page_box li{
    margin: 0 3px;
}


.page_box li a{
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    width: 45px;
    height: 45px;
    transition: .3s;
}


.page_box li.active a,
.page_box li.active:hover a{
    background-color: #f19149;
    color: #fff;
}

.page_box li:hover a{
    background-color: #faf0e9;
}

/*-------------*/


.top_padding{
    padding-top: 138px;
}

.center{
    text-align: center;
}

.btn_center {
    display: flex;
    justify-content: center;
}

.btn_right {
    display: flex;
    justify-content: flex-end;
}


/*---------*/


.i_box1{
    position: relative;
}

.i_banner_m{
    display: none!important;
}

.i_b1_bg{
    position: absolute;
    bottom: -1px;
    width: 100%;
    z-index: 100;
}

/*---------*/

.i_box2{
    padding: 5rem 0;
    position: relative;
    overflow: hidden;
}

.i_box2 .bg{
    position: absolute;
    right: -5rem;
    top: 50%;
    transform: translateY(-50%);
    max-width: 30%;
    z-index: -1;
}

.i_b2_01 {
    display: flex;
    margin-top: 3rem;
    align-items: center;
}

.i_b2_01 .img{
    width: 50%;
    position: relative;
}

.i_b2_01 .img img{
    width: 100%;
    border-bottom-right-radius: 50px;
}

.i_b2_01 .img .text{
    position: absolute;
    top: -2rem;
    left: 4rem;
    background-color: #fff;
    box-shadow: 5px 5px 10px #0004;
    font-size: 18px;
    line-height: 32px;
    width: 60px;
    text-align: center;
    padding: 20px 20px;
    font-weight: 500;
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
}

.i_b2_01 .img .text span {
    height: 30px;
    display: block;
}

.i_b2_01 .info{
    width: 50%;
    padding: 2rem calc(50% - 660px) 2rem 5rem;
}

.i_b2_01 .info h2{
    margin-bottom: 35px;
}

.i_b2_01 .info p{
    margin-bottom: 30px;
}


/*---*/


.i_box3{
    padding: 6rem 0;
    position: relative;
    background-color: #e4dfd6;
}


.i_box3 .bg_top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 150px;
    background-image: linear-gradient(to top, #e4dfd6 0%, #faf7f3 100%);
}


.i_box3 .bg {
    position: absolute;
    left: 4rem;
    bottom: -2rem;
}

.i_box3 .all_titlebox_01{
    position: relative;
    z-index: 1;
}

.i_b3_01 {
    display: flex;
    margin: 4rem auto;
    align-items: flex-start;
    gap: 2rem 4rem;
    overflow: hidden;
    flex-direction: row-reverse;
}

.i_b3_01 .img{
    position: relative;
    width: calc(45% - 2rem);
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
    overflow: hidden;
}

.i_b3_01 .img:after{
    width: 100px;
    height: 100px;
    background-color: #cfc4af;
    position: absolute;
    content: "";
    left: -10px;
    top: -10px;
    z-index: 0;
}

.i_b3_01 .img:before{
    width: 100px;
    height: 100px;
    background-color: #cfc4af;
    position: absolute;
    content: "";
    right: -10px;
    bottom: -10px;
    z-index: 0;

}

.i_b3_01 .img img{
    width: 100%;
    position: relative;
    z-index: 1;
}

.i_b3_01 .list{
    width: calc(55% - 2rem);
}


.news_list {
    display: flex;
    gap: 1rem 0;
    flex-direction: column;
    position: relative;
    z-index: 1;
}

.news_list.in_page{
    gap: 1.5rem 0;
    margin: 30px 0;
}

.news_list a {
    display: flex;
    gap: 2rem;
    align-items: center;
    background-color: #ffffffba;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding: 5px 5px;
    transition: .3s;
}

.news_list a:hover{
    background-color: #ffffff;
    box-shadow: #917b442e 3px 3px 10px ;
}

.news_list .date {
    padding: 10px;
    text-align: center;
    display: flex;
/*    background-color: #fff;*/
/*    box-shadow: #917b442e 3px 3px 10px ;*/
    flex-direction: column;
    gap: 3px 0;
    
}

.news_list .date p{
    font-size: 14px;
    letter-spacing: 0px;
}

.news_list .date h3{
    font-size: 38px;
    line-height: 38px;
}


.news_list .info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 18px;
    font-weight: 500;
    width: calc(100% - 73px - 2rem);
}

.news_list .info h3{
    color: #ef822a;
}

/*-------------*/

.i_box4{
    padding: 5rem 0;
    position: relative;
    overflow: hidden;
}

.i_box4 .bg{
    position: absolute;
    right: 8rem;
    top: 4rem;
    max-width: 30%;
    z-index: -1;
}


.service_list{
    display: flex;
    margin: 5rem auto;
    gap: 10px 48px;
    flex-wrap: wrap;
}

.service_list li{
    width: calc(50% - 24px);
    position: relative;

}

.service_list li:nth-child(even){
    margin-top: 2rem;
}

.service_list li a{
    position: relative;
    display: flex;
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
    overflow: hidden;
}

.service_list li a:after{
    position: absolute;
    width: calc(100% - 24px);
    height: calc(100% - 24px);
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border:#e3bc83 1px solid ;
    content: "";
    z-index: 1;
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
}

.service_list li a h2 {
    /* width: 60px; */
    width: 300px;
    max-width: 100%;
    line-height: 40px;
    padding: 10px 10px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    z-index: 2;
    font-size: 32px;
    text-align: center;
    background-color: #996c3300;
    transition: .3s;
}

.service_list li a .bg_box{
    width: 100%;
    height: 100%;
    background-color: #302c2999;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    transition: .8s;
}

.service_list li img{
    width: 100%;
}


.service_list li a:hover{

}

.service_list li a:hover h2{
    background-color: #5c432f;
}

.service_list li a:hover .bg_box{
    background-color: #302c2933;
}


/*==========================*/



.all_top_banner {
    width: 100%;
    height: 400px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
    align-items: center;
    color: #FFF;
    position: relative;
}

.all_top_banner.right{
    background-position: 70% center;
}


.all_top_banner h2{
    -webkit-writing-mode: vertical-lr;
    writing-mode: vertical-lr ;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-size: 32px;
    font-weight: 500;
    letter-spacing: 14px;
    text-shadow: 0 0 5px #5d5d5d82;
    height: 100%;
    text-align: center;

}

.all_top_banner .bn_bg{
    position: absolute;
    bottom: -1px;
    width: 100%;
    z-index: 1;
    pointer-events: none;
}

/*------------------*/


.about_video{
    position: relative;
    margin: 60px 0;
    cursor: pointer;
}

.about_video:hover:after{
    background-color: #0004;
}

.about_video:after{
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background-color: #0000;
    top: 0;
    left: 0;
    transition: .3s;
}

.about_video .icon{
    position: absolute;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: #fff;
    box-shadow: 0 0 15px #0006;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 2;
    transition: .5s;
}

.about_video .icon:after{
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 0 15px 25px;
    border-color: transparent transparent transparent #996c33;
    top: 50%;
    left: calc(50% + 2px);
    transform: translate(-50%,-50%);
    transition: .5s;
}

.about_video:hover .icon{
    background-color: #996c33;
}

.about_video:hover .icon:after{
    border-color: transparent transparent transparent #fff;
}

.about_video img{
    width: 100%;
}


/*-------------------*/

/*歷史沿革*/
.history_box {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.history_box li {
    display: flex;
    border-bottom: 1px #e3dbd0 solid;
    gap: 20px 50px;
    padding: 20px 0;
    align-items: flex-start;
}

.history_box li h3 {
    font-size: 40px;
    display: flex;
    align-items: flex-end;
    gap: 0 8px;
    width: 100px;
    line-height: 40px;
}

.history_box li h3 span{
    font-size: 18px;
    line-height: 18px;
}

.history_box li p{
    font-size: 16px;
    width: calc(100% - 150px);
}

/*-------------------*/
/*點燈介紹*/
.lamp_box {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 50px;
}

.lamp_box li {
    display: flex;
    border-bottom: 1px #e3dbd0 solid;
    gap: 20px 20px;
    padding: 20px 0;
    align-items: flex-start;
}

.lamp_box li .name {
    width: 180px;
    line-height: 58px;
    display: flex;
    align-items: center;
    gap: 10px 15px;
}

.lamp_box li .name h3 {
    font-size: 32px;
    line-height: 32px;
}



.lamp_box li p{
    font-size: 16px;
    width: calc(100% - 200px);
}


/*-------------------*/

.all_inpage_bg {
    position: absolute;
    left: -17%;
    top: 10%;
    opacity: .6;
    max-width: 60%;
}




/*影片彈出視窗*/
.video_pop {
    position: fixed;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    z-index: 9999999;
    visibility: hidden;
    pointer-events: none;
}

.video_pop.active {
    visibility: visible;
    pointer-events: auto;
}



.video_pop_info {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 700px;
    max-width: 95%;
    height: 400px;
    z-index: 10;
/*    transition: .5s;*/
}



.video_pop_info iframe {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: 0 0 8px rgb(0 0 0 / 60%);
}


.video_pop_bg.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.video_pop_bg {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.6);
    z-index: 5;
    transition: .2s;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

/*----------------------*/



/*產品list*/

.pro_ul{
    padding: 3rem 0;
    display: flex;
    gap: 40px 12px;
    flex-wrap: wrap;
}

.pro_ul li{
    width: calc(25% - 9px);
}

.pro_ul li a{
    display: block;
    text-align: center;
}

.pro_ul li .img{
    width: 100%;
    overflow: hidden;
    margin-bottom: 10px;
    transition: .3s;
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
}

.pro_ul li .img:hover img{
    transform: scale(1.1);
}

.pro_ul li .img img{
    width: 100%;
    transition: .8s;
}

.pro_ul li h3{
    margin-bottom: 10px;
    font-weight: 500;
    font-size: 18px;
    letter-spacing: 1.2px;

}

.pro_ul li h4{
    font-size: 16px;
    color: #ef822a;
    font-weight: 700;
    letter-spacing: 1.2px;
}





.pro_search{
    display: flex;
    justify-content: flex-end;
    gap: 0 10px;
}

.pro_search .input_box01{
    width: 280px;
    background-color: #fff;
}

.pro_search a {
    width: 60px;
    display: flex;
    padding: 10px 0;
    background-color: #ef822a;
    text-align: center;
    color: #fff;
    align-items: center;
    justify-content: center;
}








/*--------------*/

.pro_d_box {
    margin: 20px 0;
    display: flex;
    gap: 30px 30px;
    flex-wrap: wrap;
}



.pro_d_img{
    width: calc(45% - 15px);
}

.pro_d_img img{
    width: 100%;
}

.pdi_img {
    margin-bottom: 20px;
}





.pro_d_title{
    width: calc(55% - 15px);
}

.pro_d_title .title{
    font-size: 22px;
    font-weight: 700;
    padding-bottom: 15px;
    border-bottom: 1px #ddd solid;
    margin-bottom: 30px;
}

.pro_d_title .brief{
    font-size: 15px;
    line-height: 28px;
    margin-bottom: 30px;
}

.pro_d_title .price {
    display: flex;
    gap: 0 10px;
    align-items: center;
    margin-bottom:10px;
}

.pro_d_title .price p{

}

.pro_d_title .price h2{
    font-size: 24px;
    font-weight: 700;
    color: #ef822a;
}

.pro_d_title .num {
    display: flex;
    gap: 10px 0;
    flex-direction: column;
    margin-bottom:20px ;
}

.pro_d_title .btn {
    display: flex;
    gap: 10px 20px;

}

.pro_d_title .btn a{
    width: calc(50% - 10px);
}


.pro_d_info{
    width: 100%;
    margin-top: 30px;
}

.pro_d_info .info{
    padding-top: 20px;
}

.pro_d_info .info img{
    max-width: 100%;
    height: auto!important;
}






/*page*/

.page_box {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 0;
}

.page_box li{
    margin: 0 3px;
}


.page_box li a{
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    transition: .3s;
}


.page_box li.active a,
.page_box li.active:hover a{
    background-color: #948665;
    color: #fff;
}

.page_box li:hover a{
    background-color: #d8d2dd;
}


/*----------------------*/
/*廣告小卡*/
.ad_card_box {
    position: relative;
    background-image: linear-gradient(to right, #ebd9af 0%, #ded2b2 100%);
    width: 100%;
    border-radius: 15px;
    box-shadow: 0px 5px 10px #0002;
    display: flex;
    gap: 0 20px;
    
    margin: 20px auto 100px auto;
}

.ad_card_box .img {
    width: 25%;
    position: relative;
    padding: 3rem 0rem 3rem 3rem;
    z-index: 1;
}

.ad_card_box .img img {
    position: absolute;
    left: 50%;
    width: 80%;
    transform: translateX(-50%);
    top: 20px;
}


.ad_card_box .info {
    width: calc(75% - 20px);
    display: flex;
    gap: 10px;
    flex-direction: column;
    align-items: flex-start;
    padding: 3rem 3rem 3rem 0;
    position: relative;
    z-index: 1;
}

.ad_card_box .info h2{
    font-size: 24px;
    color: #996c33;
    font-weight: 700;
}

.ad_card_box .info p{
    font-size: 20px;
    color: #54493c;
    font-weight: 600;
    margin-bottom: 20px;
}

.ad_card_box .bg{
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;

}

.ad_card_box .bg01 {
    position: absolute;
    left: -2%;
    top: 0;
}

.ad_card_box .bg02 {
    position: absolute;
    right: -2%;
    top: -9%;
}

/*----------------------*/
/*各殿導覽*/
.guide_list{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 50px;
}

.guide_list li{
    display: flex;
    border-bottom: 1px #e3dbd0 solid;
    gap: 20px 60px;
    padding: 3rem 0;
    align-items: flex-start;
    justify-content: space-between;
}

.guide_list li .img{
    width: 330px;
    position: relative;
}

.guide_list li .img img{
    width: 100%;
    border-radius: 50%;
}

.guide_list li .img .name{
    position: absolute;
    padding: 12px 20px;
    border-radius: 30px;
    background-color: #ef822a;
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    text-align: center;
    width: 100%;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    overflow: hidden;
}

.guide_list li .img .name:after{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-image: url(../img/guide_btn_bg.png);
    background-size: cover;
    background-position: center;
}

.guide_list li .img .name h2{
    position: relative;
    z-index: 1;
}

.guide_list li .info {
    padding-top: 2rem;
    width: calc(100% - 390px);
}

.guide_list li .info h2{
    margin-bottom: 20px;
}

/*=====================*/
/*常見問題*/
.faq_box_ul{
    margin: 10px 0 0px 0;
}

.faq_box_ul li{
    border-bottom: 1px #e3dbd0  solid;
    padding: 0px 10px 0px 10px;
    transition: .3s;
    cursor: pointer;
}

.faq_box_ul li h2{
    font-size: 17px;
    display: flex;
    gap: 10px;
    color: #333;
    padding: 20px 40px 20px 0;
    position: relative;
    width: 100%;
    font-weight: 700;
}


.faq_box_ul li i{
    display: inline-block;
    position: absolute;
    top: 20px;
    right: 0;
    vertical-align: top;
    color: #996c33;
    font-size: 20px;
    transition: .5s;
}

.faq_box_ul li.active{
    padding: 0px 10px 20px 10px;
}

.faq_box_ul li.active i{
    transform:rotate(180deg);
}

.faq_info{
    padding: 0px 0 0px 0;
    display: none;
}

.faq_info p{
    font-size: 15px;
    line-height: 1.8;
}





/*----------------------------------------------------------*/

/*會員登入*/


.login_box{
    width: 550px;
    max-width: 100%;
    margin: 50px auto 50px auto;
    padding: 50px 50px 50px 50px;
    background-color: #fffef9;
    box-shadow: 0 0 15px #0000001f;    
}



.login_box .info{
    margin: 20px 0;
}



.login_box .input_box01{
    margin: 10px 0;
}



.login_box_a{
    text-align: center;
    display: block;
    font-size: 14px;
    margin: 0px 0 30px 0;
    transition: .3s;
}


.login_box p{
    text-align: center;
    display: block;
    font-size: 14px;
    padding: 5px 0;
    margin: 0px 0 0 0;
}

.login_box p a{
    border-bottom: 1px #aaa solid;
    padding: 3px 0;
    margin-left: 8px;
    transition: .3s;
}

.login_box p a:hover{
    color: #ef822a;
    border-bottom: 1px #ef822a solid;
}

.login_code .input_box01{
    width: calc(100% - 150px);
    display: inline-block;
    vertical-align: middle;
}

.login_code .login_code_div{
    width: 142px;
    display: inline-block;
    vertical-align: middle;
}


.login_box .all_btn01{
    width: 100%;
    margin-bottom: 20px;
}

/*------------------------*/



.join_box{
    width: 900px;
    max-width: 100%;
    margin: 50px auto 150px auto;
    padding: 50px 50px 50px 50px;
    background-color: #fffef9;
    box-shadow: 0 0 15px #0000001f;    
}



.join_box .info {
    margin: 40px 0 20px 0;
    display: flex;
    gap: 20px 20px;
    flex-wrap: wrap;
}


.join_input_01{
    width: calc(50% - 10px);
}

.join_input_02{
    width: calc(100% - 10px);
}

.join_input_02 textarea{
    height: 150px;
}


.join_gender{
    display: flex;
    gap: 10px;
}

.join_gender input{
    display: none;
}

.join_gender li{
    width: calc(50% - 5px);
}


.join_gender label{
    display: inline-block;
    text-align: center;
    font-size: 15px;
    padding: 12px 15px;
    border: 1px #acb6b488 solid;
    color: #acb6b488;
    width: 100%;
    background-color: #fffef900;
    cursor: pointer;
}

.join_gender input[type="radio"]:checked  + label{
  border: 1px #ef822a solid;
  color: #ef822a
}




.join_line{
    display: block;
    /*border-top: 1px #ddd solid;*/
    margin-top: 30px;
    padding-bottom: 20px;
}



.member_agree{
    vertical-align: middle;
    margin: 20px 0;
    display: block;
    cursor: pointer;
}

.member_agree input[type="checkbox"]{
    margin-right: 10px;

}

.member_agree a{
    color:#996c33 ;
    transition: .3s;
}

.member_agree a:hover{
    color: #996c33;
}

.join_btn{
    text-align: center;
}


.join_btn p{
    text-align: center;
    display: block;
    font-size: 14px;
    padding: 5px 0;
    margin: 20px 0 0 0;
}

.join_btn p a:hover {
    color: #996c33;
    border-bottom: 1px #996c33 solid;
}

.join_btn p a {
    border-bottom: 1px #aaa solid;
    padding: 3px 0;
    margin-left: 8px;
    transition: .3s;
}

/*--------------------------*/


.terms_page{

}

.terms_page .all_titlebox_01{
    margin-bottom: 50px;
}

/*----------------------------*/


.member_box{
    width: 100%;
    padding: 3rem 2rem;
    background-color: #fff;
    box-shadow: 0px 5px 10px #0002;
}


.member_info {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    align-items: flex-end;
    margin-bottom: 40px;
}




.member_input_title{
    margin-bottom: 8px;
}

/*-----------------------*/

/*訂單紀錄*/
/*--------------------------*/



.member_order_title{
/*    border-top: 1px #113034 solid;*/
/*    border-bottom: 1px #113034 solid;*/
    padding: 0 10px;
    background-color: #948665;
    display: flex;
}



.member_order_title li{
    
    font-size: 14px;
    padding: 10px 0;
    color: #fff;
}

.member_order_title li:nth-child(1),
.member_order_info li:nth-child(1){
    width: 100px;
}

.member_order_title li:nth-child(2),
.member_order_info li:nth-child(2){
    width: 150px;
    text-align: center;
}

.member_order_title li:nth-child(3),
.member_order_info li:nth-child(3){
    width: calc(45% - 180px);
    text-align: center;
}

.member_order_title li:nth-child(4),
.member_order_info li:nth-child(4){
    width: 90px;
    text-align: center;
}

.member_order_title li:nth-child(5),
.member_order_info li:nth-child(5){
    width: calc(55% - 230px);
    text-align: center;
}

.member_order_title li:nth-child(6),
.member_order_info li:nth-child(6){
    width: 70px;
    text-align: center;
}




/*--------------------------------*/


.member_order_info{
    border-bottom: 1px #c3cac8 solid;
    padding: 0 10px;
    display: flex;
    align-items: center;
}


.member_order_info li{
    
    font-size: 14px;
    padding: 25px 0;
}



.m_order_left{
    display: none;
}




.member_order_info li a{
    color: #ef822a;
    transition: .3s;
}

.member_order_info li a:hover{
    color: #ef822a;
}

.member_order_info li p{
    color: #ea6a6a;
}



.member_order_notice{
    margin: 30px auto 0px auto;
    text-align: center;
}

.member_order_notice h2{
    font-size: 14px;
    color: #888;
    line-height: 30px;
}

.member_order_notice a{
    border-bottom: 1px #c0ab7a solid;
    color: #c0ab7a;
    padding: 0 0px;
    margin: 0 5px;
}


.member_order{
    position: absolute;
    top: 30px;
    right: 30px;
    z-index: 5;
}

.member_order a{
    padding: 8px 10px;
    background-color: #fffef9;
    color: #ef822a;
    display: block;
    font-size: 14px;
    border: 1px #e2dfd3 solid;
    transition: .5s;
}


.member_order span{
    margin-right: 5px;
}

.member_order a:hover{
    background-color: #ef822a;
    color: #fff;
    border: 1px #ef822a solid;
}




.member_order_cancel{
    background-color: #E4ECE6;
    color:#839F96 ;
    margin-top: 10px;
    display: inline-block;
    padding: 1px 4px;
    transition: .3s;
}

.member_order_cancel:hover{
    color:#fff ;
    background-color: #839F96;
}




.member_order_results{
    color:#839F96 ;
    display: inline-block;
    vertical-align: middle;
    padding: 1px 6px;
    transition: .3s;
}

.member_order_results:hover{
    background-color: #E4ECE6;
    color:#839F96 ;
}

.member_order_results span{
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    margin-left: 5px;
}


.member_order_d_notice{
    background-color: #efecdf;
    padding: 10px;
    height: 250px;
    overflow-y: scroll;
}

.member_order_d_notice p{
    font-size: 14px;
    color: #11303485;
}

.member_order_d_notice::-webkit-scrollbar {
    width: 6px;
}

.member_order_d_notice::-webkit-scrollbar-track {
    background-color: #f5f2e8;
}

.member_order_d_notice::-webkit-scrollbar-thumb {
    background-color: #cbc8be; 
}

.member_order_d_notice::-webkit-scrollbar-corner {
      background-color: #f5f2e8;
}

.m_order_atm5{
    display: block;
}








/*======================================================*/

/*-------------------------------------*/


.cart_box{
    margin: 0 auto;
    width: 1360px;
    max-width: 90%;
    position: relative;
}



.cart_left_bg{
    background-color:#faf7f3 ;
    width: calc(50% - 4px);
    display: inline-block;
    vertical-align: top;
    padding: 80px 20px;
}

.cart_left_bg .all_titlebox_01{
    margin-bottom: 20px;
}


.cart_right_bg{
    width: calc(50% - 4px);
    display: inline-block;
    vertical-align: top;
    position: relative;
    padding: 80px 20px;
    min-height: 80vh;
}

.cart_right_bg::after {
    content: "";
    display: block;
    width: 50vw;
    max-width: 1100px;
    /*min-height: 100vh;*/
    /*height: 100vh;*/
    position: absolute;
    top: 0;
    bottom: 0;
    background: #f5f0ea;
    z-index: -1;
    left: 0;
    background-position: left top;
    -webkit-box-shadow: 1px 0 0 #e3e0d4 inset;
    box-shadow: 1px 0 0 #e3e0d4 inset;
}



.cart_right_bg.service{
    width: 100%;
}

.cart_right_bg.service::after {
    background: #f5f0ea00;
    box-shadow: 0px 0 0 #e3e0d4 inset;
}

.cart_right_bg.service .all_titlebox_01{
    margin-bottom: 20px;
}

.cart_pro_box{
    background-color: #fff;
    box-shadow: 0 0 15px #33333317;
    padding: 20px 20px;
    margin: 25px 0;
}

.cart_pro_box h2{
    font-size: 18px;
    margin-bottom: 20px;
}

.cart_pro_ul {
    display: flex;
    flex-direction: column;
    gap: 15px 0;
}

.cart_pro_ul li {
/*    margin: 10px 0;*/
    display: flex;
    align-items: center;
    gap: 10px 10px;
}

.cart_pro_ul .title {
    display: flex;
    gap: 10px;
    align-items: center;
    width: calc(100% - 190px - 28px );
}

.cart_pro_ul .title img{
    width: 70px;
    border: 1px #E4ECE6 solid;
}


.cart_pro_ul .title  h3{
    width: calc(100% - 85px);
}




.cart_pro_ul.detail .title {
    display: flex;
    gap: 10px;
    align-items: center;
    width: calc(100% - 150px );
}

.cart_pro_ul.detail .title img{
    width: 70px;
    border: 1px #E4ECE6 solid;
}


.cart_pro_ul.detail .title  h3{
    width: calc(100% - 85px);
}

.cart_pro_ul.detail  .num{
    width: 40px;
}

.cart_pro_ul.detail  .price{
    width: 80px;
}




/*數量*/
.cart_pro_num{
    display: flex;
    align-items: center;
}

.pro_num_minus{
    width: 25px;
    height: 25px;
    background-color: #fff;
    border: 1px #ddd solid;
    position: relative;
    transition: .5s;
}

.pro_num_minus::after {
    content: "";
    width: 10px;
    height: 2px;
    display: block;
    background-color: #999;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
}


.pro_num_plus{
    width: 25px;
    height: 25px;
    background-color: #fff;
    border: 1px #ddd solid;
    position: relative;
    transition: .5s;
}

.pro_num_plus::after {
    content: "";
    width: 10px;
    height: 2px;
    display: block;
    background-color: #999;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
}

.pro_num_plus::before {
    content: "";
    width: 2px;
    height: 10px;
    display: block;
    background-color: #999;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
}


.pro_num_plus:hover,.pro_num_minus:hover{
    border: 1px #aaa solid;
}

.cart_pro_num_input{
    border: 0;
    font-size: 17px;
    color: #113034;
    text-align: center;
    width: 40px;
}

.cart_pro_num_input:focus{
    outline:none
}


/*價格*/
.cart_pro_ul .price{
    font-size: 16px;
    color: #ef822a;
    font-weight: 700;
    letter-spacing: 1.2px;
    width: 80px;
    text-align: right;


}

/*刪除*/
.cart_pro_del{
    transition: .5s;

}



.cart_pro_del span{
    color: #bbb;
    font-size: 16px;
    display: block;
    margin: 9px 0;
    transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
}

.cart_pro_del:hover span{
    color: #888;
}




/*寄送方式*/
.cart_send_box{
    margin-top: 15px;
}

.cart_title_h2{
    font-size: 17px;
    color: #666;
    font-weight: 600;
}

.cart_title_h3{
    font-size: 15px;
    color: #666;
    font-weight: 500;
    margin-top: 10px;
}

.cart_all_box01{
    background-color:#fffef9 ;
    margin: 10px 0 30px 0;
    border: 1px #e2dfd3 solid ;
}

.cart_all_box01 li{
    border-top: 1px #e2dfd3 solid ;
    position: relative;
}

.cart_all_box01 li:nth-child(1){
    border-top: 0px #e2dfd3 solid ;
}

.cart_all_box01 li label{
    padding: 15px 15px;
    display: flex;
    align-items: center;
    cursor: pointer;

}





.cart_b1_left{
    width: 50px;
}

.cart_b1_center{
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 60px);
}

.cart_all_box01 .cart_b1_center{
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 160px);
}
.cart_all_box01 .cart_b1_right{
    width: 120px;
    text-align: right;
}

.cart_b1_center h2{
    font-size:15px ;
}

.cart_b1_right h3{
    font-size: 15px;
}

.cart_b1_right h3 span{
    color: #ea6a6a;
}




.cart_b1_input {
  visibility: hidden; /* 把原本的input藏起來 */
}

.cart_new_input {
  /* 自定義樣式的span */
  height: 20px;
  width: 20px;
  border: 1px solid #d6ccdf;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
}

.cart_new_input::after { /* 中間點點 */
  content: "";
  display: block;
  height: 12px;
  width: 12px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #ef822a;
  opacity: 0;
  transition: opacity 0.2s;
}

.cart_b1_input:checked ~ .cart_new_input::after {
  /* 選中radio時 才顯示中間點點 */
  opacity: 1;
}






.cart_pay_box{

}

.cart_pay_box.mtop{
    margin-top: 15px;
}

.cart_total_box{
    padding: 0 5px;
}

.cart_total_box_title{
    margin-bottom: 10px;
}


/*------------------*/

.cart_total_b1{
    margin: 15px auto;
    display: flex;
    flex-wrap: wrap;
    font-size: 16px;
}

.cart_total_b1_left{
    width: calc(100% - 200px);
}

.cart_total_b1_right{
    display: inline-block;
    vertical-align: top;
    width: 195px;
    text-align: right;
}

.cart_total_b1_left h3 span,.cart_total_b1_right h3 span{
    color: #ea6a6a;
}

.cart_total_b1_right h5{
    font-size: 20px;
}

/*------------------*/

.cart_total_b2{
    margin: 15px auto;
    font-size: 18px;
    display: flex;
}

.cart_total_b2_left{
    display: inline-block;
    vertical-align: top;
    width: 55px;
}

.cart_total_b2_right{
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 60px);
    text-align: right;
}

.cart_total_b2_left h3{
    font-size: 20px;
    font-weight: 700;
}

.cart_total_b2_left h3 span,.cart_total_b2_right h3 span{
    color: #ea6a6a;
}

.cart_total_b2_right h4 span{
    font-size: 32px;
    font-weight: 700;
}

.cart_total_b2_right p{
    font-size: 14px;
    color: #838b86;
}



/*------------------*/

.cart_total_prolist li{
    font-size: 14px;
    color: #acb0a8;
}

.cart_total_freesend{
    background-color: #efecdf;
    margin: 10px 0 10px 0;
}

.cart_total_freesend label{
    width: 100%;
    padding: 5px 10px;
    display: block;
    color:#11303485 ;
    cursor: pointer;
}

.cart_total_freesend label span{
    color: #ea6a6a;
}








.new_checkbox[type="checkbox"] {
    font-size: 20px;
    /* zoom: 180%; */
    -webkit-appearance: none;
    vertical-align: middle;
    /* margin-top: 0; */
    background: #fff;
    border: #d2d2d2 solid 1px;
    border-radius: 3px;
    min-height: 17px;
    min-width: 17px;
    position: relative;
    cursor: pointer;
    width: 20px;
    height: 20px;
}

.new_checkbox[type="checkbox"]:checked {
    background: #996c33;
}

.new_checkbox[type=checkbox]:checked::after{
    content: '';
    top: 4px;
    left: 4px;
    position: absolute !important;
    background: transparent;
    border: #fff solid 3px;
    border-top: none;
    border-right: none;
    height: 4px !important;
    width: 7px !important;
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.cart_total_line{
    width: 100%;
    border-top: 1px #e2dfd3 solid;
    margin-top:15px ;
    /*padding-bottom:15px ;*/
}

.cart_total_coupon{
    margin: 0 0 20px 0;
    display: flex;
    width: 100%;
}

.cart_total_coupon_input{
    
    width: calc(100% - 100px);
}

.cart_total_coupon_btn{
    display: inline-block;
    vertical-align: middle;
    width: 95px;
    text-align: center;
    font-size: 14px;
    background-color: #e2dfd3;  
    padding: 12px 0;  
    transition: .5s;
}

.cart_total_coupon_btn:hover{
    background-color: #e3bc83;
    color: #fff;
}





.cart_total_coupon_info{
/*    border-top: 1px #e2dfd3 solid;*/
    border-bottom: 1px #e2dfd3 solid;
    padding: 8px 0;
    width: 100%;
    display: flex;
}









.cart_btn_box01{
    margin: 60px auto 15px auto;
}

.cart_btn_b1_left{
    display: inline-block;
    vertical-align: top;
    width: calc(35% - 14px);
    margin-right: 10px;
}

.cart_btn_b1_left a{
    width: 100%;
}

/*.cart_btn_b1_left a:hover{
    background-color: #113034;
    color: #fff;
}
*/
.cart_btn_b1_right{
    display: inline-block;
    vertical-align: top;
    width: calc(65% - 2px);
    text-align: right;
}

.cart_btn_b1_right a{
    width: 100%;
}

/*.cart_btn_b1_right a{
    font-size: 18px;
    padding: 12px 0;
    width: 100%;
    background-color: #113034;
    border: 1px #113034 solid;
    text-align: center;
    display: block;
    color: #fff;
    transition: .3s;
}

.cart_btn_b1_right a:hover{
    background-color: #839f96;
    border: 1px #839f96 solid;
    color: #fff;
}
*/



/*-------------------------------------*/


.cart_confirm_box{
    background-color: #fff;
    box-shadow: 0 0 15px #33333317;
    padding: 5px 20px;
    margin: 20px 0;
}


.cart_info_text{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 10px;
}

.cart_info_title{
    margin: 25px 0 5px 0;
    padding-left: 5px;
    position: relative;
    font-size: 16px;
}



.cart_input_01{
    width: calc(50% - 5px);
    display: flex;
    gap: 0 10px;
    align-items: center;
}

.cart_input_01 select{
    background-color: #fffef9;
    cursor: pointer;
}

.cart_input_02{
    width: 100%;
    display: flex;
    gap: 0 10px;
    align-items: center;


}


.cart_input_02 textarea{
    height: 100px;
    border-radius: 3px;
}


/*特殊尺寸*/
.cart_input_01.w25,
.cart_input_02.w25{
    width: calc(25% - 7.5px);
}

.cart_input_01.w50,
.cart_input_02.w50{
    width: calc(50% - 5px);
}

.cart_input_01.hasbtn .input_box02,
.cart_input_02.hasbtn .input_box02{
    width: calc(100% - 80px);
}

/*------------*/
.cart_input_01 .btn{

}

.cart_input_01 .btn a{
    background-color: #996c33;
    color: #fff;
    padding: 4px 4px;
    font-size: 13px;
    border-radius: 5px;
    width: 70px;
}

.cart_radiobox{
    width: 100%;
}

.cart_radiobox input{
    display: none;
}

.cart_radiobox li{
    display: inline-block;
    vertical-align: top;
}

.cart_radiobox label{
    display: inline-block;
    text-align: center;
    font-size: 14px;
    padding: 12px 0px;
    border: 1px #e2dfd3 solid;
    color: #808885;
    width: 100%;
    border-radius: 3px;
    background-color: #fffefc;
    cursor: pointer;
}

.cart_radiobox label span{
    font-size: 12px;
    display: block;
}

.cart_radiobox input[type="radio"]:checked  + label{
    background-color: #e3bc83;
    color: #fff
}


.cart_div_01 {
    display: flex;
    gap: 10px 20px;
    align-items: center;
}

.cart_div_01 a {
     width: 150px;
    display: inline-block;
    text-align: center;
    font-size: 14px;
    padding: 12px 0px;
    color: #fff;
    border-radius: 3px;
    background-color: #e3bc83;
    cursor: pointer;
}

.cart_div_01 h3{
    width: calc(100% - 170px);
}


.cart_send_day li{
    width: calc(33.3% - 7px);
}

.cart_send_day li:nth-child(1),.cart_send_day li:nth-child(2){
    margin-right: 5px;
}


.cart_bill li{
    width: calc(25% - 7px);
    margin-left: 5px;
}

.cart_bill li:nth-child(1){
    margin-left: 0px;
}



.cart_bill_info{
    background-color: #efecdf;
    margin:0 10px 50px 10px;
    width: calc(100% - 24px);

}

.cart_bill_info_title{
    padding: 5px 15px 7px 15px;
    cursor: pointer;
}

.cart_bill_info h2{
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 30px);
    color: #808885;
    font-size: 14px;
}


.cart_bill_info span{
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    transition: .3s;
}

.cart_bill_info_title.active span{
    transform:rotate(180deg);
}

.cart_bill_info_open{
    display: none;
}

.cart_bill_info_open p{
    color: #808885;
    font-size: 14px;
    padding: 10px 15px;
}



.cart_agree_box{
    margin: 30px auto;
}

.cart_agree_box .new_checkbox{
    margin-right: 10px;
}

.cart_agree_box h2{
    font-size: 14px;
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 36px);
}

.cart_agree_box a{
    color: #996c33;
}



.cart_info_same {
    position: absolute;
    right: 1px;
    top: -3px;
    padding: 1px 5px 1px 5px;
    border-radius: 3px;
    cursor: pointer;
    display: flex;
    gap: 0 5px;
    align-items: center;

}

.cart_info_same label{
    cursor: pointer;
}

.cart_info_same h2{
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    line-height: 14px;

}

.cart_info_same .btn{
    background-color: #996c33;
    color: #fff;
    padding: 4px 8px;
    font-size: 14px;
    border-radius: 5px;
}



.cart_remark_box{
    padding: 0 10px;
}

.cart_remark_box p{
    line-height: 30px;
    color: #8e7455;
}



.cart_pro_info{
    background-color: #fffef9;
    box-shadow: 0 0 15px #33333317;
    padding: 20px 20px;
    margin: 20px 0;
}

.cart_pro_info .cart_pro_ul h3 {
    width: calc(100% - 140px);
}

.cart_pro_info_num{
    display: inline-block;
    vertical-align: middle;
    text-align: right;
    width: 40px;
}








.cart_info_box.mtop{
    margin: 20px 0 30px 0;
}


.cart_tab{
/*    background-color: #fff;*/
    box-shadow: 0 0 15px #33333317;
    margin: 10px 0;
}

.cart_tab_title{
    padding: 20px 20px;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px #ddd solid;
    cursor: pointer;
    background-color: #fff;
}

.cart_tab_title>h2{
    font-size: 16px;
    display: flex;
    align-items: center;
    gap: 0 10px;
}

.cart_tab_title>h2 span{
    display: flex;
    background-color: #e3bc83;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 600;
}



.cart_tab_title>p{
    display: flex;
    gap: 0 5px;
    align-items: center;
}

.cart_tab_title>p i{
    font-size: 16px;
    transition: .3s;
}

.cart_tab_title.active p i{
    transform:rotate(180deg);
}


.cart_tab_info{
    padding: 10px 15px;
    background-color: #fbf9f7;
    display: none;
}


.cart_tab_info.active{
    display: block;
}


.cart_tab_info .copy_btn{
    color: #fff;
    background-color: #c79f65;
    padding: 4px 8px;
    border-radius: 5px;
    margin-top: 5px;
    display: inline-flex;
}

.cart_all_box02.cart_tab_info{
    padding: 0;
    margin-top: 0;
    border-top: 0;
}




.cart_all_box02{
    background-color:#fffef9 ;
    margin: 10px 0 30px 0;
    border: 1px #e2dfd3 solid ;
}


.cart_all_box02>li{
    border-top: 1px #e2dfd3 solid ;
    position: relative;
    padding: 16px 20px;
    display: flex;
    gap: 10px 15px;
}

.cart_all_box02>li.service{
    flex-direction: column;
}

.cart_all_box02 h2

.cart_all_box02>li:nth-child(1){
    border-top: 0px #e2dfd3 solid ;
}

.cart_all_box02 h2{
    font-size: 14px;
    width: 100px;

}

.cart_all_box02 p{
    font-size: 14px;
    width: calc(100% - 115px);
}

.cart_all_box02 div.ser_list {
    display: flex;
    gap: 10px 15px;
    flex-direction: column;
    width: 100%;
}

.cart_all_box02 div.ser_list .list {
    padding: 10px 15px;
    border-radius: 5px;
    background-color: #f3f3f3;
}

.cart_all_box02 div.ser_list .list h4{
    margin-bottom: 10px;
    font-weight: 700;
    color: #996c33;
}

.cart_all_box02 div.ser_list .list ul {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.cart_all_box02 div.ser_list .list ul li{
    display: flex;
    gap: 10px 10px;
}

.cart_all_box02 div.ser_list .list ul li .title{
    width: 80px;
    color: #888;
}

.cart_all_box02 div.ser_list .list ul li .info{
    width: calc(100% - 100px);
}


/*=================================*/


.news_d_box{
    padding: 10px 20px;
}

.news_d_date {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.news_d_date h3{
    color: #996c33;
    font-weight: 700;
    font-size: 17px;
}

.news_d_info{
    padding: 20px 0;
}

.news_d_info img{
    max-width: 100%;
    height: auto!important;
}


/*=====================*/

.contact_box{
    display: flex;
    gap: 0 20px;
    margin: 30px 0;
}

.contact_info {
    width: calc(60% - 10px);
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.contact_box .map{
    width: calc(60% - 10px);
    display: flex;
}


.contact_info h2{
    margin-bottom: 15px;
}

.contact_info p{
    font-size: 16px;
    line-height: 30px;
}


.contact_box .map iframe{
    width: 100%;
}

/*==============================*/

.event_box{
    display: flex;
    gap: 0 20px;
/*    margin: 30px 0;*/
    flex-direction: column;
}



.event_ul{
    padding: 3rem 0;
    display: flex;
    gap: 40px 24px;
    flex-wrap: wrap;
    width: 100%;
}

.event_ul li{
    width: calc(25% - 18px);
}

.event_ul li a{
    display: block;
    text-align: center;
}

.event_ul li .img{
    width: 100%;
    overflow: hidden;
    margin-bottom: 10px;
    transition: .3s;
    position: relative;

    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
}

.event_ul li .img:hover img{
    transform: scale(1.1);
}

.event_ul li .img img{
    width: 100%;
    transition: .8s;
}

.event_ul li .img p{
    position: absolute;
    right: 0;
    top: 0;
    padding: 5px 8px;
    font-size: 16px;
    
    color: #fff;
}

.event_ul li .img p.album{
    background-color: #996c33;
}

.event_ul li .img p.video{
    background-color: #e1b037;
}


.event_ul li h3{
    margin-bottom: 10px;
    font-weight: 500;
    font-size: 18px;
    letter-spacing: 1.2px;
    text-align: left;

}



.event_d_box{
    width: 800px;
    max-width: 100%;
    margin: 2rem auto;
}

.event_d_box iframe{
    width: 100%;
    height: 500px;
}



/*====================*/

.cart_ser_box01{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;    
}

.cart_ser_box01 li{
    border: 1px #e2dfd3 solid;
    width: 100%;
    background-color: #fffef9;
    position: relative;
}

.cart_ser_box01 li label{
    position: relative;
    padding: 15px 15px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.cart_ser_box01 .info_box{
    border-top: 1px #ddd solid;
    padding: 20px;
    background-color: #f6f3f0;
}




    

.add_people_btn {
    display: flex;
    justify-content: center;
    margin: 20px 0 30px 0;
}

.add_people_btn a {
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: center;
}