@charset "utf-8";

body{
    font-family: 'Roboto','Microsoft JhengHei','Microsoft JhengHei','sans-serif';
    color: var(--font-color);
    font-weight: 400;
    font-size: 16px;
}
a{
    color: var(--font-color);
}
a, a:hover{ 
    text-decoration: none; 
    color: inherit;
}
h1{
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 1.6;
    margin-bottom: 0px;
}
h2{
    font-weight: 600;
    font-size: 36px;
    line-height: 1.6;
    margin-bottom: 0px;
}
h3{
    font-weight: 600;
    font-size: 24px;
    line-height: 1.5;
    margin-bottom: 0px;
}
h4{
    font-weight: 400;
    font-size: 20px;
    line-height: 1.5;
    margin-bottom: 0px;
}
h5{
    font-weight: 400;
    font-size: 18px;
    line-height: 1.5;
    margin-bottom: 0px;
}
p{
    letter-spacing: 1.5px;
    text-align: justify;
}
hr{
    margin: 0;
    color: #D9D9D9;
    opacity: 1;
}
ul, li{
    margin: 0;
    padding: 0;
    list-style: none;
}
:focus-visible {
    outline: 2px dashed var(--main-color);
}
.row{
    margin-left: -16px;
    margin-right: -16px;
}
.row>*{
    padding-left: 16px;
    padding-right: 16px;
}
.row.p12{
    margin-left: -12px;
    margin-right: -12px;
}
.row.p12>*{
    padding-left: 12px;
    padding-right: 12px;
}
button {
    border: 0;
    background-color: transparent;
}
input, textarea{
    box-shadow: none;
    -webkit-appearance: none;  /* Safari*/
    -moz-appearance: none;     /* FireFox */
    appearance: none;
}
input:focus, select:focus, textarea:focus, button:focus, .btn:focus{
    outline: none !important;
    box-shadow:none !important;
}
.bg {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.bg img {
    display: none !important;
}
.btn{
    padding: 0;
    border: 0;
}
.nav-link{
    color: var(--font-color);
}
.nav-link:hover{
    color: var(--main-color);
}
/*數字ul*/
ul.number_ul, .number_ul li{
    list-style: decimal;
}
ul.number_ul{
    margin-left: 24px;
}
.number_ul li{
    margin-bottom: 1.5rem;
    letter-spacing: 1.5px;
    color: var(--main-color);
    text-align: justify;
}
/*頁面載入loading*/
#loading{
    position: fixed;
    height: calc(100%);
    width: 100%;
    background-color:rgba(0, 0, 0, 0.3);
    z-index: 99999;
    top: 0;
}
.loadingImg{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.line-scale > div{
    background-color: var(--main-color2);
}
/*頁面載入失敗*/
#Loadingfail{
    position: fixed;
    height: calc(100% - 80px);
    width: 100%;
    background-color: #fff;
}
.loadingfail_content{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    text-align: center;
}
.loadingfail_icon{
    font-size: 48px;
    color: var(--main-color);
}
.loadingfail_content p{
    margin-top: 16px;
    margin-bottom: 24px;
    color: var(--font-color2);
}
/*容器*/
.vet_container{
    max-width: 1232px; /*圖片量起來是1060，但圖片似乎不準*/
    padding-left: 16px;
    padding-right: 16px;
}
/*主要內容區塊*/
main{
    min-height: calc(100vh - 100px - 80px);
}
/*面板*/
.vet_dashboard{
    background-color: #fff;
    border-bottom: solid 1px #e9e9e9;
    border-radius: 4px;
}
/*麵包屑*/
.vet_breadcrumb{
    font-size: 24px;
    font-weight: 600;
    padding-top: 32px;
    color: var(--font-color);
}
.vet_breadcrumb .breadcrumb{
    margin-bottom: 0;
}
.vet_breadcrumb .breadcrumb-item.active{
    color: var(--font-color2);
}
.vet_breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: var(--font-color);
}
/*頁面標題-深紫底白字*/
.page_title{
    display: none;
}
.page_title.pcshow{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 52px;
    background-color: var(--light-color);
}
.page_title.pcshow h1{
    font-size: 24px;
    color: var(--main-color);
}
.page_title.pcshow .page_title_icon{
    display: none;
}
/*頁面標題-白底紫字*/
.page_title2{
    display: flex;
    align-items: center;
    padding-top: 16px;
}
.page_title2 .page_title_icon{  
    margin-right: 16px;
}
.page_title2 h1{
    font-size: 18px;
    color: var(--main-color);
}
/*區塊標題*/
.container_title{
    padding: 8px 16px;
    margin-bottom: 16px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--light-color);
    color: var(--main-color);
    letter-spacing: 1.5px;
    border-bottom: solid 1px var(--border-color);
}
/*區塊背景色-淡紫*/
.bg_lightgreen{
    background-color: var(--light-color);
}
/*紫色按鈕*/
.vet_purple_btn{
    background-color: var(--main-color);
    color: #fff;
    padding: 16px 16px 17px 16px;
    font-size: 18px;
    font-weight: 600;
    border-radius: 4px;
    min-width: 200px;
}
.vet_purple_btn:hover{
    color: #fff;
    background-color: var(--main-color2);
}
/*紫色按鈕-小*/
.vet_purple_btn_sm{
    background-color: var(--main-color);
    color: #fff;
    padding: 10px 16px 11px 16px;
    font-size: 18px;
    font-weight: 600;
    border-radius: 4px;
    min-width: 140px;
}
.vet_purple_btn_sm:hover{
    color: #fff;
    background-color: var(--main-color2);
}
/*紫色文字按鈕*/
.vet_onlycolor_btn{
    color: var(--main-color2);
}
.vet_onlycolor_btn:hover{
    color: var(--main-color);
}
/*白色按鈕*/
.vet_white_btn{
    background-color: #fff;
    color: var(--font-color2);
    border: solid 1px var(--font-color2);
    padding: 16px 16px 17px 16px;
    font-size: 18px;
    font-weight: 600;
    border-radius: 4px;
    min-width: 200px;
}
.vet_white_btn:hover{
    color: #888888;
    background-color: #fff;
    border: solid 1px #888888;
}
/*兩個按鈕並排*/
.two_btn{
    display: flex;
    margin-left: -8px;
    margin-right: -8px;
}
.two_btn>*{
    padding-left: 8px;
    padding-right: 8px;
}
/*更多link*/
.more_link{
    display: flex;
    border-radius: 100px;
    padding: 8px 16px;
}
.more_link_txt{
    font-weight: 600;
    color: var(--main-color);
}
.more_link_icon{
    width: 18px;
    margin-left: 8px;
    margin-top: -2px;
}
.more_line:hover{
    background-color: #fff;
}
/*收藏鈕*/
.product_keep_box{
    position: absolute;
    right: 16px;
    bottom: 16px;
}
.keep_btn{
    display: flex;
    align-items: center;
}
.keep_txt{
    margin-left: 8px;
    color: var(--font-color2);
    font-size: 14px;
}
.keep_btn_icon_box{
    width: 40px;
    height: 40px;
    background-color: rgba(70, 76, 128, 0.1);
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.keep_btn_icon{
    width: 16px;
    height: 16px;
    background-image: url(../img/heart-regular.svg);
    background-repeat: no-repeat;
    background-size: cover;
}
.keep_btn.active .keep_btn_icon{
    background-image: url(../img/heart-solid.svg);
}

/*收藏鈕-小*/
/* .keep_btn{
    display: flex;
    position: absolute;
    align-items: center;
}
.keep_txt{
    margin-left: 8px;
    color: var(--main-color);
    font-weight: 600;
}
.keep_btn_sm{
    width: 24px;
    height: 24px;
    background-color: rgba(70, 76, 128, 0.1);
    border-radius: 100px;
}
.keep_btn_sm .keep_btn_icon{
    margin: 5px;
    width: 14px;
    height: 14px;
    background-image: url(../img/heart-regular.svg);
    background-repeat: no-repeat;
    background-size: cover;
}
.keep_btn.active .keep_btn_sm .keep_btn_icon{
    background-image: url(../img/heart-solid.svg);
} */
/*收藏鈕-大*/
/* .keep_btn_lg{
    width: 28px;
    height: 28px;
    background-color: rgba(70, 76, 128, 0.1);
    border-radius: 100px;
}
.keep_btn_lg .keep_btn_icon{
    margin: 6px;
    width: 16px;
    height: 16px;
    background-image: url(../img/heart-regular.svg);
    background-repeat: no-repeat;
    background-size: cover;
}
.keep_btn.active .keep_btn_lg .keep_btn_icon{
    background-image: url(../img/heart-solid.svg);
} */
/*回上一頁鈕*/
.back_btn{
    padding: 6px;
    width: 28px;
    height: 28px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 100px;
}
.back_btn_icon{
    width: 16px;
    height: 16px;
    background-image: url(../img/arrow-left-solid.svg);
    background-repeat: no-repeat;
    background-size: 15px;
}
/*刪除鈕*/
.delete_btn i{
    font-size: 18px;
    color: var(--main-color);
}
/*各種圖示*/
.cart_icon_box{
    padding: 6px;
    width: 28px;
    height: 28px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 100px;
}
.cart_icon{
    font-size: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.cart_icon img{
    width: 100%;
    height: 100%;
}
.shop_icon_box{
    padding: 6px;
    width: 28px;
    height: 28px;
    background-color: rgba(70, 76, 128, 0.1);
    border-radius: 100px;
}
.shop_icon{
    width: 16px;
    height: 16px;
    background-image: url(../img/store-solid.svg);
    background-repeat: no-repeat;
    background-size: 16px;
}
.user_icon_box{
    padding: 6px;
    width: 28px;
    height: 28px;
    background-color: rgba(70, 76, 128, 0.1);
    border-radius: 100px;
}
.user_icon{
    width: 16px;
    height: 16px;
    background-image: url(../img/person-fill.svg);
    background-repeat: no-repeat;
    background-size: 16px;
}
.keep_icon_box{
    padding: 6px;
    width: 28px;
    height: 28px;
    background-color: rgba(70, 76, 128, 0.1);
    border-radius: 100px;
}
.keep_icon{
    width: 16px;
    height: 16px;
    background-image: url(../img/heart-fill.svg);
    background-repeat: no-repeat;
    background-size: 16px;
}
.order_icon_box{
    padding: 6px;
    width: 28px;
    height: 28px;
    background-color: rgba(70, 76, 128, 0.1);
    border-radius: 100px;
}
.order_icon{
    width: 16px;
    height: 16px;
    background-image: url(../img/clipboard-list-solid.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
/*top鈕*/
.top_btn{
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.8);
    box-shadow: 0px 1px 4px rgb(0 0 0 / 10%);
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    bottom: 60px;
    right: 24px;
    cursor: pointer;
}
.top_btn_icon{
    width: 24px;
    height: 24px;
    background-image: url(../img/arrow-up-solid.svg);
    background-repeat: no-repeat;
    background-size: cover;
}
/*列表*/
.vet_table_header{
    border-top: solid 1px var(--border-color);
    border-bottom: solid 1px var(--border-color);
    display: flex;
    width: 100%;
}
.vet_table_header>div{
    font-size: 14px;
    padding: 16px 12px;
}
.item_wrap {
    position:relative;
    width:100%;
}
.item_row {
    position:relative;    
    top:0;
    border-bottom: 1px solid var(--border-color);
    background-color: #fff;
    overflow:hidden;
    display: flex;
    align-items: center;
    z-index: 10;
}
.item_row>div{
    font-size: 14px;
    padding: 16px 12px;
}
.item_wrap .item_del {  /* 刪除按鈕位於條目內容的下一層 */
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--main-color);
    top: 0;
    right: 0;
    width: 72px;
    height: calc(100% - 40px);
    letter-spacing: 1.2px;
    font-size: 14px;
    color: #fff;
    z-index: 9;
}
.item_row_delete_btn{
    font-size: 20px;
    color: var(--font-color2);
}
/*灰框輸入框*/
.vet_input_txt{
    font-size: 16px;
    border-radius: 4px;
    border: solid 1px var(--border-color);
    height: 48px;
    padding: 0 16px;
}
.vet_input_txt:focus{
    border: solid 1px var(--main-color2);
}
.data_validate .vet_input_txt, 
.data_validate .vet_input_txt:hover, 
.data_validate .vet_input_txt:focus{
	border: solid 1px var(--danger-color);
	padding: 1px 17px;
}
.data_validate::after{
    display: block;
	margin-left: 16px;
    padding-top: 8px;
    content: attr(data-validate);
    font-size: 14px;
    color: var(--danger-color);
}
/*下拉*/
.vet_select{
    position: relative;
    font-size: 16px;
    border-radius: 4px;
    border: solid 1px var(--border-color);
    height: 48px;
    padding: 0 16px;
    appearance:none;
    -moz-appearance:none;
    -webkit-appearance:none;
    background: url("../img/caret-down-fill.svg") no-repeat right center #fff;
    background-size: 14px;
    background-position: right 12px center;
}
.vet_select::-ms-expand { 
    display: none; 
}
.vet_select:focus{
    border: solid 1px var(--main-color2);
}
/*checkbox*/
.vet_checkbox{
    padding-left: 0;
	margin-bottom: 0;
    display: flex;
}
.vet_checkbox .form-check-input{
    margin-left: 0;
    margin-top: 2px;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    border-color: var(--border-color);
}
.vet_checkbox .form-check-input:focus{
    border-color: var(--border-color);
}
.vet_checkbox .form-check-input:checked{
	border: solid 1px var(--main-color);
	background-color: var(--main-color);
}
.vet_checkbox .form-check-label{
    color: var(--font-color2);
    margin-left: 12px;
}
/*input群組*/
/*表單*/
.vet_form_control_row{
    position: relative;
    margin-bottom: 32px;
}
.vet_form_label{
    display: flex;
    position: absolute;
    top: -11px;
    left: 12px;
    font-size: 14px;
    color: var(--main-color);
    letter-spacing: 1.2px;
    z-index: 2;
}
.vet_form_label .form-label{
    margin-bottom: 0;
    background-color: #fff;
    padding: 0 4px;
}
.vet_control_group{
    margin-bottom: -8px;
}
.vet_control_group_item{
    padding-bottom: 8px;
}
.vet_two_control{
    display: flex;
    align-items: center;
    margin-left: -4px;
    margin-right: -4px;
}
.vet_two_control>div{
    flex: 1;
    padding-left: 4px;
    padding-right: 4px;
}
.vet_two_control.w-auto>div{
    flex: initial;
}
.vet_form_btn{
    padding:0 0 16px 0;
    text-align: right;
}
/*手機滿版彈窗*/
.vet_modal_sm_full .modal-content{
    border: none;
}
.vet_modal_sm_full .modal-header{
    border-bottom: solid 1px var(--border-color);
}
.vet_modal_sm_full .modal-footer{
    border-top: solid 1px var(--border-color);
    
}
.vet_modal_sm_full .modal-footer>*{
    margin: 0;
}
/*無項目樣式*/
.noitem_icon_box{
    display: flex;
    justify-content: center;
}
.noitem_icon{
    width: 100px;
    height: 100px;
    border-radius: 100%;
    border: solid 1px #ffffff;
    background-color: var(--border-color);
    display: flex;
    justify-content: center;
    align-items: center;
}
.noitem_icon i{
    font-size: 48px;
    color: var(--font-color2);
}
.noitem_txt p{
    margin-top: 16px;
    margin-bottom: 24px;
    color: var(--font-color2);
    text-align: center;
}
.noitem_btn{
    text-align: center;
}
/*標籤*/
.tag_red{
    color: var(--danger-color);
}
.tag_yellow{
    color: var(--worry-color);
}
.tag_green{
    color: var(--safe-color);
}
/*頁籤*/
.vet_tab{
    border-bottom: 1px solid var(--border-color);
}
.vet_tab .nav-link {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    padding: 10px 16px 11px 16px;
}
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    border-color: var(--border-color) var(--border-color) var(--border-color);
}
.vet_tab .nav-link.active, .vet_tab .nav-link.active:focus, .vet_tab .nav-link.active:hover{
    color: var(--main-color2);
    border-color: var(--border-color) var(--border-color) #fff;
}
/*header*/
.page_header{
    position: relative;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1);
    background-color: #FFFFFF;
}
.header_box{
    display: flex;
    align-items: center;
    height: 100px;
}
.header_logo{
    height: 80px;
}
.header_logo img{
    height: 100%;
}
.header_nav{
    flex: 1;
    display: flex;
    justify-content: flex-end;
}
.header_nav .nav{
    margin-left: -16px;
    margin-right: -16px;
}
.header_nav .nav-link{
    color: var(--main-color);
    padding: 0 16px;
    height: 100px;
    display: flex;
    align-items: center;
}
.nav_link_item{
    position: relative;
    display: flex;
    align-items: center;
    padding: 8px 16px;
    border-radius: 100px;
}
.nav_link_item:hover{
    background-color: var(--light-color);
}
.nav_link_icon{
    margin-right: 12px;
}
.nav_link_txt{
    font-weight: 600;
}
.header_nav i{
    font-size: 28px;
    display: flex;
}
.nav_cart.active .nav_link_item::after{
    content: "";
    background-color: var(--danger-color);
    width: 4px;
    height: 4px;
    border-radius: 4px;
    position: absolute;
    left: 44px;
    top: 8px;
}
.nav_member .nav_link_item{
    padding-right: 40px;
}
.nav_member .nav_link_item::after{
    content: "";
    background-image: url(../img/caret-down-fill.svg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 12px;
    height: 12px;
    position: absolute;
    right: 16px;
}
.nav_member .dropdown-menu{
    border: 0;
    box-shadow: 0px 2px 6px rgb(0 0 0 / 16%);
    min-width: auto;
    width: calc(100% - 32px);
    margin-left: 16px !important;
    margin-right: 16px !important;
    margin-top: 4px !important;
    padding: 8px 0;
}
.nav_member .dropdown-item{
    padding: 8px 16px;
    color: var(--main-color);
}
.nav_member .dropdown-item:hover, .nav_member .dropdown-item:active{
    background-color: var(--light-color);
}
.mobile_member_toggle, .mobile_menu_btn{
    display: none;
}
/*footer*/
.page_footer{
    background-color: var(--main-color2);
    color: #fff;
    padding: 0 16px;
}
.copyright{
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center
}
/*品牌首頁banner*/
.index_banner{
    width: 100%;
}
.index_banner .bg{
    width: 100%;
    height: 550px;
}
/*品牌首頁品牌名稱*/
.brand_name_box{
    background-color: var(--main-color);
    color: #fff;
}
.brand_name{
    padding: 16px 0;
}
/*品牌首頁-商品*/
.product_sort_box{
    background-color: #fff;
    border-bottom: solid 1px var(--border-color);
}
.product_sort_box.sfixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1001;
    box-shadow: 0 0px 3px rgb(0 0 0 / 16%);
}
.product_sort_box.sfixed+div{
    margin-top: 60px;
}
.product_sort_box .vet_container{
    position: relative;
}
.product_list_anchor{
    display: block;
    position: relative;
}
.product_sort {
    position: relative;
    overflow-x: auto;
    padding-bottom: 60px;
}
.product_sort::-webkit-scrollbar {
    display: none;
}
.product_sort .nav {
    flex-wrap: nowrap;
    position: absolute;
    height: 100%;
}
.product_sort .nav-item {
    display: flex;
    align-items: center;
    width: max-content;
}
.product_list_link.active{
    border-bottom: solid 1px var(--main-color);
    color: var(--main-color);
}
.product_sort_next, .product_sort_prev {
    display: flex;
    margin-top: -8px;
    top: 50%;
    width: 32px;
    height: 16px;
    cursor: pointer;
}
.product_sort_next {
    display: none;
    justify-content: flex-end;
    position: absolute;
    right: 0;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,50) 20%,rgba(255,255,255,1) 100%);
}
.product_sort_prev {
    display: none;
    justify-content: flex-start;
    position: absolute;
    left: 0;
    background: linear-gradient(to left, rgba(255,255,255,0) 0%, rgba(255,255,255,50) 20%, rgba(255,255,255,1) 100%);
}
.product_sort_next.active, .product_sort_prev.active {
    display: flex;
}
.product_list_page{
    padding-bottom: 64px;
}
.product_list_title{
    display: flex;
    align-items: center;
    padding-bottom: 16px;
    color: var(--main-color);
}
.product_list_box{
    padding-top: 64px;
    padding-bottom: 0;
}
.product_list_box:last-child {
    min-height: calc(100vh - 80px - 60px);
}
.product_list_table .vet_table_header>div:nth-child(1), .product_table_pic{
    width: 104px;
}
.product_pic{
    width: 80px;
    background: #C4C4C4;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 2px 2px 6px rgb(0 0 0 / 10%);
}
.product_list_table .vet_table_header>div:nth-child(2), .product_table_name{
    flex: 1;
}
.product_table_name h5{
    color: var(--main-color);
}
.product_table_caption{
    font-size: 14px;
    color: var(--font-color2);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    white-space: normal;
}
.product_list_table .vet_table_header>div:nth-child(3), .product_table_date{
    width: 120px;
    text-align: center;
}
.product_list_table .vet_table_header>div:nth-child(4), .product_table_price{
    width: 15%;
    text-align: right;
}
.product_table_price span{
    font-size: 20px;
    font-weight: 600;
    color: var(--main-color);
    letter-spacing: 1.5px;
    font-family: 'Readex Pro', sans-serif;
}
.product_list_table .vet_table_header>div:nth-child(5), .item_list_operate{
    width: 150px;
    text-align: right;
}
.operate_list{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.operate_list button+button{
    margin-left: 16px;
}
.addcart_btn_icon_box{
    width: 40px;
    height: 40px;
    background-color: rgba(70, 76, 128, 0.1);
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.addcart_btn_icon_box i{
    font-size: 16px;
    color: var(--main-color);
}
#product_modal .modal-dialog{
    max-width: 700px;
}
#product_modal .modal-title{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}
.product_modal_pic{
    width: 100%;
    max-width: 300px;
}
.product_modal_pic .bg{
    padding-bottom: 100%;
}
.product_modal_name{
    font-size: 24px;
    font-weight: 600;
    color: var(--main-color);
    margin-bottom: 16px;
}
.product_modal_price span{
    font-size: 20px;
    font-weight: 600;
    color: var(--main-color);
    letter-spacing: 1.5px;
    font-family: 'Readex Pro', sans-serif;
    margin: 0 4px;
}
.product_modal_date{
    padding-top: 16px;
}
.product_modal_caption{
    padding-top: 24px;
    line-height: 1.6;
    letter-spacing: 1.2px;
    text-align: justify;
}
#product_modal .product_count_btn_box{
    margin: 16px auto;
    width: fit-content;
}
.addcart_msg{
    position: fixed;
    top: calc(50% - (176px / 2));
    left: calc(50% - (400px / 2));
    background-color: rgba(1, 4, 0, 0.8);
    padding: 32px 0 40px 0;
    width: 400px;
    border-radius: 4px;
    z-index: 1002;
    box-shadow: 2px 4px 10px rgb(0 0 0 / 10%);
}
.addcart_msg_icon{
    font-size: 60px;
    color: var(--safe-color);
    text-align: center;
    margin-bottom: 8px;
}
.addcart_msg_txt{
    font-size: 24px;
    color: #fff;
    text-align: center;
}
.product_title_link .more_link{
    padding: 0;
    justify-content: flex-end;
    color: var(--main-color);
}

