@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:100,300,400,500,700,900|Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i&subset=chinese-traditional&display=swap');
@font-face{font-family:'SoDoSans'; font-style:normal; font-weight:100; src:url(/Other/www.starbucks/objects/fonts/SoDoSans-Fonts/SoDoSans-Light.woff) format('woff'), url(/Other/www.starbucks/objects/fonts/SoDoSans-Fonts/SoDoSans-Light.ttf) format('truetype'); }
@font-face{font-family:'SoDoSans'; font-style:normal; font-weight:400; src:url(/Other/www.starbucks/objects/fonts/SoDoSans-Fonts/SoDoSans-Regular.woff) format('woff'), url(/Other/www.starbucks/objects/fonts/SoDoSans-Fonts/SoDoSans-Regular.ttf) format('truetype'); }
@font-face{font-family:'SoDoSans'; font-style:normal; font-weight:700; src:url(/Other/www.starbucks/objects/fonts/SoDoSans-Fonts/SoDoSans-Bold.woff) format('woff'), url(/Other/www.starbucks/objects/fonts/SoDoSans-Fonts/SoDoSans-Bold.ttf) format('truetype'); }
@font-face{font-family:'SoDoSans'; font-style:normal; font-weight:900; src:url(/Other/www.starbucks/objects/fonts/SoDoSans-Fonts/SoDoSans-Black.woff) format('woff'), url(/Other/www.starbucks/objects/fonts/SoDoSans-Fonts/SoDoSans-Black.ttf) format('truetype'); }

