/* Cgmap */
#Cgmap { position: relative; margin-bottom: -5%; z-index: -1; }
#Cgmap:before { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 2; content: ""; }
#Cgmap iframe { width: 100vw; height: 350px; }

/* contact_page */
#contact_page { background: white; box-shadow: 0 0 0.8em 0 rgba(2,2,2,.16); display: flex; flex-wrap: wrap; justify-content: space-between; align-items: stretch; }

/* contact_information */
.contact_information { padding: 2em; }
.contact_information .title { margin-bottom: 1.5em; color: white; }
.contact_information a { margin-bottom: 1em; display: flex; align-items: center; }
.contact_information a font { position: relative; margin-right: 1em; width: 2.3em; aspect-ratio: 1/1; border: 1px var(--primary) solid; display: flex; justify-content: center; align-items: center; border-radius: 50%; }
.contact_information a font svg { width: 50%; height: 100%; fill: var(--primary); }
.contact_information a.map font svg { width: 45%; }
.contact_information a.line font svg { width: 65%; }
.contact_information a span { width: 1%; flex: 1 1 auto; font-size: .9em; color: white; }

/* form_box */
.form_box { padding: 2em 0; display: grid; grid-template-columns: repeat(1,1fr); grid-gap: 1.2em; align-items: center; }
.form_box.large_item { padding: 0; }
.form_box .form_item label { color: var(--g_600); /* font-size: 14px; */ }
.form_box .form_item input { font-size: 15px; padding: .7em; background: none; }
.form_box .form_item input::placeholder { font-size: 14px; color: #a9a9a9; font-weight: 300 }
.form_box .form_item select { font-size: 15px; }
.form_box .flex_style { display: flex; flex-wrap: wrap; align-items: center; }
.form_box .flex_style label.large { margin-right: 1em; width: 7em; }
.form_box .flex_style >input,.form_box .flex_style >font { font-size: 15px; width: 100%; }
.form_box .flex_style >font .bind { margin-left: 1em; }
.form_box .flex_style >font .bind svg { margin: 0 .6em; width: 30px; height: 30px; fill: #fff; }
.form_box .flex_style >font .btn { padding: 0; border-radius: .37em; display: inline-flex; justify-content: space-between; align-items: center; }
.form_box .flex_style >font .btn font { padding: .2em 0; width: 150px; border-left: 1px rgb(0 0 0/10%) solid; display: flex; justify-content: center; align-items: center; flex: 1 1 auto; color: #fff; }
.form_box .flex_style >font .btn.line { background: #06C755; }
.form_box .flex_style >font .bind .isbind svg { fill: #06C755; }
.form_box .flex_style .groud { overflow: hidden; display: flex; align-items: center; background-color: white; background-clip: padding-box; border: 1px solid var(--g_200); border-radius: .2em; }
.form_box .flex_style .groud >input { width: 1%; flex: 1 1 auto; border: 0; }
.form_box .flex_style .groud >button { padding: .5em; width: 10em; background: var(--red); text-align: center; color: white; }
.form_box  span.words { width: 100%; display: flex; justify-content: flex-end; align-items: center; font-size: .9em; color: var(--g_600); }
.form_box span.words b { margin: 0 .2em; font-size: 1em; }
.form_box .sex_box { padding: .3em 0; width: 100%; display: flex; align-items: center; }
.form_box .sex_box * { font-size: 14px; }
.form_box .sex_box >span { margin-right: 1em; }
.form_box .sex_box >span input { margin-right: .2em; }
.form_box .address_box { width: 100%; display: grid; grid-template-columns: 8em 8em 1fr; grid-gap: .6em 1em; align-items: center; }
.form_box .calendar { position: absolute; width: 1em; height: 1em; top: 51%; right: 1em; fill: var(--g_500); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.form_box .note_txt span { font-size: .9em; color: var(--g_600); }
.form_box .check_box font { display: flex; align-items: center; }
.form_box .check_box font input { width: 1%; flex: 1 1 auto; }
.form_box .check_box font img { margin-left: .5em; cursor: pointer; }
.form_box .send_box { display: flex; justify-content: end; margin-top: 20px; }
.form_box .large_item.send_box { flex-direction: column; justify-content: center; }
.form_box .send_btn { padding: .4em .5em; width: 10em; background: #444; display: block; text-align: center; color: white; cursor: pointer; font-family: "Noto Serif TC",serif; }
.form_box .send_btn.large_btn { width: 100%; }
.form_box .agree_box { margin-bottom: 1.2em; display: flex; align-items: center; }
.form_box .agree_box label[for="IsAgree"] { margin-left: .3em; width: 1%; flex: 1 1 auto; line-height: 1; }
.form_box .quit_login { display: flex; flex-direction: column; justify-content: center; align-items: center; }
.form_box .quit_login .line_link { padding: 0; width: min(100%,350px); border-radius: .37em; background: #06C755; display: inline-flex; justify-content: space-between; align-items: stretch; }
.form_box .quit_login .line_link svg { margin: .2em .6em; width: 40px; height: 40px; fill: #fff; }
.form_box .quit_login .line_link font { width: 1%; border-left: 1px rgb(0 0 0/10%) solid; display: flex; justify-content: center; align-items: center; flex: 1 1 auto; font-size: 1.2em; color: #fff; }

/* member_page */
#member_page { margin: 0 auto; width: min(650px,95vw); }
#member_page .login_btns { display: grid; grid-template-columns: repeat(2,1fr); grid-gap: 1em; background: #efe6e0; }
#member_page .login_btns a { margin-bottom: -1px; padding: .8em 1em; text-align: center; font-size: 1.1em; }
#member_page .login_btns a.acion { background: var(--primary); color: white; }
#member_page .other_btns .join { margin: 1em 0 .3em; display: flex; justify-content: center; align-items: baseline; }
#member_page .other_btns .join * { font-weight: 300; color: var(--g_500); }
#member_page .other_btns .join a { margin-left: .4em; padding: .5em .2em; display: block; border-bottom: 1px var(--info) solid; line-height: 1; color: var(--info); }
#member_page .other_btns .askpass { text-align: center; }
#member_page .other_btns .askpass a { font-weight: 300; color: var(--g_500); }

/* notice_box */
.notice_box h3 { margin-bottom: .5em; display: flex; align-items: baseline; font-weight: 300; font-size: 1.2em; color: var(--g_500); font-family: "Noto Serif TC",serif; }
.notice_box h3 i { margin-right: .2em; color: var(--g_300); }
.notice_box ol { margin-left: 1.5em; list-style: decimal; }
.notice_box ol li { list-style: decimal; font-family: 'Noto Sans TC'; }

/* member_rule */
#member_rule { overflow: hidden; width: 0; max-height: 0; display: none; opacity: 0; }
#member_rule::-webkit-scrollbar { width: 13px; }
#member_rule::-webkit-scrollbar-track { background: none; }
#member_rule::-webkit-scrollbar-thumb { border-radius: 8px; border: 4px solid transparent; background-clip: content-box; background-color: var(--g_200); }
#member_rule::-webkit-scrollbar-thumb:hover { background-color: var(--g_300); }
#member_rule * { font-size: inherit; }
#member_rule ol.rulelist { padding-left: 20px; list-style: decimal; }
#member_rule ol.rulelist li { padding: 0 0 10px 10px; }
.fancybox-slide--current #member_rule { overflow-y: scroll; width: min(95vw,800px); max-height: 55vh; opacity: 1; }

/* order_box */
.order_box { border: 1px solid #ededed; margin: 2em 0; }
.order_box h5 { font-weight: 500; background: var(--primary); margin: 0; padding: 10px 20px; font-size: 17px; letter-spacing: 1px; color: white; }
.order_box h5 b { margin-right: .5em; color: var(--bg); }
.order_box h5.order_title { display: flex; align-items: center; px; */ }
.order_box h5.order_title strong { margin: 0 .5em; font-weight: 400; font-size: 1em; color: white; }
.order_box h5 .icheck { margin-left: .5em; display: inline-flex; align-items: center; }
.order_box h5 .icheck label { margin-left: .2em; font-weight: 400; font-size: .75em; color: white; }
.order_box>div { background: white; grid-gap: .8em; }
.order_box >.form_box { padding: 2em 20px }

/* order_list */
.order_list .row_item { padding: .5em 1em; border-bottom: 1px solid #ededed; display: grid; grid-template-columns: 80px repeat(6,1fr) 25px; grid-gap: 0 .5em; align-items: center; }
.order_list .row_item * { font-size: 15px; }
.order_list .row_item i { font-family: 'FontAwesome'; color: #666; }
.order_list .row_item.title { padding: .8em 1em; }
.order_list .row_item.title * { font-size: 13px; color: #666; }
.order_list .row_item.list .img a { padding: .2em; border: 1px var(--g_100) solid; width: 70px; aspect-ratio: 1/1; display: block; }
.order_list .row_item.add_item .item.name a { display: flex; flex-direction: column; align-items: flex-start; }
.order_list .row_item.add_item .item.name .add_txt { padding: .3em .5em; background: var(--g_500); line-height: 1em; font-size: .8em; color: var(--g_100); }

/* q_control */
.q_control { border: 1px var(--g_200) solid; display: inline-flex; align-items: stretch; }
.q_control button { position: relative; width: 2em; cursor: pointer; }
.q_control button:before { position: absolute; width: 30%; height: 1px; background: var(--g_500); display: block; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); content: ""; }
.q_control button.plus:after { position: absolute; width: 30%; height: 1px; background: var(--g_500); display: block; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%) rotate(90deg); transform: translate(-50%,-50%) rotate(90deg); content: ""; }
.q_control input { padding: .3em 0; width: 3em; border: 0; border-radius: 0; text-align: center; }

/* other_box */
#order .other_box { margin-top: 2em; padding: 0 2em; }
#order .other_box >* { margin-left: auto; width: 20em; }
#order .other_box p { margin-bottom: .5em; display: flex; justify-content: flex-end; align-items: center; gap: .3em 1em; }
#order .other_box p label { min-width: 5em; }
#order .other_box p font { width: 1%; flex: 1 1 auto; font-size: .9em; }
#order .other_box p font input { padding: .2em .5em; font-size: 1em; }
#order .other_box p.point_txt { margin-bottom: 0; }
#order .other_box p.point_txt font { color: #666; font-size: 13px; text-align: left; margin-bottom: 10px; }
#order .other_box p.tt font { color: #666; font-size: 13px; text-align: left; margin: 10px; }
#order .other_box p.tt { background-color: #f5f5f5; margin-top: 20px; }

/* btns */
#order .btns { padding: 2em 2em; display: flex; justify-content: center; align-items: center; }
#order .btns .btn { margin: 0 .5em; padding: .3em .5em; width: 10em; text-align: center; font-size: 14px; color: #666; }
#order .btns #btnClean { background: var(--secondary); border-color: var(--secondary); color: white; font-size: 15px; }

/* order_bottom_txt */
.order_bottom_txt { position: absolute; width: 100%; bottom: 0; left: 0; opacity: 0; z-index: 998; }
.order_bottom_txt .workframe_s { padding: 1em 0; display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center; margin: 0 auto; }
.order_bottom_txt.fixed { position: fixed; background: white; box-shadow: 0 0 .5em var(--g_200); opacity: 1; }
.order_bottom_txt.absolute-bt { opacity: 1; }
.order_bottom_txt.absolute-bt .workframe_s { padding-bottom: 2em; }
.order_bottom_txt .item_row { width: 45%; }
.order_bottom_txt .total_box,.order_bottom_txt p { display: flex; align-items: center; flex-wrap: wrap; }
.order_bottom_txt .total_box label { min-width: 6em; }
.order_bottom_txt .total_box #totaltxt { margin-left: .5em; min-width: 6em; font-weight: 500; font-size: 1.3em; color: var(--g_700); font-family: 'Open Sans'; }
.order_bottom_txt .send { display: flex; justify-content: flex-end; align-items: center; }
.order_bottom_txt .send #btnOK { padding: .5em; width: min(20em,100%); text-align: center; background: var(--secondary); color: white; font-size: 15px; }

/* bot_note */
#bot_note { position: relative; width: 1%; display: flex; flex-wrap: wrap; align-items: center; gap: .2em; flex: 1 1 auto; line-height: 1; color: var(--g_700); font-family: "Open Sans","Noto Sans TC",sans-serif; }
#bot_note span { line-height: 1.2; font-size: .9em; color: var(--g_700); font-family: "Open Sans","Noto Sans TC",sans-serif; }
#bot_note #opendis { margin: 0 .2em; line-height: 1; font-size: .9em; color: var(--red); cursor: pointer; }
#bot_note #opendis * { font-size: 1em; color: currentColor; }
#bot_note b { position: absolute; min-width: 7em; background: white; border: 1px var(--g_200) solid; border-radius: .2em; box-shadow: 0 0 .5em var(--g_200); right: 0; bottom: 120%; opacity: 0; }
#bot_note b span { overflow: hidden; height: 0; display: block; font-weight: 400; font-size: .9em; }
#bot_note b[data-type="2"] { padding: 5px 10px; opacity: 1; }
#bot_note b[data-type="2"]:before,#bot_note b[data-type="2"]:after { position: absolute; width: 0; height: 0; border-style: solid; border-width: 10px 8px 0 8px; border-color: #d6d6d6 transparent transparent transparent; display: inline-block; bottom: -10px; left: 20px; content: ""; }
#bot_note b[data-type="2"]:after { border-width: 10px 8px 0 8px; border-top-color: #fff; bottom: -9px; }
#bot_note b[data-type="2"] span { margin: .2em 0; height: 1.1em; }

@media screen and (min-width:981px) {
  .form_box { grid-template-columns: repeat(2,1fr); }
  .form_box .large_item,.form_box span.words { grid-column: 1/3; }
  .order_list .row_item .item { text-align: center; }
  .order_list .row_item .item.img_name { grid-column: 1/4; text-align: left; }
  .order_list .row_item.list .item.name { grid-column: 2/4; text-align: left; }
  .order_list .row_item.add_item .item.name { grid-column: 2/5; }
  .order_list .row_item.add_item .item.price { grid-column-start: 7; }
  #order .btns { justify-content: flex-end; }
  #order .btns #btnClean { margin-right: 0; }
}
@media screen and (max-width:980px) and (min-width:641px) {
  .contact_information { display: grid; grid-template-columns: repeat(2,1fr); grid-gap: 1.5em 1em; align-items: center; }
  .contact_information .title { grid-column: 1/3; }
}
@media screen and (max-width:980px) {
  .order_bottom_txt .item_row { width: 100%; justify-content: flex-start; }
  .order_list .row_item.title,.order_list .row_item.list .price { display: none; }
  .order_list .row_item.list {
    position:relative;padding:.5em;grid-template-columns:80px 1fr 150px;grid-template-areas:"img name quantity"
"img format quantity"
"img amount quantity";grid-gap:0 .3em;align-items:end;
  }
  .order_list .row_item.list .img { grid-area: img; }
  .order_list .row_item.list .name { grid-area: name; }
  .order_list .row_item.list .format { grid-area: format; line-height: 1; font-size: .8em; color: var(--g_600); }
  .order_list .row_item.list .format:before { content: attr(data-tit)":"; }
  .order_list .row_item.list .quantity { grid-area: quantity; display: flex; justify-content: flex-end; }
  .order_list .row_item.list .amount { grid-area: amount; font-weight: 500; }
  .order_list .row_item.list .operate { position: absolute; top: .5em; right: .5em; }
}
@media screen and (max-width:640px) {
  #gotop { bottom: 20%; }
  .order_box h5 { padding: 10px; }
  .order_box >.form_box { padding: 2em 10px; }
  .order_bottom_txt .item_row { margin-bottom: 5px; }
  .order_bottom_txt .item_row.send { display: block; }
  .order_bottom_txt .send #btnOK { width: 100%; padding: .5em 0; }
  .order_bottom_txt p { width: 100% }
  #order .btns { margin: 2em 0; justify-content: flex-end; }
  #order .other_box { padding: 0 .5em; }
  .order_list .row_item.list { grid-template-columns: 80px 1fr 70px; }
  .q_control input { width: 2em; }
  .q_control button { width: 1.5em; }
  .form_box { padding: 2em 3%; }
  .form_box .address_box { grid-template-columns: repeat(2,1fr); grid-template-areas: "city area" "inp inp"; }
  .form_box .address_box .address_inp { grid-area: inp; }
  .order_box>div { padding: 1.5em 0; }
}
@media screen and (min-width:551px) {
  .form_box .flex_style label { margin-right: 3em; padding: .5em 0; width: 5em; text-align: justify; text-align-last: justify; }
  .form_box .flex_style >input,.form_box .flex_style >font { width: 1%; flex: 1 1 auto; }
}


#Cgmap { position: relative; margin-bottom: -3%; z-index: 1; overflow: hidden; border-radius: 0 0 54px 54px; }
#Cgmap:before { position: absolute; inset: 0; z-index: 2; content: ""; background: linear-gradient(180deg,rgba(248,244,236,.08) 0%,rgba(37,48,42,.16) 100%); pointer-events: none; }
#Cgmap iframe { width: 100vw; height: 390px; filter: grayscale(.18) saturate(.82) contrast(.96); }
#contact_page {position: relative;overflow: hidden;background: linear-gradient(135deg,rgba(248,244,236,.92) 0%,rgba(255,255,255,.98) 58%,rgba(239,231,216,.72) 100%);border: 1px solid rgba(63,86,63,.12);border-radius: 46px;box-shadow: 0 30px 82px rgba(31,41,36,.08);display: flex;flex-wrap: wrap;justify-content: space-between;align-items: stretch;padding-bottom: 0;padding: 60px;margin: 2em auto 0;}
#contact_page::after { content: ""; position: absolute; left: -90px; bottom: -90px; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle,rgba(220,232,229,.38) 0%,rgba(220,232,229,0) 70%); pointer-events: none; }
.contact_information {position: relative;z-index: 2;padding: 3em 2.2em;background: var(--gradient-primary);border-radius: 30px 30px 70px 30px;box-shadow: 0 26px 70px rgba(31,41,36,.14);}
.contact_information .title {margin-bottom: 1.2em;color: var(--white);font-family: var(--font-family);font-size: 22px;font-weight: 700;line-height: 1.45;letter-spacing: .12em;}
.contact_information a { position: relative; margin-bottom: 1.15em; padding: .6em 0; display: flex; align-items: center; color: rgba(255,255,255,.82); transition: transform .35s cubic-bezier(.22,1,.36,1),color .35s ease; }
.contact_information a:hover { transform: translateX(6px); color: var(--white); }
.contact_information a font { position: relative; margin-right: 1em; width: 2.65em; aspect-ratio: 1/1; border: 1px solid rgba(234,215,165,.44); background: rgba(255,255,255,.12); display: flex; justify-content: center; align-items: center; border-radius: 50%; box-shadow: inset 0 0 0 5px rgba(255,255,255,.06); }
.contact_information a font svg { width: 50%; height: 100%; fill: rgba(255,255,255,.88); }
.contact_information a span { width: 1%; flex: 1 1 auto; font-size: .95em; line-height: 1.8; color: rgba(255,255,255,.82); letter-spacing: .05em; }
.form_box { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(1,1fr); grid-gap: 1.35em 1.5em; align-items: center; padding: 0; }
.form_box.large_item { padding: 0; }
.form_box .form_item { position: relative; }
.form_box .form_item label { margin-bottom: 0.55em; color: var(--primary); font-size: 17px; font-weight: 500; line-height: 1.5; letter-spacing: .08em; display: inline-block; }
.form_box .form_item input,.form_box .form_item select,.form_box .form_item textarea,.form_box .flex_style > input,.form_box .flex_style .groud { width: 100%; border: 1px solid rgba(63,86,63,.16); border-radius: 18px; background: rgba(255,255,255,.86); color: var(--info); box-shadow: inset 0 0 0 1px rgba(255,255,255,.66); transition: border-color .35s ease,box-shadow .35s ease,background .35s ease; }
.form_box .sex_box { width: 100%; display: flex; align-items: center; gap: 26px; padding: 8px 0; }
.form_box .sex_box > span { display: inline-flex; align-items: center; gap: 8px; margin: 0; white-space: nowrap; }
.form_box .sex_box input[type="radio"] { width: 14px; height: 14px; min-width: 18px; margin: 0; padding: 0; flex: 0 0 16px; accent-color: var(--primary); cursor: pointer; }
.form_box .sex_box label { width: auto !important; margin: 0 !important; padding: 0 !important; display: inline-block; color: var(--info); font-family: var(--font-family); font-size: 15px; font-weight: 600; line-height: 1.5; letter-spacing: .08em; text-align: left !important; text-align-last: auto !important; white-space: nowrap; cursor: pointer; }
.form_box .sex_box input[type="radio"]:checked + label { color: var(--primary); font-weight: 800; }
@media screen and (min-width:551px) {
  .form_box .sex_box label { width: auto !important; margin: 0 !important; padding: 0 !important; text-align: left !important; text-align-last: auto !important; }
}

.form_box .agree_box { display: flex; align-items: flex-start; gap: 10px; margin: 14px 0 22px; color: rgba(37,48,42,.72); font-family: var(--font-sans); font-size: 15px; line-height: 1.8; letter-spacing: .04em; }
.form_box .agree_box input[type="checkbox"],.form_box .agree_box #IsAgree { position: relative; width: 18px; height: 18px; min-width: 18px; flex: 0 0 18px; margin: 4px 0 0; padding: 0; appearance: none; -webkit-appearance: none; border: 1px solid rgba(63,86,63,.28); border-radius: 5px; background: rgba(255,255,255,.92); cursor: pointer; box-shadow: inset 0 0 0 2px rgba(248,244,236,.72); transition: all .25s ease; }
.form_box .agree_box input[type="checkbox"]:checked,.form_box .agree_box #IsAgree:checked { background: var(--primary); border-color: var(--primary); box-shadow: 0 0 0 4px rgba(63,86,63,.08); }
.form_box .agree_box input[type="checkbox"]:checked::after,.form_box .agree_box #IsAgree:checked::after { content: ""; position: absolute; left: 5px; top: 2px; width: 5px; height: 9px; border: solid var(--white); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.form_box .agree_box label[for="IsAgree"] { width: auto; flex: 1 1 auto; margin: 0; color: rgba(37,48,42,.72); line-height: 1.8; }
.form_box .agree_box label[for="IsAgree"] span { color: rgba(37,48,42,.72); font-size: 15px; }
.form_box .agree_box label[for="IsAgree"] a { color: var(--primary); border-bottom: 1px solid rgba(63,86,63,.25); transition: color .3s ease,border-color .3s ease; }
.form_box .agree_box label[for="IsAgree"] a:hover { color: var(--third); border-color: var(--third); }
.form_box .form_item input,.form_box .form_item select,.form_box .form_item textarea,.form_box .flex_style > input { font-size: 15px; padding: .65em 1.1em; }
.form_box .form_item input:focus,.form_box .form_item select:focus,.form_box .form_item textarea:focus,.form_box .flex_style > input:focus,.form_box .flex_style .groud:focus-within { outline: none; border-color: rgba(63,86,63,.38); background: var(--white); box-shadow: 0 0 0 4px rgba(63,86,63,.08); }
.form_box .form_item input::placeholder,.form_box .form_item textarea::placeholder { font-size: 14px; color: rgba(122,106,85,.46); font-weight: 400; }
.form_box .address_box select,.form_box .form_item select { appearance: none; -webkit-appearance: none; width: 100%; height: 56px; padding: 0 48px 0 18px; border: 1px solid rgba(63,86,63,.16); border-radius: 18px; background-color: rgba(255,255,255,.92); background-image: linear-gradient(45deg,transparent 50%,var(--primary) 50%),linear-gradient(135deg,var(--primary) 50%,transparent 50%),linear-gradient(135deg,rgba(248,244,236,.92) 0%,rgba(255,255,255,.96) 100%); background-position: calc(100% - 24px) 50%,calc(100% - 18px) 50%,100% 0; background-size: 6px 6px,6px 6px,42px 100%; background-repeat: no-repeat; color: rgba(37,48,42,.78); font-family: var(--font-sans); font-size: 15px; font-weight: 500; line-height: 56px; letter-spacing: .04em; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(255,255,255,.66); transition: border-color .35s ease,box-shadow .35s ease,background-color .35s ease; }
.form_box .address_box select:focus,.form_box .form_item select:focus { outline: none; border-color: rgba(63,86,63,.38); background-color: var(--white); box-shadow: 0 0 0 4px rgba(63,86,63,.08); }
.form_box .address_box select:hover,.form_box .form_item select:hover { border-color: rgba(63,86,63,.28); background-color: var(--white); }
.form_box .address_box select option,.form_box .form_item select option { color: var(--info); background: var(--white); font-size: 15px; }
.form_box .address_box { position: relative; }
.form_box .address_box select::-ms-expand,.form_box .form_item select::-ms-expand { display: none; }
.form_box .flex_style { display: flex; flex-wrap: wrap; align-items: center; }
.form_box .address_box { position: relative; overflow: visible; z-index: 5; }
.form_box .address_box select,.form_box .form_item select { position: relative; z-index: 6; appearance: none; -webkit-appearance: none; width: 100%; height: 56px; padding: 0 48px 0 18px; border: 1px solid rgba(63,86,63,.16); border-radius: 18px; background-color: rgba(255,255,255,.94); background-image: linear-gradient(45deg,transparent 50%,var(--primary) 50%),linear-gradient(135deg,var(--primary) 50%,transparent 50%),linear-gradient(135deg,rgba(248,244,236,.92) 0%,rgba(255,255,255,.96) 100%); background-position: calc(100% - 25px) 50%,calc(100% - 18px) 50%,100% 0; background-size: 7px 7px,7px 7px,44px 100%; background-repeat: no-repeat; color: rgba(37,48,42,.78); font-family: var(--font-sans); font-size: 15px; font-weight: 500; line-height: 56px; letter-spacing: .04em; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(255,255,255,.66); transition: border-color .35s ease,box-shadow .35s ease,background-color .35s ease; }
.form_box .address_box select:hover,.form_box .form_item select:hover { border-color: rgba(63,86,63,.28); background-color: var(--white); }
.form_box .address_box select:focus,.form_box .address_box select:active,.form_box .form_item select:focus,.form_box .form_item select:active { outline: none; border-color: rgba(63,86,63,.42); background-color: var(--white); background-image: linear-gradient(135deg,transparent 50%,var(--primary) 50%),linear-gradient(45deg,var(--primary) 50%,transparent 50%),linear-gradient(135deg,rgba(248,244,236,.96) 0%,rgba(255,255,255,.98) 100%); background-position: calc(100% - 25px) 50%,calc(100% - 18px) 50%,100% 0; background-size: 7px 7px,7px 7px,44px 100%; background-repeat: no-repeat; box-shadow: 0 0 0 4px rgba(63,86,63,.08),inset 0 0 0 1px rgba(255,255,255,.66); }
.form_box .address_box select option,.form_box .form_item select option { color: var(--info); background: var(--white); font-family: var(--font-sans); font-size: 15px; }
.form_box .address_box select::-ms-expand,.form_box .form_item select::-ms-expand { display: none; }
.form_box .address_box select:disabled,.form_box .form_item select:disabled { cursor: not-allowed; opacity: .55; background-color: rgba(248,244,236,.65); }
.form_box .flex_style label { color: var(--primary); letter-spacing: .08em; margin-bottom: 0; }
.form_box .flex_style label.large { margin-right: 1em; width: 9em; }
.form_box .flex_style > font { font-size: 15px; width: 100%; color: rgba(37,48,42,.92); }
.form_box .flex_style .groud { overflow: hidden; display: flex; align-items: center; background-clip: padding-box; }
.form_box .flex_style .groud > input { width: 1%; flex: 1 1 auto; border: 0; background: transparent; }
.form_box .flex_style .groud > button { padding: .72em 1.2em; width: 10em; border-radius: 14px; background: var(--primary); text-align: center; color: var(--white); font-family: var(--font-sans); font-weight: 700; letter-spacing: .08em; transition: background .35s ease,transform .35s ease; }
.form_box .flex_style .groud > button:hover { background: var(--third); transform: translateY(-2px); }
.form_box span.words { width: 100%; display: flex; justify-content: flex-end; align-items: center; font-size: .9em; color: rgba(37,48,42,.58); }
.form_box span.words b { margin: 0 .2em; font-size: 1em; color: var(--third); }
.form_box .sex_box { padding: .45em 0; width: 100%; display: flex; align-items: center; gap: .9em; }
.form_box .sex_box * { font-size: 14px; color: rgba(37,48,42,.7); }
.form_box .sex_box > span { margin-right: 0; display: inline-flex; align-items: center; gap: .3em; }
.form_box .address_box { width: 100%; display: grid; grid-template-columns: 8em 8em 1fr; grid-gap: .75em 1em; align-items: center; }
.form_box .calendar { position: absolute; width: 1em; height: 1em; top: 51%; right: 1em; fill: rgba(63,86,63,.55); transform: translateY(-50%); }
.form_box .note_txt span { font-size: .9em; color: rgba(37,48,42,.58); }
.form_box .check_box font { display: flex; align-items: center; gap: .6em; }
.form_box .check_box font input { width: 1%; flex: 1 1 auto; }
.form_box .check_box font img {margin-left: .5em;cursor: pointer;border: 1px solid rgba(63,86,63,.12);}
.form_box .agree_box { margin-bottom: 1.2em; display: flex; align-items: center; color: rgba(37,48,42,.7); }
.form_box .agree_box label[for="IsAgree"] { margin-left: .5em; width: 1%; flex: 1 1 auto; line-height: 1.6; }
.form_box .send_box { display: flex; justify-content: flex-end; margin-top: 22px; }
.form_box .send_btn { position: relative; padding: .75em 1em; width: 12em; border: 0; border-radius: 999px; background: var(--primary); display: block; text-align: center; color: var(--white); cursor: pointer; font-family: var(--font-sans); font-weight: 600; letter-spacing: .1em; box-shadow: 0 18px 38px rgba(63,86,63,.22); transition: transform .38s cubic-bezier(.22,1,.36,1),background .35s ease,box-shadow .35s ease; }
.form_box .send_btn:hover { background: var(--third); transform: translateY(-4px); box-shadow: 0 24px 50px rgba(31,41,36,.18); }
.form_box .send_btn.large_btn { width: 100%; }
.form_box .quit_login { display: flex; flex-direction: column; justify-content: center; align-items: center; }
.form_box .quit_login .line_link,.form_box .flex_style > font .btn.line { padding: 0; width: min(100%,350px); border-radius: 999px; background: #06C755; display: inline-flex; justify-content: space-between; align-items: stretch; overflow: hidden; box-shadow: 0 16px 34px rgba(6,199,85,.18); }
.form_box .quit_login .line_link svg,.form_box .flex_style > font .bind svg { margin: .2em .6em; width: 40px; height: 40px; fill: #fff; }
.form_box .quit_login .line_link font,.form_box .flex_style > font .btn font { width: 1%; border-left: 1px solid rgba(0,0,0,.1); display: flex; justify-content: center; align-items: center; flex: 1 1 auto; font-size: 1.05em; color: #fff; }
#member_page * { font-family: var(--font-sans); }
#member_page { margin: 0 auto; width: min(650px,95vw); padding: 4em; border-radius: 42px; background: linear-gradient(135deg,rgba(248,244,236,.92) 0%,rgba(255,255,255,.98) 100%); border: 1px solid rgba(63,86,63,.12); box-shadow: 0 28px 76px rgba(31,41,36,.08); }
#member_page .login_btns { display: grid; grid-template-columns: repeat(2,1fr); grid-gap: .8em; background: transparent; }
#member_page .login_btns a { margin-bottom: 0; padding: .9em 1em; border-radius: 999px; text-align: center; font-size: 1.05em; color: rgba(37,48,42,.68); background: rgba(255,255,255,.86); border: 1px solid rgba(63,86,63,.12); transition: all .35s cubic-bezier(.22,1,.36,1); }
#member_page .login_btns a:hover,#member_page .login_btns a.acion { background: var(--primary); color: var(--white); border-color: var(--primary); box-shadow: 0 16px 34px rgba(63,86,63,.2); transform: translateY(-3px); }
#member_page .other_btns .join { margin: 1.4em 0 .5em; display: flex; justify-content: center; align-items: baseline; }
#member_page .other_btns .join * { font-weight: 400; color: rgba(37,48,42,.58); }
#member_page .other_btns .join a { margin-left: .4em; padding: .4em .2em; display: block; border-bottom: 1px solid var(--third); line-height: 1; color: var(--primary); }
#member_page .other_btns .askpass { text-align: center; }
#member_page .other_btns .askpass a { font-weight: 400; color: rgba(37,48,42,.58); transition: color .35s ease; }
#member_page .other_btns .askpass a:hover { color: var(--primary); }
.notice_box { padding: 1.6em 1.8em; border-radius: 26px; background: rgba(248,244,236,.72); border: 1px solid rgba(63,86,63,.1); }
.notice_box h3 { margin-bottom: .7em; display: flex; align-items: baseline; font-weight: 700; font-size: 1.18em; color: var(--primary); font-family: var(--font-family); letter-spacing: .08em; }
.notice_box h3 i { margin-right: .35em; color: var(--third); }
.notice_box ol { margin-left: 1.5em; list-style: decimal; }
.notice_box ol li { list-style: decimal; font-family: var(--font-sans); color: rgba(37,48,42,.66); line-height: 1.9; }
#member_rule::-webkit-scrollbar { width: 13px; }
#member_rule::-webkit-scrollbar-track { background: none; }
#member_rule::-webkit-scrollbar-thumb { border-radius: 8px; border: 4px solid transparent; background-clip: content-box; background-color: rgba(63,86,63,.22); }
#member_rule::-webkit-scrollbar-thumb:hover { background-color: rgba(63,86,63,.36); }
.fancybox-slide--current #member_rule { overflow-y: scroll; width: min(95vw,800px); max-height: 55vh; opacity: 1; padding: 2em; border-radius: 30px; background: var(--white); }
.order_box { position: relative; overflow: hidden; border: 1px solid rgba(63,86,63,.12); margin: 2em 0; border-radius: 34px; background: rgba(255,255,255,.96); box-shadow: 0 22px 62px rgba(31,41,36,.075); }
.order_box *{    font-family: var(--font-sans);}
.order_box h5 { font-weight: 800; background: var(--primary); margin: 0; padding: 16px 24px; font-size: 17px; letter-spacing: .08em; color: var(--white); font-family: var(--font-family); }
.order_box h5 b { margin-right: .5em; color: var(--yellow); }
.order_box h5.order_title { display: flex; align-items: center; }
.order_box h5.order_title strong { margin: 0 .5em; font-weight: 600; font-size: 1em; color: var(--white); }
.order_box h5 .icheck { margin-left: .5em; display: inline-flex; align-items: center; }
.order_box h5 .icheck label { margin-left: .2em; font-weight: 400; font-size: .75em; color: rgba(255,255,255,.85); }
.order_box h5 [class*="icheck-material"] > label{
    margin-left: 10px;
}
.order_box h5 [class*="icheck-material"] > label span{
    color: var(--bg);
}
.order_box > div { background: rgba(255,255,255,.96); grid-gap: .8em; }
.order_box > .form_box { padding: 2em 24px; }
.order_list .row_item { padding: .8em 1.2em; border-bottom: 1px solid rgba(63,86,63,.1); display: grid; grid-template-columns: 80px repeat(6,1fr) 25px; grid-gap: 0 .7em; align-items: center; transition: background .35s ease; }
.order_list .row_item:hover { background: rgba(248,244,236,.52); }
.order_list .row_item * { font-size: 15px; color: rgba(37,48,42,.72); }
.order_list .row_item i { font-family: FontAwesome; color: rgba(37,48,42,.6); }
.order_list .row_item.title { padding: .9em 1.2em; background: rgba(248,244,236,.72); }
.order_list .row_item.title * { font-size: 13px; color: var(--coffee); font-weight: 700; letter-spacing: .05em; }
.order_list .row_item.list .img a { padding: .2em; border: 1px solid rgba(63,86,63,.12); width: 70px; aspect-ratio: 1/1; display: block; border-radius: 18px; overflow: hidden; background: var(--white); }
.order_list .row_item.add_item .item.name a { display: flex; flex-direction: column; align-items: flex-start; color: var(--primary); }
.order_list .row_item.add_item .item.name .add_txt { padding: .35em .65em; background: var(--green); border-radius: 999px; line-height: 1em; font-size: .78em; color: var(--white); }
.q_control { overflow: hidden; border: 1px solid rgba(63,86,63,.16); border-radius: 999px; background: var(--white); display: inline-flex; align-items: stretch; box-shadow: inset 0 0 0 1px rgba(255,255,255,.62); }
.q_control button { position: relative; width: 2.2em; cursor: pointer; transition: background .35s ease; }
.q_control button:hover { background: rgba(248,244,236,.9); }
.q_control button:before { position: absolute; width: 30%; height: 1px; background: var(--primary); display: block; top: 50%; left: 50%; transform: translate(-50%,-50%); content: ""; }
.q_control button.plus:after { position: absolute; width: 30%; height: 1px; background: var(--primary); display: block; top: 50%; left: 50%; transform: translate(-50%,-50%) rotate(90deg); content: ""; }
.q_control input { padding: .45em 0; width: 3em; border: 0; border-radius: 0; text-align: center; color: var(--info); background: transparent; }
.form_box .sex_box input[type="radio"] { outline: none; box-shadow: none; appearance: auto; -webkit-appearance: radio; accent-color: var(--primary); }
.form_box .sex_box input[type="radio"]:focus,.form_box .sex_box input[type="radio"]:active,.form_box .sex_box input[type="radio"]:focus-visible { outline: none; box-shadow: none; background: transparent; }
.form_box .sex_box label { outline: none; background: transparent; }
.form_box .sex_box label:focus,.form_box .sex_box label:active,.form_box .sex_box label:focus-visible { outline: none; box-shadow: none; background: transparent; }
#order .other_box { margin-top: 2em; padding: 0 2em; }
#order .other_box > * { margin-left: auto; width: 22em; }
#order .other_box p { margin-bottom: .7em; display: flex; justify-content: flex-end; align-items: center; gap: .3em 1em; }
#order .other_box p label { min-width: 5em; color: var(--coffee); font-weight: 700; letter-spacing: .06em; }
#order .other_box p font { width: 1%; flex: 1 1 auto; font-size: .95em; color: rgba(37,48,42,.68); }
#order .other_box p font input { padding: .55em .8em; font-size: 1em; border-radius: 14px; border: 1px solid rgba(63,86,63,.14); background: rgba(255,255,255,.9); }
#order .other_box p.point_txt font,#order .other_box p.tt font { color: rgba(37,48,42,.58); font-size: 13px; text-align: left; }
#order .other_box p.tt { background-color: rgba(248,244,236,.72); border-radius: 18px; margin-top: 20px; padding: .8em; }
#order .btns { padding: 2em; display: flex; justify-content: center; align-items: center; }
#order .btns .btn { margin: 0 .5em; padding: .72em 1em; width: 10em; border-radius: 999px; text-align: center; font-size: 14px; color: var(--primary); background: rgba(248,244,236,.86); border: 1px solid rgba(63,86,63,.14); transition: all .35s cubic-bezier(.22,1,.36,1); }
#order .btns .btn:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(31,41,36,.1); }
#order .btns #btnClean { background: var(--primary); border-color: var(--primary); color: var(--white); font-size: 15px; box-shadow: 0 16px 34px rgba(63,86,63,.2); }
.order_bottom_txt { position: absolute; width: 100%; bottom: 0; left: 0; opacity: 0; z-index: 998; }
.order_bottom_txt .workframe_s { padding: 1em 0; display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center; margin: 0 auto; }
.order_bottom_txt.fixed { position: fixed; background: rgba(255,255,255,.94); backdrop-filter: blur(14px); border-top: 1px solid rgba(63,86,63,.12); box-shadow: 0 -14px 36px rgba(31,41,36,.08); opacity: 1; }
.order_bottom_txt.absolute-bt { opacity: 1; }
.order_bottom_txt.absolute-bt .workframe_s { padding-bottom: 2em; }
.order_bottom_txt .item_row { width: 45%; }
.order_bottom_txt .total_box,.order_bottom_txt p { display: flex; align-items: center; flex-wrap: wrap; }
.order_bottom_txt .total_box label { min-width: 6em; color: var(--coffee); font-weight: 700; }
.order_bottom_txt .total_box #totaltxt { margin-left: .5em; min-width: 6em; font-weight: 800; font-size: 1.35em; color: var(--primary); font-family: var(--font-sans); }
.order_bottom_txt .send { display: flex; justify-content: flex-end; align-items: center; }
.order_bottom_txt .send #btnOK { padding: .72em 1em; width: min(20em,100%); border-radius: 999px; text-align: center; background: var(--primary); color: var(--white); font-size: 15px; font-weight: 800; letter-spacing: .08em; box-shadow: 0 16px 34px rgba(63,86,63,.2); transition: all .35s cubic-bezier(.22,1,.36,1); }
.order_bottom_txt .send #btnOK:hover { background: var(--third); transform: translateY(-3px); }
#bot_note { position: relative; width: 1%; display: flex; flex-wrap: wrap; align-items: center; gap: .2em; flex: 1 1 auto; line-height: 1; color: rgba(37,48,42,.7); font-family: var(--font-sans); }
#bot_note span { line-height: 1.2; font-size: .9em; color: rgba(37,48,42,.7); font-family: var(--font-sans); }
#bot_note #opendis { margin: 0 .2em; line-height: 1; font-size: .9em; color: var(--red); cursor: pointer; }
#bot_note #opendis * { font-size: 1em; color: currentColor; }
#bot_note b { position: absolute; min-width: 7em; background: var(--white); border: 1px solid rgba(63,86,63,.14); border-radius: 16px; box-shadow: 0 18px 44px rgba(31,41,36,.12); right: 0; bottom: 120%; opacity: 0; }
#bot_note b span { overflow: hidden; height: 0; display: block; font-weight: 400; font-size: .9em; }
#bot_note b[data-type="2"] { padding: 8px 12px; opacity: 1; }
#bot_note b[data-type="2"]:before,#bot_note b[data-type="2"]:after { position: absolute; width: 0; height: 0; border-style: solid; border-width: 10px 8px 0 8px; border-color: rgba(63,86,63,.14) transparent transparent transparent; display: inline-block; bottom: -10px; left: 20px; content: ""; }
#bot_note b[data-type="2"]:after { border-width: 10px 8px 0 8px; border-top-color: var(--white); bottom: -9px; }
#bot_note b[data-type="2"] span { margin: .25em 0; height: 1.1em; }


@media screen and (min-width:981px) {
  .form_box { grid-template-columns: repeat(2,1fr); }
  .form_box .large_item,.form_box span.words { grid-column: 1/3; }
  .order_list .row_item .item { text-align: center; }
  .order_list .row_item .item.img_name { grid-column: 1/4; text-align: left; }
  .order_list .row_item.list .item.name { grid-column: 2/4; text-align: left; }
  .order_list .row_item.add_item .item.name { grid-column: 2/5; }
  .order_list .row_item.add_item .item.price { grid-column-start: 7; }
  #order .btns { justify-content: flex-end; }
  #order .btns #btnClean { margin-right: 0; }
}
@media screen and (max-width:980px) and (min-width:641px) {
  .contact_information { display: grid; grid-template-columns: repeat(2,1fr); grid-gap: 1.5em 1em; align-items: center; border-radius: 38px 90px 90px 38px; }
  .contact_information .title { grid-column: 1/3; }
}
@media screen and (max-width:980px) {
  #contact_page {border-radius: 38px;gap: 30px;}
  .contact_information { width: 100%; border-radius: 38px 38px 90px 38px; }
  .order_bottom_txt .item_row { width: 100%; justify-content: flex-start; }
  .order_list .row_item.title,.order_list .row_item.list .price { display: none; }
  .order_list .row_item.list {
    position:relative;padding:.75em;grid-template-columns:80px 1fr 150px;grid-template-areas:"img name quantity"
			"img format quantity"
			"img amount quantity";grid-gap:0 .5em;align-items:end;
  }
  .order_list .row_item.list .img { grid-area: img; }
  .order_list .row_item.list .name { grid-area: name; }
  .order_list .row_item.list .format { grid-area: format; line-height: 1.4; font-size: .82em; color: rgba(37,48,42,.58); }
  .order_list .row_item.list .format:before { content: attr(data-tit) ":"; }
  .order_list .row_item.list .quantity { grid-area: quantity; display: flex; justify-content: flex-end; }
  .order_list .row_item.list .amount { grid-area: amount; font-weight: 800; color: var(--primary); }
  .order_list .row_item.list .operate { position: absolute; top: .5em; right: .5em; }
}
@media screen and (max-width:640px) {
	#gotop { bottom: 20%; }
	#Cgmap iframe { height: 300px; }
	#contact_page { border-radius: 30px; padding: 30px; }
	.contact_information { padding: 2em 1.6em; border-radius: 30px 30px 70px 30px; }
	.contact_information a { margin-bottom: 1em; padding: .4em 0; }
    .form_box {padding: 0;}
	.form_box .address_box { grid-template-columns: repeat(2,1fr); grid-template-areas: "city area" "inp inp"; }
	.form_box .address_box .address_inp { grid-area: inp; }
	.form_box .send_box { justify-content: stretch; }
	.form_box .send_btn { width: 100%; }
	#member_page { padding: 2em 1.4em; border-radius: 30px; }
	#member_page .login_btns { grid-gap: .6em; }
	.order_box { border-radius: 28px; }
	.order_box h5 { padding: 12px 14px; }
	.order_box > .form_box { padding: 2em 10px; }
	.order_box > div { padding: 1.5em 0; }
	.order_bottom_txt .item_row { margin-bottom: 5px; }
	.order_bottom_txt .item_row.send { display: block; }
	.order_bottom_txt .send #btnOK { width: 100%; padding: .75em 0; }
	.order_bottom_txt p { width: 100%; }
	#order .btns { margin: 2em 0; padding: 1.4em .5em; justify-content: flex-end; }
	#order .other_box { padding: 0 .5em; }
	#order .other_box > * { width: 100%; }
	.order_list .row_item.list { grid-template-columns: 80px 1fr 70px; }
	.q_control input { width: 2em; }
	.q_control button { width: 1.5em; }
}
@media screen and (min-width:551px) {
  .form_box .flex_style label { margin-right: 4em; padding: .5em 0; width: 6em; text-align: justify; text-align-last: justify; }
  .form_box .flex_style > input,.form_box .flex_style > font { width: 1%; flex: 1 1 auto; }
}