/* .product_swiper_box{
    padding-top: 48px;
    padding-bottom: 24px;
}
.product_swiper_title{
    display: flex;
    align-items: center;
    padding-bottom: 16px;
}
.product_swiper_title, .product_swiper_title a{
    color: var(--main-color);
}
.product_swiper_title_txt{
    flex: 1;
}
.product_swiper_title_link{
    padding-right: 120px;
    display: flex;
    justify-content: flex-end;
}
.product_swiper_title_link .more_link{
    background-color: #fff;
}
.product_swiper_title_link .more_link_icon{
    display: none;
}
.product_swiper{
    position: relative;
    padding-bottom: 48px;
}
.product_swiper .swiper-container{
    padding-right: 12px;
}
.product_swiper .swiper-slide{
    width: calc(20% - 19px);
    padding-bottom: 16px;
}
.product_swiper .swiper-button-next, .product_swiper .swiper-button-prev{
    width: 36px;
    height: 36px;
    top: -44px;
    color: var(--main-color);
    font-size: 36px;
}
.product_swiper .swiper-button-next{
    right: 14px;
}
.product_swiper .swiper-button-prev{
    left: auto;
    right: 66px;
}
.product_swiper .swiper-button-next.swiper-button-disabled, .product_swiper .swiper-button-prev.swiper-button-disabled{
    opacity: 0.6;
}
.product_swiper .swiper-button-next:after{
    content: "";
}
.product_swiper .swiper-button-prev:after{
    content: "";
}
.product_card{
    position: relative;
    background: #FFFFFF;
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    padding: 12px 12px 16px 12px;
}
.product_card .keep_btn{
    right: 16px;
    top: 16px;
}
.product_card_img{
    border-radius: 4px;
    overflow: hidden;
}
.product_card_img .bg{
    padding-bottom: 100%;
}
.product_card_neme{
    position: relative;
    text-align: center;
    padding-top: 12px;
    font-size: 14px;
    letter-spacing: 1.2px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.product_card_price{
    padding-top: 4px;
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    color: var(--main-color);
    letter-spacing: 1.5px;
    font-family: 'Readex Pro', sans-serif;
}
.product_card_img.placeholder{
    display: block;
    opacity: 1;
    background-color: #e5e5e5;
}
.product_card_neme.placeholder{
    width: 100%;
    padding: 0;
    margin-top: 12px;
}
.product_card_price.placeholder{
    width: 40%;
    padding: 0;
    display: block;
    margin: 4px auto 0 auto;
} */
/*分類商品頁*/
/* .product_list_box{
    padding-top: 48px;
    padding-bottom: 16px;
}
.product_list{
    margin-left: -12px;
    margin-right: -12px;
    display: flex;
    flex-wrap: wrap;
}
.product_item{
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 48px;
    display: inline-block;
    width: 20%;
} */
/*商品頁*/
/* .product_page{
    padding-top: 48px;
    padding-bottom: 64px;
}
.product_box{
    position: relative;
    padding: 12px;
    background-color: #fff;
    border-bottom: solid 1px #e9e9e9;
    border-radius: 4px;
}
.product_title_link{
    padding-top: 16px;
}
.product_pic_swiper_box{
    position: relative;
    overflow: hidden;
}
.product_pic_swiper_item{
    width: 100%;
}
.product_pic_swiper_item .bg{
    padding-bottom: 100%;
}
.product_pic_swiper_box .swiper-button-next, .product_pic_swiper_box .swiper-button-prev{
    width: 36px;
    height: 36px;
    color: var(--main-color);
    font-size: 36px;
}
.product_pic_swiper_box .swiper-button-next{
    right: 4px;
}
.product_pic_swiper_box .swiper-button-prev{
    left: 4px;
}
.product_pic_swiper_box .swiper-button-next.swiper-button-disabled, .product_pic_swiper_box .swiper-button-prev.swiper-button-disabled{
    opacity: 0.6;
}
.product_pic_swiper_box .swiper-button-next:after{
    content: "";
}
.product_pic_swiper_box .swiper-button-prev:after{
    content: "";
}
.product_pic_swiper_box .swiper-pagination-bullet{
    background-color: #fff;
    opacity: .8;
    width: 12px;
    height: 12px;
}
.product_pic_swiper_box .swiper-pagination-bullet-active{
    background-color: var(--main-color2);
    border:solid 1px var(--main-color);
}
.product_name{
    margin-top: 8px;
}
.product_price{
    margin-top: 16px;
    font-size: 28px;
    font-weight: 700;
    color: var(--main-color);
    font-family: 'Readex Pro', sans-serif;
}
.product_specification{
    margin-top: 32px;
}
.product_specificatiton_title{
    color: var(--font-color2);
}
.specificatiton_price{
    display: none;
}
.product_specificatiton_list_box{
    margin-top: 16px;
}
.product_specificatiton_list{
    margin-left: -8px;
    margin-right: -8px;
    margin-bottom: -16px;
}
.specificatiton_item{
    padding-left: 8px;
    padding-right: 8px;
    margin-bottom: 16px;
    display: inline-flex;
    cursor: pointer;
}
.specificatiton_item span{
    border: solid 1px var(--font-color2);
    color: var(--font-color2);
    padding: 0 12px;
    height: 36px;
    display: flex;
    align-items: center;
    font-size: 14px;
}
.specificatiton_item.active span{
    border: solid 1px var(--main-color);
    background-color: var(--main-color);
    color: #fff;
}
.product_count{
    margin-top: 32px;
}
.product_count_title{
    color: var(--font-color2);
}
*/
.product_count_btn_box{
    padding-top: 16px;
}
.product_count_btn{
    display: flex;
    align-items: center;
}
.count_number{
    width: 100px;
    padding-left: 16px;
    padding-right: 16px;
    text-align: center;
    font-size: 28px;
}
.product_count_btn .btn, .product_count_btn .btn:hover{
    color: var(--main-color);
}
.product_count_btn i{
    font-size: 40px;
    display: flex;
}
/*
.product_buy{
    margin-top: 48px;
}
.product_keep_box .keep_btn{
    top: -36px;
    right: 0%;
}
.product_present_box{
    margin-top: 24px;
    padding: 12px;
    background-color: #fff;
    border-bottom: solid 1px #e9e9e9;
    border-radius: 4px;
}
.product_present_content img{
    width: 100%;
    max-width: 700px;
}
.product_notice_box{
    margin-top: 24px;
    padding: 12px;
    background-color: #fff;
    border-bottom: solid 1px #e9e9e9;
    border-radius: 4px;
}
.mobile_close_productbuy{
    display: none;
}
.mobile_open_productbuy{
    display: none;
}
.product_box .page_title_icon{
    display: none;
}
.addcart_msg{
    position: fixed;
    top: calc(50% - (176px / 2));
    left: calc(50% - (400px / 2));
    background-color: rgba(1, 4, 0, 0.8);
    padding: 32px 0 40px 0;
    width: 400px;
    border-radius: 4px;
    z-index: 1002;
    box-shadow: 2px 4px 10px rgb(0 0 0 / 10%);
}
.addcart_msg_icon{
    font-size: 60px;
    color: var(--safe-color);
    text-align: center;
    margin-bottom: 8px;
}
.addcart_msg_txt{
    font-size: 24px;
    color: #fff;
    text-align: center;
} */
/*購物車*/
.cart_list{
    padding-top: 48px;
    padding-bottom: 16px;
}
.cart_item{
    position: relative;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1);
    background: #FFFFFF;
    border-radius: 8px;
    margin-bottom: 48px;
    overflow: hidden;
}
.cart_item_link{
    background-color: var(--main-color2);
    color: #fff;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.delete_btn_box{
    position: absolute;
    top: 12px;
    right: 12px;
}
.cart_item_content{
    padding: 12px;
    display: flex;
}
.cart_item_logo{
    width: 74px;
}
.cart_item_logo .bg{
    width: 100%;
    padding-bottom: 100%;
    background-size: contain;
}
.cart_item_txt{
    padding-left: 12px;
    padding-top: 4px;
    padding-bottom: 4px;
    min-height: 74px;
    flex: 1;
    display: flex;
    flex-wrap: wrap;
}
.cart_item_name{
    margin-right: 30px;
    width: 100%;
    line-height: 1.3;
}
.cart_item_name img{
    margin-right: 8px;
    width: 16px;
    margin-top: -3px;
}
.cart_item_cp{
    display: flex;
    align-items: flex-end;
    width: 100%;
}
.cart_item_price{
    flex: 1;
    text-align: right;
}
.cart_item_price, .cart_item_conut{
    font-size: 14px;
}
.cart_item_price span, .cart_item_conut span{
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 1.5px;
    font-family: 'Readex Pro', sans-serif;
    color: var(--main-color);
}
.gobuy_btn{
    margin-bottom: 16px;
    text-align: center;
}
.cart_empty .noitem_box{
    padding-top: 32px;
}
.maybelike_box {
    padding-top: 48px;
    padding-bottom: 64px;
}
/*下單-確認項目數量*/
.buy_page{
    padding-top: 32px;
    padding-bottom: 48px;
}
.buy_table .vet_table_header>div:nth-child(1){
    width: 104px;
}
.buy_table .vet_table_header>div:nth-child(2){
    flex: 1;
}
.buy_table .vet_table_header>div:nth-child(3){
    width: 15%;
    text-align: center;
}
.buy_table .vet_table_header>div:nth-child(4){
    width: 12%;
    text-align: right;
}
.buy_table .vet_table_header>div:nth-child(5){
    width: 20%;
    text-align: center;
}
.buy_table .vet_table_header>div:nth-child(6){
    width: 60px;
}
.buy_list_pic{
    width: 104px;
}
.buy_list_pic .product_pic{
    width: 80px;
}
.buy_list_name{
    flex: 1;
}
.buy_list_name h5{
    color: var(--main-color);
    cursor: pointer;
}
.buy_list_specificatiton{
    width: 15%;
    text-align: center;
}
.buy_list_price{
    width: 12%;
    text-align: right;
}
.buy_list_count{
    width: 20%;
    text-align: center;
}
.buy_table .item_row>div:nth-child(6){
    width: 60px;
}
.product_pic .bg{
    padding-bottom: 100%;
}
.buy_list_count .product_count_btn_box{
    padding-top: 0;
    margin: 0 auto;
    width: fit-content;
}
.buy_list_count .product_count_btn i{
    font-size: 28px;
}
.buy_list_count .count_number{
    font-size: 16px;
    width: 40px;
    padding-left: 8px;
    padding-right: 8px;
}
.buy_price_total_box{
    display: flex;
    align-items: center;
    width: 100%;
    padding: 16px 0;
}
.buy_price_total{
    flex: 1;
    text-align: right;
    padding-right: 24px;
    font-size: 14px;
}
.buy_price_total span{
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 1.5px;
    font-family: 'Readex Pro', sans-serif;
    color: var(--main-color);
}
/*下單-確認項目數量-修改規格*/
.specificatiton_mobile{
    position: fixed;
    right: 0;
    top: 0;
    width: 400px;
    background-color: #fff;
    height: 100%;
    z-index: 1002;
    display: none;
    overflow-y: auto;
}
.specificatiton_mobile.show{
    display: block;
}
.under_specificatiton_mobile {
    position: fixed;
    background: rgba(0, 0, 0, 0.3);
    height: 100vh;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 1001;
    display: none;
}
.product_specification{
    padding: 0 16px;
}
.specificatiton_mobile .product_specification{
    margin-top: 0;
}
.update_specificatiton{
    padding: 0 16px;
    margin-top: 48px;
    margin-bottom: 32px;
}
.update_specificatiton .btn{
    width: 100%;
}
.specificatiton_mobile.show+.under_specificatiton_mobile {
    display: block;
}
.mobile_close_specificatiton_icon{
    text-align: right;
    padding-right: 16px;
}
.mobile_close_specificatiton_icon i{
    font-size: 40px;
    color: var(--main-color);
}
/*下單-確認收件人*/
.receive_page{
    padding-top: 32px;
    padding-bottom: 48px;
}
.buy_receive_table .product_pic{
    width: 60px;
}
.buy_receive_table .vet_table_header>div:nth-child(1), .buy_receive_pic{
    width: 84px;
}
.buy_receive_table .vet_table_header>div:nth-child(2), .buy_receive_name{
    flex: 1;
}
.buy_receive_name h5{
    font-size: 16px;
}
.buy_receive_table .vet_table_header>div:nth-child(3), .buy_receive_exp{
    width: 17%;
    text-align: center;
}
.buy_receive_table .vet_table_header>div:nth-child(4), .buy_receive_price{
    width: 17%;
    text-align: right;
}
.buy_receive_price{
    letter-spacing: 1.5px;
}
.buy_receive_table .vet_table_header>div:nth-child(5), .buy_receive_count{
    width: 10%;
    text-align: center;
}
.buy_receive_table .vet_table_header>div:nth-child(6), .buy_receive_tprice{
    width: 16%;
    text-align: right;
}
.buy_receive_tprice{
    letter-spacing: 1.5px;
}
.total_price_box{
    margin-top: 24px;
}
.total_price_item{
    display: flex;
    font-size: 14px;
    padding: 0 12px;
}
.total_price_item+.total_price_item{
    margin-top: 8px;
}
.total_price_item_name{
    color: var(--font-color2);
    letter-spacing: 1.2px;
}
.total_price_item_price{
    flex: 1;
    text-align: right;
    letter-spacing: 1.5px;
}
.total_price_item.last .total_price_item_name{
    font-size: 18px;
    font-weight: 600;
    color: var(--main-color);
}
.total_price_item.last .total_price_item_price{
    font-size: 18px !important;
    font-weight: 600;
    font-family: 'Readex Pro', sans-serif;
    color: var(--main-color);
}
.receive_box{
    border: solid 1px var(--border-color);
}
.receive_title{
    margin-bottom: 32px;
    background-color: var(--light-color);
    padding: 16px 12px;
    font-size: 14px;
    height: 52px;
}
.receive_title .more_link{
    padding: 0;
    margin-left: auto;
}
.receive_content{
    margin-top: -16px;
    padding-bottom: 16px;
}
.receive_item{
    display: flex;
    padding: 0 12px;
}
.receive_item+.receive_item{
    margin-top: 8px;
}
.receive_item_name{
    color: var(--font-color2);
    letter-spacing: 1.2px;
}
.receive_item_content{
    flex: 1;
    text-align: right;
    letter-spacing: 1.2px;
}
.receive_item_content.total_pirce{
    color: var(--main-color);
    letter-spacing: 1.5px;
    font-family: 'Readex Pro', sans-serif;
    font-size: 16px;
}
.receive_page .buy_price_total{
    display: none;
}
.receive_page .buy_next_btn, .receive_page .buy_next_btn .btn{
    width: 100%;
}
.update_receive_btn_box{
    text-align: right;
}
.update_receive_btn_box .btn{
    font-size: 14px;
    font-weight: 600;
}
.update_receive_btn_box .btn+.btn{
    margin-left: 16px;
}
.receive_form{
    padding: 0 16px;
}
/*下單-購買成功*/
.success_page{
    padding-top: 32px;
    padding-bottom: 48px;
}
.success_box{
    display: flex;
    justify-content: center;
}
.success_pic_box{
    width: 150px;
    height: 150px;
    border-radius: 150px;
    background-color: var(--light-color);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}