/*@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC&display=swap');*/
/* reset */
*{ margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent; outline:none; }
html{ -ms-text-size-adjust:100%; -webkit-text-size-adjust:100%; font-size:10px; }
body{ margin:0; font-size:1.6rem; -webkit-overflow-scrolling:touch; text-align:center; background-color:#fff; }
body:after{ content:''; display:block; width:100%; height:1px; clear:both; }
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary,div,a{ display:block; box-sizing:border-box;}
a{ background:transparent; text-decoration:none; color:inherit; cursor:pointer; line-height:1em; display:inline-block;}
a:active{ outline:0; }
b,strong{ font-weight:bold; }
dfn{ font-style:normal; }
img{ border:0; vertical-align:middle; line-height:0; font-size:0; }
input,textarea,button{ border:0; margin:0; padding:0; font-family:'Helvetica Neue',Helvetica,STHeiTi,'Noto Sans TC','微軟正黑體','Microsoft JhengHei','Apple LiGothic Medium',sans-serif; }
textarea{ resize:none; }
table{ border-collapse:collapse; border-spacing:0; }
td,th{ padding:0; }
h1,h2,h3,h4,h5,h6,p,figure,form,blockquote{ margin:0; font-weight:normal; line-height:1.2em;}
ul,ol,li,dl,dd{ margin:0; padding:0; }
ul,ol{ list-style:none; }
input::-moz-placeholder,textarea::-moz-placeholder{ color:#ccc; }
input:-ms-input-placeholder,textarea:-ms-input-placeholder{ color:#ccc; }
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{ color:#ccc; }
/* reset */


/*  onepcssgrid */
.col1,.col2,.col3,.col4,.col5,.col6,.col7,.col8,.col9,.col10,.col11,.col12 { display:inline-block; margin:0; padding:0 15px; box-sizing:border-box; vertical-align:top;}
.col1{ width:calc(100%/12 - 4px);}
.col2{ width:calc(100%/6 - 4px);}
.col3{ width:calc(100%/4 - 4px);}
.col4{ width:calc(100%/3 - 4px);}
.col5{ width:calc(100%*5/12 - 4px);}
.col6{ width:calc(100%/2 - 4px);}
.col7{ width:calc(100%*7/12 - 4px);}
.col8{ width:calc(100%*2/3 - 4px);}
.col9{ width:calc(100%*3/4 - 4px);}
.col10{ width:calc(100%*5/6 - 4px);}
.col11{ width:calc(100%*11/12 - 4px);}
.col12{ width:calc(100% - 4px);}
.col1 img,.col2 img,.col3 img,.col4 img,.col5 img,.col6 img,.col7 img,.col8 img,.col9 img,.col10 img,.col11 img,.col12 img{	max-width:100%; width:100%; height:auto; display:block;}

html{ position:relative; min-height:100%;}
html,body{ font-family:'Noto Sans TC','微軟正黑體','Microsoft JhengHei','Apple LiGothic Medium',sans-serif; }
body{ background:top center no-repeat; }
:before,:after{ font-family:'Noto Sans TC','微軟正黑體','Microsoft JhengHei','Apple LiGothic Medium',sans-serif,'FontAwesome'; }
h3{ line-height:1.3em;}
p{ line-height:1.7em;}
.container,.content{ position:relative; width:100%; margin:0 auto; }
.row{ display:block; width:100%; margin-bottom:3rem;}
.bg_gray{background:#f7f7f7;}
.btn { display:inline-block;}

.btn2{ padding:.8em 1.76em; font-size:1.4rem; line-height:1em; color:#3d3935; border:1px solid #3d3935; border-radius:4px; transition:background-color 125ms ease-in-out; text-align:center; opacity:1;transition:all .6s;}
.btn2:hover{ background:#f7f7f7; color:initial; }
.btn2.purple{ background:#5c223f; color:#fff; border-color:#5c223f; }
.btn2.green{ background:#245557; color:#fff; border-color:#245557; }
.btn2.greenLight{ background:#71b43a; color:#fff; border-color:#71b43a; }
.btn2.greenMedium{ background:#2a8a15; color:#fff; border-color:#2a8a15; }
.btn2.gold{background:#e3c383; border-color:#e3c383!important; color:#0f0f0f!important;}
.btn2.black{background:#000; border-color:#000; color:#fff;}
.btn2.white{ background:#fff; color:#00704A; border-color:#fff;}
.btn2.border-w{ color:#fff; border-color:#fff; }
.btn2.purple:hover,.btn2.green:hover,.btn2.greenLight:hover ,.btn2.greenMedium:hover{ opacity:.8;}
.btn2.border-w:hover{ color:#555; }
.btn2.msr-wb{ color:#fff; border-color:#fff; padding:.4em 1.5em .6em; border:solid 2px; border-radius:3em; min-width:7em; transition:all .6s; }
.btn2.msr-wb:hover{ background-color: rgba(255,255,255,.1); }
.btn3{ color:inherit; border-bottom:1px dotted; padding:0; font-size:1.7rem; line-height:.8em; font-weight:bold; padding:.4em 0 .6em; transition:all .6s; }
.btn4{ color:#535353; font-size:1.6rem; line-height:1em; padding:.4em; margin:-.4em; border-radius:.4em; transition:all .6s;}
.btn5{ color:inherit; border-bottom:1px solid; padding-bottom:.15em; }
.btn3:after ,.btn4:after{ content:'\f101';  display:inline-block; margin-left:.4rem;}
.btn.radius{ border-radius:2em; }
.btn.border-w{ color:#fff; border-color:#fff; }
.btn.arrow:after{ content:'\f101';  display:inline-block; margin-left:.4rem; font-weight:400; }

.fields{ margin:5rem 0 2rem; text-align:left;}
.fields .note{ position:relative; border-top:solid 1px #a5a8aa; padding-top:.8em; }
.fields .note p { font-size:.94em; line-height:1.58em; margin:0; color:#535353; }
ul.breadcrumb{font-size:1.5rem; color:#53534a; text-align:left;}
.fields ul.breadcrumb{margin:0; }
.top{  background:#f4f4f4; }
.top ul.breadcrumb{ padding:.4rem 0; }
ul.breadcrumb li{ display:inline-block; color:#a1a1a1; /*font-weight:300;*/ font-weight:500; }
ul.breadcrumb li a{  }
ul.breadcrumb li:after{ content:'‧'; padding:0 0 0 .4rem; text-align:center; color:#a1a1a1;}
ul.breadcrumb li:last-of-type:after{ display:none; }
.kv-full{ background-size:cover;  }
.kv-full .content{display:flex; }
.kv-full h1{color:#fff; font-weight:300;}
.kv img{ max-width:100%; width:100%;}
.main{ text-align:left; }
.aside{background:#eeede8; color:#3d3935; padding:2rem 1.5rem 2.5rem;}
.aside h2,.aside li{ margin-bottom:.5em; }

h1.page_heading{ text-align:left; /*line-height:2.8em;*/ line-height:1.3; margin:1em 0;} 
h8.page_heading{ margin:-1em 0 1em; display:block;}
.page_title{ text-align:left; line-height:2.2em; font-weight:300; margin:-.6em 0 2rem;}
table{ border:solid 1px #edeeee;}
table tr:nth-of-type(even){ background:#edeeee; }
table th,table td{padding:.4em .6em;}
table th{ background:#000; color:#fff; font-size:1.8rem; font-weight:400; }
table td{ font-size:1.5rem;}
.center{ text-align:center;}





@media (max-width:768px){
.container,.content{ padding:0 20px;}
h3{ font-size:2.2rem;}
h4{ font-size:1.9rem;}
h8{ font-size:2.2rem;}
p{ font-size:1.6rem;}
.our-coffees .kv-full .content{ height:120px; justify-content:center; align-items:flex-start;}
.kv-full h1{ margin-top:1rem; }
.pageHeaders{ margin:.6em 0;}


/*  onepcssgrid */
.col1,.col2,.col3,.col4,.col5,.col6,.col7,.col8,.col9,.col10,.col11 { display:block; width:100%;}
/* .col-xs-1,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-10,.col-xs-11,.col-xs-12 {display:inline-block; margin:0; padding:0 10px; box-sizing:border-box; vertical-align:middle; box-sizing:border-box;} */


}
@media (min-width:769px){
.container,.content{ max-width:1320px; padding:0 20px;}
.btn3:hover{ background:rgba(83,83,83,.1); border:none; border-radius:.2em; }
.btn4:hover{background:rgba(83,83,83,.1); color:inherit;}

h1{ font-size:3rem;  }
h2{ font-size:2.7rem;}
h3{ font-size:2.4rem;}
h4{ font-size:1.9rem;}
h8{ font-size:2.2rem; }
p{ font-size:1.5rem;}

.kv-full{ background-position:center center;}
.kv-full .content{align-items:center; height:294px;}
.kv-full h1{font-size:5rem; }
.pageHeaders{ margin:1em 0;}
.fields ul.breadcrumb{font-size:1.5rem;}

}