@charset "utf-8";

@font-face {
  font-family: 'Noto1';
  src: url( "../note/creamfont-2.0.otf");
}
@font-face {
  font-family: 'Noto2';
  src: url( "../note/creamfont-2.0.otf");
}
input, button, textarea, select, optgroup, option {
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	font-weight: inherit;
	border: none;
	
}
input[type="submit"], input[type="button"] {
	cursor: pointer;
}
/*reset*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0;
	
}
/*table {
	border-collapse:collapse;
	border-spacing:0;
}*/
fieldset, img {
	border: 0;
	padding: 0;
	margin: 0;
}
address, caption, cite, code, dfn, em, /*strong,*/ th, var {
	font-style: normal;
	font-weight: normal;
}
ol, ul {
	list-style: none;
	padding-left: 0;
}
caption, th {
	text-align: left;
}
/*h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}*/
q:before, q:after {
}
abbr, acronym {
	border: 0;
}
* {
	margin: 0;
	padding: 0;
}
img {
	/*max-width: 100%;*/
	border: 0;
	vertical-align: middle;
}

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

/*開頭設定*/

body {
	/*font-family: Microsoft JhengHei, "微軟正黑體";*/
	font-family:"Noto1", "微軟正黑體", sans-serif;
	font-weight: normal;
}
a {
	text-decoration: none;
	color: #837e64 ;transition: all 0.6s ease 0s;
}
a:hover {
	color: #000;
}
.web_img {
	display: block!important;
}
.photo_img {
	display: none!important;
}
.w_100 {
	max-width: 1170px;
	margin: 0 auto;
}
.w_100w {
	max-width: 1400px;
	margin: 0 auto;
}
.w_100s {
	max-width: 1024px;
	margin: 0 auto;
}
.w_all {
	width: 100%;
	overflow: hidden;
}
.tit_p {font-family: 'Noto1', sans-serif;}
.tit_p2 {font-family: 'Noto2', serif;}
h1, h2, h3, h4 { font-weight: normal;}
/*MENU*/
header {
	width: 100%;
	height: 80px;
	background-color: rgba(255,255,255,0.9);
	position: fixed;
	left: 0;
	right: 0;
	top: -80px;
	z-index: 800;
	animation-name: TT_00;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
}
.logo {
	float: left;
	display: flex; justify-content: center; align-items: center;
}

.logo img {  height: 60px; max-height: 60%;}

/*選單*/
.menu { display: flex;font-family:"Noto2"; font-weight: 400; height: 80px;}
.menu ul {
	float: right;
}
.menu li {
	float: left;
}
.menu li a {
	line-height: 80px;
	color: #1b1b1b;
	font-size: 18px;
	display: inline-block;
	padding: 0 7px;
	text-align: center;
	
}

/*.my_sv {  display: flex; align-items: center; justify-content: center;position: fixed; right: 0; top:0 ;}
.my_sv i { width: 80px; height: 80px; line-height: 80px;}*/

/*會員登入快速鍵*/
.menber_ber { height: 80px;width: 150px;}
.menber_ber ul {display: flex; align-items: center;justify-content: space-around; position: fixed; right: 30px; top: 0; }

.menber_ber ul ul { right: auto;}
.menber_ber li { width: 30px;height: 80px;}
.menber_ber li ul li { min-width: 120px!important;height: auto;}
.menber_ber .navbar .dropdown ul {left: 120px!important;}
.navbar .menber_ber li {width: 50px;}
.menber_ber li a {width: 50px;}
.menber_ber li i { font-size: 18px!important;}

.navbar .menber_ber li.btn_tog  {display: none;}
/*選單手機板*/