.success_pic{
    width: 100px;
    margin-top: -8px;
}
.success_pic img{
    width: 100%;
}
.success_txt{
    text-align: center;
    margin-top: -16px;
}
.success_txt h5{
    color: var(--main-color);
    font-weight: 600;
    text-align: center;
    margin-bottom: 4px;
}
.success_txt p{
    color: var(--font-color2);
    text-align: center;
    margin-bottom: 0;
    font-size: 14px;
}
.success_page .total_price_box{
    margin-bottom: 24px;
}
.order_info_box{
    margin-top: 32px;
}
.order_info_content .more_link{
    padding: 0;
    justify-content: flex-end;
}
.buy_success_btn_box{
    padding: 16px 0;
    text-align: right;
}
.success_page .buy_receive_table .vet_table_header>div:nth-child(3), .success_page .buy_receive_exp {
    width: 20%;
}
.success_page .buy_receive_table .vet_table_header>div:nth-child(4), .success_page .buy_receive_price{
    width: 20%;
}
/*會員專區選單*/
.member_side_nav_dashboard{
    padding: 12px;
}
.member_side_nav .nav-item{
    width: 100%;
}
.member_side_nav .nav-item+.nav-item{
    margin-top: 16px;
}
.member_side_nav .nav-link{
    background-color: #fff;
    color: var(--font-color2);
    height: 52px;
    display: flex;
    align-items: center;
    padding: 0 12px;
}
.member_side_nav .nav-link.active, .member_side_nav .nav-link.active:hover{
    background-color: var(--main-color);
    color: #fff;
}
.member_side_nav .nav-link:hover{
    background-color: var(--light-color);
    color: var(--main-color);
}
.member_nav_icon{
    margin-right: 12px;
}
.nav-link.active .member_nav_icon .user_icon_box{
    background-color: rgba(255, 255, 255, 0.1);
}
.nav-link.active .member_nav_icon .user_icon{
    background-image: url(../img/person-fill-white.svg);
}
.nav-link.active .member_nav_icon .keep_icon_box{
    background-color: rgba(255, 255, 255, 0.1);
}
.nav-link.active .member_nav_icon .keep_icon{
    background-image: url(../img/heart-solid-white.svg);
}
.nav-link.active .member_nav_icon .order_icon_box{
    background-color: rgba(255, 255, 255, 0.1);
}
.nav-link.active .member_nav_icon .order_icon{
    background-image: url(../img/clipboard-list-solid-white.svg);
}
/*訂單紀綠*/
.ohistory_page{
    padding-top: 32px;
}
.order_history_dashboard{
    padding: 12px 12px 0 12px;
    margin-bottom: 48px;
}
.order_status_nav{
    margin-top: 16px;
}
.order_status_list_box{
    padding-bottom: 48px;
    margin-top: 24px;
}
.order_history_status{
    display: flex;
}
.order_history_status i{
    font-size: 18px;
    margin-right: 8px;
}
.order_history_item{
    border: solid 1px var(--border-color);
    padding: 16px;
    border-radius: 4px;
}
.order_history_item+.order_history_item{
    margin-top: 24px;
}
.order_history_item:hover{
    background: #FFFFFF;
    box-shadow: 2px 2px 10px rgb(0 0 0 / 10%);
    border-color: #fff;
}
.order_history_item_status{
    display: flex;
    align-items: center;
    margin-bottom: 16px;
}
.order_history_brand{
    flex: 1;
}
.order_history_brand h4{
    font-weight: 600;
    color: var(--main-color);
}
.order_history_status{
    text-align: right;
}
.order_history_item_product{
    display: flex;
    align-items: center;
    margin-bottom: 16px;
}
.order_history_product_pic{
    flex: 1;
    display: flex;
}
.order_history_product_pic span+span{
    margin-left: 16px;
}
.order_history_product_all .more_link{
    padding: 0;
    margin-left: auto;
}
.order_history_item_info{
    padding: 16px 0;
    border: solid 1px var(--light-color);
}
/*訂單紀錄詳細內容*/
.orderd_page{
    padding-top: 32px;
    padding-bottom: 48px;
}
.order_status_card{
    background-color: var(--light-color);
    border-radius: 8px;
    padding: 12px 16px;
}
.order_status_card h5{
    color: var(--main-color);
    font-weight: 600;
}
.order_status_date_box{
    display: flex;
    align-items: center;
}
.order_status_date_list{
    flex: 1;
    margin-top: 12px;
}
.order_status_icon_bg{
    width: 74px;
    height: 74px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    border-radius: 100%;
}
.order_status_icon_bg img{
    width: 32px;
}
.order_status_date_item{
    position: relative;
    margin-left: 8px;
    padding-left: 24px;
}
.order_status_date_item:not(:last-child){
    border-left: solid 1px var(--main-color);
    height: 56px;
}
.order_status_date_circle{
    position: absolute;
    top: 0;
    left: -8px;
    width: 16px;
    height: 16px;
    border: solid 1px var(--main-color);
    border-radius: 100%;
    background-color: var(--light-color);
}
.order_status_date_circle.active::before{
    content: "";
    display: block;
    margin:1px;
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background-color: var(--main-color);
}
.order_status_txt{
    line-height: 1rem;
}
.order_status_date{
    color: var(--font-color2);
    margin-top: 4px;
    font-size: 14px;
}
.orderd_page .total_price_box{
    margin-bottom: 24px;
}
.orderd_page .buy_receive_name h5{
    cursor: pointer;
    color: var(--main-color);
}
.orderd_page .product_table_caption{
    -webkit-line-clamp: 1;
}
.orderd_page .buy_receive_table .vet_table_header>div:nth-child(4), .orderd_page .buy_receive_price{
    width: 20%;
}
/*收藏商品*/
.keep_product_list_box{
    padding: 32px 0 48px 0;
}
.keep_product_list_box .product_card{
    margin-bottom: 48px;
}
.keep_product_list_box .product_list_table .vet_table_header>div:nth-child(4), .keep_product_list_box .product_table_price{
    width: 15%;
}
/*個人資料*/
.member_info_nav{
    margin-top: 16px;
}
.member_info_box{
    margin-top: 40px;
    padding-bottom: 16px;
}
.member_line_card{
    margin-top: 16px;
    background-color: var(--light-color);
    background-image: url(../img/line-bg.svg);
    background-position: right bottom;
    background-repeat: no-repeat;
    border-radius: 16px;
    padding: 12px 16px;
    color: var(--main-color);
    letter-spacing: 1.2px;
    max-width: 400px;
}
.member_line_card h5{
    font-weight: 600;
}
.member_line_row{
    font-size: 14px;
    margin-top: 16px;
}
/*會員註冊*/
.signup_page_title{
    margin-top: 32px;
    text-align: center;
    color: var(--main-color);
}
.signup_content{
    margin: 24px auto 0 auto;
    padding:32px 0 16px 0;
    max-width: 700px;
}
.signup_form{
    margin: 40px auto 0 auto;
    padding-bottom: 48px;
    max-width: 700px;
}
.verification_code {
    width: 100px;
    height: 48px;
    border-radius: 5px;
    text-align: center;
    line-height: 48px;
    letter-spacing: 5px;
    background-color: #E3E3E3;
    color: #fff;
    font-style: italic;
    font-weight: 500;
    background-image: url(../img/verification-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}
.vet_onlycolor_btn{
    min-width: 80px;
}
.signup_success_box{
    width: 100%;
    max-width: 500px;
    margin: 0 auto 64px auto;
}
.signup_success_img{
    max-width: 500px;
    padding-top: 128px;
    margin-bottom: 64px;
}
.signup_success_img img{
    width: 100%;
}
.signup_success_txt h2{
    text-align: center;
    color: var(--main-color);
}
.signup_success_txt p{
    text-align: center;
    color: var(--font-color2);
    margin-top: 16px;
}
.go_signup_box{
    padding-top: 100px;
    margin-bottom: 64px;
    text-align: center;
}
.go_signup_synopsis{
    margin-bottom: 64px;
}
.go_signup_qrcode{
    margin-bottom: 48px;
}
.go_signup_qrcode img{
    width: 100%;
    max-width: 260px;
}
/*404頁面*/
.error_page{
    padding-top: 64px;
}
.error_content{
    margin-bottom: 64px;
}
.error_img{
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}
.error_txt{
    margin-top: 32px;
    text-align: center;
    color: var(--main-color);
}
.error_txt p{
    margin-top: 16px;
    text-align: center;
}
.error_btn{
    margin-top: 24px;
    text-align: center;
}
.error_page_hr{
    position: relative;
    max-width: 1440px;
    width: 100%;
    margin: 0 auto;
}
.error_page_hr::before{
    content: '';
    background: linear-gradient(to right, transparent, var(--main-color2), transparent);
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    z-index: 2;
    opacity: .7;
}
.error_page_hr::after{
    content: '';
    position: absolute;
    left: 0;
    bottom: -4px;
    width: 100%;
    height: 2px;
    z-index: 3;
    background-color: var(--light-color);
}