@import"https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;700;900&family=Roboto:ital,wght@0,400;1,900&display=swap";@import"https://fonts.googleapis.com/icon?family=Material+Icons";html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}.font-primary{color:#aa0601}.font-primary-dark{color:#650300}.font-link{color:#fff}.font-gray{color:#707070}.title-en{font-family:Roboto}.title-big{font-size:64px;font-weight:700}.title-middle{font-size:48px;font-weight:700}.title-small{font-size:36px}.title-24{font-size:24px}.title-20{font-size:20px}.text-18{font-size:18px}.link-middle{font-size:20px;font-weight:700}.link-small{font-size:14px}.icon-big{font-size:84px}.font-bold{font-weight:700}.font-900{font-weight:900}.font-medium{font-weight:500}.font-regular{font-weight:400}.font-italic{font-style:italic}.page-title{border-left:10px solid #aa0601;padding-left:16px}@media (max-width: 375px){.title-md-24{font-size:24px}.title-md-20{font-size:20px}.title-md-16{font-size:16px}}*,*:before,*:after{box-sizing:border-box}img{vertical-align:middle;max-width:100%;height:auto}a{text-decoration:none;color:#fff}body{font-family:Noto Sans TC,sans-serif;line-height:1.5}.container{margin:0 auto;max-width:1320px;padding:0 12px}@media (max-width: 768px){.container{max-width:720px}}@media (max-width: 375px){.container{max-width:372px}}.bg-primary{background:#aa0601}.bg-primary-dark{background:#69180c}.bg-second-color{background:#fbf2f2}.bg-white{background:#fff}.bg-none{background:transparent}.d-block{display:block}.d-flex{display:flex}.flex-column{flex-direction:column}.jc-sb{justify-content:space-between}.jc-e{justify-content:flex-end}.ai-c{align-items:center}.f-dir{flex-direction:column}.flex-wrap{flex-wrap:wrap}.mx-auto{margin-left:auto;margin-right:auto}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.h-100{height:100%}.w-100{width:100%}.row{margin-left:-12px;margin-right:-12px;display:flex;flex-wrap:wrap;justify-content:center}.col-1{width:8.333%}.col-2{width:16.666%}.col-3{width:25%}@media (max-width: 768px){.col-3{width:100%}}.col-4{width:33.333%}@media (max-width: 768px){.col-4{width:100%}}.col-5{width:41.666%}.col-6{width:50%}@media (max-width: 768px){.col-6{width:100%}}.col-7{width:58.333%}.col-8{width:66.666%}.col-9{width:75%}.col-10{width:83.333%}.col-11{width:91.666%}.col-12{width:100%}@media (max-width: 768px){.col-md-6{width:50%}.col-md-12{width:100%}}.gap-24{gap:24px}.p-16{padding:16px}.px-12{padding-left:12px;padding-right:12px}.py-6{padding-top:6px;padding-bottom:6px}.py-8{padding-top:8px;padding-bottom:8px}.py-16{padding-top:16px;padding-bottom:16px}.py-80{padding-top:80px;padding-bottom:80px}.pt-32{padding-top:32px}.pt-48{padding-top:48px}.pb-32{padding-bottom:32px}.ps-12{padding-left:12px}.mt-48{margin-top:48px}.mt-80{margin-top:80px}.mt-96{margin-top:96px}.mr-10{margin-right:10px}.mr-16{margin-right:16px}.mr-32{margin-right:32px}.mb-8{margin-bottom:8px}.mb-16{margin-bottom:16px}.mb-24{margin-bottom:24px}.mb-32{margin-bottom:32px}.mb-36{margin-bottom:36px}.mb-40{margin-bottom:40px}.mb-48{margin-bottom:48px}.mb-72{margin-bottom:72px}.mb-80{margin-bottom:80px}.border{border:1px solid #DEE2E6}.border-none{border:none}.border-black{border-color:#000}.border-top{border-top:1px solid #DEE2E6}.border-bottom{border-bottom:1px solid #DEE2E6}.border-start{border-left:1px solid #DEE2E6}.border-end{border-right:1px solid #DEE2E6}.border-round{border-radius:4px}.btn{background:#aa0601}.btn:hover{background:#69180c}.logo img{width:80px}@media (max-width: 768px){.logo{margin-left:15px;margin-bottom:16px}}@media (max-width: 768px){.navbar{flex-direction:column;align-items:flex-start;padding-left:0;padding-right:0;padding-top:16px}}@media (max-width: 768px){.nav-links{flex-wrap:wrap}}.nav-item a{display:block;padding:25px 32px}.nav-item a:hover{background:#69180c}@media (max-width: 768px){.nav-item{width:50%;font-size:16px;outline:solid 1px #fff;text-align:center}.nav-item a{padding-top:12px;padding-bottom:12px}}.footer-top{border-bottom:1px solid #fff}@media (max-width: 768px){.footer-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px}}@media (max-width: 768px){.footer-navbar{margin-bottom:0}}@media (max-width: 768px){.nav-links{width:100%}}.link-item{margin-right:48px}.link-item:last-child{margin-right:0}.link-item:hover{opacity:.8}@media (max-width: 768px){.link-item{display:none}}.social li{margin-right:32px}.social li:hover{opacity:.8}@media (max-width: 768px){.social li{margin-right:16px}}@media (max-width: 375px){.social li{margin-right:8px}}.social li:last-child{margin-right:0}.social img{width:48px}@media (max-width: 768px){.social img{width:40px}}@media (max-width: 375px){.social img{width:32px}}.contack a:hover{opacity:.8}.contack span{color:#fff;margin-right:20px}@media (max-width: 768px){.contack{order:-1}.contack p{font-size:16px}.contack span{font-size:16px;margin-right:10px}}.copyright{color:#fff}@media (max-width: 768px){.copyright{margin-bottom:8px}}.policy{gap:48px}.policy a:hover{opacity:.8}@media (max-width: 768px){.policy{flex-direction:column;gap:8px}}@media (max-width: 768px){.footer-bottom{flex-direction:column;padding-top:20px;padding-bottom:24px}}@media (max-width: 768px){.bg-primary.pt-48{padding-top:24px}}.bg-img1{background:url(https://raw.githubusercontent.com/hexschool/2022-web-layout-training/main/week3-4/home-header.png);background-size:cover;height:787px}@media (max-width: 768px){.bg-img1{background:url(https://raw.githubusercontent.com/hexschool/2022-web-layout-training/main/week3-4/home-header-sm.png)}}@media (max-width: 768px){.index-title2{font-size:16px}}@media (max-width: 768px){.index-title{font-size:24px}}@media (max-width: 768px){.index-main-btn{display:inline-block;font-size:20px;margin-top:16px}}@media (max-width: 768px){.index-block-title{font-size:24px}}.bg-img2{background:url(https://raw.githubusercontent.com/hexschool/2022-web-layout-training/main/week3-4/index-bg.png);background-size:cover}@media (max-width: 768px){.bg-img2{background:url(https://raw.githubusercontent.com/hexschool/2022-web-layout-training/main/week3-4/index-bg-sm.png)}}@media (max-width: 768px){.index-coo-block{padding-left:12px;padding-right:12px}.index-coo-block img{height:240px}}@media (max-width: 768px){.pad-mb-24{margin-bottom:24px}}@media (max-width: 768px){.pad-mb-16{margin-bottom:16px}}.glasses-type-img{height:414px;margin-left:auto;margin-right:auto;display:block}@media (max-width: 768px){.glasses-type-img{height:auto}}.customer{box-shadow:0 2px 6px #00000029}@media (max-width: 768px){.index-contact-dicp{font-size:16px}}.form-btn{width:416px}.form-btn:hover{cursor:pointer}@media (max-width: 768px){.form-btn{width:100%}}textarea{resize:none;height:136px}@media (max-width: 375px){.mb-sm{margin-top:40px;margin-bottom:64px}}.card-content{border:2px solid #dedede}@media (max-width: 375px){.card-content{width:100%}}#storeSelect{width:74%;padding:6px 0 6px 12px;color:#495057}@media (max-width: 768px){.store-card{flex-direction:row;justify-content:space-between;margin-bottom:24px}}@media (max-width: 375px){.store-card{flex-direction:column}}.store-name{padding:8px 24px;border-bottom:2px solid #dedede}.store-content{padding:16px 24px}.store-content a{color:#000}.card-img{background:url(https://raw.githubusercontent.com/hexschool/2022-web-layout-training/main/week3-4/store-1.png);background-repeat:no-repeat;background-position:center center;height:100%;background-size:auto}@media (max-width: 768px){.card-img{width:48%}.card-img img{display:none}}@media (max-width: 375px){.card-img{width:100%}.card-img img{display:flex}}@media (max-width: 768px){.store-map{height:414px}}