@media all and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
	
	.menu  ul { width:100%; float:none; position:fixed; left:0; right:0; top:45px;  display:none;}
	.menu li { width:100%; float:none;  background-color:#FFF;}
	.menu  li:before{content: ""; display:none;}
	.menu  li a { width:100%; line-height:normal; padding: 10px 0;max-width:inherit;}
	.menu li ul li { background-color: transparent;}
	
	.list_1b a , .list_2b a{pointer-events:none;}
	
	/*選單第二層*/
	.menu li.list_1a:hover ul.list_1b, .menu li.list_2a:hover ul.list_2b{display:none;}

	.menu li.list_1a.open:hover ul.list_1b, .menu li.list_2a.open:hover ul.list_2b {display:block;}
	.menu li ul.list_1b, .menu li ul.list_2b {  position: inherit; left: 0; right: 0; top: 0; background-color: #8A3839; }
	
	/*選單第三*/	
	
	.btn_rr { display: flex; align-items: center;}	
	.my_sv i { width: 45px; height: 60px; line-height: 45px; right: 50px;}
	/*會員登入快速鍵*/
	.menber_ber { }
	.menber_ber ul { width: 200px;position: fixed !important; right: 0; top: 0; left: auto;height: 45px; display: flex!important; border-bottom: 1px solid #A0A0A0;}
	
	.menber_ber li { width: 50px; background-color: transparent;height: 45px;}
	.navbar .menber_ber li.btn_tog  {display: block;}
	.navbar-mobile .menber_ber li.btn_tog  { position: fixed; right: 0; top: 0;}
}

/*選單動態*/
@keyframes TT_00 {
 0% {
top:-80px;
}
 95% {
top:5px;
}
 100% {
 top:0px;
}
}

/*==============================================================
                  首頁
==============================================================*/
/*輪播*/
.photo_box {
	
}
.int_photo0 {height: 540px;overflow: hidden;margin-top: 80px;}
.int_photo0 .owl-carousel .owl-stage-outer { z-index: 10;}

.int_photo0 .owl-item { opacity: 0.5;transition: all 0.5s ease 0s; z-index: 10;}
.int_photo0 .owl-item.active {opacity: 1;}

.int_photo0 .owl-nav { font-size: 60px; color: #FFF;}
.int_photo0 {position: relative;}

.int_photo0 .owl-prev { position: absolute; left: 0;top: -30px; bottom: 0; width: 5vw;transition: all 0.5s ease 0s; opacity: 0.5; z-index: 20;}
.int_photo0 .owl-prev:hover { background-color: transparent!important;  opacity: 1;}
.int_photo0 .owl-next { position: absolute; right: 0;top: -30px; bottom: 0; width: 5vw;transition: all 0.5s ease 0s; opacity: 0.5;z-index: 20;}
.int_photo0 .owl-next:hover { background-color: transparent!important;  opacity: 1;}



/*首頁內容*/
.content { padding: 60px 0 80px 0;}
.tit_01 { text-align: center;font-family: "Noto2", sans-serif; margin-bottom: 40px;}
.tit_01 p { font-size: 28px;}
.tit_01 i { background-color: #a2a08a; width: 70px; height: 6px; display: inline-block;}
.tit_01 span { width: 100%; display: block; font-size: 16px; padding-top: 40px;}
/*最新消息*/
.news_box { padding-bottom: 60px;}
.news_list { width: 830px; margin: 0 auto; max-width: 90vw;}
.news_list li {position: relative; border-bottom: 1px dashed #97968c; padding: 15px; font-size: 18px;}
.news_list li a { position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%;}
.news_a1 {  display: flex; align-items: center;}
.news_a1 span { width: 200px; text-align: center; display: inline-block;}
.news_a1 i { font-style: normal; padding: 0 10px; border-left: 1px solid #515151;border-right: 1px solid #515151;}
.news_a1 p { padding-left: 20px;}
.news_list li:hover { color: #7f795b;}

.more_R { text-align: right; display: inline-block; width: 100%;}
.more_R a { color: #837e64; padding: 10px 20px;display: inline-block;}
.more_C { text-align: center;}
.more_C a { padding: 5px 40px; border: 1px solid #a39f8f; color: #000;}
.more_C a:hover { background-color: #a39f8f;color: #FFF;}

/*關於我們*/
.about_box { display: flex; align-items: stretch; justify-content: space-between; background-color: #eeede9; margin-bottom: 60px; width: 100%; overflow: hidden;}
.about_box img { max-width: 100%;}
.about_one { width: 33%;   overflow: hidden; position: relative;}
.about_one2 { position: inherit;}
.about_one .tit_01 { padding-top:30%;}
.key_list { text-align: center; position: absolute; width: 100%; left: 0; right: 0;bottom: 5px;font-size: 16px;font-family: "微軟正黑體"; }
.key_list li { display: inline-block; padding: 0 5px ; }


/*精選文章 三排*/
.blog_box { padding: 10px 0 60px 0;}
.list_3 { display: flex; justify-content:flex-start; max-width: 90vw; margin: 0 auto;}
.list_3 li { width: 30%; margin-bottom: 20px; padding:0 1.5%;}
.one_box { position: relative;}
.one_box a { position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%;z-index: 20;}
.one_tag {position: absolute; left: 0; top: 40px; padding: 5px;z-index: 19;background-color: #2F66C5; color: #FFF; width: 100px; text-align: center;}
.one_tag2 { background-color: #a2a08a;}
.one_img { overflow: hidden; display: flex; align-items: center; justify-content: center; /*height: calc(100vw/3);*/ max-height: 400px; }
.one_img img {transition: all 0.5s ease 0s; z-index: 10; max-width: 100%;}
.list_3 li:hover .one_img img, .list_4 li:hover .one_img img {
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	transform: scale(1.2);}

.one_tit { padding: 10px 0; font-size: 20px; }
.one_tit p { padding-top: 25px;}
.one_tit span { background-color: #a29f8e; color: #FFF; padding: 5px 20px; display:inline-block; margin-top: 20px;}
.one_tit span.sty2 { background-color: #FFF; color: #a29f8e; border: 1px solid #a29f8e;padding: 3px 10px; display:inline-block; font-size: 18px;}
.one_tit i { width: 50px; height: 1px; background-color: #262626; display:inline-block;}

.one_txt{overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2; /*行數*/
  -webkit-box-orient: vertical;
  white-space: normal;}
/*四排*/
.list_4 { display: flex; flex-wrap: wrap; justify-content: flex-start; max-width: 90vw; margin: 0 auto;}
.list_4 li { width: 23%;margin-bottom: 50px; padding:0 1%;}
.list_4 li .one_img { height: calc(100vw/4); max-height: 300px; border: 1px solid #eee;}
.one_tit2 { text-align: center; font-family: "Noto2", sans-serif;padding: 20px 0; font-size: 20px;}
.one_tit3 { text-align: left; padding: 20px 0; font-size: 18px;}
.one_tit3 .news_a1 { display: flow-root;}
.one_tit3 .news_a1 span { width: auto;}
.one_tit3 .news_a1 p { width: 100%; display: inline-block; padding-left: 0; padding-top: 5px;}

/*==============================================================
                  內頁
==============================================================*/

/*標題*/
.tit_top { display: flex; align-items: flex-end; width: 100%; justify-content: space-between; background-color: #f1ece3;}
.tit_top_img { height: 220px; overflow: hidden;}
.tit_top h2 { width: 270px; text-align: right; font-size: 30px; padding:0 20px 100px 0;}
.tit_top_img h2 {padding:0 20px 50px 0;}
.tit_img { width: calc(100% - 280px);}
.tit_img img { max-width: 100%;}

/*無圖標題*/
.tit_top2 {  background-color:#a2a08a; color: #FFF; }
.tit_top2 h2 {padding-top: 110px;padding-bottom: 20px;}
.tit_list { text-align: center; margin-bottom: 20px;}
.tit_list li { display: inline-block;margin-bottom: 20px;}
.tit_list li:hover, .tit_list li.on {  border-bottom: 3px solid #a2a08a;}
.tit_list li a { padding: 5px 10px;}


.news_page_tit { text-align: center; font-style: normal;}
.news_page_tit i {background-color: #a2a08a; width: 70px; height: 6px; display: inline-block;}
.news_page_tit span { width: 100%; display: inline-block; color: #a2a08a;}
.news_page_tit p { padding: 10px 0;}

/*文章分類*/
.list_class { padding-bottom: 40px;}

.list_class p { text-align: center; letter-spacing: 2px; color: #999; font-size: 15px; padding-bottom: 15px;}
.list_class ul {width: 60%;
   width: 60%;
    margin: 0 auto;
    padding: 0;
    list-style-type: none;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    -js-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-weight: 500;
   
}
.list_class ul li {font-size: 18px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    -js-display: flex;
    display: flex;
    margin-bottom: 0.8rem;cursor: pointer;}
.list_class ul li a{ color: #666}
.list_class ul li:hover a, .list_class ul li:hover{ color: #837e64}
.list_class ul li::after {
    content: '';
    display: block;
    width: 1px;
    height: 90%;
    background: #65676d;
    margin: 0 1rem;
    -webkit-transform: rotate(26deg);
    -moz-transform: rotate(26deg);
    -ms-transform: rotate(26deg);
    -o-transform: rotate(26deg);
    transform: rotate(26deg);
}
.list_class ul li:last-child::after {content:none;}
.list_class ul li.active a, .list_class ul li.active {
    color: #837e64;
    position: relative;
}
.list_class ul li.active::before{
    content: '';
    display: block;
    width: 70px;
    height: 2px;
    background: #837e64;
    position: absolute;
    bottom: -8px;
	left: 0; right: 0;
}
/*圖文編輯 破版*/
.text_page01{display: flex;
    position: relative;
    align-items: flex-end;
    width: 920px;
    max-width:90vw ;
    height: 420px;
    margin: 0 auto;
overflow: hidden;}
.txt_img01 {position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
	z-index: 1;
    }
.txt_img02 {position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
	z-index: 1;
    }
.txt_img02 img {width: 100%;}
.txt_img01 img { height: 100%; max-height: none;}
.txt_01{flex: 0 0 50%;
    max-width: 50%; z-index: 3; color: #343436;}
.txt_01_in { padding: 40px 0;
    /*font-weight: 700;*/}
.txt_01 h3 {font-size: 2rem;
    letter-spacing: 2px;}
.txt_01 h4{font-size: .9rem; line-height: 24px; /*font-weight: 600;*/
   }
.txt_01 p {margin-top: 0;
    margin-bottom: 1rem; line-height: 32px;}

/*圖文編輯*/
.page_RL {display: flex;align-items: flex-start; width: 100%; color: #3e3a39; justify-content: space-around; }
.page_RL2 {align-items:stretch;}
.img_R {flex: 0 0 50%;
    max-width: 45%; width: 800px; padding-right: 20px; }
.img_R .flex-direction-nav a:before { color: #FFF;font-size:20px; }
.img_R .flex-direction-nav a { width: 20px; height: 20px;}
.img_R .flex-direction-nav .flex-prev { left: 20px;}
.img_R .flex-direction-nav .flex-next { right: 20px;}
.txt_L {flex: 0 0 40%;
    max-width: 40%; }
.txt_L h3 { font-size: 40px; font-weight: normal;padding-bottom: 50px;}
.txt_L h4{ font-size: 40px; font-weight: normal;padding-bottom: 20px;}
.txt_L p {font-size: 18px; line-height: 36px; }

/*購物專區*/
.shop_inf {}
.shop_inf_in {}
.shop_inf p { font-size: 25px;}
.shop_5b, .shop_5a {padding-bottom: 20px; font-size: 20px;}
.shop_5a span { font-size: 15px; color: #515151;padding-right: 10px;}
@media screen and (max-width:760px) {
	.shop_inf .btn_next {text-align: center;}
	.list_class2 {padding-bottom: 0;padding-top: 40px;}
	.int_photo0 {margin-top: 0;height:auto;}
}
/*最新消息圖文*/
.news_page_txt { text-align: left; width: 90%; margin:  0 auto; padding-top: 20px; line-height: 36px; }
.news_page_txt2 {text-align: left;  margin: 60px auto; padding-top: 20px; line-height: 36px;}
.news_page_txt img { max-width: 100%;}
.news_page_txt2 img {margin: 0 auto; text-align: center;max-width: 100%;}
.news_img img { max-height: calc(100vh/1.5);}
.news_img { text-align: center; padding-bottom: 20px;}

/*表單*/
.form { width: 90%; margin: 0 auto; background-color: #f1ece3; padding: 40px 20px; margin-top: 40px;}
.form p {  text-align: center;
    letter-spacing: 2px;
    color: #999;
    font-size: 20px;
   padding-bottom: 40px;}
.form ul { display: flex; flex-wrap: wrap; align-items: center;justify-content: space-between; }
.form li { width: 100%;display: flex;flex-wrap: wrap; padding-bottom: 10px;}
.form li.form_2 { width: 48%;}
.form li label { width: 100%; padding-bottom: 10px;}
.form li input, .form li textarea { width: 100%; padding: 10px 10px 10px 0.6rem;
    letter-spacing: 1px;color: black;
    font-size: 15px;border: 1px solid #eee;
    outline: none;appearance: none !important;}
.form li textarea { height: 150px;}
/*問答=========================================================================*/
#qaContent {
	width: 100%;
	min-height: 500px;
}
#qaContent ul.accordionPart {
	margin: 20px;
}
#qaContent ul.accordionPart > li {
	border-bottom: solid 1px #C7C7C7;
	padding-bottom: 12px;
	margin-top: 12px;
}
#qaContent ul.accordionPart li .qa_title {
	color: #444444;
	cursor: pointer;
	padding: 10px 0 ;
	font-size: 20px;
}
#qaContent ul.accordionPart li .qa_title span { width: 30px; height: 30px; line-height: 30px; text-align: center;color: #FFF; background-color: #837e64;  display: inline-block; border-radius: 5px; margin-right: 10px;font-size: 20px;}

#qaContent ul.accordionPart li .qa_content {
	margin: 6px 0 0 0;
	padding: 10px 0;
	color: #666;
	position: relative;
	font-size: 18px;
	line-height: 36px;
}
#qaContent ul.accordionPart li .qa_content span { width: 30px; height: 30px; line-height: 30px; text-align: center;color: #FFF; background-color: #E88104;  display: inline-block; border-radius: 5px; margin-right: 10px;font-size: 20px; position: absolute; left: 35px;}


/*==============================================================
                  會員專區
==============================================================*/
/*登入*/
.login_box { border: 1px solid #a2a08a; border-radius: 20px; margin: 0 auto; width: 600px; padding: 20px 40px;max-width:calc(90vw - 80px);}
.tab_r { color: #A70002;}
.tab_tit { text-align: center; font: 24px; color: #9d8465; }
.tab_tit h2::after {content: "";width: 50px; height: 3px; background-color: #9d8465 ;border-radius: 5px;display: block; margin: 20px auto;}
.tab_one { padding: 10px 0;}
.tab_one input { border-bottom:1px solid #a2a08a; width:calc(100% - 20px) ; padding: 10px;margin-bottom: 10px; }
.tab_one input:focus {border:1px solid #a2a08a;}


.inp_tag {display: flex; justify-content:space-around;}

.btn_sty0 { width: 100%; height: 45px; line-height: 45px; background-color: #ba9f72; color: #FFF;margin-bottom: 10px;}
.btn_sty0:hover { background-color: #64502d;}
.btn_sty2 { background-color: #00B900;}
.btn_stymin { width: 300px;}


/*會員資訊*/
.mem_page { display: flex; justify-content: space-between; align-items: stretch;}
.mem_page2 {flex-direction:row-reverse;}
.mem_info {border: 1px solid #a2a08a; border-radius: 20px;  width: 250px; padding: 20px;}
.mem_tit { color: #9d8465; position: relative; font-size: 25px; padding-bottom: 30px;}
.mem_tit::after {content: "";width: 5px; height: 30px; background-color: #9d8465 ; position: absolute; left: -20px; top: 0;}
.mem_info_in {padding-bottom: 20px;}
.mem_one { display: flex;align-items: center;}
.mem_t { width: 120px; color: #9d8465;}
.mem_p { width: 100%; color: #2D2D2D;}
.mem_info li {border-bottom: 1px solid #f1ece3; padding: 10px 0;}

.shop_box { width: calc(100% - 380px); background-color: #f1ece3; padding: 20px;min-height: 500px;}
.mem_tit2 { color: #2D2D2D; position: relative; font-size: 25px; padding-bottom: 30px; display: flex; justify-content:flex-start; align-items: center; flex-wrap: wrap;}
.mem_sv { font-size: 15px; margin-left: 20px;}
.open_list { display: flex; justify-content: space-between; align-items: center;}
.open_list span { font-size: 12px; background: #a2a08a; padding: 5px 10px; color:#FFF; border-radius: 5px; display: none;}

/*購物車*/
.mycar_page { width: calc(100% - 380px); background-color: #f1ece3; padding: 20px;}
.shop_list {}
.shop_list li { padding: 20px 0; border-bottom: 1px #a2a08a dashed;}
.mem_text {padding-bottom: 20px;}
/*購物欄位*/
.shop_one { display: flex; justify-content: space-between; align-items: center;}
.shop_1 { width: 50%;display: flex; justify-content: flex-start; align-items: center;}
.shop_1a { padding-right: 20px;}
.shop_1a img {width: 120px; height: auto;}
.shop_1b p{padding-top: 10px;}
.shop_2 { width: 50%;display: flex; justify-content: space-between; align-items: center;}
.shop_2a, .shop_2b { padding-right: 10px;}
.shop_2a span, .shop_2b span { color: #3D3D3D;font-size:12px; padding-right: 10px; }
.shop_2c { width: 120px; text-align: center;}
.total_box { text-align: right;padding: 20px 0;}
.shop_3a { padding-bottom: 10px; color: #B50003;}
.shop_3b { padding-bottom: 20px;}
.icon_hd { font-size: 13px;  font-style: normal;}
.colo_a { color: #4A7EBB;}
.colo_b { color: #587349;}
.shop_3a, .shop_3b, .shop_3c { display: flex;justify-content: flex-end; align-items: center;}
.total_box2 div {justify-content:space-between;padding: 10px 0; border-bottom: 1px solid #d3c2a5;}
/*結帳欄位*/
.mem_info2 {width: 45%; padding: 20px;}
.shop_box2 { width: 45%; border-radius: 20px;}
.shop_box2 .shop_1a img {width: 40px;}
.shop_box2 .shop_list li { padding: 10px 0;}
.shop_box2 .shop_1 { width: 35%;}
.shop_box2 .shop_2 { width: 60%;}

.inp_p { width: 80%; padding: 5px; border: 1px solid #9d8465; border-radius: 5px; background-color: #FFF;}
.inp_p2-1 label {padding-right: 10px;}
.inp_p2 {}
.add_list { background-color: #f1ece3; border-radius: 20px; padding: 20px 40px; width: calc(100% - 80px); }
.add_list li {font-size: 15px; border-bottom: 1px solid #BFBFBF;}
.add_list li a {width: 100%; display: inline-block;padding: 10px 0;display: flex;justify-content: space-between;align-items: center;}
.add_list li p { width:calc(100% - 60px);display: flex;justify-content: flex-start;align-items: center;}
.add_list li i {font-style: normal;padding-right: 10px; color: #9d8465;display: inline-block;}
.add_list li span {background-color: #9d8465; color: #FFF;font-size: 12px;padding: 5px 10px;}
.add_one { border: 1px solid #BFBFBF; border-radius: 5px; padding: 10px; margin-bottom: 10px; width: calc( 100% - 20px);}
.mem_p2 { display: flex; justify-content: space-between; flex-wrap: wrap; }
.add_one2 { width: calc(30% - 20px);}
.txt_gl { font-size: 12px; color: #A0A0A0;padding-bottom: 5px;} 
.ant-btn3 { width:100%;}
.txt_red { color: #CC0003;}
.ant-btn32 {padding: 5px 0;}
/*按鈕開關樣式*/
.inp_tag label{width: 45%;}
#radio input[type="radio"] {display: none; }
#radio input:checked + .button {background: #5e7380; color: #fff; cursor: default; }
#radio .button {display: inline-block;  width: 100%; padding: 15px 10px; background: #f7f7f7;border: 1px solid #5e7380;color: #333; cursor: pointer;text-align: center; }
#radio .button:hover {background: #bbb; color: #fff; }
#radio .round {border-radius: 5px; }
@media screen and (max-width:760px) {
	.inp_tag {display: flow-root;}
	#radio .button {margin-bottom: 10px; width:calc(100% - 20px);}
}
/*上架開關*/
.switch {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 24px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 34px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 2px;
  top: 2px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 50%;
}

input:checked + .slider {
  background-color: #9d8465;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/*訂購紀錄*/
.shop_4 { display: flex; justify-content: space-between; width: 100%; }
.shop_4 div span { font-size: 13px; color: #3D3D3D; padding-right:10px; }
.like_line {text-decoration:underline;}
.shop_ord li{ border-bottom: 1px #a2a08a dashed; padding: 10px 0; }
.ant-btn2 {border: 1px solid #ba9f72; border-radius: 5px; padding: 5px 10px; background-color: #FFF;font-size: 18px;font-style: normal;}
.ant-btn2 i {font-style: normal;}
@media screen and (max-width:760px) {
	.mem_tit2 { justify-content: space-between;width: 100%;}
	.mem_tit2s { display: flow-root;padding-top: 40px;}
	.mem_page { display: flow-root;padding-top: 40px;}
	.shop_box2, .mem_info2 { width:calc(100% - 40px); margin-bottom: 40px;}
	.shop_box2 .shop_1 { width: 100%;}
	.shop_list2 { display: none;}
	.open_list { width: 100%;}
	.open_list span { display: block;}
	.shop_one, .shop_2 { display: flow-root;}
	.shop_one { position: relative;}
	.shop_2c { position: absolute; right: 10px; top:0; width: auto; height:auto; background-color: #ba9f72; color: #FFF;}
	.shop_2c i {padding: 10px 5px;}
	.shop_2c a {color: #FFF;}
	.shop_1, .shop_2 { width: 100%;}
	.shop_1 {padding-bottom: 10px;}
	.shop_2, .shop_3a { font-size: 18px;}
	.shop_2a { padding-bottom: 10px; display: flex; align-items: center;justify-content: flex-start; }
	.shop_2a span, .shop_2b span { font-size:15px; }
	.ant-btn2 { width: calc(100% - 60px); }
	.shop_4 { display: flow-root;}
	.add_one2 { width: 100%;}
	.mem_info, .shop_box { width: auto;}
	.mem_info {margin-bottom: 10px;}
	.add_list {padding: 10px 20px; width: calc(100% - 40px); }
	
}
.box { display: none;}

.mem_info3 {width: 100%; padding: 20px;}
/* 地址=========================================================================*/
.add_box { width: 800px; max-width: 90%; margin: 0 auto;}
.w_1002 {width: 800px; max-width: 90%; margin: 0 auto;}
.add_one3 { border: 1px solid #d5c3ad;  background-color: #f1ece3;border-radius: 20px;margin-bottom: 20px; overflow: hidden; display: flex; justify-content: space-between;}
.add_box .add_one3:first-child {background-color: #FFF;}
.add_new {width: 80%;padding: 20px 40px;}
.add_new li { margin-bottom: 10px;}

.add_btn { width: 20%; background-color:#d5c3ad; display: flex;  align-items: center; justify-content: center; flex-wrap: wrap; }
.add_btn_in { text-align: center;}
.add_btn a {padding: 10px 20px; text-align: center; color: #FFF; background-color: #9d8465; display: inline-block; margin: 0 auto;margin-bottom: 10px; }
.add_btn2 { display: flex; justify-content: flex-end; padding-bottom: 10px;margin-right: 10px;}
.add_btn2 a {padding: 10px 20px; text-align: center; color: #FFF; background-color: #9d8465; margin-bottom: 10px;  }
.mem_sv2 { width: 50%; height: 35px; display: flex; justify-content:flex-start; align-items: center; font-size: 13px;}
.mem_sv2 input{border: 1px solid #9d8465;border-radius: 5px; padding: 10px; margin-left: 20px;}
.mem_sv2 .btn_sv {margin-left: 10px; margin-top: 0;width: 80px;}

@media screen and (max-width:760px) {
	.add_one3 { display: flow-root;}
	.add_btn { width: 100%;padding: 20px 0;}
	.add_new { padding: 10px 20px; width:calc(100% - 40px) ;}
	.mem_sv2 { width: 100%;margin-top: 10px;}
	.mem_sv2 input { margin-left: 0;}
	.mem_info3 { width: auto;}
}

/* 日曆選取=========================================================================*/

.stop_sadd { background-color: #f1ece3; padding: 10px 20px; border-radius: 20px; margin-bottom: 10px;}
.calendar-wrapper {
  width: 95%;
	margin: 0 auto;
  font: 100% system-ui;
	border: 2px solid #f1ece3;text-align: center;
}
.cal_tit { text-align: center; font-size: 18px; padding: 20px 0; display: flex; justify-content: space-between; align-items: center;}
.calendar {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}

.first-day {
  grid-column-start: 2;
}


.day-name {
  background: #f8e9d4;
	 
}
.day-gre {background: #eee;}
.day-no {
  background:#f6d7d7;
	 
}
.day_sty { font-size: 13px; padding: 10px 5px;}

/*版權======================================*/
footer {
	width: 100%;
	clear: both;
	background-color: #eeede9;	
}

.footer_box { display: flex;}
.logo2 {width: 287px; text-align: center;}
.logo2 img { width: 250px;}
.footer_box_in { width: 60%; padding-top:40px;font-size: 18px;font-family: "Noto1", sans-serif;  text-align: center;}
.footer_box_in ul { text-align: center; padding-bottom: 10px; }
.footer_box_in li { display: inline-block;}
.footer_box_in li a { color: #000;}
.footer_box_in li::after {
	content: "-"; padding: 0 10px;}
.footer_box_in li:last-child:after {content: "";}

/*左右兩個*/
.footer_box2 {display: flex; justify-content: center; padding: 20px 0; margin: 0 10px;}
.store_one {display: flex; justify-content: space-between;  border: 2px solid #FFF; border-radius: 15px; padding: 20px; margin: 0 10px;}
.sto_1 li { display: inline-block; padding: 0 5px; text-align: center;font-size: 12px;}
.sto_1 li i {width: 40px; height: 40px; font-size: 40px;color:#9c9c9c;}
.sto_1 li i:hover {color:#837e64;}
.sto_1 ul {display: flex; align-items: flex-start;justify-content: center;}
.foot_DW { background-color: #c4c4c4; color: #000; font-size: 15px; padding: 10px 0; text-align: center;}
.sto_2 {display: flex; justify-content: center;}
.sto_2 p { padding: 0 5px 0 0;}

/*搜尋頁面*/
.sv_pop { position: fixed; width: 100vw; height: 100%; left: 0; right: 0; top: 0; bottom: 0;  background-color: rgba(255,255,255,0.9); z-index: 1000; display: none;}
.sv_box { max-width: 90vw; height: 100%; width: 460px; margin: 0 auto; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; }
.sv_box input { border: none;
    border-bottom: 2px solid #a2a08a;
width: 100%;
    text-align: center;
	font-size: 18px;
    letter-spacing: 1px;
    background: transparent;
	transition: all 300ms;
    margin-top: 2rem;
	padding: 10px 0;
}
.sv_box input:focus {outline: none;border: 1px solid #a2a08a; border-bottom: 2px solid #a2a08a; }
.sv_pop i {position: fixed;
    top: 10px;
    right: 10px;
    width: 45px;
color: #a2a08a;
font-size: 45px;transition: all 0.5s ease 0s;}
.sv_pop i:hover { background-color: #a2a08a; color: #FFF;}
.btn_sv {border: none; background-color:#a2a08a; margin-top: 20px; width: 100%; display: block; text-align: center; padding: 10px 0; color: #FFF; }
.btn_sv:hover {background-color:#74725a;}

/*通知視窗*/
.pop_box {position: fixed;left: 0; right: 0;top: 0; bottom: 0; width: 100vw; height: 100vh; background-color: hsla(0,0%,0%,0.8);display: flex;justify-content: center; align-items: center;z-index: 400;}
.pop_box_in {width:800px;background-color: #FFF; border-radius: 10px;max-width: 90vw; }
.pop_text2 {padding: 20px; }
.pop_text2 p, .pop_text2 ul  {padding-bottom: 20px;}
.pop_text2 li {padding-bottom: 5px; flex-wrap: wrap; display: flex;align-items: stretch; }
.pop_text2 ul ol {padding: 10px 0;padding-left: 20px;}
.pop_text2 li i {color:#ba9f72;font-size: 12px; padding-right: 5px;}
.pop_text2 li span {width:calc(100% - 40px) ;}
.btn_cc {text-align: center;}
.btn_cc2 {margin:0 auto;}

/*數字頁*/
.page-no {
	clear: both;
	padding: 30px 0;
	overflow: hidden;
}
.no_box {
	clear: both;
	margin: 0 auto;
	position: relative;
	padding: 20px 0;
	text-align: center;
	color: #a2a08a;	
	
}
.no_box select {color: #7b7a6a; padding: 0 10px; }
.no_box a { padding: 3px 10px;border-right: 1px solid #a2a08a; }
.no_box ul {
	text-align: center;
	position: relative;
}
.no_box li {
	display: inline-block;
	height: auto;
	border-left: 1px solid #a2a08a;
	text-align: center;
	
}
.no_box li a {
	margin: 0;
	color: #a2a08a;	
	display: block;
	/*font-weight: bold;*/	
	padding: 0 15px;
}
.no_box li:last-child  {border-right: 1px solid #a2a08a;}
.no_box li a:hover, .no_box li.on a {
	color: #424242;
}
.sel_no { padding: 0 10px; color: #a2a08a;}
.sel_no:hover , .sel_no:hover select{ color: #424242;}
.sel_no select {color: #7b7a6a; padding: 0 10px; }
/*依序出現動態動畫
.hideme
{
    opacity:0.1;
	margin-top: -30px;
	transition: all 0.5s ease 0s;
}
.hideme.hi_L, .hideme.hi_R { margin-top:0; }
.hi_L { margin-left:  -20%;transition: all 1.5s ease 0s;}
.hi_R { margin-right: -20%;transition: all 1.5s ease 0s;}*/
.animate_on {margin-top: 0; opacity:1;}
.animate_on.hi_L { margin-left: 0;}
.animate_on.hi_R { margin-right: 0;}
#gotop {
	width: 40px;
	height: 40px;
	line-height: 40px;
	background-color: rgba(0,0,0,0.8);
	position: fixed;
	right: 0;
	bottom: 0;
	text-align: center;
	color: #FFF;
}

/*loading動畫*/
.at_loading {
  　width:100%; height:100%; position:fixed; left:0; right:0; top:0; bottom:0; z-index:1500; display: flex; align-items: center; justify-content: center; 
   }
.sk-fading-circle {
  margin: 100px auto;
  width: 40px;
  height: 40px;
  position: relative;
	z-index:1501;
}

.sk-fading-circle .sk-circle {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.sk-fading-circle .sk-circle:before {
  content: '';
  display: block;
  margin: 0 auto;
  width: 15%;
  height: 15%;
  background-color: #333;
  border-radius: 100%;
  -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
          animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
}
.sk-fading-circle .sk-circle2 {
  -webkit-transform: rotate(30deg);
      -ms-transform: rotate(30deg);
          transform: rotate(30deg);
}
.sk-fading-circle .sk-circle3 {
  -webkit-transform: rotate(60deg);
      -ms-transform: rotate(60deg);
          transform: rotate(60deg);
}
.sk-fading-circle .sk-circle4 {
  -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
          transform: rotate(90deg);
}
.sk-fading-circle .sk-circle5 {
  -webkit-transform: rotate(120deg);
      -ms-transform: rotate(120deg);
          transform: rotate(120deg);
}
.sk-fading-circle .sk-circle6 {
  -webkit-transform: rotate(150deg);
      -ms-transform: rotate(150deg);
          transform: rotate(150deg);
}
.sk-fading-circle .sk-circle7 {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}
.sk-fading-circle .sk-circle8 {
  -webkit-transform: rotate(210deg);
      -ms-transform: rotate(210deg);
          transform: rotate(210deg);
}
.sk-fading-circle .sk-circle9 {
  -webkit-transform: rotate(240deg);
      -ms-transform: rotate(240deg);
          transform: rotate(240deg);
}
.sk-fading-circle .sk-circle10 {
  -webkit-transform: rotate(270deg);
      -ms-transform: rotate(270deg);
          transform: rotate(270deg);
}
.sk-fading-circle .sk-circle11 {
  -webkit-transform: rotate(300deg);
      -ms-transform: rotate(300deg);
          transform: rotate(300deg); 
}
.sk-fading-circle .sk-circle12 {
  -webkit-transform: rotate(330deg);
      -ms-transform: rotate(330deg);
          transform: rotate(330deg); 
}
.sk-fading-circle .sk-circle2:before {
  -webkit-animation-delay: -1.1s;
          animation-delay: -1.1s; 
}
.sk-fading-circle .sk-circle3:before {
  -webkit-animation-delay: -1s;
          animation-delay: -1s; 
}
.sk-fading-circle .sk-circle4:before {
  -webkit-animation-delay: -0.9s;
          animation-delay: -0.9s; 
}
.sk-fading-circle .sk-circle5:before {
  -webkit-animation-delay: -0.8s;
          animation-delay: -0.8s; 
}
.sk-fading-circle .sk-circle6:before {
  -webkit-animation-delay: -0.7s;
          animation-delay: -0.7s; 
}
.sk-fading-circle .sk-circle7:before {
  -webkit-animation-delay: -0.6s;
          animation-delay: -0.6s; 
}
.sk-fading-circle .sk-circle8:before {
  -webkit-animation-delay: -0.5s;
          animation-delay: -0.5s; 
}
.sk-fading-circle .sk-circle9:before {
  -webkit-animation-delay: -0.4s;
          animation-delay: -0.4s;
}
.sk-fading-circle .sk-circle10:before {
  -webkit-animation-delay: -0.3s;
          animation-delay: -0.3s;
}
.sk-fading-circle .sk-circle11:before {
  -webkit-animation-delay: -0.2s;
          animation-delay: -0.2s;
}
.sk-fading-circle .sk-circle12:before {
  -webkit-animation-delay: -0.1s;
          animation-delay: -0.1s;
}

@-webkit-keyframes sk-circleFadeDelay {
  0%, 39%, 100% { opacity: 0; }
  40% { opacity: 1; }
}

@keyframes sk-circleFadeDelay {
  0%, 39%, 100% { opacity: 0; }
  40% { opacity: 1; } 
}

@keyframes sk-chase {
  100% { transform: rotate(360deg); } 
}

@keyframes sk-chase-dot {
  80%, 100% { transform: rotate(360deg); } 
}

@keyframes sk-chase-dot-before {
  50% {
    transform: scale(0.4); 
  } 100%, 0% {
    transform: scale(1.0); 
  } 
}

/*離場動畫測試*/
.at_loading.closure .sk-fading-circle { animation-name:loadload;
    animation-duration:2s;
	animation-fill-mode:forwards;
}

.load_1, .load_2 { position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    will-change: auto;}
.at_loading.closure .load_1 {animation-name:loadload2;
    animation-duration:1.5s;
	animation-fill-mode:forwards;}
.load_1:before {position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: skewY(2deg) scale(1.1);
    background-color: #a2a08a;
    content: "";}
.at_loading.closure .load_2 {animation-name:loadload3;
    animation-duration:1.5s;
	animation-fill-mode:forwards;}
.load_2:before {position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: skewY(-3deg) scale(1.1);
    background-color: #eeede9;
    content: "";}

.at_loading.closure  {animation-name:loadload0;
    animation-duration:1.5s;
	animation-fill-mode:forwards;}


/*日期選擇樣式=======================================================*/
/*圖文*/
.pop_text { padding: 10px 20px; border-bottom: 1px solid #ccc; padding-bottom: 10px; margin-bottom: 20px;}
.pop_text h3 {text-align: center;border-bottom: 1px dashed #ba9f72;
    border-top: 1px dashed #ba9f72;
    color: #9d8465;
    padding: 8px 0; }
.pop_text p { text-align: right; padding: 5px 0;}
.pop_text span { padding-right: 10px;}
.icon_a1{ font-size: 15px; text-align: left;}
.icon_a1 i { width: 10px; height: 10px; border-radius: 50%; display:inline-block; background-color: #a1a1a9;  margin-right: 5px;}
.icon_a2 {color: #73a05c;}
.icon_a2 i, .btn_ok .day_one { background-color: #73a05c ;}
.icon_a3 {color: #995a5a;}
.icon_a3 i, .btn_no .day_one { background-color: #995a5a;}
.btn_ok, .btn_no { color: #FFF;}
.btn_ok {cursor: pointer;transition: all .3s linear;}
.btn_no {cursor: not-allowed;}
.btn_ok:hover { background-color: #FFFBAC; }

/*月*/
.day_month {display: flex;flex-flow: row nowrap;
    justify-content: space-between; width: 100%; padding: 20px 0; font-size: 24px; }
.day_mo1 { width: 45px; height: 100%; text-align: center;}
.day_mo1:hover { color: #995a5a;}
.day_mo_prev::before{position: relative;
    top: 0;
    content: "<";
    display: inline-block;
    width: 0.6em;
    height: 0.6em;
    border-top: 0.2em solid #d1d1d6;}
.day_mo_next::before{position: relative;
    top: 0;
    content: ">";
    display: inline-block;
    width: 0.6em;
    height: 0.6em;
    border-top: 0.2em solid #d1d1d6;}

.day_mo_next:hover::before, .day_mo_prev:hover::before{
    border-top: 0.2em solid #995a5a;}
/*日*/
.day_content { width: 95%; margin: 10px auto; border: 1px solid #EBEBEB; padding: 10px 0; box-shadow: 0 0 5px #ccc; }
.my_day { background-color: #FFF; width: 80vw; margin: 0 auto;}
.row { display: flex;flex-flow: row nowrap;
    justify-content: center; width: 100%;}
.r-box { width: 100%; height: 12vh; text-align: center; margin: 2px; border: 1px solid #efeff4;}
.r-cell { width: 100%; text-align: center;}
.desktop { width: 100%; }
.desktop i { font-style: normal; padding-right: 5px;}
.day_one { background-color: #efeff4;padding: 5px 0; }
.day_one_txt {padding: 5px; text-align:left;}
.flo_L {  float:left; margin-bottom:10px;}
.flo_L2 { padding-left:10px;}
.w_100 { clear:both; width:100%;}
.w_80 { clear:both; width:80%;}
.w_50 {  width:50%;}
.pd_10 { margin-bottom:10px;}
.txt_CC { text-align:center;}

.page_cc {border-top: 1px solid #ccc; padding: 10px 0;}
.page_cc .btn_buy { max-width: 450px; margin: 0 auto; }
.pay_box_for .infor_list { display: none;}

.pay_box_for input[type="radio"]:checked + .infor_list{
	display: block;
}
@media screen and (max-width:760px) {
.r-box { height: auto;}	
.mobile, .day_weekdays { display: none;}
	.my_day {  width: 100vw;}
	.goods_one { display: inherit;}
	.goods_img, .goods_text { width: 100%;}
	
}

@keyframes loadload0 {
	 0%, 99% {
		 
		  transform:translateY(0%)
    
  } 100% {
    
	  transform:translateY(-120%)
   
	}
}
	
@keyframes loadload {
	 0% {
		 opacity: 100%;
		  transform:translateY(0%)
    
  } 20%, 100% {
    opacity: 0;
	  transform:translateY(-120%)
   
  } 
	
}
@keyframes loadload2 {
	 30% {
		 transform:translateY(0%)
    
  } 80%, 100% {
    transform:translateY(-120%)
   
  } 
	
}
@keyframes loadload3 {
	 10% {
		 transform:translateY(0%)
    
  } 70%, 100% {
    transform:translateY(-120%)
   
  } 
	
}